/* ---- variables.css ---- */
/* ==========================================================================
   ACE — DESIGN TOKENS
   Dark luxury system. Two collections, one signature: the Aurora Line —
   a thin electric-blue -> royal-purple gradient stroke used as underline,
   divider, focus ring and hover trace throughout the site.
   ========================================================================== */
:root{
  --black:        #0D0D0D;
  --charcoal:     #181818;
  --gunmetal:     #232323;
  --gunmetal-2:   #2B2B2E;
  --hairline:     rgba(255,255,255,0.08);
  --hairline-strong: rgba(255,255,255,0.14);

  --electric-blue:      #C9A227;
  --electric-blue-soft: #F0D890;
  --royal-purple:       #8A6A1F;
  --royal-purple-soft:  #E3C468;
  --silver:             #D9CFB8;
  --white:              #F7F7F8;

  --aurora: linear-gradient(90deg, #B8860B 0%, #E9C766 45%, #FFE9A8 60%, #B8860B 100%);
  --aurora-soft: linear-gradient(90deg, rgba(201,162,39,0.35) 0%, rgba(138,106,31,0.35) 100%);
  --aurora-glow: 0 0 24px rgba(201,162,39,0.35), 0 0 48px rgba(138,106,31,0.18);

  --text-primary:   var(--white);
  --text-secondary: #B7B9BF;
  --text-muted:     #85878E;
  --text-inverse:   var(--black);

  --r-sm: 6px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 32px;
  --r-pill: 999px;

  --shadow-sm: 0 2px 10px rgba(0,0,0,0.35);
  --shadow-md: 0 10px 30px rgba(0,0,0,0.45);
  --shadow-lg: 0 24px 60px rgba(0,0,0,0.55);

  --sp-3xs: 4px;
  --sp-2xs: 8px;
  --sp-xs:  12px;
  --sp-sm:  16px;
  --sp-md:  24px;
  --sp-lg:  40px;
  --sp-xl:  64px;
  --sp-2xl: 96px;
  --sp-3xl: 140px;

  --font-display: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-body: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-h1: clamp(2.75rem, 5.5vw, 5.5rem);
  --fs-h2: clamp(2.1rem, 3.6vw, 3.4rem);
  --fs-h3: clamp(1.5rem, 2.4vw, 2.1rem);
  --fs-h4: clamp(1.15rem, 1.4vw, 1.4rem);
  --fs-body-lg: 1.15rem;
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;

  --container: 1320px;
  --container-narrow: 880px;
  --header-h: 88px;
  --header-h-scrolled: 72px;

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --dur-fast: 200ms;
  --dur-med: 420ms;
  --dur-slow: 800ms;

  --z-header: 500;
  --z-overlay: 900;
  --z-modal: 950;
  --z-age-gate: 999;
}


/* ---- reset.css ---- */
/* ===== RESET ===== */
*,*::before,*::after{ box-sizing: border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}
body{ min-height:100vh; background:var(--black); color:var(--text-primary); font-family:var(--font-body); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img,picture,video,canvas,svg{ display:block; max-width:100%; height:auto; }
input,button,textarea,select{ font:inherit; color:inherit; }
button{ background:none; border:none; cursor:pointer; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
table{ border-collapse:collapse; }
:focus-visible{ outline:2px solid var(--electric-blue-soft); outline-offset:3px; border-radius:4px; }
.visually-hidden{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
::selection{ background:var(--royal-purple); color:var(--white); }


/* ---- typography.css ---- */
/* ===== TYPOGRAPHY ===== */
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:500; line-height:1.08; letter-spacing:0.005em; color:var(--text-primary); }
h1{ font-size:var(--fs-h1); font-weight:500; }
h2{ font-size:var(--fs-h2); }
h3{ font-size:var(--fs-h3); }
h4{ font-size:var(--fs-h4); font-family:var(--font-body); font-weight:700; text-transform:uppercase; letter-spacing:0.08em; }
p{ font-size:var(--fs-body); color:var(--text-secondary); }
.lede{ font-size:var(--fs-body-lg); color:var(--text-secondary); line-height:1.7; }

.eyebrow{
  display:inline-flex; align-items:center; gap:var(--sp-2xs);
  font-family:var(--font-body); font-size:var(--fs-xs); font-weight:700;
  text-transform:uppercase; letter-spacing:0.22em; color:var(--electric-blue-soft);
}
.eyebrow::before{
  content:""; width:26px; height:2px; background:var(--aurora); display:inline-block; border-radius:2px;
}

.section-title{ margin-bottom:var(--sp-sm); }
.section-kicker{ margin-bottom:var(--sp-xs); }
.section-sub{ max-width:640px; color:var(--text-secondary); font-size:var(--fs-body-lg); }

.aurora-underline{ position:relative; display:inline-block; }
.aurora-underline::after{
  content:""; position:absolute; left:0; right:0; bottom:-10px; height:4px;
  background:var(--aurora); border-radius:3px; box-shadow:0 2px 8px rgba(201,162,39,0.35);
  transform-origin:left; transform:scaleX(0); transition:transform var(--dur-slow) var(--ease-out);
}
.in-view .aurora-underline::after,
.aurora-underline.is-visible::after{ transform:scaleX(1); }

.text-gradient{
  font-weight:800;
  background:var(--aurora); -webkit-background-clip:text; background-clip:text; color:transparent;
  -webkit-text-stroke:1px rgba(184,134,11,0.55);
  text-shadow:0 2px 0 rgba(60,40,4,0.45);
}

@media (max-width:720px){
  h1{ letter-spacing:0; }
}


/* ---- layout.css ---- */
/* ===== LAYOUT ===== */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--sp-md); }
.container-narrow{ width:100%; max-width:var(--container-narrow); margin-inline:auto; padding-inline:var(--sp-md); }

.section{ padding-block:var(--sp-3xl); position:relative; }
.section-tight{ padding-block:var(--sp-2xl); }
.section-header{ display:flex; flex-direction:column; gap:var(--sp-xs); margin-bottom:var(--sp-xl); }
.section-header.center{ align-items:center; text-align:center; margin-inline:auto; }
.section-header-row{ display:flex; justify-content:space-between; align-items:flex-end; gap:var(--sp-md); margin-bottom:var(--sp-xl); flex-wrap:wrap; }

.grid{ display:grid; gap:var(--sp-md); }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
.grid-collection{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-md); }

