/* =========================================================
   COSTAN V4.5 — GLOBAL SITE SYSTEM
   One header, one footer, one typography system everywhere.
   ========================================================= */
:root{
  --costan-bg:#050505;
  --costan-panel:#0b0b0b;
  --costan-line:rgba(255,255,255,.11);
  --costan-text:#f5f5ef;
  --costan-muted:#92928b;
  --costan-lime:#caff18;

  --costan-font-display:'Michroma','Space Grotesk',sans-serif;
  --costan-font-body:'Space Grotesk',Arial,sans-serif;

  --costan-h1:clamp(44px,6.2vw,92px);
  --costan-h2:clamp(34px,4.2vw,62px);
  --costan-h3:clamp(16px,1.45vw,22px);
  --costan-h4:13px;
  --costan-body:15px;
  --costan-small:12px;
  --costan-label:9px;
}
html{scroll-behavior:smooth}
body.ecom{
  margin:0!important;
  background:var(--costan-bg)!important;
  color:var(--costan-text)!important;
  font-family:var(--costan-font-body)!important;
  font-size:var(--costan-body)!important;
  line-height:1.68!important;
}
body.ecom *{box-sizing:border-box}
body.ecom img{display:block;max-width:100%}
body.ecom a{text-decoration:none;color:inherit}

body.ecom h1,
body.ecom h2,
body.ecom h3,
body.ecom h4,
body.ecom h5,
body.ecom h6{
  margin-top:0;
  font-family:var(--costan-font-display)!important;
  font-weight:400!important;
}
body.ecom h1{
  font-size:var(--costan-h1)!important;
  line-height:.94!important;
  letter-spacing:-.04em!important;
}
body.ecom h2{
  font-size:var(--costan-h2)!important;
  line-height:.98!important;
  letter-spacing:-.035em!important;
}
body.ecom h3{
  font-size:var(--costan-h3)!important;
  line-height:1.22!important;
  letter-spacing:-.015em!important;
}
body.ecom h4{
  font-size:var(--costan-h4)!important;
  line-height:1.35!important;
}

body.ecom p,
body.ecom .page-copy,
body.ecom .shop-meta,
body.ecom .accord p,
body.ecom .close-copy,
body.ecom .community-card p,
body.ecom .review-card p,
body.ecom .faq-list p,
body.ecom .site-footer p,
body.ecom .site-footer a{
  font-family:var(--costan-font-body)!important;
  font-size:var(--costan-body)!important;
  line-height:1.68!important;
}

body.ecom small,
body.ecom .review-date,
body.ecom .site-footer-bottom{
  font-family:var(--costan-font-body)!important;
  font-size:var(--costan-small)!important;
  line-height:1.5!important;
}

body.ecom .page-kicker,
body.ecom .badge,
body.ecom .shop-actions a,
body.ecom .detail-actions a,
body.ecom .detail-actions button,
body.ecom .accord summary,
body.ecom .faq-list summary{
  font-family:var(--costan-font-display)!important;
  font-size:var(--costan-label)!important;
  letter-spacing:.08em!important;
}

/* old v45 header rules removed in v46 */
/* old v45 footer rules removed in v46 */
/* ---------- shared content hierarchy ---------- */
body.ecom .page-title{
  font-size:var(--costan-h1)!important;
  line-height:.94!important;
  letter-spacing:-.04em!important;
}
body.ecom .detail h1{
  font-size:var(--costan-h1)!important;
  line-height:.94!important;
  letter-spacing:-.04em!important;
}
body.ecom .look h2,
body.ecom .community .page-title,
body.ecom .product-faq .page-title{
  font-size:var(--costan-h2)!important;
  line-height:.98!important;
  letter-spacing:-.035em!important;
}
body.ecom .shop-info h3,
body.ecom .community-card h3{
  font-size:var(--costan-h3)!important;
  line-height:1.22!important;
}
body.ecom .reviews-head h2{
  font-family:var(--costan-font-display)!important;
  font-size:var(--costan-h3)!important;
  line-height:1.2!important;
}
body.ecom .reviewer strong{
  font-size:14px!important;
}
body.ecom .shop-meta{
  font-size:13px!important;
}
body.ecom .close-copy{
  font-size:13px!important;
  line-height:1.6!important;
}
body.ecom .close-title{
  font-family:var(--costan-font-display)!important;
  font-size:12px!important;
  line-height:1.3!important;
}
body.ecom .community-card p{
  font-size:13px!important;
}
body.ecom .faq-list p{
  max-width:820px!important;
}
body.ecom .product-faq{
  text-align:center!important;
}
body.ecom .faq-list{
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
}

/* Keep product detail body spacing aligned with home scale */
body.ecom .detail .price{
  font-family:var(--costan-font-body)!important;
  font-size:18px!important;
  line-height:1.4!important;
}
body.ecom .detail .pills span{
  font-family:var(--costan-font-display)!important;
  font-size:8px!important;
}

/* ---------- responsive ---------- */
@media(max-width:900px){
  body.ecom .site-header{
    height:76px!important;
    grid-template-columns:1fr auto!important;
  }
  body.ecom .site-nav{display:none!important}
  body.ecom .site-logo{
    justify-self:start!important;
    grid-column:1!important;
    grid-row:1!important;
  }
  body.ecom .site-logo img{width:155px!important}
  body.ecom .site-tools{
    grid-column:2!important;
    grid-row:1!important;
    gap:12px!important;
  }
  body.ecom .site-tools a{
    font-size:8px!important;
  }
  body.ecom .site-tools a:first-child{
    display:none!important;
  }
  body.ecom .site-footer-grid{
    grid-template-columns:1fr 1fr!important;
  }
}

@media(max-width:700px){
  :root{
    --costan-h1:clamp(38px,11vw,58px);
    --costan-h2:clamp(30px,8.5vw,46px);
    --costan-h3:17px;
    --costan-body:14px;
    --costan-small:12px;
  }
  body.ecom .site-footer-grid{grid-template-columns:1fr!important}
  body.ecom .site-footer-bottom{display:block!important;line-height:2!important}
  body.ecom .site-tools a:nth-child(2){display:none!important}
}