/* ============================================================================
   TBG V2 — components added on top of tbg.css. Nothing here restyles a v1
   component; every rule is new surface for a new page or a new interaction.
   Palette and type come from tbg.css and tokens.css; there are no colour
   literals below except in tokens.css.
   ============================================================================ */

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--void-2); color: var(--ink); padding: 10px 16px;
  border: 1px solid var(--hairline-strong); border-radius: var(--radius);
}
.skip-link:focus { left: 12px; top: 12px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.wrap { width: min(1180px, 100% - 48px); margin-inline: auto; }
@media (max-width: 719px) { .wrap { width: calc(100% - 32px); } }

.prose-wrap { max-width: 760px; }
.prose p { font-size: 16.5px; line-height: 1.72; color: var(--ink-2); margin: 0 0 1.1em; font-weight: 300; }
.prose--wide { max-width: 860px; }
.prose h2 { margin-top: 1.8em; }
.section__lede { color: var(--ink-3); font-size: 15.5px; line-height: 1.65; max-width: 62ch; margin: 0 0 28px; }
.section__eyebrow { font-family: var(--f-mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--label); margin: 0 0 10px; }
.section__title--small { font-size: 22px; }
.section__foot { margin-top: 26px; font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .04em; }
.section__foot a { color: var(--electric); }
.quiet-note { margin-top: 22px; color: var(--ink-3); font-size: 14px; line-height: 1.6; }
.quiet-note a { color: var(--electric); }
.cta-pair { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }

.nav-cta--mobile { display: none; }
@media (max-width: 899px) { .nav-cta--mobile { display: inline-flex; margin-left: auto; margin-right: 10px; } }

/* --------------------------------------------------------------- page heroes */
.phero { position: relative; isolation: isolate; overflow: hidden; padding: clamp(84px, 13vh, 150px) 0 clamp(48px, 7vh, 86px); background: var(--void); }
.phero__media { position: absolute; inset: 0; z-index: -2; }
.phero__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%; }
.phero::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, var(--hero-scrim-top) 0%, var(--hero-scrim-mid) 46%, var(--hero-scrim-top) 100%);
}
.phero--compact { padding-top: clamp(64px, 9vh, 104px); }
.phero__inner { position: relative; }
.phero__eyebrow { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--label); margin: 0 0 14px; }
.phero__title { font-size: clamp(30px, 5.2vw, 52px); line-height: 1.08; letter-spacing: -.02em; margin: 0 0 20px; max-width: 20ch; }
.phero__body { max-width: 66ch; }
.phero__body p { color: var(--ink-2); font-size: 16.5px; line-height: 1.7; font-weight: 300; margin: 0 0 1em; }

