/* ========================================================================
   PLANT CORTEX — public website
   Complete rebuild. Direction: "field journal" — warm paper, deep ink,
   signature teal + amber, a technical-editorial serif for display type,
   hand-authored line icons (zero emoji), two bespoke interactions
   (focus-frame headline reveal, draggable card ring) built from scratch.
   ======================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700;9..144,800&family=Public+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --paper:#F6F1E6;
  --paper-2:#EFE7D4;
  --paper-3:#E8DEC6;
  --white:#FFFFFF;
  --ink:#171F1B;
  --ink-soft:#48544C;
  --ink-faint:#7C877D;
  --line:#DCD1B3;
  --line-strong:#C7B98F;

  --teal:#0C7A6E;
  --teal-deep:#075E55;
  --teal-bright:#35C7C2;
  --teal-tint:#DCEFEA;

  --amber:#C8631A;
  --amber-deep:#9C4C13;
  --amber-tint:#F3E0C4;

  --good:#1F7A4D;
  --good-tint:#DCEEE1;
  --bad:#B23A2E;
  --bad-tint:#F5DFDA;

  --dark-bg:#0E1815;
  --dark-card:#152621;
  --dark-line:rgba(232,224,196,.14);
  --dark-text:#EFE9D6;
  --dark-muted:#93A399;

  --font-display:'Fraunces', ui-serif, Georgia, serif;
  --font-body:'Public Sans', system-ui, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, monospace;

  --radius-sm:8px;
  --radius:14px;
  --radius-lg:22px;
  --radius-xl:32px;

  --shadow-sm:0 1px 2px rgba(23,31,27,.06);
  --shadow-md:0 8px 24px -8px rgba(23,31,27,.18);
  --shadow-lg:0 24px 60px -20px rgba(23,31,27,.28);
  --shadow-glow:0 0 0 1px rgba(12,122,110,.14), 0 18px 40px -14px rgba(12,122,110,.30);

  --container:1180px;
  --space-1:.4rem; --space-2:.8rem; --space-3:1.2rem; --space-4:1.8rem;
  --space-5:2.6rem; --space-6:3.6rem; --space-7:5.2rem; --space-8:7.4rem;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }

body{
  margin:0;
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--ink);
  margin:0 0 .6em;
  line-height:1.08;
  font-weight:600;
  letter-spacing:-.01em;
}
h1{ font-size:clamp(2.4rem, 3.1vw + 1.6rem, 4.4rem); font-weight:600; }
h2.h{ font-size:clamp(1.9rem, 1.6vw + 1.3rem, 2.7rem); font-weight:600; }
h3{ font-size:1.18rem; font-weight:600; }
h4{ font-size:1rem; font-weight:700; }
p{ margin:0 0 1em; color:var(--ink-soft); }
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }
button{ font-family:inherit; }
ul{ margin:0; padding:0; list-style:none; }

::selection{ background:var(--teal-bright); color:var(--white); }

*:focus-visible{ outline:2.5px solid var(--teal); outline-offset:3px; border-radius:4px; }

a, button, .clickable{ cursor:pointer; }
a[href]:not(.btn):not(.navlink-item):not(.navcta):not(.brand){ transition:color .18s ease; }

.wrap{ max-width:var(--container); margin:0 auto; padding:0 1.6rem; }
.wrap-narrow{ max-width:760px; margin:0 auto; padding:0 1.6rem; }

/* ---------- icons (hand-authored, stroke-based, zero emoji) ---------- */
.icon{ display:inline-flex; align-items:center; justify-content:center; }
.icon svg{ width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }

.ico-badge{
  width:52px; height:52px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:var(--teal-tint); color:var(--teal-deep);
  flex:none; margin-bottom:1rem;
}
.ico-badge svg{ width:26px; height:26px; }
.ico-badge.amber{ background:var(--amber-tint); color:var(--amber-deep); }
.ico-badge.dark{ background:rgba(53,199,194,.14); color:var(--teal-bright); }
.ico-badge.sm{ width:38px; height:38px; border-radius:10px; }
.ico-badge.sm svg{ width:19px; height:19px; }

/* ---------- scroll progress ---------- */
.scrollbar-progress{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg,var(--teal),var(--amber));
  z-index:900; transition:width .08s linear;
}