.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-md); }
@media (max-width:767px){
  .stats-grid{
    grid-template-columns:repeat(2,1fr);
    gap:0;
    border-top:1px solid var(--hairline);
    border-left:1px solid var(--hairline);
  }
  .stats-grid > *{
    padding-block:var(--sp-md);
    border-bottom:1px solid var(--hairline);
    border-right:1px solid var(--hairline);
    text-align:center;
  }
}
@media (max-width:420px){
  .stats-grid .stat-card__number{ font-size:clamp(1.6rem,7vw,2.2rem); }
}

.split{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2xl); align-items:center; }

.divider{ height:1px; width:100%; background:var(--hairline); border:0; }
.divider-glow{ height:3px; width:100%; background:var(--aurora-soft); border:0; border-radius:2px; }

.bg-charcoal{ background:var(--charcoal); }
.bg-gunmetal{ background:var(--gunmetal); }

.media-frame{
  position:relative; border-radius:var(--r-lg); overflow:hidden; background:var(--gunmetal);
  aspect-ratio: 4/5;
}
.media-frame img{ width:100%; height:100%; object-fit:cover; }
.media-frame.wide{ aspect-ratio:16/9; }
.media-frame.square{ aspect-ratio:1/1; }
.media-frame.landscape{ aspect-ratio:3/2; }

.skip-link{
  position:fixed; top:-100px; left:var(--sp-md); z-index:1000;
  background:var(--white); color:var(--black); padding:12px 20px; border-radius:var(--r-sm);
  font-weight:700; transition:top var(--dur-fast) var(--ease-out);
}
.skip-link:focus{ top:var(--sp-md); }

@media (max-width:980px){
  .grid-4{ grid-template-columns:repeat(2,1fr); }
  .grid-3{ grid-template-columns:repeat(2,1fr); }
  .split{ grid-template-columns:1fr; gap:var(--sp-lg); }
}
@media (max-width:640px){
  .grid-2,.grid-3{ grid-template-columns:1fr; }
  .grid-4{ grid-template-columns:repeat(2,1fr); gap:var(--sp-sm); }
  .grid-collection{ grid-template-columns:repeat(2,1fr) !important; gap:var(--sp-sm) !important; }
  .section{ padding-block:var(--sp-2xl); }
}

/* ---- Compact product cards on phones ----
   Runs from 767px down (every phone, not just <400px) so the footer
   buttons never get squeezed into a row too narrow to fit — that was
   what clipped the "Details" button out of view. ---- */
@media (max-width:767px){
  .grid-collection,
  .grid-4{ gap:10px; }

  .grid-collection .product-card__media,
  .grid-4 .product-card__media{ aspect-ratio:1/1; }

  .grid-collection .product-card__body,
  .grid-4 .product-card__body{ padding:12px 12px 4px; gap:3px; }

  .grid-collection .product-card__collection,
  .grid-4 .product-card__collection{ font-size:10px; }

  .grid-collection .product-card__title,
  .grid-4 .product-card__title{ font-size:0.92rem; line-height:1.25; }

  .grid-collection .product-card__flavor,
  .grid-4 .product-card__flavor{ display:none; }

  .grid-collection .product-card__meta,
  .grid-4 .product-card__meta{ padding-top:6px; }

  .grid-collection .product-card__price,
  .grid-4 .product-card__price{ font-size:1rem; }

  .grid-collection .product-card__min,
  .grid-4 .product-card__min{ padding:0 12px 6px; }

  .grid-collection .product-card__footer,
  .grid-4 .product-card__footer{
    padding:0 12px 12px; display:flex; flex-direction:column; gap:6px;
  }
  .grid-collection .product-card__footer .btn,
  .grid-4 .product-card__footer .btn{
    width:100%; padding:9px 10px; font-size:11px; white-space:nowrap;
  }
}


/* ---- header.css ---- */
/* ===== ANNOUNCEMENT BAR ===== */
.announce-bar{
  background:var(--black); border-bottom:1px solid var(--hairline); height:38px;
  display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative;
}
.announce-bar__track{ position:relative; width:100%; height:100%; }
.announce-bar__item{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:8px;
  font-size:var(--fs-xs); letter-spacing:0.08em; text-transform:uppercase; color:var(--silver); font-weight:600;
  opacity:0; transition:opacity var(--dur-med) var(--ease-in-out);
}
.announce-bar__item.is-active{ opacity:1; }
.announce-bar__item::before{ content:"✦"; color:var(--electric-blue-soft); }

/* ===== HEADER ===== */
.site-header{
  position:fixed; top:38px; left:0; right:0; z-index:var(--z-header);
  height:var(--header-h); display:flex; align-items:center;
  background:transparent; border-bottom:1px solid transparent;
  transition:all var(--dur-med) var(--ease-out);
}
.site-header.is-scrolled{
  top:0; height:var(--header-h-scrolled);
  background:rgba(13,13,13,0.72); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--hairline); box-shadow:var(--shadow-sm);
}
.site-header__inner{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--sp-md); display:flex; align-items:center; justify-content:space-between; gap:var(--sp-md); }

