:root{
  /* ---- Light (dominant) neutrals ---- */
  --cream:#f7f3ec;
  --cream-2:#efe8d9;
  --stone:#e4dbc8;
  --ink:#2b2a24;
  --ink-dim: rgba(43,42,36,0.64);
  --ink-faint: rgba(43,42,36,0.42);
  --line: rgba(43,42,36,0.12);
  --line-strong: rgba(43,42,36,0.22);

  /* ---- Dark neutrals (header, footer, and chosen contrast moments) ---- */
  --charcoal-950:#14130f;
  --charcoal-900:#1c1a15;
  --charcoal-800:#241f18;
  --charcoal-700:#2e2820;
  --paper:#f5f3ee;
  --paper-bright:#faf8f4;
  --paper-dim: rgba(245,243,238,0.62);
  --paper-faint: rgba(245,243,238,0.40);
  --line-dark: rgba(245,243,238,0.10);
  --line-dark-strong: rgba(245,243,238,0.18);

  /* ---- Accent (same across both contexts) — warm bronze/champagne, "Considered Luxury" direction ---- */
  --ice: #8a6a2f;
  --ice-soft: rgba(138,106,47,0.14);
  --sage-muted: #8a6a2f;
  --ice-shine: linear-gradient(120deg, #8a6a2f, #d8b978 55%, #8a6a2f);

  /* ---- Warm neutral accent ---- */
  --sand: #d8c9b3;
  --sand-soft: #e9e0d1;
  --sand-deep: #9c8563;

  --ease: cubic-bezier(.22,.61,.36,1);
  --announce-h: 36px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
:target{ scroll-margin-top: calc(110px + var(--announce-h)); }
body{
  background: var(--cream);
  color: var(--ink);
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
  outline: 2px solid var(--ice);
  outline-offset: 3px;
  border-radius: 2px;
}
.wrap{max-width: 1180px; margin: 0 auto; padding: 0 32px;}
.wrap.nav-inner{ max-width: 1280px; }
h1,h2,h3{font-family:'Fraunces', serif; font-weight: 400; letter-spacing: -0.015em;}
.eyebrow{
  font-family:'Inter', sans-serif;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ice);
  font-weight: 500;
}

@media (prefers-reduced-motion: no-preference){
  .reveal{ opacity:0; transform: translateY(18px); transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
  .reveal.in{ opacity:1; transform: translateY(0); }
}

/* ---------- ANNOUNCEMENT BAR ---------- */
.announce-bar{
  position: fixed; top:0; left:0; right:0; z-index: 110;
  height: var(--announce-h);
  display:flex; align-items:center; justify-content:center;
  background: var(--charcoal-950);
  border-bottom: 1px solid var(--line-dark);
}
.announce-bar .wrap{
  display:flex; align-items:center; justify-content:space-between; gap: 28px;
  font-size: 11px; letter-spacing: 0.08em; color: var(--paper-dim);
}
.announce-bar .announce-left{ color: var(--ice); font-weight:500; white-space:nowrap; }
.announce-bar .announce-center{ white-space:nowrap; }
.announce-bar .announce-right{ display:flex; align-items:center; gap:6px; white-space:nowrap; }
.announce-bar .flag{ font-size: 12px; flex:none; }
.announce-bar .dot{ color: var(--paper-faint); margin: 0 4px; }
.announce-icon{ vertical-align: -1.5px; margin-right: 6px; flex: none; }
.announce-bar .lang-switch{ margin-left: 8px; padding-left: 8px; border-left: 1px solid var(--line-dark-strong); }
.announce-bar .lang-toggle{ width: 20px; height: 20px; }
.announce-bar .lang-flag{ font-size: 12px; }
.announce-bar .lang-badge{ width:11px; height:11px; bottom:-3px; right:-3px; }
.announce-bar .lang-badge svg{ width:7px; height:7px; }
.announce-bar .lang-menu{ top: calc(100% + 10px); }
@media (max-width: 700px){
  .announce-bar .announce-center{ display:none; }
}

/* ---------- NAV (dark bookend — always solid, frames the light body) ---------- */
header{
  position: fixed; top: var(--announce-h); left:0; right:0; z-index: 100;
  padding: 22px 0;
  border-bottom: none;
  transition: padding 0.4s var(--ease), box-shadow 0.4s var(--ease);
  color: var(--paper);
}
header::before{
  content:'';
  position:absolute; inset:0; z-index:-1;
  background: linear-gradient(to bottom, var(--charcoal-950) 0%, var(--charcoal-950) 20%, rgba(20,19,15,0.80) 62%, rgba(20,19,15,0.60) 100%);
  mix-blend-mode: multiply;
}
header.scrolled{
  padding: 14px 0;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}
.nav-inner{ display:flex; align-items:center; justify-content:space-between; }
.wordmark{
  font-family:'Fraunces', serif;
  font-size: 20px;
  letter-spacing: 0.14em;
  font-weight: 400;
  text-transform: uppercase;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.wordmark-icon{
  height:18px;
  width:auto;
  display:block;
}
.nav-links{ display:flex; gap:40px; list-style:none; }
.nav-links a{
  font-size: 13px; letter-spacing: 0.04em; color: var(--paper);
  transition: color 0.3s var(--ease);
  position: relative;
}
.nav-links a:hover{ color: var(--paper-bright); }
.nav-links a.active{
  color: var(--ice);
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 1px;
}
.nav-links a.active:hover{ color: var(--ice); }
.nav-cta{
  font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
  border: 1px solid var(--line-dark-strong);
  padding: 11px 22px;
  border-radius: 2px;
  transition: border-color 0.3s var(--ease), background 0.3s var(--ease);
}
.nav-cta:hover{ border-color: var(--ice); background: var(--ice-soft); }

.nav-toggle{
  display:none;
  flex-direction:column; align-items:center; justify-content:center;
  gap:6px; width:34px; height:34px;
  background:none; border:none; cursor:pointer; padding:0;
}
.nav-toggle span{
  display:block; width:100%; height:1px; background: var(--paper);
  transition: transform 0.3s var(--ease), opacity 0.3s var(--ease);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

.cart-link{
  position:relative; display:flex; align-items:center; justify-content:center;
  width: 34px; height: 34px; color: var(--paper-dim);
  transition: color 0.3s var(--ease);
}
.cart-link:hover{ color: var(--paper); }
.cart-badge{
  display:none; align-items:center; justify-content:center;
  position:absolute; top:-2px; right:-4px;
  min-width:16px; height:16px; padding:0 3px;
  background: var(--ice); color: var(--paper-bright);
  border-radius: 50%; font-size: 10px; font-weight:600; line-height:1;
}

/* ---------- LANGUAGE SWITCH ---------- */
.lang-switch{ position:relative; }
.lang-toggle{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  width: 34px; height: 34px;
  background:none; border:none; cursor:pointer; padding:0;
  border-radius: 50%; transition: background 0.3s var(--ease);
}
.lang-toggle:hover{ background: var(--line-dark); }
.lang-flag{ font-size: 16px; line-height:1; }
.lang-badge{
  position:absolute; bottom:-2px; right:-3px;
  width:15px; height:15px; border-radius:50%;
  background: var(--ice); color: var(--paper-bright);
  display:flex; align-items:center; justify-content:center;
  border: 1.5px solid var(--charcoal-950);
}
.lang-badge svg{ width:9px; height:9px; }
.lang-menu{
  position:absolute; top: calc(100% + 12px); right:0;
  background: var(--charcoal-900); border:1px solid var(--line-dark-strong);
  border-radius: 8px; padding:6px; min-width:150px;
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; transform: translateY(-6px);
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
  box-shadow: 0 12px 30px rgba(0,0,0,0.35);
  z-index: 200;
}
.lang-menu.open{ opacity:1; visibility:visible; transform: translateY(0); }
.lang-option{
  display:flex; align-items:center; gap:10px;
  width:100%; padding:10px 12px; border-radius:5px;
  background:none; border:none; cursor:pointer;
  font-family:'Inter', sans-serif; font-size: 13.5px; color: var(--paper-dim);
  text-align:left; transition: background 0.2s var(--ease), color 0.2s var(--ease);
}
.lang-option:hover{ background: var(--line-dark); color: var(--paper); }
.lang-option.active{ color: var(--ice); }

/* ---------- HERO (light, dominant) ---------- */
.hero{
  position: relative;
  min-height: 100vh;
  display:flex; flex-direction:column; justify-content:center;
  padding-top: calc(120px + var(--announce-h));
  overflow: hidden;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(100deg, var(--cream) 0%, var(--cream) 38%, rgba(247,243,236,0.94) 55%, rgba(247,243,236,0.7) 72%, rgba(247,243,236,0.2) 90%),
    radial-gradient(ellipse 60% 50% at 78% 18%, rgba(92,107,77,0.09), transparent 60%),
    url('assets/images/hero-daybed-16x9.jpg') center 42% / cover no-repeat;
}
.hero-bg::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:40px; z-index:2;
  background: linear-gradient(to bottom, rgba(20,19,15,0.5), rgba(20,19,15,0));
  mix-blend-mode: multiply;
  pointer-events:none;
}
.hero-bg::after{
  content:''; position:absolute; inset:0;
  background-image: repeating-linear-gradient(115deg, rgba(43,42,36,0.025) 0px, rgba(43,42,36,0.025) 1px, transparent 1px, transparent 90px);
  opacity: 0.6;
}
.hero-inner{ position:relative; z-index:1; }
.hero-eyebrow{ margin-bottom: 26px; display:flex; align-items:center; gap:14px; }
.hero-eyebrow .rule{ width:36px; height:1px; background: var(--ice); display:inline-block; }
h1.hero-title{
  font-size: clamp(40px, 6.4vw, 92px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  max-width: 15ch;
  font-weight: 400;
  color: var(--ink);
}
h1.hero-title em{ font-style: italic; color: var(--ice); font-weight:300; }
.hero-sub{
  margin-top: 28px;
  max-width: 44ch;
  font-size: 18px;
  color: var(--ink-dim);
  font-weight: 300;
}
.hero-actions{ margin-top: 44px; display:flex; align-items:center; gap: 28px; flex-wrap: wrap; }
.btn-primary{
  background: var(--ink); color: var(--cream);
  padding: 16px 34px; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500;
  border-radius: 2px;
  transition: background 0.4s var(--ease), transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
  display:inline-block;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.btn-primary:hover{
  background: var(--ice); color: var(--paper-bright); transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(138,106,47,0.28);
}
.btn-primary:active{ transform: translateY(0); box-shadow: 0 4px 10px rgba(138,106,47,0.2); }
.btn-ghost{
  position: relative;
  font-size: 13px; letter-spacing: 0.05em; color: var(--ink-dim);
  padding-bottom: 2px; border-bottom: 1px solid var(--line-strong);
  transition: color 0.35s var(--ease), border-color 0.35s var(--ease);
}
.btn-ghost:hover{ color: var(--ice); border-color: var(--ice); }

.hero-scroll{
  position:absolute; bottom: 40px; left: 32px; z-index:1;
  display:flex; align-items:center; gap:12px;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-faint);
  cursor: pointer; transition: color 0.3s var(--ease);
}
.hero-scroll:hover{ color: var(--ice); }
.hero-scroll .line{ width:1px; height: 44px; background: linear-gradient(var(--line-strong), transparent); }

/* ---------- PAGE INTRO (used by Shop / Coming Soon pages) ---------- */
.page-intro{
  padding: calc(220px + var(--announce-h)) 0 100px;
  border-bottom: 1px solid var(--line);
}
.page-intro .back-link{
  display:inline-flex; align-items:center; gap:8px;
  font-size: 13px; color: var(--ink-faint); margin-bottom: 32px;
  transition: color 0.3s var(--ease);
}
.page-intro .back-link:hover{ color: var(--ice); }
.page-intro h1{
  font-size: clamp(34px, 5vw, 58px);
  color: var(--ink);
  max-width: 16ch;
  margin-top: 20px;
  line-height:1.1;
}
.page-intro p.lede{
  margin-top: 26px;
  max-width: 52ch;
  font-size: 17px;
  color: var(--ink-dim);
}

/* ---------- MISSION STRIP (dark contrast moment) ---------- */
.mission{
  background:
    linear-gradient(100deg, rgba(20,19,15,0.88) 0%, rgba(20,19,15,0.72) 45%, rgba(20,19,15,0.55) 100%),
    url('assets/images/mission-empty-corner-1x1.jpg') center 30% / cover no-repeat,
    var(--charcoal-950);
  color: var(--paper);
  border-top: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
  padding: 90px 0;
}
.mission-inner{ display:grid; grid-template-columns: 1fr 1.6fr; gap: 60px; align-items: start; }
.mission h2{ font-size: clamp(28px, 3.2vw, 44px); line-height:1.25; color: var(--paper-bright); font-weight:400; }
.mission p{ color: var(--paper-dim); font-size: 16px; max-width: 46ch; }
.mission-num{ font-family:'Fraunces', serif; font-size: 13px; color: var(--paper-faint); margin-bottom: 18px; letter-spacing: 0.08em; }

/* ---------- PRODUCT / FEATURED PRODUCT (light) ---------- */
.product{ padding: 160px 0; }
.product-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items:center; }
.product-visual{
  aspect-ratio: 4/5;
  border-radius: 4px;
  position: relative;
  background:
    linear-gradient(200deg, rgba(20,19,15,0.05), rgba(20,19,15,0.55) 80%),
    url('assets/images/hero-daybed-16x9.jpg') center 38% / cover no-repeat;
    overflow:hidden;
  border: 1px solid var(--line);
}
.product-visual::before{
  content:'';
  position:absolute; inset: 10%;
  border: 1px solid rgba(245,243,238,0.14);
  border-radius: 2px;
}
.product-visual .cap{
  position:absolute; bottom: 26px; left: 26px; right:26px;
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-faint);
  display:flex; justify-content:space-between;
  z-index: 2;
}

/* ---------- PRODUCT GALLERY (Shop page swipeable images) ---------- */
.gallery-track{ position:absolute; inset:0; }
.gallery-slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 0.5s var(--ease);
}
.gallery-slide.active{ opacity:1; }
.gallery-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border-radius:50%;
  background: rgba(20,19,15,0.5); color: var(--paper);
  border:none; cursor:pointer; font-size:20px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  z-index:3; transition: background 0.3s var(--ease);
  font-family: inherit;
}
.gallery-arrow:hover{ background: rgba(20,19,15,0.78); }
.gallery-arrow.prev{ left:16px; }
.gallery-arrow.next{ right:16px; }
.gallery-dots{
  position:absolute; bottom:58px; left:0; right:0;
  display:flex; justify-content:center; gap:8px; z-index:3;
}
.gallery-dots .dot{
  width:6px; height:6px; border-radius:50%; border:none; padding:0;
  background: rgba(245,243,238,0.4); cursor:pointer;
  transition: background 0.3s var(--ease), transform 0.3s var(--ease);
}
.gallery-dots .dot.active{ background: var(--paper); transform:scale(1.3); }
.heat-rings{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  z-index:1; pointer-events:none;
}
.heat-rings svg{ width:64%; height:64%; }
.heat-rings circle{
  fill:none; stroke: var(--ice); vector-effect: non-scaling-stroke;
  animation: heatPulse 6s var(--ease) infinite;
}
.heat-rings circle:nth-child(1){ stroke-width:1; opacity:0.55; animation-delay: 0s; }
.heat-rings circle:nth-child(2){ stroke-width:1; opacity:0.38; animation-delay: 1.2s; }
.heat-rings circle:nth-child(3){ stroke-width:1; opacity:0.24; animation-delay: 2.4s; }
.heat-rings circle:nth-child(4){ stroke-width:1; opacity:0.14; animation-delay: 3.6s; }
.heat-rings .core{ fill: var(--ice); opacity:0.9; animation:none; }
@keyframes heatPulse{
  0%{ transform: scale(0.94); opacity: 0; }
  12%{ opacity: 1; }
  70%{ opacity: 0.18; }
  100%{ transform: scale(1.35); opacity: 0; }
}
@media (prefers-reduced-motion: reduce){
  .heat-rings circle{ animation: none; opacity: 0.3; }
}
.product-copy .eyebrow{ margin-bottom: 18px; display:block; }
.product-copy h2{ font-size: clamp(30px, 3.6vw, 48px); color: var(--ink); margin-bottom: 22px; line-height:1.15; }
.product-copy p{ color: var(--ink-dim); font-size: 16px; max-width: 42ch; margin-bottom: 40px; }
.feature-list{ list-style:none; display:grid; gap:22px; }
.feature-list li{ display:flex; gap:16px; align-items:flex-start; font-size:14px; color: var(--ink-dim); }
.feature-list .ico{
  width:18px; height:18px; flex:none; margin-top:2px;
  border: 1px solid var(--ice); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.feature-list .ico::after{ content:''; width:6px; height:6px; background: var(--ice); border-radius:50%; }
.feature-list strong{ color: var(--ink); font-weight:500; display:block; margin-bottom:2px; font-family:'Inter'; }
.product-actions{ display:flex; align-items:center; gap:28px; flex-wrap:wrap; }

/* ---------- PRODUCT DETAILS (light, catalog-style detail shots) ---------- */
.product-details{ padding: 100px 0; border-top: 1px solid var(--line); }
.details-head{ margin-bottom: 50px; }
.details-head h2{ font-size: clamp(24px, 2.8vw, 32px); color: var(--ink); font-weight: 400; margin-top: 10px; }
.detail-grid{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 40px; }
.detail-card{ display:flex; flex-direction:column; }
.detail-img{
  aspect-ratio: 4/3; border-radius: 4px; margin-bottom: 22px; border: 1px solid var(--line);
  background-size: cover; background-position: center;
}
.detail-img.controller{ background-image: url('assets/images/shop-controller-1x1.jpg'); }
.detail-img.material{ background-image: url('assets/images/assessment-hand-1x1.jpg'); }
.detail-card h3{ font-size: 19px; color: var(--ink); font-weight: 400; line-height: 1.3; margin-bottom: 10px; }
.detail-card p{ font-size: 14px; color: var(--ink-dim); }
@media (max-width: 700px){
  .detail-grid{ grid-template-columns: 1fr; }
}

/* ---------- EXPLORE NORDIC RITUAL (light) ---------- */
.explore{ padding: 140px 0 160px; border-top: 1px solid var(--line); }
.explore-head{ max-width: 56ch; margin-bottom: 64px; }
.explore-head h2{ font-size: clamp(28px, 3.4vw, 42px); color: var(--ink); margin-top: 16px; line-height:1.2; }
.explore-head p{ color: var(--ink-dim); font-size: 16px; margin-top: 18px; }
.explore-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.explore-card{
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 36px 28px;
  display:flex; flex-direction:column; gap: 60px;
  transition: border-color 0.4s var(--ease), background 0.4s var(--ease), transform 0.4s var(--ease);
}
.explore-card:hover{ border-color: var(--line-strong); background: rgba(43,42,36,0.025); transform: translateY(-3px); }
.explore-card .tag{
  font-size: 10px; letter-spacing: 0.14em; text-transform:uppercase; color: var(--ink-faint);
  border: 1px solid var(--line-strong); border-radius: 20px; padding: 5px 12px; width: fit-content;
}
.explore-card h3{ font-size: 21px; color: var(--ink); font-weight:400; }
.explore-card p{ font-size: 13.5px; color: var(--ink-dim); margin-top: 8px; }
.explore-card .go{
  font-size: 12px; letter-spacing: 0.06em; color: var(--ice);
  display:flex; align-items:center; gap:8px; margin-top:auto;
}

/* ---------- COMING SOON PAGE (light) ---------- */
.coming-soon-body{ padding: 90px 0 150px; }
.coming-soon-body .vision{
  max-width: 60ch;
  color: var(--ink-dim);
  font-size: 17px;
  padding-top: 46px;
  margin-top: 46px;
  border-top: 1px solid var(--line);
}
.coming-soon-body .vision strong{ color: var(--ink); font-weight: 500; }

.signup{
  margin-top: 64px;
  padding: 40px;
  border: 1px solid var(--line);
  border-radius: 4px;
  max-width: 480px;
  background: var(--cream-2);
}
.signup .tag{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color: var(--ice); margin-bottom: 14px; display:block; }
.signup h3{ font-size: 20px; color: var(--ink); margin-bottom: 10px; font-weight:400; }
.signup p{ font-size: 13.5px; color: var(--ink-dim); margin-bottom: 22px; }
.ph{ border-bottom: 1px dashed var(--line-strong); cursor: help; }
.signup-form{ display:flex; gap: 10px; }
.signup-success{ font-size: 14px; color: var(--ice); }
.signup-error{ flex-basis: 100%; font-size: 12.5px; color: var(--sand); margin-top: 8px; }
.signup-form input{
  flex:1; background: var(--cream); border: 1px solid var(--line-strong); border-radius: 2px;
  padding: 13px 16px; color: var(--ink); font-family:'Inter'; font-size: 14px; font-weight:300;
}
.signup-form input::placeholder{ color: var(--ink-faint); }
.signup-form input:focus{ outline:none; border-color: var(--ice); }
.signup-form button{ padding: 13px 22px; font-size: 12px; }

/* ---------- RECOVERY ASSESSMENT (blends into light body, subtle tone shift) ---------- */
.assessment{
  background: var(--cream-2);
  color: var(--ink);
  padding: 140px 0;
}
.assessment-inner{ display:grid; grid-template-columns: 1.1fr 0.9fr; gap: 80px; align-items:center; }
.assessment .eyebrow{ color: var(--sage-muted); }
.assessment h2{ font-size: clamp(30px, 3.6vw, 46px); line-height:1.2; margin: 18px 0 24px; font-weight:400; }
.assessment p{ color: var(--ink-dim); font-size: 16px; max-width: 46ch; margin-bottom: 34px; }
.assessment-steps{ display:grid; gap: 0; border-top: 1px solid var(--line); }
.assessment-steps .step{
  display:flex; gap: 22px; padding: 22px 0;
  border-bottom: 1px solid var(--line);
}
.assessment-steps .step .n{ font-family:'Fraunces', serif; font-size: 14px; color: var(--sage-muted); }
.assessment-steps .step .t{ font-size: 14px; font-weight: 500; }
.assessment-steps .step .d{ font-size: 13px; color: var(--ink-faint); margin-top: 4px; font-weight:300; }
.assessment-card{
  background:
    linear-gradient(200deg, rgba(20,19,15,0.35) 0%, rgba(20,19,15,0.88) 65%),
    url('assets/images/assessment-hand-1x1.jpg') center / cover no-repeat,
    var(--charcoal-950);
  color: var(--paper);
  border-radius: 4px; padding: 44px;
  position: relative;
}
.assessment-card .tag{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color: var(--ice); margin-bottom: 20px; display:block; }
.assessment-card h3{ font-size: 26px; font-weight:400; margin-bottom:14px; line-height:1.3; }
.assessment-card p{ font-size: 14px; color: var(--paper-dim); margin-bottom: 30px; }
.assessment-card .btn-primary{ width:100%; text-align:center; background: var(--ice); color: var(--charcoal-950); }
.assessment-card .btn-primary:hover{ background: var(--paper); }

/* ---------- TRUST STRIP (light) ---------- */
.trust{ padding: 100px 0; border-bottom: 1px solid var(--line); }
.trust-inner{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.trust-item{ text-align:left; }
.trust-item .n{ font-family:'Fraunces', serif; font-size: 15px; color: var(--ice); margin-bottom: 14px; }
.trust-item p{ font-size: 14px; color: var(--ink-dim); max-width: 24ch; }

/* ---------- COMPARE (light) ---------- */
.compare{ padding: 140px 0; border-top: 1px solid var(--line); }
.compare-head{ max-width: 56ch; margin-bottom: 56px; }
.compare-head h2{ font-size: clamp(28px, 3.4vw, 42px); color: var(--ink); margin-top: 16px; line-height:1.2; }
.compare-head p{ color: var(--ink-dim); font-size: 16px; margin-top: 18px; }
.compare-table-wrap{ overflow-x: auto; }
.compare-table{ border: 1px solid var(--line); border-radius: 4px; min-width: 640px; }
.compare-row{
  display:grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; align-items:center;
  gap: 16px; padding: 22px 28px; border-bottom: 1px solid var(--line);
}
.compare-row:last-child{ border-bottom:none; }
.compare-row.head{
  background: var(--cream-2);
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-faint);
}
.compare-row.head .col-brand{ color: var(--ice); font-weight:500; }
.compare-feature{ font-size: 14px; color: var(--ink); }
.compare-cell{ display:flex; justify-content:center; text-align:center; }
.compare-yes, .compare-no{
  width:22px; height:22px; border-radius:50%; flex:none;
  display:flex; align-items:center; justify-content:center; font-size:11px;
}
.compare-yes{ background: var(--ice-soft); color: var(--ice); }
.compare-no{ border: 1px solid var(--line-strong); color: var(--ink-faint); }
.compare-dash{ color: var(--ink-faint); font-size:13px; }

/* ---------- SPEC STRIP (light, cream-2 closing facts) ---------- */
.spec-strip{ background: var(--cream-2); padding: 44px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.spec-strip .items{ display:flex; flex-wrap:wrap; justify-content:center; row-gap: 10px; }
.spec-strip .items span{
  font-size: 12.5px; letter-spacing: 0.06em; color: var(--ink-dim);
  padding: 0 22px; border-right: 1px solid var(--line-strong);
}
.spec-strip .items span:last-child{ border-right:none; }

/* ---------- HOMEPAGE FAQ (light) ---------- */
.home-faq{ padding: 120px 0; border-top: 1px solid var(--line); }
.home-faq-head{ max-width: 56ch; margin-bottom: 44px; }
.home-faq-head h2{ font-size: clamp(28px, 3.4vw, 42px); color: var(--ink); margin-top: 16px; line-height:1.2; }
.home-faq-list{ max-width: 780px; border-top: 1px solid var(--line); }
.home-faq-more{
  display:inline-flex; align-items:center; gap:8px; margin-top: 34px;
  font-size: 13px; color: var(--ice); transition: gap 0.3s var(--ease);
}
.home-faq-more:hover{ gap: 12px; }

/* ---------- REVIEWS (light, cream-2 rhythm break) ---------- */
.reviews{ background: var(--cream-2); padding: 110px 0; border-bottom: 1px solid var(--line); }
.reviews-head{ text-align:center; max-width: 560px; margin: 0 auto 60px; }
.reviews-head .eyebrow{ color: var(--sage-muted); }
.reviews-head h2{ font-size: clamp(28px, 3.4vw, 42px); font-weight:400; color: var(--ink); margin: 18px 0 22px; }
.example-tag{
  display:inline-block; font-size: 11.5px; letter-spacing:0.04em; color: var(--ink-faint);
  border: 1px dashed var(--line-strong); border-radius: 20px; padding: 7px 16px; cursor: help;
}
.reviews-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.review-card{
  background: var(--cream); border: 1px solid var(--line); border-radius: 6px;
  padding: 34px 30px;
}
.review-card .stars{ color: var(--ice); font-size: 15px; letter-spacing: 3px; margin-bottom: 18px; }
.review-card .quote{ font-size: 15px; line-height: 1.7; color: var(--ink-dim); margin-bottom: 26px; }
.review-card .reviewer{ display:flex; flex-direction:column; gap: 2px; }
.review-card .reviewer .name{ font-family:'Fraunces', serif; font-size: 15px; color: var(--ink); }
.review-card .reviewer .detail{ font-size: 12.5px; color: var(--ink-faint); }

/* ---------- CTA BAND (dark bookend before footer) ---------- */
.cta-band{
  background: var(--charcoal-950);
  color: var(--paper);
  padding: 150px 0;
  text-align:center;
  position:relative;
  border-top: 1px solid var(--line-dark);
}
.cta-band h2{ font-size: clamp(32px, 5vw, 60px); color: var(--paper-bright); max-width: 18ch; margin: 0 auto 30px; line-height:1.1; }
.cta-band p{ color: var(--paper-dim); max-width: 42ch; margin: 0 auto 44px; font-size:16px; }
.cta-band .btn-primary{ background: var(--ice); color: var(--charcoal-950); }
.cta-band .btn-primary:hover{ background: var(--paper); }
.cta-band .btn-ghost{ color: var(--paper-dim); border-color: var(--line-dark-strong); }
.cta-band .btn-ghost:hover{ color: var(--ice); border-color: var(--ice); }

/* ---------- FOOTER (dark bookend) ---------- */
footer{ background: var(--charcoal-950); color: var(--paper); padding: 80px 0 40px; border-top: 1px solid var(--line-dark); }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 50px; margin-bottom: 70px; }
.footer-brand .wordmark{ margin-bottom: 18px; display:inline-flex; }
.footer-brand p{ font-size: 14px; color: var(--paper-faint); max-width: 32ch; }
.footer-social{ display:flex; gap: 16px; margin-top: 22px; }
.footer-social a{ color: var(--paper-faint); transition: color 0.3s var(--ease); }
.footer-social a:hover{ color: var(--ice); }
.footer-social svg{ width: 18px; height: 18px; display:block; }
.footer-col h4{ font-size: 12px; letter-spacing:0.1em; text-transform:uppercase; color: var(--paper-faint); margin-bottom: 20px; font-weight:500; }
.footer-col ul{ list-style:none; display:grid; gap: 12px; }
.footer-col a{ font-size: 14px; color: var(--paper-dim); transition: color 0.3s var(--ease); }
.footer-col a:hover{ color: var(--paper); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top: 30px; border-top: 1px solid var(--line-dark);
  font-size: 12px; color: var(--paper-faint);
}

/* ---------- JOURNAL (light) ---------- */
.journal-hero{ padding: calc(200px + var(--announce-h)) 0 70px; border-bottom: 1px solid var(--line); }
.journal-hero h1{ font-size: clamp(38px, 5.6vw, 66px); color: var(--ink); max-width: 18ch; line-height: 1.12; margin-top: 20px; }
.journal-hero .lede{ margin-top: 24px; max-width: 54ch; font-size: 17px; color: var(--ink-dim); }
.journal-search{ margin-top: 44px; max-width: 420px; position: relative; }
.journal-search input{
  width: 100%; background: transparent; border: 1px solid var(--line-strong); border-radius: 2px;
  padding: 14px 18px 14px 42px; color: var(--ink); font-family: 'Inter'; font-size: 14px; font-weight: 300;
}
.journal-search input::placeholder{ color: var(--ink-faint); }
.journal-search input:focus{ outline: none; border-color: var(--ice); }
.journal-search .icon{ position: absolute; left: 17px; top: 50%; width: 13px; height: 13px; margin-top: -8px; border: 1px solid var(--ink-faint); border-radius: 50%; }
.journal-search .icon::after{ content:''; position:absolute; width: 6px; height: 1px; background: var(--ink-faint); transform: rotate(45deg); right: -6px; bottom: 0px; }

.category-pills{ display:flex; flex-wrap: wrap; gap: 10px; margin-top: 40px; }
.category-pills span{ font-size: 12px; letter-spacing: 0.04em; color: var(--ink-dim); border: 1px solid var(--line-strong); border-radius: 20px; padding: 8px 16px; }
.category-pills span.soon{ color: var(--ink-faint); border-style: dashed; }

.sample-tag{
  display:inline-flex; align-items:center; gap:6px;
  font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sand-deep);
  border: 1px dashed rgba(156,133,99,0.5); border-radius: 20px; padding: 5px 12px;
}
.sample-tag::before{ content:''; width:5px; height:5px; border-radius:50%; background: var(--sand-deep); }