/* --label not --cyan: light-theme --cyan measures 3.47:1 on --void at 12.5px, fails AA. */
.hero__kicker { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .06em; color: var(--label); margin: 0 0 16px; }
.hero__body { max-width: 62ch; }
.hero__body p { color: var(--ink-2); font-size: 16.5px; line-height: 1.7; font-weight: 300; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* ---------------------------------------------------------------- lane router */
.lane-router__chips { display: flex; flex-wrap: wrap; gap: 10px; }
.lane-chip {
  appearance: none; cursor: pointer; font: inherit; font-size: 14px; font-weight: 500;
  padding: 11px 20px; border-radius: 999px; color: var(--ink-2);
  background: var(--void-3); border: 1px solid var(--hairline-strong);
  transition: border-color var(--dur-fast) var(--ease-out-soft), color var(--dur-fast) var(--ease-out-soft);
}
.lane-chip:hover { color: var(--ink); border-color: var(--electric); }
.lane-chip[aria-selected="true"] { color: var(--ink); border-color: var(--electric); box-shadow: inset 0 0 0 1px var(--electric); }
.lane-reveal { margin-top: 22px; min-height: 118px; }
.lane-reveal__body { max-width: 60ch; }
.lane-reveal__body p { color: var(--ink-2); font-size: 16px; line-height: 1.65; margin: 0 0 18px; }
.lane-router__nojs { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.lane-router__nojs a { color: var(--ink-2); }

/* ----------------------------------------------------------------- proof strip */
.proof__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.proof__item { border: 1px solid var(--hairline); border-radius: var(--radius); padding: 22px 20px; background: var(--void-2); display: grid; gap: 8px; align-content: start; }
.proof__stat { font-family: var(--f-mono); font-size: 38px; line-height: 1; color: var(--electric); }
.proof__label { font-size: 14.5px; color: var(--ink-2); line-height: 1.5; }
.proof__source { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .05em; color: var(--ink-3); border-top: 1px solid var(--hairline); padding-top: 8px; }

/* --------------------------------------------------------- discipline / routes */
.disc-grid, .route-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.disc-tile, .route-card {
  display: grid; gap: 8px; padding: 22px 20px; border-radius: var(--radius);
  border: 1px solid var(--hairline); background: var(--void-2); text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-out-soft), transform var(--dur-fast) var(--ease-out-soft);
}
.disc-tile:hover, .route-card:hover { border-color: var(--electric); transform: translateY(-2px); }
.disc-tile__label, .route-card__title { font-size: 17px; font-weight: 500; color: var(--ink); margin: 0; }
.disc-tile__line, .route-card__line { font-size: 14px; color: var(--ink-3); line-height: 1.55; }
.disc-tile__go, .route-card__go { font-family: var(--f-mono); color: var(--electric); }
.vision-v2__body { max-width: 68ch; }
.vision-v2__body p { font-size: 17px; line-height: 1.75; color: var(--ink-2); font-weight: 300; margin: 0 0 1.1em; }
.closing-band__body { max-width: 64ch; margin-bottom: 24px; }
.closing-band__body p { color: var(--ink-2); line-height: 1.7; font-weight: 300; }

/* ------------------------------------------------------- switcher (tabs) shell */
.switch-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 30px; border-bottom: 1px solid var(--hairline); padding-bottom: 14px; }
.switch-tab {
  display: inline-grid; gap: 2px; padding: 10px 16px; border-radius: var(--radius-sm);
  border: 1px solid var(--hairline-strong); background: var(--void-3);
  color: var(--ink-2); text-decoration: none; font-size: 14px; font-weight: 500;
}
.switch-tab:hover { color: var(--ink); border-color: var(--electric); }
.switch-tab[aria-selected="true"] { color: var(--ink); border-color: var(--electric); box-shadow: inset 0 0 0 1px var(--electric); }
.switch-tab__stage { font-family: var(--f-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.switch-strip--rail { position: sticky; top: 62px; z-index: 12; background: var(--void); }

/* Panels are ALWAYS in the served HTML — the collapse is added by JS. A visitor
   with JS off, and a crawler, get all seven disciplines and all five products. */
.prod-panels > .prod-panel + .prod-panel,
.disc-panels > .disc-panel + .disc-panel { margin-top: 56px; padding-top: 56px; border-top: 1px solid var(--hairline); }
.js-switcher .prod-panel[hidden], .js-switcher .disc-panel[hidden] { display: none; }

.prod-panel { display: grid; gap: 28px; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; }
@media (max-width: 899px) { .prod-panel { grid-template-columns: 1fr; } }
.prod-panel__img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--hairline); }
.prod-panel__title { font-size: 26px; margin: 0 0 6px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.prod-panel__one { color: var(--cyan); font-size: 15px; margin: 0 0 18px; }
.prod-panel__copy p { color: var(--ink-2); line-height: 1.7; font-size: 15.5px; font-weight: 300; margin: 0 0 1em; }
.prod-panel__sub, .disc-panel__sub, .cfg-result__sub, .agent-bio__sub, .sector-card__sub {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--label); margin: 22px 0 10px;
}
.prod-panel__who { color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.stage-pill { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; border: 1px solid currentColor; }
.stage-pill--live { color: var(--stage-live); }
.stage-pill--in-deployment, .stage-pill--in-production { color: var(--stage-soft); }
.stage-pill--in-build { color: var(--stage-build); }

.tick-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.tick-list li { position: relative; padding-left: 20px; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.tick-list li::before { content: '›'; position: absolute; left: 4px; color: var(--electric); font-family: var(--f-mono); }
.tick-list--you li::before { color: var(--cyan); }
.tick-list--inline { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }

.linkrow { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 16px; }
.linkrow--tight { margin-top: 8px; gap: 6px 14px; }
.linkrow__link { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .03em; color: var(--electric); text-decoration: none; }
.linkrow__link:hover { text-decoration: underline; }

/* --------------------------------------------------------------- capabilities */
.disc-panel__head { margin-bottom: 22px; }
.disc-panel__title { font-size: 28px; margin: 0 0 8px; }
.disc-panel__standard { color: var(--label); font-size: 15px; max-width: 60ch; margin: 0; }
.disc-panel__grid { display: grid; gap: 32px; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); align-items: start; }
@media (max-width: 899px) { .disc-panel__grid { grid-template-columns: 1fr; } }
.disc-panel__copy p { color: var(--ink-2); line-height: 1.72; font-size: 15.5px; font-weight: 300; margin: 0 0 1em; }
.disc-panel__side { border-left: 1px solid var(--hairline); padding-left: 24px; }
@media (max-width: 899px) { .disc-panel__side { border-left: 0; padding-left: 0; border-top: 1px solid var(--hairline); padding-top: 24px; } }
.disc-panel__img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--hairline); }
.disc-panel__accountability { margin-top: 14px; font-size: 13.5px; color: var(--ink-3); line-height: 1.6; border-left: 2px solid var(--electric); padding-left: 12px; }

