/* ==========================================================================
   EVOLVE — styles.css
   Design tokens → base → layout primitives → components → sections → states
   ========================================================================== */

/* ---------------------------------------------------------------------
   1. DESIGN TOKENS
   --------------------------------------------------------------------- */
:root{
  /* Light theme (default) */
  --bg-primary:#FAF8F3;
  --bg-secondary:#F1ECE1;
  --bg-elevated:#FFFFFF;
  --bg-inverse:#17150F;

  --text-primary:#17150F;
  --text-secondary:#5C584C;
  --text-tertiary:#8C8778;
  --text-inverse:#FAF8F3;

  --accent:#8C6A2E;
  --accent-strong:#6E5322;
  --accent-soft:#EFE4CC;
  --accent-on-accent:#FAF8F3;

  --border:#E3DCCC;
  --border-strong:#C9C0AA;

  --success:#3E7A57;
  --error:#AE4630;

  --focus-ring:#8C6A2E;

  /* Typography */
  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:'IBM Plex Mono', 'SFMono-Regular', monospace;

  --fs-eyebrow:0.8125rem;
  --fs-body:1rem;
  --fs-lede:clamp(1.125rem, 1.5vw, 1.375rem);
  --fs-h1:clamp(2.125rem, 7.5vw + 0.25rem, 4.75rem);
  --fs-h2:clamp(1.75rem, 5vw + 0.1rem, 3.25rem);
  --fs-h3:clamp(1.375rem, 2vw, 1.75rem);
  --fs-stat:clamp(2.5rem, 8vw, 4.25rem);

  /* Spacing */
  --space-1:0.25rem;
  --space-2:0.5rem;
  --space-3:0.75rem;
  --space-4:1rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-12:3rem;
  --space-16:4rem;
  --space-24:6rem;
  --space-32:8rem;

  --container-w:1240px;
  --radius-sm:2px;
  --radius-md:4px;

  /* Motion */
  --ease-out:cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro:200ms;
  --dur-normal:350ms;
  --dur-large:600ms;
  --dur-hero:1100ms;

  --header-h:64px;
  --safe-top:env(safe-area-inset-top, 0px);
  --safe-bottom:env(safe-area-inset-bottom, 0px);
  --safe-left:env(safe-area-inset-left, 0px);
  --safe-right:env(safe-area-inset-right, 0px);
}

[data-theme="dark"]{
  --bg-primary:#0C0B08;
  --bg-secondary:#161410;
  --bg-elevated:#1D1A14;
  --bg-inverse:#FAF8F3;

  --text-primary:#F3EFE4;
  --text-secondary:#B7B0A0;
  --text-tertiary:#847D6C;
  --text-inverse:#17150F;

  --accent:#D6AD5D;
  --accent-strong:#EAC784;
  --accent-soft:#332A16;
  --accent-on-accent:#17150F;

  --border:#2C2820;
  --border-strong:#3F392C;

  --success:#63A582;
  --error:#D2705A;

  --focus-ring:#D6AD5D;
}

/* ---------------------------------------------------------------------
   2. RESET / BASE
   --------------------------------------------------------------------- */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 8px); -webkit-text-size-adjust:100%; text-size-adjust:100%; color-scheme:light; }
[data-theme="dark"]{ color-scheme:dark; }
[hidden]{ display:none !important; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}

body{
  margin:0;
  background:var(--bg-primary);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  overflow-wrap:break-word;
  -webkit-tap-highlight-color:transparent;
  transition:background-color var(--dur-normal) var(--ease-in-out), color var(--dur-normal) var(--ease-in-out);
}

img{ max-width:100%; display:block; }
svg{ overflow:visible; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; touch-action:manipulation; }
input, textarea, select{ font:inherit; color:inherit; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4,p{ margin:0; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:1rem; top:-6rem;
  background:var(--accent); color:var(--accent-on-accent);
  padding:0.75rem 1.25rem; border-radius:var(--radius-sm);
  z-index:1000; transition:top var(--dur-micro) var(--ease-out);
}
.skip-link:focus{ top:1rem; }

:focus-visible{
  outline:2px solid var(--focus-ring);
  outline-offset:3px;
}

.container{
  width:100%;
  max-width:var(--container-w);
  margin-inline:auto;
  padding-inline:max(clamp(1.25rem, 4vw, 2.5rem), var(--safe-left), var(--safe-right));
}

.eyebrow{
  font-family:var(--font-mono);
  font-size:var(--fs-eyebrow);
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 var(--space-4);
}

.section-title{
  font-family:var(--font-display);
  font-weight:500;
  font-size:var(--fs-h2);
  line-height:1.12;
  letter-spacing:-0.01em;
  max-width:22ch;
}

.section-lede{
  font-size:var(--fs-lede);
  color:var(--text-secondary);
  max-width:52ch;
  margin-top:var(--space-4);
  line-height:1.55;
}

section{ padding-block:var(--space-32); }
@media (max-width:800px){
  section{ padding-block:var(--space-16); }
}

/* Reveal-on-scroll (progressively enhanced by IntersectionObserver in JS) */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity var(--dur-large) var(--ease-out), transform var(--dur-large) var(--ease-out);
}
.reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ---------------------------------------------------------------------
   3. BUTTONS
   --------------------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  padding:0.85rem 1.5rem;
  min-height:44px;
  font-size:0.9375rem; font-weight:600;
  border-radius:var(--radius-sm);
  border:1px solid transparent;
  transition:background-color var(--dur-micro) var(--ease-out),
             color var(--dur-micro) var(--ease-out),
             border-color var(--dur-micro) var(--ease-out),
             transform var(--dur-micro) var(--ease-out);
  text-align:center; line-height:1.3;
}
.btn:active{ transform:translateY(1px); }

.btn--primary{ background:var(--accent); color:var(--accent-on-accent); }
.btn--primary:hover{ background:var(--accent-strong); }

.btn--outline{ border-color:var(--border-strong); color:var(--text-primary); }
.btn--outline:hover{ border-color:var(--accent); color:var(--accent); }

.btn--ghost{ color:var(--text-secondary); }
.btn--ghost:hover{ color:var(--text-primary); }

.btn--sm{ padding:0.55rem 1rem; min-height:36px; font-size:0.875rem; }
.btn--lg{ padding:1rem 1.85rem; font-size:1rem; }

