/* ==========================================================================
   Elite X Holdings — site stylesheet
   Layout concept: a 12-column architectural grid on Midnight Navy; full-bleed
   cinematic plates alternate with tight typographic bays. The X (two crossing
   strokes: discipline in Off-White, ambition in Electric Blue) is the one
   recurring graphic device.
   ========================================================================== */

/* Self-hosted variable fonts (SIL Open Font License) */
@font-face { font-family: "Archivo"; src: url("../fonts/archivo-var.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/instrument-sans-var.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-italic-var.woff2") format("woff2"); font-weight: 200 800; font-style: italic; font-display: swap; }

:root {
  color-scheme: dark;

  /* Brand palette */
  --navy: #0B101B;        /* Midnight Navy — page ground */
  --navy-deep: #070B13;   /* footer, overlays */
  --slate: #162438;       /* Slate — raised surfaces */
  --slate-hi: #1E3049;    /* hover / active surfaces */
  --blue: #347CFA;        /* Electric Blue — the single accent */
  --blue-hi: #6A9FFF;     /* accent on dark text sizes (AA at small sizes) */
  --off: #F5F7FA;         /* Off-White — primary text */
  --mist: #A9B5C6;        /* secondary text, blue-biased neutral */
  --dim: #75839A;         /* tertiary text, captions */
  --line: rgba(245, 247, 250, 0.10);
  --line-strong: rgba(245, 247, 250, 0.22);
  --ok: #4CC38A;
  --err: #FF7A7A;

  /* Type */
  --f-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --f-body: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --f-serif: "Newsreader", Georgia, "Times New Roman", serif;

  --t-hero: clamp(3rem, 1.2rem + 6.9vw, 8.4rem);
  --t-h1: clamp(2.6rem, 1.3rem + 4.9vw, 6.4rem);
  --t-h2: clamp(2rem, 1.2rem + 2.9vw, 4.1rem);
  --t-h3: clamp(1.3rem, 1.1rem + 0.7vw, 1.7rem);
  --t-lead: clamp(1.125rem, 1.02rem + 0.42vw, 1.375rem);
  --t-statement: clamp(1.6rem, 1rem + 2.3vw, 3.15rem);
  --t-body: 1.0625rem;
  --t-small: 0.9rem;
  --t-label: 0.75rem;

  /* Space & layout */
  --g: clamp(20px, 4.6vw, 72px);
  --maxw: 1380px;
  --bay: clamp(88px, 6vw + 56px, 168px);
  --header-h: 76px;
  --ease: cubic-bezier(0.2, 0.7, 0.1, 1);
  --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
}

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.35s; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); background: var(--navy); }
body {
  margin: 0;
  background: var(--navy);
  color: var(--off);
  font: 400 var(--t-body)/1.65 var(--f-body);
  font-variation-settings: "wdth" 100;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
body.is-locked { overflow: hidden; }
img, picture, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 1em; }
h1, h2, h3, h4 { margin: 0; font-weight: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--blue); color: var(--off); }
:focus-visible { outline: 2px solid var(--blue-hi); outline-offset: 3px; }

.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 200;
  background: var(--blue); color: var(--off); padding: 12px 18px; font-weight: 600;
}
.skip-link:focus { top: calc(12px + env(safe-area-inset-top, 0px)); }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Layout primitives ---------- */
.wrap {
  width: 100%;
  max-width: calc(var(--maxw) + 2 * var(--g));
  margin-inline: auto;
  padding-left: max(var(--g), env(safe-area-inset-left, 0px));
  padding-right: max(var(--g), env(safe-area-inset-right, 0px));
}
.grid12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); }
.bay { padding-block: var(--bay); position: relative; }
.bay--tight { padding-block: calc(var(--bay) * 0.66); }
.bay--slate { background: var(--slate); }
.bay--rule { border-top: 1px solid var(--line); }

/* ---------- Type ---------- */
.display, .h1, .h2, .h3 {
  font-family: var(--f-display);
  font-variation-settings: "wdth" 112;
  text-wrap: balance;
}
.display { font-size: var(--t-hero); font-weight: 560; line-height: 0.94; letter-spacing: -0.042em; }
.h1 { font-size: var(--t-h1); font-weight: 560; line-height: 0.98; letter-spacing: -0.038em; }
.h2 { font-size: var(--t-h2); font-weight: 540; line-height: 1.02; letter-spacing: -0.032em; }
.h3 { font-size: var(--t-h3); font-weight: 560; line-height: 1.18; letter-spacing: -0.016em; font-variation-settings: "wdth" 106; }
.lead { font-size: var(--t-lead); line-height: 1.55; color: var(--mist); max-width: 40ch; text-wrap: pretty; }
.lead--wide { max-width: 56ch; }
.prose { max-width: 64ch; color: var(--mist); text-wrap: pretty; }
.prose p + p { margin-top: 0.2em; }
.prose strong { color: var(--off); font-weight: 600; }
.muted { color: var(--mist); }
.accent { color: var(--blue-hi); }