.featured-article{ padding: 90px 0; border-bottom: 1px solid var(--line); }
.featured-article-inner{ display:grid; grid-template-columns: 1.1fr 1fr; gap: 70px; align-items: center; }
.featured-visual{
  aspect-ratio: 4/3; border-radius: 4px; position: relative; overflow:hidden; border: 1px solid var(--line);
  background: radial-gradient(ellipse 70% 60% at 25% 25%, rgba(92,107,77,0.20), transparent 60%), radial-gradient(ellipse 60% 55% at 80% 80%, rgba(216,201,179,0.18), transparent 60%), linear-gradient(155deg, var(--charcoal-800), var(--charcoal-950));
}
.article-meta{ display:flex; align-items:center; gap: 12px; font-size: 12px; letter-spacing: 0.04em; color: var(--ink-faint); margin-bottom: 20px; text-transform: uppercase; flex-wrap: wrap; }
.article-meta .cat{ color: var(--ice); }
.article-meta .dot{ width: 3px; height: 3px; border-radius: 50%; background: var(--ink-faint); }
.featured-article h2{ font-size: clamp(28px, 3.4vw, 42px); color: var(--ink); line-height: 1.2; margin-bottom: 20px; }
.featured-article p.excerpt{ color: var(--ink-dim); font-size: 16px; max-width: 46ch; margin-bottom: 30px; }