.logo{ display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:1.5rem; font-weight:600; letter-spacing:0.02em; color:var(--white); }
.logo__img{ display:block; width:auto; }
.logo__img--header{ height:84px; max-height:80%; transition:height var(--dur-med) var(--ease-out); }
.site-header.is-scrolled .logo__img--header{ height:60px; }
.logo__img--footer{ height:90px; }
.logo__img--gate{ height:120px; margin-inline:auto; }
@media (max-width:640px){
  .logo__img--header{ height:68px; }
  .site-header.is-scrolled .logo__img--header{ height:52px; }
}
.logo__mark{ width:34px; height:34px; border-radius:8px; background:var(--aurora); display:flex; align-items:center; justify-content:center; font-family:var(--font-body); font-weight:800; font-size:0.85rem; color:var(--black); box-shadow:inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -2px 0 rgba(60,40,4,0.3); }
.logo__premium{ font-family:var(--font-body); font-size:0.5rem; font-weight:800; letter-spacing:0.18em; color:var(--electric-blue-soft); align-self:flex-end; margin-left:2px; margin-bottom:5px; }

.main-nav{ display:flex; align-items:center; gap:var(--sp-lg); }
.main-nav__list{ display:flex; align-items:center; gap:var(--sp-md); }
.main-nav__link{
  position:relative; font-size:var(--fs-sm); font-weight:600; color:var(--text-secondary); padding:8px 2px;
  transition:color var(--dur-fast) var(--ease-out);
}
.main-nav__link::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:3px; border-radius:2px; background:var(--aurora);
  transform:scaleX(0); transform-origin:left; transition:transform var(--dur-med) var(--ease-out);
}
.main-nav__link:hover, .main-nav__link:focus-visible{ color:var(--white); }
.main-nav__link:hover::after, .main-nav__link.is-active::after{ transform:scaleX(1); }
.main-nav__link.is-active{ color:var(--white); }

.header-actions{ display:flex; align-items:center; gap:var(--sp-sm); }
.icon-btn{
  position:relative; width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; color:var(--white); transition:background var(--dur-fast) var(--ease-out);
}
.icon-btn:hover{ background:rgba(255,255,255,0.08); }
.icon-btn svg{ width:20px; height:20px; }
.cart-count{
  position:absolute; top:2px; right:2px; min-width:16px; height:16px; padding:0 4px; border-radius:50%;
  background:var(--aurora); color:var(--white); font-size:10px; font-weight:800; display:flex; align-items:center; justify-content:center;
}

.menu-toggle{ display:none; width:42px; height:42px; align-items:center; justify-content:center; color:var(--white); }
.menu-toggle svg{ width:24px; height:24px; }

/* Off-canvas mobile nav */
.mobile-nav-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:var(--z-overlay); opacity:0; pointer-events:none;
  transition:opacity var(--dur-med) var(--ease-out);
}
.mobile-nav-overlay.is-open{ opacity:1; pointer-events:auto; }
.mobile-nav{
  position:fixed; top:0; right:0; bottom:0; width:min(360px,86vw); z-index:calc(var(--z-overlay) + 1);
  background:var(--charcoal); border-left:1px solid var(--hairline-strong);
  transform:translateX(100%); transition:transform var(--dur-med) var(--ease-out);
  display:flex; flex-direction:column; padding:var(--sp-lg) var(--sp-md);
}
.mobile-nav.is-open{ transform:translateX(0); }
.mobile-nav__close{ align-self:flex-end; width:42px; height:42px; color:var(--white); }
.mobile-nav__list{ display:flex; flex-direction:column; gap:6px; margin-top:var(--sp-md); }
.mobile-nav__link{ padding:16px 6px; font-size:1.1rem; font-weight:600; border-bottom:1px solid var(--hairline); color:var(--text-secondary); }
.mobile-nav__link.is-active{ color:var(--white); }
.mobile-nav__cta{ margin-top:var(--sp-lg); }

@media (max-width:980px){
  .main-nav__list{ display:none; }
  .menu-toggle{ display:flex; }
  .header-actions .btn{ display:none; }
}


/* ---- footer.css ---- */
/* ===== FOOTER ===== */
.site-footer{ background:var(--charcoal); border-top:1px solid var(--hairline); padding-top:var(--sp-2xl); position:relative; overflow:hidden; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr; gap:var(--sp-lg); padding-bottom:var(--sp-xl); }
.footer-brand p{ margin-top:14px; max-width:280px; }
.footer-social{ display:flex; gap:10px; margin-top:20px; }
.footer-social a{ width:38px; height:38px; border-radius:50%; border:1px solid var(--hairline-strong); display:flex; align-items:center; justify-content:center; transition:border-color var(--dur-fast), background var(--dur-fast); }
.footer-social a:hover{ border-color:var(--electric-blue-soft); background:rgba(201,162,39,0.1); }
.footer-social svg{ width:16px; height:16px; }

.footer-col h4{ margin-bottom:18px; color:var(--white); }
.footer-col ul{ display:flex; flex-direction:column; gap:12px; }
.footer-col a{ font-size:var(--fs-sm); color:var(--text-secondary); transition:color var(--dur-fast); }
.footer-col a:hover{ color:var(--white); }

.footer-newsletter h4{ margin-bottom:10px; }
.footer-newsletter p{ font-size:var(--fs-sm); margin-bottom:16px; }

.footer-bottom{ border-top:1px solid var(--hairline); padding-block:var(--sp-md); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--sp-sm); }
.footer-bottom p{ font-size:var(--fs-xs); color:var(--text-muted); }
.footer-payments{ display:flex; gap:10px; align-items:center; }
.footer-payments span{ font-size:var(--fs-xs); padding:6px 10px; border:1px solid var(--hairline-strong); border-radius:6px; color:var(--text-muted); letter-spacing:0.04em; }
.footer-legal-links{ display:flex; gap:18px; flex-wrap:wrap; }
.footer-legal-links a{ font-size:var(--fs-xs); color:var(--text-muted); }
.footer-legal-links a:hover{ color:var(--white); }

