/* ─────────────────────────────────────────────────────────────
   Quantillion · shared stylesheet for the solution pages (v2)
   Used by polaris.html, compass.html, scout.html, index.html,
   mission.html and privacy.html
   ───────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#EFEFED;--bg2:#FFFFFF;--bg3:#F5F5F3;
  --border:#DDDDD8;--border2:#E8E8E4;
  --text:#0C0C0B;--text2:#2E2E2C;--text3:#888885;
  --indigo:#6172F3;--indigo-l:#8098F9;--indigo-glow:rgba(97,114,243,.3);
  --green:#16a34a;--amber:#d97706;
  /* industry palette (same as industries.html) */
  --sky:#9EB8F9;--teal:#204F56;--navy:#1B263F;--leaf:#7DC46B;--ivory:#FEFFFD;--elite:#0250B0;--silver:#C6D0DD;--lime:#E6FD53;
  --display:Impact,'Arial Narrow','Arial Black',sans-serif;
  --body:system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:ui-monospace,'SF Mono','Cascadia Code','Monaco',monospace;
}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border2)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* ── NAV ── */
#nav{position:fixed;top:0;left:0;right:0;z-index:200;background:rgba(239,239,237,0);border-bottom:1px solid transparent;height:56px;display:flex;align-items:center;padding:0 3rem;transition:background .4s,border-color .4s}
#nav.scrolled{background:rgba(239,239,237,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom-color:var(--border)}
.logo{color:var(--text);text-decoration:none;display:flex;align-items:center;margin-right:auto;line-height:1}
.logo img{height:22px;width:auto;display:block}
.nav-links{display:flex;gap:.5rem;list-style:none;margin-right:.75rem;align-items:center}
.nav-links>li>a{font-family:var(--mono);font-size:11px;color:var(--text2);text-decoration:none;letter-spacing:.06em;text-transform:uppercase;transition:color .15s,border-color .15s;border:1px solid var(--border);padding:0 14px;height:30px;display:inline-flex;align-items:center;white-space:nowrap}
.nav-links>li>a:hover{color:var(--text);border-color:var(--text3)}
.nav-links>li>a.active{color:var(--indigo);border-color:var(--indigo)}
.nav-cta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--indigo);border:1px solid var(--indigo);padding:7px 16px;text-decoration:none;transition:background .15s,color .15s;white-space:nowrap}
.nav-cta:hover{background:var(--indigo);color:#fff}
.nav-solutions-btn{font-family:var(--mono);font-size:11px;color:var(--text2);letter-spacing:.06em;text-transform:uppercase;transition:color .15s,border-color .15s;background:none;border:1px solid var(--border);cursor:pointer;padding:0 14px;height:30px;display:inline-flex;align-items:center;gap:5px;-webkit-appearance:none;appearance:none;line-height:1;border-radius:0;white-space:nowrap}
.nav-solutions-btn:focus{outline:none}
.nav-solutions-btn:hover,.nav-solutions-btn.open,.nav-solutions-btn.active{color:var(--text);border-color:var(--text3)}
.solutions-chevron{transition:transform .22s ease;flex-shrink:0}
.nav-solutions-btn.open .solutions-chevron{transform:rotate(180deg)}
.solutions-panel{position:fixed;top:56px;z-index:300;background:var(--bg2);border:1px solid var(--border);opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;min-width:110px;box-shadow:0 8px 24px rgba(0,0,0,.08);transform:translateY(-4px)}
.solutions-panel::before{content:'';position:absolute;left:0;right:0;top:-16px;height:16px}
.nav-solutions-item,.nav-industries-item{position:relative}
.solutions-panel.open{opacity:1;transform:translateY(0);pointer-events:all}
.solutions-inner{display:flex;flex-direction:column}
.solution-item{padding:0 14px;height:30px;text-decoration:none;color:var(--text2);display:flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;transition:background .12s,color .12s;white-space:nowrap}
.solution-item:hover,.solution-item.active{background:var(--bg3);color:var(--text)}

/* page transition */
@keyframes zoom-enter{from{opacity:0;transform:scale(.984)}to{opacity:1;transform:scale(1)}}
body{animation:zoom-enter .55s cubic-bezier(.16,1,.3,1) backwards}
.zoom-exit-overlay{position:fixed;inset:0;z-index:9999;background:var(--bg);opacity:0;transform:scale(.97);transition:opacity .28s ease,transform .32s cubic-bezier(.16,1,.3,1);pointer-events:none}
.zoom-exit-overlay.go{opacity:1;transform:scale(1)}

/* ── BUTTONS ── */
.btn{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:12px 24px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:all .15s;border:1px solid transparent;cursor:pointer;background:none}
.btn-fill{background:var(--indigo);color:#fff;border-color:var(--indigo)}.btn-fill:hover{opacity:.85}
.btn-ghost{color:var(--text2);border-color:var(--border2)}.btn-ghost:hover{color:var(--text);border-color:var(--text2)}

/* ── PILL: the framed label with the blinking light ── */
.pill{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text2);border:1px solid var(--border2);padding:6px 13px;background:transparent;white-space:nowrap;line-height:1}
.pill-dot{width:5px;height:5px;border-radius:50%;background:var(--indigo);flex-shrink:0;box-shadow:0 0 8px var(--indigo-glow);animation:pulse 2s ease infinite}
.pill .by{color:var(--text3)}
.pill .div{color:var(--border2);margin:0 1px}
.pill.indigo{color:var(--indigo);border-color:rgba(97,114,243,.35)}
.pill.small{font-size:9px;padding:4px 9px;gap:7px;letter-spacing:.09em}
.pill.small .pill-dot{width:4px;height:4px}
/* sector-coloured pills (industry palette) */
.pill[class*="sw-"]{background:color-mix(in srgb,var(--sw) 24%,#FFFFFF);border-color:color-mix(in srgb,var(--sw) 55%,#FFFFFF);color:var(--sw-ink)}
.pill[class*="sw-"] .pill-dot{background:var(--sw);box-shadow:0 0 8px color-mix(in srgb,var(--sw) 45%,transparent)}
.pill.sw-sky{--sw:var(--sky);--sw-ink:#1B263F}
.pill.sw-elite{--sw:var(--elite);--sw-ink:#0250B0}
.pill.sw-silver{--sw:var(--silver);--sw-ink:#1B263F}
.pill.sw-navy{--sw:var(--navy);--sw-ink:#1B263F}
.pill.sw-leaf{--sw:var(--leaf);--sw-ink:#1B3A1A}
.pill.sw-teal{--sw:var(--teal);--sw-ink:#204F56}

/* ── REVEAL ── */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .75s ease,transform .75s ease}
.reveal.in{opacity:1;transform:none}

/* ── HERO (light) ── */
.hero{width:100%;min-height:calc(100vh - 150px);position:relative;overflow:hidden;background:var(--bg3)}
.hero-canvas-wrap{position:absolute;inset:0;background:var(--bg)}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.9}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,rgba(239,239,237,.94) 0%,rgba(239,239,237,.6) 38%,rgba(239,239,237,.12) 66%,rgba(239,239,237,0) 82%)}
/* hero with real product footage: a heavier scrim, the UI is busier than the canvas */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 34%;display:block;opacity:.92}
.hero-film .hero-overlay{background:linear-gradient(103deg,rgba(239,239,237,.985) 0%,rgba(239,239,237,.94) 32%,rgba(239,239,237,.66) 52%,rgba(239,239,237,.24) 74%,rgba(239,239,237,.06) 100%)}
.hero-film .hero-overlay::after{content:'';position:absolute;left:0;right:0;bottom:0;height:190px;background:linear-gradient(to top,var(--bg) 0%,rgba(239,239,237,0) 100%)}
.hero-film .hero-overlay::before{content:'';position:absolute;left:0;right:0;top:0;height:130px;background:linear-gradient(to bottom,var(--bg) 0%,rgba(239,239,237,.75) 45%,rgba(239,239,237,0) 100%)}
@media(max-width:900px){.hero-film .hero-overlay{background:linear-gradient(180deg,rgba(239,239,237,.97) 0%,rgba(239,239,237,.9) 55%,rgba(239,239,237,.5) 100%)}}
.hero-wrap{position:relative;z-index:2;min-height:calc(100vh - 150px);display:flex;flex-direction:column;justify-content:center;padding:4rem 3rem 3rem}
.hero-col{max-width:600px}
.hero-col .pill{margin-bottom:2rem}
.hero-col h1{font-family:var(--display);font-size:clamp(4rem,9vw,8.5rem);line-height:.88;letter-spacing:.01em;color:var(--text);text-transform:uppercase;margin-bottom:.5rem}
.hero-slogan{font-family:var(--display);font-size:clamp(1.3rem,2vw,2rem);line-height:1.2;letter-spacing:.01em;text-transform:uppercase;color:var(--indigo);margin-bottom:1.8rem}
.hero-desc{font-size:15px;color:var(--text2);font-weight:300;max-width:480px;line-height:1.85;margin-bottom:2.2rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap}

/* ── STATS BAR ── */
.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--bg2)}
.stat-cell{--tint:#FFFFFF;--tint-ink:var(--indigo);padding:1.8rem 2.5rem;border-right:1px solid var(--border);background:color-mix(in srgb,var(--tint) 30%,#FFFFFF);transition:background .8s ease}
.stat-cell:last-child{border-right:none}
.stat-val{font-family:var(--display);font-size:clamp(1.8rem,2.8vw,2.6rem);color:var(--tint-ink);line-height:1;margin-bottom:.45rem;white-space:nowrap;letter-spacing:.01em}
.stat-val sup{font-size:.5em;color:inherit;opacity:.65;vertical-align:top}
.stat-key{font-family:var(--mono);font-size:9px;color:var(--text2);letter-spacing:.1em;text-transform:uppercase;line-height:1.5}

/* ── RAIL SECTIONS (vertical label on the left) ── */
.rail-section{padding:5rem 3rem;border-bottom:1px solid var(--border)}
.rail-section.alt{background:var(--bg2)}
.rail-section.tint-sky{background:color-mix(in srgb,var(--sky) 27%,var(--bg))}
.rail-section.tint-teal{background:color-mix(in srgb,var(--teal) 13%,var(--bg))}
.rail-grid{display:grid;grid-template-columns:100px 1fr;gap:2.5rem;max-width:1180px;margin:0 auto;align-items:start}
.rail-idx{display:flex;flex-direction:column;align-items:flex-start;position:sticky;top:6.5rem}
.rail-idx .rt{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text3)}

.thesis-head{font-family:var(--display);font-size:clamp(2.4rem,5.6vw,6rem);line-height:1;letter-spacing:.01em;text-transform:uppercase;color:var(--text);max-width:920px}
.thesis-head em{color:var(--indigo-l);font-style:normal}
.sec-h3{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,3rem);text-transform:uppercase;letter-spacing:.02em;line-height:1;color:var(--text);margin-bottom:.6rem}
.sec-p{font-size:14.5px;color:var(--text2);font-weight:300;max-width:620px;line-height:1.8}
.sec-p.lead{margin:1.6rem 0 2.2rem}
.sec-p.muted{color:var(--text3)}
.sec-badge{margin-bottom:1.2rem}

/* ── RESULTS / AT A GLANCE ── */
.glance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);max-width:900px;margin-top:2.2rem}
.glance{background:var(--bg2);padding:1.8rem;transition:background .2s}
.glance:hover{background:var(--bg3)}
.glance-label{font-family:var(--mono);font-size:9px;color:var(--text3);letter-spacing:.09em;text-transform:uppercase;margin-bottom:.7rem}
.glance-num{font-family:var(--display);font-size:2.8rem;color:var(--text);line-height:1;margin-bottom:.55rem;letter-spacing:.02em}
.glance-num.accent{color:var(--indigo)}
.glance-desc{font-size:12.5px;color:var(--text2);font-weight:300;line-height:1.6}
.glance-desc p+p{margin-top:.6rem}
.frontier-panel{margin-top:2.5rem;max-width:900px}
.frontier-canvas{width:100%;height:240px;display:block}
.frontier-labels{display:flex;justify-content:center;gap:4.5rem;margin-top:1rem;padding-top:1.1rem;border-top:1px solid var(--border2)}
.fl-item{display:flex;align-items:center;gap:.8rem}
.fl-num{font-family:var(--display);font-size:1.9rem;color:var(--text3);line-height:1}
.fl-item.hi .fl-num{color:var(--indigo)}
.fl-desc{font-family:var(--mono);font-size:9px;color:var(--text3);letter-spacing:.04em;max-width:180px;line-height:1.5}
.fl-item.hi .fl-desc{color:var(--indigo-l)}
.stat-strip{display:flex;gap:0;margin:2rem 0 0;flex-wrap:wrap;border-top:1px solid var(--border2);padding-top:2rem;max-width:800px}
.stat-strip .s{flex:1;min-width:170px;padding-right:2rem;margin-right:2rem;border-right:1px solid var(--border2)}
.stat-strip .s:last-child{border-right:none;margin-right:0}
.stat-strip .num{font-family:var(--display);font-size:2.8rem;color:var(--text);letter-spacing:.01em;line-height:1}
.stat-strip .num sup{font-size:1.2rem;color:var(--indigo-l)}
.stat-strip .lbl{font-size:12.5px;color:var(--text2);font-weight:300;margin-top:.5rem;max-width:240px;line-height:1.5;display:flex;align-items:center;gap:6px}
.live-dot{width:5px;height:5px;border-radius:50%;background:var(--green);flex-shrink:0;animation:pulse 2s ease infinite}