.articles-section{ padding: 100px 0 40px; }
.articles-head{ margin-bottom: 50px; }
.articles-head h2{ font-size: clamp(24px, 2.8vw, 32px); color: var(--ink); font-weight: 400; }
.article-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding-bottom: 100px; }
.journal-empty{ display:none; text-align:center; color: var(--ink-faint); font-size: 14px; padding-bottom: 100px; }
.article-card{ display:flex; flex-direction:column; }
.article-card .thumb{
  aspect-ratio: 4/3; border-radius: 4px; margin-bottom: 22px; border: 1px solid var(--line);
  background: linear-gradient(155deg, rgba(20,19,15,0.05), rgba(20,19,15,0.25)), url('assets/images/journal-steam-1x1.jpg') center / cover no-repeat;
  transition: border-color .4s var(--ease);
}
.article-card:hover .thumb{ border-color: var(--line-strong); }
.article-card.soon .thumb{ opacity: 0.45; }
.article-card h3{ font-size: 19px; color: var(--ink); font-weight: 400; line-height: 1.3; margin-bottom: 10px; }
.article-card p{ font-size: 13.5px; color: var(--ink-dim); }
.article-card .soon-tag{ font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-faint); }

.newsletter-band{ background: var(--cream-2); color: var(--ink); padding: 100px 0; text-align:center; }
.newsletter-band .eyebrow{ color: var(--sage-muted); }
.newsletter-band h2{ font-size: clamp(26px, 3.2vw, 38px); margin: 18px 0 16px; font-weight: 400; }
.newsletter-band p{ color: var(--ink-dim); max-width: 46ch; margin: 0 auto 34px; font-size: 15px; }
.newsletter-band .signup-form{ max-width: 420px; margin: 0 auto; }
.newsletter-band .signup-form input{ background: var(--cream); border-color: var(--line-strong); color: var(--ink); }
.newsletter-band .signup-form input::placeholder{ color: var(--ink-faint); }
.newsletter-band .signup-form button{ background: var(--ink); color: var(--cream); }
.newsletter-band .signup-form button:hover{ background: var(--ice); }