.footer-age-note{ font-size:var(--fs-xs); color:var(--text-muted); text-align:center; padding-block:var(--sp-sm); border-top:1px solid var(--hairline); }

@media (max-width:980px){
  .footer-top{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .footer-top{ grid-template-columns:1fr; }
  .footer-bottom{ flex-direction:column; text-align:center; }
}


/* ---- cards.css ---- */
/* ===== CARDS ===== */
.card{
  background:linear-gradient(180deg, var(--gunmetal) 0%, var(--charcoal) 100%);
  border:1px solid var(--hairline); border-radius:var(--r-lg);
  transition:transform var(--dur-med) var(--ease-out), box-shadow var(--dur-med) var(--ease-out), border-color var(--dur-med) var(--ease-out);
}
.card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:var(--hairline-strong); }

.glass{
  background:rgba(24,24,24,0.55); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,0.08);
}

/* Product card */
.product-card{
  display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden;
  background:var(--charcoal); border:1px solid var(--hairline); position:relative;
  transition:transform var(--dur-med) var(--ease-out), box-shadow var(--dur-med) var(--ease-out), border-color var(--dur-med) var(--ease-out);
}
.product-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lg); border-color:rgba(138,106,31,0.4); }
.product-card__media{ position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--gunmetal); }
.product-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease-out); }
.product-card:hover .product-card__media img{ transform:scale(1.08); }
.product-card__badge{
  position:absolute; top:14px; left:14px; background:rgba(13,13,13,0.75); backdrop-filter:blur(6px);
  border:1px solid var(--hairline-strong); color:var(--white); font-size:var(--fs-xs); font-weight:700;
  letter-spacing:0.08em; text-transform:uppercase; padding:6px 12px; border-radius:var(--r-pill);
}
.product-card__badge.new{ background:var(--aurora); border-color:transparent; }
.product-card__actions{
  position:absolute; inset:auto 14px 14px 14px; display:flex; gap:8px;
  opacity:0; transform:translateY(10px); transition:all var(--dur-med) var(--ease-out);
}
.product-card:hover .product-card__actions{ opacity:1; transform:translateY(0); }
.product-card__body{ padding:22px; display:flex; flex-direction:column; gap:6px; flex:1; }
.product-card__collection{ font-size:var(--fs-xs); letter-spacing:0.12em; text-transform:uppercase; color:var(--electric-blue-soft); font-weight:700; }
.product-card__title{ font-family:var(--font-body); font-size:1.05rem; font-weight:700; color:var(--white); }
.product-card__flavor{ font-size:var(--fs-sm); color:var(--text-muted); margin-bottom:4px; }
.product-card__meta{ display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:14px; }
.product-card__price{ font-size:1.15rem; font-weight:800; color:var(--white); }
.product-card__stock{ font-size:var(--fs-xs); font-weight:700; letter-spacing:0.04em; }
.product-card__stock.in{ color:#5FD98A; }
.product-card__stock.low{ color:#F2B84B; }
.product-card__footer{ padding:0 22px 22px; display:flex; gap:10px; }
.product-card__min{ font-size:var(--fs-xs); color:var(--text-muted); padding:0 22px 10px; }

/* Collection card */
.collection-card{
  position:relative; display:flex; flex-direction:column; border-radius:var(--r-xl); overflow:hidden;
  background:var(--black); border:1px solid rgba(255,255,255,0.08); isolation:isolate;
  transition:transform var(--dur-med) var(--ease-out), border-color var(--dur-med) var(--ease-out);
}
.collection-card img{ display:block; width:100%; height:auto; }
.collection-card:hover{ transform:translateY(-6px); border-color:rgba(212,175,55,0.4); }
.collection-card__content{ display:flex; flex-direction:column; padding:var(--sp-lg); }
.collection-card__content p{ max-width:520px; margin-block:10px 18px; }

/* Feature / stat / testimonial / pricing cards */
.feature-card{ padding:36px 28px; text-align:left; }
.feature-card__icon{
  width:52px; height:52px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(201,162,39,0.18), rgba(138,106,31,0.18)); margin-bottom:20px;
  border:1px solid var(--hairline-strong);
}
.feature-card__icon svg{ width:24px; height:24px; stroke:var(--electric-blue-soft); }
.feature-card h3, .feature-card h4{ margin-bottom:10px; }

.stat-card{ text-align:center; padding:32px 20px; }
.stat-card__number{ font-family:var(--font-display); font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; background:var(--aurora); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:0.6px rgba(184,134,11,0.5); text-shadow:0 2px 0 rgba(60,40,4,0.4); }
.stat-card__label{ font-size:var(--fs-sm); color:var(--text-muted); text-transform:uppercase; letter-spacing:0.1em; margin-top:6px; }

.testimonial-card{ padding:32px; display:flex; flex-direction:column; gap:16px; }
.testimonial-card__stars{ color:var(--royal-purple-soft); letter-spacing:2px; }
.testimonial-card__quote{ font-family:var(--font-display); font-size:1.25rem; color:var(--text-primary); line-height:1.5; }
.testimonial-card__author{ display:flex; align-items:center; gap:12px; margin-top:auto; }
.testimonial-card__avatar{ width:42px; height:42px; border-radius:50%; background:var(--aurora); flex-shrink:0; }
.testimonial-card__name{ font-weight:700; font-size:var(--fs-sm); }
.testimonial-card__product{ font-size:var(--fs-xs); color:var(--text-muted); }

.badge{ display:inline-flex; align-items:center; padding:5px 12px; border-radius:var(--r-pill); font-size:var(--fs-xs); font-weight:700; letter-spacing:0.06em; text-transform:uppercase; }
.badge-outline{ border:1px solid var(--hairline-strong); color:var(--text-secondary); }
.badge-aurora{ background:var(--aurora); color:var(--white); font-weight:800; box-shadow:inset 0 1px 0 rgba(255,255,255,0.35), inset 0 -1px 0 rgba(60,40,4,0.3); }

.alert{ display:flex; gap:12px; align-items:flex-start; padding:16px 18px; border-radius:var(--r-md); border:1px solid var(--hairline-strong); background:var(--gunmetal); font-size:var(--fs-sm); color:var(--text-secondary); }
.alert[hidden]{ display:none; }
.alert-info{ border-color:rgba(201,162,39,0.35); }
.alert-success{ border-color:rgba(95,217,138,0.4); }
.alert-error{ border-color:rgba(224,90,90,0.5); color:#e05a5a; }

.pricing-card{ padding:40px 32px; text-align:center; border:1px solid var(--hairline-strong); }
.pricing-card__tier{ font-size:var(--fs-xs); letter-spacing:0.12em; text-transform:uppercase; color:var(--electric-blue-soft); font-weight:700; }
.pricing-card__value{ font-family:var(--font-display); font-size:2.6rem; margin-block:10px; }


/* ---- forms.css ---- */
/* ===== FORMS ===== */
.field{ display:flex; flex-direction:column; gap:8px; margin-bottom:20px; }
.field label{ font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-secondary); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }

.input, .textarea, .select{
  background:var(--gunmetal); border:1px solid var(--hairline-strong); border-radius:var(--r-md);
  padding:15px 18px; color:var(--white); font-size:var(--fs-body); width:100%;
  transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.input::placeholder, .textarea::placeholder{ color:var(--text-muted); }
.input:focus, .textarea:focus, .select:focus{
  outline:none; border-color:var(--electric-blue); box-shadow:0 0 0 4px rgba(201,162,39,0.15);
}
.textarea{ resize:vertical; min-height:130px; }
.select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C7CBD1' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 18px center; }

.field .error-msg{ font-size:var(--fs-xs); color:#F2704A; display:none; }
.field.has-error .input, .field.has-error .textarea, .field.has-error .select{ border-color:#F2704A; }
.field.has-error .error-msg{ display:block; }

.checkbox-row{ display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); color:var(--text-secondary); }
.checkbox-row input{ width:18px; height:18px; accent-color:var(--electric-blue); }

.newsletter-form{ display:flex; gap:12px; max-width:460px; }
.newsletter-form .input{ flex:1; }

@media (max-width:640px){
  .field-row{ grid-template-columns:1fr; }
  .newsletter-form{ flex-direction:column; }
}


/* ---- buttons.css ---- */
/* ===== BUTTONS ===== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2xs);
  font-family:var(--font-body); font-weight:700; font-size:var(--fs-sm); letter-spacing:0.04em;
  padding:16px 34px; border-radius:var(--r-pill); white-space:nowrap; cursor:pointer;
  transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
  border:1px solid transparent;
}
.btn:active{ transform:translateY(1px) scale(0.99); }

.btn-primary{
  background:var(--aurora); color:var(--white); font-weight:800; box-shadow:0 6px 20px rgba(201,162,39,0.3), inset 0 1px 0 rgba(255,255,255,0.35), inset 0 -2px 0 rgba(60,40,4,0.3);
  border-color:rgba(184,134,11,0.4);
}
.btn-primary:hover{ box-shadow:var(--aurora-glow), inset 0 1px 0 rgba(255,255,255,0.35), inset 0 -2px 0 rgba(60,40,4,0.3); transform:translateY(-2px); }

.btn-secondary{
  background:transparent; border:1px solid rgba(255,255,255,0.35); color:var(--white);
}
.btn-secondary:hover{ border-color:var(--white); background:rgba(255,255,255,0.06); transform:translateY(-2px); }

.btn-ghost{
  background:transparent; border:1px solid var(--hairline-strong); color:var(--text-secondary); padding:14px 26px;
}
.btn-ghost:hover{ border-color:var(--electric-blue-soft); color:var(--white); }

.btn-sm{ padding:11px 22px; font-size:var(--fs-xs); }
.btn-lg{ padding:19px 42px; font-size:var(--fs-body); }
.btn-block{ width:100%; }
.btn-icon{ padding:12px; border-radius:50%; }

.btn[disabled], .btn.is-disabled{ opacity:0.4; pointer-events:none; }

.link-underline{
  position:relative; font-weight:600; color:var(--white); display:inline-flex; align-items:center; gap:6px;
}
.link-underline::after{
  content:""; position:absolute; left:0; bottom:-3px; width:100%; height:3px; border-radius:2px; background:var(--aurora);
  transform:scaleX(0); transform-origin:left; transition:transform var(--dur-med) var(--ease-out);
}
.link-underline:hover::after{ transform:scaleX(1); }


/* ---- components.css ---- */
/* ===== SHARED COMPONENTS (hero, age gate, breadcrumbs, accordion, modal, pagination, slider) ===== */

/* --- Age verification gate --- */
.age-gate{
  position:fixed; inset:0; z-index:var(--z-age-gate); display:flex; align-items:center; justify-content:center;
  background:radial-gradient(ellipse at top, rgba(201,162,39,0.12), transparent 60%), var(--black);
  padding:var(--sp-md);
}
.age-gate[hidden]{ display:none; }
.age-gate__panel{
  width:100%; max-width:480px; text-align:center; padding:var(--sp-xl) var(--sp-lg);
  border-radius:var(--r-xl); border:1px solid var(--hairline-strong);
  background:rgba(24,24,24,0.7); backdrop-filter:blur(20px);
  animation:popIn 500ms var(--ease-out);
}
.age-gate__logo{ margin-inline:auto; margin-bottom:var(--sp-md); }
.age-gate__panel h2{ margin-bottom:14px; }
.age-gate__panel p{ margin-bottom:var(--sp-md); }
.age-gate__legal{ font-size:var(--fs-xs); color:var(--text-muted); margin-top:var(--sp-md); line-height:1.6; }
.age-gate__actions{ display:flex; flex-direction:column; gap:12px; margin-top:var(--sp-md); }

/* --- Hero --- */
.hero{
  position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden;
  background:linear-gradient(180deg, var(--black) 0%, var(--charcoal) 100%);
}
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; }
.hero__overlay{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(13,13,13,0.55) 0%, rgba(13,13,13,0.75) 55%, var(--black) 100%); }
.hero__content{ position:relative; z-index:2; max-width:760px; padding-top:calc(var(--header-h) + 40px); }
.hero__eyebrow{ margin-bottom:var(--sp-sm); }
.hero__title{ margin-bottom:var(--sp-sm); }
.hero__subtitle{ font-size:var(--fs-body-lg); color:var(--text-secondary); max-width:560px; margin-bottom:var(--sp-lg); }
.hero__actions{ display:flex; gap:16px; flex-wrap:wrap; }
.hero__scroll-cue{ position:absolute; bottom:36px; left:50%; transform:translateX(-50%); z-index:2; color:var(--text-muted); font-size:var(--fs-xs); letter-spacing:0.12em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:8px; }
.hero__scroll-cue::after{ content:""; width:3px; height:34px; border-radius:2px; background:var(--aurora); animation:floatY 2.4s ease-in-out infinite; }

.hero.hero-sub{ min-height:56vh; }
.hero-sub .hero__content{ padding-top:calc(var(--header-h) + 20px); padding-bottom:40px; }

/* Full, uncropped banner hero (used where the image itself is the full artwork/poster) */
.hero.hero--banner{
  position:static; min-height:0; display:block; overflow:visible; background:none;
  padding-top:var(--header-h);
}
.hero--banner .hero__bg{ position:static; }
.hero--banner .hero__bg img{ display:block; width:100%; height:auto; object-fit:contain; animation:none; }
.hero--banner .hero__overlay{ display:none; }
.hero--banner .container{ position:static; }
.hero--banner .hero__content{ position:static; z-index:auto; max-width:none; padding-top:var(--sp-lg); padding-bottom:var(--sp-lg); }
.hero--banner .hero__subtitle{ max-width:640px; }

.hero__content--centered{
  max-width:900px; margin-inline:auto; text-align:center;
}
.hero__content--centered .hero__subtitle{ margin-inline:auto; max-width:640px; }
.hero__content--centered .hero__actions{ justify-content:center; }

.hero__divider{ display:flex; align-items:center; justify-content:center; gap:14px; margin:0 auto var(--sp-md); max-width:420px; }
.hero__divider-line{ flex:1; height:3px; border-radius:2px; background:var(--aurora); box-shadow:0 1px 6px rgba(201,162,39,0.35); }
.hero__spade{
  font-size:1.1rem; line-height:1; flex:none;
  background:var(--aurora); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,0.6));
}