/* ---------------------------------------------------------------------
   4. PRELOADER
   --------------------------------------------------------------------- */
.preloader{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg-primary);
  transition:opacity 350ms var(--ease-in-out), visibility 350ms var(--ease-in-out);
}
.preloader[data-exit]{ opacity:0; visibility:hidden; pointer-events:none; }
.preloader[hidden]{ display:none; }

.preloader__mark{ width:min(70vw, 260px); height:auto; color:var(--text-primary); }
.preloader__fragments .frag{
  stroke:var(--accent); stroke-width:2.5; stroke-linecap:round;
  opacity:0; transform:translateX(-8px);
  animation:fragIn 500ms var(--ease-out) forwards;
}
.preloader__fragments .frag:nth-child(1){ animation-delay:60ms; }
.preloader__fragments .frag:nth-child(2){ animation-delay:140ms; }
.preloader__fragments .frag:nth-child(3){ animation-delay:220ms; }
.preloader__fragments .frag:nth-child(4){ animation-delay:300ms; }

@keyframes fragIn{
  to{ opacity:0.9; transform:translateX(0); }
}

.preloader__word{
  font-family:var(--font-display); font-size:2.5rem; font-weight:500;
  fill:var(--text-primary);
  opacity:0;
  letter-spacing:0.04em;
  animation:wordIn 500ms var(--ease-out) forwards;
  animation-delay:420ms;
}
@keyframes wordIn{
  to{ opacity:1; }
}

@media (prefers-reduced-motion: reduce){
  .preloader__fragments{ display:none; }
  .preloader__word{ animation:none; opacity:1; }
  .preloader{ transition:opacity 200ms linear; }
}

/* ---------------------------------------------------------------------
   5. HEADER / NAV
   --------------------------------------------------------------------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:500;
  height:var(--header-h);
  display:flex; align-items:center;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background-color var(--dur-normal) var(--ease-in-out),
             border-color var(--dur-normal) var(--ease-in-out),
             height var(--dur-normal) var(--ease-in-out),
             backdrop-filter var(--dur-normal) var(--ease-in-out);
}
.site-header.is-scrolled{
  height:64px;
  background:color-mix(in srgb, var(--bg-primary) 88%, transparent);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom-color:var(--border);
}

.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  width:100%;
}

.brand{ display:inline-flex; align-items:center; gap:0.5rem; }
.brand__mark{ color:var(--accent); display:inline-flex; }
.brand__word{
  font-family:var(--font-display); font-weight:600; font-size:1.375rem;
  letter-spacing:0.01em;
}

.primary-nav ul{ display:flex; gap:var(--space-6); }
.primary-nav a{
  font-size:0.9375rem; font-weight:500; color:var(--text-secondary);
  padding:0.4rem 0; position:relative;
  transition:color var(--dur-micro) var(--ease-out);
}
.primary-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:1px;
  background:var(--accent); transition:right var(--dur-normal) var(--ease-out);
}
.primary-nav a:hover{ color:var(--text-primary); }
.primary-nav a:hover::after{ right:0; }

.header-actions{ display:flex; align-items:center; gap:var(--space-4); }
.header-actions .btn--ghost{ display:none; }
@media (min-width:1280px){
  .header-actions .btn--ghost{ display:inline-flex; }
}

/* Theme toggle */
.theme-toggle{ display:inline-flex; align-items:center; padding:2px; }
.theme-toggle__track{
  width:44px; height:24px; border-radius:999px;
  background:var(--bg-secondary); border:1px solid var(--border-strong);
  position:relative; display:block;
  transition:background-color var(--dur-normal) var(--ease-in-out);
}
.theme-toggle__thumb{
  position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%;
  background:var(--accent);
  transition:transform var(--dur-normal) var(--ease-in-out);
}
[data-theme="dark"] .theme-toggle__thumb{ transform:translateX(20px); }
@media (prefers-reduced-motion: reduce){
  .theme-toggle__thumb{ transition:none; }
}

/* Mobile nav toggle (hamburger) */
.mobile-nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px;
}
.mobile-nav-toggle span{
  display:block; width:20px; height:2px; background:var(--text-primary); margin-inline:auto;
  transition:transform var(--dur-micro) var(--ease-out), opacity var(--dur-micro) var(--ease-out);
}
@media (max-width:1120px){
  .primary-nav{ display:none; }
  .mobile-nav-toggle{ display:flex; }
}

/* Mobile nav overlay */
.mobile-nav{
  position:fixed; inset:0; z-index:600; background:var(--bg-primary);
}
.mobile-nav__inner{
  height:100%; display:flex; flex-direction:column;
  padding:var(--space-6) clamp(1.25rem, 6vw, 3rem);
}
.mobile-nav__close{
  align-self:flex-end; font-size:2rem; line-height:1; width:44px; height:44px;
}
.mobile-nav nav{ margin-top:var(--space-16); }
.mobile-nav nav ul{ display:flex; flex-direction:column; gap:var(--space-6); }
.mobile-nav nav a{ font-family:var(--font-display); font-size:2rem; font-weight:500; }
.mobile-nav__actions{
  margin-top:auto; display:flex; flex-direction:column; gap:var(--space-4);
  padding-top:var(--space-16);
}
.mobile-nav__actions .btn{ width:100%; }

/* ---------------------------------------------------------------------
   6. HERO
   --------------------------------------------------------------------- */
.hero{
  padding-top:calc(var(--header-h) + var(--space-24));
  padding-bottom:var(--space-24);
  background:
    radial-gradient(60% 60% at 82% 8%, var(--accent-soft) 0%, transparent 60%),
    var(--bg-primary);
}
.hero__inner{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:var(--space-16);
  align-items:center;
}
@media (max-width:980px){
  .hero__inner{ grid-template-columns:1fr; }
}