/* ---------- nav ---------- */
.topnav{
  position:sticky; top:0; z-index:500;
  padding:1rem 1.4rem 0;
}
.topnav-inner{
  max-width:var(--container); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
  background:rgba(246,241,230,.86);
  backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border:1px solid var(--line);
  border-radius:999px;
  padding:.6rem .7rem .6rem 1.1rem;
  box-shadow:var(--shadow-sm);
}
.brand{ display:flex; align-items:center; gap:.55rem; font-family:var(--font-display); font-weight:700; font-size:1.12rem; color:var(--ink); }
.brand svg{ width:30px; height:30px; color:var(--teal); }
.navlinks{ display:flex; align-items:center; gap:.2rem; }
.navlink-item{
  font-size:.92rem; font-weight:600; color:var(--ink-soft);
  padding:.55rem .9rem; border-radius:999px; transition:background .18s ease, color .18s ease;
}
.navlink-item:hover{ color:var(--ink); background:var(--paper-2); }
.navlink-item.active{ color:var(--teal-deep); background:var(--teal-tint); }
.navcta{
  margin-left:.4rem;
  background:var(--ink); color:var(--paper) !important;
  font-size:.9rem; font-weight:700;
  padding:.6rem 1.15rem; border-radius:999px;
  transition:transform .18s ease, background .18s ease;
  white-space:nowrap;
}
.navcta:hover{ background:var(--teal-deep); transform:translateY(-1px); }
.navtoggle{ display:none; background:none; border:1px solid var(--line); border-radius:999px; padding:.5rem .9rem; font-weight:600; font-size:.86rem; color:var(--ink); }

@media (max-width:860px){
  .navtoggle{ display:inline-flex; align-items:center; gap:.4rem; }
  .navlinks{
    position:absolute; top:calc(100% + .6rem); left:1.4rem; right:1.4rem;
    background:var(--white); border:1px solid var(--line); border-radius:18px;
    flex-direction:column; align-items:stretch; padding:.6rem;
    box-shadow:var(--shadow-lg);
    display:none;
  }
  .navlinks.open{ display:flex; }
  .navlink-item, .navcta{ text-align:center; }
  .navcta{ margin-left:0; margin-top:.3rem; }
}

/* ---------- eyebrow / kicker ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--font-mono); font-size:.74rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase;
  padding:.4rem .85rem; border-radius:999px;
  background:var(--teal-tint); color:var(--teal-deep);
  margin-bottom:1.1rem;
}
.eyebrow.amber{ background:var(--amber-tint); color:var(--amber-deep); }
.eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.eyebrow.on-dark{ background:rgba(53,199,194,.14); color:var(--teal-bright); }

/* ---------- generic layout helpers ---------- */
.pad{ padding:var(--space-7) 0; }
.pad.tight{ padding:var(--space-6) 0; }
.section-head{ max-width:640px; margin-bottom:var(--space-5); }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head p{ font-size:1.05rem; }
.lede{ font-size:1.14rem; color:var(--ink-soft); max-width:60ch; }
.crumb{ font-family:var(--font-mono); font-size:.78rem; color:var(--ink-faint); margin-bottom:1.2rem; }
.crumb a{ color:var(--teal-deep); }
.section-foot-link{ margin-top:2rem; }
.section-foot-link a{ font-weight:700; color:var(--teal-deep); }
.section-foot-link a:hover{ text-decoration:underline; }

/* reveal-on-scroll (JS toggles .in) */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1 !important; transform:none !important; transition:none !important; } }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-weight:700; font-size:.98rem;
  padding:.9rem 1.6rem; border-radius:999px;
  border:1px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn-primary{ background:var(--ink); color:var(--paper); box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--teal-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-primary:active{ transform:translateY(0); }
.btn-ghost{ background:transparent; border-color:var(--line-strong); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--ink); background:var(--paper-2); }
.btn:disabled{ opacity:.5; cursor:not-allowed; transform:none !important; }