/* ---------- ARTICLE PAGE (light) ---------- */
.article-header{ padding: calc(200px + var(--announce-h)) 0 60px; border-bottom: 1px solid var(--line); }
.article-header .back-link{ display:inline-flex; align-items:center; gap:8px; font-size:13px; color: var(--ink-faint); margin-bottom: 32px; transition: color .3s var(--ease); }
.article-header .back-link:hover{ color: var(--ice); }
.article-header h1{ font-size: clamp(32px, 5vw, 54px); color: var(--ink); max-width: 20ch; line-height: 1.15; margin: 20px 0 24px; }
.article-header .dek{ font-size: 18px; color: var(--ink-dim); max-width: 54ch; margin-bottom: 34px; }
.article-byline{ display:flex; align-items:center; gap: 16px; font-size: 13px; color: var(--ink-faint); }
.article-byline .avatar{ width: 34px; height: 34px; border-radius: 50%; background: var(--ice-soft); display:flex; align-items:center; justify-content:center; font-family:'Fraunces'; font-size: 13px; color: var(--ice); flex: none; }

.article-layout{ padding: 80px 0 120px; display: grid; grid-template-columns: 220px 1fr; gap: 80px; align-items: start; }
.article-toc{ position: sticky; top: calc(120px + var(--announce-h)); }
.article-toc .label{ font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 18px; display:block; }
.article-toc ul{ list-style:none; display:grid; gap: 14px; border-left: 1px solid var(--line); }
.article-toc a{ font-size: 13.5px; color: var(--ink-dim); padding-left: 16px; display:block; transition: color .3s var(--ease); }
.article-toc a:hover{ color: var(--ice); }
.article-body{ max-width: 680px; font-size: 17px; color: var(--ink-dim); line-height: 1.85; }
.article-body h2{ font-size: 26px; color: var(--ink); margin: 52px 0 20px; font-weight: 400; }
.article-body p{ margin-bottom: 24px; }
.article-body p.lead{ font-size: 19px; color: var(--ink); }

