/* Newboot website v0.1 */
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/montserrat-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/montserrat-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/montserrat-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/montserrat-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/barlow-semi-condensed-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/barlow-semi-condensed-latin-600-normal.woff2') format('woff2'); }
/* Fallback fonts sized like the brand fonts, so text does not jump when they load (CLS) */
@font-face { font-family: 'Montserrat Fallback'; src: local('Arial'); ascent-override: 85.79%; descent-override: 22.25%; line-gap-override: 0%; size-adjust: 112.83%; }
@font-face { font-family: 'Barlow Fallback'; src: local('Arial Narrow'), local('Arial'); ascent-override: 115%; descent-override: 23%; line-gap-override: 0%; size-adjust: 86%; }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/barlow-semi-condensed-latin-700-normal.woff2') format('woff2'); }

/* Layout: deep-ink hero band with a live "edge to agent" console, then light problem-first sections, results, platform, path, contact. */
:root {
  --violet: #5233FD;
  --violet-text: #4F30FD;
  --ink: #1A0067;
  --mint: #7FE2BF;
  --lilac: #8671FF;
  --bg: #FFFFFF;
  --bg-alt: #F5F3FD;
  --fg: #150A3E;
  --muted: #5A5478;
  --line: #E3DFF4;
  --surface: #FFFFFF;
  --chip: #EEEBFC;
  --hero-bg: #1A0067;
  --hero-fg: #FFFFFF;
  --hero-muted: #C9C1F5;
  --hero-panel: #24107A;
  --hero-line: #3A2799;
  --logo: #3B3360;
  --logo-knock: #FFFFFF;
  --ok: #1F9D6E;
  --alert: #D9483B;
  --font-display: "Montserrat", "Montserrat Fallback", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Montserrat", "Montserrat Fallback", "Helvetica Neue", Arial, sans-serif;
  --font-label: "Barlow Semi Condensed", "Barlow Fallback", "Arial Narrow", Arial, sans-serif;
  --radius: 14px;
  --max: 1180px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --violet: #6B50FF; --violet-text: #A796FF; --bg: #0C0728; --bg-alt: #110A35; --fg: #EFECFB; --muted: #ABA4CC;
    --line: #2A2257; --surface: #150D3D; --chip: #22175A; --hero-bg: #13004D; --hero-panel: #1D0C66; --hero-line: #33208E;
    --logo: #D8D3F1; --logo-knock: #0C0728; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --violet: #6B50FF; --violet-text: #A796FF; --bg: #0C0728; --bg-alt: #110A35; --fg: #EFECFB; --muted: #ABA4CC;
  --line: #2A2257; --surface: #150D3D; --chip: #22175A; --hero-bg: #13004D; --hero-panel: #1D0C66; --hero-line: #33208E;
  --logo: #D8D3F1; --logo-knock: #0C0728; color-scheme: dark;
}

* { box-sizing: border-box; }
body { background: var(--bg); color: var(--fg); font-family: var(--font-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--hero-bg); }
a { color: inherit; }
h1, h2, h3 { font-family: var(--font-display); text-wrap: balance; margin: 0; letter-spacing: -0.015em; }
p { margin: 0; }
.wrap { max-width: var(--max); margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.label { font-family: var(--font-label); font-weight: 600; text-transform: uppercase; letter-spacing: 0.09em; font-size: 14px; }
.section { padding-block: 96px; }
.section-head { display: grid; gap: 14px; max-width: 760px; margin-bottom: 48px; }
.section-head h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; font-weight: 700; }
.section-head p { color: var(--muted); font-size: 17px; max-width: 62ch; }
.eyebrow { color: var(--violet-text); }
:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; border-radius: 4px; }