/* ── INTRO: 2×2 cards ── */
.cause-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);max-width:800px;margin:0 auto}
.cause-cell{background:var(--bg2);padding:1.6rem;transition:background .2s}
.cause-cell:hover{background:var(--bg3)}
.cause-canvas{width:100%;height:60px;display:block;margin-bottom:.9rem}
.cause-canvas.tall{height:96px}
.cause-icon{width:36px;height:36px;margin-bottom:1rem;color:var(--indigo)}
.cause-icon svg{width:100%;height:100%;display:block}
.cause-num{font-family:var(--mono);font-size:9px;color:var(--indigo);letter-spacing:.1em;margin-bottom:.4rem}
.cause-h{font-family:var(--display);font-size:1.25rem;text-transform:uppercase;letter-spacing:.02em;color:var(--text);margin-bottom:.5rem;line-height:1}
.cause-p{font-size:12.5px;color:var(--text2);font-weight:300;line-height:1.65}

/* numbered stack */
.ground-stack{display:flex;flex-direction:column;gap:1px;background:var(--border);max-width:800px}
.ground-layer{background:var(--bg2);padding:1.8rem;display:flex;gap:2rem;align-items:flex-start;transition:background .2s}
.ground-layer:hover{background:var(--bg3)}
.ground-num{font-family:var(--display);font-size:2.2rem;color:var(--border);line-height:1;flex-shrink:0;min-width:44px}
.ground-label{font-family:var(--mono);font-size:9.5px;color:var(--indigo);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.6rem}
.ground-body p{font-size:13.5px;color:var(--text2);font-weight:300;line-height:1.75;max-width:560px}
/* what-it-does: the numbered stack beside a small screen showing the product */
.what-split{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:3.5rem;align-items:center}
.what-split .ground-stack{max-width:none}
.screen{margin:0}
.screen-bezel{background:#111;border-radius:10px;padding:9px 9px 11px;box-shadow:0 26px 44px -26px rgba(0,0,0,.45)}
.screen-bezel img{display:block;width:100%;border-radius:3px}
.screen-stand{width:84px;height:22px;margin:0 auto;background:linear-gradient(#2b2b2b,#181818);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
.screen-base{width:170px;height:5px;margin:0 auto;background:#181818;border-radius:3px}
.photo{margin:0}
.photo img{display:block;width:100%;height:auto;border:1px solid var(--border)}
.screen figcaption,.photo figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;color:var(--text3);text-align:center;margin-top:1.1rem;line-height:1.6}
@media screen and (max-width:900px){.what-split{grid-template-columns:1fr}.screen,.photo{max-width:440px;margin:0 auto}}

/* spec table */

/* ── LIVE PANEL (dispatch table, fleet view, kit in motion) ── */
.panel{border:1px solid var(--border);background:var(--bg2);font-family:var(--mono);font-size:11px;overflow:hidden;width:100%;max-width:820px;display:flex;flex-direction:column;color:var(--text2);margin-top:2rem}
.panel-head{padding:7px 12px;border-bottom:1px solid var(--border);background:var(--bg3);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.panel-brand{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3)}
.panel-live{font-size:9px;letter-spacing:.06em;color:var(--indigo);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.panel-live .pill-dot{width:4px;height:4px;box-shadow:none}
.panel-body{flex:1;overflow:hidden;display:flex;flex-direction:column}
.panel-canvas{display:block;width:100%;height:300px;background:var(--bg3)}
.panel-foot{padding:7px 12px;border-top:1px solid var(--border);background:var(--bg3);display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex-shrink:0}
.kv{display:flex;flex-direction:column;gap:2px}
.kval{font-size:14px;color:var(--text);letter-spacing:-.02em;line-height:1;white-space:nowrap}
.kval sup{font-size:9px;color:var(--text3);letter-spacing:.04em;font-style:normal}
.kval.pos{color:var(--green)}
.kval.warn{color:var(--amber)}
.kkey{font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--text3);margin-top:2px}
/* demo video figure */
.demo-video{margin:2rem 0 0;border:1px solid var(--border);background:var(--bg2);max-width:1040px}
.demo-video video{display:block;width:100%;height:auto}
.demo-video figcaption{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--text3);padding:10px 12px;border-top:1px solid var(--border);background:var(--bg3);line-height:1.6}
/* fleet-view app panel (Compass) */
.panel-stats{display:flex;gap:14px;font-size:9px;color:var(--text3);letter-spacing:.04em}
.panel-stats b{color:var(--text);font-weight:500;letter-spacing:0}
.fv-body{display:grid;grid-template-columns:172px 1fr;border-bottom:1px solid var(--border)}
.fv-side{border-right:1px solid var(--border);background:var(--bg2);display:flex;flex-direction:column;min-width:0}
.fv-side-h{padding:6px 10px;font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--text3);border-bottom:1px solid var(--border2);background:var(--bg3);display:flex;justify-content:space-between}
.fv-map{display:block;width:100%;height:320px;background:var(--bg3)}
.fv-batt{grid-column:1/-1;height:3px;background:var(--border2);position:relative}
.fv-batt i{position:absolute;left:0;top:0;bottom:0;background:var(--green);transition:width .6s}
.fv-batt i.low{background:var(--amber)}
.fv-replay{display:flex;align-items:center;gap:10px;padding:7px 12px;border-bottom:1px solid var(--border);background:var(--bg3);font-size:9px;color:var(--text3)}
.fv-play{width:16px;height:16px;border:1px solid var(--border);display:grid;place-items:center;color:var(--text2);font-size:7px;flex-shrink:0;background:var(--bg2)}
.fv-track{flex:1;height:3px;background:var(--border);position:relative}
.fv-track i{position:absolute;left:0;top:0;bottom:0;background:var(--indigo)}
.fv-track b{position:absolute;top:50%;width:9px;height:9px;border-radius:50%;background:var(--indigo);transform:translate(-50%,-50%)}
.fv-time{font-variant-numeric:tabular-nums;white-space:nowrap}
.fv-legend{display:flex;gap:12px;margin-left:auto;font-size:8.5px;color:var(--text3);letter-spacing:.04em;text-transform:uppercase}
.fv-legend i{display:inline-block;width:8px;height:8px;margin-right:5px;vertical-align:-1px}

/* single-vehicle task panel */
.fv-one{padding:9px 10px;border-bottom:1px solid var(--border2);display:grid;grid-template-columns:1fr auto;gap:4px 8px;font-size:9.5px;background:color-mix(in srgb,var(--indigo) 6%,#FFFFFF);box-shadow:inset 2px 0 0 var(--indigo)}
.fv-one .id{color:var(--text);font-weight:500}
.fv-one .id small{color:var(--text3);font-weight:400;margin-left:5px;font-size:8.5px}
.fv-one .st{font-size:8px;letter-spacing:.06em;text-transform:uppercase;text-align:right}
.fv-one .st.driving{color:var(--indigo)}.fv-one .st.waiting{color:var(--amber)}.fv-one .st.charging{color:var(--green)}.fv-one .st.loading{color:var(--text2)}.fv-one .st.blocked{color:#C2415B}
.fv-one .fv-batt,.fv-one .ord{grid-column:1/-1}
.fv-one .ord{color:var(--text3);font-size:8.5px}
.fv-task{padding:6px 10px;border-bottom:1px solid var(--border2);display:grid;grid-template-columns:9px 1fr;gap:6px;font-size:8.5px;color:var(--text2);align-items:start}
.fv-task .dot{width:7px;height:7px;border-radius:50%;border:1px solid var(--text3);margin-top:2px}
.fv-task.active .dot{background:var(--indigo);border-color:var(--indigo);animation:pulse 2s ease infinite}
.fv-task.active span{color:var(--text);font-weight:500}
.fv-task.done .dot{background:var(--green);border-color:var(--green)}
.fv-task.done span{color:var(--text3);text-decoration:line-through}
.fv-task small{display:block;color:var(--text3);font-size:8px;margin-top:1px}

/* dispatch table rows (Polaris) */
.wb-cols{padding:4px 12px;display:grid;grid-template-columns:78px 1fr 54px 44px 96px 36px;gap:8px;background:var(--bg3);border-bottom:1px solid var(--border);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);flex-shrink:0}
.wb-row{padding:0 12px;height:27px;display:grid;grid-template-columns:78px 1fr 54px 44px 96px 36px;gap:8px;border-bottom:1px solid var(--border2);font-size:10px;align-items:center;transition:background .4s,opacity .4s}
.wb-row:last-child{border-bottom:none}
.wb-row.new{animation:wbIn .45s ease forwards}
@keyframes wbIn{from{opacity:0;background:rgba(97,114,243,.05)}to{opacity:1;background:transparent}}
.wb-row-id{color:var(--text3);font-size:9px;letter-spacing:.04em}
.wb-row-loc{color:var(--text)}
.wb-row-vh{color:var(--text2);font-size:9px}
.wb-row-st{font-size:9px;letter-spacing:.05em;text-transform:uppercase}
.wb-row-st.dispatched{color:var(--indigo)}
.wb-row-st.transit{color:var(--green)}
.wb-row-st.computing{color:var(--amber);animation:wbBlink .9s step-end infinite}
.wb-row-st.queued{color:var(--text3)}
.wb-row-st.replanning{color:var(--amber);animation:wbBlink .6s step-end infinite}
.wb-row-st.done{color:var(--green)}
.wb-row-pr{font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text3)}
.wb-row-pr.high{color:#C2415B;font-weight:500}
.wb-row-pr.med{color:var(--text2)}
.wb-row.rush{background:color-mix(in srgb,#C2415B 6%,transparent)}
.wb-row.blank{color:var(--border)}
.wb-row.blank .wb-row-id{color:var(--border)}
.panel-alert{display:inline-flex;align-items:center;gap:6px;font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--green);border:1px solid color-mix(in srgb,var(--green) 40%,transparent);padding:3px 8px;transition:color .3s,border-color .3s}
.panel-alert::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}
.panel-alert.warn{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 50%,transparent);animation:pulse 1.2s ease infinite}
.kval.neg{color:var(--amber)}
@keyframes wbBlink{0%,100%{opacity:1}50%{opacity:.25}}
.wb-row-eta{text-align:right;color:var(--text3);font-size:9px}
.wb-row-eta.near{color:var(--indigo)}

/* ── CAPABILITIES: tabs ── */
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:2rem 0 1.6rem}
.tab{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);border:1px solid var(--border2);padding:9px 14px;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none;border-radius:0;transition:color .15s,border-color .15s,background .15s;line-height:1}
.tab:hover{color:var(--text);border-color:var(--text3)}
.tab:focus{outline:none}
.tab:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
.tab .pill-dot{display:none}
.tab[aria-selected="true"]{color:var(--text);border-color:var(--text);background:var(--bg2)}
.tab[aria-selected="true"] .pill-dot{display:block}
.tabpanel{display:none}
.tabpanel.on{display:block;animation:tabIn .35s ease}
@keyframes tabIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.tab-intro{font-size:14.5px;color:var(--text2);font-weight:300;max-width:620px;line-height:1.8;margin-bottom:1.4rem}
.feat-list{display:grid;grid-template-columns:1fr 1fr;gap:0 3rem;border-top:1px solid var(--border);max-width:900px}
.feat-row{display:grid;grid-template-columns:22px 1fr;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--border);align-items:start}
.feat-row-arrow{font-family:var(--mono);font-size:11px;color:var(--indigo);padding-top:1px}
.feat-row strong{display:block;font-size:13px;font-weight:500;color:var(--text);margin-bottom:2px;letter-spacing:-.01em}
.feat-row span{font-size:12.5px;color:var(--text2);font-weight:300;line-height:1.6}