.article-share{ display:flex; align-items:center; gap: 18px; margin-top: 60px; padding-top: 40px; border-top: 1px solid var(--line); max-width: 680px; }
.article-share .label{ font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-faint); }
.article-share .icons{ display:flex; gap: 12px; }
.article-share button{
  width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line-strong); background: transparent;
  color: var(--ink-dim); font-family: 'Inter'; font-size: 12px; cursor: pointer; transition: border-color .3s var(--ease), color .3s var(--ease);
}
.article-share button:hover{ border-color: var(--ice); color: var(--ice); }

.related-section{ border-top: 1px solid var(--line); padding: 90px 0 20px; }
.related-section h2{ font-size: clamp(22px, 2.6vw, 28px); color: var(--ink); font-weight: 400; margin-bottom: 40px; }

/* ---------- ABOUT (light, with dark closing bookend) ---------- */
.about-hero{
  min-height: 92vh; display:flex; flex-direction:column; justify-content:center;
  padding: calc(160px + var(--announce-h)) 0 100px; text-align:center; border-bottom: 1px solid var(--line);
  position: relative;
}
.about-hero::before{
  content:'';
  position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(rgba(247,243,236,0.70), rgba(247,243,236,0.54) 55%, rgba(247,243,236,0.74)),
    url('assets/images/about-street-16x9.jpg') center 35% / cover no-repeat;
}
.about-hero .wrap{ position:relative; z-index:1; }
.about-hero .eyebrow{ display:block; margin-bottom: 30px; }
.about-hero h1{ font-size: clamp(44px, 7.2vw, 104px); line-height: 1.05; letter-spacing: -0.03em; color: var(--ink); max-width: 16ch; margin: 0 auto; }
.about-hero .sub{ font-size: clamp(18px, 2vw, 24px); color: var(--ink-dim); font-family: 'Fraunces'; font-style: italic; font-weight: 300; margin: 34px auto 0; max-width: 24ch; }