/* Buttons */
.btn { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-body); font-weight: 600; font-size: 15px; border-radius: 999px; padding: 12px 22px; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: transform .15s ease, background .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--mint); color: #1A0067; }
.btn-ghost { border-color: var(--hero-line); color: var(--hero-fg); }
.btn-violet { background: var(--violet); color: #FFFFFF; }

/* Nav */
.nav { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: var(--hero-bg); color: var(--hero-fg); border-bottom: 1px solid var(--hero-line); }
.nav-inner { display: flex; align-items: center; gap: 28px; height: 68px; }
.brand { display: inline-flex; align-items: center; text-decoration: none; color: var(--hero-fg); font-family: var(--font-label); font-weight: 700; font-size: 28px; letter-spacing: -0.01em; line-height: 1; }
.brand svg { height: 26px; width: auto; display: block; }
.nav .brand { color: var(--mint); }
.nav-links { display: flex; align-items: center; gap: 22px; font-size: 14.5px; font-weight: 500; height: 100%; }
.nav-a, .dd-btn { text-decoration: none; color: var(--hero-muted); background: none; border: 0; font: inherit; font-weight: 500; padding: 0; cursor: pointer; }
.nav-a:hover, .dd-btn:hover, .dd-btn[aria-expanded="true"] { color: var(--hero-fg); }
.dd { position: relative; height: 100%; display: flex; align-items: center; }
.dd-btn::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-3px) rotate(45deg); }
.dd-panel { display: none; position: absolute; top: 100%; left: -18px; min-width: 320px; padding: 10px; gap: 2px; background: var(--surface); color: var(--fg); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 60px -20px rgba(20,8,70,.35); }
.dd:hover .dd-panel, .dd-btn[aria-expanded="true"] + .dd-panel { display: grid; }
.dd-panel.mega { width: 620px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
.dd-col { display: grid; gap: 2px; align-content: start; }
.dd-head { display: flex; align-items: center; gap: 8px; padding: 8px 12px 4px; font-family: var(--font-label); font-weight: 600; font-size: 12.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.dd-head .new { font-style: normal; font-size: 10.5px; padding: 1px 7px; }
.dd-item { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; text-decoration: none; color: var(--fg); }
.dd-item:hover, .dd-item:focus-visible { background: var(--bg-alt); }
.dd-item b { font-size: 14.5px; font-weight: 600; }
.dd-item span { font-size: 13px; color: var(--muted); font-weight: 400; }
.menu-btn { display: none; background: none; border: 1px solid var(--hero-line); color: var(--hero-fg); font: inherit; font-size: 14px; font-weight: 600; border-radius: 999px; padding: 7px 14px; cursor: pointer; }
.mobile-menu { border-top: 1px solid var(--hero-line); max-height: calc(100vh - 68px); overflow-y: auto; }
.mm-inner { display: grid; gap: 2px; padding-block: 12px 20px; }
.mm-inner .dd-head { color: var(--mint); padding: 14px 0 4px; }
.mm-inner a { color: var(--hero-fg); text-decoration: none; padding: 8px 0; font-size: 16px; }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.lang { display: inline-flex; border: 1px solid var(--hero-line); border-radius: 999px; overflow: hidden; }
.lang button { background: none; border: 0; color: var(--hero-muted); font-family: var(--font-label); font-weight: 600; font-size: 14px; padding: 6px 11px; cursor: pointer; }
.lang button[aria-pressed="true"] { background: var(--hero-panel); color: var(--hero-fg); }
.nav .btn { padding: 9px 18px; font-size: 14px; }

/* Hero */
.hero { background: var(--hero-bg); color: var(--hero-fg); overflow: hidden; position: relative; }
.hero::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--hero-line) 1px, transparent 1px), linear-gradient(90deg, var(--hero-line) 1px, transparent 1px); background-size: 56px 56px; opacity: .35; mask-image: radial-gradient(ellipse at 75% 40%, #000 0%, transparent 65%); -webkit-mask-image: radial-gradient(ellipse at 75% 40%, #000 0%, transparent 65%); pointer-events: none; }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; padding-block: 80px 88px; }
.hero .eyebrow { color: var(--mint); }
.hero h1 { font-size: clamp(34px, 4.6vw, 56px); line-height: 1.08; font-weight: 700; margin-top: 18px; }
.hero h1 em { font-style: normal; color: var(--mint); }
.hero-sub { margin-top: 22px; font-size: 18px; color: var(--hero-muted); max-width: 54ch; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 40px; color: var(--hero-muted); font-family: var(--font-label); font-size: 16px; letter-spacing: .03em; }
.hero-facts b { color: var(--hero-fg); font-weight: 700; font-variant-numeric: tabular-nums; }

/* Console */
.console { background: var(--hero-panel); border: 1px solid var(--hero-line); border-radius: 18px; padding: 18px; box-shadow: 0 30px 80px -30px rgba(0,0,0,.55); min-width: 0; }
.console-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 4px 14px; border-bottom: 1px solid var(--hero-line); }
.console-top .label { color: var(--hero-muted); font-size: 13px; }
.live { display: inline-flex; align-items: center; gap: 7px; color: var(--mint); }
.live i { width: 8px; height: 8px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 0 rgba(127,226,191,.6); animation: pulse 2s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(127,226,191,.55); } 70% { box-shadow: 0 0 0 8px rgba(127,226,191,0); } 100% { box-shadow: 0 0 0 0 rgba(127,226,191,0); } }
.rows { display: grid; gap: 10px; margin-top: 14px; }
.row { display: grid; grid-template-columns: 1fr auto; gap: 4px 14px; align-items: center; background: rgba(255,255,255,.04); border: 1px solid var(--hero-line); border-radius: 12px; padding: 12px 14px; }
.row .src { font-family: var(--font-label); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; color: var(--hero-muted); }
.row .what { font-size: 14.5px; font-weight: 500; color: var(--hero-fg); }
.row .val { grid-row: 1 / span 2; grid-column: 2; text-align: right; font-family: var(--font-label); font-weight: 700; font-size: 26px; font-variant-numeric: tabular-nums; color: var(--hero-fg); line-height: 1.05; }
.row .val small { display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); }
.pill { display: inline-block; font-family: var(--font-label); font-weight: 700; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; margin-left: 6px; vertical-align: 2px; }
.pill.reject { background: rgba(217,72,59,.18); color: #FF9A8F; }
.pill.ok { background: rgba(127,226,191,.16); color: var(--mint); }
.ask { background: rgba(127,226,191,.07); border-color: rgba(127,226,191,.35); grid-template-columns: 1fr; }
.ask .q { font-size: 14.5px; color: var(--hero-fg); }
.ask .a { font-size: 14px; color: var(--mint); font-weight: 500; }
.console-note { margin-top: 12px; font-size: 12px; color: var(--hero-muted); text-align: right; }

/* Logo strip */
.logos { border-bottom: 1px solid var(--line); padding-block: 36px; }
.logos-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.logos .label { color: var(--muted); font-size: 13px; flex: 0 0 auto; margin-right: 10px; }
.logo-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 30px; flex: 1 1 600px; }
.logo-row svg { height: 46px; width: auto; color: var(--logo); opacity: .85; transition: opacity .2s; }
.logo-row svg:hover { opacity: 1; }