.hero__title--collector{
  font-family:var(--font-body); font-weight:800; text-transform:uppercase;
  font-size:clamp(2.6rem, 6.5vw, 5.2rem); letter-spacing:0.01em; line-height:1;
  background:var(--aurora); -webkit-background-clip:text; background-clip:text; color:transparent;
  -webkit-text-stroke:1.5px rgba(184,134,11,0.6);
  text-shadow:0 3px 0 rgba(60,40,4,0.55), 0 8px 24px rgba(0,0,0,0.55);
  margin-bottom:var(--sp-sm);
}
@media (max-width:640px){
  .hero__title--collector{ -webkit-text-stroke:1px rgba(184,134,11,0.6); }
}

/* --- Breadcrumbs --- */
.breadcrumbs{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:var(--fs-xs); color:var(--text-muted); padding-block:var(--sp-md); }
.breadcrumbs a{ color:var(--text-muted); }
.breadcrumbs a:hover{ color:var(--white); }
.breadcrumbs .sep{ color:var(--hairline-strong); }
.breadcrumbs .current{ color:var(--text-secondary); }

/* --- Accordion --- */
.accordion-item{ border-bottom:1px solid var(--hairline); }
.accordion-trigger{ width:100%; display:flex; justify-content:space-between; align-items:center; padding:22px 4px; text-align:left; font-weight:700; font-size:1.02rem; color:var(--white); }
.accordion-trigger svg{ width:18px; height:18px; flex-shrink:0; transition:transform var(--dur-med) var(--ease-out); }
.accordion-item.is-open .accordion-trigger svg{ transform:rotate(45deg); }
.accordion-panel{ max-height:0; overflow:hidden; transition:max-height var(--dur-med) var(--ease-in-out); }
.accordion-panel__inner{ padding:0 4px 22px; color:var(--text-secondary); }