/* ================= HERO ================= */
.hero{ position:relative; padding:var(--space-8) 0 var(--space-7); overflow:hidden; }
.hero-field{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.hero-field svg{ width:100%; height:100%; }
.hero-grid-cols{ display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-6); align-items:center; position:relative; z-index:1; }
@media (max-width:960px){ .hero-grid-cols{ grid-template-columns:1fr; } }

.hero h1{ max-width:15ch; }
.hero-ctas{ display:flex; gap:.9rem; flex-wrap:wrap; margin:1.8rem 0 2.2rem; }
.hero-proof{ display:flex; gap:2.2rem; flex-wrap:wrap; padding-top:1.6rem; border-top:1px solid var(--line); }
.hero-proof > div{ display:flex; flex-direction:column; gap:.25rem; }
.hero-proof .n{ font-family:var(--font-display); font-weight:700; font-size:1.5rem; color:var(--teal-deep); }
.hero-proof .l{ font-size:.82rem; color:var(--ink-faint); max-width:20ch; }

/* focus-frame headline reveal */
.focusline{ position:relative; margin:0 0 .5em; }
.focusline .word{ display:inline-block; filter:blur(4.5px); opacity:.34; will-change:filter, opacity; }
.focus-frame{
  position:absolute; top:0; left:0; pointer-events:none;
  border:1.5px solid var(--teal); border-radius:6px;
  box-shadow:0 0 0 4px rgba(12,122,110,.08), 0 0 22px rgba(12,122,110,.22);
  opacity:0; transition:opacity .3s ease;
}
.focus-frame::before,.focus-frame::after,
.focus-frame i::before,.focus-frame i::after{ content:''; position:absolute; width:9px; height:9px; border-color:var(--amber); }
.focus-frame::before{ top:-4px; left:-4px; border-top:2px solid var(--amber); border-left:2px solid var(--amber); }
.focus-frame::after{ bottom:-4px; right:-4px; border-bottom:2px solid var(--amber); border-right:2px solid var(--amber); }
.focusline.ready .focus-frame{ opacity:1; }

