/* ==========================================================================
   Teho — landing v2. Premium, calm, enterprise-grade.
   Cool warm-paper system, office-photo hero, credible product surfaces.
   Standalone; old landing/index.html preserved for rollback.
   ========================================================================== */
@font-face { font-family:'Instrument Sans'; font-weight:400; src:url('fonts/InstrumentSans-Regular-400.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Instrument Sans'; font-weight:500; src:url('fonts/InstrumentSans-Medium-500.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Instrument Sans'; font-weight:600; src:url('fonts/InstrumentSans-SemiBold-600.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Instrument Sans'; font-weight:700; src:url('fonts/InstrumentSans-Bold-700.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Geist Mono'; font-weight:400; src:url('fonts/GeistMono-Regular-400.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Geist Mono'; font-weight:500; src:url('fonts/GeistMono-Medium-500.ttf') format('truetype'); font-display:swap; }

:root {
  --paper:#F4F2EA; --paper-2:#ECE9DD; --canvas:#FCFBF6; --canvas-2:#FFFFFF; --well:#E6E1D2;
  --ink:#161A16; --ink-2:#1F241F; --ink-line:#30372F;
  --body:#34392F; --muted:#6A6F63; --subtle:#9A9D8F;
  --line:#DED8C6; --line-2:#CBC4AD;
  --brand:#1F7A61; --brand-deep:#165C49; --brand-lift:#3FA587; --brand-soft:#DCE8E0; --brand-ink:#FBFDFB;
  --judgement:#2E6B4E; --judgement-edge:#1F4A35; --judgement-soft:#D7E6DC;
  --execution:#6BA27E; --execution-edge:#467058; --execution-soft:#E0ECDF;
  --coordination:#D4B968; --coordination-edge:#9E8638; --coordination-soft:#F1E8C9;
  --overhead:#DDA07F; --overhead-edge:#A36742; --overhead-soft:#F4E2D4;
  --burden:#C4705F; --burden-edge:#8E4A3B; --burden-soft:#EED3CC;
  --f-sans:'Instrument Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'Geist Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --r-3:6px; --r-4:10px; --r-5:14px; --r-6:20px; --pill:999px;
  --sh-1:0 1px 2px rgba(22,26,22,.04), 0 0 0 1px rgba(22,26,22,.05);
  --sh-2:0 4px 16px -6px rgba(22,26,22,.10), 0 0 0 1px rgba(22,26,22,.05);
  --sh-panel:0 30px 70px -32px rgba(22,26,22,.34), 0 2px 8px -3px rgba(22,26,22,.10), 0 0 0 1px rgba(22,26,22,.05);
  --dur:220ms; --ease:cubic-bezier(.2,.6,.2,1);
}

*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; }
html,body { margin:0; max-width:100%; background:var(--paper); color:var(--body); font-family:var(--f-sans); -webkit-font-smoothing:antialiased; font-feature-settings:"ss01","cv11"; }
body { overflow-x:hidden; width:100%; }
@supports (overflow:clip){ html,body { overflow-x:clip; } }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:0; background:none; padding:0; }
img,svg,video { display:block; max-width:100%; }
::selection { background:var(--brand-soft); }
:focus-visible { outline:2px solid var(--brand); outline-offset:3px; border-radius:3px; }

/* ---- type ---- */
.t-display { font-weight:400; font-size:clamp(40px,5vw,68px); line-height:1.04; letter-spacing:-.032em; color:var(--ink); text-wrap:balance; }
.t-h2 { font-weight:400; font-size:clamp(28px,3vw,44px); line-height:1.08; letter-spacing:-.028em; color:var(--ink); text-wrap:balance; }
.t-h3 { font-weight:600; font-size:19px; line-height:1.26; letter-spacing:-.016em; color:var(--ink); }
.t-lede { font-weight:400; font-size:clamp(17px,1.5vw,20px); line-height:1.55; color:var(--body); text-wrap:pretty; }
.t-body { font-weight:400; font-size:15px; line-height:1.62; color:var(--body); text-wrap:pretty; }
.t-small { font-size:13px; line-height:1.5; color:var(--muted); }
.eyebrow { font-family:var(--f-mono); font-weight:500; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--brand); margin:0; }
.eyebrow.on-ink { color:var(--brand-lift); }

.brand-logo { display:block; height:30px; width:auto; }
/* ---- mark ---- */
.mark { display:inline-grid; grid-template-columns:repeat(5,1fr); grid-template-rows:repeat(4,1fr); width:22px; aspect-ratio:5/4; }
.mark>i { background:var(--brand); border-radius:1px; }
.mark>.a1 { grid-column:2; grid-row:2; } .mark>.a2 { grid-column:3; grid-row:2; }
.mark>.a3 { grid-column:4; grid-row:2; } .mark>.a4 { grid-column:3; grid-row:3; }
.mark.lift>i { background:var(--brand-lift); }

/* ---- buttons ---- */
.btn { display:inline-flex; align-items:center; gap:9px; padding:13px 23px; border-radius:var(--r-3); font-weight:500; font-size:15px; letter-spacing:-.005em; border:1px solid transparent; transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease); white-space:nowrap; }
.btn-brand { background:var(--brand); color:var(--brand-ink); }
.btn-brand:hover { background:var(--brand-deep); transform:translateY(-1px); }
.btn-ink { background:var(--ink); color:var(--paper); }
.btn-ink:hover { background:#000; transform:translateY(-1px); }
.btn-ghost { border-color:var(--line-2); color:var(--ink); }
.btn-ghost:hover { border-color:var(--ink); background:var(--canvas); }
.btn-on-photo { background:var(--paper); color:var(--ink); }
.btn-on-photo:hover { background:#fff; transform:translateY(-1px); }
.btn-on-photo-ghost { color:#fff; border-color:rgba(255,255,255,.42); }
.btn-on-photo-ghost:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.arrow { display:inline-block; transition:transform var(--dur) var(--ease); }
.btn:hover .arrow,.lnk:hover .arrow { transform:translateX(3px); }
.lnk { display:inline-flex; align-items:center; gap:7px; color:var(--brand); font-weight:500; font-size:14px; }
.lnk:hover { color:var(--brand-deep); }

/* ---- layout ---- */
.wrap { width:min(1200px,calc(100% - 48px)); max-width:100%; margin-inline:auto; }
.wrap-narrow { width:min(900px,calc(100% - 48px)); max-width:100%; margin-inline:auto; }
section { padding:104px 0; }
.center { text-align:center; }
.sec-head { max-width:720px; margin-bottom:56px; }
.sec-head.center { margin-inline:auto; }
.sec-head .eyebrow { margin-bottom:18px; }
.sec-head .t-lede { margin-top:18px; }
.band-paper2 { background:var(--paper-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.band-canvas { background:var(--canvas); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.band-ink { background:var(--ink); color:#C9CEC2; }
.band-ink .t-h2 { color:#fff; }
.band-ink .t-lede { color:#C9CEC2; }

/* ===================== ANNOUNCE ===================== */
.announce { background:var(--ink); color:var(--paper); text-align:center; font-size:13px; padding:9px 16px; letter-spacing:-.005em; }
.announce strong { color:var(--brand-lift); font-weight:600; }

/* ===================== LOGO STRIP ===================== */
.logos-strip { background:var(--paper); border-bottom:1px solid var(--line); padding:30px 0; }
.logos-strip .lead { text-align:center; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--subtle); margin:0 0 22px; }
.logos-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:24px 46px; max-width:1000px; margin-inline:auto; }
.logos-row img { height:25px; width:auto; filter:grayscale(1) opacity(.5); transition:filter var(--dur) var(--ease); }
.logos-row img:hover { filter:grayscale(1) opacity(.78); }
.logos-row img.tall { height:30px; }

/* ===================== WORK MIX BAND ===================== */
.wm-fig { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--subtle); margin:0 0 16px; }
.wm-bar { display:flex; gap:4px; height:84px; border-radius:10px; overflow:hidden; }
.wm-bar > span { display:flex; flex-direction:column; justify-content:flex-end; padding:16px; min-width:0; }
.wm-bar .pc { font-size:25px; font-weight:600; letter-spacing:-.03em; line-height:1; color:#fff; }
.wm-bar .nm { font-family:var(--f-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.82); margin-top:7px; }
.wm-bar > span.lt .pc,.wm-bar > span.lt .nm { color:var(--ink); } .wm-bar > span.lt .nm { color:rgba(26,31,27,.6); }
.wm-cats { display:grid; grid-template-columns:repeat(5,1fr); gap:22px; margin-top:26px; }
.wm-cat { border-top:2px solid; padding-top:14px; }
.wm-cat .ct { font-size:15px; font-weight:600; letter-spacing:-.014em; color:var(--ink); }
.wm-cat .rt { font-family:var(--f-mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--brand); margin-top:6px; }

/* ===================== DECISION ROUTES BAND ===================== */
.routes5 { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.route5 { border:1px solid var(--line); border-top-width:3px; border-radius:0 0 var(--r-4) var(--r-4); background:var(--canvas); padding:22px 20px; display:flex; flex-direction:column; }
.route5 .rno { font-family:var(--f-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--subtle); margin:0 0 14px; }
.route5 h3 { margin:0 0 10px; font-size:19px; font-weight:600; letter-spacing:-.018em; color:var(--ink); }
.route5 p { margin:0; font-size:13px; line-height:1.5; color:var(--muted); }
.routes-foot { margin-top:24px; font-size:14.5px; line-height:1.55; color:var(--body); max-width:74ch; }
.routes-foot strong { color:var(--ink); font-weight:600; }

/* ===================== PROOF STAT ===================== */
.proof { text-align:center; }
.proof .eyebrow { color:var(--brand-lift); }
.proof-stat { font-weight:600; font-size:clamp(56px,8vw,108px); line-height:1; letter-spacing:-.045em; color:#fff; margin:20px 0 0; font-variant-numeric:tabular-nums; }
.proof-sub { margin:20px auto 0; max-width:60ch; font-size:18px; line-height:1.55; color:#C9CEC2; }
.proof-foot { margin-top:26px; font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:#7A8076; }
.proof-row { display:flex; flex-wrap:wrap; justify-content:center; gap:14px 56px; margin-top:40px; padding-top:34px; border-top:1px solid var(--ink-line); }
.proof-row div { display:flex; flex-direction:column; gap:6px; }
.proof-row .v { font-size:30px; font-weight:600; letter-spacing:-.03em; color:#fff; font-variant-numeric:tabular-nums; }
.proof-row .k { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#7A8076; }

/* ===================== USE-CASE TABS ===================== */
.dept-tabs { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:32px; }
.dept-tab { padding:10px 20px; border-radius:var(--pill); border:1px solid var(--line); background:var(--canvas); font-size:14px; font-weight:500; color:var(--muted); transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease); }
.dept-tab:hover { border-color:var(--line-2); color:var(--ink); }
.dept-tab.active { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.dept-panel { display:none; }
.dept-panel.active { display:block; animation:fade .4s var(--ease); }
.dept-stat { text-align:center; margin-bottom:30px; }
.dept-stat strong { display:block; font-size:clamp(34px,4vw,46px); font-weight:600; letter-spacing:-.035em; color:var(--brand-deep); line-height:1; font-variant-numeric:tabular-nums; }
.dept-stat span { display:block; margin-top:10px; font-size:13.5px; color:var(--muted); }
.proc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.proc { display:flex; align-items:center; justify-content:space-between; gap:14px; background:var(--canvas); border:1px solid var(--line); border-radius:var(--r-4); padding:17px 18px; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease); }
.proc:hover { border-color:var(--line-2); box-shadow:var(--sh-1); }
.proc .pn { font-size:14px; font-weight:500; color:var(--ink); letter-spacing:-.01em; }
.proc .pr { display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); white-space:nowrap; }
.proc .pr i { width:9px; height:9px; border-radius:2px; flex:none; }
.dept-note { text-align:center; margin-top:28px; }
.illus-note { display:inline-block; font-family:var(--f-mono); font-size:11px; letter-spacing:.02em; color:var(--overhead-edge); background:var(--overhead-soft); border:1px solid color-mix(in srgb,var(--overhead) 40%,var(--line)); border-radius:var(--pill); padding:7px 16px; }
@media (max-width:900px){ .proc-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .proc-grid { grid-template-columns:1fr; } }

/* ===================== NAV ===================== */
.nav { position:fixed; top:0; left:0; right:0; z-index:40; background:linear-gradient(180deg, rgba(8,10,9,.55) 0%, rgba(8,10,9,0) 100%); border-bottom:1px solid transparent; transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease); }
.nav.solid { background:color-mix(in srgb,var(--paper) 90%,transparent); backdrop-filter:blur(14px); border-bottom-color:color-mix(in srgb,var(--line) 70%,transparent); }
.nav:not(.solid) .brand-logo { filter:drop-shadow(0 1px 6px rgba(0,0,0,.45)); }
.nav:not(.solid) .nav-links a { text-shadow:0 1px 8px rgba(0,0,0,.5); }
.nav-inner { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; min-height:66px; }
.brand-lockup { display:inline-flex; align-items:center; gap:9px; }
.brand-logo.logo-on-light { display:none; }
.nav.solid .brand-logo.logo-on-dark { display:none; }
.nav.solid .brand-logo.logo-on-light { display:block; }
.nav-links { display:flex; align-items:center; justify-content:center; gap:32px; }
.nav-links a { font-size:14px; color:var(--paper); position:relative; padding:4px 0; transition:color var(--dur) var(--ease); }
.nav.solid .nav-links a { color:var(--muted); }
.nav-links a:hover { color:#fff; }
.nav.solid .nav-links a:hover { color:var(--ink); }
.nav-links a::after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:#fff; transition:width var(--dur) var(--ease); }
.nav.solid .nav-links a::after { background:var(--ink); }
.nav-links a:hover::after { width:100%; }
.nav-cta { display:flex; justify-content:flex-end; }
.nav-cta .btn { padding:10px 18px; font-size:13.5px; background:var(--paper); color:var(--ink); }
.nav-cta .btn:hover { background:#fff; transform:translateY(-1px); }
.nav.solid .nav-cta .btn { background:var(--ink); color:var(--paper); }
.nav.solid .nav-cta .btn:hover { background:#000; }

/* ===================== HERO ===================== */
.hero { position:relative; min-height:100svh; display:flex; align-items:center; isolation:isolate; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; background:#0C0E0C center/cover no-repeat; background-image:url('assets/office-hero.png'); }
.hero-scrim { position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(72% 56% at 50% 42%, rgba(8,10,9,.66), rgba(8,10,9,0) 78%),
    radial-gradient(120% 100% at 50% 28%, rgba(8,10,9,.42), rgba(8,10,9,.72)),
    linear-gradient(180deg, rgba(8,10,9,.58) 0%, rgba(8,10,9,.12) 30%, rgba(8,10,9,.12) 56%, rgba(8,10,9,.72) 100%); }
.hero-inner { position:relative; z-index:2; text-align:center; padding:104px 0 124px; }
/* hero-bottom logo strip (visible on landing) */
.hero-logos { position:absolute; left:0; right:0; bottom:0; z-index:3; padding:14px 0 18px; background:linear-gradient(0deg, rgba(8,10,9,.72) 0%, rgba(8,10,9,.28) 60%, rgba(8,10,9,0) 100%); }
.hero-logos .hl-lead { text-align:center; font-family:var(--f-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.5); margin:0 0 10px; }
.hl-marquee { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.hl-track { display:flex; align-items:center; width:max-content; gap:0; animation:hl-scroll 46s linear infinite; }
.hl-track img { height:26px; width:auto; margin:0 34px; opacity:.92; flex:none; filter:brightness(0) saturate(0) invert(96%) sepia(8%) saturate(180%) hue-rotate(8deg); }
.hero-logos:hover .hl-track { animation-play-state:paused; }
@keyframes hl-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .hl-track { animation:none; } .hl-marquee { overflow-x:auto; } }
.hero .pill { display:inline-block; font-family:var(--f-mono); font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.74); background:none; border:0; padding:0; margin-bottom:24px; backdrop-filter:none; text-shadow:0 1px 8px rgba(0,0,0,.55); }
.hero .pill::before { display:none; }
.hero h1 { margin:0 auto; max-width:none; color:var(--paper); text-shadow:0 2px 26px rgba(8,10,9,.55); }
.hero .t-lede { margin:22px auto 0; max-width:660px; color:var(--paper); text-shadow:0 1px 16px rgba(8,10,9,.6); }
.hero .t-lede strong { color:#fff; font-weight:600; }
.hero-ctas { display:flex; flex-wrap:wrap; gap:13px; justify-content:center; margin-top:30px; }
.hero-foot { display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; margin-top:24px; font-family:var(--f-mono); font-size:11.5px; letter-spacing:.05em; color:rgba(255,255,255,.66); text-transform:uppercase; }
.hero-foot span { display:inline-flex; align-items:center; gap:10px; }
.hero-foot span:not(:first-child)::before { content:''; width:4px; height:4px; border-radius:50%; background:rgba(255,255,255,.4); margin-right:16px; }

/* left-aligned hero variant (remove .hero--left for centred fallback) */
.hero--left .hero-inner { text-align:left; }
.hero.hero--left .pill { margin-left:0; }
.hero.hero--left h1 { margin:0; max-width:640px; }
.hero.hero--left .t-lede { margin:26px 0 0; max-width:520px; }
.hero--left .hero-ctas { justify-content:flex-start; }
.hero--left .hero-foot { justify-content:flex-start; }
.hero--left .hero-scrim { background:
  linear-gradient(90deg, rgba(8,10,9,.84) 0%, rgba(8,10,9,.54) 40%, rgba(8,10,9,.14) 70%, rgba(8,10,9,0) 100%),
  linear-gradient(0deg, rgba(8,10,9,.7) 0%, rgba(8,10,9,0) 42%); }

/* typewriter rotating clause — own line, centred as a unit, caret attached */
.tw-wrap { display:block; }
.tw { color:#54B894; white-space:nowrap; }
.tw::after { content:''; display:inline-block; width:2px; height:0.9em; margin-left:4px; vertical-align:-0.08em; background:var(--brand-lift); animation:tw-blink 1.1s steps(2,start) infinite; }
@keyframes tw-blink { 0%,100%{ opacity:1; } 50%{ opacity:0; } }
@media (prefers-reduced-motion:reduce){ .tw::after { animation:none; opacity:0; } }
@media (prefers-reduced-motion:reduce){ .tw { border-right-color:transparent; } }

/* ===================== WHY NOW / QUESTION GRIDS ===================== */
.qn-intro { display:grid; grid-template-columns:0.8fr 1.2fr; gap:40px; align-items:start; margin-bottom:54px; }
.qn-intro .eyebrow { margin-top:8px; }
.qn-intro h2 { margin:0; }
.qn-intro p { margin:16px 0 0; }
.qn-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); border-radius:var(--r-5); overflow:hidden; background:var(--canvas); }
.qn-grid article { padding:30px 26px 34px; border-right:1px solid var(--line); position:relative; }
.qn-grid article:last-child { border-right:0; }
.qn-grid .qmeta { display:flex; flex-direction:column; gap:3px; margin-bottom:auto; font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.qn-grid .qmeta strong { color:var(--brand); font-weight:600; }
.qn-grid .qmeta span { color:var(--subtle); }
.qn-grid h3 { margin:22px 0 10px; font-size:20px; font-weight:600; letter-spacing:-.018em; color:var(--ink); line-height:1.2; }
.qn-grid article > span { font-size:14px; line-height:1.55; color:var(--muted); }

/* compact reason variant */
.qn-grid.reasons article { display:flex; flex-direction:column; }
.qn-grid.reasons .rn { font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--brand); margin:0 0 16px; }

/* ===================== INTERACTIVE SHOWCASE ===================== */
.showcase { margin-top:8px; }
.win { background:var(--canvas); border-radius:16px; box-shadow:var(--sh-panel); overflow:hidden; max-width:1080px; margin:0 auto; }
.win-bar { display:flex; align-items:center; gap:10px; padding:13px 18px; border-bottom:1px solid var(--line); background:var(--canvas-2); }
.win-bar .dots { display:flex; gap:6px; }
.win-bar .dots i { width:10px; height:10px; border-radius:50%; background:var(--line-2); }
.win-bar .url { margin-left:8px; font-family:var(--f-mono); font-size:12px; color:var(--muted); letter-spacing:-.01em; }
.win-bar .live { margin-left:auto; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--brand); display:inline-flex; align-items:center; gap:7px; }
.win-bar .live::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 3px rgba(31,122,97,.22); }
.app-tabs { display:flex; align-items:center; gap:4px; padding:12px 18px; border-bottom:1px solid var(--line); background:var(--paper-2); overflow-x:auto; }
.app-tabs .ov { font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--subtle); margin-right:10px; }
.app-tabs button { padding:8px 15px; border-radius:var(--pill); font-size:13.5px; font-weight:500; color:var(--muted); white-space:nowrap; transition:background var(--dur) var(--ease),color var(--dur) var(--ease); }
.app-tabs button:hover { color:var(--ink); }
.app-tabs button.active { background:var(--ink); color:var(--paper); }
.view { padding:30px 34px 26px; display:none; }
.view.active { display:block; animation:fade .4s var(--ease); }
@keyframes fade { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.view-intro { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:22px; }
.view-intro h3 { margin:0; font-size:17px; font-weight:600; letter-spacing:-.016em; color:var(--ink); }
.view-intro p { margin:0; font-family:var(--f-mono); font-size:12px; color:var(--subtle); letter-spacing:-.01em; }

/* work mix bar + legend */
.mix { display:flex; gap:4px; height:42px; border-radius:8px; overflow:hidden; margin-bottom:14px; }
.mix span { display:flex; align-items:flex-end; padding:7px 9px; font-family:var(--f-mono); font-size:13px; font-weight:500; color:#fff; }
.legend { display:flex; flex-wrap:wrap; gap:8px 20px; margin-bottom:24px; }
.legend span { display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); }
.legend i { width:9px; height:9px; border-radius:2px; }
.c-judgement { background:var(--judgement); } .c-execution { background:var(--execution); }
.c-coordination { background:var(--coordination); } .c-overhead { background:var(--overhead); } .c-burden { background:var(--burden); }

/* mekko */
.mekko { display:grid; grid-template-columns:1.3fr 1.5fr 1fr; gap:8px; height:280px; }
.mekko-col { display:flex; flex-direction:column; gap:6px; min-width:0; }
.mekko-col > strong { font-family:var(--f-mono); font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:var(--subtle); font-weight:500; margin-bottom:2px; }
.mekko-col > span { border-radius:7px; padding:11px 12px; position:relative; display:flex; flex-direction:column; gap:3px; overflow:hidden; min-height:0; color:#fff; }
.mekko-col > span b { font-size:12.5px; font-weight:600; line-height:1.2; letter-spacing:-.01em; }
.mekko-col > span small { font-family:var(--f-mono); font-size:10px; opacity:.82; }
.mekko-col > span em { position:absolute; right:11px; top:10px; font-family:var(--f-mono); font-size:11px; font-style:normal; opacity:.9; }

/* showcase foot */
.view-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.view-foot span { font-family:var(--f-mono); font-size:11.5px; color:var(--muted); }
.view-foot strong { font-weight:600; font-size:19px; color:var(--brand); letter-spacing:-.02em; display:flex; flex-direction:column; align-items:flex-end; }
.view-foot strong small { font-family:var(--f-mono); font-size:9.5px; font-weight:400; letter-spacing:.04em; text-transform:uppercase; color:var(--subtle); }

/* hotspots */
.hot-grid { display:grid; grid-template-columns:0.7fr 1.3fr; gap:24px; }
.hot-lead { background:var(--ink); color:#fff; border-radius:var(--r-4); padding:24px; display:flex; flex-direction:column; }
.hot-lead span { font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--brand-lift); }
.hot-lead strong { font-size:42px; font-weight:600; letter-spacing:-.04em; margin:10px 0; }
.hot-lead p { margin:auto 0 0; font-size:13px; line-height:1.5; color:#AEB3A6; }
.hot-list { display:flex; flex-direction:column; }
.hot-list article { display:grid; grid-template-columns:auto auto 1fr auto; align-items:center; gap:14px; padding:13px 4px; border-bottom:1px solid var(--line); }
.hot-list article:last-child { border-bottom:0; }
.hot-list article > span { font-family:var(--f-mono); font-size:11px; color:var(--subtle); }
.hot-list article > i { width:9px; height:9px; border-radius:2px; }
.hot-list article > div { display:flex; flex-direction:column; gap:2px; }
.hot-list article strong { font-size:14px; font-weight:600; color:var(--ink); letter-spacing:-.01em; }
.hot-list article small { font-family:var(--f-mono); font-size:11px; color:var(--muted); }
.hot-list article em { font-family:var(--f-mono); font-size:13px; font-style:normal; color:var(--ink); }

/* opportunities */
.opp-table { display:flex; flex-direction:column; }
.opp-table article { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:16px; padding:14px 4px; border-bottom:1px solid var(--line); }
.opp-table article > span { font-family:var(--f-mono); font-size:12px; color:var(--brand); font-weight:500; }
.opp-table article > div { display:flex; flex-direction:column; gap:2px; }
.opp-table strong { font-size:14.5px; font-weight:600; color:var(--ink); letter-spacing:-.01em; }
.opp-table small { font-family:var(--f-mono); font-size:11px; color:var(--muted); }
.opp-table > article > em { font-family:var(--f-mono); font-size:13px; font-style:normal; color:var(--ink); font-variant-numeric:tabular-nums; }
.opp-table b { font-family:var(--f-mono); font-size:10px; letter-spacing:.03em; text-transform:uppercase; padding:5px 10px; border-radius:var(--pill); white-space:nowrap; }
.route-Automate { background:var(--overhead-soft); color:var(--overhead-edge); }
.route-Simplify { background:var(--coordination-soft); color:var(--coordination-edge); }
.route-AI-enable { background:var(--execution-soft); color:var(--execution-edge); }
.route-Stop { background:var(--burden-soft); color:var(--burden-edge); }
.route-Protect { background:var(--judgement-soft); color:var(--judgement-edge); }
.opp-summary { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:20px; padding:18px 22px; background:var(--ink); border-radius:var(--r-4); }
.opp-summary p { margin:0; font-size:13px; line-height:1.5; color:#C9CEC2; max-width:62ch; }
.opp-summary strong { font-weight:600; font-size:18px; color:var(--brand-lift); letter-spacing:-.02em; white-space:nowrap; }

/* pulse */
.pulse-show { display:grid; grid-template-columns:1.4fr 1fr; gap:26px; align-items:center; }
.pulse-chart { position:relative; background:var(--paper-2); border-radius:var(--r-4); padding:20px; }
.pulse-chart svg { width:100%; height:200px; overflow:visible; }
.pulse-chart svg path { fill:none; stroke:var(--line-2); stroke-width:1; }
.pulse-chart svg polyline { fill:none; stroke:var(--brand); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.pulse-chart svg polyline.down { stroke:var(--burden); stroke-dasharray:5 6; }
.pulse-chart .baselinePoint,.pulse-chart .currentPoint { position:absolute; font-family:var(--f-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; }
.pulse-chart .baselinePoint { left:24px; bottom:20px; color:var(--burden-edge); }
.pulse-chart .currentPoint { right:20px; top:18px; color:var(--brand-deep); }
.pulse-rows { display:flex; flex-direction:column; gap:0; }
.pulse-rows article { display:grid; grid-template-columns:1fr auto; row-gap:3px; column-gap:14px; padding:14px 0; border-bottom:1px solid var(--line); }
.pulse-rows article:last-child { border-bottom:0; }
.pulse-rows article > span { font-size:14px; font-weight:600; color:var(--ink); letter-spacing:-.01em; }
.pulse-rows article > small { grid-column:1; font-family:var(--f-mono); font-size:11px; color:var(--subtle); }
.pulse-rows article > strong { grid-row:1; grid-column:2; font-weight:600; font-size:18px; color:var(--ink); text-align:right; letter-spacing:-.02em; }
.pulse-rows article > em { grid-row:2; grid-column:2; font-family:var(--f-mono); font-size:11px; font-style:normal; color:var(--brand); text-align:right; }

/* reveal links under showcase */
.reveal-links { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:54px; }
.reveal-links article { padding-top:22px; border-top:2px solid var(--ink); }
.reveal-links h3 { margin:0 0 8px; font-size:18px; font-weight:600; letter-spacing:-.018em; color:var(--ink); }
.reveal-links p { margin:0 0 16px; font-size:14px; line-height:1.55; color:var(--muted); }

/* ===================== METHOD ===================== */
.method-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.method-card { background:var(--canvas); border:1px solid var(--line); border-radius:var(--r-4); padding:22px; display:flex; flex-direction:column; }
.method-top { display:flex; align-items:center; gap:11px; margin-bottom:18px; }
.method-top span { width:26px; height:26px; border-radius:7px; background:var(--brand-soft); color:var(--brand-deep); font-family:var(--f-mono); font-size:13px; font-weight:500; display:grid; place-items:center; }
.method-top h3 { margin:0; font-size:16px; font-weight:600; letter-spacing:-.016em; color:var(--ink); }
.method-mini { background:var(--canvas-2); border:1px solid var(--line); border-radius:var(--r-3); padding:12px; margin-bottom:16px; flex:1; min-height:148px; }
.method-chrome { display:flex; align-items:center; gap:5px; margin-bottom:11px; }
.method-chrome i { width:6px; height:6px; border-radius:50%; background:var(--line-2); }
.method-chrome span { margin-left:6px; font-family:var(--f-mono); font-size:8.5px; color:var(--subtle); letter-spacing:.02em; }
.method-mini.cap p { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:11px; color:var(--body); padding:4px 0; margin:0; }
.method-mini.cap p strong { font-family:var(--f-mono); font-size:8.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--brand); font-weight:500; }
.method-mini.cap p strong.ex { color:var(--burden-edge); }
.method-bars { display:flex; gap:2px; height:32px; border-radius:5px; overflow:hidden; margin-bottom:11px; }
.method-bars span { display:block; }
.method-legend { display:flex; flex-direction:column; gap:5px; }
.method-legend span { display:inline-flex; align-items:center; gap:7px; font-size:10px; color:var(--muted); }
.method-legend i { width:7px; height:7px; border-radius:2px; }
.map-mini { display:grid; grid-template-columns:repeat(4,1fr); gap:3px; }
.map-mini > div { display:flex; flex-direction:column; gap:3px; }
.map-mini span { border-radius:3px; }
.map-mini .c-judgement,.map-mini .c-execution { height:34px; } .map-mini .c-coordination,.map-mini .c-overhead { height:26px; } .map-mini .c-burden { height:18px; }
.method-mini.dec p { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:11px; color:var(--body); padding:5px 0; margin:0; border-bottom:1px solid var(--line); }
.method-mini.dec p:last-child { border-bottom:0; }
.method-mini.dec strong { font-family:var(--f-mono); font-size:8.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--brand); font-weight:500; }
.method-card > p { margin:0; font-size:13px; line-height:1.5; color:var(--muted); }
.method-link { display:inline-flex; margin-top:40px; }

/* ===================== VIDEO ===================== */
.video-frame { max-width:980px; margin:0 auto; border-radius:var(--r-6); overflow:hidden; box-shadow:var(--sh-panel); background:#000; }
.video-frame video { width:100%; display:block; aspect-ratio:16/9; object-fit:cover; background:#000; }

/* ===================== OLD WAY (center block) ===================== */
.struck { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:30px; }
.struck s { font-size:16px; color:var(--subtle); text-decoration-thickness:1.5px; text-decoration-color:var(--line-2); }

/* ===================== GOALS ===================== */
.goal-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.goal-card { background:var(--canvas); border:1px solid var(--line); border-radius:var(--r-4); padding:26px; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease); }
.goal-card:hover { border-color:var(--line-2); box-shadow:var(--sh-2); transform:translateY(-2px); }
.goal-icon { width:42px; height:42px; border-radius:var(--r-3); background:var(--brand-soft); color:var(--brand-deep); display:grid; place-items:center; font-size:20px; margin-bottom:18px; }
.goal-card > p { margin:0 0 8px; font-family:var(--f-mono); font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:var(--subtle); }
.goal-card h3 { margin:0 0 9px; font-size:18px; font-weight:600; letter-spacing:-.018em; color:var(--ink); }
.goal-card > span { font-size:14px; line-height:1.55; color:var(--muted); }

/* ===================== PRODUCTS ===================== */
.product-cards { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.product-card { border-radius:var(--r-6); padding:38px; display:flex; flex-direction:column; }
.product-card.dark { background:var(--ink); color:#C9CEC2; }
.product-card.light { background:var(--canvas); border:1px solid var(--line); }
.product-card .eyebrow { margin-bottom:14px; }
.product-card.dark .eyebrow { color:var(--brand-lift); }
.product-card h3 { margin:0 0 12px; font-size:28px; font-weight:600; letter-spacing:-.024em; }
.product-card.dark h3 { color:#fff; }
.product-card.light h3 { color:var(--ink); }
.product-card > span { font-size:14.5px; line-height:1.55; }
.product-card.light > span { color:var(--body); }
.product-details { display:flex; gap:0; margin:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.product-card.dark .product-details { border-color:var(--ink-line); }
.product-details p { flex:1; margin:0; padding:14px 16px 14px 0; }
.product-details small { display:block; font-family:var(--f-mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--subtle); margin-bottom:6px; }
.product-details strong { font-size:15px; font-weight:600; letter-spacing:-.01em; }
.product-card.dark .product-details strong { color:#fff; }
.product-card.light .product-details strong { color:var(--ink); }
.product-card ul { list-style:none; margin:0 0 26px; padding:0; display:flex; flex-direction:column; gap:11px; }
.product-card li { position:relative; padding-left:26px; font-size:13.5px; line-height:1.5; }
.product-card li::before { content:''; position:absolute; left:0; top:2px; width:16px; height:16px; border-radius:50%; background:var(--brand-soft); background-repeat:no-repeat; background-position:center;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.6L12 5.4' fill='none' stroke='%23165C49' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.product-card.dark li::before { background:rgba(63,165,135,.2); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.6L12 5.4' fill='none' stroke='%233FA587' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.product-card .lnk { margin-top:auto; }
.product-card.dark .lnk { color:var(--brand-lift); }

/* ===================== TRUST ===================== */
.trust-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:48px; }
.trust-lead h2 { margin:14px 0 0; }
.trust-lead > p { margin:18px 0 0; max-width:48ch; }
.agent-note { margin-top:28px; border-left:2px solid var(--brand); background:var(--brand-soft); border-radius:0 var(--r-3) var(--r-3) 0; padding:18px 22px; }
.agent-note span { font-family:var(--f-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--brand-deep); }
.agent-note p { margin:8px 0 0; font-size:13.5px; line-height:1.55; color:var(--ink); }
.trust-links { display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:26px; }
.trust-principles { display:flex; flex-direction:column; gap:0; }
.trust-principles article { padding:22px 0; border-bottom:1px solid var(--line); }
.trust-principles article:first-child { padding-top:0; }
.trust-principles article:last-child { border-bottom:0; }
.trust-principles p { margin:0 0 8px; font-family:var(--f-mono); font-size:12px; letter-spacing:-.01em; color:var(--brand); font-weight:500; }
.trust-principles span { font-size:14px; line-height:1.55; color:var(--body); }

/* ===================== FAQ ===================== */
.faq { max-width:860px; margin-inline:auto; }
.faq details { border-bottom:1px solid var(--line); }
.faq details:first-child { border-top:1px solid var(--line); }
.faq summary { list-style:none; cursor:pointer; padding:24px 0; display:flex; align-items:center; gap:18px; font-weight:500; font-size:17px; color:var(--ink); letter-spacing:-.014em; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:''; margin-left:auto; flex:none; width:13px; height:13px; position:relative; transition:transform var(--dur) var(--ease);
  background:
    linear-gradient(var(--muted),var(--muted)) center/13px 2px no-repeat,
    linear-gradient(var(--muted),var(--muted)) center/2px 13px no-repeat; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq-body { padding:0 0 26px; max-width:740px; }
.faq-body p { margin:0 0 14px; font-size:15px; line-height:1.62; color:var(--body); }
.faq-body p:last-child { margin-bottom:0; }
.faq-body strong { font-weight:600; color:var(--ink); }
.faq-body a { color:var(--brand); font-weight:500; font-size:14px; display:inline-flex; gap:6px; }

/* ===================== FINAL ===================== */
.final { background:var(--ink); color:#C9CEC2; text-align:center; }
.final .eyebrow { color:var(--brand-lift); }
.final h2 { margin:16px auto 0; max-width:20ch; color:#fff; }
.final > .wrap > p { margin:22px auto 0; max-width:60ch; font-size:17px; line-height:1.55; color:#C9CEC2; }
.final-ctas { display:flex; flex-wrap:wrap; gap:13px; justify-content:center; margin-top:34px; }
.final-tag { display:block; margin-top:30px; font-family:var(--f-mono); font-size:12px; letter-spacing:.04em; color:#7A8076; }

/* ===================== FOOTER ===================== */
.footer { background:var(--ink); color:#8A8F84; padding:66px 0 34px; border-top:1px solid var(--ink-line); }
.footer-grid { display:grid; grid-template-columns:2fr repeat(4,1fr); gap:32px; padding-bottom:46px; border-bottom:1px solid var(--ink-line); }
.footer-brand { display:inline-flex; align-items:center; gap:9px; color:#fff; font-weight:600; font-size:19px; letter-spacing:-.04em; margin-bottom:14px; }
.footer .pos { font-family:var(--f-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--brand-lift); margin:0 0 14px; }
.footer .biz { font-size:12.5px; line-height:1.7; color:#6E7368; margin:0; }
.footer .biz a { color:#8A8F84; }
.footer .biz a:hover { color:#fff; }
.footer-col h2 { margin:0 0 16px; font-size:11px; font-family:var(--f-mono); letter-spacing:.08em; text-transform:uppercase; color:#6E7368; font-weight:500; }
.footer-col { display:flex; flex-direction:column; gap:11px; }
.footer-col a { font-size:13.5px; color:#8A8F84; transition:color var(--dur) var(--ease); }
.footer-col a:hover { color:#fff; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:26px; flex-wrap:wrap; }
.footer-bottom p { margin:0; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.04em; color:#5C6157; }
.footer-bottom div { display:flex; gap:20px; }
.footer-bottom a { font-size:12px; color:#6E7368; }
.footer-bottom a:hover { color:#fff; }

/* ===================== REVEAL ===================== */
.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease),transform .6s var(--ease); }
.reveal.is-visible { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .reveal{opacity:1;transform:none;transition:none;} .view.active{animation:none;} }

/* ===================== RESPONSIVE ===================== */
@media (max-width:1020px){
  .qn-intro { grid-template-columns:1fr; gap:24px; }
  .qn-grid,.qn-grid.reasons { grid-template-columns:repeat(2,1fr); }
  .qn-grid article:nth-child(2){ border-right:0; }
  .qn-grid article{ border-bottom:1px solid var(--line); }
  .routes5,.wm-cats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .method-grid { grid-template-columns:repeat(2,1fr); }
  .goal-cards { grid-template-columns:repeat(2,1fr); }
  .product-cards { grid-template-columns:1fr; }
  .trust-grid { grid-template-columns:1fr; gap:40px; }
  .reveal-links { grid-template-columns:1fr; gap:0; }
  .reveal-links article { border-top:1px solid var(--line); padding:22px 0; }
  .reveal-links article:first-child { border-top:2px solid var(--ink); }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .nav-links { display:none; }
  .nav-inner { grid-template-columns:1fr auto; }
  .mekko { grid-template-columns:1fr; height:auto; }
  .pulse-show { grid-template-columns:1fr; }
  .hot-grid { grid-template-columns:1fr; }
}
@media (max-width:620px){
  section { padding:72px 0; }
  .wrap,.wrap-narrow { width:calc(100% - 32px); }
  .hero { min-height:100svh; align-items:center; }
  .hero-inner { padding:86px 0 116px; }
  .hero .pill { max-width:32ch; font-size:9px; line-height:1.45; letter-spacing:.13em; margin-bottom:18px; }
  .hero h1 { font-size:clamp(34px,10.4vw,44px); max-width:100%; line-height:1.05; }
  .hero .t-lede { margin-top:20px; font-size:15.5px; line-height:1.48; }
  .hero-ctas { gap:10px; margin-top:26px; }
  .hero-ctas .btn { min-height:52px; padding:14px 18px; }
  .hero-logos { padding:10px 0 14px; }
  .hero-logos .hl-lead { margin-bottom:8px; font-size:8px; }
  .hl-track img { height:18px; margin:0 22px; }
  .tw { white-space:normal; }
  .hero-foot { gap:8px 14px; margin-top:22px; font-size:10px; }
  .hero-foot span:not(:first-child)::before { display:none; }
  .qn-grid,.qn-grid.reasons,.method-grid,.goal-cards,.footer-grid,.wm-cats,.routes5 { grid-template-columns:1fr; }
  .qn-grid article{ border-right:0; }
  .route5 { padding:20px 18px; }
  .wm-bar { height:auto; flex-direction:column; }
  .wm-bar > span { min-height:64px; }
  .view { padding:22px 18px; }
  .showcase,.win,.view,.wm-bar,.wc-feed,.product-card,.trust-principles,.final { max-width:100%; }
  .wm-bar { min-width:0; overflow:hidden; }
  .view-intro,.view-foot,.opp-summary { flex-direction:column; align-items:flex-start; }
  .view-foot strong { align-items:flex-start; }
  .opp-summary strong { white-space:normal; }
  .opp-table article { grid-template-columns:auto 1fr; row-gap:6px; }
  .opp-table article > em,.opp-table b { grid-column:2; justify-self:start; }
  .nav-cta .btn { display:none; }
  .wc-feed { border-radius:14px; }
  .wc-row { grid-template-columns:1fr; gap:8px; padding:18px; }
  .wc-delta { text-align:left; white-space:normal; }
}

/* ===================== DEMO INTAKE ===================== */
.demo-intake {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(10, 13, 11, .62);
  backdrop-filter: blur(14px);
}
.demo-intake__panel {
  position: relative;
  width: min(760px, 100%);
  max-height: min(860px, calc(100vh - 44px));
  overflow: auto;
  border: 1px solid rgba(31, 32, 30, .08);
  border-radius: 24px;
  background: #fcfbf6;
  color: var(--ink);
  box-shadow: 0 40px 90px -34px rgba(12, 16, 12, .55), 0 2px 8px -3px rgba(12, 16, 12, .18);
  padding: 44px 48px 40px;
}
.demo-intake__accent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #2e6b4e, var(--green) 38%, #3fa587 70%, #d4b968);
}
.demo-intake__close {
  position: absolute;
  top: 22px;
  right: 22px;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 0;
  background: #f6f1e8;
  color: var(--muted);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s cubic-bezier(.2, .6, .2, 1), color .2s cubic-bezier(.2, .6, .2, 1), transform .2s cubic-bezier(.2, .6, .2, 1);
}
.demo-intake__close:hover {
  background: #e6e1d2;
  color: var(--ink);
  transform: rotate(90deg);
}
.demo-intake__head {
  padding-right: 44px;
}
.demo-intake__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--green);
  font-weight: 600;
}
.demo-intake__mark {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(4, 1fr);
  width: 18px;
  aspect-ratio: 5 / 4;
}
.demo-intake__mark i {
  background: currentColor;
  border-radius: 1px;
}
.demo-intake__mark i:nth-child(1) {
  grid-column: 2;
  grid-row: 2;
}
.demo-intake__mark i:nth-child(2) {
  grid-column: 3;
  grid-row: 2;
}
.demo-intake__mark i:nth-child(3) {
  grid-column: 4;
  grid-row: 2;
}
.demo-intake__mark i:nth-child(4) {
  grid-column: 3;
  grid-row: 3;
}
.demo-intake h2 {
  margin: 0;
  font-size: clamp(30px, 4.2vw, 34px);
  line-height: 1.06;
  letter-spacing: -.03em;
  font-weight: 600;
}
.demo-intake__lede,
.demo-intake__success p {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 15.5px;
  line-height: 1.55;
  max-width: 52ch;
}
.demo-intake__form {
  margin-top: 30px;
  display: grid;
  gap: 18px;
}
.demo-intake__form label {
  display: grid;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -.01em;
}
.demo-intake__form label span {
  font-size: 11.5px;
  font-weight: 400;
  color: var(--muted);
  letter-spacing: .02em;
}
.demo-intake__form input,
.demo-intake__form textarea {
  width: 100%;
  border: 1px solid #ded8c6;
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 15px;
  font-weight: 400;
  padding: 13px 15px;
  outline: none;
  transition: border-color .2s cubic-bezier(.2, .6, .2, 1), box-shadow .2s cubic-bezier(.2, .6, .2, 1), background .2s cubic-bezier(.2, .6, .2, 1);
}
.demo-intake__form textarea {
  resize: vertical;
  min-height: 108px;
}
.demo-intake__form input:focus,
.demo-intake__form textarea:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 4px rgba(31, 122, 97, .14);
}
.demo-intake__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 20px;
}
.demo-intake__honeypot {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.demo-intake__error {
  margin: 0;
  color: #9a3d2b;
  font-size: 14px;
  font-weight: 700;
}
.demo-intake__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 10px;
  padding-top: 24px;
  border-top: 1px solid #ded8c6;
}
.demo-intake__privacy {
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: 34ch;
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}
.demo-intake__privacy-icon {
  width: 15px;
  height: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid currentColor;
  border-radius: 4px;
  color: #165c49;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}
.demo-intake__buttons {
  display: flex;
  align-items: center;
  gap: 14px;
}
.demo-intake__submit {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: #f4f2ea;
  border-radius: 8px;
  padding: 13px 24px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s cubic-bezier(.2, .6, .2, 1), transform .2s cubic-bezier(.2, .6, .2, 1);
}
.demo-intake__submit:hover {
  background: #000;
  transform: translateY(-1px);
}
.demo-intake__submit:disabled {
  cursor: not-allowed;
  opacity: .62;
  transform: none;
}
.demo-intake__buttons a {
  color: var(--green);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.demo-intake__success {
  padding: 52px 10px 8px;
  text-align: center;
}
.demo-intake__tick {
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  margin: 0 auto 22px;
  border-radius: 999px;
  background: #dce8e0;
  color: #165c49;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}
.demo-intake__success p {
  margin-left: auto;
  margin-right: auto;
  max-width: 42ch;
}
.demo-intake__success .demo-intake__submit {
  margin-top: 24px;
}
@media (max-width:640px){
  .demo-intake {
    padding: 12px;
    place-items: end center;
  }
  .demo-intake__panel {
    max-height: calc(100vh - 24px);
    border-radius: 22px;
    padding: 34px 24px 30px;
  }
  .demo-intake__row {
    grid-template-columns: 1fr;
  }
  .demo-intake__head {
    padding-right: 34px;
  }
  .demo-intake h2 {
    font-size: 28px;
  }
  .demo-intake__lede,
  .demo-intake__success p {
    font-size: 16px;
  }
  .demo-intake__actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .demo-intake__buttons {
    justify-content: space-between;
  }
  .demo-intake__submit {
    flex: 1;
    justify-content: center;
  }
}

/* ===================== WHAT CHANGED (change feed) ===================== */
.wc-feed{max-width:1020px;margin:42px auto 0;background:var(--ink);border-radius:22px;box-shadow:var(--sh-panel);overflow:hidden}
.wc-row{display:grid;grid-template-columns:118px 148px 1fr auto;gap:26px;align-items:center;padding:24px 34px;border-bottom:1px solid rgba(244,242,234,.08)}
.wc-row:last-child{border-bottom:0}
.wc-week{font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;color:rgba(244,242,234,.45);white-space:nowrap}
.wc-chip{font-family:var(--f-mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;padding:6px 12px;border-radius:999px;justify-self:start;white-space:nowrap}
.wc-chip--learned{background:rgba(244,242,234,.10);color:rgba(244,242,234,.72)}
.wc-chip--shift{background:var(--brand);color:#FBFDFB}
.wc-chip--new{background:rgba(196,112,95,.20);color:#E2A294}
.wc-chip--good{background:rgba(110,162,126,.18);color:#9FC9AD}
.wc-main strong{display:block;font-size:17.5px;font-weight:600;color:#F4F2EA;letter-spacing:-.01em}
.wc-main span{display:block;font-size:14.5px;color:rgba(244,242,234,.6);margin-top:3px;line-height:1.45}
.wc-delta{font-family:var(--f-mono);font-size:18px;font-weight:500;text-align:right;white-space:nowrap}
.wc-delta--down,.wc-delta--good{color:#8CC3A8}
.wc-delta--up{color:#E2A294}
.wc-delta--none{color:rgba(244,242,234,.3)}
.wc-note{text-align:center;font-size:14.5px;color:#6B7068;margin:20px auto 0;max-width:64ch}
.wc-note em{color:#9A9D93;font-style:normal}
@media (max-width:820px){
  .wc-row{grid-template-columns:1fr auto;grid-template-areas:"week week" "chip delta" "main main";row-gap:10px;padding:20px 22px}
  .wc-week{grid-area:week}.wc-chip{grid-area:chip}.wc-main{grid-area:main}.wc-delta{grid-area:delta;font-size:16px}
}

.pricing-note{max-width:880px;margin:30px auto 0;text-align:center;font-size:15px;line-height:1.6;color:#6B7068}
.pricing-note b{color:#2F342F}