/* --- Modal / Quick view --- */
.modal-overlay{ position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:var(--z-modal); display:flex; align-items:center; justify-content:center; padding:var(--sp-md); opacity:0; pointer-events:none; transition:opacity var(--dur-med) var(--ease-out); }
.modal-overlay.is-open{ opacity:1; pointer-events:auto; }
.modal{ width:100%; max-width:760px; max-height:88vh; overflow:auto; background:var(--charcoal); border:1px solid var(--hairline-strong); border-radius:var(--r-xl); padding:var(--sp-lg); transform:scale(0.94); transition:transform var(--dur-med) var(--ease-out); }
.modal-overlay.is-open .modal{ transform:scale(1); }
.modal__close{ position:absolute; top:16px; right:16px; width:38px; height:38px; }

/* --- Pagination --- */
.pagination{ display:flex; justify-content:center; align-items:center; gap:8px; margin-top:var(--sp-xl); }
.pagination button{ width:40px; height:40px; border-radius:50%; color:var(--text-secondary); font-weight:700; }
.pagination button.is-active{ background:var(--aurora); color:var(--white); }
.pagination button:hover:not(.is-active){ background:rgba(255,255,255,0.06); }

/* --- Slider / carousel --- */
.slider{ display:flex; gap:var(--sp-md); overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; scrollbar-width:none; }
.slider::-webkit-scrollbar{ display:none; }
.slider > *{ scroll-snap-align:start; flex:0 0 auto; }
.slider-controls{ display:flex; gap:10px; justify-content:flex-end; margin-bottom:var(--sp-md); }
.slider-controls button{ width:44px; height:44px; border-radius:50%; border:1px solid var(--hairline-strong); display:flex; align-items:center; justify-content:center; }
.slider-controls button:hover{ border-color:var(--electric-blue-soft); }