.hero__copy .eyebrow{ max-width:36ch; }
.hero__headline{
  font-family:var(--font-display); font-weight:500;
  font-size:var(--fs-h1); line-height:1.04; letter-spacing:-0.015em;
  opacity:0; transform:translateY(18px);
  animation:heroIn var(--dur-hero) var(--ease-out) forwards;
  animation-delay:120ms;
}
.hero__sub{
  margin-top:var(--space-6); font-size:var(--fs-lede); color:var(--text-secondary);
  max-width:48ch;
  opacity:0; transform:translateY(18px);
  animation:heroIn var(--dur-hero) var(--ease-out) forwards;
  animation-delay:260ms;
}
.hero__ctas{
  margin-top:var(--space-8); display:flex; flex-wrap:wrap; gap:var(--space-4);
  opacity:0; transform:translateY(18px);
  animation:heroIn var(--dur-hero) var(--ease-out) forwards;
  animation-delay:380ms;
}
.hero__ai-link{
  margin-top:var(--space-8); display:inline-flex; align-items:center; gap:0.6rem;
  font-size:0.9375rem; color:var(--text-secondary);
  opacity:0; animation:heroIn var(--dur-hero) var(--ease-out) forwards; animation-delay:480ms;
}
.hero__ai-link:hover{ color:var(--accent); }
.hero__ai-dot{
  width:8px; height:8px; border-radius:50%; background:var(--accent); display:inline-block;
  animation:pulseDot 2.4s ease-in-out infinite;
}
@keyframes pulseDot{
  0%,100%{ opacity:0.4; } 50%{ opacity:1; }
}
@keyframes heroIn{ to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){
  .hero__headline, .hero__sub, .hero__ctas, .hero__ai-link{ opacity:1; transform:none; animation:none; }
  .hero__ai-dot{ animation:none; }
}

.hero__visual{ position:relative; }
.chain{ width:100%; height:auto; }
.chain__nodes circle{
  fill:var(--bg-elevated); stroke:var(--border-strong); stroke-width:1.5;
  transition:stroke var(--dur-normal) var(--ease-out), fill var(--dur-normal) var(--ease-out);
  cursor:pointer;
}
.chain__nodes circle.is-active{ stroke:var(--accent); fill:var(--accent-soft); }
.chain__nodes text{
  font-family:var(--font-mono); font-size:11px; fill:var(--text-secondary);
  letter-spacing:0.03em; pointer-events:none;
}
.chain__nodes text.is-active{ fill:var(--accent); }
.chain__links path{
  fill:none; stroke:var(--border); stroke-width:1.25;
  stroke-dasharray:4 4;
}
.chain__links path.is-active{ stroke:var(--accent); stroke-dasharray:none; }

.hero__visual-caption{
  margin-top:var(--space-6); padding:var(--space-4) var(--space-6);
  border:1px solid var(--border); border-radius:var(--radius-md);
  background:var(--bg-elevated);
}
.hero__visual-caption-label{
  display:block; font-family:var(--font-mono); font-size:0.75rem; letter-spacing:0.06em;
  color:var(--accent); margin-bottom:0.35rem;
}
.hero__visual-caption-text{ color:var(--text-secondary); font-size:0.9375rem; }

/* ---------------------------------------------------------------------
   7. METRICS
   --------------------------------------------------------------------- */
.metrics{ padding-block:var(--space-16); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.metrics__inner{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-8);
}
@media (max-width:760px){
  .metrics__inner{ grid-template-columns:1fr; gap:var(--space-8); }
}
.metric{ text-align:left; }
.metric__number{
  font-family:var(--font-display); font-size:var(--fs-stat); font-weight:500; color:var(--accent);
  display:block; line-height:1;
}
.metric__label{ display:block; margin-top:var(--space-3); color:var(--text-secondary); max-width:32ch; }
.metrics__note{
  text-align:center; margin-top:var(--space-8); font-size:0.8125rem; color:var(--text-tertiary);
}

/* ---------------------------------------------------------------------
   8. PROBLEM / SYSTEM
   --------------------------------------------------------------------- */
.problem__head{ max-width:56rem; }

.system{
  margin-top:var(--space-16);
  display:flex; flex-wrap:wrap; gap:var(--space-3);
}
.system__item{
  padding:0.85rem 1.25rem; border:1px solid var(--border); border-radius:999px;
  font-size:0.9375rem; color:var(--text-secondary);
  transition:border-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out), background-color var(--dur-micro) var(--ease-out);
}
.system__item:hover{ border-color:var(--accent); color:var(--text-primary); }
.system__item[aria-selected="true"]{
  border-color:var(--accent); background:var(--accent-soft); color:var(--text-primary); font-weight:600;
}
.system__item--performance{ border-style:dashed; }

.system__panel{
  margin-top:var(--space-8); padding:var(--space-8);
  background:var(--bg-secondary); border-radius:var(--radius-md);
  font-size:var(--fs-lede); max-width:60ch; line-height:1.6;
  min-height:6.5rem;
}
.system__panel strong{ color:var(--accent); }

/* ---------------------------------------------------------------------
   9. FRAMEWORK
   --------------------------------------------------------------------- */
.framework{ background:var(--bg-secondary); }

.framework__stages{
  margin-top:var(--space-16);
  display:flex; overflow-x:auto; gap:1px;
  background:var(--border); border:1px solid var(--border);
  scrollbar-width:thin;
}
.stage{
  flex:1 1 0; min-width:130px; padding:var(--space-6) var(--space-4);
  background:var(--bg-secondary);
  display:flex; flex-direction:column; gap:var(--space-2);
  transition:background-color var(--dur-micro) var(--ease-out);
  text-align:left;
}
.stage:hover{ background:var(--bg-elevated); }
.stage[aria-selected="true"]{ background:var(--bg-elevated); }
.stage__index{ font-family:var(--font-mono); font-size:0.75rem; color:var(--accent); }
.stage__name{ font-family:var(--font-display); font-size:1.125rem; font-weight:500; }
.stage[aria-selected="true"] .stage__name{ color:var(--accent); }

.framework__detail{
  margin-top:var(--space-8); padding:var(--space-8);
  background:var(--bg-elevated); border:1px solid var(--border); border-radius:var(--radius-md);
}
.framework__detail-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-8);
}
@media (max-width:800px){
  .framework__detail-grid{ grid-template-columns:1fr; }
}
.framework__detail-label{
  display:block; font-family:var(--font-mono); font-size:0.75rem; letter-spacing:0.05em;
  text-transform:uppercase; color:var(--text-tertiary); margin-bottom:var(--space-2);
}
.framework__detail p{ color:var(--text-primary); line-height:1.55; }

/* ---------------------------------------------------------------------
   10. CAPABILITIES
   --------------------------------------------------------------------- */