.label {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--f-display); font-variation-settings: "wdth" 100;
  font-size: var(--t-label); font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--blue-hi); margin: 0 0 28px;
}
.label::before {
  content: ""; width: 14px; height: 14px; flex: none;
  background:
    linear-gradient(45deg, transparent calc(50% - 1px), var(--blue) calc(50% - 1px), var(--blue) calc(50% + 1px), transparent calc(50% + 1px)),
    linear-gradient(-45deg, transparent calc(50% - 1px), var(--off) calc(50% - 1px), var(--off) calc(50% + 1px), transparent calc(50% + 1px));
  opacity: 0.9;
}
.label--plain::before { display: none; }

.quote {
  font-family: var(--f-serif); font-style: italic; font-weight: 340;
  font-size: clamp(1.7rem, 1.1rem + 2.3vw, 3.2rem); line-height: 1.16; letter-spacing: -0.012em;
  text-wrap: balance; margin: 0;
}
.quote-mark { color: var(--blue); }
.cite { display: block; margin-top: 28px; font: 600 var(--t-label)/1.4 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); font-style: normal; }

/* ---------- Buttons & links ---------- */
.btn {
  --bg: var(--blue); --fg: var(--off); --bd: var(--blue);
  position: relative; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px;
  min-height: 54px; padding: 0 22px 0 26px;
  background: var(--bg); color: var(--fg); border: 1px solid var(--bd);
  font: 600 0.8125rem/1 var(--f-display); font-variation-settings: "wdth" 108; letter-spacing: 0.14em; text-transform: uppercase;
  cursor: pointer; overflow: hidden; isolation: isolate;
  transition: color 0.35s var(--ease), border-color 0.35s var(--ease);
}
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--off);
  transform: scaleX(0); transform-origin: right; transition: transform 0.5s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before { transform: scaleX(1); transform-origin: left; }
.btn:hover, .btn:focus-visible { color: var(--navy); border-color: var(--off); }
.btn .arr { width: 16px; height: 16px; flex: none; transition: transform 0.45s var(--ease); }
.btn:hover .arr { transform: translateX(4px); }
.btn--ghost { --bg: transparent; --bd: var(--line-strong); }
.btn[disabled] { opacity: 0.6; cursor: progress; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }

.tlink {
  display: inline-flex; align-items: center; gap: 12px;
  font: 600 0.8125rem/1 var(--f-display); font-variation-settings: "wdth" 108; letter-spacing: 0.14em; text-transform: uppercase;
  padding-block: 10px; background: linear-gradient(var(--blue), var(--blue)) left bottom / 0 1px no-repeat;
  transition: background-size 0.5s var(--ease), color 0.3s;
}
.tlink:hover, .tlink:focus-visible { background-size: 100% 1px; color: var(--off); }
.tlink .arr { width: 14px; height: 14px; color: var(--blue-hi); transition: transform 0.45s var(--ease); }
.tlink:hover .arr { transform: translateX(4px); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  padding-top: env(safe-area-inset-top, 0px);
  transition: background-color 0.4s var(--ease), border-color 0.4s var(--ease), transform 0.45s var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header.is-solid { background: rgba(11, 16, 27, 0.82); -webkit-backdrop-filter: blur(18px) saturate(1.2); backdrop-filter: blur(18px) saturate(1.2); border-bottom-color: var(--line); }
.site-header.is-hidden { transform: translateY(-100%); }
.header-inner { height: var(--header-h); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; flex: none; line-height: 1; }
.brand-mark { width: 24px; height: 24px; flex: none; margin-right: 6px; }
.brand-word { font: 640 1.375rem/1 var(--f-display); font-variation-settings: "wdth" 122; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap; }
.brand-word b { font-weight: 640; color: var(--blue-hi); }
.brand-sub { font: 600 0.625rem/1 var(--f-display); font-variation-settings: "wdth" 100; letter-spacing: 0.34em; text-transform: uppercase; color: var(--mist); padding-left: 14px; border-left: 1px solid var(--line-strong); white-space: nowrap; }
@media (max-width: 420px) { .brand-sub { display: none; } }
.nav { display: flex; align-items: center; gap: clamp(18px, 2.2vw, 36px); }
.nav a:not(.btn) {
  position: relative; font-size: 0.875rem; font-weight: 500; color: var(--mist); padding-block: 8px; white-space: nowrap;
  transition: color 0.25s;
}
.nav a:not(.btn)::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--blue);
  transform: scaleX(0); transform-origin: left; transition: transform 0.45s var(--ease);
}
.nav a:not(.btn):hover, .nav a[aria-current="page"] { color: var(--off); }
.nav a:not(.btn):hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav .btn { min-height: 44px; padding: 0 16px 0 18px; gap: 16px; font-size: 0.75rem; }

.menu-btn {
  display: none; position: relative; width: 48px; height: 48px; margin-right: -12px;
  background: none; border: 0; cursor: pointer; z-index: 120;
}
.menu-btn span {
  position: absolute; left: 13px; right: 13px; height: 1.5px; background: var(--off);
  transition: transform 0.5s var(--ease), top 0.5s var(--ease), background-color 0.3s;
}
.menu-btn span:nth-child(1) { top: 19px; }
.menu-btn span:nth-child(2) { top: 28px; background: var(--blue); }
.menu-btn[aria-expanded="true"] span:nth-child(1) { top: 23.5px; transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] span:nth-child(2) { top: 23.5px; transform: rotate(-45deg); }