/* ------------------------------------------------------------------ industries */
.sector-selector { display: grid; gap: 22px; margin-bottom: 34px; }
.sector-selector__legend { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--label); margin: 0 0 10px; }
.sector-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sector-chip { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px 9px 10px; border-radius: 999px; border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink-2); text-decoration: none; font-size: 14px; }
.sector-chip:hover, .sector-chip[aria-current="true"] { color: var(--ink); border-color: var(--electric); }
.sector-chip img { display: block; }
.sector-card { border: 1px solid var(--hairline); border-radius: var(--radius); padding: 26px 24px; background: var(--void-2); margin-bottom: 18px; }
.js-switcher .sector-card[hidden] { display: none; }
.sector-card__head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.sector-card__title { font-size: 22px; margin: 0; }
.sector-card__summary { color: var(--cyan); font-size: 15.5px; line-height: 1.6; margin: 0 0 16px; max-width: 62ch; }
.sector-card p { color: var(--ink-2); line-height: 1.7; font-size: 15.5px; font-weight: 300; }
.sector-card__stub { color: var(--ink-2); font-size: 15px; line-height: 1.65; margin: 0; }
.tense-pill { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; border: 1px solid currentColor; }
.tense-pill--present { color: var(--stage-live); }
.tense-pill--subjunctive { color: var(--phi-ink); }
/* Injected from phi_sensitive by the build script and written nowhere else, so
   a medical card structurally cannot ship without it. */
.phi-ribbon {
  background: var(--phi-bg); color: var(--phi-ink); border: 1px solid var(--phi-rule);
  border-radius: var(--radius-sm); padding: 12px 16px; margin: 0 0 18px;
  font-size: 14px; font-weight: 500; line-height: 1.5;
}
.outcome-grid { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.outcome { border: 1px solid var(--hairline); border-radius: var(--radius-sm); padding: 16px; background: var(--void-3); }
.outcome__title { font-size: 15px; margin: 0 0 6px; }
.outcome__body { font-size: 14px; color: var(--ink-3); line-height: 1.55; margin: 0; }
.sector-stubs { margin-top: 54px; padding-top: 40px; border-top: 1px solid var(--hairline); }
.sector-cards--stubs { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.sector-cards--stubs .sector-card { margin-bottom: 0; }

/* ------------------------------------------------------------------- workforce */
.cfg { display: grid; gap: 26px; margin-bottom: 34px; }
.cfg__legend { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--label); margin: 0 0 10px; }
.cfg__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cfg-chip { appearance: none; cursor: pointer; font: inherit; font-size: 14px; display: inline-grid; gap: 2px; padding: 10px 18px; border-radius: var(--radius-sm); border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink-2); }
.cfg-chip:hover { color: var(--ink); border-color: var(--electric); }
.cfg-chip[aria-pressed="true"] { color: var(--ink); border-color: var(--electric); box-shadow: inset 0 0 0 1px var(--electric); }
.cfg-chip__hint { font-family: var(--f-mono); font-size: 10px; letter-spacing: .08em; color: var(--ink-3); }
.cfg-result { border: 1px solid var(--hairline); border-radius: var(--radius); padding: 28px 26px; background: var(--void-2); }
.cfg-result__title { font-size: 20px; margin: 0 0 16px; }
.bench { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 10px; }
.bench__seat { display: grid; gap: 2px; padding-left: 16px; border-left: 2px solid var(--electric); }
.bench__seat b { font-size: 15px; color: var(--ink); }
.bench__seat span { font-size: 14px; color: var(--ink-3); line-height: 1.55; }
.cfg-result__cols { display: grid; gap: 26px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.cfg-result__note { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--hairline); font-size: 13.5px; color: var(--ink-3); line-height: 1.6; }
.cfg-result__note a { color: var(--electric); }
.cfg-table { width: 100%; border-collapse: collapse; margin-top: 20px; font-size: 13px; }
.cfg-table th, .cfg-table td { border: 1px solid var(--hairline); padding: 8px 10px; text-align: left; }