/* Problem cards */
.problems { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.prob { display: grid; grid-template-rows: auto auto 1fr auto; gap: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; text-decoration: none; color: var(--fg); transition: border-color .2s, transform .2s; }
.prob:hover { border-color: var(--violet); transform: translateY(-2px); }
.prob .label { color: var(--violet-text); font-size: 13px; }
.prob h3 { font-size: 21px; line-height: 1.25; font-weight: 700; }
.prob p { color: var(--muted); font-size: 15.5px; }
.prob .go { font-weight: 600; font-size: 14.5px; color: var(--violet-text); }
.prob .metric { font-family: var(--font-label); font-weight: 700; font-size: 15px; color: var(--fg); letter-spacing: .02em; }
.genesis { margin-top: 28px; display: grid; grid-template-columns: minmax(0, 260px) repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; background: var(--bg-alt); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; }
.genesis-intro { display: grid; gap: 8px; align-content: start; }
.genesis-intro h3 { font-size: 19px; }
.genesis-intro p { font-size: 14.5px; color: var(--muted); }
.new { display: inline-block; width: max-content; background: var(--mint); color: #1A0067; font-family: var(--font-label); font-weight: 700; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; }
.gen-item { display: grid; gap: 6px; align-content: start; padding: 16px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); text-decoration: none; color: var(--fg); }
.gen-item:hover { border-color: var(--violet); }
.gen-item b { font-size: 15.5px; }
.gen-item span { font-size: 14px; color: var(--muted); }

/* Results */
.results-bg { background: var(--bg-alt); }
.stories { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.story { display: grid; grid-template-rows: auto auto auto 1fr auto; gap: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 32px; }
.story-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.story-top svg { height: 40px; width: auto; color: var(--logo); }
.story .label { color: var(--violet-text); font-size: 13px; }
.big { font-family: var(--font-label); font-weight: 700; font-size: clamp(48px, 6vw, 68px); line-height: .95; color: var(--violet-text); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.big small { display: block; font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--fg); letter-spacing: 0; margin-top: 10px; }
.story ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.story li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 15px; color: var(--muted); }
.story li::before { content: ""; width: 8px; height: 8px; margin-top: 8px; border-radius: 2px; background: var(--mint); transform: rotate(45deg); }
.award { display: inline-flex; align-items: center; gap: 8px; width: max-content; max-width: 100%; font-family: var(--font-label); font-weight: 600; font-size: 14px; letter-spacing: .04em; color: var(--fg); background: var(--chip); padding: 6px 12px; border-radius: 999px; }
.award::before { content: "★"; color: var(--violet-text); }
.story .go { font-weight: 600; font-size: 14.5px; color: var(--violet-text); text-decoration: none; }
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 44px; border-top: 1px solid var(--line); }
.stat { padding: 26px 20px 0 0; display: grid; gap: 4px; }
.stat b { font-family: var(--font-label); font-weight: 700; font-size: 44px; line-height: 1; font-variant-numeric: tabular-nums; }
.stat span { color: var(--muted); font-size: 14.5px; }

/* Platform */
.flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.step { padding: 30px 28px; display: grid; gap: 12px; align-content: start; position: relative; border-right: 1px solid var(--line); }
.step:last-child { border-right: 0; }
.step-num { font-family: var(--font-label); font-weight: 700; color: var(--violet-text); font-size: 15px; letter-spacing: .08em; }
.step h3 { font-size: 20px; }
.step p { color: var(--muted); font-size: 15px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.chip { font-family: var(--font-label); font-weight: 600; font-size: 13px; letter-spacing: .04em; background: var(--chip); color: var(--fg); padding: 3px 9px; border-radius: 6px; }
.step:not(:last-child)::after { content: "→"; position: absolute; right: -13px; top: 30px; width: 26px; height: 26px; display: grid; place-items: center; background: var(--bg); border: 1px solid var(--line); border-radius: 50%; font-size: 13px; color: var(--violet-text); z-index: 1; }
.platform-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-top: 22px; color: var(--muted); font-size: 15px; }
.platform-foot a { color: var(--violet-text); font-weight: 600; text-decoration: none; }