.mobile-nav {
  position: fixed; inset: 0; z-index: 95; background: var(--navy);
  padding: calc(var(--header-h) + 24px + env(safe-area-inset-top, 0px)) max(var(--g), env(safe-area-inset-right, 0px)) calc(32px + env(safe-area-inset-bottom, 0px)) max(var(--g), env(safe-area-inset-left, 0px));
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px; overflow-y: auto;
  clip-path: inset(0 0 100% 0); visibility: hidden;
  transition: clip-path 0.7s var(--ease-io), visibility 0s linear 0.7s;
}
.mobile-nav.is-open { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path 0.7s var(--ease-io), visibility 0s; }
.mobile-nav ol { display: grid; gap: 4px; counter-reset: m; }
.mobile-nav li { overflow: hidden; }
.mobile-nav ol a {
  display: flex; align-items: baseline; gap: 16px; padding-block: 6px;
  font: 540 clamp(2rem, 8.5vw, 3.2rem)/1.08 var(--f-display); font-variation-settings: "wdth" 112; letter-spacing: -0.03em;
  transform: translateY(105%); transition: transform 0.8s var(--ease), color 0.25s;
}
.mobile-nav ol a::before { counter-increment: m; content: "0" counter(m); font: 600 0.75rem/1 var(--f-display); letter-spacing: 0.16em; color: var(--blue-hi); transform: translateY(-0.9em); }
.mobile-nav ol a[aria-current="page"] { color: var(--blue-hi); }
.mobile-nav.is-open ol a { transform: none; }
.mobile-nav.is-open li:nth-child(2) a { transition-delay: 0.05s; }
.mobile-nav.is-open li:nth-child(3) a { transition-delay: 0.10s; }
.mobile-nav.is-open li:nth-child(4) a { transition-delay: 0.15s; }
.mobile-nav.is-open li:nth-child(5) a { transition-delay: 0.20s; }
.mobile-nav.is-open li:nth-child(6) a { transition-delay: 0.25s; }
.mobile-nav.is-open li:nth-child(7) a { transition-delay: 0.30s; }
.mobile-nav-foot { color: var(--mist); font-size: var(--t-small); display: grid; gap: 20px; }
.mobile-nav-foot .btn { width: 100%; }

@media (max-width: 1080px) {
  .nav { display: none; }
  .menu-btn { display: block; }
}
@media (min-width: 1081px) { .mobile-nav { display: none; } }

/* ---------- Plates (cinematic imagery) ---------- */
.plate { position: relative; overflow: hidden; background: var(--navy-deep); }
.plate picture, .plate img { width: 100%; height: 100%; }
.plate img { object-fit: cover; }
.plate--frame { aspect-ratio: 4 / 5; max-width: 100%; }
.plate--wide { aspect-ratio: 16 / 9; max-width: 100%; }
.plate--cine { aspect-ratio: 2.39 / 1; max-width: 100%; }
.plate .zoom { transform: scale(1.06); transition: transform 1.8s var(--ease); }
.plate.is-in .zoom, .no-js .plate .zoom { transform: none; }

/* ---------- Hero (home) ---------- */
.hero {
  position: relative; isolation: isolate;
  min-height: min(100svh, 980px); min-height: min(100vh, 980px);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding-top: calc(var(--header-h) + 64px); padding-bottom: clamp(40px, 6vh, 72px);
  overflow: hidden;
}
@supports (height: 100svh) { .hero { min-height: min(100svh, 980px); } }
.hero-media { position: absolute; inset: 0; z-index: -2; }
.hero-media picture, .hero-media img { width: 100%; height: 100%; }
.hero-media img { object-fit: cover; object-position: 72% 50%; animation: heroZoom 2.8s var(--ease) both; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(11,16,27,0.92) 0%, rgba(11,16,27,0.72) 34%, rgba(11,16,27,0.08) 70%),
    linear-gradient(0deg, var(--navy) 0%, rgba(11,16,27,0) 34%),
    linear-gradient(180deg, rgba(11,16,27,0.55) 0%, rgba(11,16,27,0) 22%);
}
.hero-copy { max-width: 1100px; }
.hero .display { margin: 0 0 clamp(24px, 3vw, 40px); }
.hero .lead { color: #C3CDDB; max-width: 46ch; margin-bottom: 40px; }
.hero-foot {
  margin-top: clamp(48px, 8vh, 96px); padding-top: 22px; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; align-items: center;
  font: 600 var(--t-label)/1.4 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--mist);
}
.hero-foot .scroll-cue { display: inline-flex; align-items: center; gap: 12px; }
.scroll-cue i { display: block; width: 1px; height: 28px; background: linear-gradient(var(--blue), transparent); animation: cue 2.2s var(--ease-io) infinite; transform-origin: top; }

/* Line-mask headline reveal */
.reveal-lines .ln { display: block; overflow: hidden; padding-bottom: 0.06em; margin-bottom: -0.06em; }
.reveal-lines .ln > span { display: block; animation: lineUp 1.1s var(--ease) both; }
.reveal-lines .ln:nth-child(2) > span { animation-delay: 0.09s; }
.reveal-lines .ln:nth-child(3) > span { animation-delay: 0.18s; }
.fade-up { animation: fadeUp 1s var(--ease) 0.35s both; }
.fade-up-2 { animation: fadeUp 1s var(--ease) 0.5s both; }

