/* Hero-only refinements. Loaded after style.css so the rest of the website is unchanged. */
.hero-home {
  position: relative;
  min-height: min(860px, 100svh);
  min-height: min(860px, 100dvh);
  overflow: hidden;
  isolation: isolate;
  background-size: cover !important;
  background-position: 55% center !important;
}
.hero-home::before {
  z-index: 0 !important;
  background:
    linear-gradient(90deg, rgba(28, 17, 23, .78) 0%, rgba(28, 17, 23, .51) 35%, rgba(28, 17, 23, .10) 74%),
    linear-gradient(0deg, rgba(24, 15, 20, .52) 0%, rgba(24, 15, 20, 0) 53%) !important;
}
.hero-home .hero-shade { z-index: 0; pointer-events: none; background: linear-gradient(115deg, rgba(44, 27, 34, .12), transparent 60%); }
.hero-home .hero-inner { z-index: 2; width: 100%; padding-block: clamp(90px, 12vh, 140px) clamp(100px, 12vh, 140px); }
.hero-home .hero-inner .eyebrow { gap: 10px; margin-bottom: 23px; font-size: 9px; letter-spacing: .19em; }
.hero-home .hero-inner h1 { max-width: 690px; margin-bottom: 18px; font-size: clamp(60px, 7.6vw, 104px); line-height: .96; letter-spacing: -.045em; text-wrap: balance; }
.hero-home .hero-inner h1 em { color: #efd2b5; }
.hero-home .hero-copy { max-width: 370px; margin: 0 0 27px; color: rgba(255, 250, 244, .9); font-size: 13px; line-height: 1.75; }
.hero-home .hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.hero-home .hero-actions .button { min-height: 46px; padding: 0 17px; gap: 12px; font-size: 9px; letter-spacing: .08em; }
.hero-home .hero-wholesale-cta { color: #fffaf4; border: 1px solid rgba(255, 250, 244, .7); background: rgba(47, 30, 37, .24); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03); }
.hero-home .hero-wholesale-cta:hover { color: #fffaf4; background: rgba(255, 250, 244, .13); border-color: #fffaf4; transform: translateY(-1px); }
.hero-product-feature {
  position: absolute;
  z-index: 3;
  right: clamp(24px, 5.2vw, 82px);
  bottom: clamp(26px, 5vh, 58px);
  display: grid;
  width: clamp(132px, 14vw, 174px);
  padding: 7px;
  border: 1px solid rgba(255, 250, 244, .68);
  border-radius: 100px 100px 8px 8px;
  color: #33212a;
  background: rgba(250, 244, 235, .94);
  box-shadow: 0 20px 60px rgba(15, 9, 12, .28);
  text-decoration: none;
  transform: rotate(2deg);
  transition: transform .25s ease, box-shadow .25s ease;
}
.hero-product-feature:hover { color: #33212a; transform: translateY(-4px) rotate(0deg); box-shadow: 0 24px 64px rgba(15, 9, 12, .34); }
.hero-product-feature img { display: block; width: 100%; height: clamp(150px, 19vw, 218px); border-radius: 94px 94px 4px 4px; object-fit: cover; object-position: 51% 50%; background: #e8ddce; }
.hero-product-caption { display: grid; gap: 5px; padding: 10px 7px 8px; }
.hero-product-caption small { font-size: 7px; font-weight: 700; letter-spacing: .12em; }
.hero-product-caption strong { display: flex; justify-content: space-between; align-items: center; font-family: var(--serif); font-size: 15px; font-weight: 600; }
.hero-product-caption strong i { font-family: "Font Awesome 6 Free"; font-size: 9px; }
@media (max-width: 760px) {
  .hero-home {
    height: 100vh;
    min-height: 100vh;
    height: 100svh;
    min-height: 100svh;
    height: 100dvh;
    min-height: 100dvh;
    display: flex;
    align-items: flex-end;
    background-position: 48% center !important;
    background-size: cover !important;
  }
  .hero-home::before {
    background:
      linear-gradient(180deg, rgba(26, 16, 22, .16) 0%, rgba(26, 16, 22, .02) 28%, rgba(26, 16, 22, .22) 48%, rgba(26, 16, 22, .90) 100%),
      linear-gradient(90deg, rgba(26, 16, 22, .28) 0%, rgba(26, 16, 22, .07) 72%, rgba(26, 16, 22, .02) 100%) !important;
  }
  .hero-home .hero-inner {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 104px calc(30px + env(safe-area-inset-bottom)) 20px;
  }
  .hero-home .hero-inner .eyebrow { margin-bottom: 14px; font-size: 7px; line-height: 1.5; letter-spacing: .14em; }
  .hero-home .hero-inner h1 { max-width: 100%; margin-bottom: 12px; font-size: clamp(35px, 9.7vw, 48px); line-height: .98; letter-spacing: -.05em; }
  .hero-home .hero-copy { max-width: 225px; margin-bottom: 17px; font-size: 10px; line-height: 1.6; }
  .hero-home .hero-actions { display: flex; flex-direction: row; flex-wrap: nowrap; width: calc(100vw - 140px); max-width: 252px; gap: 7px; align-items: stretch; }
  .hero-home .hero-actions .button { flex: 1 1 0; min-width: 0; min-height: 40px; padding: 0 8px; justify-content: center; gap: 6px; font-size: 7px; letter-spacing: .04em; white-space: nowrap; }
  .hero-home .hero-actions .button i { font-size: 8px; }
  .hero-product-feature { right: 13px; bottom: calc(25px + env(safe-area-inset-bottom)); width: 82px; padding: 4px; border-radius: 54px 54px 6px 6px; transform: rotate(2deg); }
  .hero-product-feature:hover { transform: rotate(0deg); }
  .hero-product-feature img { height: 103px; border-radius: 50px 50px 3px 3px; object-position: 51% 48%; }
  .hero-product-caption { gap: 3px; padding: 7px 4px 5px; }
  .hero-product-caption small { font-size: 5px; letter-spacing: .07em; }
  .hero-product-caption strong { font-size: 10px; }
  .hero-product-caption strong i { font-size: 7px; }
}
@media (max-width: 360px) {
  .hero-home .hero-inner { padding-left: 15px; padding-right: 96px; padding-bottom: calc(25px + env(safe-area-inset-bottom)); }
  .hero-home .hero-inner h1 { font-size: 34px; }
  .hero-home .hero-actions { width: calc(100vw - 125px); gap: 5px; }
  .hero-home .hero-actions .button { padding-inline: 5px; font-size: 8.5px; }
  .hero-product-feature { right: 9px; width: 78px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-product-feature, .hero-wholesale-cta { transition: none !important; }
}

/* Give the desktop hero a generous editorial gutter without changing its composition. */
@media (min-width: 761px) {
  .hero-home .hero-inner.page-shell {
    width: min(1440px, calc(100% - clamp(64px, 10vw, 176px))) !important;
    max-width: 1440px;
    margin-inline: auto;
    padding-inline: 0;
  }
  .hero-home .hero-inner h1 { max-width: 690px; }
  .hero-product-feature { right: clamp(36px, 6.2vw, 100px); }
}

@media (max-width: 760px) {
  .hero-home .hero-inner { padding-left: 22px; padding-right: 112px; }
  .hero-home .hero-inner .eyebrow { font-size: 9px !important; }
  .hero-home .hero-copy { font-size: 12px; }
  .hero-home .hero-actions .button { font-size: 10px; }
  .hero-product-feature { width: 88px; }
  .hero-product-feature img { height: 108px; }
  .hero-product-caption { padding-inline: 5px; }
  .hero-product-caption small { font-size: 7px; }
  .hero-product-caption strong { font-size: 12px; }
}
@media (max-width: 380px) {
  .hero-home .hero-inner { padding-left: 15px; padding-right: 101px; }
  .hero-product-feature { right: 8px; width: 82px; }
}
@media (max-width: 380px) {
  .hero-home .hero-copy { font-size: 11px; }
  .hero-home .hero-actions .button { font-size: 8.5px; }
  .hero-product-caption small { font-size: 7px; }
  .hero-product-caption strong { font-size: 11px; }
}