/* ---------------------------------------------------------------------- legion */
.roster-filter { margin-bottom: 26px; }
.roster-filter__legend { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--label); margin: 0 0 10px; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-chip { padding: 8px 15px; border-radius: 999px; border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink-2); text-decoration: none; font-size: 13.5px; }
.filter-chip:hover, .filter-chip[aria-pressed="true"] { color: var(--ink); border-color: var(--electric); }
.roster-filter__count { font-family: var(--f-mono); font-size: 11.5px; color: var(--ink-3); margin: 12px 0 0; }
.roster-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); }
.roster-card { display: grid; gap: 6px; padding: 14px; border: 1px solid var(--hairline); border-radius: var(--radius); background: var(--void-2); text-decoration: none; }
.roster-card:hover { border-color: var(--electric); }
.roster-card[hidden] { display: none; }
.roster-card__img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; border-radius: var(--radius-sm); border: 1px solid var(--hairline); }
.roster-card__name { font-size: 15.5px; color: var(--ink); font-weight: 500; }
.roster-card__title { font-size: 12.5px; color: var(--ink-3); line-height: 1.45; }
.agent-bios { display: grid; gap: 40px; }
.agent-bio { display: grid; gap: 24px; grid-template-columns: 170px minmax(0, 1fr); align-items: start; scroll-margin-top: 90px; }
@media (max-width: 719px) { .agent-bio { grid-template-columns: 110px minmax(0, 1fr); gap: 16px; } }
.agent-bio__img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--hairline); }
.agent-bio__name { font-size: 21px; margin: 0 0 8px; }
.agent-bio__title { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); display: block; margin-top: 4px; }
.agent-bio__archetype { color: var(--label); font-size: 15px; line-height: 1.6; margin: 0 0 12px; font-style: italic; }
.agent-bio__body { color: var(--ink-2); font-size: 15.5px; line-height: 1.7; font-weight: 300; margin: 0; }

/* ------------------------------------------------------------------- boardroom */
.dispatch__console { border: 1px solid var(--hairline-strong); border-radius: var(--radius); padding: 26px 24px; background: var(--void-2); display: grid; gap: 22px; }
.dispatch__legend { font-family: var(--f-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--label); margin: 0 0 10px; display: block; }
.disp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.disp-chip { appearance: none; cursor: pointer; font: inherit; font-size: 13.5px; padding: 9px 16px; border-radius: 999px; border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink-2); }
.disp-chip:hover { color: var(--ink); border-color: var(--electric); }
.disp-chip[aria-pressed="true"] { color: var(--ink); border-color: var(--electric); box-shadow: inset 0 0 0 1px var(--electric); }
.disp-select { font: inherit; font-size: 15px; padding: 11px 14px; width: min(460px, 100%); border-radius: var(--radius-sm); border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink); }
.dispatch__transcript { min-height: 40px; display: grid; gap: 10px; }
.dispatch__transcript:empty { display: none; }
.disp-line { display: flex; gap: 12px; align-items: baseline; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--void-3); border-left: 2px solid var(--electric); font-size: 14.5px; color: var(--ink-2); line-height: 1.55; }
.disp-line--outcome { border-left-color: var(--stage-live); background: var(--void-4); }
.disp-line__who { font-family: var(--f-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--label); flex: none; }
.dispatch__after { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.nojs-scenario { border: 1px solid var(--hairline); border-radius: var(--radius-sm); padding: 10px 14px; margin-bottom: 8px; }
.nojs-scenario__out { color: var(--ink-2); font-size: 14px; }
.stepcards { list-style: none; padding: 0; margin: 30px 0 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); counter-reset: none; }
.stepcard { border: 1px solid var(--hairline); border-radius: var(--radius); padding: 20px; background: var(--void-2); display: grid; gap: 8px; align-content: start; }
.stepcard__n { font-family: var(--f-mono); font-size: 12px; color: var(--electric); }
.stepcard__title { font-size: 16px; margin: 0; }
.stepcard__body { font-size: 14px; color: var(--ink-3); line-height: 1.55; margin: 0; }
.stepcard__link { font-family: var(--f-mono); font-size: 12px; color: var(--electric); text-decoration: none; }