.about-section{ padding: 150px 0; border-bottom: 1px solid var(--line); }
.about-section.tight{ padding: 110px 0; }
.about-section > .wrap > .eyebrow{ display:block; margin-bottom: 26px; }
.about-narrow{ max-width: 760px; }
.about-narrow.center{ margin: 0 auto; text-align: center; }
.about-statement{ font-size: clamp(26px, 3.4vw, 44px); color: var(--ink); line-height: 1.3; font-weight: 400; }

.about-words{ display:flex; flex-wrap:wrap; justify-content:center; margin: 40px 0; font-family: 'Fraunces'; font-style: italic; font-size: clamp(17px, 2.1vw, 24px); color: var(--ink-dim); }
.about-words span{ padding: 0 20px; position: relative; }
.about-words span:not(:last-child)::after{ content:'·'; position:absolute; right: -3px; color: var(--line-strong); font-style: normal; }

.about-punch{ font-size: clamp(24px, 3vw, 34px); color: var(--ink); font-weight: 400; line-height: 1.35; text-align:center; margin-top: 10px; }

.manifesto{ display:grid; gap: 0; margin-top: 10px; }
.manifesto-row{ display:grid; grid-template-columns: 1fr 1.3fr; gap: 40px; padding: 40px 0; border-top: 1px solid var(--line); align-items: baseline; }
.manifesto-row:last-child{ border-bottom: 1px solid var(--line); }
.manifesto-row h3{ font-size: clamp(22px, 2.6vw, 30px); color: var(--ink); font-weight: 400; }
.manifesto-row p{ color: var(--ink-dim); font-size: 16px; max-width: 42ch; }
.manifesto-row.reveal:nth-child(1){ transition-delay: 0s; }
.manifesto-row.reveal:nth-child(2){ transition-delay: .08s; }
.manifesto-row.reveal:nth-child(3){ transition-delay: .16s; }
.manifesto-row.reveal:nth-child(4){ transition-delay: .24s; }
.manifesto-row.reveal:nth-child(5){ transition-delay: .32s; }

.about-build-words{ display:flex; flex-wrap:wrap; gap: 18px 0; margin: 36px 0 30px; }
.about-build-words span{
  font-family: 'Fraunces'; font-size: clamp(22px, 3.2vw, 38px); color: var(--ink-faint); font-weight: 300;
  padding-right: 26px; margin-right: 26px; border-right: 1px solid var(--line);
}
.about-build-words span:last-child{ border-right:none; padding-right:0; margin-right:0; }
.about-build-words span.reveal{ transform: translateY(10px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.about-build-words span.reveal:nth-child(1){ transition-delay: 0s; }
.about-build-words span.reveal:nth-child(2){ transition-delay: .07s; }
.about-build-words span.reveal:nth-child(3){ transition-delay: .14s; }
.about-build-words span.reveal:nth-child(4){ transition-delay: .21s; }
.about-build-words span.reveal:nth-child(5){ transition-delay: .28s; }

.about-split{ display:grid; grid-template-columns: 0.9fr 1.1fr; gap: 80px; align-items:start; }
.about-split .about-statement{ max-width: 12ch; }
.about-split p{ color: var(--ink-dim); font-size: 16px; max-width: 48ch; }

.about-closing{
  background: var(--charcoal-950); color: var(--paper);
  min-height: 68vh; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding: 140px 0;
  border-top: 1px solid var(--line-dark); border-bottom: none;
}
.about-closing .lead{ font-size: clamp(26px, 3.6vw, 44px); color: var(--paper-bright); line-height: 1.3; max-width: 18ch; }
.about-closing .accent{ font-size: clamp(26px, 3.6vw, 44px); color: var(--ice); font-family: 'Fraunces'; font-style: italic; font-weight: 300; line-height: 1.3; margin-top: 6px; }
.about-closing .btn-ghost{ margin-top: 50px; color: var(--paper-dim); border-color: var(--line-dark-strong); }
.about-closing .btn-ghost:hover{ color: var(--ice); border-color: var(--ice); }

/* ---------- SUPPORT (light) ---------- */
.ai-reserve{
  border: 1px dashed rgba(92,107,77,0.4); border-radius: 4px; padding: 34px 38px;
  display:flex; align-items:center; justify-content:space-between; gap: 30px; flex-wrap:wrap;
  background: rgba(92,107,77,0.05);
}
.ai-reserve .tag{ font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ice); margin-bottom:10px; display:block; }
.ai-reserve h3{ font-size:20px; color:var(--ink); font-weight:400; margin-bottom:8px; }
.ai-reserve p{ font-size:14px; color:var(--ink-dim); max-width:46ch; }
.ai-reserve .status{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-faint); border:1px dashed var(--line-strong); border-radius:20px; padding:8px 16px; flex:none; }

