/* W1 homepage hero: a replaceable, product-first opening for the flagship shoe. */
.home-v2 .home-hero{background:linear-gradient(110deg,#fffdfe 0%,#fff8fb 56%,#f7d7e2 100%)}
.home-v2 .home-hero .hero-grid{grid-template-columns:minmax(0,.92fr) minmax(320px,1.08fr);gap:clamp(1.5rem,4vw,4rem);min-height:0;padding:clamp(1.25rem,3.5vw,3rem) 0}
.home-v2 .home-hero .hero-copy{grid-column:auto;align-self:center;max-width:610px}
.home-v2 .home-hero h1{margin:0 0 .75rem;max-width:11ch;color:#24171d;font-size:clamp(2.5rem,4.6vw,4.4rem);line-height:.95;letter-spacing:-.05em}
.home-v2 .home-hero .lede{max-width:31rem;color:#59474f;font-size:clamp(.98rem,1.4vw,1.1rem);line-height:1.45;margin-bottom:.5rem}
.hero-price{margin:.6rem 0 0;color:#24171d;font:600 clamp(1.2rem,1.8vw,1.45rem)/1 var(--serif)}
.home-v2 .hero-actions{justify-content:flex-start;margin:1rem 0 .9rem}
.home-v2 .hero-actions .primary{white-space:nowrap}
.hero-trust{display:flex;flex-wrap:wrap;gap:.6rem .8rem;color:#59474f;font-size:.78rem}
.hero-trust span{padding:.52rem .72rem;border:1px solid #d0bcc6;border-radius:999px;background:#fffafdcf}
.hero-product-visual{position:relative;grid-column:auto;align-self:center;justify-self:end;width:100%;max-width:400px;margin:0;padding:clamp(.5rem,1.2vw,1rem);border:1px solid #e5c5d2;border-radius:clamp(1.25rem,2.5vw,2rem);background:#f7d7e2;box-shadow:0 28px 70px #80425b26}
.hero-product-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:center;border-radius:clamp(1rem,2vw,1.75rem);mix-blend-mode:multiply}
.hero-product-visual figcaption{display:flex;justify-content:space-between;gap:1rem;padding:.85rem .25rem .15rem;color:#24171d;font:600 1rem/1.2 var(--serif)}
.hero-product-visual figcaption span{color:#93405f;font:500 .74rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:850px){.home-v2 .home-hero .hero-grid{grid-template-columns:1fr;gap:2rem;padding:3.5rem 0 3rem}.home-v2 .home-hero .hero-copy{text-align:center;margin-inline:auto}.home-v2 .home-hero h1{font-size:clamp(3.4rem,11vw,5rem);margin-inline:auto}.home-v2 .home-hero .lede{margin-inline:auto}.home-v2 .hero-actions,.hero-trust{justify-content:center}.hero-product-visual{width:min(100%,560px);margin-inline:auto}}
@media(max-width:560px){.home-v2 .home-hero .hero-grid{gap:1.35rem;padding:2.15rem 0 2rem}.home-v2 .home-hero h1{font-size:clamp(2.7rem,13vw,4rem)}.home-v2 .home-hero .lede{font-size:1rem}.home-v2 .hero-actions{flex-direction:column;align-items:stretch;margin:1.25rem 0 1rem}.home-v2 .hero-actions .button{width:100%}.hero-trust{display:grid;grid-template-columns:1fr 1fr;font-size:.72rem}.hero-trust span{text-align:center}.hero-trust span:last-child{grid-column:1/-1}.hero-product-visual figcaption{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.hero-product-visual,.hero-product-image{transition:none!important}}

/* Reviews strip */
.reviews-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.5vw,1.75rem)}
.review-tile{display:flex;flex-direction:column;overflow:hidden}
.review-photo-wrap{aspect-ratio:1;overflow:hidden}
.review-photo-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.review-body{padding:1.5rem}
.review-stars{display:block;margin-bottom:.6rem;color:var(--rose);letter-spacing:.12em;font-size:.95rem}
.review-body p{margin:0 0 .8rem;font-size:.95rem;line-height:1.5}
@media(max-width:850px){.reviews-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.reviews-grid{grid-template-columns:1fr}}

/* Refer-a-friend */
.referral-card{display:flex;align-items:center;justify-content:space-between;gap:clamp(1.5rem,4vw,3.5rem);padding:clamp(1.75rem,4vw,3.25rem);border-radius:32px;background:linear-gradient(135deg,#ff4f9a1f,#9f4ee91f),var(--surface-2);border:1px solid var(--line)}
.referral-copy{max-width:580px}
.referral-copy h2{margin:.3rem 0 .9rem}
.referral-code{display:inline-flex;align-items:center;gap:.7rem;margin:1.1rem 0 .7rem;padding:.5rem .5rem .5rem 1.2rem;border-radius:99px;border:1px dashed var(--rose);background:var(--surface-3)}
.referral-code span{font:700 1.05rem/1 var(--serif);letter-spacing:.1em;color:var(--text)}
.referral-code button{border:0;border-radius:99px;padding:.55rem 1.1rem;background:linear-gradient(135deg,#ff65a7,#e03791 52%,#9f4ee9);color:#fff;font-weight:700;font-size:.85rem;cursor:pointer;white-space:nowrap}
.referral-art{flex:0 0 auto;display:grid;place-items:center;gap:.15rem;width:172px;height:172px;border-radius:50%;background:radial-gradient(circle,#ff4f9a26,transparent 72%);text-align:center}
.referral-art span{font:700 2.1rem/1 var(--serif);color:var(--rose)}
.referral-art svg{width:44px;height:44px;fill:none;stroke:var(--rose);stroke-width:2;margin:.2rem 0}
.referral-art small{font-size:.7rem;color:var(--muted)}
@media(max-width:850px){.referral-card{flex-direction:column;text-align:center}.referral-copy{max-width:none}.referral-code{margin-inline:auto}}

/* First screen = the hero, nothing else. Content height left "What is Onyx Bunny?" peeking in
   at the bottom on a 1080p laptop. min-height (not height) means taller content still wins,
   and svh keeps mobile browser chrome from causing a jump on scroll. The subtracted value is
   the announcement bar plus the sticky header. */
@media (min-width: 851px) {
  .home-v2 .home-hero .hero-grid { min-height: calc(100vh - 7.5rem); }
  .home-v2 .home-hero .hero-grid { min-height: calc(100svh - 7.5rem); }
}