/* --- Filter bar --- */
.filter-bar{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; padding-bottom:var(--sp-lg); border-bottom:1px solid var(--hairline); margin-bottom:var(--sp-lg); }
.filter-group{ display:flex; gap:10px; flex-wrap:wrap; }
.chip{ padding:9px 18px; border-radius:var(--r-pill); border:1px solid var(--hairline-strong); font-size:var(--fs-sm); color:var(--text-secondary); transition:all var(--dur-fast); }
.chip.is-active, .chip:hover{ background:var(--aurora); border-color:transparent; color:var(--white); }
.result-count{ font-size:var(--fs-sm); color:var(--text-muted); }

/* --- Search --- */
.search-panel{ position:fixed; top:0; left:0; right:0; z-index:calc(var(--z-header)+1); background:rgba(13,13,13,0.97); backdrop-filter:blur(16px); padding:120px var(--sp-md) var(--sp-lg); transform:translateY(-100%); transition:transform var(--dur-med) var(--ease-out); }
.search-panel.is-open{ transform:translateY(0); }
.search-panel__input-wrap{ max-width:760px; margin-inline:auto; position:relative; }
.search-panel__input{ width:100%; background:transparent; border:none; border-bottom:2px solid var(--hairline-strong); font-family:var(--font-display); font-size:2rem; padding:14px 50px 14px 4px; color:var(--white); }
.search-panel__input:focus{ outline:none; border-color:var(--electric-blue); }
.search-panel__close{ position:absolute; top:32px; right:32px; width:44px; height:44px; }
.search-suggestions{ max-width:760px; margin:26px auto 0; display:flex; flex-direction:column; gap:4px; }
.search-suggestion{ display:flex; align-items:center; gap:16px; padding:14px 8px; border-radius:var(--r-md); transition:background var(--dur-fast); }
.search-suggestion:hover, .search-suggestion:focus-visible{ background:rgba(255,255,255,0.06); }
.search-suggestion img{ width:52px; height:52px; object-fit:cover; border-radius:8px; }
.search-suggestion__name{ font-weight:700; }
.search-suggestion__meta{ font-size:var(--fs-xs); color:var(--text-muted); }
.no-results{ text-align:center; padding:var(--sp-2xl) var(--sp-md); }

/* --- Lifestyle banner --- */
.lifestyle-banner{ position:relative; min-height:60vh; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; border-radius:var(--r-xl); margin-inline:var(--sp-md); }
.lifestyle-banner img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.lifestyle-banner::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,13,13,0.3), rgba(13,13,13,0.8)); z-index:1; }
.lifestyle-banner__content{ position:relative; z-index:2; max-width:640px; padding:var(--sp-lg); }

/* --- Wholesale CTA --- */
.wholesale-cta{
  background-image:linear-gradient(135deg, rgba(24,24,24,0.93) 0%, rgba(13,13,13,0.95) 100%), url('../assets/backgrounds/section-bg-ace-ultra.jpg');
  background-size:cover; background-position:center 20%;
  border:1px solid var(--hairline-strong); border-radius:var(--r-xl); padding:var(--sp-2xl); position:relative; overflow:hidden;
}
.wholesale-cta::before{ content:""; position:absolute; top:-40%; right:-10%; width:60%; height:160%; background:var(--aurora); opacity:0.08; filter:blur(80px); }

/* --- Cart / checkout --- */
.cart-line{ display:grid; grid-template-columns:96px 1fr auto; gap:20px; align-items:center; padding:22px 0; border-bottom:1px solid var(--hairline); }
.cart-line img{ width:96px; height:96px; object-fit:cover; border-radius:var(--r-md); }
.cart-line__title{ font-weight:700; }
.cart-line__meta{ font-size:var(--fs-xs); color:var(--text-muted); margin-top:4px; }
.qty-stepper{ display:inline-flex; align-items:center; border:1px solid var(--hairline-strong); border-radius:var(--r-pill); overflow:hidden; }
.qty-stepper button{ width:34px; height:34px; color:var(--white); }
.qty-stepper button:hover{ background:rgba(255,255,255,0.08); }
.qty-stepper input{ width:42px; text-align:center; background:transparent; border:none; color:var(--white); font-weight:700; }
.order-summary{ padding:var(--sp-lg); position:sticky; top:120px; }
.order-summary__row{ display:flex; justify-content:space-between; margin-bottom:12px; font-size:var(--fs-sm); color:var(--text-secondary); }
.order-summary__row.total{ font-size:1.15rem; font-weight:800; color:var(--white); margin-top:16px; padding-top:16px; border-top:1px solid var(--hairline); }