.capability{
  border-top:1px solid var(--border);
}
.capability:last-child{ border-bottom:1px solid var(--border); }
.capability__inner{
  padding-block:var(--space-16);
  display:grid; grid-template-columns:120px 1fr 1fr; gap:var(--space-8); align-items:start;
}
@media (max-width:900px){
  .capability__inner{ grid-template-columns:1fr; gap:var(--space-4); }
}
.capability__index{
  font-family:var(--font-mono); font-size:1rem; color:var(--text-tertiary);
}
.capability__title{
  font-family:var(--font-display); font-weight:500; font-size:var(--fs-h3);
}
.capability__desc{ color:var(--text-secondary); max-width:42ch; }
.capability__tags{
  grid-column:2 / -1; display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:var(--space-4);
}
@media (max-width:900px){
  .capability__tags{ grid-column:auto; }
}
.capability__tags li{
  font-family:var(--font-mono); font-size:0.75rem; color:var(--text-secondary);
  border:1px solid var(--border); border-radius:999px; padding:0.3rem 0.75rem;
}

/* ---------------------------------------------------------------------
   11. AI EXPERIENCE
   --------------------------------------------------------------------- */
.ai-experience{ background:var(--bg-inverse); color:var(--text-inverse); }
.ai-experience .eyebrow{ color:var(--accent); }
.ai-experience .section-lede{ color:color-mix(in srgb, var(--text-inverse) 70%, transparent); }

.ai-cards{
  margin-top:var(--space-16);
  display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6);
}
@media (max-width:760px){
  .ai-cards{ grid-template-columns:1fr; }
}
.ai-card{
  padding:var(--space-8); border:1px solid color-mix(in srgb, var(--text-inverse) 18%, transparent);
  border-radius:var(--radius-md);
}
.ai-card__icon{ color:var(--accent); display:inline-flex; margin-bottom:var(--space-4); }
.ai-card h3{ font-family:var(--font-display); font-size:1.375rem; font-weight:500; margin-bottom:var(--space-3); }
.ai-card p{ color:color-mix(in srgb, var(--text-inverse) 68%, transparent); margin-bottom:var(--space-6); max-width:38ch; }

.ai-disclosure{
  margin-top:var(--space-8); font-size:0.8125rem;
  color:color-mix(in srgb, var(--text-inverse) 55%, transparent);
}

/* ---------------------------------------------------------------------
   12. DIAGNOSTIC
   --------------------------------------------------------------------- */
.diagnostic__panel{
  margin-top:var(--space-12); padding:var(--space-12);
  background:var(--bg-secondary); border-radius:var(--radius-md);
  max-width:44rem;
}
@media (max-width:600px){
  .diagnostic__panel{ padding:var(--space-6); }
}
.diagnostic__progress{ margin-bottom:var(--space-6); }
.diagnostic__progress-bar{
  height:3px; background:var(--border); border-radius:999px; overflow:hidden;
}
.diagnostic__progress-bar span{
  display:block; height:100%; width:0%; background:var(--accent);
  transition:width var(--dur-normal) var(--ease-out);
}
.diagnostic__progress-label{
  display:block; margin-top:var(--space-2); font-family:var(--font-mono); font-size:0.75rem; color:var(--text-tertiary);
}
.diagnostic__question{ font-family:var(--font-display); font-size:1.75rem; font-weight:500; margin-top:var(--space-2); }
.diagnostic__question-sub{ color:var(--text-secondary); margin-top:var(--space-2); }
.diagnostic__scale{ display:flex; gap:var(--space-3); margin-top:var(--space-8); }
.diagnostic__scale button{
  width:52px; height:52px; border-radius:50%; border:1px solid var(--border-strong);
  font-family:var(--font-mono); font-weight:500;
  transition:background-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out), border-color var(--dur-micro) var(--ease-out);
}
.diagnostic__scale button:hover{ border-color:var(--accent); color:var(--accent); }
.diagnostic__scale button.is-selected{ background:var(--accent); border-color:var(--accent); color:var(--accent-on-accent); }
.diagnostic__nav{ margin-top:var(--space-8); }
.diagnostic__nav .btn:disabled{ opacity:0.4; pointer-events:none; }

.diagnostic__score{ display:flex; align-items:baseline; gap:0.5rem; }
.diagnostic__score-value{ font-family:var(--font-display); font-size:5rem; font-weight:500; color:var(--accent); line-height:1; }
.diagnostic__score-max{ color:var(--text-tertiary); font-family:var(--font-mono); }
.diagnostic__result-grid{ margin-top:var(--space-8); display:grid; gap:var(--space-6); }
.diagnostic__result-ctas{ margin-top:var(--space-8); display:flex; align-items:center; gap:var(--space-6); flex-wrap:wrap; }

/* ---------------------------------------------------------------------
   13. CASE STUDIES
   --------------------------------------------------------------------- */
.case-grid{ margin-top:var(--space-12); display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); }
@media (max-width:800px){ .case-grid{ grid-template-columns:1fr; } }
.case-card{
  padding:var(--space-8); border:1px solid var(--border); border-radius:var(--radius-md);
  background:var(--bg-elevated);
}
.case-card--placeholder{ border-style:dashed; }
.case-card__tag{
  font-family:var(--font-mono); font-size:0.75rem; color:var(--accent); text-transform:uppercase; letter-spacing:0.04em;
}
.case-card h3{ font-family:var(--font-display); font-size:1.375rem; font-weight:500; margin-top:var(--space-3); margin-bottom:var(--space-6); }
.case-card__breakdown{ display:grid; gap:var(--space-4); margin:0; }
.case-card__breakdown dt{ font-family:var(--font-mono); font-size:0.75rem; text-transform:uppercase; color:var(--text-tertiary); }
.case-card__breakdown dd{ margin:0.25rem 0 0; color:var(--text-secondary); font-size:0.9375rem; }

/* ---------------------------------------------------------------------
   14. INDUSTRIES
   --------------------------------------------------------------------- */
.industry-grid{
  margin-top:var(--space-12); display:grid; grid-template-columns:repeat(3, 1fr); gap:1px;
  background:var(--border); border:1px solid var(--border);
}
@media (max-width:900px){ .industry-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:560px){ .industry-grid{ grid-template-columns:1fr; } }
.industry-item{ background:var(--bg-primary); padding:var(--space-8); }
.industry-item h3{ font-family:var(--font-display); font-size:1.25rem; font-weight:500; margin-bottom:var(--space-2); }
.industry-item p{ color:var(--text-secondary); font-size:0.9375rem; }