/* ---------- product card mock (pcard) ---------- */
.pcard{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); overflow:hidden;
}
.pcard-bar{ display:flex; gap:.4rem; padding:.85rem 1.1rem; border-bottom:1px solid var(--line); background:var(--paper-2); }
.pcard-bar span{ width:9px; height:9px; border-radius:50%; background:var(--line-strong); }
.pcard-bar span:first-child{ background:#D98787; }
.pcard-bar span:nth-child(2){ background:#DCC17E; }
.pcard-bar span:nth-child(3){ background:#8FBF9B; }
.pcard-body{ padding:1.6rem; }
.pc-q{ font-weight:700; font-size:1.02rem; margin-bottom:.7rem; }
.pc-badge{ display:inline-block; font-family:var(--font-mono); font-size:.72rem; font-weight:600; color:var(--teal-deep); background:var(--teal-tint); padding:.28rem .7rem; border-radius:999px; margin-bottom:.9rem; }
.pcard-body ul{ margin:0 0 1rem; padding-left:1.1rem; list-style:disc; }
.pcard-body li{ margin-bottom:.5rem; font-size:.92rem; color:var(--ink-soft); }
.pc-cite{ display:inline-block; font-family:var(--font-mono); font-size:.72rem; background:var(--paper-2); border:1px solid var(--line); padding:.3rem .6rem; border-radius:7px; margin:.2rem .3rem .2rem 0; color:var(--ink-soft); }

.hero-bento{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.hero-bento .pcard{ grid-column:1/-1; }
.bento-tile{
  background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.3rem; display:flex; flex-direction:column; gap:.3rem;
}
.bento-tile.accent{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.bento-tile .bt-n{ font-family:var(--font-display); font-weight:700; font-size:1.5rem; }
.bento-tile .bt-l{ font-size:.8rem; color:var(--ink-faint); }
.bento-tile.accent .bt-l{ color:#B7C2BB; }

/* ---------- tag strip ---------- */
.tagstrip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-2); padding:1.4rem 0; }
.tagstrip .label{ font-size:.75rem; color:var(--ink-faint); margin-bottom:.7rem; }
.mono{ font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.tagrow{ display:flex; flex-wrap:wrap; gap:.6rem 1rem; }
.tagrow span{ font-size:.86rem; font-weight:600; color:var(--ink-soft); padding:.4rem .85rem; background:var(--white); border:1px solid var(--line); border-radius:999px; }

/* ---------- industry picker ---------- */
.industry-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-bottom:1.6rem; }
.itab{
  font-family:var(--font-mono); font-size:.82rem; font-weight:600;
  padding:.55rem 1rem; border-radius:999px; border:1px solid var(--line);
  background:var(--white); color:var(--ink-soft); transition:all .16s ease;
}
.itab:hover{ border-color:var(--teal); color:var(--teal-deep); }
.itab.active{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.industry-panel{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:2rem; box-shadow:var(--shadow-sm);
}
.ip-title{ font-family:var(--font-display); font-weight:700; font-size:1.3rem; margin-bottom:.3rem; }
.ip-sub{ color:var(--ink-faint); font-size:.9rem; margin-bottom:1.3rem; }
.ip-points{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
@media (max-width:700px){ .ip-points{ grid-template-columns:1fr; } }
.ip-point{ display:flex; gap:.75rem; align-items:flex-start; }
.ip-point .icon{ width:20px; height:20px; color:var(--teal); flex:none; margin-top:.15rem; }
.ip-point p{ margin:0; font-size:.92rem; }

/* ---------- pain grid (bento) ---------- */
.pain-bento{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:auto; gap:1rem; }
@media (max-width:960px){ .pain-bento{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .pain-bento{ grid-template-columns:1fr; } }
.pain-card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.5rem; transition:transform .2s ease, box-shadow .2s ease;
}
.pain-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.pain-card.big{ grid-column:span 2; }
.pain-card.tall{ grid-row:span 1; grid-column:span 2; }
.pain-card.accent{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.pain-card.accent p{ color:#B7C2BB; }
@media (max-width:960px){ .pain-card.big,.pain-card.tall{ grid-column:span 2; } }
@media (max-width:560px){ .pain-card.big,.pain-card.tall{ grid-column:span 1; } }

/* ---------- rcard / grid3 ---------- */
.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media (max-width:860px){ .grid3{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .grid3{ grid-template-columns:1fr; } }
.rcard{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.6rem; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.rcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--line-strong); }

/* ---------- compare table ---------- */
.compare{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media (max-width:860px){ .compare{ grid-template-columns:1fr; } }
.compare .col{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; }
.compare .col h3{ margin-bottom:1rem; }
.compare .col ul{ display:flex; flex-direction:column; gap:.65rem; }
.compare .col li{ font-size:.9rem; color:var(--ink-soft); padding-left:1.3rem; position:relative; }
.compare .col li::before{ content:'—'; position:absolute; left:0; color:var(--ink-faint); }
.compare .col.win{ background:var(--teal-deep); border-color:var(--teal-deep); color:var(--white); }
.compare .col.win h3{ color:var(--white); }
.compare .col.win li{ color:#D7EBE7; }
.compare .col.win li::before{ content:'✓'; color:var(--teal-bright); font-weight:700; }

/* ---------- dark band ---------- */
.band-dark{ background:var(--dark-bg); color:var(--dark-text); padding:var(--space-7) 0; position:relative; overflow:hidden; }
.band-dark .section-head p{ color:var(--dark-muted); }
.band-dark h2{ color:var(--dark-text); }
.stat-grid-dark{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
@media (max-width:760px){ .stat-grid-dark{ grid-template-columns:1fr 1fr; } }
.stat-grid-dark > div{ text-align:center; padding:1.6rem 1rem; background:var(--dark-card); border:1px solid var(--dark-line); border-radius:var(--radius); }
.stat-grid-dark .n{ display:block; font-family:var(--font-display); font-weight:700; font-size:2.1rem; color:var(--teal-bright); }
.stat-grid-dark .l{ display:block; font-size:.8rem; color:var(--dark-muted); margin-top:.3rem; }

/* ---------- product tour ---------- */
.tour{ display:flex; flex-direction:column; gap:1.2rem; }
.tour-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; }
.ttab{
  font-family:var(--font-mono); font-size:.78rem; font-weight:600;
  padding:.55rem .95rem; border-radius:999px; border:1px solid var(--dark-line);
  background:var(--dark-card); color:var(--dark-muted); transition:all .16s ease;
}
.ttab:hover{ color:var(--dark-text); }
.ttab.active{ background:var(--teal-bright); border-color:var(--teal-bright); color:#08211D; }
.tour-body{ display:grid; grid-template-columns:.85fr 1.15fr; gap:1.6rem; align-items:stretch; }
@media (max-width:860px){ .tour-body{ grid-template-columns:1fr; } }
.tour-copy{ background:var(--dark-card); border:1px solid var(--dark-line); border-radius:var(--radius-lg); padding:1.8rem; }
.tour-copy h3{ color:var(--dark-text); }
.tour-copy p{ color:var(--dark-muted); }
.tour-copy .tc-bullets{ display:flex; flex-direction:column; gap:.6rem; margin-top:1rem; }
.tour-copy .tc-bullets li{ display:flex; gap:.6rem; align-items:flex-start; font-size:.88rem; color:var(--dark-text); }
.tour-copy .tc-bullets .icon{ width:16px; height:16px; color:var(--teal-bright); margin-top:.2rem; flex:none; }
.tour-screen{ background:#0A1613; border:1px solid var(--dark-line); border-radius:var(--radius-lg); padding:1.4rem; overflow:hidden; min-height:280px; }
.ts-chatbubble{ background:var(--dark-card); border-radius:var(--radius); padding:1rem 1.2rem; margin-bottom:.8rem; font-size:.88rem; color:var(--dark-text); }
.ts-cite{ display:inline-block; font-family:var(--font-mono); font-size:.68rem; background:rgba(53,199,194,.12); color:var(--teal-bright); padding:.25rem .55rem; border-radius:6px; margin:.3rem .3rem 0 0; }
.ts-kpirow{ display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; margin-bottom:1rem; }
.ts-kpi{ background:var(--dark-card); border-radius:10px; padding:.8rem; text-align:center; }
.ts-kpi .n{ font-family:var(--font-display); font-weight:700; font-size:1.3rem; color:var(--teal-bright); display:block; }
.ts-kpi .l{ font-size:.68rem; color:var(--dark-muted); }
.ts-bars{ display:flex; align-items:flex-end; gap:.5rem; height:100px; padding:0 .3rem; }
.ts-bars i{ flex:1; background:linear-gradient(180deg,var(--teal-bright),var(--teal-deep)); border-radius:4px 4px 0 0; }
.ts-rowlist{ display:flex; flex-direction:column; gap:.55rem; }
.ts-row{ display:flex; align-items:center; justify-content:space-between; background:var(--dark-card); padding:.65rem .9rem; border-radius:8px; font-size:.82rem; color:var(--dark-text); }
.ts-pill{ font-family:var(--font-mono); font-size:.66rem; padding:.2rem .55rem; border-radius:999px; }
.ts-pill.ok{ background:var(--good-tint); color:var(--good); }
.ts-pill.warn{ background:var(--amber-tint); color:var(--amber-deep); }
.ts-pill.bad{ background:var(--bad-tint); color:var(--bad); }
.ts-timeline{ display:flex; flex-direction:column; gap:0; }
.ts-tl-item{ display:flex; gap:.8rem; padding:.6rem 0; border-left:2px solid var(--dark-line); padding-left:1rem; margin-left:.4rem; position:relative; }
.ts-tl-item::before{ content:''; position:absolute; left:-5px; top:.9rem; width:8px; height:8px; border-radius:50%; background:var(--teal-bright); }
.ts-tl-item .t{ font-family:var(--font-mono); font-size:.68rem; color:var(--dark-muted); min-width:52px; }
.ts-tl-item p{ margin:0; font-size:.82rem; color:var(--dark-text); }
.ts-checklist{ display:flex; flex-direction:column; gap:.6rem; }
.ts-check{ display:flex; align-items:center; gap:.7rem; font-size:.85rem; color:var(--dark-text); }
.ts-check .box{ width:18px; height:18px; border-radius:5px; border:1.5px solid var(--dark-line); flex:none; display:flex; align-items:center; justify-content:center; }
.ts-check.done .box{ background:var(--teal-bright); border-color:var(--teal-bright); color:#08211D; }
.ts-check.done p{ text-decoration:line-through; color:var(--dark-muted); }

/* ---------- CARD RING (bespoke, momentum-driven rolodex) ---------- */
.ringwrap{
  position:relative; height:460px; margin:0 auto; max-width:920px;
  perspective:1400px;
  touch-action:pan-y;
  cursor:grab;
}
.ringwrap:active{ cursor:grabbing; }
.ringstage{ position:absolute; inset:0; transform-style:preserve-3d; }
.ringcard{
  position:absolute; top:50%; left:50%; width:230px; min-height:190px;
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.3rem; box-shadow:var(--shadow-md);
  will-change:transform, opacity, filter;
  user-select:none; -webkit-user-select:none;
}
.ringcard .rc-num{ font-family:var(--font-mono); font-size:.72rem; color:var(--teal-deep); background:var(--teal-tint); display:inline-block; padding:.2rem .5rem; border-radius:6px; margin-bottom:.7rem; }
.ringcard h4{ font-size:.98rem; margin-bottom:.4rem; }
.ringcard p{ font-size:.8rem; margin:0; color:var(--ink-soft); }
.ring-hint{ text-align:center; font-family:var(--font-mono); font-size:.76rem; color:var(--ink-faint); margin-top:.6rem; }
@media (max-width:700px){
  .ringwrap{ height:380px; }
  .ringcard{ width:180px; min-height:160px; padding:1rem; }
}

/* ---------- manifest (registers list, non-ring fallback content) ---------- */
.manifest{ display:flex; flex-direction:column; }
.manifest-row{
  display:grid; grid-template-columns:auto auto 1fr auto; gap:1.4rem; align-items:center;
  padding:1.6rem 0; border-bottom:1px solid var(--line);
}
.manifest-row:first-child{ border-top:1px solid var(--line); }
.mf-num{ font-family:var(--font-display); font-weight:700; font-size:1.6rem; color:var(--line-strong); width:2.4ch; }
.mf-ico{ width:46px; height:46px; border-radius:12px; background:var(--teal-tint); color:var(--teal-deep); display:flex; align-items:center; justify-content:center; }
.mf-ico svg{ width:22px; height:22px; }
.mf-body h3{ margin-bottom:.35rem; }
.mf-body p{ margin:0; font-size:.92rem; max-width:62ch; }
.mf-meta{ display:flex; flex-direction:column; gap:.4rem; align-items:flex-end; }
.mf-meta span{ font-family:var(--font-mono); font-size:.7rem; color:var(--ink-faint); background:var(--paper-2); padding:.25rem .6rem; border-radius:6px; white-space:nowrap; }
@media (max-width:760px){
  .manifest-row{ grid-template-columns:auto 1fr; }
  .mf-meta{ grid-column:1/-1; flex-direction:row; align-items:flex-start; margin-top:.4rem; }
}

/* ---------- calculator ---------- */
.calc-card{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:2.2rem; box-shadow:var(--shadow-sm); }
@media (max-width:760px){ .calc-card{ grid-template-columns:1fr; } }
.calc-inputs label{ display:block; font-size:.88rem; font-weight:600; margin-bottom:1.6rem; }
.calc-inputs input[type=range]{ width:100%; margin:.7rem 0 .4rem; accent-color:var(--teal); }
.calc-val{ font-family:var(--font-mono); font-size:.85rem; color:var(--teal-deep); font-weight:700; }
.calc-output{ background:var(--paper-2); border-radius:var(--radius); padding:1.6rem; display:flex; flex-direction:column; justify-content:center; }
.co-label{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint); margin-bottom:.3rem; }
.co-num{ font-family:var(--font-display); font-weight:700; font-size:2.2rem; margin-bottom:1.1rem; color:var(--ink); }
.co-note{ font-size:.82rem; color:var(--ink-faint); margin-top:.6rem; }

/* ---------- CTA band ---------- */
.band-cta{ background:linear-gradient(135deg,var(--teal-deep),#0A5048); color:var(--white); padding:var(--space-6) 0; text-align:center; }
.band-cta h2{ color:var(--white); }
.band-cta p{ color:#CDE7E1; margin-bottom:1.6rem; }
.band-cta a.btn-primary{ background:var(--amber); color:var(--white); }
.band-cta a.btn-primary:hover{ background:var(--amber-deep); }
.contact{ display:flex; gap:2.4rem; justify-content:center; margin-top:1.6rem; flex-wrap:wrap; }
.contact .role{ font-family:var(--font-mono); font-size:.72rem; color:#9FD4CB; text-transform:uppercase; }
.contact a{ color:var(--white); font-weight:700; }

/* ---------- lead form ---------- */
.leadcard{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-xl); padding:2.4rem; box-shadow:var(--shadow-md); }
.leadcard-head{ max-width:60ch; margin-bottom:1.8rem; }
.leadform-grid{ display:flex; flex-direction:column; gap:1.1rem; }
.lf-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
@media (max-width:600px){ .lf-row{ grid-template-columns:1fr; } }
.leadform-grid label{ display:flex; flex-direction:column; gap:.4rem; font-size:.86rem; font-weight:600; color:var(--ink); }
.leadform-grid input,.leadform-grid textarea{
  font-family:var(--font-body); font-size:.96rem; padding:.8rem 1rem;
  border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--paper); color:var(--ink);
  transition:border-color .16s ease, box-shadow .16s ease;
}
.leadform-grid input:focus,.leadform-grid textarea:focus{ outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(12,122,110,.14); }
.leadform-grid .hp{ position:absolute; left:-9999px; }
.leadform-grid .btn{ align-self:flex-start; }
.lf-status{ font-size:.86rem; font-weight:600; min-height:1.2em; }
.lf-status.ok{ color:var(--good); }
.lf-status.err{ color:var(--bad); }

/* ---------- pagebanner (sub-pages) ---------- */
.pagebanner{ padding:var(--space-7) 0 var(--space-6); position:relative; overflow:hidden; }
.pagebanner h1{ max-width:22ch; }

/* ---------- glass card ---------- */
.glass-card{
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border:1px solid rgba(255,255,255,.6);
  box-shadow:var(--shadow-lg);
}

/* ---------- trust page ---------- */
.trust-panel{ border-radius:var(--radius-xl); padding:2.4rem; }
.trust-top{ display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:.6rem; margin-bottom:1.6rem; }
.ttitle{ font-family:var(--font-display); font-weight:700; font-size:1.3rem; }
.trust-asof{ font-family:var(--font-mono); font-size:.78rem; color:var(--ink-faint); }
.trust-statline{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.8rem; }
@media (max-width:700px){ .trust-statline{ grid-template-columns:1fr 1fr; } }
.tstat{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.2rem; text-align:center; }
.tstat .n{ display:block; font-family:var(--font-display); font-weight:700; font-size:1.7rem; }
.tstat .l{ display:block; font-size:.76rem; color:var(--ink-faint); margin-top:.3rem; }
.tstat.good .n{ color:var(--good); }
.trust-quote{ font-size:.96rem; }
.trust-quote p{ color:var(--ink-soft); }

.about-grid{ display:grid; grid-template-columns:1.4fr .9fr; gap:2.4rem; align-items:start; }
@media (max-width:900px){ .about-grid{ grid-template-columns:1fr; } }
.principles{ display:flex; flex-direction:column; gap:1.4rem; }
.principle{ display:flex; gap:1rem; }
.principle .n{ font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:var(--line-strong); width:2.4ch; flex:none; }
.principle h4{ margin-bottom:.3rem; }
.principle p{ margin:0; font-size:.88rem; }

.founder-card{ border-radius:var(--radius-xl); padding:2.2rem; text-align:center; }
.avatar{
  width:64px; height:64px; margin:0 auto 1rem; border-radius:16px;
  background:linear-gradient(135deg,var(--teal),var(--teal-deep)); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:1.6rem;
}
.founder-card .role{ font-family:var(--font-mono); font-size:.76rem; color:var(--ink-faint); text-transform:uppercase; margin-bottom:1rem; display:block; }
.founder-card .btn{ width:100%; justify-content:center; margin-top:.7rem; }

.changelog{ display:flex; flex-direction:column; gap:1.1rem; margin-top:1rem; }
.cl-item{ display:grid; grid-template-columns:70px 1fr; gap:1rem; padding-bottom:1.1rem; border-bottom:1px solid var(--line); }
.cl-date{ font-family:var(--font-mono); font-size:.74rem; color:var(--teal-deep); font-weight:700; }
.cl-item h4{ margin-bottom:.25rem; font-size:.95rem; }
.cl-item p{ margin:0; font-size:.86rem; }

.roadmap-list{ display:flex; flex-direction:column; gap:1rem; margin-top:1rem; }
.rm-row{ display:flex; gap:1rem; align-items:flex-start; }
.tag2{ font-family:var(--font-mono); font-size:.68rem; font-weight:700; text-transform:uppercase; background:var(--amber-tint); color:var(--amber-deep); padding:.25rem .6rem; border-radius:999px; flex:none; margin-top:.2rem; }
.rm-row h4{ margin-bottom:.25rem; font-size:.95rem; }
.rm-row p{ margin:0; font-size:.86rem; }

/* ---------- pilot page ---------- */
.pilot-panel{
  background:linear-gradient(135deg,var(--teal-deep),#0A5048);
  color:var(--white); border-radius:var(--radius-xl); padding:2.4rem;
}
.pilot-panel .tag{ font-family:var(--font-mono); font-size:.76rem; font-weight:700; text-transform:uppercase; background:rgba(255,255,255,.14); padding:.35rem .8rem; border-radius:999px; display:inline-block; margin-bottom:.9rem; }
.pilot-panel p{ color:#CDE7E1; }
.pilot-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-top:1.8rem; position:relative; }
@media (max-width:760px){ .pilot-steps{ grid-template-columns:1fr 1fr; } }
.pilot-step{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:var(--radius); padding:1.3rem; }
.pilot-step .num{ font-family:var(--font-display); font-weight:700; font-size:1.4rem; color:var(--teal-bright); display:block; margin-bottom:.5rem; }
.pilot-step p{ margin:0; color:var(--white); font-size:.88rem; }

.faq-item{ border-bottom:1px solid var(--line); }
.faq-item:first-child{ border-top:1px solid var(--line); }
.faq-q{ width:100%; display:flex; justify-content:space-between; align-items:center; background:none; border:none; padding:1.3rem 0; font-size:1rem; font-weight:600; color:var(--ink); text-align:left; }
.faq-chevron{ transition:transform .25s ease; color:var(--ink-faint); }
.faq-item.open .faq-chevron{ transform:rotate(180deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-item.open .faq-a{ max-height:220px; }
.faq-a-inner{ padding:0 0 1.3rem; }
.faq-a-inner p{ margin:0; font-size:.92rem; }

/* ---------- specgrid (bento, product page) ---------- */
.specgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
@media (max-width:860px){ .specgrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .specgrid{ grid-template-columns:1fr; } }
.spec-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; transition:transform .2s ease, box-shadow .2s ease; }
.spec-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.spec-card.big{ grid-column:span 2; grid-row:span 2; display:flex; flex-direction:column; justify-content:center; }
@media (max-width:860px){ .spec-card.big{ grid-column:span 2; grid-row:span 1; } }
@media (max-width:560px){ .spec-card.big{ grid-column:span 1; } }

/* ---------- footer ---------- */
footer{ background:var(--dark-bg); color:var(--dark-muted); padding:var(--space-6) 0 var(--space-4); }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2.4rem; padding-bottom:2.4rem; border-bottom:1px solid var(--dark-line); }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
.fbrand{ display:flex; align-items:center; gap:.5rem; font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--dark-text); margin-bottom:.8rem; }
.fbrand svg{ width:26px; height:26px; color:var(--teal-bright); }
.fcol h5{ font-family:var(--font-mono); font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--dark-text); margin-bottom:.9rem; }
.fcol a{ display:block; font-size:.88rem; margin-bottom:.6rem; color:var(--dark-muted); transition:color .16s ease; }
.fcol a:hover{ color:var(--teal-bright); }
.footer-inner{ display:flex; justify-content:space-between; padding-top:1.4rem; font-size:.82rem; flex-wrap:wrap; gap:.5rem; }
.footer-inner a{ color:var(--dark-muted); }
.footer-inner a:hover{ color:var(--teal-bright); }

/* ---------- misc ---------- */
.center{ text-align:center; }