.support-grid{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
.support-card{ border:1px solid var(--line); border-radius:4px; padding:36px; transition: border-color .3s var(--ease); }
.support-card:hover{ border-color: var(--line-strong); }
.support-card .icon{ width:26px; height:26px; color:var(--ice); margin-bottom:22px; display:block; }
.support-card h3{ font-size:19px; color:var(--ink); font-weight:400; margin-bottom:10px; }
.support-card .topics{ font-size:13.5px; color:var(--ink-dim); margin-bottom:18px; }
.support-card a.go{ font-size:12.5px; color:var(--ice); display:inline-flex; align-items:center; gap:6px; }
.support-card.reveal:nth-child(1){ transition-delay: 0s; }
.support-card.reveal:nth-child(2){ transition-delay: .08s; }
.support-card.reveal:nth-child(3){ transition-delay: .16s; }
.support-card.reveal:nth-child(4){ transition-delay: .24s; }

.faq-item{ border-bottom: 1px solid var(--line); }
.faq-item summary{ cursor:pointer; padding: 26px 0; font-size: 17px; color: var(--ink); font-family:'Fraunces'; font-weight:400; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:'+'; font-family:'Inter'; font-size:22px; font-weight:300; color:var(--ink-faint); transition: transform .3s var(--ease); flex:none; }
.faq-item[open] summary::after{ transform: rotate(45deg); }
.faq-item .faq-a{ display:grid; grid-template-rows: 0fr; transition: grid-template-rows .35s var(--ease); }
.faq-item[open] .faq-a{ grid-template-rows: 1fr; }
.faq-item .faq-a-inner{ overflow:hidden; }
.faq-item .faq-a-inner p{ padding-bottom: 26px; color: var(--ink-dim); font-size:15px; max-width:60ch; }

.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:70px; align-items:start; }
.contact-form{ display:grid; gap:18px; }
.contact-form input, .contact-form textarea{
  width:100%; background:transparent; border:1px solid var(--line-strong); border-radius:2px;
  padding:14px 16px; color:var(--ink); font-family:'Inter'; font-size:14px; font-weight:300;
}
.contact-form textarea{ min-height:140px; resize:vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder{ color:var(--ink-faint); }
.contact-form input:focus, .contact-form textarea:focus{ outline:none; border-color:var(--ice); }
.contact-note{ font-size:14px; color:var(--ink-dim); margin-top: 8px; max-width: 40ch; }
.contact-note + .contact-note{ margin-top: 14px; }

/* ---------- RECOVERY ADVISOR (light shell, dark answer cards) ---------- */
.preview-badge{
  display:inline-flex; align-items:center; gap:8px;
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sand-deep);
  border: 1px dashed rgba(156,133,99,0.5); border-radius: 20px; padding: 7px 16px;
}
.preview-badge::before{ content:''; width:5px; height:5px; border-radius:50%; background: var(--sand-deep); flex:none; }

.advisor-hero{ padding: calc(180px + var(--announce-h)) 0 60px; text-align:center; }
.advisor-hero .eyebrow{ display:block; margin-bottom: 22px; }
.advisor-hero h1{ font-size: clamp(38px, 5.6vw, 64px); color: var(--ink); }
.advisor-hero p.sub{ margin: 22px auto 0; max-width: 50ch; color: var(--ink-dim); font-size: 16px; }
.advisor-hero .preview-badge{ margin-top: 28px; }

.advisor-shell{ max-width: 760px; margin: 0 auto; padding: 50px 0 140px; }

.advisor-empty .prompt{ text-align:center; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 26px; }
.suggestion-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.suggestion-card{
  text-align:left; background: var(--cream-2); border: 1px solid var(--line);
  border-radius: 10px; padding: 18px 20px; color: var(--ink-dim); font-family: 'Inter'; font-size: 14px;
  cursor: pointer; transition: border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease);
}
.suggestion-card:hover{ border-color: var(--line-strong); background: var(--stone); transform: translateY(-2px); }

.advisor-thread{ display:none; flex-direction: column; gap: 44px; }
.advisor-thread.active{ display:flex; }
.advisor-empty.hidden{ display:none; }

.msg-user{ font-family:'Fraunces'; font-size: clamp(20px, 2.6vw, 27px); color: var(--ink); font-weight: 400; line-height:1.35; max-width: 34ch; }

.msg-assistant{
  background: rgba(20,19,15,0.94); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--line-dark); border-radius: 14px; padding: 30px 32px;
  color: var(--paper);
  box-shadow: 0 20px 50px rgba(20,19,15,0.18);
}
.msg-assistant .typing{ display:flex; align-items:center; gap: 8px; color: var(--paper-faint); font-size: 14px; }
.msg-assistant .typing .dots{ display:inline-flex; gap: 4px; }
.msg-assistant .typing .dots span{ width:5px; height:5px; border-radius:50%; background: var(--paper-faint); animation: nrPulse 1.2s infinite ease-in-out; }
.msg-assistant .typing .dots span:nth-child(2){ animation-delay: .18s; }
.msg-assistant .typing .dots span:nth-child(3){ animation-delay: .36s; }
@keyframes nrPulse{ 0%,80%,100%{ opacity:.25; transform: scale(0.8);} 40%{ opacity:1; transform: scale(1);} }

.msg-assistant .answer{ color: var(--paper-dim); font-size: 15.5px; line-height: 1.8; }
.msg-assistant .answer.streaming::after{ content:''; display:inline-block; width:2px; height:15px; background: var(--ice); margin-left:3px; vertical-align:-2px; animation: nrCaret .85s steps(1) infinite; }
@keyframes nrCaret{ 50%{ opacity:0; } }
.msg-assistant .answer p{ margin-bottom: 16px; }
.msg-assistant .answer p:last-child{ margin-bottom:0; }
.msg-assistant .answer strong{ color: var(--paper); font-weight: 500; }
.msg-assistant .answer ul{ margin: 4px 0 16px 20px; display:grid; gap: 8px; }
.msg-assistant .answer h4{ font-family:'Inter'; font-size: 12px; letter-spacing:0.08em; text-transform:uppercase; color: var(--ice); margin: 20px 0 10px; font-weight:500; }

.msg-assistant.error{ border-color: rgba(216,201,179,0.4); }
.msg-assistant.error .answer p{ color: var(--sand); }
.msg-assistant .retry-btn{ color: var(--ice); }

.msg-source{ margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line-dark); font-size: 12px; color: var(--paper-faint); letter-spacing: 0.02em; }
.msg-actions{ display:flex; gap: 16px; margin-top: 20px; }
.msg-actions button{
  display:flex; align-items:center; gap: 6px; background:none; border:none; color: var(--paper-faint);
  font-family:'Inter'; font-size: 12.5px; cursor:pointer; transition: color .3s var(--ease); padding:4px 0;
}
.msg-actions button:hover{ color: var(--ice); }

.advisor-composer{
  position: static; margin-top: 50px;
  background: rgba(20,19,15,0.92); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--line-dark-strong); border-radius: 16px; padding: 8px 8px 8px 22px;
  display:flex; align-items:flex-end; gap: 12px;
  box-shadow: 0 20px 50px rgba(20,19,15,0.2);
}
.advisor-composer textarea{
  flex:1; background:transparent; border:none; resize:none; color: var(--paper);
  font-family:'Inter'; font-size: 15px; font-weight:300; line-height:1.5; padding: 12px 0; max-height: 120px;
}
.advisor-composer textarea:focus{ outline:none; }
/* Only stick the composer to the bottom once a conversation is running —
   in the empty state the page is often shorter than the viewport, and a
   sticky bottom offset there overlaps the suggestion cards instead of
   sitting below them. */