/* ---------------------------------------------------------------------
   15. INSIGHTS
   --------------------------------------------------------------------- */
.insights{ background:var(--bg-secondary); }
.insights-grid{ margin-top:var(--space-12); display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-6); }
@media (max-width:900px){ .insights-grid{ grid-template-columns:1fr; } }
.insight-card{
  padding:var(--space-6); background:var(--bg-elevated); border:1px solid var(--border); border-radius:var(--radius-md);
}
.insight-card__type{ font-family:var(--font-mono); font-size:0.75rem; color:var(--accent); text-transform:uppercase; }
.insight-card h3{ font-family:var(--font-display); font-size:1.25rem; font-weight:500; margin-top:var(--space-3); line-height:1.3; }
.insights-note{ margin-top:var(--space-6); font-size:0.8125rem; color:var(--text-tertiary); }

/* ---------------------------------------------------------------------
   16. ABOUT
   --------------------------------------------------------------------- */
.about__inner{ max-width:52rem; }

/* ---------------------------------------------------------------------
   17. FINAL CTA
   --------------------------------------------------------------------- */
.final-cta{ background:var(--accent); color:var(--accent-on-accent); text-align:center; }
.final-cta__inner h2{
  font-family:var(--font-display); font-weight:500; font-size:var(--fs-h2);
}
.final-cta__inner p{ margin-top:var(--space-4); font-size:var(--fs-lede); max-width:44ch; margin-inline:auto; opacity:0.9; }
.final-cta__actions{ margin-top:var(--space-8); display:flex; justify-content:center; gap:var(--space-4); flex-wrap:wrap; }
.final-cta .btn--primary{ background:var(--accent-on-accent); color:var(--accent-strong); }
.final-cta .btn--primary:hover{ background:var(--bg-elevated); }
.final-cta .btn--outline{ border-color:color-mix(in srgb, var(--accent-on-accent) 55%, transparent); color:var(--accent-on-accent); }
.final-cta .btn--outline:hover{ border-color:var(--accent-on-accent); }

/* ---------------------------------------------------------------------
   18. CONTACT / FORM
   --------------------------------------------------------------------- */
.contact__inner{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:var(--space-16); }
@media (max-width:900px){ .contact__inner{ grid-template-columns:1fr; } }
.contact__intro .btn{ margin-top:var(--space-8); }

.contact-form{ display:grid; gap:var(--space-6); }
.form-row{ display:grid; gap:var(--space-2); }
.form-row--split{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); }
@media (max-width:560px){ .form-row--split{ grid-template-columns:1fr; } }
.form-row label{ font-size:0.875rem; font-weight:600; }
.form-row label .optional{ font-weight:400; color:var(--text-tertiary); }
.form-row input, .form-row textarea, .form-row select{
  padding:0.85rem 1rem; border:1px solid var(--border-strong); border-radius:var(--radius-sm);
  background:var(--bg-elevated); color:var(--text-primary); min-height:44px;
  transition:border-color var(--dur-micro) var(--ease-out);
}
.form-row input:focus, .form-row textarea:focus, .form-row select:focus{ border-color:var(--accent); }
.form-row textarea{ resize:vertical; min-height:110px; }
.form-row input:invalid[data-touched="true"], .form-row textarea:invalid[data-touched="true"]{ border-color:var(--error); }

.form-status{ font-size:0.9375rem; min-height:1.2em; }
.form-status[data-state="error"]{ color:var(--error); }
.form-status[data-state="success"]{ color:var(--success); }
.form-status[data-state="loading"]{ color:var(--text-secondary); }

/* ---------------------------------------------------------------------
   19. FOOTER
   --------------------------------------------------------------------- */
.site-footer{ background:var(--bg-secondary); border-top:1px solid var(--border); padding-top:var(--space-24); }
.site-footer__inner{ display:grid; grid-template-columns:1fr 2fr; gap:var(--space-16); padding-bottom:var(--space-16); }
@media (max-width:800px){ .site-footer__inner{ grid-template-columns:1fr; gap:var(--space-8); } }
.site-footer__brand p{ margin-top:var(--space-2); color:var(--text-secondary); font-size:0.9375rem; }
.site-footer__nav{ display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-8); }
@media (max-width:560px){ .site-footer__nav{ grid-template-columns:1fr; } }
.site-footer__nav h3{ font-family:var(--font-mono); font-size:0.75rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-tertiary); margin-bottom:var(--space-4); }
.site-footer__nav ul{ display:grid; gap:var(--space-3); }
.site-footer__nav a{ color:var(--text-secondary); font-size:0.9375rem; }
.site-footer__nav a:hover{ color:var(--accent); }
.site-footer__legal{ border-top:1px solid var(--border); padding-block:var(--space-6); font-size:0.8125rem; color:var(--text-tertiary); }

/* ---------------------------------------------------------------------
   20. AI PANELS (CHAT + VOICE)
   --------------------------------------------------------------------- */
.ai-overlay{
  position:fixed; inset:0; background:color-mix(in srgb, var(--bg-inverse) 55%, transparent);
  z-index:800;
}
.ai-panel{
  position:fixed; z-index:900;
  right:0; top:0; bottom:0; width:min(420px, 100vw);
  background:var(--bg-elevated); border-left:1px solid var(--border);
  display:flex; flex-direction:column;
  transform:translateX(100%);
  transition:transform var(--dur-large) var(--ease-out);
  box-shadow:-24px 0 48px rgba(0,0,0,0.12);
}
.ai-panel[data-open="true"]{ transform:translateX(0); }
@media (prefers-reduced-motion: reduce){
  .ai-panel{ transition:none; }
}

.ai-panel__header{
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--space-4) var(--space-6); border-bottom:1px solid var(--border);
}
.ai-panel__title{ display:flex; align-items:center; gap:0.5rem; font-weight:600; font-family:var(--font-display); font-size:1.125rem; }
.ai-panel__status-dot{ width:8px; height:8px; border-radius:50%; background:var(--text-tertiary); }
.ai-panel__status-dot[data-state="online"]{ background:var(--success); }
.ai-panel__status-dot[data-state="error"]{ background:var(--error); }
.ai-panel__header-actions{ display:flex; gap:0.25rem; }
.ai-panel__icon-btn{ width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--radius-sm); font-size:1.25rem; line-height:1; }
.ai-panel__icon-btn:hover{ background:var(--bg-secondary); }