@keyframes lineUp { from { transform: translateY(104%); } to { transform: none; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes heroZoom { from { transform: scale(1.08); } to { transform: none; } }
@keyframes cue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }

/* ---------- Page hero (inner pages) ---------- */
.phero { position: relative; isolation: isolate; padding-top: calc(var(--header-h) + clamp(72px, 12vh, 150px)); padding-bottom: clamp(56px, 8vh, 96px); overflow: hidden; }
.phero-media { position: absolute; inset: 0; z-index: -2; }
.phero-media picture, .phero-media img { width: 100%; height: 100%; }
.phero-media img { object-fit: cover; animation: heroZoom 2.8s var(--ease) both; }
.phero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(11,16,27,0.94) 0%, rgba(11,16,27,0.7) 45%, rgba(11,16,27,0.25) 100%), linear-gradient(0deg, var(--navy) 0%, rgba(11,16,27,0) 50%);
}
.phero .h1 { max-width: 15ch; margin-bottom: 32px; }
.phero .lead { max-width: 48ch; }
.crumbs { display: flex; gap: 10px; align-items: center; margin-bottom: 36px; font: 600 var(--t-label)/1 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.crumbs a { color: var(--mist); }
.crumbs a:hover { color: var(--off); }
.crumbs [aria-current] { color: var(--blue-hi); }

/* ---------- Statement (scroll-lit text) ---------- */
.statement { font: 480 var(--t-statement)/1.2 var(--f-display); font-variation-settings: "wdth" 106; letter-spacing: -0.022em; text-wrap: pretty; max-width: 30ch; margin: 0; }
.statement .w { color: var(--off); opacity: var(--o, 1); transition: opacity 0.2s linear; }
.statement .key { color: var(--blue-hi); }
.js .statement[data-lit] .w { --o: 0.2; }
.js .statement[data-lit] .w.on { --o: 1; }

/* ---------- Section heads ---------- */
.shead { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 24px; align-items: end; margin-bottom: clamp(48px, 6vw, 88px); }
.shead > :first-child { grid-column: 1 / span 7; }
.shead > :last-child:not(:first-child) { grid-column: 9 / span 4; }
.shead .h2 { max-width: 18ch; }
@media (max-width: 860px) { .shead > :first-child, .shead > :last-child:not(:first-child) { grid-column: 1 / -1; } }

/* ---------- Duality (instinct / discipline) ---------- */
.duality { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line-strong); }
.duality-col { padding: clamp(32px, 4vw, 56px) clamp(0px, 3vw, 48px) 0 0; min-width: 0; }
.duality-col + .duality-col { padding-left: clamp(24px, 3vw, 48px); padding-right: 0; border-left: 1px solid var(--line-strong); }
.duality-col h3 { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.duality-col h3 i { width: 28px; height: 2px; background: var(--off); }
.duality-col.ambition h3 i { background: var(--blue); }
.duality-col li { padding: 20px 0; border-bottom: 1px solid var(--line); display: grid; gap: 4px; }
.duality-col li strong { font-weight: 600; font-size: 1.125rem; }
.duality-col li span { color: var(--mist); font-size: var(--t-small); }
@media (max-width: 760px) {
  .duality { grid-template-columns: 1fr; }
  .duality-col + .duality-col { padding-left: 0; border-left: 0; border-top: 1px solid var(--line-strong); margin-top: 40px; }
}

/* ---------- Principles (sequenced) ---------- */
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line-strong); counter-reset: s; }
.steps--six { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.step { position: relative; padding: 36px clamp(16px, 2.4vw, 40px) 44px 0; min-width: 0; }
.step + .step { padding-left: clamp(16px, 2.4vw, 40px); border-left: 1px solid var(--line); }
.steps--six .step:nth-child(3n+1) { padding-left: 0; border-left: 0; }
.steps--six .step:nth-child(n+4) { border-top: 1px solid var(--line); }
.step::before {
  counter-increment: s; content: counter(s, decimal-leading-zero);
  display: block; margin-bottom: 48px;
  font: 500 0.8125rem/1 var(--f-display); letter-spacing: 0.16em; color: var(--blue-hi); font-variant-numeric: tabular-nums;
}
.step::after { content: ""; position: absolute; top: -1px; left: 0; width: 0; height: 1px; background: var(--blue); transition: width 1.2s var(--ease); }
.step + .step::after { left: clamp(16px, 2.4vw, 40px); }
.steps--six .step:nth-child(3n+1)::after { left: 0; }
.step.is-in::after, .no-js .step::after { width: 56px; }
.step h3 { margin-bottom: 14px; }
.step p { color: var(--mist); margin: 0; max-width: 34ch; }
@media (max-width: 900px) {
  .steps, .steps--six { grid-template-columns: 1fr; }
  .step, .step + .step, .steps--six .step:nth-child(3n+1) { padding: 32px 0 36px; border-left: 0; }
  .step + .step { border-top: 1px solid var(--line); }
  .step::before { margin-bottom: 24px; }
  .step + .step::after { left: 0; }
}

/* ---------- Focus sectors ---------- */
.sectors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 24px); }
.sector {
  position: relative; min-height: clamp(280px, 26vw, 400px); padding: clamp(24px, 2.6vw, 40px);
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  background: var(--slate); border: 1px solid var(--line); overflow: hidden; isolation: isolate;
  transition: border-color 0.4s var(--ease), background-color 0.4s var(--ease);
}
.sector::before {
  content: ""; position: absolute; z-index: -1; right: -30%; top: -30%; width: 80%; aspect-ratio: 1;
  background:
    linear-gradient(45deg, transparent calc(50% - 0.5px), var(--line-strong) calc(50% - 0.5px), var(--line-strong) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(-45deg, transparent calc(50% - 0.5px), var(--line-strong) calc(50% - 0.5px), var(--line-strong) calc(50% + 0.5px), transparent calc(50% + 0.5px));
  opacity: 0.5; transition: transform 1s var(--ease), opacity 0.5s;
}
.sector:hover { border-color: rgba(52, 124, 250, 0.55); background: var(--slate-hi); }
.sector:hover::before { transform: rotate(45deg) scale(1.1); opacity: 1; }
.sector .tag { font: 600 var(--t-label)/1 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.sector h3 { margin-bottom: 12px; }
.sector p { color: var(--mist); margin: 0; }
@media (max-width: 900px) { .sectors { grid-template-columns: 1fr; } .sector { min-height: 0; } }

/* ---------- Split (image + copy) ---------- */
.split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 48px; align-items: center; }
.split > .plate { grid-column: 1 / span 6; }
.split > .split-copy { grid-column: 8 / span 5; min-width: 0; }
.split--rev > .plate { grid-column: 7 / span 6; grid-row: 1; }
.split--rev > .split-copy { grid-column: 1 / span 5; grid-row: 1; }
.split-copy .h2 { margin-bottom: 28px; }
.split-copy .quote { margin-bottom: 8px; }
@media (max-width: 900px) {
  .split > .plate, .split > .split-copy, .split--rev > .plate, .split--rev > .split-copy { grid-column: 1 / -1; grid-row: auto; }
}

/* ---------- Paths (investor / owner) ---------- */
.paths { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(12px, 1.6vw, 24px); }
.path {
  position: relative; isolation: isolate; min-height: clamp(420px, 42vw, 620px); overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(28px, 3.4vw, 56px);
  border: 1px solid var(--line);
}
.path .plate { position: absolute; inset: 0; z-index: -2; }
.path .plate img { transition: transform 1.6s var(--ease), filter 0.8s; filter: saturate(0.85) brightness(0.85); }
.path:hover .plate img { transform: scale(1.045); filter: saturate(1) brightness(1); }
.path::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(7,11,19,0.96) 8%, rgba(7,11,19,0.55) 55%, rgba(7,11,19,0.2) 100%); }
.path .who { font: 600 var(--t-label)/1 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--blue-hi); margin-bottom: 20px; }
.path .h2 { font-size: clamp(1.9rem, 1.2rem + 2.2vw, 3.3rem); max-width: 13ch; margin-bottom: 18px; }
.path p { color: #C3CDDB; max-width: 40ch; margin-bottom: 28px; }
.path .tlink::after { content: ""; position: absolute; inset: 0; }
@media (max-width: 860px) { .paths { grid-template-columns: 1fr; } .path { min-height: 440px; } }

/* ---------- CTA band ---------- */
.cta-band { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(120px, 16vw, 240px); }
.cta-band .plate { position: absolute; inset: 0; z-index: -2; }
.cta-band::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11,16,27,0.94) 0%, rgba(11,16,27,0.6) 55%, rgba(11,16,27,0.35) 100%); }
.cta-band .h1 { max-width: 14ch; margin-bottom: 40px; }