.advisor-thread.active ~ .advisor-composer{ position: sticky; bottom: 24px; }
.advisor-composer textarea::placeholder{ color: var(--paper-faint); }
.advisor-composer button{
  flex:none; width: 42px; height: 42px; border-radius: 50%; border:none; background: var(--paper);
  color: var(--charcoal-950); cursor:pointer; font-size: 16px; margin-bottom: 6px;
  transition: background .3s var(--ease), transform .3s var(--ease);
}
.advisor-composer button:hover{ background: var(--ice); color: var(--paper-bright); transform: translateY(-1px); }
.advisor-composer button:disabled{ opacity: .4; cursor: default; transform:none; }

.advisor-safety{ text-align:center; font-size: 12px; color: var(--ink-faint); margin-top: 16px; max-width: 52ch; margin-left:auto; margin-right:auto; }

.advisor-entry{
  border: 1px solid var(--line); border-radius: 4px; padding: 22px 26px;
  display:flex; align-items:center; justify-content:space-between; gap: 20px; flex-wrap:wrap;
  transition: border-color .3s var(--ease);
}
.advisor-entry:hover{ border-color: var(--line-strong); }
.advisor-entry p{ font-size: 14px; color: var(--ink-dim); margin:0; }
.advisor-entry .go{ font-size: 13px; color: var(--ice); flex:none; }

/* ---------- RECOVERY ASSESSMENT FLOW (light shell, dark result card) ---------- */
.assess-shell{ max-width: 640px; margin: 0 auto; padding: calc(180px + var(--announce-h)) 0 140px; }
.assess-progress{ display:flex; align-items:center; gap: 10px; margin-bottom: 48px; }
.assess-progress .dot{ height:1px; flex:1; background: var(--line-strong); position:relative; }
.assess-progress .dot.done, .assess-progress .dot.current{ background: var(--ice); }
.assess-progress-label{ font-size: 12px; letter-spacing: 0.14em; text-transform:uppercase; color: var(--ink-faint); margin-bottom: 14px; }

.assess-step{ display:none; }
.assess-step.active{ display:block; }
.assess-step h2{ font-size: clamp(26px, 3.2vw, 36px); font-weight:400; margin-bottom: 40px; }

.assess-question{ margin-bottom: 36px; }
.assess-question h3{ font-family:'Inter'; font-size: 14px; font-weight:500; color: var(--ink); margin-bottom: 16px; }
.assess-options{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.assess-option{
  text-align:left; background: var(--cream-2); border: 1px solid var(--line);
  border-radius: 8px; padding: 14px 18px; color: var(--ink-dim); font-family:'Inter'; font-size: 13.5px;
  cursor:pointer; transition: border-color .3s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.assess-option:hover{ border-color: var(--line-strong); }
.assess-option.selected{ border-color: var(--ice); background: var(--ice-soft); color: var(--ink); }

.assess-nav{ display:flex; justify-content:space-between; align-items:center; margin-top: 44px; }
.assess-back{ font-size: 13px; color: var(--ink-faint); cursor:pointer; background:none; border:none; font-family:inherit; }
.assess-back:hover{ color: var(--ink-dim); }
.assess-continue{ cursor:pointer; }
.assess-continue:disabled{ opacity: 0.4; cursor:not-allowed; }

.assess-loading{ text-align:center; padding: 60px 0; color: var(--ink-faint); font-size: 14px; }
.assess-result{
  background: rgba(20,19,15,0.92); border: 1px solid var(--line-dark); border-radius: 14px;
  padding: 34px 36px; font-size: 15px; line-height:1.75; color: var(--paper);
}
.assess-result p{ margin-bottom: 16px; }
.assess-result p:last-child{ margin-bottom:0; }
.assess-result strong{ color: var(--paper-bright); font-weight:500; }
.assess-result-actions{ display:flex; gap: 24px; align-items:center; margin-top: 34px; flex-wrap:wrap; }

@media (max-width: 900px){
  .assess-shell{ padding: calc(150px + var(--announce-h)) 0 100px; }
  .assess-options{ grid-template-columns: 1fr; }
  .nav-inner{ justify-content: flex-start; flex-wrap: nowrap; }
  .wordmark{ margin-right:auto; font-size: 15px; letter-spacing: 0.08em; white-space: nowrap; position:relative; z-index:501; }
  .nav-toggle{ display:flex; flex-shrink:0; position:relative; z-index:501; }
  .cart-link{ position:relative; z-index:501; }
  .nav-cta{
    position: fixed; left:50%; bottom: 64px; z-index: 501;
    transform: translateX(-50%) translateY(10px);
    opacity:0; visibility:hidden; pointer-events:none;
    transition: opacity 0.3s var(--ease), transform 0.3s var(--ease);
  }
  body.nav-open .nav-cta{
    transform: translateX(-50%) translateY(0);
    opacity:1; visibility:visible; pointer-events:auto;
  }
  .nav-links{
    position: fixed; inset:0;
    flex-direction: column; align-items:center; justify-content:center;
    gap: 30px;
    background: var(--charcoal-950);
    z-index: 500;
    opacity:0; visibility:hidden; pointer-events:none;
    transition: opacity 0.35s var(--ease);
  }
  .nav-links.open{ opacity:1; visibility:visible; pointer-events:auto; }
  .nav-links a{ font-size: 22px; }
  .nav-links a.active{ text-underline-offset: 8px; }
  body.nav-open{ overflow:hidden; }
  .hero-scroll{ display:none; }
  .mission-inner, .product-grid, .assessment-inner{ grid-template-columns: 1fr; }
  .trust-inner{ grid-template-columns: repeat(2, 1fr); }
  .reviews-grid{ grid-template-columns: 1fr; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
  .explore-grid{ grid-template-columns: 1fr; }
  .product{ padding: 100px 0; }
  .assessment{ padding: 90px 0; }
  .page-intro{ padding: calc(160px + var(--announce-h)) 0 70px; }
  .signup-form{ flex-direction:column; }
  .featured-article-inner{ grid-template-columns: 1fr; }
  .article-grid{ grid-template-columns: 1fr; }
  .article-layout{ grid-template-columns: 1fr; gap: 40px; }
  .article-toc{ position: static; padding-bottom: 30px; margin-bottom: 10px; border-bottom: 1px solid var(--line); }
  .article-toc ul{ display:flex; flex-wrap:wrap; gap: 10px 22px; border-left:none; }
  .article-toc a{ padding-left:0; }
  .about-hero{ min-height: auto; padding: calc(150px + var(--announce-h)) 0 80px; }
  .manifesto-row{ grid-template-columns: 1fr; gap: 14px; }
  .about-split{ grid-template-columns: 1fr; gap: 30px; }
  .about-section{ padding: 100px 0; }
  .support-grid{ grid-template-columns: 1fr; }
  .contact-grid{ grid-template-columns: 1fr; gap: 50px; }
  .ai-reserve{ flex-direction:column; align-items:flex-start; }
  .suggestion-grid{ grid-template-columns: 1fr; }
  .advisor-entry{ flex-direction:column; align-items:flex-start; }
  .compare{ padding: 90px 0; }
  .spec-strip .items span{ padding: 0 14px; font-size: 11.5px; }
  .home-faq{ padding: 90px 0; }
}