/* ── IN USE ── */
.use-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-top:2.4rem}
.use-card{background:var(--bg2)}
.use-media{position:relative;width:100%;height:250px;overflow:hidden;background:#0C0C0B}
.use-media video,.use-media img{width:100%;height:100%;object-fit:cover;display:block}
.use-body{padding:2.2rem 2.6rem 2.6rem}
.use-body .pill{margin-bottom:1.3rem}
.use-title{font-size:22px;font-weight:500;color:var(--text);margin-bottom:.8rem;letter-spacing:-.02em;line-height:1.2}
.use-text{font-size:13px;color:var(--text2);font-weight:300;line-height:1.75;margin-bottom:1.6rem}
.use-list{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.use-list li{font-family:var(--mono);font-size:11px;color:var(--text2);display:flex;align-items:center;gap:8px}
.use-list li::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--indigo);flex-shrink:0}
/* industry cards, same recipe as industries.html */
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin-top:3rem}
.ind-card{background:var(--bg);padding:2.4rem 2.1rem 2.2rem;display:flex;flex-direction:column;gap:1.3rem;text-decoration:none;transition:filter .18s}
.ind-card:hover{filter:brightness(.96)}
.ind-card-top{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:1.2rem;border-bottom:1px solid var(--border2)}
.ind-card-head{display:flex;flex-direction:column;gap:.6rem}
.ind-num{font-family:var(--mono);font-size:10px;color:var(--text3);letter-spacing:.1em}
.ind-icon svg{width:28px;height:28px;stroke:var(--text3);fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.ind-card h4{font-family:var(--display);font-size:2rem;letter-spacing:.02em;text-transform:uppercase;line-height:.95;color:var(--text);font-weight:400;min-height:1.9em}
.ind-card-desc{font-size:13px;color:var(--text2);font-weight:300;line-height:1.75;flex:1}
.ind-card-foot{display:flex;align-items:center;gap:.8rem;margin-top:auto}
.ind-stat{font-family:var(--mono);font-size:10px;color:var(--indigo);letter-spacing:.08em;text-transform:uppercase}
.ind-tag{font-family:var(--mono);font-size:9px;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--border2);padding:3px 8px}
.cc-sky{background:var(--sky)}.cc-sky .ind-num,.cc-sky .ind-card-desc,.cc-sky .ind-stat,.cc-sky .ind-tag,.cc-sky h4{color:#1B263F}.cc-sky .ind-icon svg{stroke:#1B263F}.cc-sky .ind-card-top{border-bottom-color:rgba(27,38,63,.18)}.cc-sky .ind-tag{border-color:rgba(27,38,63,.2)}
.cc-teal{background:var(--teal)}.cc-teal .ind-num,.cc-teal .ind-card-desc{color:rgba(255,255,255,.6)}.cc-teal h4{color:#fff}.cc-teal .ind-stat{color:#E6FD53}.cc-teal .ind-icon svg{stroke:rgba(255,255,255,.55)}.cc-teal .ind-card-top{border-bottom-color:rgba(255,255,255,.14)}.cc-teal .ind-tag{color:#E6FD53;border-color:rgba(230,253,83,.3)}
.cc-navy{background:var(--navy)}.cc-navy .ind-num,.cc-navy .ind-card-desc{color:rgba(255,255,255,.55)}.cc-navy h4{color:#fff}.cc-navy .ind-stat{color:#9EB8F9}.cc-navy .ind-icon svg{stroke:rgba(255,255,255,.45)}.cc-navy .ind-card-top{border-bottom-color:rgba(255,255,255,.12)}.cc-navy .ind-tag{color:#9EB8F9;border-color:rgba(158,184,249,.25)}
.cc-lemon{background:var(--leaf)}.cc-lemon .ind-num,.cc-lemon .ind-card-desc,.cc-lemon .ind-stat,.cc-lemon .ind-tag{color:#1B3A1A}.cc-lemon h4{color:#0F2710}.cc-lemon .ind-icon svg{stroke:#1B3A1A}.cc-lemon .ind-card-top{border-bottom-color:rgba(27,58,26,.18)}.cc-lemon .ind-tag{border-color:rgba(27,58,26,.22)}
.cc-elite{background:var(--elite)}.cc-elite .ind-num,.cc-elite .ind-card-desc{color:rgba(255,255,255,.6)}.cc-elite h4{color:#fff}.cc-elite .ind-stat{color:#D0FF41}.cc-elite .ind-icon svg{stroke:rgba(255,255,255,.5)}.cc-elite .ind-card-top{border-bottom-color:rgba(255,255,255,.14)}.cc-elite .ind-tag{color:#D0FF41;border-color:rgba(208,255,65,.3)}
.cc-silver{background:var(--silver)}.cc-silver .ind-num,.cc-silver .ind-card-desc,.cc-silver .ind-stat,.cc-silver .ind-tag{color:#1B263F}.cc-silver h4{color:#0C0C0B}.cc-silver .ind-icon svg{stroke:#1B263F}.cc-silver .ind-card-top{border-bottom-color:rgba(27,38,63,.18)}.cc-silver .ind-tag{border-color:rgba(27,38,63,.2)}

/* ── WHERE THIS GOES ── */
.vision-col{max-width:640px;position:relative}
.vision-mark{position:absolute;top:-2.4rem;left:-1.4rem;font-family:var(--display);font-size:9rem;color:rgba(32,79,86,.16);line-height:1;z-index:0;user-select:none}
.vision-head{font-family:var(--display);font-size:clamp(2rem,4vw,3.6rem);text-transform:uppercase;line-height:1.02;color:var(--text);position:relative;z-index:1;margin-bottom:2rem}
.vision-head em{color:var(--indigo);font-style:normal}
.vision-quote{font-size:clamp(1.15rem,1.75vw,1.45rem);font-weight:400;font-style:italic;color:var(--teal);line-height:1.7;position:relative;z-index:1;margin-bottom:1rem}
.vision-quote cite{display:block;font-family:var(--mono);font-style:normal;font-size:11px;color:var(--teal);letter-spacing:.08em;text-transform:uppercase;margin-top:1rem}
.vision-steps{list-style:none;counter-reset:vstep;margin-top:2.6rem;display:flex;flex-direction:column;gap:1.3rem;position:relative;z-index:1}
.vision-steps li{counter-increment:vstep;display:flex;gap:1.2rem;align-items:baseline}
.vision-steps li::before{content:"0" counter(vstep);font-family:var(--mono);font-size:12px;color:var(--indigo);font-weight:500;flex-shrink:0;width:24px}
.vision-steps li span{font-size:15.5px;color:var(--text);font-weight:400;line-height:1.6}
.vision-steps li b{color:var(--text);font-weight:600}

/* ── CONTACT (from the Navigation Kit page) ── */
.cta-section{padding:8rem 3rem;border-top:1px solid var(--border);position:relative;overflow:hidden;background:var(--bg)}
.cta-bg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.cta-bg .tile{opacity:0;animation:tileBlink 9s ease-in-out infinite;will-change:opacity}
@keyframes tileBlink{0%,100%{opacity:0}10%{opacity:var(--peak,.4)}26%{opacity:var(--peak,.4)}38%{opacity:0}}
.cta-inner{max-width:1160px;margin:0 auto;position:relative;z-index:1}
.cta-label{font-family:var(--mono);font-size:10px;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:2rem}
.cta-h2{font-family:var(--display);font-size:clamp(3rem,8vw,9rem);text-transform:uppercase;letter-spacing:.01em;line-height:.92;color:var(--text);margin-bottom:3rem}
.cta-h2 em{color:var(--indigo-l);font-style:normal}
.cta-actions{display:flex;gap:1rem;flex-wrap:wrap}

/* ── FOOTER ── */
footer{padding:2rem 3rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:1px solid var(--border)}
.f-logo{font-family:var(--mono);font-size:11px;color:var(--text3);letter-spacing:.06em}
.f-links{display:flex;gap:2rem;list-style:none;flex-wrap:wrap}
.f-links a{font-family:var(--mono);font-size:10px;color:var(--text3);text-decoration:none;letter-spacing:.06em;text-transform:uppercase;transition:color .15s}
.f-links a:hover{color:var(--text)}
.f-copy{font-family:var(--mono);font-size:10px;color:var(--text3)}

/* ── RESPONSIVE ── */
@media(max-width:960px){
  .stats-bar{grid-template-columns:1fr 1fr}
  .stat-cell{border-bottom:1px solid var(--border)}
  .stat-cell:nth-child(2n){border-right:none}
  .use-grid{grid-template-columns:1fr}
  .ind-grid{grid-template-columns:1fr 1fr}
  .glance-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  .rail-grid{grid-template-columns:1fr}
  .rail-idx{flex-direction:row;align-items:baseline;gap:.9rem;position:static;margin-bottom:1.8rem}
  .rail-idx .rt{writing-mode:horizontal-tb;transform:none}
  .cause-grid{grid-template-columns:1fr}
  .feat-list{grid-template-columns:1fr}
  .hero-wrap{padding:8rem 1.5rem 3rem}
}
@media(max-width:680px){
  nav{padding:0 1.5rem}
  .nav-links{display:none}
  .rail-section,.cta-section{padding:3.5rem 1.5rem}
  .hero-col h1{font-size:3.4rem}
  .hero-slogan{font-size:1.15rem}
  .vision-mark{display:none}
  .stats-bar{grid-template-columns:1fr}
  .stat-cell{border-right:none}
  .ind-grid{grid-template-columns:1fr}
  .use-media{height:200px}
  .use-body{padding:1.8rem 1.5rem 2.2rem}
  .panel-foot{grid-template-columns:1fr 1fr}
  .fv-body{grid-template-columns:1fr}
  .fv-side{display:none}
  .fv-legend{display:none}
  .frontier-labels{flex-direction:column;gap:1rem}
  .stat-strip .s{border-right:none}
}

/* ── Mobile hamburger nav ── */
.hamburger-btn{display:none;width:34px;height:34px;border:1px solid var(--border);background:none;cursor:pointer;padding:0;position:relative;flex-shrink:0;margin-left:.9rem;-webkit-appearance:none;appearance:none}
.hamburger-btn span{position:absolute;left:8px;right:8px;height:1px;background:var(--text2);transition:transform .25s ease,opacity .2s ease}
.hamburger-btn span:nth-child(1){top:12px}
.hamburger-btn span:nth-child(2){top:17px}
.hamburger-btn span:nth-child(3){top:22px}
.hamburger-btn.open span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.hamburger-btn.open span:nth-child(2){opacity:0}
.hamburger-btn.open span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:450;background:var(--bg2);opacity:0;pointer-events:none;transition:opacity .25s ease;overflow-y:auto;padding:86px 1.5rem 3rem}
.mobile-menu.open{opacity:1;pointer-events:all}
.mobile-menu-inner{max-width:480px;margin:0 auto}
.mm-link{display:block;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--text2);text-decoration:none;padding:1.1rem 0;border-bottom:1px solid var(--border)}
.mm-link.active{color:var(--text)}
.mm-group-btn{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:none;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--text2);padding:1.1rem 0;border-bottom:1px solid var(--border);cursor:pointer;-webkit-appearance:none;appearance:none}
.mm-group-chevron{transition:transform .2s ease;flex-shrink:0}
.mm-group-btn.open .mm-group-chevron{transform:rotate(180deg)}
.mm-sublist{max-height:0;overflow:hidden;transition:max-height .3s ease}
.mm-sublist.open{max-height:640px}
.mm-sub-link{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--text3);text-decoration:none;padding:.8rem 0 .8rem 1rem}
.mm-sub-link.active{color:var(--text)}
.mm-cta{display:inline-flex;margin-top:2rem;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text);border:1px solid var(--text3);padding:13px 22px;text-decoration:none}
@media(max-width:680px){.hamburger-btn{display:block}}

@media(prefers-reduced-motion:reduce){
  body{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
  .pill-dot,.live-dot,.wb-row-st.computing{animation:none}
  .cta-bg .tile{animation:none;opacity:calc(var(--peak,.4)*.45)}
  html{scroll-behavior:auto}
}

/* dark hero (Scout): coloured point cloud and machines on black, white type, nav inverted until scrolled */
.hero-dark,.hero-dark .hero-canvas-wrap{background:#0C0C0B}
.hero-dark .hero-video{opacity:1;object-position:center center}
.hero-dark .hero-overlay{background:linear-gradient(100deg,rgba(12,12,11,.96) 0%,rgba(12,12,11,.9) 26%,rgba(12,12,11,.55) 48%,rgba(12,12,11,.14) 68%,rgba(12,12,11,0) 100%)}
.hero-dark .hero-overlay::before{background:linear-gradient(to bottom,rgba(12,12,11,.85) 0%,rgba(12,12,11,0) 100%)}
.hero-dark .hero-overlay::after{display:none}
.hero-dark h1{color:#fff}
.hero-dark .hero-slogan{color:var(--indigo-l)}
.hero-dark .hero-desc{color:rgba(255,255,255,.72)}
.hero-dark .pill{color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.25)}
.hero-dark .btn-ghost{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.35)}
.hero-dark .btn-ghost:hover{color:#fff;border-color:#fff}
.dark-hero #nav:not(.scrolled) .nav-links > li > a,.dark-hero #nav:not(.scrolled) .nav-solutions-btn{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.22)}
.dark-hero #nav:not(.scrolled) .nav-cta{color:#fff;border-color:rgba(255,255,255,.5)}
.dark-hero #nav:not(.scrolled) .logo img{filter:invert(1) brightness(1.6)}
.dark-hero #nav:not(.scrolled) .hamburger-btn span{background:#fff}

/* ── MOBILE ───────────────────────────────────────────────────────────────
   A grid or flex item will not shrink below the widest thing inside it unless
   it is told it may: min-width defaults to auto. The instrument panels hold
   tables with fixed column widths, so a panel stayed ~380px wide and pushed
   out of its section on a phone. Every box in the chain down to the scrolling
   table now carries min-width:0, so the panel fits the screen and the table
   scrolls inside its own frame instead.

   Note: do not "solve" overflow with overflow-x on <html>/<body>. The spec
   forces the other axis to `auto`, which makes the body its own scroll
   container — window scrolling and viewport-rooted IntersectionObservers then
   stop working (lazy videos and canvas figures never start) and section
   backgrounds stop short of the screen edge on iOS. Fix the width instead. */
@media(max-width:900px){

  /* let every container shrink to the screen */
  .rail-grid,.rail-grid > *,.rail-grid > * > *,
  .what-split,.what-split > *,
  .panel,.panel-head,.panel-body,.panel-foot,
  .fv-body,.fv-map,.prod-media,
  .feat-row,.glance,.cause,.use-card,.use-body{min-width:0}

  .rail-grid{grid-template-columns:minmax(0,1fr)}
  .what-split{grid-template-columns:minmax(0,1fr)}
  .panel{max-width:100%;width:100%}

  /* the tables keep their column widths and scroll within the panel */
  .panel-body,.fv-body{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .wb-cols,.wb-row,.mt-cols,.mt-row{min-width:380px}
  .panel-head{flex-wrap:wrap;row-gap:4px}
  .panel-foot{min-width:0}

  /* a full-height hero on a phone is mostly crop and empty scroll */
  .hero{min-height:72vh}

  /* one card per row, so each clip may keep its own shape */
  .use-media{height:auto;aspect-ratio:auto}
  .use-media video,.use-media img{height:auto;width:100%;object-fit:contain;display:block}

  img,video,svg,canvas{max-width:100%}
}