/* ---------- Chapters (founder story) ---------- */
.chapters { position: relative; display: grid; gap: 0; }
.chapter { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); padding-block: clamp(40px, 5vw, 72px); border-top: 1px solid var(--line); }
.chapter:last-child { border-bottom: 1px solid var(--line); }
.chapter .num { grid-column: 1 / span 2; font: 500 0.8125rem/1.6 var(--f-display); letter-spacing: 0.16em; text-transform: uppercase; color: var(--blue-hi); }
.chapter h3 { grid-column: 3 / span 4; }
.chapter .prose { grid-column: 8 / span 5; margin: 0; }
@media (max-width: 900px) {
  .chapter { row-gap: 14px; }
  .chapter .num, .chapter h3, .chapter .prose { grid-column: 1 / -1; }
}

/* ---------- Values ---------- */
.values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); }
.value { padding: 32px clamp(16px, 2vw, 32px) 8px 0; min-width: 0; }
.value + .value { padding-left: clamp(16px, 2vw, 32px); border-left: 1px solid var(--line); }
.value .glyph { width: 40px; height: 40px; margin-bottom: 40px; color: var(--blue); }
.value h3 { margin-bottom: 12px; }
.value p { color: var(--mist); margin: 0; }
@media (max-width: 980px) {
  .values { grid-template-columns: 1fr 1fr; }
  .value:nth-child(3) { padding-left: 0; border-left: 0; }
  .value:nth-child(n+3) { border-top: 1px solid var(--line); margin-top: 24px; }
}
@media (max-width: 560px) {
  .values { grid-template-columns: 1fr; }
  .value, .value + .value { padding: 28px 0 8px; border-left: 0; }
  .value + .value { border-top: 1px solid var(--line); margin-top: 20px; }
}