.ai-panel__disclosure{
  padding:var(--space-3) var(--space-6); font-size:0.8125rem; color:var(--text-tertiary);
  background:var(--bg-secondary);
}
.ai-panel__disclosure button{ color:var(--accent); text-decoration:underline; }

.ai-panel__body{
  flex:1; overflow-y:auto; padding:var(--space-6); display:flex; flex-direction:column; gap:var(--space-4);
}
.msg{ max-width:85%; padding:0.75rem 1rem; border-radius:var(--radius-md); font-size:0.9375rem; line-height:1.5; }
.msg--ai{ background:var(--bg-secondary); align-self:flex-start; border-bottom-left-radius:2px; }
.msg--user{ background:var(--accent); color:var(--accent-on-accent); align-self:flex-end; border-bottom-right-radius:2px; }
.msg--typing{ display:inline-flex; gap:4px; padding:0.9rem 1rem; }
.msg--typing span{ width:6px; height:6px; border-radius:50%; background:var(--text-tertiary); animation:typingDot 1.2s ease-in-out infinite; }
.msg--typing span:nth-child(2){ animation-delay:0.15s; }
.msg--typing span:nth-child(3){ animation-delay:0.3s; }
@keyframes typingDot{ 0%,60%,100%{ opacity:0.3; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }
@media (prefers-reduced-motion: reduce){
  .msg--typing span{ animation:none; opacity:0.6; }
}

.ai-panel__error{ padding:var(--space-4) var(--space-6); background:color-mix(in srgb, var(--error) 12%, var(--bg-elevated)); }
.ai-panel__error p{ color:var(--error); font-size:0.875rem; margin-bottom:var(--space-2); }

.ai-panel__input{ display:flex; gap:var(--space-2); padding:var(--space-4) var(--space-6); border-top:1px solid var(--border); }
.ai-panel__input textarea{
  flex:1; resize:none; border:1px solid var(--border-strong); border-radius:var(--radius-sm);
  padding:0.7rem 0.9rem; background:var(--bg-primary); color:var(--text-primary); max-height:120px;
}
.ai-panel__input textarea:focus{ border-color:var(--accent); }
.ai-panel__input button{
  width:44px; height:44px; flex-shrink:0; background:var(--accent); color:var(--accent-on-accent);
  border-radius:var(--radius-sm); display:inline-flex; align-items:center; justify-content:center;
}
.ai-panel__input button:disabled{ opacity:0.4; pointer-events:none; }

/* Voice panel specifics */
.voice-orb-wrap{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-4); padding:var(--space-8); }
.voice-orb{ position:relative; width:140px; height:140px; display:flex; align-items:center; justify-content:center; }
.voice-orb__core{
  width:64px; height:64px; border-radius:50%; background:var(--accent);
  transition:transform var(--dur-normal) var(--ease-in-out), background-color var(--dur-normal) var(--ease-in-out);
}
.voice-orb__ring{
  position:absolute; inset:0; border-radius:50%; border:1.5px solid var(--border-strong); opacity:0;
}
.voice-orb__ring--2{ inset:-16px; }

.voice-orb[data-state="idle"] .voice-orb__core{ transform:scale(0.85); }

.voice-orb[data-state="listening"] .voice-orb__core{ animation:orbPulse 1.4s ease-in-out infinite; background:var(--accent); }
.voice-orb[data-state="listening"] .voice-orb__ring{ opacity:1; border-color:var(--accent); animation:ringExpand 1.8s ease-out infinite; }
.voice-orb[data-state="listening"] .voice-orb__ring--2{ animation-delay:0.4s; }

.voice-orb[data-state="processing"] .voice-orb__core{ animation:orbSpin 1.1s linear infinite; background:var(--text-tertiary); border-radius:38%; }

.voice-orb[data-state="speaking"] .voice-orb__core{ animation:orbWobble 0.6s ease-in-out infinite; background:var(--success); }

.voice-orb[data-state="error"] .voice-orb__core{ background:var(--error); transform:scale(0.85); }

@keyframes orbPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.12); } }
@keyframes ringExpand{ 0%{ transform:scale(0.7); opacity:0.8; } 100%{ transform:scale(1.35); opacity:0; } }
@keyframes orbSpin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@keyframes orbWobble{ 0%,100%{ transform:scale(1) rotate(0deg); } 50%{ transform:scale(1.08) rotate(4deg); } }

@media (prefers-reduced-motion: reduce){
  .voice-orb__core, .voice-orb__ring{ animation:none !important; }
  .voice-orb[data-state="listening"] .voice-orb__core{ transform:scale(1.08); }
  .voice-orb[data-state="speaking"] .voice-orb__core{ transform:scale(1.05); }
}

.voice-state-label{ font-family:var(--font-display); font-size:1.25rem; font-weight:500; }
.voice-connection{ font-family:var(--font-mono); font-size:0.75rem; color:var(--text-tertiary); text-transform:uppercase; letter-spacing:0.04em; }
.voice-transcript{ padding:var(--space-4) var(--space-6); max-height:120px; overflow-y:auto; font-size:0.875rem; color:var(--text-secondary); border-top:1px solid var(--border); }
.voice-controls{ padding:var(--space-6); border-top:1px solid var(--border); display:flex; }
.voice-controls .btn{ width:100%; }

@media (max-width:520px){
  .ai-panel{ width:100vw; }
}

/* ---------------------------------------------------------------------
   21. UTILITY / PRINT
   --------------------------------------------------------------------- */
@media print{
  .site-header, .mobile-nav, .ai-panel, .ai-overlay, .preloader{ display:none !important; }
}

/* ==========================================================================
   22. RESPONSIVE LAYER — mobile-first refinements
   Base (<640px) = phones; 640+ = large phones / small tablets;
   900+ = tablets landscape / small laptops; 1121+ = full desktop nav.
   ========================================================================== */