/* ---------------------------------------------------------------------- engage */
.lane-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.lane-tab { display: inline-grid; gap: 3px; padding: 12px 20px; border-radius: var(--radius-sm); border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink-2); text-decoration: none; font-size: 15px; font-weight: 500; border-bottom-width: 3px; }
.lane-tab__who { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.lane-tab[data-lane-tint="invest"] { border-bottom-color: var(--lane-invest); }
.lane-tab[data-lane-tint="partner"] { border-bottom-color: var(--lane-partner); }
.lane-tab[data-lane-tint="join"] { border-bottom-color: var(--lane-join); }
.lane-tab[data-lane-tint="amplify"] { border-bottom-color: var(--lane-amplify); }
.lane-tab[aria-current="true"] { color: var(--ink); background: var(--void-2); }
.lane-panels { display: grid; gap: 24px; }
.lane-panel { border: 1px solid var(--hairline); border-radius: var(--radius); padding: 28px 26px; background: var(--void-2); scroll-margin-top: 90px; border-top-width: 3px; }
.lane-panel[data-lane-tint="invest"] { border-top-color: var(--lane-invest); }
.lane-panel[data-lane-tint="partner"] { border-top-color: var(--lane-partner); }
.lane-panel[data-lane-tint="join"] { border-top-color: var(--lane-join); }
.lane-panel[data-lane-tint="amplify"] { border-top-color: var(--lane-amplify); }
.lane-panel__title { font-size: 23px; margin: 0 0 4px; }
.lane-panel__who { font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 18px; }
.lane-panel__pitch { color: var(--ink-2); font-size: 15.5px; line-height: 1.7; font-weight: 300; max-width: 66ch; }
.lane-panel__next { color: var(--ink-3); font-size: 14px; line-height: 1.6; max-width: 62ch; margin-bottom: 22px; }
.lane-panel__qr { display: inline-flex; align-items: center; gap: 12px; margin-top: 20px; color: var(--ink-3); font-size: 13px; text-decoration: none; }
.js-lanes .lane-panel[hidden] { display: none; }

.capture-form { display: grid; gap: 14px; max-width: 560px; }
.form-row { display: grid; gap: 6px; }
.form-row label { font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.form-row input, .form-row textarea { font: inherit; font-size: 15px; padding: 11px 13px; border-radius: var(--radius-sm); border: 1px solid var(--hairline-strong); background: var(--void-3); color: var(--ink); width: 100%; }
.form-row input:focus, .form-row textarea:focus { outline: 2px solid var(--electric); outline-offset: 1px; }
.form-req { color: var(--electric); }
.form-consent { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border: 1px solid var(--hairline-strong); border-radius: var(--radius-sm); background: var(--void-3); }
.form-consent input { margin-top: 3px; width: 17px; height: 17px; accent-color: var(--electric); flex: none; }
.form-consent label { font-size: 14px; color: var(--ink-2); line-height: 1.5; }
.form-privacy { font-size: 12.5px; color: var(--ink-3); margin: 0; }
.form-privacy a { color: var(--electric); }
.form-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.form-alt { font-size: 13px; color: var(--ink-3); }
.form-alt a { color: var(--ink-2); }
.form-status { font-size: 14px; margin: 0; min-height: 1.2em; }
.form-status[data-state="ok"] { color: var(--stage-live); }
.form-status[data-state="err"] { color: var(--phi-ink); }
.btn.is-disabled { opacity: .55; }
.btn.is-disabled:hover { opacity: .72; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* -------------------------------------------------------------------- exchange */
.vcard-give { display: grid; gap: 32px; grid-template-columns: minmax(0, 4fr) minmax(0, 6fr); align-items: center; }
@media (max-width: 819px) { .vcard-give { grid-template-columns: 1fr; } }
.vcard-give__card { border: 1px solid var(--hairline-strong); border-radius: var(--radius); padding: 28px 24px; background: var(--void-2); display: grid; gap: 6px; }
.vcard-give__name { font-size: 20px; color: var(--ink); margin: 12px 0 4px; }
.vcard-give__line { font-size: 14px; color: var(--ink-3); margin: 0; line-height: 1.55; }
.vcard-give__line--mono { font-family: var(--f-mono); font-size: 13px; color: var(--label); }
.campaign-slot { min-height: 1.2em; }

/* ------------------------------------------------------------------ ask + qr */
.ask-band { border-top: 1px solid var(--hairline); padding: 54px 0; background: var(--void-3); }
.ask-band__head { margin-bottom: 24px; }
.ask-band__title { font-size: 26px; margin: 0 0 6px; }
.ask-band__sub { color: var(--ink-3); font-size: 14.5px; margin: 0; }
.ask-band__lanes { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.ask-band__lane { display: grid; gap: 5px; padding: 18px; border-radius: var(--radius); border: 1px solid var(--hairline-strong); background: var(--void-2); text-decoration: none; border-left-width: 3px; }
.ask-band__lane[data-lane="invest"] { border-left-color: var(--lane-invest); }
.ask-band__lane[data-lane="partner"] { border-left-color: var(--lane-partner); }
.ask-band__lane[data-lane="join"] { border-left-color: var(--lane-join); }
.ask-band__lane[data-lane="amplify"] { border-left-color: var(--lane-amplify); }
.ask-band__lane:hover { border-color: var(--electric); }
.ask-band__lane-label { font-size: 16px; color: var(--ink); font-weight: 500; }
.ask-band__lane-blurb { font-size: 13.5px; color: var(--ink-3); line-height: 1.5; }

.qr-block__inner { display: flex; gap: 34px; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.qr-block__copy { max-width: 54ch; }
.qr-block__body { color: var(--ink-2); line-height: 1.65; margin: 0 0 20px; }
.qr-block__code { display: block; padding: 14px; background: #fff; border-radius: var(--radius); border: 1px solid var(--hairline-strong); }
.qr-tile { display: grid; gap: 8px; justify-items: center; padding: 12px; background: #fff; border-radius: var(--radius); text-decoration: none; color: #0b1220; font-size: 12px; }

.site-footer { border-top: 1px solid var(--hairline); padding: 44px 0 60px; }
.site-footer__inner { display: grid; gap: 30px; grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(0, 3fr); align-items: start; }
@media (max-width: 899px) { .site-footer__inner { grid-template-columns: 1fr; } }
.site-footer__line { color: var(--ink-3); font-size: 14px; line-height: 1.6; margin: 12px 0 0; max-width: 42ch; }
.site-footer__line--muted { color: var(--ink-4); font-size: 13px; }
.site-footer__nav { display: grid; gap: 9px; grid-template-columns: 1fr 1fr; }
.site-footer__nav a { color: var(--ink-3); font-size: 14px; text-decoration: none; }
.site-footer__nav a:hover { color: var(--ink); }
.site-footer__card { display: grid; gap: 12px; justify-items: start; }
.site-footer__mail { font-family: var(--f-mono); font-size: 13px; color: var(--electric); }

.draft-flag { border: 1px solid var(--phi-rule); background: var(--phi-bg); color: var(--phi-ink); padding: 14px 16px; border-radius: var(--radius-sm); font-size: 14px; line-height: 1.55; }
.prose-page { padding-top: 110px; }

/* ------------------------------------------------------- guided tour: spotlight */
.emily-dock-reserve { height: 0; }
.chapter-offer { margin-top: 26px; }

/* A dim with the active section punched out. pointer-events:none is the whole
   difference from the modal it replaces: the page underneath stays live. */
.tour-spotlight {
  position: fixed; inset: 0; z-index: 30; pointer-events: none;
  background: var(--spotlight-dim);
  clip-path: polygon(
    0 0, 100% 0, 100% 100%, 0 100%, 0 0,
    var(--sx, 0px) var(--sy, 0px),
    var(--sx, 0px) calc(var(--sy, 0px) + var(--sh, 0px)),
    calc(var(--sx, 0px) + var(--sw, 0px)) calc(var(--sy, 0px) + var(--sh, 0px)),
    calc(var(--sx, 0px) + var(--sw, 0px)) var(--sy, 0px),
    var(--sx, 0px) var(--sy, 0px)
  );
  transition: clip-path 320ms cubic-bezier(.4, 0, .6, 1), opacity 200ms linear;
}
.tour-spotlight[data-away="true"] { opacity: .35; }
.tour-spotlight__halo {
  position: absolute; left: var(--sx, 0px); top: var(--sy, 0px);
  width: var(--sw, 0px); height: var(--sh, 0px);
  outline: 2px solid var(--spotlight-halo); outline-offset: 2px;
  border-radius: var(--radius);
  transition: all 320ms cubic-bezier(.4, 0, .6, 1);
}
/* C-2, 2026-09-07 — `data-spotlight="on"` was set on the widget and styled
   nothing: a live hook that meant nothing, which is how the next reader loses an
   hour. It earns its keep here. While the spotlight is up the page behind Emily
   is dimmed, and against a dimmed page her --shadow-lg reads as a dark blob with
   no edge. A hairline in the halo's own colour ties the two lit things together
   — she and the section she is describing are the same lit scene — and the
   softer shadow stops her floating over it. Halo colour only; no new token. */
.emily[data-spotlight="on"] .emily__panel {
  border-color: var(--spotlight-halo);
  box-shadow: var(--shadow-md);
}

.tour-return-chip {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 26px; z-index: 45;
  appearance: none; cursor: pointer; font: inherit; font-size: 13.5px;
  padding: 10px 18px; border-radius: 999px; border: 1px solid var(--electric);
  background: var(--void-2); color: var(--ink);
}
.emily__sound-affordance {
  appearance: none; cursor: pointer; font: inherit; font-size: 13px; width: 100%;
  padding: 10px 14px; border: 1px solid var(--phi-rule); background: var(--phi-bg);
  color: var(--phi-ink); border-radius: var(--radius-sm); text-align: left;
}

@media (prefers-reduced-motion: reduce) {
  .tour-spotlight, .tour-spotlight__halo { transition: none; }
  .disc-tile, .route-card { transition: none; }
}

/* Emily must never sit on top of an open modal or the nav drawer. */
#emily-widget { z-index: 40; }
.nav-drawer, .nav-drawer__backdrop, .contact-modal { z-index: 60; }
/* A bottom-anchored panel with a fixed-tall child grows off the top of a short
   viewport — a class of bug this widget has already shipped once. */
.emily__panel { max-height: min(70dvh, 640px); overflow: auto; }
@media (max-width: 819px) {
  /* 38dvh starved the bottom sheet. The hood alone is capped at 34dvh
     (emily.css), so the caption was left 62px of a 231px script — 27% of the
     narration, on the one surface where the caption may be her only channel.
     Note this `max-height` outranks the sheet's own `height: 78dvh` whichever
     stylesheet loads last, so the bound must sit ABOVE that height to stay a
     safety net instead of becoming the thing doing the clipping. */
  .emily__panel { max-height: 80dvh; }
}

/* ---------------------------------------------------------- guided-tour doors
   QC 2026-09-05: the tour engine worked and no page admitted it existed. Ten
   pages said the word "tour" zero times and there was no per-section affordance
   anywhere, so the whole narration library was reachable only by noticing a
   56px orb and clicking twice. These are the two doors.

   Both borrow the existing vocabulary rather than introducing one: the invite is
   the shipped .btn--ghost --small, and the per-section control is the same pill
   geometry as .stage-pill / .tense-pill. No literal colours — every value here
   is a token that already flips with the theme. */
.tour-invite-band {
  border-bottom: 1px solid var(--hairline);
  background: var(--void-2);
}
.tour-invite {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  padding: 14px 0;
}
.tour-invite__note {
  font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3);
}
/* On the home hero the button sits in .hero__actions with the other CTAs, so
   only the running time needs a home of its own. */
.hero__tour-note {
  margin: 14px 0 0;
  font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3);
}

.emily-ask {
  appearance: none; -webkit-appearance: none; cursor: pointer; font: inherit;
  display: inline-flex; align-items: center; gap: 7px;
  margin: 0 0 18px; padding: 5px 13px 5px 10px;
  font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid var(--hairline-strong); border-radius: 999px;
  background: transparent; color: var(--ink-3);
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease),
              background var(--dur) var(--ease);
}
.emily-ask:hover { color: var(--ink); border-color: var(--electric); background: var(--void-3); }
.emily-ask:focus-visible { outline: 2px solid var(--electric); outline-offset: 2px; }
.emily-ask__icon { width: 13px; height: 13px; flex: none; color: var(--electric); }
/* A heading is a block, so the pill starts its own line under it — except in the
   flex head on /industries, where it joins the title row. */
.sector-card__head .emily-ask { margin-bottom: 0; }
.disc-panel__head .emily-ask { margin-bottom: 12px; }

@media (prefers-reduced-motion: reduce) {
  .emily-ask { transition: none; }
}