/* Why */
.why { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.why-item { display: grid; gap: 10px; align-content: start; padding-top: 18px; border-top: 2px solid var(--violet); }
.why-item h3 { font-size: 18px; }
.why-item p { color: var(--muted); font-size: 15px; }
.partners { margin-top: 56px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 34px; padding-top: 28px; border-top: 1px solid var(--line); }
.partners .label { color: var(--muted); font-size: 13px; }
.partner-row { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 44px; flex: 1 1 600px; }
.partner-row svg { height: 30px; width: auto; color: var(--logo); opacity: .85; display: block; }
.partner-row svg.tall { height: 40px; }
.pmask { display: block; height: 62px; aspect-ratio: 420 / 275; background: var(--logo); opacity: .85; -webkit-mask: url(../img/aerospace-mask.png) center / contain no-repeat; mask: url(../img/aerospace-mask.png) center / contain no-repeat; }

/* Path + contact */
.cta-band { background: var(--hero-bg); color: var(--hero-fg); }
.cta-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding-block: 88px; }
.cta-band h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; }
.cta-band .eyebrow { color: var(--mint); }
.cta-band .lead { color: var(--hero-muted); margin-top: 14px; font-size: 17px; max-width: 48ch; }
.path { list-style: none; padding: 0; margin: 32px 0 0; display: grid; gap: 0; }
.path li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 16px 0; border-top: 1px solid var(--hero-line); }
.path li:last-child { border-bottom: 1px solid var(--hero-line); }
.path .n { font-family: var(--font-label); font-weight: 700; font-size: 26px; color: var(--mint); line-height: 1.1; }
.path b { display: block; font-size: 16px; }
.path span { color: var(--hero-muted); font-size: 14.5px; }
form { background: var(--hero-panel); border: 1px solid var(--hero-line); border-radius: 18px; padding: 28px; display: grid; gap: 14px; align-content: start; }
.f2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field label { font-size: 13px; font-weight: 600; color: var(--hero-muted); }
.field input, .field select, .field textarea { width: 100%; font: inherit; font-size: 15px; color: var(--hero-fg); background: rgba(255,255,255,.06); border: 1px solid var(--hero-line); border-radius: 10px; padding: 11px 12px; }
.field select option { color: #150A3E; }
.field textarea { min-height: 96px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: #9C93CF; }
.form-foot { font-size: 12.5px; color: var(--hero-muted); }
.form-msg { font-size: 14px; color: var(--mint); font-weight: 500; }
form .btn { justify-self: start; }

/* Footer */
footer { padding-block: 56px 40px; border-top: 1px solid var(--line); }
.foot { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 28px; }
.foot .brand { color: var(--violet-text); }
.foot p { color: var(--muted); font-size: 14px; margin-top: 12px; max-width: 32ch; }
.foot .foot-h { margin: 0 0 10px; font-family: var(--font-label); text-transform: uppercase; letter-spacing: .09em; font-size: 13px; color: var(--muted); }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; font-size: 14px; }
.foot a { text-decoration: none; color: var(--fg); }
.foot a:hover { color: var(--violet-text); }
.legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }

@media (max-width: 980px) {
  .hero-grid, .cta-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .genesis { grid-template-columns: minmax(0, 1fr); }
  .why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav-links { display: none; }
  .menu-btn { display: inline-block; }
}
@media (max-width: 720px) {
  .section { padding-block: 64px; }
  .problems, .stories, .flow { grid-template-columns: minmax(0, 1fr); }
  .step { border-right: 0; border-bottom: 1px solid var(--line); }
  .step:last-child { border-bottom: 0; }
  .step:not(:last-child)::after { content: "↓"; right: auto; left: 28px; top: auto; bottom: -13px; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .why { grid-template-columns: minmax(0, 1fr); }
  .f2 { grid-template-columns: minmax(0, 1fr); }
  .logo-row { justify-content: flex-start; }
  .logo-row svg { height: 38px; }
  .nav .btn { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* v0.1 additions */
html { scroll-behavior: smooth; }
:root { padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
body { margin: 0; }
img, video { max-width: 100%; }
[hidden] { display: none !important; }
.lang button:disabled { opacity: .45; cursor: not-allowed; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-msg.is-error { color: #FF9A8F; }
.legal a { color: var(--muted); }
.legal button { background: none; border: 0; padding: 0; font: inherit; color: var(--muted); text-decoration: underline; cursor: pointer; }
.cookie-banner { position: fixed; z-index: 50; left: max(16px, env(safe-area-inset-left, 0px)); right: max(16px, env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); max-width: 720px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding: 18px 20px; background: var(--surface); color: var(--fg); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 60px -20px rgba(20,8,70,.4); font-size: 14.5px; }
.cookie-banner p { flex: 1 1 320px; }
.cookie-banner a { color: var(--violet-text); }
.cookie-actions { display: flex; gap: 10px; }
.btn-ghost-dark { border-color: var(--line); color: var(--fg); background: none; }
.doc { max-width: 760px; padding-block: 64px 96px; }
.doc h1 { font-size: clamp(30px, 4vw, 42px); margin-bottom: 12px; }
.doc h2 { font-size: 22px; margin-top: 44px; margin-bottom: 12px; scroll-margin-top: 90px; }
.doc p, .doc li { color: var(--muted); font-size: 15.5px; margin: 0 0 10px; }
.doc dl { display: grid; grid-template-columns: 200px 1fr; gap: 8px 16px; font-size: 15.5px; }
.doc dt { font-weight: 600; }
.doc dd { margin: 0; color: var(--muted); }
.todo { background: #FFF1C9; color: #5A4300; padding: 1px 6px; border-radius: 4px; font-size: .92em; }
@media (max-width: 720px) { .doc dl { grid-template-columns: 1fr; } }

/* Computer Vision page */
.crumbs { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; padding-top: 22px; font-size: 13.5px; color: var(--hero-muted); }
.crumbs a { color: var(--hero-muted); text-decoration: none; }
.crumbs a:hover { color: var(--hero-fg); }
.crumbs [aria-current] { color: var(--hero-fg); }
.cv-hero { padding-block: 40px 88px; }
.shot { margin: 0; min-width: 0; }
.shot img { display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--hero-line); box-shadow: 0 30px 80px -30px rgba(0,0,0,.6); }
.shot figcaption { margin-top: 10px; font-size: 12.5px; color: var(--hero-muted); text-align: right; }
.trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }

.player { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 28px; align-items: start; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.stepbtn { width: 100%; text-align: left; display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--fg); font: inherit; cursor: pointer; transition: border-color .2s, background .2s; }
.stepbtn:hover { border-color: var(--violet); }
.stepbtn .sn { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-label); font-weight: 700; font-size: 16px; background: var(--chip); color: var(--violet-text); }
.stepbtn b { display: block; font-size: 15.5px; }
.stepbtn span span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.5; margin-top: 2px; }
.stepbtn:not(.is-active) span span { display: none; }
.stepbtn.is-active { border-color: var(--violet); box-shadow: inset 3px 0 0 var(--violet); }
.stepbtn.is-active .sn { background: var(--violet); color: #FFFFFF; }
.screen { min-width: 0; background: var(--hero-bg); border-radius: 16px; padding: 10px; border: 1px solid var(--line); }
.screen video { display: block; width: 100%; height: auto; border-radius: 10px; background: #FFFFFF; }
.screen-bar { display: flex; align-items: center; gap: 12px; padding: 10px 4px 2px; color: var(--hero-muted); }
.playbtn { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--hero-line); background: none; color: var(--hero-fg); font-size: 11px; cursor: pointer; }
.progress { flex: 1; height: 4px; background: var(--hero-line); border-radius: 4px; overflow: hidden; }
.progress i { display: block; height: 100%; width: 0; background: var(--mint); }
.screen-bar .label { font-size: 13px; }
.demo-stats { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px 40px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
.demo-stats div { display: grid; }
.demo-stats b { font-family: var(--font-label); font-weight: 700; font-size: 32px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.demo-stats span { font-size: 14px; color: var(--muted); }
.demo-stats p { margin-left: auto; font-size: 13px; color: var(--muted); font-style: italic; }

.arch { display: grid; grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1.15fr) 40px minmax(0, 1fr); align-items: stretch; }
.node { display: grid; gap: 6px; align-content: start; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.node .label { color: var(--violet-text); font-size: 13px; }
.node b { font-size: 17px; }
.node > span:last-child { color: var(--muted); font-size: 14.5px; }
.node.hot { background: var(--hero-bg); border-color: var(--hero-bg); color: var(--hero-fg); }
.node.hot .label { color: var(--mint); }
.node.hot > span:last-child { color: var(--hero-muted); }
.arrow { display: grid; place-items: center; color: var(--violet-text); font-size: 20px; }
.benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 36px; }
.benefits div { display: grid; gap: 4px; }
.benefits b { font-size: 16px; }
.benefits span { color: var(--muted); font-size: 14.5px; }

.prob.static { cursor: default; }
.prob.static:hover { transform: none; border-color: var(--line); }

.case { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.case h2 { font-size: clamp(26px, 3vw, 36px); line-height: 1.18; margin-top: 14px; }
.case-lead { margin-top: 18px; color: var(--muted); font-size: 17px; max-width: 62ch; }
.minor { font-size: 17px; margin-top: 30px; }
.flowlist { margin: 14px 0 0; padding: 0; list-style: none; counter-reset: f; display: grid; gap: 10px; }
.flowlist li { counter-increment: f; display: grid; grid-template-columns: 30px 1fr; gap: 10px; font-size: 15.5px; color: var(--muted); }
.flowlist li::before { content: counter(f); font-family: var(--font-label); font-weight: 700; color: var(--violet-text); font-size: 18px; line-height: 1.4; }
.case-sites { margin-top: 22px; font-size: 15.5px; font-weight: 500; }
.case-side { display: grid; gap: 18px; padding: 28px; background: var(--bg-alt); border: 1px solid var(--line); border-radius: 18px; }
.case-side svg { height: 44px; width: auto; color: var(--logo); }
.kpi { display: grid; padding-top: 14px; border-top: 1px solid var(--line); }
.kpi b { font-family: var(--font-label); font-weight: 700; font-size: 40px; line-height: 1; color: var(--violet-text); font-variant-numeric: tabular-nums; }
.kpi span { font-size: 14.5px; color: var(--muted); }

.faq-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 48px; align-items: start; }
.faq { display: grid; gap: 10px; }
.faq details { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 4px 18px; }
.faq summary { cursor: pointer; font-weight: 600; font-size: 16px; padding: 14px 0; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--violet-text); font-weight: 700; }
.faq details[open] summary::after { content: "−"; }
.faq details p { color: var(--muted); font-size: 15px; padding-bottom: 16px; max-width: 65ch; }
.cta-band .path b { font-weight: 600; }

@media (max-width: 980px) {
  .player, .case, .faq-wrap { grid-template-columns: minmax(0, 1fr); }
  .stepbtn:not(.is-active) span span { display: none; }
  .arch { grid-template-columns: minmax(0, 1fr); }
  .arrow { transform: rotate(90deg); height: 36px; }
  .benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .trio, .benefits { grid-template-columns: minmax(0, 1fr); }
  .demo-stats p { margin-left: 0; }
}

/* Edge Management page */
.fleet { display: grid; gap: 0; margin-top: 14px; border: 1px solid var(--hero-line); border-radius: 12px; overflow: hidden; }
.fleet-row { display: grid; grid-template-columns: 1.3fr 1.3fr .6fr .9fr; gap: 10px; align-items: center; padding: 10px 14px; font-size: 13.5px; color: var(--hero-muted); border-top: 1px solid var(--hero-line); }
.fleet-row:first-child { border-top: 0; }
.fleet-row b { color: var(--hero-fg); font-weight: 600; }
.fleet-row .num { font-family: var(--font-label); font-weight: 600; font-size: 15px; color: var(--hero-fg); font-variant-numeric: tabular-nums; }
.fleet-head { font-family: var(--font-label); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; background: rgba(255,255,255,.04); }
.fleet-row .pill { margin-left: 0; font-style: normal; white-space: nowrap; }
.pill.warn { background: rgba(255,196,87,.16); color: #FFD27A; }
.console .ask { margin-top: 10px; }

.benefit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.bcard { display: grid; gap: 10px; align-content: start; padding: 26px 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.bnum { font-family: var(--font-label); font-weight: 700; font-size: 15px; color: var(--violet-text); letter-spacing: .08em; }
.bcard h3 { font-size: 18px; line-height: 1.3; }
.bcard p { color: var(--muted); font-size: 15px; }

.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.cmp { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 14.5px; }
.cmp th, .cmp td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; }
.cmp thead th { font-family: var(--font-label); font-weight: 600; font-size: 13.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.cmp tbody th { font-weight: 600; color: var(--fg); }
.cmp tr:last-child th, .cmp tr:last-child td { border-bottom: 0; }
.cmp .us { background: var(--chip); }
.cmp thead .us { color: var(--violet-text); }
.c { font-style: normal; display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--muted); white-space: nowrap; }
.c::before { content: ""; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--violet); box-sizing: border-box; }
.c.yes { color: var(--fg); font-weight: 600; }
.c.yes::before { background: var(--violet); }
.c.part::before { background: linear-gradient(90deg, var(--violet) 50%, transparent 50%); }
.c.no::before { border-color: var(--line); }
.table-note { margin-top: 12px; font-size: 13px; color: var(--muted); font-style: italic; }

.protocols { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 26px; }
.protocols .label { color: var(--muted); font-size: 13px; }
.uc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.uc-grid a { color: var(--violet-text); }

.it-band { background: var(--hero-bg); color: var(--hero-fg); }
.it-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; padding-block: 88px; align-items: center; }
.it-band h2 { font-size: clamp(28px, 3.2vw, 38px); line-height: 1.15; margin-top: 14px; }
.it-band .eyebrow { color: var(--mint); }
.it-band .lead { color: var(--hero-muted); margin-top: 16px; font-size: 16.5px; }
.spec { list-style: none; padding: 0; margin: 26px 0 0; display: grid; }
.spec li { display: grid; grid-template-columns: 110px 1fr; gap: 14px; padding: 12px 0; border-top: 1px solid var(--hero-line); font-size: 15px; }
.spec li:last-child { border-bottom: 1px solid var(--hero-line); }
.spec b { font-family: var(--font-label); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 13.5px; color: var(--mint); }
.spec span { color: var(--hero-fg); }
.stack { display: grid; gap: 0; min-width: 0; }
.layer { display: grid; gap: 4px; padding: 18px 20px; border: 1px solid var(--hero-line); border-radius: 12px; background: var(--hero-panel); }
.layer.top { border-color: var(--mint); background: rgba(127,226,191,.08); }
.layer b { font-size: 16px; }
.layer span { color: var(--hero-muted); font-size: 14px; }
.link { display: grid; place-items: center; height: 40px; position: relative; }
.link::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 1.5px dashed var(--hero-line); }
.link span { position: relative; background: var(--hero-bg); padding: 0 10px; font-family: var(--font-label); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--hero-muted); }
.devices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.devices span { text-align: center; padding: 10px 6px; border: 1px dashed var(--hero-line); border-radius: 10px; font-size: 13.5px; color: var(--hero-muted); }

.offers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.offer { display: grid; gap: 12px; align-content: start; padding: 32px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.offer.alt { background: var(--bg-alt); }
.offer .label { color: var(--violet-text); font-size: 13px; }
.offer h3 { font-size: 22px; }
.offer p { color: var(--muted); font-size: 15.5px; }
.offer ul { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 8px; }
.offer li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 15px; }
.offer li::before { content: ""; width: 8px; height: 8px; margin-top: 8px; border-radius: 2px; background: var(--mint); transform: rotate(45deg); }

@media (max-width: 980px) {
  .benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .uc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .it-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .benefit-grid, .uc-grid, .offers { grid-template-columns: minmax(0, 1fr); }
  .fleet-row { grid-template-columns: 1.2fr .6fr .9fr; }
  .fleet-row > span:nth-child(2) { display: none; }
  .spec li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

/* ===== v0.2 additions ===== */
.lang a { color: var(--hero-muted); font-family: var(--font-label); font-weight: 600; font-size: 14px; padding: 6px 11px; text-decoration: none; }
.lang a[aria-current="true"] { background: var(--hero-panel); color: var(--hero-fg); }
.lang a:hover { color: var(--hero-fg); }
.eyebrow .new { font-style: normal; margin-left: 8px; vertical-align: 1px; }
.legal a, .legal button { color: var(--muted); }

/* digital twin console */
.twin { margin-top: 14px; display: grid; gap: 12px; }
.kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.kpis div { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--hero-line); border-radius: 12px; background: rgba(255,255,255,.04); }
.kpis small { font-family: var(--font-label); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); }
.kpis b { font-family: var(--font-label); font-weight: 700; font-size: 26px; color: var(--hero-fg); font-variant-numeric: tabular-nums; line-height: 1.1; }
.kpis span { font-size: 12.5px; color: var(--hero-muted); }
.kpis .up { color: var(--mint); }
.chain { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.chain span { padding: 6px 10px; border: 1px solid var(--hero-line); border-radius: 8px; font-size: 13px; color: var(--hero-muted); }
.chain span.hot { border-color: #FFD27A; color: #FFD27A; }
.chain i { flex: 1 1 10px; min-width: 10px; height: 1.5px; background: var(--hero-line); }

/* chat mock */
.chat .msg { margin-top: 12px; padding: 12px 14px; border-radius: 12px; font-size: 14.5px; line-height: 1.5; }
.chat .msg.me { background: var(--violet); color: #FFFFFF; margin-left: 15%; }
.chat .msg.bot { background: rgba(255,255,255,.05); border: 1px solid var(--hero-line); color: var(--hero-fg); margin-right: 6%; display: grid; gap: 10px; }
.chat .msg.bot small { color: var(--mint); font-size: 12.5px; }
.bars { display: grid; gap: 6px; }
.bars i { display: block; height: 10px; width: var(--w); border-radius: 5px; background: var(--hero-line); }
.bars i.sim { background: var(--mint); }

/* mapping table mock */
.mapping { margin-top: 14px; border: 1px solid var(--hero-line); border-radius: 12px; overflow: hidden; }
.map-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 11px 14px; border-top: 1px solid var(--hero-line); font-size: 13.5px; color: var(--hero-fg); }
.map-row:first-child { border-top: 0; }
.map-row.head { font-family: var(--font-label); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); background: rgba(255,255,255,.04); }
.map-row span:first-child { font-family: var(--font-label); letter-spacing: .02em; }
.map-row.warn span:last-child { color: #FFD27A; }

/* pipelines */
.pipeline { display: grid; grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr); align-items: stretch; margin-bottom: 36px; }
.pipeline.three { grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr); }
.pnode { display: grid; gap: 6px; align-content: start; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.pnode b { font-size: 16px; }
.pnode span { color: var(--muted); font-size: 14px; }
.pnode.hot { background: var(--hero-bg); border-color: var(--hero-bg); color: var(--hero-fg); }
.pnode.hot span { color: var(--hero-muted); }
.parrow { display: grid; place-items: center; color: var(--violet-text); font-size: 18px; }
.benefit-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.note-box { display: grid; gap: 4px; margin-top: 24px; padding: 18px 20px; border-radius: var(--radius); background: var(--chip); }
.note-box span { color: var(--muted); font-size: 15px; }

/* genesis */
.genesis-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.gstep { display: grid; gap: 8px; align-content: start; padding: 22px; border-top: 2px solid var(--violet); }
.gstep h3 { font-size: 17px; }
.gstep p { color: var(--muted); font-size: 14.5px; }
.gen-stats { display: flex; flex-wrap: wrap; gap: 18px 48px; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line); }
.gen-stats div { display: grid; max-width: 320px; }
.gen-stats b { font-family: var(--font-label); font-weight: 700; font-size: 32px; color: var(--violet-text); line-height: 1.1; }
.gen-stats span { font-size: 14px; color: var(--muted); }
.genesis.flat { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
.gen-item.current { border-color: var(--violet); box-shadow: inset 3px 0 0 var(--violet); }

/* platform */
.platform-hero { position: relative; z-index: 1; padding-block: 40px 80px; }
.platform-hero h1 { max-width: 20ch; }
.layers { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; margin-top: 44px; align-items: stretch; }
.lcol { display: grid; gap: 8px; align-content: start; }
.lcol .label { color: var(--hero-muted); font-size: 13px; margin-bottom: 4px; }
.lchip { padding: 10px 14px; border: 1px solid var(--hero-line); border-radius: 10px; font-size: 14px; color: var(--hero-fg); background: rgba(255,255,255,.03); }
.lcore { display: grid; gap: 10px; align-content: start; padding: 22px; border: 1.5px solid var(--mint); border-radius: 16px; background: rgba(127,226,191,.07); }
.lcore .label { color: var(--mint); font-size: 13px; }
.lcore b { font-size: 19px; }
.lcore ol { margin: 6px 0 0; padding: 0; list-style: none; counter-reset: c; display: grid; gap: 8px; }
.lcore li { counter-increment: c; display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; background: var(--hero-panel); font-weight: 600; font-size: 15px; }
.lcore li::before { content: counter(c); font-family: var(--font-label); color: var(--mint); font-weight: 700; }
.beforeafter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.beforeafter > div { padding: 28px; border: 1px solid var(--line); border-radius: 18px; }
.beforeafter .after { background: var(--chip); border-color: transparent; }
.beforeafter .label { color: var(--muted); font-size: 13px; }
.beforeafter .after .label { color: var(--violet-text); }
.beforeafter ul { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.beforeafter li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 15.5px; }
.beforeafter li::before { content: "–"; color: var(--muted); }
.beforeafter .after li::before { content: ""; width: 8px; height: 8px; margin-top: 8px; border-radius: 2px; background: var(--mint); transform: rotate(45deg); }
.cycle { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.cstep { display: grid; gap: 8px; align-content: start; padding: 22px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.cstep h3 { font-size: 18px; }
.cstep p { color: var(--muted); font-size: 14.5px; }
.it-band .shot img { border-color: var(--hero-line); }
.offer ul a { color: var(--violet-text); font-weight: 600; text-decoration: none; }

/* customers */
.big-facts { font-size: 20px; }
.jump { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 28px; padding-bottom: 4px; }
.jump a { padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; font-size: 14px; font-weight: 500; color: var(--fg); }
.jump a:hover { border-color: var(--violet); color: var(--violet-text); }
.story-section { scroll-margin-top: 80px; }
.story-section .case-main p { color: var(--muted); font-size: 15.5px; margin-top: 8px; max-width: 64ch; }
.story-section .go { display: inline-block; margin-top: 18px; font-weight: 600; color: var(--violet-text); text-decoration: none; }
.stories.more { margin-top: 28px; }
.stories.more .story { grid-template-rows: none; gap: 10px; }
.stories.more h3 { font-size: 19px; }
.stories.more p { color: var(--muted); font-size: 15px; }
.stories .story[id] { scroll-margin-top: 80px; }

/* company */
.team { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.person { display: grid; gap: 4px; align-content: start; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); text-decoration: none; color: var(--fg); transition: border-color .2s; }
.person:hover { border-color: var(--violet); }
.avatar { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 10px; background: var(--hero-bg); color: var(--mint); font-family: var(--font-label); font-weight: 700; font-size: 19px; }
.person b { font-size: 16px; }
.person .role { font-family: var(--font-label); font-weight: 700; color: var(--violet-text); letter-spacing: .06em; }
.person span { font-size: 14px; color: var(--muted); }
.person .li { margin-top: 8px; color: var(--violet-text); font-weight: 600; }
.partner-row.wide { flex: none; }

/* contact page */
.contact-page h1 { font-size: clamp(30px, 4vw, 44px); line-height: 1.12; margin-top: 14px; }
.contact-page .cta-grid { padding-block: 40px 88px; }
.coords { display: grid; grid-template-columns: 110px 1fr; gap: 10px 16px; margin-top: 28px; font-size: 15px; }
.coords dt { font-family: var(--font-label); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: 13px; color: var(--mint); padding-top: 2px; }
.coords dd { margin: 0; color: var(--hero-fg); }
.coords a { color: var(--hero-fg); }

@media (max-width: 980px) {
  .pipeline, .pipeline.three { grid-template-columns: minmax(0, 1fr); }
  .parrow { transform: rotate(90deg); height: 30px; }
  .genesis-steps, .benefit-grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .genesis.flat { grid-template-columns: minmax(0, 1fr); }
  .layers { grid-template-columns: minmax(0, 1fr); }
  .cycle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .genesis-steps, .benefit-grid.three, .cycle, .beforeafter { grid-template-columns: minmax(0, 1fr); }
  .team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpis b { font-size: 21px; }
  .map-row { font-size: 12.5px; }
  .coords { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .coords dd { margin-bottom: 10px; }
}
/* path list on light sections */
.section .path li { border-color: var(--line); }
.section .path b { color: var(--fg); }
.section .path span { color: var(--muted); }
.section .path .n { color: var(--violet-text); }

/* v0.3 */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 8px; background: var(--violet); color: #fff; font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; }
.knock { fill: var(--logo-knock); }
.bars i.w86 { width: 86%; } .bars i.w81 { width: 81%; }
.foot .foot-h { max-width: none; }
.intents { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.intent { display: grid; gap: 8px; align-content: start; padding: 20px 18px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); }
.intent b { font-size: 16px; }
.intent span { color: var(--muted); font-size: 14.5px; font-style: italic; }
.more-link { margin-top: 26px; }
.more-link a, .go-link { font-weight: 600; color: var(--violet-text); text-decoration: none; }
.more-link a:hover, .go-link:hover { text-decoration: underline; }
.genesis-note { margin-top: -40px; padding-bottom: 40px; }
@media (max-width: 980px) { .intents { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .intents { grid-template-columns: minmax(0, 1fr); } }
.uc-sub { margin: 48px 0 18px; font-size: 20px; }
.uc-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.uc-grid.four .prob { padding: 22px; }
.uc-grid.four .prob h3 { font-size: 18px; }
.uc-grid.four .prob p { font-size: 14.5px; }
@media (max-width: 980px) { .uc-grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .uc-grid.four { grid-template-columns: minmax(0, 1fr); } }