/* ---- Header ---------------------------------------------------------- */
.site-header{ padding-top:var(--safe-top); height:calc(var(--header-h) + var(--safe-top)); }
.site-header.is-scrolled{ height:calc(56px + var(--safe-top)); }
.site-header__inner{ gap:var(--space-3); }
.brand{ flex-shrink:0; }
.header-actions{ gap:var(--space-2); flex-shrink:0; }
.header-cta{ display:none; }
.header-cta__long{ display:none; }
.header-cta__short{ display:inline; }
.theme-toggle{ min-width:44px; min-height:44px; justify-content:center; }
@media (min-width:640px){
  .header-cta{ display:inline-flex; }
  .header-actions{ gap:var(--space-4); }
}
@media (min-width:1280px){
  .header-cta__long{ display:inline; }
  .header-cta__short{ display:none; }
}
@media (min-width:1121px){
  .site-header{ height:calc(76px + var(--safe-top)); }
  .site-header.is-scrolled{ height:calc(64px + var(--safe-top)); }
}
.mobile-nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mobile-nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.mobile-nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---- Mobile nav overlay: dynamic viewport + scrollable in landscape --- */
.mobile-nav{ height:100vh; height:100dvh; overflow-y:auto; overscroll-behavior:contain; }
.mobile-nav__inner{
  min-height:100%; height:auto;
  padding-top:max(var(--space-4), var(--safe-top));
  padding-bottom:max(var(--space-6), var(--safe-bottom));
}
.mobile-nav nav{ margin-top:var(--space-6); }
.mobile-nav nav ul{ gap:var(--space-2); }
.mobile-nav nav a{ display:block; padding:0.55rem 0; font-size:clamp(1.5rem, 6vw, 2rem); border-bottom:1px solid var(--border); }
.mobile-nav__actions{ padding-top:var(--space-8); }
@media (min-width:640px) and (max-width:1120px){
  .mobile-nav__inner{ max-width:560px; margin-inline:auto; width:100%; }
}

/* ---- Hero ------------------------------------------------------------ */
.hero{
  padding-top:calc(var(--header-h) + var(--safe-top) + var(--space-8));
  padding-bottom:var(--space-12);
}
.hero__inner{ gap:var(--space-8); }
.hero__copy .eyebrow{ max-width:none; line-height:1.5; }
.hero__headline br{ display:none; }
.hero__ctas{ flex-direction:column; align-items:stretch; }
.hero__ctas .btn{ width:100%; }
.hero__ai-link{ align-items:flex-start; text-align:left; line-height:1.45; }
.hero__ai-dot{ margin-top:0.45em; flex-shrink:0; }
.hero__visual{ width:100%; max-width:440px; margin-inline:auto; }
.chain__nodes text{ font-size:13px; }
.chain--compact .chain__nodes text{ font-size:15px; }
.chain__hit{ fill:transparent; stroke:none !important; cursor:pointer; }
.chain__nodes circle.chain__hit{ fill:transparent; stroke:none; }
.hero__visual-caption{ padding:var(--space-4); }
@media (min-width:480px){
  .hero__ctas{ flex-direction:row; align-items:center; }
  .hero__ctas .btn{ width:auto; }
}
@media (min-width:640px){
  .hero{ padding-top:calc(var(--header-h) + var(--safe-top) + var(--space-12)); padding-bottom:var(--space-16); }
  .hero__headline br{ display:inline; }
  .hero__visual{ max-width:480px; }
}
@media (min-width:981px){
  .hero{ padding-top:calc(76px + var(--safe-top) + var(--space-16)); padding-bottom:var(--space-24); }
  .hero__inner{ gap:var(--space-16); }
  .hero__visual{ max-width:none; margin-inline:0; }
  .hero__visual-caption{ padding:var(--space-4) var(--space-6); }
}

/* ---- Sections -------------------------------------------------------- */
section{ padding-block:var(--space-12); }
@media (min-width:640px){ section{ padding-block:var(--space-16); } }
@media (min-width:1024px){ section{ padding-block:var(--space-32); } }
.section-title{ max-width:none; }
@media (min-width:900px){ .section-title{ max-width:22ch; } }
.section-title br{ display:none; }
@media (min-width:900px){ .section-title br{ display:inline; } }
.section-lede{ max-width:none; }
@media (min-width:700px){ .section-lede{ max-width:52ch; } }

/* ---- Metrics --------------------------------------------------------- */
.metrics{ padding-block:var(--space-12); }
.metrics__inner{ grid-template-columns:1fr; gap:var(--space-8); }
.metric{ padding-bottom:var(--space-6); border-bottom:1px solid var(--border); }
.metric:last-child{ border-bottom:0; padding-bottom:0; }
.metrics__note{ text-align:left; }
@media (min-width:760px){
  .metrics__inner{ grid-template-columns:repeat(3, 1fr); }
  .metric{ border-bottom:0; padding-bottom:0; }
  .metrics__note{ text-align:center; }
}

/* ---- Problem tabs ---------------------------------------------------- */
.system{ margin-top:var(--space-8); gap:var(--space-2); }
.system__item{ min-height:44px; padding:0.65rem 1rem; }
.system__panel{ padding:var(--space-6); min-height:11rem; font-size:1.0625rem; }
@media (min-width:640px){
  .system{ margin-top:var(--space-12); gap:var(--space-3); }
  .system__panel{ padding:var(--space-8); min-height:8rem; font-size:var(--fs-lede); }
}

/* ---- Framework stages: grid instead of sideways scroll ---------------- */
.framework__stages{
  margin-top:var(--space-8); overflow:visible;
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
}
.stage{ min-width:0; padding:var(--space-4); min-height:72px; flex:none; }
.framework__detail{ padding:var(--space-6); margin-top:var(--space-6); }
.framework__detail-grid{ gap:var(--space-6); }
@media (min-width:560px){ .framework__stages{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (min-width:1000px){
  .framework__stages{ grid-template-columns:repeat(6, minmax(0,1fr)); margin-top:var(--space-16); }
  .stage{ padding:var(--space-6) var(--space-4); }
  .framework__detail{ padding:var(--space-8); margin-top:var(--space-8); }
}
@media (min-width:700px) and (max-width:1000px){
  .framework__detail-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--space-6); }
}

/* ---- Capabilities ---------------------------------------------------- */
.capability__inner{ padding-block:var(--space-8); }
@media (min-width:640px){ .capability__inner{ padding-block:var(--space-12); } }
@media (min-width:900px){ .capability__inner{ padding-block:var(--space-16); grid-template-columns:96px 1fr 1fr; } }
@media (min-width:1100px){ .capability__inner{ grid-template-columns:120px 1fr 1fr; } }
.capability__desc{ max-width:none; }
@media (min-width:900px){ .capability__desc{ max-width:42ch; } }
.capability__tags li{ padding:0.35rem 0.75rem; }