.values--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 980px) { .values--3 { grid-template-columns: 1fr; } .values--3 .value, .values--3 .value + .value { padding: 28px 0 8px; border-left: 0; margin-top: 0; } .values--3 .value + .value { border-top: 1px solid var(--line); margin-top: 20px; } }
.expect { display: grid; gap: 0; margin-top: 36px; border-top: 1px solid var(--line); counter-reset: e; }
.expect li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--line); color: var(--mist); }
.expect li::before { counter-increment: e; content: counter(e, decimal-leading-zero); font: 500 0.8125rem/1.9 var(--f-display); letter-spacing: 0.14em; color: var(--blue-hi); font-variant-numeric: tabular-nums; }
.two-col { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 32px; }
.two-col > :first-child { grid-column: 1 / span 6; }
.two-col > :last-child { grid-column: 8 / span 5; }
@media (max-width: 900px) { .two-col > :first-child, .two-col > :last-child { grid-column: 1 / -1; } }
.quote-bay { text-align: left; max-width: 26ch; }
.sector .h3 { font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); }

/* ---------- Sticky process (approach) ---------- */
.process { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); }
.process-head { grid-column: 1 / span 4; align-self: start; position: sticky; top: calc(var(--header-h) + 40px); }
.process-list { grid-column: 6 / span 7; position: relative; padding-left: 40px; }
.process-list::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 1px; background: var(--line-strong); }
.process-list .bar { position: absolute; left: 0; top: 8px; width: 1px; height: calc((100% - 16px) * var(--p, 0)); background: var(--blue); }
.pitem { position: relative; padding-bottom: clamp(48px, 6vw, 80px); }
.pitem:last-child { padding-bottom: 0; }
.pitem::before { content: ""; position: absolute; left: -45px; top: 6px; width: 11px; height: 11px; border: 1px solid var(--line-strong); background: var(--navy); transform: rotate(45deg); transition: background-color 0.4s, border-color 0.4s; }
.pitem.is-on::before { background: var(--blue); border-color: var(--blue); }
.pitem .n { font: 500 0.8125rem/1 var(--f-display); letter-spacing: 0.16em; color: var(--blue-hi); margin-bottom: 18px; display: block; font-variant-numeric: tabular-nums; }
.pitem h3 { margin-bottom: 14px; }
.pitem p { color: var(--mist); max-width: 52ch; margin: 0; }
@media (max-width: 900px) {
  .process-head { grid-column: 1 / -1; position: static; margin-bottom: 48px; }
  .process-list { grid-column: 1 / -1; padding-left: 32px; }
  .pitem::before { left: -37px; }
}

/* ---------- Lens lists (what we look for) ---------- */
.lens { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); }
.lens-col { min-width: 0; }
.lens-col h3 { padding-bottom: 20px; border-bottom: 1px solid var(--line-strong); margin-bottom: 8px; }
.lens-col li { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); color: var(--mist); }
.lens-col li b { color: var(--off); font-weight: 500; }
@media (max-width: 760px) { .lens { grid-template-columns: 1fr; } }

/* ---------- Notice (important information) ---------- */
.notice { border: 1px solid var(--line-strong); padding: clamp(24px, 3vw, 40px); display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; background: rgba(22, 36, 56, 0.5); }
.notice svg { width: 22px; height: 22px; color: var(--blue-hi); margin-top: 3px; }
.notice h3 { font: 600 var(--t-label)/1.4 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--off); margin-bottom: 12px; }
.notice p { color: var(--mist); font-size: var(--t-small); margin: 0; max-width: 80ch; }
.notice p + p { margin-top: 10px; }

/* ---------- Forms ---------- */
.form-shell { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 48px; }
.form-intro { grid-column: 1 / span 4; }
.form-intro .h2 { margin-bottom: 24px; }
.form-card { grid-column: 6 / span 7; min-width: 0; }
@media (max-width: 960px) { .form-intro, .form-card { grid-column: 1 / -1; } }

.form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; row-gap: 28px; }
.form .full { grid-column: 1 / -1; }
.field { display: grid; gap: 10px; min-width: 0; }
.field label, .field legend { font: 600 var(--t-label)/1.3 var(--f-display); letter-spacing: 0.16em; text-transform: uppercase; color: var(--mist); }
.field label .opt { color: var(--dim); letter-spacing: 0.1em; text-transform: none; font-weight: 500; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 54px; padding: 14px 16px;
  background: rgba(22, 36, 56, 0.55); border: 1px solid var(--line-strong); border-radius: 0;
  color: var(--off); font-size: 1rem; transition: border-color 0.25s, background-color 0.25s, box-shadow 0.25s;
  -webkit-appearance: none; appearance: none;
}
.field textarea { min-height: 150px; resize: vertical; line-height: 1.55; }
.field select {
  padding-right: 44px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%236A9FFF' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center;
}
.field select option { background: var(--slate); color: var(--off); }
.field input::placeholder, .field textarea::placeholder { color: var(--dim); }
.field input:hover, .field select:hover, .field textarea:hover { border-color: rgba(245, 247, 250, 0.36); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue); background: rgba(22, 36, 56, 0.9); box-shadow: 0 0 0 3px rgba(52, 124, 250, 0.22); }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--err); }
.field .err { color: var(--err); font-size: 0.85rem; min-height: 0; }
.field .err:empty { display: none; }
.choice-group { display: flex; flex-wrap: wrap; gap: 10px; border: 0; padding: 0; margin: 0; min-width: 0; }
.choice-group legend { margin-bottom: 12px; padding: 0; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid var(--line-strong); font-size: 0.9375rem; color: var(--mist); transition: all 0.25s var(--ease); cursor: pointer; }
.chip input:hover + span { border-color: rgba(245, 247, 250, 0.4); color: var(--off); }
.chip input:checked + span { border-color: var(--blue); background: rgba(52, 124, 250, 0.16); color: var(--off); }
.chip input:focus-visible + span { outline: 2px solid var(--blue-hi); outline-offset: 2px; }
.check { display: grid; grid-template-columns: 22px 1fr; gap: 14px; align-items: start; color: var(--mist); font-size: var(--t-small); cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--blue); cursor: pointer; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.form-foot { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; justify-content: space-between; }
.form-foot small { color: var(--dim); font-size: 0.8125rem; max-width: 46ch; }
.form-status { grid-column: 1 / -1; font-size: var(--t-small); color: var(--err); }
.form-status:empty { display: none; }
.form-done { display: none; border: 1px solid var(--line-strong); padding: clamp(28px, 4vw, 48px); background: rgba(22, 36, 56, 0.55); }
.form-done.is-shown { display: block; animation: fadeUp 0.7s var(--ease) both; }
.form-done .h3 { margin-bottom: 14px; }
.form-done p { color: var(--mist); margin-bottom: 0; }
.form-done .preview-note { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 0.85rem; color: var(--dim); }
@media (max-width: 640px) { .form { grid-template-columns: 1fr; } }