.checkout-steps{ display:flex; gap:24px; margin-bottom:var(--sp-lg); flex-wrap:wrap; }
.checkout-step{ display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); color:var(--text-muted); }
.checkout-step__num{ width:26px; height:26px; border-radius:50%; border:1px solid var(--hairline-strong); display:flex; align-items:center; justify-content:center; font-size:var(--fs-xs); font-weight:700; }
.checkout-step.is-active{ color:var(--white); }
.checkout-step.is-active .checkout-step__num{ background:var(--aurora); border-color:transparent; }

.payment-option{ display:flex; align-items:center; gap:14px; padding:16px 18px; border:1px solid var(--hairline-strong); border-radius:var(--r-md); margin-bottom:12px; cursor:pointer; }
.payment-option input{ accent-color:var(--electric-blue); }
.payment-option.is-selected{ border-color:var(--electric-blue); background:rgba(201,162,39,0.06); }

/* --- 404 --- */
.error-page{ min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:var(--sp-lg); }
.error-code{ font-family:var(--font-display); font-size:clamp(6rem,18vw,11rem); font-weight:700; background:var(--aurora); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:2px rgba(184,134,11,0.5); text-shadow:0 4px 0 rgba(60,40,4,0.45); line-height:1; }

/* --- Floating WhatsApp button (site-wide) --- */
.whatsapp-float{
  position:fixed; bottom:26px; left:26px; z-index:900;
  width:60px; height:60px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(0,0,0,0.35), 0 0 0 rgba(37,211,102,0.6);
  transition:transform 0.2s ease, box-shadow 0.2s ease;
  animation: whatsapp-pulse 2.4s infinite;
}
.whatsapp-float:hover{ transform:scale(1.08); }
.whatsapp-float svg{ width:32px; height:32px; }
@keyframes whatsapp-pulse{
  0%{ box-shadow:0 8px 22px rgba(0,0,0,0.35), 0 0 0 0 rgba(37,211,102,0.5); }
  70%{ box-shadow:0 8px 22px rgba(0,0,0,0.35), 0 0 0 14px rgba(37,211,102,0); }
  100%{ box-shadow:0 8px 22px rgba(0,0,0,0.35), 0 0 0 0 rgba(37,211,102,0); }
}
@media (max-width:600px){
  .whatsapp-float{ width:52px; height:52px; bottom:16px; left:16px; }
  .whatsapp-float svg{ width:27px; height:27px; }
}


/* ---- animations.css ---- */
/* ===== ANIMATIONS ===== */
@keyframes fadeUp{ from{ opacity:0; transform:translateY(28px);} to{ opacity:1; transform:translateY(0);} }
@keyframes fadeIn{ from{ opacity:0;} to{ opacity:1;} }
@keyframes floatY{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-16px);} }
@keyframes slowZoom{ from{ transform:scale(1);} to{ transform:scale(1.12);} }
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes shimmer{ 0%{ background-position:-400px 0;} 100%{ background-position:400px 0;} }
@keyframes popIn{ from{ opacity:0; transform:scale(0.9);} to{ opacity:1; transform:scale(1);} }

.reveal{ opacity:0; transform:translateY(32px); transition:opacity 900ms var(--ease-out), transform 900ms var(--ease-out); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.reveal-delay-1.is-visible{ transition-delay:120ms; }
.reveal-delay-2.is-visible{ transition-delay:240ms; }
.reveal-delay-3.is-visible{ transition-delay:360ms; }

.float{ animation:floatY 6s ease-in-out infinite; }
.zoom-slow{ animation:slowZoom 14s ease-out forwards; }

.spinner{ width:20px; height:20px; border-radius:50%; border:2px solid rgba(255,255,255,0.25); border-top-color:var(--white); animation:spin 0.7s linear infinite; }

.skeleton{ background:linear-gradient(90deg, var(--gunmetal) 0%, var(--gunmetal-2) 50%, var(--gunmetal) 100%); background-size:800px 100%; animation:shimmer 1.6s linear infinite; border-radius:var(--r-md); }

.toast{
  position:fixed; bottom:100px; right:28px; z-index:var(--z-modal);
  display:flex; align-items:center; gap:10px; padding:16px 22px; border-radius:var(--r-md);
  background:var(--gunmetal); border:1px solid var(--hairline-strong); box-shadow:var(--shadow-lg);
  animation:popIn 260ms var(--ease-out);
}
.toast.success{ border-color:rgba(95,217,138,0.5); }


/* ---- responsive.css ---- */
/* ===== RESPONSIVE OVERRIDES ===== */
@media (max-width:1180px){
  .footer-top{ grid-template-columns:1fr 1fr 1fr; }
}
@media (max-width:980px){
  .split{ grid-template-columns:1fr; }
  .hero__content{ max-width:100%; }
  .order-summary{ position:static; }
  .checkout-grid{ grid-template-columns:1fr !important; }
}
@media (max-width:760px){
  .cart-line{ grid-template-columns:70px 1fr; grid-template-rows:auto auto; }
  .cart-line img{ width:70px; height:70px; }
  .cart-line__actions{ grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; margin-top:10px; }
  .lifestyle-banner{ margin-inline:var(--sp-sm); border-radius:var(--r-lg); min-height:48vh; }
  .wholesale-cta{ padding:var(--sp-lg); }
}
@media (max-width:640px){
  .site-header__inner{ padding-inline:var(--sp-sm); }
  .hero{ min-height:88vh; }
  .field-row{ grid-template-columns:1fr; }
  .footer-top{ grid-template-columns:1fr; gap:var(--sp-lg); }
  .filter-bar{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:420px){
  .btn{ padding:14px 24px; }
  .error-code{ font-size:5rem; }
}