/* ---- AI experience --------------------------------------------------- */
.ai-cards{ margin-top:var(--space-8); gap:var(--space-4); }
.ai-card{ padding:var(--space-6); }
.ai-card .btn{ width:100%; }
@media (min-width:760px){
  .ai-cards{ margin-top:var(--space-16); gap:var(--space-6); }
  .ai-card{ padding:var(--space-8); }
  .ai-card .btn{ width:auto; }
}

/* ---- Diagnostic: scale buttons shrink to fit; never overflow ---------- */
.diagnostic__panel{ margin-top:var(--space-8); padding:var(--space-6); max-width:none; }
.diagnostic__question{ font-size:clamp(1.375rem, 5vw, 1.75rem); }
.diagnostic__scale{ gap:clamp(0.4rem, 2vw, 0.75rem); margin-top:var(--space-6); }
.diagnostic__scale button{
  flex:1 1 0; min-width:0; max-width:56px; width:auto; height:auto;
  aspect-ratio:1/1; min-height:44px;
}
.diagnostic__scale-hint{
  display:flex; justify-content:space-between; margin-top:var(--space-2);
  font-family:var(--font-mono); font-size:0.6875rem; color:var(--text-tertiary);
}
.diagnostic__score-value{ font-size:clamp(3.5rem, 18vw, 5rem); }
.diagnostic__result-ctas .btn:not(.btn--ghost){ width:100%; }
@media (min-width:480px){ .diagnostic__result-ctas .btn:not(.btn--ghost){ width:auto; } }
@media (min-width:700px){
  .diagnostic__panel{ padding:var(--space-12); max-width:44rem; margin-top:var(--space-12); }
}

/* ---- Cards & grids --------------------------------------------------- */
.case-grid, .insights-grid{ margin-top:var(--space-8); gap:var(--space-4); }
.case-card{ padding:var(--space-6); }
.insights-grid{ grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.industry-item{ padding:var(--space-6); }
@media (min-width:800px){
  .case-grid, .insights-grid{ margin-top:var(--space-12); gap:var(--space-6); }
  .case-card{ padding:var(--space-8); }
  .industry-item{ padding:var(--space-8); }
}

/* ---- Final CTA ------------------------------------------------------- */
.final-cta__actions{ flex-direction:column; align-items:stretch; }
.final-cta__actions .btn{ width:100%; }
@media (min-width:560px){
  .final-cta__actions{ flex-direction:row; align-items:center; }
  .final-cta__actions .btn{ width:auto; }
}

/* ---- Contact form ---------------------------------------------------- */
.contact__inner{ gap:var(--space-8); }
.contact__intro .btn{ width:100%; margin-top:var(--space-6); }
.contact-form .btn{ width:100%; }
.form-row input, .form-row textarea, .form-row select{ width:100%; font-size:max(16px, 1rem); }
.form-row select{ appearance:auto; }
.form-row--split > div{ display:grid; gap:var(--space-2); min-width:0; }
@media (min-width:560px){
  .contact__intro .btn, .contact-form .btn{ width:auto; }
}
@media (min-width:900px){ .contact__inner{ gap:var(--space-16); } }
@media (max-width:899px){ .contact__inner{ grid-template-columns:1fr; } }

/* ---- Footer ---------------------------------------------------------- */
.site-footer{ padding-top:var(--space-12); }
.site-footer__inner{ gap:var(--space-8); padding-bottom:var(--space-8); }
.site-footer__nav{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--space-6); }
.site-footer__nav a{ display:inline-block; padding-block:0.35rem; }
.site-footer__legal{ padding-bottom:max(var(--space-6), var(--safe-bottom)); }
@media (min-width:560px){ .site-footer__nav{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (min-width:801px){ .site-footer{ padding-top:var(--space-24); } .site-footer__inner{ padding-bottom:var(--space-16); } }

/* ---- AI panels: full-screen sheet on phones, dynamic viewport --------- */
.ai-panel{ height:100vh; height:100dvh; max-width:100vw; }
.ai-panel__header{ padding-top:max(var(--space-4), var(--safe-top)); }
.ai-panel__input{ padding-bottom:max(var(--space-4), var(--safe-bottom)); }
.voice-controls{ padding-bottom:max(var(--space-6), var(--safe-bottom)); }
.ai-panel__body{ overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.ai-panel__input textarea{ font-size:max(16px, 1rem); }
.msg{ max-width:90%; overflow-wrap:anywhere; }
@media (max-width:520px){
  .ai-panel{ width:100%; border-left:0; box-shadow:none; }
  .ai-panel__header, .ai-panel__disclosure, .ai-panel__body, .ai-panel__input{ padding-inline:var(--space-4); }
  .voice-orb-wrap{ padding:var(--space-4); }
}
@media (max-height:520px){
  .voice-orb{ width:96px; height:96px; }
  .voice-orb__core{ width:48px; height:48px; }
  .voice-orb-wrap{ padding:var(--space-3); gap:var(--space-2); }
}

/* ---- Touch devices: comfortable tap targets, no sticky hover ---------- */
@media (pointer:coarse){
  .btn--sm{ min-height:44px; }
  .ai-panel__icon-btn{ width:44px; height:44px; }
  .ai-panel__disclosure button{ padding:0.5rem 0.25rem; }
  .site-footer__nav a{ padding-block:0.6rem; }
}
@media (hover:none){
  .primary-nav a:hover::after{ right:100%; }
  .system__item:hover, .diagnostic__scale button:hover{ border-color:var(--border); color:inherit; }
  .system__item[aria-selected="true"]{ border-color:var(--accent); }
  .diagnostic__scale button.is-selected{ border-color:var(--accent); color:var(--accent-on-accent); }
}

/* ---- Short landscape phones ------------------------------------------ */
@media (max-height:480px) and (orientation:landscape){
  .hero{ padding-top:calc(var(--header-h) + var(--safe-top) + var(--space-4)); }
  .preloader__mark{ width:min(40vw, 200px); }
}

/* ---- Large screens: keep line lengths sane --------------------------- */
@media (min-width:1600px){ :root{ --container-w:1360px; } }