/* ===========================================================================
   Auteur Intelligence — v4: built ON the algernonagent.ai template DNA
   (owner directive 2026-08-29: "go back to the algernonagent.ai template and
   build from there"). Tokens, type, and layout lifted from the live
   reference stylesheet and adapted: paper #fffaf0 · ink #171421 · six
   accents · Georgia serif display · Inter body · full-width shallow
   sections · white tab-panels · left-aligned headings.
   =========================================================================== */

:root {
  --paper: #fffaf0;
  --surface: #ffffff;
  --surface-strong: #211b2f;
  --ink: #171421;
  --ink-soft: #332e42;
  --muted: #6c6479;
  --line: #ded3c2;
  --line-dark: rgba(255,255,255,.18);
  --teal: #0d7c77;
  --coral: #d85d4a;
  --cta: #9B1A2A;
  --gold: #c98b21;
  --cobalt: #3357c8;
  --leaf: #4b7b45;
  --rose: #b84676;
  --amber: #C99A4B;
  --page-accent: #C99A4B;
  --shadow: 0 22px 54px rgba(35,28,45,.14);
  --shadow-dark: 0 24px 60px rgba(9,6,18,.3);
  --serif: Georgia, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --pad-x: clamp(18px, 3vw, 48px);
  --ease: cubic-bezier(.22, .8, .3, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; background: var(--paper); }
body { margin: 0; background: transparent; color: var(--ink); font: 400 16px/1.6 var(--sans); -webkit-font-smoothing: antialiased; position: relative; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; background-image: url('/media/lineage/paper-blueprint.jpg'); background-size: 1100px auto; background-repeat: repeat; opacity: .07; pointer-events: none; }
img { max-width: 100%; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -200vw; top: 0; background: var(--ink); color: var(--paper); padding: 10px 14px; z-index: 99; }
.skip-link:focus { left: 0; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; border-radius: 4px; }
::selection { background: #C99A4B55; }

/* ---------- header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px var(--pad-x); background: rgba(255,250,240,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 10px; font: 700 1.2rem var(--serif); color: var(--ink); text-decoration: none; white-space: nowrap; letter-spacing: -.01em; }
.brand-logo { flex: none; filter: drop-shadow(0 0 6px rgba(201,154,75,.45)); }
.brand-word { line-height: 1; }
.brand-script, .brand-i { font-family: "IBM Plex Mono", ui-monospace, monospace; font-weight: 700; font-size: 1.5em; line-height: 0; color: var(--gold); margin-right: 1px; letter-spacing: -.04em; text-shadow: 0 0 9px rgba(201,154,75,.5); }


.footer-brand a { display: inline-flex; align-items: center; gap: 10px; }
.site-footer .brand-script { color: var(--gold); }

/* Primary navigation: intent categories with mega-menus and dropdowns. The
   markup comes from site/auteurintelligence/nav.yaml through base.html, so the
   header, the mobile drawer and the footer can never drift apart again. */
.site-nav { display: flex; align-items: center; }
.nav-list { display: flex; align-items: center; gap: clamp(6px, 1.3vw, 18px); list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.nav-item { position: relative; }
.nav-link { display: inline-flex; align-items: center; gap: 5px; color: var(--ink-soft); text-decoration: none; font: 700 .92rem var(--sans); padding: 6px 2px; background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; transition: color .15s, border-color .15s; }
.nav-link:hover { color: var(--ink); border-bottom-color: var(--teal); }
.nav-trigger[aria-expanded="true"] { color: var(--ink); border-bottom-color: var(--teal); }
.nav-caret { flex: none; transition: transform .15s var(--ease); }
.nav-trigger[aria-expanded="true"] .nav-caret { transform: rotate(180deg); }
.nav-cta { color: #fff; background: var(--cta); padding: 10px 16px; border-radius: 8px; border-bottom: none; font-weight: 800; text-decoration: none; font-size: .92rem; transition: transform .15s var(--ease), box-shadow .15s; }
.nav-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(155,26,42,.35); color: #fff; }

.nav-panel[hidden] { display: none; }
.nav-panel-inner { display: grid; gap: 4px 28px; }
.nav-group-title { font: 800 .68rem var(--sans); text-transform: uppercase; letter-spacing: .09em; color: var(--muted); margin: 0 0 6px; }
.nav-group-list { list-style: none; margin: 0; padding: 0; }
.nav-entry { display: block; padding: 7px 8px; margin: 0 -8px; border-radius: 8px; text-decoration: none; color: var(--ink); border-bottom: 0; transition: background .12s; }
.nav-entry:hover { background: color-mix(in srgb, var(--teal) 9%, transparent); color: var(--ink); }
.nav-entry-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; }
.nav-entry-label { font: 700 .92rem var(--sans); }
.nav-entry-desc { display: block; font-size: .8rem; color: var(--muted); line-height: 1.4; margin-top: 1px; }
.nav-entry.is-featured .nav-entry-label { color: var(--cta); }
.nav-entry[aria-current="page"] { background: color-mix(in srgb, var(--teal) 12%, transparent); }
.nav-entry[aria-current="page"] .nav-entry-label { color: var(--teal); }
.nav-link[aria-current="page"] { color: var(--ink); border-bottom-color: var(--teal); }
.nav-chip { font: 700 .58rem var(--mono); text-transform: uppercase; letter-spacing: .07em; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
.nav-panel-foot { margin: 10px 0 0; grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 10px; }
.nav-panel-foot a { font: 700 .84rem var(--sans); color: var(--teal); text-decoration: none; }
.nav-panel-foot a:hover { text-decoration: underline; }

@media (min-width: 881px) {
  .nav-panel { position: absolute; top: calc(100% + 12px); z-index: 60; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 26px 64px rgba(20, 12, 8, .2); }
  /* Bridge the gap between trigger and panel so the pointer never drops it. */
  .nav-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
  .nav-panel-inner { padding: 20px 22px; }
  .nav-item-mega { position: static; }
  .nav-panel-mega { left: var(--pad-x); right: var(--pad-x); grid-template-columns: none; }
  .nav-panel-mega .nav-panel-inner { grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.5rem), 1fr)); }
  .nav-panel-mega .nav-group.is-wide { grid-column: span 2; }
  .nav-panel-mega .nav-group.is-wide .nav-group-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
  .nav-panel-dropdown { left: 0; min-width: 17rem; }
  .nav-panel-dropdown.flip-right { left: auto; right: 0; }
  .nav-panel-dropdown .nav-panel-inner { grid-template-columns: 1fr; }
  .nav-panel-dropdown .nav-group + .nav-group { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
}

.page-subnav { position: sticky; top: 57px; z-index: 40; display: flex; gap: 2px; overflow-x: auto; padding: 0 var(--pad-x); background: rgba(255,250,240,.95); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); scrollbar-width: none; }
.page-subnav::-webkit-scrollbar { display: none; }
.page-subnav a { flex: none; color: var(--muted); text-decoration: none; font-size: .84rem; font-weight: 700; padding: 12px 12px; border-bottom: 2px solid transparent; }
.page-subnav a:hover, .page-subnav a.active { color: var(--ink); border-bottom-color: var(--page-accent); }

/* ---------- hero: reference hero-home (82vh, copy left, console right) ---------- */
.page-hero { position: relative; overflow: hidden; background: var(--surface-strong); }
.page-hero .imagery-slot.t-hero { position: absolute !important; inset: 0; min-height: 0; border: none; margin: 0; border-radius: 0; }
.page-hero .imagery-slot.t-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.page-hero .imagery-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,10,20,.42), rgba(15,10,20,.16) 35%, rgba(15,10,20,.78) 92%); }
.home-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(340px,520px); gap: 28px; align-items: end; min-height: 82vh; padding: 84px var(--pad-x) 40px; }
.hero-copy { position: relative; z-index: 1; max-width: 760px; color: #fffaf0; }
.hero-copy h1 { font: 700 clamp(2.4rem, 4.6vw, 3.9rem)/1.08 var(--serif); letter-spacing: -.015em; margin: 0 0 16px; max-width: 20ch; text-wrap: balance; color: #fffaf0; text-shadow: 0 2px 26px rgba(9,6,18,.75); }
.hero-copy p { max-width: 60ch; color: rgba(255,250,240,.9); font-size: 1.06rem; text-shadow: 0 1px 14px rgba(9,6,18,.7); }
.hero-copy a:not(.cta) { color: #fffaf0; }
.hero-copy .cta { margin-top: 20px; }
.hero-console { position: relative; z-index: 1; align-self: end; }
.product-page-hero, .quiet-hero, .schematic-hero { display: block; min-height: 0; }
.product-page-hero .imagery-slot.t-hero, .quiet-hero .imagery-slot.t-hero { position: relative !important; }
.product-page-hero .imagery-slot.t-hero { min-height: clamp(300px, 48vh, 520px); }
.quiet-hero .imagery-slot.t-hero { min-height: clamp(180px, 30vh, 300px); }
.hero-title { position: absolute; inset: auto 0 0 0; z-index: 2; padding: 0 var(--pad-x) 34px; color: #fffaf0; }
.hero-name { font: 700 clamp(2.2rem, 4.4vw, 3.6rem)/1.05 var(--serif); margin: 0; color: #fffaf0; text-shadow: 0 2px 26px rgba(9,6,18,.75); }
.hero-title .eyebrow { color: #ffe9c4; }
@media (max-width: 900px) { .home-hero { grid-template-columns: 1fr; min-height: 70vh; } .hero-console { display: none; } }

/* ---------- sections: full-width, shallow, left-aligned ---------- */
.band, .registry-section, .showcase, .section-tour, .engine-pillars { padding: clamp(40px, 7vh, 76px) var(--pad-x); }
.band + .band { padding-top: 0; }
.section-inner { max-width: none; }
.eyebrow { color: #9a6d24; font-size: .78rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; margin: 0 0 12px; font-family: var(--sans); }
.eyebrow::before { content: "◆ "; color: var(--amber); font-size: .72em; vertical-align: 1px; }
.band h2, .registry-section h2, .showcase h2, .statement-grid-title {
  font: 700 clamp(1.7rem, 3vw, 2.5rem)/1.15 var(--serif); letter-spacing: -.012em;
  margin: 0 0 12px; max-width: 51.25rem; text-wrap: balance; color: var(--ink);
}
.section-lede, .band > p { color: var(--ink-soft); max-width: 45rem; margin: 0 0 10px; }
.band > * { max-width: 820px; margin-left: 0; margin-right: 0; }
.band h3 { font: 700 1.1rem var(--sans); margin: 22px 0 8px; }
.band li { color: var(--ink-soft); margin: 6px 0; }
.band li::marker { color: var(--page-accent); }
.band a { color: var(--ink); text-decoration-color: var(--teal); text-underline-offset: 3px; }
.band blockquote { border-left: 3px solid var(--gold); margin: 20px 0; padding: 4px 0 4px 16px; font-style: italic; color: var(--ink); font-family: var(--serif); }
.band-lead { padding-bottom: 10px; }
.has-hero-title .band-lead h1 { display: none; }
.band-lead h1 { font: 700 clamp(1.9rem, 3.4vw, 2.8rem)/1.12 var(--serif); letter-spacing: -.012em; margin: 0 0 14px; max-width: 20ch; }
.band-lead p { max-width: 66ch; font-size: 1.05rem; color: var(--ink-soft); }

/* ---------- CTA + chips ---------- */
.cta { display: inline-flex; align-items: center; gap: 8px; background: var(--cta); color: #fff !important; font: 800 .95rem var(--sans); text-decoration: none !important; padding: 12px 22px; border-radius: 4px; box-shadow: inset 0 -2px 0 rgba(0,0,0,.22), 0 1px 2px rgba(35,28,45,.15); transition: transform .15s var(--ease), box-shadow .15s; }
.cta:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(155,26,42,.35); }
.cta.is-disabled { opacity: .55; cursor: not-allowed; }
.cta-note { display: block; margin-top: 8px; font-size: .74rem; color: var(--muted); }
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.status-chip { display: inline-flex; align-items: center; gap: 7px; font: 600 .72rem var(--sans); border: 1px solid var(--line); border-radius: 999px; padding: 5px 11px; background: #f4ecdd; color: var(--ink-soft); }
.chip-axis { color: var(--muted); font-size: .66rem; text-transform: uppercase; letter-spacing: .03em; }
.chip-value { color: var(--ink-soft); font-weight: 700; }

/* ---------- pills (reference tab-button) ---------- */
.showcase-tabs, .tour-pills, .subtour-pills { display: flex; flex-wrap: wrap; gap: 8px; padding: 2px 0 14px; margin: 18px 0 0; }
.showcase-tab { background: #fff; border: 1px solid var(--line); border-radius: 4px; box-shadow: inset 0 -1px 0 rgba(35,28,45,.08), 0 1px 2px rgba(35,28,45,.06); color: var(--ink-soft); cursor: pointer; flex: 0 0 auto; font: 900 .92rem var(--sans); min-height: 44px; padding: 10px 14px; transition: background .15s, color .15s, border-color .15s; }
.showcase-tab:hover { border-color: var(--ink-soft); color: var(--ink); }
/* A pill longer than the phone is still a pill: let it wrap rather than
   push the whole page sideways. */
.showcase-tab { max-width: 100%; text-align: left; }
@media (max-width: 700px) { .showcase-tab { flex: 0 1 auto; } }
.showcase-tab[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: #fffaf0; }

/* ---------- panels (reference tab-panel: white, wide, 520 min) ---------- */
.showcase-panel, .tour-panel {
  background: #fffdf8; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 24px; padding: 18px; min-height: 520px; align-items: stretch;
}
.showcase-panel[hidden], .tour-panel[hidden] { display: none; }
.tour-panel.has-subtour { grid-template-columns: 1fr; min-height: 0; }
.showcase-copy, .tour-copy { align-content: center; display: grid; gap: 4px; padding: 24px 6px 24px 24px; }
.panel-kicker, .showcase-copy .eyebrow { color: var(--panel-accent, #9a6d24); font-size: .82rem; font-weight: 900; text-transform: uppercase; margin: 0 0 12px; }
.showcase-copy h3 { margin: 0 0 10px; font: 700 1.6rem var(--sans); letter-spacing: -.01em; color: var(--ink); }
.showcase-copy p { margin: 0 0 14px; color: var(--ink-soft); font-size: .98rem; max-width: 56ch; }
.showcase-copy a { color: var(--ink); font-weight: 800; font-size: .9rem; }
.tour-copy section { padding: 0; }
.tour-copy section > * { max-width: 58ch; }
.tour-copy h2 { font: 700 1.5rem var(--sans); letter-spacing: -.01em; max-width: none; margin: 0 0 10px; }
.tour-copy .panel-lede { color: var(--ink-soft); }
.panel-more { margin-top: 14px; max-width: 58ch; }
.panel-more summary { cursor: pointer; list-style: none; font: 800 .88rem var(--sans); color: var(--teal); }
.panel-more summary::-webkit-details-marker { display: none; }
.panel-more summary::after { content: " ↓"; }
.panel-more[open] summary::after { content: " ↑"; }
.panel-more > *:not(summary) { font-size: .95rem; }
/* In-place tour stepper: advance from the foot of the panel you just read. */
.panel-nav { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--line); }
.panel-step { background: #fff; border: 1px solid var(--line); border-radius: 6px; color: var(--ink-soft); cursor: pointer; font: 800 .86rem var(--sans); min-height: 44px; padding: 10px 15px; transition: border-color .15s, color .15s; }
.panel-step:hover:not(:disabled) { border-color: var(--ink-soft); color: var(--ink); }
.panel-step:disabled { opacity: .35; cursor: default; }
.panel-step-count { font: 500 .74rem var(--mono); letter-spacing: .06em; color: var(--muted); }
.tour-copy > .panel-nav, .showcase-copy > .panel-nav { margin-right: 18px; }
.tour-panel > .panel-nav, .showcase-panel > .panel-nav { margin: 0 24px 20px; }
.subtour-panel > .panel-nav { margin: 4px 0 0; }
.tour-panel:focus-visible, .subtour-panel:focus-visible, .showcase-panel:focus-visible { outline: 2px solid var(--amber); outline-offset: 4px; }
@media (max-width: 700px) { .tour-panel > .panel-nav, .showcase-panel > .panel-nav { margin: 0 14px 16px; } }
.showcase-visual, .tour-visual { position: relative; border-radius: 8px; overflow: hidden; background: var(--surface-strong); border: 1px solid var(--line); min-height: 300px; display: grid; align-content: center; }
.showcase-visual img, .tour-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; position: absolute; inset: 0; }
.showcase-visual.is-window, .tour-visual.is-window { background: #f7f0e2; padding: 22px; align-content: center; }
.showcase-visual.is-window img { display: none; }
.showcase-visual.is-window .app-window, .tour-visual .app-window { position: relative; width: 100%; max-width: 560px; margin: 0 auto; }
.subtour-panel { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 24px; background: #faf5ea; border: 1px solid var(--line); border-radius: 8px; padding: 22px; min-height: 320px; align-items: center; }
.subtour-panel[hidden] { display: none; }
.subtour-copy h3 { margin: 0 0 8px; font: 700 1.3rem var(--sans); }
.subtour-copy p { margin: 0; color: var(--ink-soft); font-size: .95rem; max-width: 52ch; }
@media (max-width: 900px) { .showcase-panel, .tour-panel, .subtour-panel { grid-template-columns: 1fr; min-height: 0; } .showcase-copy, .tour-copy { padding: 14px; } }

/* ---------- app-window console (reference hero-console energy) ---------- */
.app-window { --win-accent: var(--gold); background: rgba(20,15,31,.92); border: 1px solid var(--line-dark); border-radius: 8px; overflow: hidden; box-shadow: var(--shadow-dark); color: #fffaf0; font-family: var(--mono); }
.app-bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.app-dot { width: 9px; height: 9px; border-radius: 50%; }
.app-dot:first-child { background: #e0655a; } .app-dot:nth-child(2) { background: #e0b054; } .app-dot:nth-child(3) { background: #6fbf73; }
.app-title { margin-left: 8px; font-size: .74rem; color: rgba(255,250,240,.8); }
.app-rows { list-style: none; margin: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.app-rows li { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.05); border-radius: 6px; padding: 11px 12px; font-size: .8rem; }
.row-num { color: var(--win-accent); font-size: .68rem; }
.row-label { flex: 1; }
.row-bar { height: 3px; border-radius: 2px; background: linear-gradient(90deg, var(--win-accent), transparent); }
.app-strip { display: flex; gap: 8px; padding: 10px 14px 14px; }
.app-strip span { height: 4px; flex: 1; border-radius: 2px; }
.app-strip span:nth-child(1) { background: linear-gradient(90deg, var(--cobalt), #6a9be0); }
.app-strip span:nth-child(2) { background: linear-gradient(90deg, var(--gold), var(--coral)); }
.app-strip span:nth-child(3) { background: linear-gradient(90deg, var(--rose), var(--teal)); }

/* ---------- statement grid (proof-style boxes; click = expand) ---------- */
.statement-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-top: 20px; }
.statement-box { text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; cursor: pointer; font: inherit; box-shadow: 0 1px 2px rgba(35,28,45,.06); transition: transform .15s var(--ease), box-shadow .15s, border-color .15s; }
.statement-box:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.statement-box[aria-expanded="true"] { border-color: var(--ink); }
.statement-box h3 { margin: 0 0 6px; font: 800 1.02rem var(--sans); color: var(--ink); }
.statement-box p { margin: 0; color: var(--muted); font-size: .88rem; }
.statement-detail { grid-column: 1 / -1; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); padding: 26px 28px; }
.statement-detail[hidden] { display: none; }
.statement-detail > section > * { max-width: 68ch; }

/* ---------- pillars ---------- */
.pillar-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-top: 16px; }
.pillar { display: block; text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(35,28,45,.06); transition: transform .15s var(--ease), box-shadow .15s; }
.pillar:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.pillar-glyph { color: var(--gold); font-family: var(--mono); }
.pillar h2, .pillar h3 { margin: 6px 0 4px; font: 800 1.02rem var(--sans); color: var(--ink); }
.pillar p { margin: 0; color: var(--muted); font-size: .87rem; }
.pillar .pillar-more { display: inline-block; margin-top: 8px; font: 800 .78rem var(--sans); color: var(--teal); }

/* ---------- registry cards ---------- */
.registry-grid { display: grid; gap: 14px; }
.product-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.harness-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.product-card { --card-accent: var(--gold); position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--card-accent); border-radius: 8px; overflow: hidden; box-shadow: 0 1px 2px rgba(35,28,45,.06); transition: transform .18s var(--ease), box-shadow .18s; }
.product-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.card-poster { position: relative; aspect-ratio: 5 / 2.1; overflow: hidden; background: var(--surface-strong); }
.card-poster img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 16%; transition: transform .4s var(--ease); }
.product-card:hover .card-poster img { transform: scale(1.04); }
.card-poster-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 75%, rgba(19,17,20,.4)); }
.card-body { padding: 14px 16px 15px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.card-head h3 { margin: 0; font: 800 1.05rem var(--sans); }
.card-link { color: var(--ink); text-decoration: none; }
.card-link::after { content: ""; position: absolute; inset: 0; }
.card-arrow { color: var(--card-accent); font-family: var(--mono); }
.card-outcome { margin: 0; color: var(--muted); font-size: .87rem; flex: 1; }
.harness-card { position: relative; padding: 15px 16px; background: #fff; border: 1px solid var(--line); border-radius: 8px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 1px 2px rgba(35,28,45,.06); transition: transform .18s var(--ease), box-shadow .18s; }
.harness-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.harness-card .card-head h3 { font-size: .98rem; }

/* ---------- colophon / related / tables / FAQ ---------- */
.status-colophon { padding: 22px var(--pad-x) 28px; border-top: 1px solid var(--line); }
.status-colophon .section-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.colophon-label { font: 800 .68rem var(--sans); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.status-note { margin: 0; color: var(--muted); font-size: .8rem; max-width: 62ch; }
.status-link { color: var(--ink-soft); }
.product-cta-row { padding: 22px var(--pad-x) 0; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.related-row { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0; }
.related-row a { display: inline-block; padding: 9px 15px; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-decoration: none; color: var(--ink-soft); font: 800 .86rem var(--sans); transition: border-color .15s, transform .15s; }
.related-row a:hover { border-color: var(--ink-soft); transform: translateY(-1px); }
.table-scroll { overflow-x: auto; max-width: 100%; margin: 20px 0; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
table { border-collapse: collapse; width: 100%; min-width: 640px; font-size: .9rem; }
table.stackable { min-width: 0; table-layout: fixed; }
table.stackable td, table.stackable th { vertical-align: top; overflow-wrap: anywhere; }
th { font: 800 .72rem var(--sans); text-transform: uppercase; letter-spacing: .04em; color: var(--teal); text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--line); }
td { padding: 11px 16px; border-bottom: 1px solid #ded3c266; color: var(--ink-soft); vertical-align: top; }
tr:hover td { background: #faf5ea; }
.faq-list { margin: 16px 0 0; max-width: 760px; }
.faq-list details { border: 1px solid var(--line); background: #fff; margin-bottom: 8px; border-radius: 8px; }
.faq-list details[open] { border-color: var(--ink-soft); }
.faq-list summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 14px 18px; font: 800 .98rem var(--sans); color: var(--ink); }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; color: var(--teal); font-size: 1.2rem; }
.faq-list details[open] summary::after { content: "–"; }
.faq-list details > *:not(summary) { padding: 0 18px; }
.faq-list details > p:last-child, .faq-list details > ul:last-child { padding-bottom: 14px; }

/* ---------- imagery slots (non-hero) ---------- */
.imagery-slot { position: relative; min-height: 200px; margin: 0; overflow: hidden; border-radius: 8px; border: 1px solid var(--line); background: var(--surface-strong); }
.imagery-slot img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; }
.imagery-slot .imagery-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(19,17,20,.45)); }
.imagery-placeholder { position: absolute; inset: 12%; display: grid; place-items: center; border: 1px dashed var(--line-dark); }
.placeholder-mark { font: 500 .7rem var(--mono); letter-spacing: .3em; color: rgba(255,250,240,.6); }
.imagery-slot:not(.has-image) figcaption { position: absolute; bottom: 12px; left: 14px; font: 500 .68rem var(--mono); color: rgba(255,250,240,.6); }

/* ---------- footer (dark bookend) ---------- */
.site-footer { background: var(--surface-strong); color: #fffaf0; margin-top: 40px; }
.footer-inner { padding: 44px var(--pad-x) 50px; display: grid; grid-template-columns: 1.7fr repeat(5, minmax(0, 1fr)); gap: 30px 26px; }
.footer-col-brand { grid-column: span 1; }
.footer-mail { display: inline-block; color: var(--gold); font-size: .88rem; margin-top: 10px; }
@media (max-width: 1180px) { .footer-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); } .footer-col-brand { grid-column: 1 / -1; } }
@media (max-width: 800px) { .footer-inner { grid-template-columns: 1fr 1fr; } }
.footer-brand a { font: 700 1.15rem var(--serif); color: #fffaf0; text-decoration: none; }
.footer-line { color: rgba(255,250,240,.55); font-size: .88rem; margin: 6px 0 0; }
.footer-thesis { color: var(--gold); font-style: italic; font-family: var(--serif); }
.footer-head { font: 800 .7rem var(--sans); text-transform: uppercase; letter-spacing: .08em; color: rgba(255,250,240,.5); margin: 0 0 8px; }
.footer-col a { display: block; color: rgba(255,250,240,.8); text-decoration: none; font-size: .9rem; padding: 3px 0; }
.footer-col a:hover { color: #fffaf0; }

/* ---------- persistent product strip (Resolve pattern) ---------- */
.product-strip { position: sticky; top: 57px; z-index: 45; display: flex; gap: 2px; overflow-x: auto; padding: 0 var(--pad-x); background: #f1e9d8; border-bottom: 1px solid var(--line); scrollbar-width: none; }
.product-strip::-webkit-scrollbar { display: none; }
.product-strip a { flex: none; color: var(--ink-soft); text-decoration: none; font-size: .85rem; font-weight: 700; padding: 10px 11px; border-bottom: 2px solid transparent; transition: color .15s, border-color .15s; }
.product-strip a:hover { color: var(--ink); }
.product-strip a.active { color: var(--cta); border-bottom-color: var(--cta); }
.product-strip .strip-all { margin-left: auto; color: var(--muted); }
.page-subnav { top: 96px; }

/* ---------- hero crop: keep the image's baked type out of frame ---------- */
.home-hero .imagery-slot.t-hero img { object-position: 50% 78%; }

/* ---------- feature sub-pills + metric charts ---------- */
.feature-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.feature-pills button { background: #faf5ea; border: 1px solid var(--line); border-radius: 4px; box-shadow: inset 0 -1px 0 rgba(35,28,45,.07); color: var(--ink-soft); cursor: pointer; font: 700 .8rem var(--sans); padding: 7px 12px; transition: background .15s, color .15s, border-color .15s; }
.feature-pills button:hover { border-color: var(--ink-soft); color: var(--ink); }
.feature-pills button[aria-selected="true"] { background: var(--panel-accent, var(--teal)); border-color: transparent; color: #fff; }
.feature-line { min-height: 1.3em; margin: 8px 0 0; color: var(--muted); font-size: .88rem; font-style: italic; }
.metric-chart { --win-accent: var(--teal); width: 100%; max-width: 520px; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 20px 22px; box-shadow: 0 10px 30px rgba(35,28,45,.12); }
.mc-title { margin: 0 0 14px; font: 800 .95rem var(--sans); color: var(--ink); }
.mc-row { display: grid; grid-template-columns: 7.5rem 1fr 3.5rem; align-items: center; gap: 10px; margin: 8px 0; }
.mc-label { font: 600 .78rem var(--sans); color: var(--ink-soft); }
.mc-track { height: 10px; background: #efe6d2; border-radius: 5px; overflow: hidden; }
.mc-bar { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, var(--win-accent), color-mix(in srgb, var(--win-accent) 55%, #fff)); }
.mc-value { font: 700 .78rem var(--mono); color: var(--ink-soft); text-align: right; }
.mc-caption { margin: 12px 0 0; font-size: .72rem; color: var(--muted); }

/* ---------- hero product links + wordmark strip ---------- */
.hero-links { position: absolute; left: 0; right: 0; bottom: 8px; z-index: 2; display: flex; flex-wrap: wrap; gap: 4px 26px; justify-content: center; padding: 10px var(--pad-x); }
.hero-links a { color: #ffe9c4; text-decoration: none; font: 500 clamp(.85rem, 1.3vw, 1.15rem) var(--serif); letter-spacing: .12em; text-shadow: 0 1px 12px rgba(9,6,18,.85); border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.hero-links a:hover { color: #fffaf0; border-bottom-color: var(--gold); }
.home-hero { padding-bottom: 64px; }
.home-hero .imagery-slot.t-hero img { object-position: 50% 58%; }
.wordmark-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; padding: 16px var(--pad-x); background: #fff; border-bottom: 1px solid var(--line); }
.wm-label { font: 800 .7rem var(--sans); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-right: 6px; }
.wordmark-strip span:not(.wm-label) { font: 700 .95rem var(--serif); color: var(--ink-soft); opacity: .85; }

/* ---------- proof metrics: stat strip + harness matrix ---------- */
.stat-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin: 22px 0 30px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
.stat-num { display: block; font: 700 2rem/1 var(--serif); color: var(--ink); font-variant-numeric: tabular-nums; }
.stat-label { display: block; margin-top: 6px; font-size: .8rem; color: var(--muted); }
.matrix-title { font: 800 1.15rem var(--sans); margin: 10px 0 12px; }
.harness-matrix th:nth-child(2), .harness-matrix th:nth-child(3),
.harness-matrix td.yes, .harness-matrix td.no { text-align: center; width: 9rem; }
.harness-matrix td.yes { color: var(--leaf); font-weight: 800; font-size: 1.05rem; }
.harness-matrix td.no { color: var(--coral); font-weight: 800; font-size: 1.05rem; }

/* ---------- motion ---------- */
.will-reveal { opacity: 0; transform: translateY(12px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
.will-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .will-reveal { opacity: 1; transform: none; transition: none; }
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- expandable matrix rows ---------- */
.harness-matrix .mx-row { cursor: pointer; }
.harness-matrix .mx-row:hover td { background: #faf5ea; }
.harness-matrix .mx-row.open td { background: #f4ecdd; }
.harness-matrix .mx-detail td { background: #fbf7ee; color: var(--ink-soft); font-size: .88rem; padding: 12px 16px 14px; border-left: 3px solid var(--gold); }

/* ---------- statement-detail with visual + convo window ---------- */
.sd-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(16px, 2.5vw, 40px); align-items: center; }
@media (max-width: 900px) { .sd-grid { grid-template-columns: 1fr; } }
.sd-visual { border-radius: 8px; overflow: hidden; }
.sd-visual img { display: block; width: 100%; height: auto; max-height: 420px; object-fit: cover; object-position: 50% 20%; border-radius: 8px; }
.sd-visual .app-window, .sd-visual .metric-chart { max-width: 520px; margin: 0 auto; }
.convo { padding: 12px 14px 4px; display: flex; flex-direction: column; gap: 8px; }
.msg { margin: 0; max-width: 85%; padding: 9px 12px; border-radius: 10px; font-size: .8rem; font-family: var(--sans); line-height: 1.45; }
.msg.user { align-self: flex-end; background: #3357c8; color: #fff; border-bottom-right-radius: 3px; }
.msg.studio { align-self: flex-start; background: rgba(255,255,255,.09); color: #fffaf0; border-bottom-left-radius: 3px; }
.phase-rows .phase-ok { color: #6fbf73; font-weight: 800; }
.convo-foot { padding: 8px 14px 14px; font-size: .7rem; color: rgba(255,250,240,.65); font-family: var(--mono); }

.byo-note { margin: 10px 0 0; font-size: .72rem; color: var(--muted); max-width: 78ch; line-height: 1.5; }

.table-go { font-weight: 800; font-size: .84rem; color: var(--teal); text-decoration: none; white-space: nowrap; }
.table-go:hover { text-decoration: underline; }

/* Hero rebalance: problem line as kicker, response as the big headline */
.hero-kicker { font: 700 clamp(1.35rem, 2.3vw, 2rem)/1.25 var(--serif); letter-spacing: .02em; color: #ffe9c4; margin: 0 0 12px; text-shadow: 0 2px 18px rgba(9,6,18,.85); }
.hero-copy h1.hero-headline { font-size: clamp(2.9rem, 5.6vw, 4.8rem); max-width: 16ch; }
.band-lead-below .cta { margin-top: 12px; }

/* ---- Visual pass 2026-08-30: image fit, per-page texture, accent pops ---- */

/* UI screenshots read whole, letterboxed on dark, never cropped */
.showcase-visual img[src*="/screens/"], .tour-visual img[src*="/screens/"] { object-fit: contain; object-position: 50% 50%; background: #17131c; }
.sd-visual img[src*="/screens/"] { object-fit: contain; background: #17131c; }
/* Photographic composites keep cover but bias to the screen area */
.showcase-visual img[src*="workstation"], .tour-visual img[src*="workstation"], .showcase-visual img[src*="-desk-"], .tour-visual img[src*="-desk-"], .sd-visual img[src*="workstation"], .sd-visual img[src*="-desk-"] { object-fit: contain; background: #0f0b14; }

/* Wallpaper: slightly stronger ground */
body::before { opacity: .09; }

/* Per-product schematic watermark, fixed and faint, coded to the page */
body::after { content: ""; position: fixed; inset: 0; z-index: -1; background-repeat: no-repeat; background-position: 96% 96%; background-size: 780px auto; opacity: 0; pointer-events: none; mix-blend-mode: multiply; -webkit-mask-image: radial-gradient(58% 58% at 82% 82%, #000 30%, transparent 78%); mask-image: radial-gradient(58% 58% at 82% 82%, #000 30%, transparent 78%); }
html[data-page-id="story"] body::after { background-image: url('/media/lineage/schema-story.jpg'); opacity: .06; }
html[data-page-id="film"] body::after { background-image: url('/media/lineage/schema-film.jpg'); opacity: .06; }
html[data-page-id="prep"] body::after { background-image: url('/media/lineage/paper-draft.jpg'); opacity: .05; }
html[data-page-id="game"] body::after { background-image: url('/media/lineage/engine-blockout.jpg'); opacity: .05; }
html[data-page-id="build"] body::after { background-image: url('/media/lineage/tex-solder.jpg'); opacity: .05; }
html[data-page-id="edit"] body::after { background-image: url('/media/lineage/tex-film.jpg'); opacity: .05; }
html[data-page-id="learning"] body::after { background-image: url('/media/lineage/paper-edge.jpg'); opacity: .05; }
html[data-page-id="launch"] body::after { background-image: url('/media/lineage/tex-ink.jpg'); opacity: .05; }
html[data-page-id="conductor"] body::after { background-image: url('/media/lineage/engine-to-screen.jpg'); opacity: .05; }

/* Accent pops, coded to the product via --page-accent */
.band h2::after, .registry-section h2::after { content: ""; display: block; width: 56px; height: 3px; margin-top: 12px; border-radius: 2px; background: var(--page-accent, var(--gold)); }
.tour-panel { border-left: 3px solid var(--page-accent, var(--gold)); }
.subnav a.active, .int-subnav a.active { color: var(--page-accent, var(--gold)); border-color: var(--page-accent, var(--gold)); }
.colophon { border-top: 3px solid var(--page-accent, var(--gold)); }


/* Hero brand registration (v7 digital lockup) */
.hero-brandmark { position: absolute; top: 34px; left: 0; right: 0; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 24px; pointer-events: none; }
.hero-brandmark::before { content: ""; position: absolute; inset: -34px 14%; background: radial-gradient(52% 110% at 50% 50%, rgba(10,7,14,.68), transparent 80%); border-radius: 999px; z-index: -1; }
.hero-brandmark svg { width: clamp(64px, 7.6vw, 108px); height: auto; filter: drop-shadow(0 0 20px rgba(255,223,158,.8)); }
.hero-brandmark .hb-word { font-family: "Italiana", "Playfair Display", var(--serif), serif; font-weight: 400; font-size: clamp(1.9rem, 4vw, 3.7rem); letter-spacing: .24em; color: #ffe9c4; text-shadow: 0 0 26px rgba(201,154,75,.95), 0 0 60px rgba(201,154,75,.5), 0 3px 26px rgba(9,6,18,.85); white-space: nowrap; }
.hero-brandmark .hb-cap { font-size: 1.45em; font-weight: 700; color: #ffdf9e; vertical-align: -.08em; text-shadow: 0 0 30px rgba(255,223,158,1), 0 0 70px rgba(201,154,75,.6), 0 3px 26px rgba(9,6,18,.85); }
@media (max-width: 720px) { .hero-brandmark { gap: 10px; } .hero-brandmark .hb-word { letter-spacing: .12em; } }
.wordmark-strip a { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--gold); }
.wordmark-strip a:hover { color: var(--gold); }


/* Aspect-locked home hero: show the whole plate whenever the window allows;
   at extreme aspect ratios cap the height and bias the crop to the focal zone. */
@media (min-width: 900px) {
  /* Full bleed always; height follows the plate's 3:2 aspect until the
     viewport cap, so the whole image shows whenever the window allows. */
  .home-hero { min-height: 0; height: min(calc(100vw / 1.5), 88vh); }
  .home-hero .imagery-slot.t-hero img { object-position: 50% 74%; }
}


/* Charts read whole inside panels */
.tour-visual img[src*="/charts/"], .showcase-visual img[src*="/charts/"], .sd-visual img[src*="/charts/"] { object-fit: contain; background: #17131c; }
/* Workshop: the instrument blueprint as a faint full-page backdrop */
html[data-page-id="platform-workshop"] body::after { background-image: url('/media/lineage/schema-story.jpg'); background-size: 1200px auto; background-position: 88% 30%; opacity: .055; }
/* Eval: faint code-rain backdrop in the same slot */
html[data-page-id="platform-eval"] body::after { background-image: url('/media/lineage/eval-matrix.jpg'); background-size: 1100px auto; background-position: 90% 24%; opacity: .05; }

/* Try-asking pull quotes — italic, accent-coded, restrained */
.ask-quote { position: relative; margin: 34px 0; padding: 18px 26px 16px 30px; border-left: 3px solid var(--page-accent, var(--gold)); background: color-mix(in srgb, var(--page-accent, var(--gold)) 5%, transparent); border-radius: 0 8px 8px 0; }
.ask-quote::before { content: "TRY ASKING"; display: block; font: 700 .68rem/1 "IBM Plex Mono", monospace; letter-spacing: .18em; color: var(--page-accent, var(--gold)); margin-bottom: 10px; }
.ask-quote p { font: italic 500 1.12rem/1.65 var(--serif); color: var(--ink-soft); margin: 0; max-width: 62ch; }
.ask-quote cite { display: block; margin-top: 10px; font: 400 .8rem/1.4 Inter, sans-serif; font-style: normal; color: var(--muted); }


/* Whole-image hero treatment: never truncate baked text */
.product-page-hero .imagery-slot.t-hero, .quiet-hero .imagery-slot.t-hero { min-height: 0; height: min(calc(100vw / 1.5), 74vh); }
.hero-backdrop { position: absolute; inset: -48px; background-size: cover; background-position: center; filter: blur(30px) brightness(.62) saturate(1.05); }
.imagery-slot.t-hero img.fit-whole { object-fit: contain !important; object-position: 50% 50% !important; }

/* Whole-image panels: blurred self-backdrop everywhere art carries baked text */
.panel-backdrop { position: absolute; inset: -32px; background-size: cover; background-position: center; filter: blur(24px) brightness(.6) saturate(1.05); }
.visual-fit { position: relative; overflow: hidden; width: 100%; height: 100%; min-height: 300px; border-radius: 8px; background: #17131c; }
.visual-fit img.fit-whole { position: absolute; inset: 0; width: 100%; height: 100%; }
img.fit-whole { object-fit: contain !important; object-position: 50% 50% !important; position: relative; z-index: 1; }
.showcase-visual img.fit-whole, .tour-visual img.fit-whole { position: absolute; }
.card-poster { position: relative; overflow: hidden; }
.card-poster img.fit-whole { position: absolute; inset: 0; width: 100%; height: 100%; }
.subtour-panel, .mx-detail, .sd-visual { position: relative; overflow: hidden; }
.tour-visual img.fit-whole, .sd-visual img.fit-whole, .subtour-panel img.fit-whole, .mx-detail img.fit-whole { position: absolute; inset: 0; width: 100%; height: 100%; }
.sd-visual img.fit-whole { position: relative; height: auto; min-height: 300px; }


/* Parchment as wallpaper: per-page etched grounds, as intended */
body::before { opacity: .11; }
html[data-page-id="story"] body::before { background-image: url('/media/tex/wall-story.jpg'); }
html[data-page-id="platform-memory"] body::before { background-image: url('/media/tex/wall-memory.jpg'); }
html[data-page-id="film"] body::before { background-image: url('/media/tex/wall-film.jpg'); }
html[data-page-id="edit"] body::before { background-image: url('/media/tex/wall-edit.jpg'); }
html[data-page-id="resolve"] body::before { background-image: url('/media/tex/wall-resolve.jpg'); }
html[data-page-id="prep"] body::before { background-image: url('/media/tex/wall-prep.jpg'); }
html[data-page-id="learning"] body::before, html[data-page-id="school"] body::before { background-image: url('/media/tex/wall-learning.jpg'); }
html[data-page-id="launch"] body::before { background-image: url('/media/tex/wall-launch.jpg'); }
html[data-page-id="game"] body::before { background-image: url('/media/tex/wall-game.jpg'); }
html[data-page-id="build"] body::before { background-image: url('/media/tex/wall-build.jpg'); }
html[data-page-id="conductor"] body::before, html[data-page-id^="integrations"] body::before { background-image: url('/media/tex/wall-conductor.jpg'); }
html[data-page-id="studio"] body::before, html[data-page-id^="solutions"] body::before { background-image: url('/media/tex/wall-studio.jpg'); }
html[data-page-id="story"] body::before, html[data-page-id="platform-memory"] body::before, html[data-page-id="film"] body::before, html[data-page-id="edit"] body::before, html[data-page-id="resolve"] body::before, html[data-page-id="prep"] body::before, html[data-page-id="learning"] body::before, html[data-page-id="school"] body::before, html[data-page-id="launch"] body::before, html[data-page-id="game"] body::before, html[data-page-id="build"] body::before, html[data-page-id="conductor"] body::before, html[data-page-id^="integrations"] body::before, html[data-page-id="studio"] body::before, html[data-page-id^="solutions"] body::before { opacity: .16; background-size: 1100px auto; }


/* Character answers: the reply half of an ask dialogue */
.ask-quote.answer-quote { border-left-color: var(--leaf, #4b7b45); background: color-mix(in srgb, #4b7b45 6%, transparent); margin-top: -14px; }
.ask-quote.answer-quote::before { content: "THE STUDIO ANSWERS"; color: #4b7b45; }
.ask-quote.answer-quote[data-voice]::before { content: attr(data-voice); }


/* Founding beta application form */
.apply-form { max-width: 720px; }
.apply-form fieldset { border: 1px solid var(--line); border-radius: 10px; padding: 18px 22px; margin: 0 0 22px; background: #fffdf8; }
.apply-form legend { font: 700 .78rem/1 "IBM Plex Mono", monospace; letter-spacing: .14em; text-transform: uppercase; color: var(--page-accent, var(--gold)); padding: 0 8px; }
.apply-form label { display: block; margin: 12px 0; font-weight: 600; color: var(--ink); font-size: .95rem; }
.apply-form input[type="text"], .apply-form input[type="email"], .apply-form textarea { display: block; width: 100%; margin-top: 6px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font: 400 1rem Inter, sans-serif; color: var(--ink); }
.apply-form input:focus, .apply-form textarea:focus { outline: 2px solid var(--page-accent, var(--gold)); outline-offset: 1px; }
.apply-form .check-row { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 8px; }
.apply-form .chk { display: inline-flex; align-items: center; gap: 7px; font-weight: 500; margin: 0; border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; background: #fff; cursor: pointer; }
.apply-form .chk:has(input:checked) { border-color: var(--page-accent, var(--gold)); background: color-mix(in srgb, var(--page-accent, var(--gold)) 8%, #fff); }
.apply-form button.cta { border: none; cursor: pointer; font: 700 1.05rem Inter, sans-serif; padding: 14px 26px; }
.apply-note { color: var(--muted); font-size: .85rem; max-width: 60ch; }


.apply-hero-cta { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 18px 0 6px; }
.apply-hero-cta .cta { font-size: 1.05rem; }


/* Ask widget */
.ask-fab-wrap { position: fixed; right: 22px; bottom: 22px; z-index: 60; font-family: Inter, sans-serif; }
.ask-fab { display: flex; align-items: center; gap: 8px; border: none; cursor: pointer; background: var(--cta, #9B1A2A); color: #fff6e8; font: 700 1rem Inter, sans-serif; padding: 12px 20px; border-radius: 999px; box-shadow: 0 6px 24px rgba(20, 10, 10, .35); }
.ask-fab:hover { filter: brightness(1.08); }
.ask-panel { position: absolute; right: 0; bottom: 62px; width: min(400px, calc(100vw - 44px)); background: #fffdf8; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 18px 60px rgba(20, 12, 8, .28); padding: 18px 18px 12px; }
.ask-head { font: 700 1.05rem var(--serif); color: var(--ink); margin: 0 0 2px; }
.ask-sub { color: var(--muted); font-size: .78rem; margin: 0 0 12px; }
.ask-panel form { display: flex; gap: 8px; }
.ask-panel input { flex: 1; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font: 400 .95rem Inter, sans-serif; }
.ask-panel input:focus { outline: 2px solid var(--gold); }
.ask-panel .cta { padding: 10px 16px; border: none; cursor: pointer; font-weight: 700; }
#ask-results { margin-top: 12px; max-height: 320px; overflow-y: auto; }
.ask-answer { background: color-mix(in srgb, var(--gold) 7%, #fff); border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0; padding: 10px 14px; margin-bottom: 8px; }
.ask-answer .ask-q { font-weight: 700; margin: 0 0 4px; font-size: .9rem; }
.ask-answer p { margin: 0; font-size: .92rem; line-height: 1.5; }
.ask-more { border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin-bottom: 6px; font-size: .88rem; }
.ask-more summary { cursor: pointer; font-weight: 600; }
.ask-more p { margin: 8px 0 2px; }
.ask-wait, .ask-miss { color: var(--muted); font-size: .88rem; }
.ask-foot { color: var(--muted); font-size: .74rem; margin: 10px 0 0; }

.brand-tm { font-size: .5em; vertical-align: super; letter-spacing: 0; font-weight: 600; opacity: .75; }

.footer-disclosure { color: var(--muted); font-size: .74rem; max-width: 45rem; margin: 18px 0 10px; }


/* Mobile header: one compact bar, hamburger dropdown */
.nav-toggle { display: none; }
@media (max-width: 880px) {
  .site-header { padding: 10px 16px; gap: 10px; }
  .brand-word { font-size: 1.02rem; }
  .nav-toggle { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; background: none; border: 1px solid var(--line); border-radius: 8px; padding: 10px; cursor: pointer; flex: none; }
  .nav-toggle span { display: block; width: 18px; height: 2px; background: var(--ink); border-radius: 1px; }
  .site-nav { display: none; }
  .site-nav.open { display: block; position: absolute; top: 100%; left: 0; right: 0; background: #fffaf0; border-bottom: 1px solid var(--line); padding: 8px 18px 18px; box-shadow: 0 18px 40px rgba(20, 12, 8, .16); max-height: calc(100vh - 60px); overflow-y: auto; overscroll-behavior: contain; }
  /* One level of accordion, never two: a category opens its whole panel. */
  .nav-list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav-item { position: static; }
  .nav-link { width: 100%; justify-content: space-between; padding: 13px 2px; font-size: 1rem; border-bottom: 1px solid color-mix(in srgb, var(--line) 55%, transparent); }
  .nav-link:hover, .nav-trigger[aria-expanded="true"] { border-bottom-color: color-mix(in srgb, var(--line) 55%, transparent); }
  .nav-panel { position: static; background: none; border: 0; box-shadow: none; }
  .nav-panel-inner { grid-template-columns: 1fr; padding: 6px 0 12px 12px; gap: 2px; }
  .nav-group + .nav-group { margin-top: 10px; }
  .nav-group-title { font-size: .64rem; margin-bottom: 2px; }
  .nav-entry { padding: 9px 8px; }
  .nav-entry-desc { display: none; }
  .nav-panel-foot { margin-top: 8px; padding-top: 8px; }
  .nav-item-cta { margin-top: 14px; }
  .nav-cta { display: block; text-align: center; padding: 13px 16px; }
  .product-strip { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body.nav-open { overflow: hidden; }
}

.hb-tm { font-size: .32em; vertical-align: super; letter-spacing: .05em; opacity: .85; }

/* Ten-doors and tour visuals hold the imagery aspect so frames fill clean */
.showcase-visual, .tour-visual { aspect-ratio: 3 / 2; height: auto; min-height: 0; align-self: center; width: 100%; }
@media (max-width: 900px) { .showcase-visual, .tour-visual { aspect-ratio: 3 / 2; } }

/* Data tables fit their card: fixed columns, wrapped cells */
.prose table, .tour-copy table { width: 100%; table-layout: fixed; border-collapse: collapse; margin: 18px 0; font-size: .95rem; }
.prose th, .tour-copy th { text-align: left; color: var(--teal, #2E6E5C); text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; padding: 10px 14px 8px; border-bottom: 2px solid var(--line); }
.prose td, .tour-copy td { padding: 12px 14px; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: break-word; }
.prose tr:nth-child(even) td, .tour-copy tr:nth-child(even) td { background: rgba(201, 154, 75, .05); }

/* Subtour visuals hold 3:2 so the image is the panel, not a thumbnail in it */
.subtour-panel .visual-fit { aspect-ratio: 3 / 2; height: auto; min-height: 0; width: 100%; }

/* Statement accordion: the open panel spans the row under its card */
.statement-grid .statement-detail { grid-column: 1 / -1; }

/* Opened panels land below the sticky header when scrolled to */
.tour-panel, .subtour-panel, .showcase-panel, .statement-detail { scroll-margin-top: 130px; }

/* Phones: table rows become labeled cards instead of clipped columns */
@media (max-width: 700px) {
  table.stackable { min-width: 0; } .table-scroll { border: none; background: transparent; box-shadow: none; }
  table.stackable thead { display: none; }
  table.stackable, table.stackable tbody, table.stackable tr, table.stackable td { display: block; width: 100%; }
  table.stackable tr { border: 1px solid var(--line); border-radius: 10px; margin: 0 0 12px; overflow: hidden; }
  table.stackable td { border-bottom: 1px solid var(--line); }
  table.stackable tr td:last-child { border-bottom: none; }
  table.stackable td::before { content: attr(data-col); display: block; color: var(--teal, #2E6E5C); text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; font-weight: 700; margin-bottom: 4px; }
}

/* Open statement box: the box stays as the fold handle, the panel drops the repeats */
.statement-detail h2 { display: none; }
.statement-box[aria-expanded="true"] p { display: none; }
.statement-box[aria-expanded="true"] { opacity: .95; }

/* The thesis shelf: closed by default so Ten Doors leads */
.statement-shelf { border: 1px solid var(--line); border-radius: 12px; background: #fffdf8; padding: 0; }
.statement-shelf > summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; padding: 18px 22px; }
.statement-shelf > summary::-webkit-details-marker { display: none; }
.statement-shelf > summary::after { content: "+"; margin-left: auto; font-size: 1.6rem; color: var(--gold, #C99A4B); line-height: 1; }
.statement-shelf[open] > summary::after { content: "\2212"; }
.statement-shelf .statement-grid-title { margin: 0; font-size: clamp(1.3rem, 2.6vw, 1.9rem); }
.shelf-hint { color: var(--muted); font-size: .85rem; }
.statement-shelf[open] { padding-bottom: 18px; }
.statement-shelf .statement-grid { padding: 0 22px; }

/* Content shelves share the thesis-shelf look and breathe inside a section rhythm */
.content-shelf { margin: 26px var(--pad-x); }
.content-shelf .shelf-body { padding: 6px 10px 14px; }
.content-shelf .shelf-body > section { padding-top: 0; padding-bottom: 0; }

/* The production lifecycle chain under the hero */
.lifecycle-band { padding: 30px var(--pad-x) 8px; }
.lc-chain { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 6px 10px; margin: 12px 0 14px; }
.lc-step { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .86rem; font-weight: 600; letter-spacing: .04em; color: var(--ink); background: #fffdf8; border: 1px solid var(--line); border-radius: 999px; padding: 6px 13px; white-space: nowrap; }
.lc-arrow { color: var(--gold, #C99A4B); font-weight: 700; }
.lc-note { color: var(--ink-soft); max-width: 46rem; margin: 0; font-size: 1.02rem; }

.lc-proof { margin: 10px 0 0; font-size: 1.05rem; color: var(--ink); } .lc-proof strong { border-bottom: 2px solid var(--gold, #C99A4B); padding-bottom: 2px; }

/* Pill-built visuals fill their 3:2 frame instead of centering as a 300px track */
.showcase-visual > .visual-fit, .tour-visual > .visual-fit { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; }

.lc-explain { color: var(--ink-soft); max-width: 46rem; margin: 14px 0 0; font-size: 1.02rem; }

.matrix-intro { color: var(--ink-soft); max-width: 60rem; margin: 6px 0 18px; font-size: .98rem; line-height: 1.6; }


/* Investor page */
.inv-eyebrow { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .78rem; letter-spacing: .18em; color: var(--gold, #C99A4B); margin: 0 0 4px; }
.inv-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 6px; }
.inv-tertiary { margin: 4px 0 0; font-size: .95rem; }
/* .cta sets `color: #fff !important` for the solid button, which a plain
   declaration here cannot beat: the ghost variant rendered white on cream and
   read as an empty outline. It needs the same weight to win. */
.cta-ghost { background: transparent; border: 1px solid var(--line); color: var(--ink) !important; box-shadow: none; }
.cta-ghost:hover { border-color: var(--ink-soft); background: rgba(23, 20, 33, .04); box-shadow: none; }
.inv-snapshot { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin: 8px 0 18px; }
.inv-card { background: #fffdf8; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.inv-card-k { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 0 0 6px; }
.inv-card-v { margin: 0; font-size: .98rem; line-height: 1.5; color: var(--ink); }
.inv-problems, .inv-moat { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.inv-problems span, .inv-moat span { background: #fffdf8; border: 1px solid var(--line); border-radius: 999px; padding: 8px 15px; font-size: .9rem; color: var(--ink); }
.inv-diagram { margin: 20px 0; text-align: center; }
.inv-dia-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.inv-dia-row span { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .82rem; background: #fffdf8; border: 1px solid var(--line); border-radius: 8px; padding: 7px 13px; }
.inv-dia-in span { border-color: color-mix(in srgb, var(--gold, #C99A4B) 45%, var(--line)); }
.inv-dia-out span { border-color: color-mix(in srgb, #2E6E5C 45%, var(--line)); }
.inv-dia-arrow { color: var(--gold, #C99A4B); font-size: 1.5rem; line-height: 1.2; }
.inv-dia-core { background: var(--ink); color: var(--paper); border-radius: 12px; padding: 16px 18px; margin: 4px auto; max-width: 720px; }
.inv-dia-title { font: 800 1.2rem/1.2 var(--serif, Georgia, serif); margin: 0 0 6px; color: #ffdf9e; }
.inv-dia-sub { margin: 0; font-size: .82rem; letter-spacing: .02em; opacity: .92; }
.inv-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0; }
.inv-metric { text-align: center; background: #fffdf8; border: 1px solid var(--line); border-radius: 12px; padding: 22px 12px; }
.inv-metric-n { display: block; font: 800 3rem/1 var(--serif, Georgia, serif); color: var(--gold, #C99A4B); font-variant-numeric: tabular-nums; }
.inv-metric-l { display: block; margin-top: 8px; font-size: .9rem; color: var(--muted); }
.inv-video { background: #17131c; color: #f2ece2; border-radius: 14px; padding: 28px; text-align: center; }
.inv-video-title { font: 700 1.15rem var(--serif, Georgia, serif); margin: 0 0 10px; color: #ffdf9e; }
.inv-video p { margin: 6px auto; max-width: 52ch; }
.inv-video-note { font-size: .88rem; opacity: .82; }
.inv-video a { color: #ffdf9e; }
.inv-stage { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin: 18px 0; }
.inv-stage > span:not(.inv-stage-arrow) { background: var(--ink); color: var(--paper); border-radius: 999px; padding: 10px 18px; font-size: .92rem; font-weight: 600; }
.inv-stage-arrow { color: var(--gold, #C99A4B); font-size: 1.3rem; }
/* The portrait is environmental and 2:1: the camera, the lights and the crew
   are the evidence for the claim this section makes, so it runs full width
   rather than being cropped into a headshot box. */
.inv-founder { display: block; margin: 16px 0; }
.inv-founder-portrait { margin: 0 0 18px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: none; }
.inv-founder-portrait img { display: block; width: 100%; height: auto; }
.inv-links { font-size: .95rem; }
@media (max-width: 720px) {
  .inv-metrics { grid-template-columns: 1fr; }
  .inv-founder-portrait { max-width: none; }
}

.inv-metric-head { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 18px 0 8px; }
.inv-metrics-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 720px) { .inv-metrics-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* A standalone content image is a figure: it uses the band, not the 720px
   reading measure, or a dense product capture is too small to read. */
.figure-wide { max-width: min(100%, 1180px) !important; margin: 24px 0 20px; }
.figure-wide img { display: block; width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--line); }
/* Inside a tour panel the copy column is already narrow, so a figure there
   takes the column rather than the 58ch measure. It cannot take the band:
   the visual column sits beside it. */
.tour-copy .figure-wide, .tour-copy section > p.figure-wide { max-width: 100% !important; margin: 16px 0 12px; }
/* Promoted out of the copy column: its own row across the whole panel. */
.tour-panel > .panel-figure, .showcase-panel > .panel-figure { grid-column: 1 / -1; max-width: none !important; margin: 0 24px 22px; }

/* A 3rem figure will not share a phone-width row with a second one. */
@media (max-width: 430px) { .inv-metrics, .inv-metrics-3 { grid-template-columns: 1fr; } }


/* ---- Chapter navigation for long read pages ------------------------------ */
/* Jump links, not panels. Every section stays in the DOM so find-in-page,
   copy and print keep working; the rail only moves you through the document. */
.chapter-rail { position: sticky; top: 95px; z-index: 40; background: rgba(255,250,240,.94); backdrop-filter: blur(8px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 0 0 8px; }
.chapter-rail-inner { display: flex; align-items: center; gap: 14px; width: min(100% - 2rem, 88rem); margin: 0 auto; padding: 8px 0; }
.chapter-links { display: flex; flex-wrap: wrap; gap: 2px; flex: 1 1 auto; min-width: 0; }
.chapter-link { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); text-decoration: none; padding: 7px 10px; border-radius: 7px; border: 1px solid transparent; white-space: nowrap; transition: color .15s, border-color .15s, background .15s; }
.chapter-link:hover { color: var(--ink); background: rgba(23,20,33,.04); }
.chapter-link[aria-current="true"] { color: var(--ink); border-color: var(--line); background: #fffdf8; font-weight: 700; }
.chapter-print { flex: none; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); background: transparent; border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; cursor: pointer; transition: border-color .15s, background .15s; }
.chapter-print:hover { border-color: var(--ink-soft); background: rgba(23,20,33,.04); }

.chapter-step { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: min(100% - 2rem, 72rem); margin: 6px auto 26px; padding-top: 14px; border-top: 1px solid var(--line); }
.chapter-step a { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .78rem; color: var(--ink); text-decoration: none; border: 1px solid var(--line); border-radius: 8px; padding: 9px 13px; background: #fffdf8; max-width: 42%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chapter-step a:hover { border-color: var(--ink-soft); }
.chapter-step a.is-disabled { opacity: .32; pointer-events: none; }
.chapter-step-count { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .72rem; letter-spacing: .12em; color: var(--muted); }
@media (max-width: 720px) {
  .chapter-rail { top: 57px; }
  .chapter-rail-inner { flex-direction: column; align-items: stretch; gap: 8px; }
  .chapter-links { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .chapter-links::-webkit-scrollbar { display: none; }
  .chapter-step a { max-width: 38%; font-size: .72rem; }
}

.print-titleblock { display: none; }

/* ---- Print: this page is a document, not a web page ---------------------- */
@media print {
  /* Screen chrome carries nothing a reader on paper can act on. */
  .site-header, .product-strip, .site-footer, .ask-fab-wrap, .skip-link,
  .chapter-rail, .chapter-step, .page-hero, .engine-pillars,
  .status-colophon, .product-cta-row { display: none !important; }

  /* Scroll reveal is opacity:0 until an IntersectionObserver fires. Printing
     never scrolls, so every band below the fold printed blank: 11 of 13 pages
     had no visible text while innerText still reported all 18 sections. */
  .will-reveal, .will-reveal:not(.is-visible) {
    opacity: 1 !important; transform: none !important; transition: none !important; animation: none !important;
  }

  html, body { background: #fff !important; color: #000 !important; }
  body { font-size: 10.5pt; line-height: 1.45; }
  main, article.prose { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }

  .print-titleblock { display: block; margin: 0 0 18pt; padding-bottom: 8pt; border-bottom: 1pt solid #000; }
  .pt-brand { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 8pt; letter-spacing: .18em; text-transform: uppercase; margin: 0 0 4pt; }
  .pt-title { font-size: 18pt; font-weight: 800; margin: 0; }

  /* Band decoration is screen texture; on paper it is just heavy ink. */
  .band, .band-paper, .band-texture, .has-paper-art, .band-lead {
    background: none !important; background-image: none !important;
    border: 0 !important; box-shadow: none !important;
    padding: 0 !important; margin: 0 0 14pt !important; width: auto !important; max-width: none !important;
  }
  .band-paper::before, .band-texture::before, .has-paper-art::before { display: none !important; }

  /* A chapter starts a page, so the document reads in sections. */
  .chapter-start { break-before: page; page-break-before: always; }
  .chapter-start:first-of-type { break-before: auto; page-break-before: auto; }

  h1, h2, h3 { break-after: avoid; page-break-after: avoid; color: #000 !important; }
  h2 { font-size: 14pt; margin: 0 0 6pt; }
  h3 { font-size: 11.5pt; }
  p, li { orphans: 3; widows: 3; }

  /* Keep evidence together: a split metric card or table is unreadable. */
  .inv-card, .inv-metric, .inv-metrics, .inv-snapshot, figure, .figure-wide,
  table, tr, .faq-list details { break-inside: avoid; page-break-inside: avoid; }
  .inv-metrics { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 8pt !important; }
  .inv-card, .inv-metric { border: .5pt solid #999 !important; background: #fff !important; }

  img { max-width: 100% !important; height: auto !important; break-inside: avoid; }
  .figure-wide img, .panel-figure img { border: .5pt solid #999 !important; }

  a { color: #000 !important; text-decoration: underline; }
  /* Folded detail is still content: open it rather than lose it on paper. */
  details { display: block !important; }
  details > summary { display: none !important; }
  details > *:not(summary) { display: revert !important; }
  [hidden] { display: revert !important; }

  /* On screen the caps give a comfortable measure against a wide viewport.
     On A4 the page margins already supply it, so the caps only waste the
     right-hand third of every sheet. */
  main :is(p, ul, ol, li, h1, h2, h3, h4, blockquote, figure, .band > *, .inv-snapshot, .inv-metrics) {
    max-width: none !important;
  }

  @page { margin: 18mm 20mm; }
}

/* --- Worker scoreboard (generated by scripts/site_worker_scoreboard.py) ---------------- */
.ws-eyebrow { font-family: var(--mono); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin: 0 0 10px; }
.ws-lanes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 14px 0 26px; }
.ws-lane { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--muted); border-radius: 12px; padding: 18px 16px 14px; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
.ws-lane-paid { border-top-color: var(--amber); } .ws-lane-subscription { border-top-color: var(--cobalt); }
.ws-lane-k { display: block; font-family: var(--mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ws-lane-n { display: block; font: 800 2.2rem/1 var(--serif); color: var(--ink); margin: 10px 0 6px; font-variant-numeric: tabular-nums; }
.ws-lane-n small { font: 600 .78rem/1 var(--mono); color: var(--muted); margin-left: 8px; }
.ws-lane-d { display: block; font-size: .88rem; line-height: 1.45; color: var(--ink-soft); }
.ws-table { width: 100%; min-width: 44rem; border-collapse: collapse; font-size: .92rem; }
.ws-table th { text-align: left; font-family: var(--mono); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); background: #faf5ea; }
.ws-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.ws-table tr:last-child td { border-bottom: 0; }
.ws-table th.ws-num, .ws-table td.ws-num { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ws-model { font-weight: 600; color: var(--ink); }
.ws-model small { display: block; font: 400 .72rem/1.3 var(--mono); color: var(--muted); }
.ws-thin td { color: var(--muted); } .ws-thin .ws-bar { opacity: .45; }
.ws-track { display: inline-block; width: 100px; height: 8px; border-radius: 4px; background: #eee5d3; vertical-align: middle; margin-right: 8px; overflow: hidden; }
.ws-bar { display: block; height: 100%; border-radius: 4px; background: var(--cobalt); }
.ws-bar-paid { background: var(--amber); } .ws-bar-local { background: var(--muted); }
.ws-pct { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.ws-tag { display: inline-block; font: 600 .64rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; padding: 4px 6px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.ws-tag-gold { color: var(--gold); border-color: rgba(201,139,33,.5); }
.ws-cap { font-size: .9rem; color: var(--ink-soft); max-width: 72ch; margin: 8px 0 22px; }
.ws-chart { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 18px 18px 10px; margin: 8px 0 18px; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
.ws-chart-t { font: 700 1.05rem/1.3 var(--serif); margin: 0 0 4px; color: var(--ink); }
.ws-chart-s { font-size: .88rem; color: var(--muted); margin: 0 0 12px; max-width: 72ch; }
.ws-chart-svg text { font-family: var(--mono); font-size: 11px; fill: var(--muted); }
.ws-chart-svg text.ws-lbl { fill: var(--ink); font-family: var(--sans); font-size: 12.5px; }
.ws-chart-svg text.ws-val { fill: var(--ink); font-weight: 600; }
.ws-chart-svg line.ws-grid { stroke: var(--line); stroke-width: 1; }
.ws-rect-subscription { fill: var(--cobalt); } .ws-rect-paid { fill: var(--amber); } .ws-rect-local { fill: var(--muted); }
.ws-legend { display: flex; gap: 16px; flex-wrap: wrap; font: 500 .74rem/1 var(--mono); color: var(--muted); margin-top: 8px; }
.ws-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.ws-sw-paid { background: var(--amber); } .ws-sw-subscription { background: var(--cobalt); }
.ws-dated { font-size: .82rem; color: var(--muted); font-style: italic; }
.ws-mini { margin: 6px 0 30px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 16px 20px; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
.ws-mini-t { font: 700 1rem/1.3 var(--serif); margin: 0 0 8px; color: var(--ink); }
.ws-mini-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ws-mini-list li { display: grid; grid-template-columns: minmax(0, 1.6fr) auto auto; align-items: center; gap: 12px; font-size: .9rem; }
.ws-mini-l { color: var(--ink); } .ws-mini-n { font-family: var(--mono); font-size: .78rem; color: var(--muted); white-space: nowrap; }
.ws-mini-c { font-size: .82rem; color: var(--muted); margin: 10px 0 0; }
@media (max-width: 720px) { .ws-lanes { grid-template-columns: 1fr; } .ws-mini-list li { grid-template-columns: 1fr; gap: 4px; } }

/* Lane card whose headline is a statement rather than a count (unmeasured local seats). */
.ws-lane-n.ws-lane-n-text { font-size: 1.35rem; line-height: 1.15; }
.ws-lane-n.ws-lane-n-text small { display: block; margin: 6px 0 0; }


/* ===================== Clarity round 1 · 2026-09-04 ===================== */

/* ---- CTA rows: a prose paragraph made only of links becomes a button row ---- */
.prose p.cta-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.prose p.cta-row a { display: inline-flex; align-items: center; gap: 8px; background: var(--cta); color: #fff !important; font: 800 .95rem var(--sans); text-decoration: none !important; padding: 12px 22px; border-radius: 4px; box-shadow: inset 0 -2px 0 rgba(0,0,0,.22), 0 1px 2px rgba(35,28,45,.15); transition: transform .15s var(--ease), box-shadow .15s; }
.prose p.cta-row a:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(155,26,42,.35); }
.prose p.cta-row a.cta-ghost { background: transparent; color: var(--ink) !important; border: 1px solid var(--ink); box-shadow: none; }
.prose p.cta-row a.cta-ghost:hover { box-shadow: none; background: rgba(23,20,33,.06); }
.band-lead p > em:only-child { color: var(--muted); font-size: .92rem; }

/* ---- lifecycle: dark cinematic band, amber trail ---- */
.lifecycle-band { background: #17131c; color: #fffaf0; padding: clamp(36px, 6vh, 64px) var(--pad-x) clamp(28px, 5vh, 48px); position: relative; overflow: hidden; }
.lifecycle-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 80% at 50% 62%, rgba(201,154,75,.14), transparent 70%); pointer-events: none; }
.lifecycle-band .section-inner { position: relative; }
.lifecycle-band .eyebrow { color: #e9c98a; }
.lifecycle-band .eyebrow::before { color: #ffdf9e; }
.lc-title { font: 700 clamp(1.45rem, 2.6vw, 2.15rem)/1.2 var(--serif); letter-spacing: -.01em; margin: 0 0 18px; max-width: 34ch; color: #fffaf0; text-wrap: balance; }
.lc-anim { margin: 0; position: relative; }
.lc-anim:focus-visible { outline: 2px solid var(--amber); outline-offset: 6px; border-radius: 8px; }
.lc-anim svg { width: 100%; height: auto; display: block; max-height: 360px; }
.lc-rail, .lc-branch-rail { fill: none; stroke: rgba(255,250,240,.16); stroke-width: 2; }
.lc-trail, .lc-branch-trail { fill: none; stroke: url(#lc-trail); stroke-width: 4; stroke-linecap: round; filter: drop-shadow(0 0 6px rgba(255,223,158,.65)); }
.lc-node .lc-dot { fill: #2a2333; stroke: rgba(255,250,240,.35); stroke-width: 2; transition: fill .4s var(--ease), stroke .4s; }
.lc-node .lc-halo { fill: #C99A4B; opacity: 0; transition: opacity .5s var(--ease); }
.lc-node .lc-name { fill: rgba(255,250,240,.72); font: 600 15px var(--mono); letter-spacing: .12em; text-transform: uppercase; text-anchor: middle; transition: fill .4s; }
.lc-node .lc-name-side { text-anchor: start; }
.lc-node .lc-mark circle { fill: #17131c; stroke: #ffdf9e; stroke-width: 2; }
.lc-node .lc-mark path { fill: none; stroke: #ffdf9e; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.lc-node .lc-mark { opacity: 0; transform-box: fill-box; transform-origin: center; transform: translate(0, -38px) scale(.4); transition: opacity .35s var(--ease), transform .45s cubic-bezier(.34,1.56,.64,1); }
.lc-node .lc-approved { fill: #ffdf9e; font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; text-anchor: middle; opacity: 0; transition: opacity .4s var(--ease) .15s; }
.lc-node.is-lit .lc-dot { fill: #ffdf9e; stroke: #fff1cf; }
.lc-node.is-lit .lc-halo { opacity: .55; }
.lc-node.is-lit .lc-name { fill: #fffaf0; }
.lc-node.is-lit .lc-mark { opacity: 1; transform: translate(0, -38px) scale(1); }
.lc-node.is-lit .lc-approved { opacity: 1; }
.lc-token .lc-token-halo { fill: #ffdf9e; opacity: .55; }
.lc-token .lc-token-core { fill: #fff8e6; }
.lc-token { opacity: 0; }
.lc-token.is-on { opacity: 1; }
.lc-caption { fill: rgba(255,250,240,.55); font: 500 13px var(--mono); letter-spacing: .18em; text-transform: uppercase; opacity: 0; transition: opacity .8s var(--ease); }
.lc-anim.is-done .lc-caption { opacity: 1; fill: #ffdf9e; }
.lc-legend { margin: 6px 0 0; font: 500 .74rem var(--mono); color: rgba(255,250,240,.6); letter-spacing: .04em; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lc-legend-token { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #ffdf9e; box-shadow: 0 0 10px rgba(255,223,158,.9); }
.lc-legend-mark { color: #ffdf9e; }
.lc-replay { background: none; border: 1px solid rgba(255,250,240,.3); color: inherit; font: inherit; border-radius: 999px; padding: 2px 10px; cursor: pointer; margin-left: 4px; }
.lc-replay:hover { border-color: #ffdf9e; color: #ffdf9e; }
.receipt-live .lc-replay { border-color: var(--line); color: var(--muted); }
.receipt-live .lc-replay:hover { border-color: var(--ink); color: var(--ink); }
.lifecycle-band .lc-note { color: rgba(255,250,240,.82); margin-top: 18px; }
.lifecycle-band .lc-proof { color: #fffaf0; }
.lifecycle-band .lc-proof strong { border-bottom-color: #ffdf9e; }
@media (max-width: 700px) {
  /* The SVG scales to the phone width, so sizes here are in viewBox units:
     34px renders at about 12px on a 390px screen. */
  .lc-anim svg { max-height: none; }
  .lc-node .lc-name { font-size: 34px; }
  .lc-node .lc-name-side { font-size: 30px; }
  .lc-node .lc-approved { font-size: 20px; letter-spacing: .06em; }
  .lc-node .lc-dot { r: 12px; }
  .lc-caption { font-size: 26px; letter-spacing: .12em; }
  .lc-legend { font-size: .7rem; }
}
@media (prefers-reduced-motion: reduce) {
  html:not(.force-motion) .lc-node .lc-mark, html:not(.force-motion) .lc-node .lc-halo, html:not(.force-motion) .lc-node .lc-approved, html:not(.force-motion) .lc-caption { transition: none; }
  html:not(.force-motion) .lc-replay { display: none; }
}

/* ---- seat swap: the model changes, the project does not ---- */
.seat-swap { display: grid; grid-template-columns: minmax(180px, 1fr) 72px minmax(240px, 1.4fr); gap: 14px; align-items: stretch; margin: 22px 0 8px; max-width: 760px; }
.seat-swap .ss-label { margin: 0 0 6px; font: 900 .7rem var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ss-seat { background: #17131c; color: #fffaf0; border-radius: 8px; padding: 18px 20px; border: 1px solid rgba(255,255,255,.12); box-shadow: var(--shadow-dark); display: grid; align-content: center; min-height: 150px; position: relative; overflow: hidden; cursor: pointer; }
.ss-seat::after { content: ""; position: absolute; inset: auto 0 0 0; height: 3px; background: linear-gradient(90deg, #C99A4B, transparent); }
.ss-seat .ss-label { color: rgba(255,250,240,.6); }
.ss-model { margin: 0; font: 700 clamp(1.5rem, 2.6vw, 2.1rem)/1.1 var(--serif); color: #ffdf9e; transition: opacity .32s var(--ease), transform .32s var(--ease); }
.ss-model.is-swapping { opacity: 0; transform: translateY(8px); }
.ss-sub { margin: 8px 0 0; font: 500 .74rem var(--mono); color: rgba(255,250,240,.55); letter-spacing: .04em; }
.ss-link { display: grid; align-content: center; justify-items: center; gap: 8px; }
.ss-link span { display: block; width: 100%; height: 2px; background: linear-gradient(90deg, #C99A4B, rgba(201,154,75,.15)); }
.ss-project { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(35,28,45,.06); }
.ss-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ss-rows li { display: flex; justify-content: space-between; gap: 12px; font: 500 .82rem var(--mono); padding: 6px 0; border-bottom: 1px dashed var(--line); margin: 0; }
.ss-rows li:last-child { border-bottom: 0; }
.ss-rows li::marker { content: ""; }
.ss-k { color: var(--muted); letter-spacing: .06em; text-transform: uppercase; font-size: .7rem; }
.ss-v { color: var(--ink); text-align: right; }
@media (max-width: 640px) { .seat-swap { grid-template-columns: 1fr; } .ss-link { height: 40px; grid-auto-flow: column; align-items: center; } .ss-link span { width: 2px; height: 100%; background: linear-gradient(180deg, #C99A4B, rgba(201,154,75,.15)); } }

/* ---- three differentiators ---- */
.band .pillar-grid.trio { max-width: none; margin-top: 18px; }
.pillar-grid.trio .pillar { border-top: 3px solid var(--gold); }
.pillar-grid.trio .pillar h3 { font-size: 1.08rem; margin-top: 6px; }

/* ---- proof scope line + live receipt ---- */
.stat-scope { max-width: 66rem; margin: -12px 0 26px; font-size: .86rem; color: var(--muted); }
.receipt-live { margin: 0 0 30px; max-width: 760px; }
.receipt-live .app-window { width: 100%; }
.rc-body { margin: 0; padding: 14px 16px 16px; font: 500 .8rem/1.75 var(--mono); color: #fffaf0; white-space: pre-wrap; min-height: 12.6em; }
.rc-body .rc-k { color: #e9c98a; }
.rc-body .rc-pass { color: #6fbf73; font-weight: 700; }
.rc-body .rc-accept { color: #ffdf9e; font-weight: 700; }
.rc-body .rc-cursor { display: inline-block; width: .55em; height: 1em; background: #ffdf9e; vertical-align: -.15em; animation: rc-blink 1s steps(1) infinite; }
@keyframes rc-blink { 50% { opacity: 0; } }
.receipt-live figcaption { margin-top: 8px; font-size: .8rem; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { html:not(.force-motion) .rc-body .rc-cursor { display: none; } }

/* ---- grouped product shelf ---- */
.shelf-groups { display: grid; gap: 26px; margin-top: 18px; }
.shelf-group { border-top: 1px solid var(--line); padding-top: 18px; }
.shelf-group-head { display: grid; grid-template-columns: auto 1fr; gap: 4px 18px; align-items: baseline; margin-bottom: 12px; }
.shelf-group-label { margin: 0; font: 900 .84rem var(--mono); letter-spacing: .18em; text-transform: uppercase; color: var(--ink); grid-row: 1 / span 2; align-self: start; padding-top: 2px; }
.shelf-group-label::before { content: "◆ "; color: var(--amber); font-size: .8em; }
.shelf-group-chain { margin: 0; font: 700 1.05rem var(--serif); color: var(--ink); }
.shelf-group-gloss { margin: 0; font-size: .86rem; color: var(--muted); }
.shelf-group-everything .product-grid { grid-template-columns: minmax(280px, 520px); }
@media (max-width: 640px) { .shelf-group-head { grid-template-columns: 1fr; } .shelf-group-label { grid-row: auto; } }

/* ---- proof demos + ledger shelf (clarity round 1) ---- */
.proof-demos { list-style: none; margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; max-width: none; }
.proof-demos li { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 16px 18px; font-size: .92rem; color: var(--ink-soft); margin: 0; }
.proof-demos li strong { display: block; color: var(--ink); margin-bottom: 4px; }
.proof-demos li a { font-weight: 800; color: var(--teal); text-decoration: none; }
.proof-demos li em { color: var(--muted); }
.proof-shelf { margin-top: 6px; }
.beta-close .band { padding-left: 0; padding-right: 0; }
.beta-close .band h2::after { display: none; }

/* ---- hero console: live feed (clarity round 1) ---- */
.hero-console .app-window { min-height: 268px; }
.hero-console .app-rows { min-height: 196px; justify-content: flex-end; }
.app-live { margin-left: auto; font-size: .68rem; color: rgba(255,250,240,.7); display: inline-flex; align-items: center; gap: 6px; letter-spacing: .04em; }
.app-live-dot { width: 7px; height: 7px; border-radius: 50%; background: #6fbf73; box-shadow: 0 0 8px #6fbf73; animation: app-live-pulse 1.6s ease-in-out infinite; }
@keyframes app-live-pulse { 50% { opacity: .35; } }
.app-rows li.app-row-live { transition: opacity .42s var(--ease), transform .42s var(--ease), max-height .42s var(--ease); max-height: 60px; overflow: hidden; position: relative; }
.app-rows li.app-row-live.is-entering { opacity: 0; transform: translateY(10px); }
.app-rows li.app-row-live.is-leaving { opacity: 0; transform: translateY(-8px); max-height: 0; padding-top: 0; padding-bottom: 0; margin-top: -8px; border-width: 0; }
.app-rows li.app-row-live .row-label strong { color: var(--win-accent); font-weight: 700; }
.app-rows li.app-row-live .row-check { opacity: 0; color: #6fbf73; font-weight: 700; margin-left: 4px; transform: scale(.6); transition: opacity .3s, transform .35s cubic-bezier(.34,1.56,.64,1); }
.app-rows li.app-row-live.is-done .row-check { opacity: 1; transform: scale(1); }
.app-rows li.app-row-live.is-done .row-num { color: #ffdf9e; }
.app-rows li.app-row-live .row-bar { min-width: 0; width: 0; }
@media (prefers-reduced-motion: reduce) { html:not(.force-motion) .app-live-dot { animation: none; } }
.product-strip .strip-group { flex: none; align-self: center; font: 900 .62rem var(--mono); letter-spacing: .16em; text-transform: uppercase; color: #9a6d24; padding: 0 6px 0 14px; border-left: 1px solid var(--line); }
.product-strip .strip-group:first-child { border-left: 0; padding-left: 0; }
.product-strip .strip-group::before { content: "◆ "; color: var(--amber); font-size: .8em; }

/* ---- lifecycle backdrop: wood maze → copper traces → hologram ---- */
.lifecycle-band { background-color: #0d0a10; background-image: url('/media/lineage/evolution-maze-circuit-hologram.jpg'); background-size: cover; background-position: 50% 62%; background-repeat: no-repeat; }
.lifecycle-band::before { background: linear-gradient(180deg, rgba(13,10,16,.78) 0%, rgba(13,10,16,.42) 38%, rgba(13,10,16,.34) 62%, rgba(13,10,16,.86) 100%); }
/* The hologram side sits under a veil that lifts as the project token advances. */
.lifecycle-band::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(13,10,16,0) 42%, rgba(13,10,16,.72) 68%, rgba(13,10,16,.8) 100%); opacity: calc(1 - var(--lc-progress, 0)); transition: opacity .25s linear; }
.lifecycle-band.is-played::after { opacity: 0; }
.lc-title { text-shadow: 0 2px 22px rgba(9,6,18,.85); }
.lifecycle-band .lc-note, .lifecycle-band .lc-proof, .lc-legend { text-shadow: 0 1px 12px rgba(9,6,18,.85); }
@media (max-width: 700px) { .lifecycle-band { background-position: 38% 60%; } }
@media (prefers-reduced-motion: reduce) { html:not(.force-motion) .lifecycle-band::after { opacity: 0; } }
.app-rows li.app-row-live { gap: 10px; }
.app-rows li.app-row-live .row-label { min-width: 0; line-height: 1.35; }
.app-rows li.app-row-live .row-bar { flex: 0 0 72px; width: 72px !important; max-width: 72px; transform-origin: left center; transform: scaleX(0); transition: transform 1.1s cubic-bezier(.22,.8,.3,1); }
.app-rows li.app-row-live.is-filling .row-bar, .app-rows li.app-row-live.is-done .row-bar { transform: scaleX(1); }

/* ---- seat network: seats talk through the project inbox ---- */
.seat-net { margin: 22px 0 10px; max-width: 820px; background: #17131c; border-radius: 10px; padding: 14px 14px 8px; border: 1px solid rgba(255,255,255,.1); box-shadow: var(--shadow-dark); cursor: pointer; }
.seat-net:focus-visible { outline: 2px solid var(--amber); outline-offset: 4px; }
.seat-net svg { width: 100%; height: auto; display: block; }
.sn-wire { fill: none; stroke: rgba(255,250,240,.18); stroke-width: 2; stroke-dasharray: 4 6; transition: stroke .3s; }
.sn-wire.is-hot { stroke: #ffdf9e; stroke-dasharray: none; filter: drop-shadow(0 0 5px rgba(255,223,158,.7)); }
.sn-seat rect { fill: #211b2f; stroke: rgba(255,250,240,.16); stroke-width: 1.5; transition: stroke .3s, fill .3s; }
.sn-seat.is-active rect { stroke: #ffdf9e; fill: #2a2236; }
.sn-seat-k { fill: rgba(255,250,240,.55); font: 600 12px var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.sn-seat-name { fill: #ffdf9e; font: 700 24px var(--serif); transition: opacity .3s; }
.sn-seat-name.is-swapping { opacity: 0; }
.sn-inbox-box { fill: #fffaf0; stroke: #C99A4B; stroke-width: 2; }
.sn-inbox-k { fill: #9a6d24; font: 900 12px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.sn-inbox-rule { stroke: var(--line); stroke-width: 1; }
.sn-inbox-lines text { fill: var(--ink); font: 500 13px var(--mono); }
.sn-inbox-lines text.is-new { fill: #9a6d24; font-weight: 700; }
.sn-inbox-lines text.is-receipt { fill: #0d7c77; font-weight: 700; }
.sn-inbox-foot { fill: var(--muted); font: 500 11px var(--mono); letter-spacing: .06em; }
.sn-msg { opacity: 0; transition: opacity .2s; }
.sn-msg.is-on { opacity: 1; }
.sn-msg rect { fill: #ffdf9e; filter: url(#sn-glow); }
.sn-msg text { fill: #17131c; font: 700 12px var(--mono); }
.sn-caption { fill: rgba(255,250,240,.55); font: 500 13px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.sn-legend { margin: 6px 0 0; font: 500 .74rem var(--mono); color: rgba(255,250,240,.6); letter-spacing: .04em; }
@media (max-width: 700px) {
  .sn-seat-k { font-size: 20px; }
  .sn-seat-name { font-size: 34px; }
  .sn-inbox-k { font-size: 18px; }
  .sn-inbox-lines text { font-size: 19px; }
  .sn-inbox-foot { font-size: 16px; }
  .sn-msg text { font-size: 18px; }
  .sn-caption { font-size: 18px; letter-spacing: .08em; }
}
/* On phones the network stays legible by scrolling sideways inside its own box. */
@media (max-width: 700px) { .seat-net { overflow-x: auto; -webkit-overflow-scrolling: touch; } .seat-net svg { min-width: 640px; } .sn-legend { white-space: normal; } }


/* ---- lifecycle keyword sparks: traces that fire off each stage ---- */
.lc-anim svg { max-height: 460px; }
.lc-spine { fill: none; stroke: rgba(255,223,158,.55); stroke-width: 1.4; stroke-dasharray: 200; stroke-dashoffset: 200; transition: stroke-dashoffset .5s var(--ease); }
.lc-spine.is-fired { stroke-dashoffset: 0; }
.lc-spark path { fill: none; stroke: rgba(255,223,158,.5); stroke-width: 1.2; }
.lc-spark circle { fill: #ffdf9e; }
.lc-spark text { fill: #ffe9c4; font: 500 10.5px var(--mono); letter-spacing: .04em; }
.lc-spark { opacity: 0; transform-box: fill-box; transform-origin: center; transition: opacity .25s var(--ease), transform .25s var(--ease); }
.lc-spark.is-flash { opacity: 1; filter: url(#lc-flash); transform: scale(1.06); }
.lc-spark.is-flash text { fill: #fff8e6; font-weight: 700; }
.lc-spark.is-flash circle { r: 3.4; }
.lc-spark.is-set { opacity: .82; }
@media (max-width: 700px) { .lc-sparks { display: none; } .lc-anim svg { max-height: none; } }
@media (prefers-reduced-motion: reduce) { html:not(.force-motion) .lc-spine { transition: none; } html:not(.force-motion) .lc-spark { transition: none; } }


/* ---- hero circuit: holographic trace firing across the artwork ---- */
.hero-circuit { position: absolute; left: 0; right: 0; top: 23%; height: 34%; z-index: 1; pointer-events: none; opacity: .96; mix-blend-mode: screen; }
.hero-circuit svg { width: 100%; height: 100%; display: block; overflow: visible; }
.hc-rail { fill: none; stroke: rgba(255,223,158,.42); stroke-width: 1.8; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 3px rgba(255,223,158,.35)); }
.hc-pulse { fill: none; stroke: #fff1cf; stroke-width: 3.2; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-dasharray: 34 680; animation: hc-run 5.5s linear infinite; filter: drop-shadow(0 0 8px rgba(255,223,158,1)); }
@keyframes hc-run { from { stroke-dashoffset: 1426; } to { stroke-dashoffset: 0; } }
.hc-node .hc-halo { fill: #C99A4B; opacity: 0; transition: opacity .35s var(--ease); }
.hc-node .hc-ring { fill: none; stroke: rgba(255,223,158,.55); stroke-width: 1.4; vector-effect: non-scaling-stroke; transition: stroke .3s; }
.hc-node .hc-dot { fill: rgba(255,223,158,.55); transition: fill .3s; }
.hc-node .hc-name { fill: rgba(255,233,196,.62); font: 700 15px var(--mono); letter-spacing: .18em; text-transform: uppercase; transition: fill .3s; text-shadow: 0 0 10px rgba(9,6,18,.9); }
.hc-node .hc-burst { fill: none; stroke: #ffdf9e; stroke-width: 2; opacity: 0; vector-effect: non-scaling-stroke; }
.hc-node.is-lit .hc-burst { animation: hc-burst .9s var(--ease) 1; }
@keyframes hc-burst { 0% { r: 10px; opacity: .9; } 100% { r: 46px; opacity: 0; } }
.hc-node.is-lit .hc-halo { opacity: .85; }
.hc-node.is-lit .hc-ring { stroke: #fff1cf; }
.hc-node.is-lit .hc-dot, .hc-node.is-set .hc-dot { fill: #fff8e6; }
.hc-node.is-lit .hc-name, .hc-node.is-set .hc-name { fill: #ffe9c4; }
.hc-node.is-set .hc-halo { opacity: .28; }
.hc-spark { opacity: 0; transition: opacity .18s var(--ease); }
.hc-spark path { fill: none; stroke: #ffdf9e; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.hc-spark circle { fill: #fff8e6; }
.hc-spark text { fill: #fff8e6; font: 700 13.5px var(--mono); letter-spacing: .06em; paint-order: stroke; stroke: rgba(9,6,18,.75); stroke-width: 3px; }
.hc-spark.is-flash { opacity: 1; filter: url(#hc-glow); }
.hc-spark.is-dim { opacity: .55; }
.hero-circuit.is-static .hc-spark { opacity: .55; }
.hero-circuit.is-static .hc-pulse { animation: none; stroke-dasharray: none; opacity: .35; }
@media (max-width: 900px) { .hero-circuit { display: none; } }
@media (prefers-reduced-motion: reduce) { html:not(.force-motion) .hc-pulse { animation: none; } }

/* ---- shared motion on the investor page ---- */
.quiet-hero.has-circuit .hero-circuit { top: 24%; height: 36%; }
.quiet-hero.has-circuit .hero-title { z-index: 2; }
.band .seat-net { max-width: 820px; }

/* ---- seat network inside tour panels and product pages ---- */
.tour-copy section > .seat-net, .sd-copy .seat-net, .prose .band > .seat-net { max-width: 820px; }
.seat-net[data-seat-net-preset="video"] .sn-seat-k { font-size: 11px; }