/* Contact tabs */
.tabs { display: flex; gap: 0; border-bottom: 1px solid var(--line-strong); margin-bottom: 44px; overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab {
  position: relative; flex: none; background: none; border: 0; cursor: pointer; padding: 18px 22px 18px 0; margin-right: 22px;
  font: 600 0.8125rem/1 var(--f-display); font-variation-settings: "wdth" 108; letter-spacing: 0.14em; text-transform: uppercase; color: var(--dim);
  transition: color 0.25s;
}
.tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--blue); transform: scaleX(0); transform-origin: left; transition: transform 0.45s var(--ease); }
.tab:hover { color: var(--off); }
.tab[aria-selected="true"] { color: var(--off); }
.tab[aria-selected="true"]::after { transform: scaleX(1); }
.tabpanel[hidden] { display: none; }

/* ---------- Perspectives index ---------- */
.journal { border-top: 1px solid var(--line-strong); }
.entry { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 12px; padding-block: clamp(32px, 4vw, 52px); border-bottom: 1px solid var(--line); align-items: baseline; transition: background-color 0.4s; }
.entry .theme { grid-column: 1 / span 3; font: 600 var(--t-label)/1.5 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.entry h3 { grid-column: 4 / span 5; }
.entry p { grid-column: 9 / span 3; color: var(--mist); margin: 0; font-size: var(--t-small); }
.entry .status { grid-column: 12 / span 1; justify-self: end; font: 600 0.6875rem/1 var(--f-display); letter-spacing: 0.16em; text-transform: uppercase; color: var(--blue-hi); white-space: nowrap; }
@media (max-width: 960px) {
  .entry .theme, .entry h3, .entry p { grid-column: 1 / -1; }
  .entry .status { grid-column: 1 / -1; justify-self: start; grid-row: 1; }
}
.subscribe { display: grid; grid-template-columns: 1fr auto; gap: 12px; max-width: 560px; }
.subscribe .field { gap: 0; }
@media (max-width: 520px) { .subscribe { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-deep); border-top: 1px solid var(--line); padding-top: clamp(72px, 8vw, 120px); padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px)); }
.foot-top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 48px; padding-bottom: clamp(56px, 6vw, 88px); }
.foot-brand { grid-column: 1 / span 5; }
.foot-brand .brand-word { font-size: 1.625rem; } .foot-brand .brand-mark { width: 28px; height: 28px; }
.foot-tagline { margin-top: 28px; font: 520 clamp(1.4rem, 1rem + 1.4vw, 2.2rem)/1.1 var(--f-display); font-variation-settings: "wdth" 110; letter-spacing: -0.025em; max-width: 16ch; }
.foot-tagline em { font-style: normal; color: var(--blue-hi); }
.foot-col { grid-column: span 2; }
.foot-col:first-of-type { grid-column: 8 / span 2; }
.foot-col h2 { font: 600 var(--t-label)/1 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); margin-bottom: 22px; }
.foot-col li + li { margin-top: 12px; }
.foot-col a { color: var(--mist); transition: color 0.25s; }
.foot-col a:hover { color: var(--off); }
.foot-legal { border-top: 1px solid var(--line); padding-top: 32px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 20px; font-size: 0.8125rem; color: var(--dim); }
.foot-legal p { grid-column: 1 / span 8; margin: 0; max-width: 100ch; }
.foot-legal .meta { grid-column: 10 / span 3; justify-self: end; text-align: right; display: grid; gap: 8px; }
.foot-legal .meta a:hover { color: var(--off); }
@media (max-width: 900px) {
  .foot-brand { grid-column: 1 / -1; }
  .foot-col, .foot-col:first-of-type { grid-column: span 6; }
  .foot-legal p, .foot-legal .meta { grid-column: 1 / -1; justify-self: start; text-align: left; }
}

/* ---------- Legal page ---------- */
.legal { max-width: 74ch; }
.legal h2 { font: 560 var(--t-h3)/1.2 var(--f-display); font-variation-settings: "wdth" 106; margin: 56px 0 16px; }
.legal h2:first-child { margin-top: 0; }
.legal p, .legal li { color: var(--mist); }
.legal ul { list-style: disc; padding-left: 1.2em; margin-bottom: 1em; }
.legal li + li { margin-top: 6px; }

/* ---------- Scroll reveal ---------- */
.js [data-reveal].is-pending { opacity: 0; transform: translateY(28px); }
.js [data-reveal] { transition: opacity 1s var(--ease), transform 1.1s var(--ease); transition-delay: var(--d, 0s); }
.js [data-reveal="clip"].is-pending { opacity: 1; transform: none; clip-path: inset(0 0 100% 0); }
.js [data-reveal="clip"] { clip-path: inset(0 0 0 0); transition: clip-path 1.4s var(--ease-io); }

/* ---------- Utilities ---------- */
.mt-0 { margin-top: 0; } .mb-0 { margin-bottom: 0; }
.mt-l { margin-top: clamp(40px, 5vw, 72px); }
.center-x { margin-inline: auto; }
.max-60 { max-width: 60ch; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; transition-delay: 0s !important; }
  .js [data-reveal].is-pending { opacity: 1; transform: none; clip-path: none; }
  .js .statement[data-lit] .w { --o: 1; }
  @view-transition { navigation: none; }
}
.expect.beliefs li { grid-template-columns: 1fr; }
.expect.beliefs li::before { display: none; }
.expect.beliefs strong { font-weight: 600; }
.split-copy .quote { font-size: clamp(1.45rem, 1rem + 1.35vw, 2.35rem); }
@media (max-width: 560px) { .tab { flex: 1 1 auto; margin-right: 0; padding: 18px 10px 18px 0; letter-spacing: 0.1em; } .tabs { gap: 18px; } }
.field .chip { font: inherit; letter-spacing: 0; text-transform: none; color: inherit; }
.tab { white-space: nowrap; }
@media (max-width: 560px) { .tab { font-size: 0.75rem; } .hero-foot .scroll-cue { display: none; } }

/* ---------- Brand-strategy additions ---------- */
.hero-strip { margin-top: clamp(48px, 8vh, 96px); padding-top: 22px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 14px clamp(24px, 4vw, 56px); }
.hero-strip li { display: inline-flex; align-items: center; gap: 12px; font: 600 var(--t-label)/1.4 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: #C3CDDB; }
.hero-strip li::before { content: ""; width: 7px; height: 7px; background: var(--blue); transform: rotate(45deg); }
.thesis { font: 540 var(--t-h1)/1.0 var(--f-display); font-variation-settings: "wdth" 112; letter-spacing: -0.038em; max-width: 22ch; }
.thesis span { display: block; }
.statement--sm { font-size: clamp(1.35rem, 1rem + 1.2vw, 2rem); max-width: 34ch; }
.steps--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) and (min-width: 901px) {
  .steps--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps--four .step:nth-child(3) { padding-left: 0; border-left: 0; }
  .steps--four .step:nth-child(n+3) { border-top: 1px solid var(--line); }
  .steps--four .step:nth-child(3)::after { left: 0; }
}
.signature { font: 560 clamp(2.8rem, 1.2rem + 6.4vw, 8rem)/0.95 var(--f-display); font-variation-settings: "wdth" 112; letter-spacing: -0.045em; text-wrap: balance; max-width: 14ch; }
.signature .accent { display: block; color: var(--blue-hi); }
.narrative { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2vw, 32px); row-gap: 48px; align-items: start; }
.narrative-side { grid-column: 1 / span 4; position: sticky; top: calc(var(--header-h) + 32px); }
.narrative-body { grid-column: 6 / span 7; min-width: 0; }
.caption { margin: 14px 0 0; font: 600 var(--t-label)/1.4 var(--f-display); letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.opening { font-family: var(--f-serif); font-style: italic; font-weight: 340; font-size: clamp(1.8rem, 1.1rem + 2.4vw, 3.3rem); line-height: 1.14; letter-spacing: -0.012em; text-wrap: balance; margin: 0 0 clamp(32px, 4vw, 56px); }
.prose--story { font-size: 1.125rem; line-height: 1.75; color: #C3CDDB; max-width: 60ch; }
.prose--story p { margin-bottom: 1.2em; }
.pull { margin: clamp(24px, 3vw, 40px) 0 clamp(32px, 4vw, 52px); padding-left: clamp(20px, 2.4vw, 36px); border-left: 2px solid var(--blue); font-size: clamp(1.45rem, 1rem + 1.4vw, 2.3rem); }
.closing { color: var(--off); font-weight: 500; }
.narrative-body .cite { margin-top: 8px; }
@media (max-width: 900px) { .narrative-side, .narrative-body { grid-column: 1 / -1; position: static; } .narrative-side .plate { aspect-ratio: 16 / 10; } }
.xband { display: grid; grid-template-columns: auto 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.xband-mark .brand-mark { width: clamp(96px, 14vw, 200px); height: auto; margin: 0; }
.xband .h2 { max-width: 20ch; }
@media (max-width: 640px) { .xband { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .steps--four { grid-template-columns: 1fr; } }