/* ==========================================================================
   Caldrion — site styles
   Type: Newsreader (display, opsz 72) · Instrument Sans (text) · Geist Mono (labels)
   Colour: ink (deep green-black), bone (warm paper), ember (copper accent)
   Every section sets its tone with .tone-ink / .tone-ink2 / .tone-bone / .tone-stone;
   components read the --fg / --bg / --muted / --line / --accent custom properties.
   ========================================================================== */

/* Fonts ------------------------------------------------------------------ */
@font-face { font-family: 'Newsreader Display'; font-style: normal; font-weight: 300 500; font-display: swap; src: url('/fonts/newsreader-roman-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader Display'; font-style: normal; font-weight: 300 500; font-display: swap; src: url('/fonts/newsreader-roman-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Newsreader Display'; font-style: italic; font-weight: 300 400; font-display: swap; src: url('/fonts/newsreader-italic-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader Display'; font-style: italic; font-weight: 300 400; font-display: swap; src: url('/fonts/newsreader-italic-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/fonts/instrumentsans-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/fonts/instrumentsans-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Geist Mono'; font-style: normal; font-weight: 400 600; font-display: swap; src: url('/fonts/geistmono-latin.woff2') format('woff2'); }

/* Tokens ----------------------------------------------------------------- */
:root {
  --display: 'Newsreader Display', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --ink: #0C1110;
  --ink-2: #111816;
  --ink-3: #182120;
  --bone: #F2EEE6;
  --stone: #E7E1D4;
  --white: #FBF9F5;
  --text-d: #EEE9DF;
  --muted-d: #A7B1AB;
  --label-d: #93A79D;
  --text-l: #111816;
  --muted-l: #4F5955;
  --label-l: #556860;
  --ember: #E39A6B;
  --ember-l: #9E4E28;

  --wrap: 1440px;
  --gutter: clamp(20px, 4.6vw, 76px);
  --gap: clamp(16px, 2.2vw, 36px);
  --sec-y: clamp(96px, 11vw, 184px);
  --hdr-h: 76px;
  --ease: cubic-bezier(.22, .7, .12, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);

  --fs-display: clamp(3.4rem, 1.15rem + 7.4vw, 9.6rem);
  --fs-h1: clamp(2.85rem, 1.45rem + 4.9vw, 6.75rem);
  --fs-h2: clamp(2.25rem, 1.35rem + 3.1vw, 4.6rem);
  --fs-h3: clamp(1.45rem, 1.2rem + .75vw, 2rem);
  --fs-lead: clamp(1.28rem, 1.06rem + .85vw, 1.8rem);
  --fs-manifesto: clamp(1.85rem, 1.05rem + 2.7vw, 3.85rem);
  --fs-body: 1.0625rem;
  --fs-small: .9375rem;
  --fs-micro: .72rem;
}

.tone-ink, .tone-ink2, body {
  --bg: var(--ink); --fg: var(--text-d); --muted: var(--muted-d); --label: var(--label-d); --accent: var(--ember);
  --line: rgba(238, 233, 223, .13); --line-2: rgba(238, 233, 223, .26);
  --btn-bg: var(--bone); --btn-fg: var(--ink); --btn-hover: #fff;
  --field-bg: rgba(255, 255, 255, .04);
  color-scheme: dark;
}
.tone-ink2 { --bg: var(--ink-2); }
.tone-bone, .tone-stone, .tone-white {
  --bg: var(--bone); --fg: var(--text-l); --muted: var(--muted-l); --label: var(--label-l); --accent: var(--ember-l);
  --line: rgba(17, 24, 22, .13); --line-2: rgba(17, 24, 22, .3);
  --btn-bg: var(--ink); --btn-fg: var(--bone); --btn-hover: #24302d;
  --field-bg: var(--white);
  color-scheme: light;
}
.tone-stone { --bg: var(--stone); }
.tone-white { --bg: var(--white); }
[class*='tone-'] { background-color: var(--bg); color: var(--fg); }

/* Base ------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .35s; animation-timing-function: var(--ease); }
@media (prefers-reduced-motion: reduce) { ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; } }
body {
  margin: 0; background: var(--ink); color: var(--fg);
  font: 400 var(--fs-body)/1.65 var(--sans);
  font-feature-settings: 'kern', 'liga';
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
}
main { display: block; }
img, svg, video, canvas { display: block; max-width: 100%; }
svg { flex: none; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
strong { font-weight: 600; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
::selection { background: var(--ember); color: var(--ink); }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 2px; }
[hidden] { display: none !important; }
address { font-style: normal; }
abbr[title] { text-decoration: none; }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: fixed; left: 16px; top: -100px; z-index: 200; background: var(--bone); color: var(--ink); padding: 12px 18px; font-weight: 600; border-radius: 4px; }
.skip:focus { top: 16px; }

/* Grain on dark surfaces */
.grain { position: relative; isolation: isolate; }
.grain::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0; opacity: .05; mix-blend-mode: screen;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.grain > * { position: relative; z-index: 1; }

/* Type ------------------------------------------------------------------- */
.display, .h1, .h2, .h3, .lead, .manifesto, .statement, .serif {
  font-family: var(--display); font-weight: 300; font-feature-settings: 'kern', 'liga', 'pnum';
}
.display { font-size: var(--fs-display); line-height: .9; letter-spacing: -.038em; }
.h1 { font-size: var(--fs-h1); line-height: .94; letter-spacing: -.034em; }
.h2 { font-size: var(--fs-h2); line-height: 1; letter-spacing: -.03em; }
.h3 { font-size: var(--fs-h3); line-height: 1.12; letter-spacing: -.018em; font-weight: 400; }
.h4 { font: 600 1.0625rem/1.35 var(--sans); letter-spacing: -.005em; }
.display em, .h1 em, .h2 em, .h3 em, .statement em, .manifesto em, .serif em { font-style: italic; color: var(--accent); }
.lead { font-size: var(--fs-lead); line-height: 1.32; letter-spacing: -.012em; font-weight: 300; }
.statement { font-size: clamp(1.6rem, 1.15rem + 1.6vw, 2.75rem); line-height: 1.14; letter-spacing: -.022em; }
.body-lg { font-size: clamp(1.08rem, 1rem + .3vw, 1.22rem); line-height: 1.6; }
.muted { color: var(--muted); }
.small { font-size: var(--fs-small); }
.kicker {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .35em 1.1em;
  font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--label);
}
.kicker__n { color: var(--accent); }
.kicker > span + span::before { content: ''; display: inline-block; width: 16px; height: 1px; margin-right: 1.1em; background: currentColor; opacity: .55; vertical-align: .3em; }
/* A kicker that wraps continues under its own text, not under the dash (as on www.caldrion.com). */
.kicker > span + span { display: inline-flex; align-items: baseline; }
.kicker > span + span::before { flex: none; align-self: flex-start; margin-top: .62em; } /* off the baseline, so the kicker keeps its text baseline */
.mono { font-family: var(--mono); font-feature-settings: 'tnum'; }
.tnum { font-variant-numeric: tabular-nums; }

.prose { max-width: 66ch; }
.prose > * + * { margin-top: 1.1em; }
.prose p, .prose li { color: var(--muted); }
.prose strong { color: var(--fg); }
.prose a, .link { color: var(--fg); background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; padding-bottom: 1px; transition: background-size .4s var(--ease), color .2s; }
.prose a:hover, .link:hover { color: var(--accent); background-size: 0 1px; background-position: 100% 100%; }
.prose--fg p, .prose--fg li, .prose .fg { color: var(--fg); }

/* Icons */
.i { width: 1em; height: 1em; }
.i-arrow { width: 1.05em; transition: transform .45s var(--ease-out); }

/* Buttons ---------------------------------------------------------------- */
.actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.btn {
  --h: 54px;
  display: inline-flex; align-items: center; justify-content: center; gap: .75em; min-height: var(--h);
  padding: 0 1.55em; border-radius: 999px; border: 1px solid transparent;
  font: 500 .95rem/1 var(--sans); letter-spacing: .005em; white-space: nowrap;
  transition: background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn:hover .i-arrow, .link-go:hover .i-arrow, a:hover > .i-arrow, .stretch-parent:hover .i-arrow { transform: translateX(4px); }
.btn--solid { background: var(--btn-bg); color: var(--btn-fg); }
.btn--solid:hover { background: var(--btn-hover); }
.btn--line { border-color: var(--line-2); color: var(--fg); }
.btn--line:hover { border-color: var(--fg); }
.btn--sm { --h: 42px; padding: 0 1.2em; font-size: .875rem; }
.link-go { display: inline-flex; align-items: center; gap: .6em; font: 500 .95rem/1.2 var(--sans); color: var(--fg); padding-bottom: 6px; border-bottom: 1px solid var(--line-2); transition: border-color .3s, color .3s; }
.link-go:hover { border-color: var(--fg); }
.link-go .i-arrow { color: var(--accent); }

/* Stretched links: the whole card is clickable, the accessible name stays short */
.stretch-parent { position: relative; }
.stretch::after { content: ''; position: absolute; inset: 0; z-index: 2; }

/* Header ----------------------------------------------------------------- */
.hdr { position: fixed; inset: 0 0 auto; z-index: 100; color: var(--text-d); transition: transform .5s var(--ease), background-color .4s var(--ease), border-color .4s; border-bottom: 1px solid transparent; }
.hdr.is-scrolled { background: rgba(12, 17, 16, .84); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); border-bottom-color: rgba(238, 233, 223, .08); }
.hdr.is-hidden { transform: translateY(-100%); }
.hdr:focus-within { transform: none; }
.hdr__in { display: flex; align-items: center; gap: 28px; height: var(--hdr-h); }
.brand { font: 400 1.7rem/1 var(--display); letter-spacing: -.02em; color: var(--text-d); margin-right: auto; padding: 6px 0; }
.brand span { color: var(--ember); }
.nav > ul { display: flex; align-items: center; gap: 4px; }
.nav__top { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; font: 450 .9375rem/1 var(--sans); color: rgba(238, 233, 223, .82); border-radius: 999px; transition: color .25s, background-color .25s; }
.nav__top:hover, .nav__item:focus-within > .nav__top { color: #fff; }
.nav__top[aria-current='page'], .nav__item.is-section > .nav__top { color: #fff; }
.nav__top[aria-current='page']::before, .nav__item.is-section > .nav__top::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--ember); margin-right: 2px; }
.nav__top .i-chev { width: 9px; height: 9px; opacity: .6; transition: transform .3s var(--ease); }
.nav__item { position: relative; }
.nav__item:hover .i-chev, .nav__item:focus-within .i-chev { transform: rotate(180deg); }
.drop {
  position: absolute; top: calc(100% + 10px); left: -12px; min-width: 300px; padding: 10px;
  background: rgba(17, 24, 22, .97); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid rgba(238, 233, 223, .1); border-radius: 14px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .25s var(--ease), transform .35s var(--ease), visibility 0s .35s;
}
.drop::before { content: ''; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.nav__item:hover .drop, .nav__item:focus-within .drop { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.drop--wide { min-width: 520px; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.drop a { display: grid; grid-template-columns: 26px 1fr; gap: 2px 8px; padding: 12px 14px; border-radius: 9px; transition: background-color .2s; }
.drop a:hover, .drop a:focus-visible { background: rgba(238, 233, 223, .06); }
.drop a[aria-current='page'] { background: rgba(227, 154, 107, .1); }
.drop__n { font: 500 .7rem/1.9 var(--mono); color: var(--ember); letter-spacing: .06em; }
.drop__l { font: 500 .95rem/1.4 var(--sans); color: var(--text-d); }
.drop__t { grid-column: 2; font-size: .8rem; line-height: 1.35; color: var(--muted-d); }
.drop__all { grid-column: 1 / -1; border-top: 1px solid rgba(238, 233, 223, .08); margin-top: 6px; padding-top: 6px; }
.drop__all a { display: flex; justify-content: space-between; align-items: center; font: 500 .875rem/1 var(--sans); color: var(--text-d); }
.hdr__cta { margin-left: 8px; }
.menu-btn { display: none; align-items: center; gap: 10px; height: 42px; padding: 0 16px 0 18px; border: 1px solid rgba(238, 233, 223, .26); border-radius: 999px; font: 500 .875rem/1 var(--sans); color: var(--text-d); }
.menu-btn__lines { width: 16px; height: 8px; position: relative; }
.menu-btn__lines::before, .menu-btn__lines::after { content: ''; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; border-radius: 2px; }
.menu-btn__lines::before { top: 0; } .menu-btn__lines::after { bottom: 0; }

/* Mobile menu */
.mmenu { position: fixed; inset: 0; z-index: 150; background: var(--ink); color: var(--text-d); display: flex; flex-direction: column; overflow-y: auto; opacity: 0; transition: opacity .35s var(--ease); }
.mmenu.open { opacity: 1; }
.mmenu__bar { display: flex; align-items: center; justify-content: space-between; height: var(--hdr-h); flex: none; }
.mmenu__close { display: inline-flex; align-items: center; gap: 10px; height: 42px; padding: 0 18px; border: 1px solid rgba(238, 233, 223, .26); border-radius: 999px; font: 500 .875rem/1 var(--sans); }
.mmenu__close svg { width: 12px; height: 12px; }
.mmenu nav { padding-top: 12px; padding-bottom: 32px; flex: 1; }
.mmenu__list > li { border-bottom: 1px solid rgba(238, 233, 223, .1); }
.mmenu__row { display: flex; align-items: center; justify-content: space-between; }
.mmenu__link { display: block; padding: 18px 0; font: 300 2.2rem/1.05 var(--display); letter-spacing: -.025em; flex: 1; }
.mmenu__link[aria-current='page'] { color: var(--ember); }
.mmenu__toggle { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(238, 233, 223, .2); }
.mmenu__toggle svg { width: 12px; height: 12px; transition: transform .3s var(--ease); }
.mmenu__toggle[aria-expanded='true'] svg { transform: rotate(45deg); }
.mmenu__sub { display: none; padding: 0 0 18px; }
.mmenu__sub.open { display: block; }
.mmenu__sub a { display: flex; gap: 14px; padding: 9px 0; font-size: 1.05rem; color: var(--muted-d); }
.mmenu__sub a span { font: 500 .72rem/2.1 var(--mono); color: var(--ember); }
.mmenu__sub a[aria-current='page'] { color: var(--text-d); }
.mmenu__foot { padding-bottom: 32px; display: grid; gap: 18px; }
.mmenu__foot .btn { width: 100%; }
.mmenu__offices { display: flex; gap: 24px; font: 500 var(--fs-micro)/1.5 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label-d); }

/* Terrain ---------------------------------------------------------------- */
.terrain { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.terrain canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1.6s var(--ease); }
.terrain canvas.ready { opacity: 1; }
.terrain::before { /* ember glow, visible before (and without) JS */
  content: ''; position: absolute; width: 70vmax; height: 70vmax; left: calc(var(--cx, .7) * 100% - 35vmax); top: calc(var(--cy, .5) * 100% - 35vmax);
  background: radial-gradient(closest-side, rgba(217, 120, 70, .16), rgba(217, 120, 70, .05) 45%, transparent 70%);
}

/* Hero ------------------------------------------------------------------- */
.hero { position: relative; overflow: hidden; background: var(--ink); color: var(--text-d); }
.hero::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(12, 17, 16, .92) 0%, rgba(12, 17, 16, .6) 36%, rgba(12, 17, 16, 0) 66%), linear-gradient(0deg, rgba(12, 17, 16, .9) 0%, rgba(12, 17, 16, 0) 34%), linear-gradient(180deg, rgba(12, 17, 16, .7) 0%, rgba(12, 17, 16, 0) 18%); }
.hero__in { position: relative; z-index: 2; }
.hero--home { min-height: max(720px, 100svh); display: flex; flex-direction: column; }
.hero--home .hero__in { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; padding-top: calc(var(--hdr-h) + 64px); padding-bottom: clamp(40px, 5vw, 64px); }
.hero--home .kicker { margin-bottom: clamp(24px, 3vw, 40px); }
.hero__foot { display: grid; grid-template-columns: minmax(0, 34rem) auto; gap: 32px 64px; align-items: end; justify-content: space-between; margin-top: clamp(36px, 4.5vw, 64px); }
.hero__lead { font-size: clamp(1.06rem, .98rem + .35vw, 1.25rem); line-height: 1.58; color: rgba(238, 233, 223, .78); max-width: 34rem; }
.legend { position: relative; z-index: 2; border-top: 1px solid rgba(238, 233, 223, .12); }
.legend__in { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 40px; min-height: 64px; padding-block: 14px; font: 500 var(--fs-micro)/1.4 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label-d); }
.legend__in > :last-child { margin-left: auto; }
.legend b { font-weight: 500; color: var(--text-d); }
.legend__scale { display: inline-flex; align-items: center; gap: 12px; }
.legend__scale i { display: inline-block; width: 64px; height: 6px; border: 1px solid rgba(238, 233, 223, .5); border-top: 0; }
.scroll-cue { display: inline-flex; align-items: center; gap: 12px; color: var(--text-d); }
.scroll-cue i { position: relative; width: 1px; height: 28px; background: rgba(238, 233, 223, .2); overflow: hidden; }
.scroll-cue i::after { content: ''; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--ember); animation: cue 2.4s var(--ease) infinite; }
@keyframes cue { to { top: 100%; } }

.hero--page { min-height: clamp(560px, 82svh, 900px); display: flex; flex-direction: column; justify-content: flex-end; }
.hero--page .hero__in { padding-top: calc(var(--hdr-h) + 72px); padding-bottom: clamp(48px, 6vw, 88px); }
.hero--page .h1 { max-width: 15ch; margin-top: clamp(18px, 2vw, 28px); }
.hero--page .hero__lead { margin-top: clamp(24px, 2.6vw, 36px); }
.hero--page .actions { margin-top: 36px; }
.hero--short { min-height: clamp(460px, 64svh, 680px); }
.hero--legal { min-height: 0; }
.hero--legal .hero__in { padding-top: calc(var(--hdr-h) + clamp(72px, 9vw, 140px)); padding-bottom: clamp(48px, 5vw, 80px); }
.hero--legal .h1 { font-size: clamp(2.6rem, 1.6rem + 3.6vw, 5.2rem); }
.hero--legal::before { background: linear-gradient(90deg, rgba(12, 17, 16, .9), rgba(12, 17, 16, .3)); }
.crumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-bottom: clamp(28px, 4vw, 56px); font: 500 var(--fs-micro)/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label-d); }
.crumbs li { display: inline-flex; align-items: center; gap: 10px; }
.crumbs li + li::before { content: '/'; opacity: .5; }
.crumbs a { transition: color .2s; }
.crumbs a:hover { color: var(--text-d); }
.crumbs [aria-current] { color: var(--text-d); }
.hero-facts { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); margin-top: clamp(44px, 5vw, 72px); border-top: 1px solid rgba(238, 233, 223, .14); }
.hero-facts > div { padding: 18px 20px 0 0; }
.hero-facts > div + div { padding-left: 20px; border-left: 1px solid rgba(238, 233, 223, .14); }
.hero-facts dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label-d); }
.hero-facts dd { margin-top: 10px; font: 300 clamp(1.3rem, 1.05rem + .9vw, 2rem)/1.1 var(--display); letter-spacing: -.02em; color: var(--text-d); }

/* Motion control */
.motion { display: inline-flex; align-items: center; gap: 10px; min-height: 32px; font: 500 var(--fs-micro)/1 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label-d); transition: color .2s; }
.motion:hover { color: var(--text-d); }
.motion .i { width: 9px; height: 9px; }
.motion .i-play, .motion.is-paused .i-pause { display: none; }
.motion.is-paused .i-play { display: block; }
.hero__motion { position: absolute; z-index: 3; left: 0; right: 0; bottom: 18px; display: flex; justify-content: flex-end; pointer-events: none; }
.hero__motion .motion { pointer-events: auto; }
.legend__end { display: inline-flex; align-items: center; gap: 28px; }
.hero--legal .hero__motion { display: none; }

/* Sections --------------------------------------------------------------- */
.sec { position: relative; padding-block: var(--sec-y); }
.sec--tight { padding-block: clamp(72px, 8vw, 128px); }
.sec--flush-top { padding-top: 0; }
.sec + .sec.same { padding-top: 0; }
.sec-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 20px; padding-top: 22px; border-top: 1px solid var(--line); margin-bottom: clamp(48px, 6vw, 96px); }
.sec-head .kicker { grid-column: 1 / span 3; padding-top: .7em; }
.sec-head .h2 { grid-column: 4 / -1; max-width: 16ch; }
.sec-head__intro { grid-column: 4 / span 7; max-width: 46rem; color: var(--muted); font-size: clamp(1.06rem, 1rem + .3vw, 1.2rem); line-height: 1.6; margin-top: 12px; }
.sec-head__intro > * + * { margin-top: .8em; }
.sec-head--plain { border-top: 0; padding-top: 0; }
.sec-head--wide .h2 { max-width: 22ch; }
.sec-head--center { display: block; text-align: center; border: 0; padding: 0; }
.sec-head--center .kicker { justify-content: center; }
.sec-head--center .h2 { margin: 18px auto 0; }
.sec-head--center .sec-head__intro { margin: 22px auto 0; }

/* 12-column helpers */
.grid12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: clamp(40px, 5vw, 72px); }
.c-aside { grid-column: 1 / span 3; }
.c-main { grid-column: 4 / -1; }
.c-main-8 { grid-column: 4 / span 8; }
.c-left { grid-column: 1 / span 6; }
.c-right { grid-column: 7 / -1; }
.c-right-5 { grid-column: 8 / -1; }
.sticky { position: sticky; top: calc(var(--hdr-h) + 32px); align-self: start; }

/* Manifesto (scroll-lit words) */
.manifesto { font-size: var(--fs-manifesto); line-height: 1.12; letter-spacing: -.026em; max-width: 24ch; }
.manifesto .w { transition: opacity .5s var(--ease), color .5s var(--ease); }
.js .manifesto[data-words].split .w { opacity: .2; }
.js .manifesto[data-words].split .w.on { opacity: 1; }
.manifesto em { font-style: italic; }

/* Aims: three short statements under the manifesto */
.aims-label { margin-top: clamp(64px, 8vw, 128px); }
.aims { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); margin-top: 22px; }
.aims > div { border-top: 1px solid var(--line-2); padding-top: 22px; }
.aims h3 { margin-top: 0; }
.aims p { margin-top: 12px; color: var(--muted); max-width: 34ch; }

/* Stats */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 16px; padding: clamp(28px, 3.2vw, 48px) clamp(16px, 2vw, 32px) clamp(28px, 3.2vw, 44px) 0; }
.stat + .stat { padding-left: clamp(16px, 2vw, 32px); border-left: 1px solid var(--line); }
.stat dd { font: 300 clamp(3.6rem, 2.4rem + 4.4vw, 7.4rem)/.85 var(--display); letter-spacing: -.05em; font-feature-settings: 'lnum', 'pnum'; }
.stat dd sup { font-size: .32em; letter-spacing: 0; vertical-align: top; position: relative; top: .28em; margin-left: .08em; font-family: var(--mono); font-weight: 500; color: var(--accent); }
.stat dt { color: var(--muted); font-size: var(--fs-small); line-height: 1.5; max-width: 26ch; }

/* Pillar index (home / investments) */
.index { border-top: 1px solid var(--line-2); counter-reset: idx; }
.index__row { position: relative; display: grid; grid-template-columns: 64px minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr) 48px; column-gap: var(--gap); align-items: center; padding: clamp(22px, 2.4vw, 34px) 0; border-bottom: 1px solid var(--line-2); transition: color .35s; }
.index__row::before { content: ''; position: absolute; inset: 0 calc(var(--gutter) * -0.5); background: var(--fg); opacity: 0; transform: scaleY(.6); transition: opacity .45s var(--ease), transform .45s var(--ease); z-index: 0; border-radius: 2px; }
.index__row > * { position: relative; z-index: 1; }
.index__n { font: 500 .78rem/1 var(--mono); letter-spacing: .08em; color: var(--accent); }
.index__name { font: 300 clamp(1.9rem, 1.3rem + 2.1vw, 3.6rem)/1 var(--display); letter-spacing: -.03em; transition: transform .5s var(--ease-out), font-style .3s; }
.index__desc { color: var(--muted); font-size: var(--fs-small); line-height: 1.5; max-width: 40ch; transition: color .35s; }
.index__metric { display: grid; gap: 6px; }
.index__metric b { font: 400 1.2rem/1.15 var(--display); letter-spacing: -.01em; }
.index__metric span { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); transition: color .35s; }
.index__go { width: 48px; height: 48px; border: 1px solid var(--line-2); border-radius: 50%; display: grid; place-items: center; justify-self: end; transition: background-color .35s, border-color .35s, color .35s; }
.index__go svg { width: 16px; height: 16px; }
@media (hover: hover) {
  .index__row:hover { color: var(--bg); }
  .index__row:hover::before { opacity: 1; transform: none; }
  .index__row:hover .index__name { transform: translateX(10px); font-style: italic; }
  .index__row:hover .index__desc, .index__row:hover .index__metric span { color: color-mix(in srgb, var(--bg) 72%, transparent); }
  .index__row:hover .index__n { color: var(--accent); }
  .index__row:hover .index__go { background: var(--accent); border-color: var(--accent); color: var(--ink); }
}
.index-note { margin-top: 28px; color: var(--muted); font-size: var(--fs-small); max-width: 62ch; }
.index-note strong { color: var(--fg); }

/* Principles / reasons: numbered columns with hairlines */
.cols { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); }
.cols > * { padding: 0 clamp(18px, 2.4vw, 40px); border-left: 1px solid var(--line); }
.cols > :first-child { padding-left: 0; border-left: 0; }
.cols > :last-child { padding-right: 0; }
.col__n { display: block; font: 300 clamp(3rem, 2.2rem + 2.6vw, 5rem)/.9 var(--display); color: var(--accent); letter-spacing: -.02em; font-style: italic; }
.col__n--mono { font: 500 .78rem/1 var(--mono); letter-spacing: .1em; font-style: normal; }
.cols .h3 { margin-top: clamp(28px, 3vw, 48px); }
.cols p { margin-top: 16px; color: var(--muted); }
.cols p + p { margin-top: .8em; }
.cols .tag { margin-top: 10px; }
.cols--rows { grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); row-gap: clamp(40px, 5vw, 72px); }
.cols--rows > * { border-left: 0; padding: 26px 0 0; border-top: 1px solid var(--line-2); }
.cols--rows { column-gap: var(--gap); }
.tag { font: 500 var(--fs-micro)/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); }

/* Steps (process) */
.steps { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); column-gap: var(--gap); counter-reset: step; }
.steps li { position: relative; padding-top: 34px; }
.steps li::before { content: ''; position: absolute; left: 0; right: calc(var(--gap) * -1); top: 6px; height: 1px; background: var(--line-2); }
.steps li:last-child::before { right: 0; }
.steps li::after { content: ''; position: absolute; left: 0; top: 2px; width: 9px; height: 9px; border-radius: 50%; background: var(--bg); border: 1px solid var(--accent); }
.steps li:first-child::after { background: var(--accent); }
.steps__n { font: 500 var(--fs-micro)/1 var(--mono); letter-spacing: .12em; color: var(--label); }
.steps h3 { margin-top: 18px; font: 400 1.45rem/1.15 var(--display); letter-spacing: -.015em; }
.steps p { margin-top: 10px; color: var(--muted); font-size: var(--fs-small); line-height: 1.55; }
.steps strong { color: var(--fg); font-weight: 600; }

/* Vertical timeline */
.timeline { border-left: 1px solid var(--line-2); margin-left: 4px; }
.timeline li { position: relative; padding: 0 0 30px 32px; }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before { content: ''; position: absolute; left: -5px; top: 7px; width: 9px; height: 9px; border-radius: 50%; background: var(--bg); border: 1px solid var(--accent); }
.timeline li:first-child::before { background: var(--accent); }
.timeline h4 { font: 600 1rem/1.4 var(--sans); }
.timeline p { margin-top: 4px; color: var(--muted); font-size: var(--fs-small); }

/* Quote */
.quote blockquote p { max-width: 19ch; }
.quote blockquote p { font: 300 clamp(2.2rem, 1.3rem + 3.6vw, 5.4rem)/1.02 var(--display); letter-spacing: -.035em; text-indent: -.42em; }
.quote blockquote em { font-style: italic; color: var(--accent); }
.quote figcaption { margin-top: 36px; }

/* Values (large rows) */
.values { border-top: 1px solid var(--line-2); }
.value { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); padding: clamp(32px, 4vw, 56px) 0; border-bottom: 1px solid var(--line-2); align-items: baseline; }
.value__n { grid-column: 1 / span 1; font: 500 .78rem/1 var(--mono); color: var(--accent); letter-spacing: .08em; }
.value__name { grid-column: 2 / span 4; font: 300 clamp(2.4rem, 1.6rem + 2.8vw, 4.6rem)/1 var(--display); letter-spacing: -.035em; }
.value__body { grid-column: 7 / -1; color: var(--muted); font-size: clamp(1.02rem, .98rem + .2vw, 1.12rem); }

/* Doors (two calls to action) */
.doors { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
.door { position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: clamp(380px, 34vw, 520px); padding: clamp(28px, 3.4vw, 56px); border-radius: 4px; isolation: isolate; }
.door .terrain { opacity: .9; }
.door__body { position: relative; z-index: 2; margin-top: auto; }
.door .h2 { font-size: clamp(2.1rem, 1.4rem + 2.3vw, 3.7rem); max-width: 12ch; }
.door p { margin-top: 18px; color: var(--muted); max-width: 40ch; }
.door .link-go { margin-top: 30px; }
.door .kicker { position: relative; z-index: 2; }
.door--light { border: 1px solid var(--line-2); }
.door::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, var(--bg) 6%, rgba(12, 17, 16, .4) 55%, transparent 90%); pointer-events: none; }
.door--light::before { display: none; }
@media (hover: hover) { .door:hover .i-arrow { transform: translateX(4px); } }

/* Term sheet (criteria at a glance) */
.sheet { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
.sheet__head { grid-column: 1 / span 4; }
.sheet__head .h2 { margin-top: 18px; max-width: 9ch; }
.sheet__note { margin-top: 22px; color: var(--muted); max-width: 30ch; }
.sheet__rows { grid-column: 5 / -1; display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); border-top: 1px solid var(--line-2); }
.sheet__row { padding: 22px 20px 26px 0; border-bottom: 1px solid var(--line); }
.sheet__row:not(:nth-child(3n + 1)) { padding-left: 20px; border-left: 1px solid var(--line); }
.sheet__row dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.sheet__row dd { margin-top: 14px; }
.sheet__v { display: block; font: 300 clamp(1.45rem, 1.15rem + 1vw, 2.15rem)/1.08 var(--display); letter-spacing: -.022em; font-feature-settings: 'lnum'; }
.sheet__s { display: block; margin-top: 8px; color: var(--muted); font-size: .875rem; line-height: 1.45; }
.sheet__foot { grid-column: 5 / -1; margin-top: 26px; display: flex; gap: 14px; align-items: baseline; color: var(--fg); font-size: var(--fs-small); }
.sheet__foot::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; transform: translateY(-1px); }

/* Approach split */
.lede { font: 300 clamp(1.7rem, 1.15rem + 2vw, 3rem)/1.1 var(--display); letter-spacing: -.026em; max-width: 22ch; }
.lede em { font-style: italic; color: var(--accent); }
.levers { margin-top: clamp(40px, 4vw, 56px); border-top: 1px solid var(--line-2); }
.levers li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px var(--gap); padding: 22px 0; border-bottom: 1px solid var(--line); }
.levers .n { font: 500 .78rem/1.9 var(--mono); color: var(--accent); letter-spacing: .08em; }
.levers h3 { font: 600 1.0625rem/1.4 var(--sans); }
.levers p { grid-column: 2; color: var(--muted); }
.callouts { display: grid; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: var(--gap); margin-top: clamp(40px, 4vw, 56px); }
.callout { padding: 26px 28px; border-radius: 4px; background: color-mix(in srgb, var(--fg) 4.5%, transparent); border: 1px solid var(--line); }
.callout h3 { font: 400 1.35rem/1.2 var(--display); letter-spacing: -.012em; }
.callout p { margin-top: 10px; color: var(--muted); font-size: var(--fs-small); }

/* Sectors (where we invest) */
.sectors { border-top: 1px solid var(--line-2); }
.sector { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); padding: clamp(40px, 5vw, 80px) 0; border-bottom: 1px solid var(--line-2); }
.sector__head { grid-column: 1 / span 4; align-self: start; position: sticky; top: calc(var(--hdr-h) + 32px); }
.sector__n { display: block; font: 300 italic clamp(3.2rem, 2.4rem + 2.8vw, 5.6rem)/.85 var(--display); color: var(--accent); letter-spacing: -.03em; }
.sector__head .h3 { margin-top: 22px; font-size: clamp(1.7rem, 1.3rem + 1.2vw, 2.5rem); max-width: 14ch; }
.sector__head .tag { margin-top: 14px; }
.sector__facts { grid-column: 6 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--gap); }
.sector__facts > div { padding: 18px 0 26px; border-top: 1px solid var(--line); }
.sector__facts > div.full { grid-column: 1 / -1; }
.sector__facts dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.sector__facts dd { margin-top: 10px; color: var(--muted); }
.sector__facts dd strong { color: var(--fg); }
.sector__facts dd p + p { margin-top: .7em; }

/* Brokers (what to send + next steps) */
.desk { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 48px; }
.desk__notes { grid-column: 1 / span 6; }
.desk__steps { grid-column: 8 / -1; }
.notes > p { color: var(--muted); }
.notes > p + p { margin-top: 1em; }
.notes strong { color: var(--fg); }
.desk h3 { font: 400 1.6rem/1.15 var(--display); letter-spacing: -.015em; margin-bottom: 22px; }
.desk__send { margin-top: 48px; }
.dash li { position: relative; padding: 14px 0 14px 34px; border-bottom: 1px solid var(--line); color: var(--fg); }
.dash li:first-child { border-top: 1px solid var(--line); }
.dash li::before { content: ''; position: absolute; left: 0; top: 1.45em; width: 18px; height: 1px; background: var(--accent); }

/* CTA band */
.cta { position: relative; overflow: hidden; padding-block: clamp(120px, 14vw, 220px); }
.cta::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(12, 17, 16, .9) 0%, rgba(12, 17, 16, .5) 45%, rgba(12, 17, 16, .1) 100%); }
.cta__in { position: relative; z-index: 2; }
.cta .h2 { font-size: clamp(2.6rem, 1.5rem + 4.2vw, 6.2rem); max-width: 14ch; margin-top: 22px; letter-spacing: -.035em; }
.cta__text { margin-top: 26px; max-width: 40rem; color: var(--muted); font-size: clamp(1.05rem, 1rem + .3vw, 1.22rem); }
.cta .actions { margin-top: 40px; }

/* Next page link */
.next { border-top: 1px solid var(--line); }
.next a { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 18px 32px; padding-block: clamp(48px, 6vw, 96px); }
.next__name { display: block; margin-top: 18px; font: 300 clamp(2.6rem, 1.4rem + 4.6vw, 7rem)/.95 var(--display); letter-spacing: -.04em; transition: transform .6s var(--ease-out); }
.next__go { width: clamp(64px, 6vw, 96px); height: clamp(64px, 6vw, 96px); border-radius: 50%; border: 1px solid var(--line-2); display: grid; place-items: center; transition: background-color .4s, border-color .4s, color .4s; }
.next__go svg { width: 22px; height: 22px; }
@media (hover: hover) {
  .next a:hover .next__name { transform: translateX(12px); font-style: italic; }
  .next a:hover .next__go { background: var(--accent); border-color: var(--accent); color: var(--ink); }
}

/* Tracks (careers cards) */
.tracks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.track { position: relative; display: flex; flex-direction: column; padding: clamp(26px, 2.6vw, 40px); min-height: 400px; border: 1px solid var(--line-2); border-radius: 4px; transition: background-color .4s var(--ease), border-color .4s; }
.track__n { font: 300 italic 3.2rem/.9 var(--display); color: var(--accent); }
.track .h3 { margin-top: clamp(40px, 5vw, 72px); font-size: clamp(1.8rem, 1.4rem + 1.2vw, 2.6rem); }
.track .tag { margin-top: 12px; }
.track p { margin-top: 16px; color: var(--muted); }
.track .link-go { margin-top: auto; align-self: flex-start; }
.track > p:last-of-type { margin-bottom: 30px; }
@media (hover: hover) { .track:hover { background: color-mix(in srgb, var(--fg) 4%, transparent); border-color: var(--fg); } }

.tracks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.track ul { margin-top: 22px; border-top: 1px solid var(--line); }
.track li { padding: 11px 0 11px 28px; border-bottom: 1px solid var(--line); position: relative; font-size: var(--fs-small); }
.track li::before { content: ''; position: absolute; left: 0; top: 1.25em; width: 14px; height: 1px; background: var(--accent); }

/* Pillar plates (investments) */
.pillars { display: grid; gap: clamp(88px, 11vw, 176px); }
.pillar { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: center; scroll-margin-top: calc(var(--hdr-h) + 24px); }
.pillar__plate { grid-column: 1 / span 5; grid-row: 1; position: relative; aspect-ratio: 4 / 5; border-radius: 4px; overflow: hidden; background: var(--ink); color: var(--text-d); isolation: isolate; }
.pillar__plate .terrain::before { display: none; }
.pillar__plate::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(12, 17, 16, .85), transparent 40%); }
.pillar__fig { position: absolute; z-index: 2; left: 24px; right: 24px; bottom: 22px; display: flex; justify-content: space-between; gap: 12px; font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label-d); }
.pillar__num { position: absolute; z-index: 2; left: 22px; top: 14px; font: 300 italic clamp(4rem, 3rem + 4vw, 7.5rem)/1 var(--display); color: var(--ember); letter-spacing: -.04em; }
.pillar__body { grid-column: 7 / -1; grid-row: 1; }
.pillar:nth-child(even) .pillar__plate { grid-column: 8 / -1; }
.pillar:nth-child(even) .pillar__body { grid-column: 1 / span 6; }
.pillar__body .h2 { margin-top: 18px; }
.pillar__sub { margin-top: 12px; font: 300 italic clamp(1.25rem, 1.1rem + .6vw, 1.7rem)/1.25 var(--display); color: var(--accent); letter-spacing: -.01em; }
.pillar__role { margin-top: 30px; display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: baseline; padding: 14px 0; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.pillar__role dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.pillar__role dd { font-weight: 500; }
.pillar__body .prose { margin-top: 26px; }
.pillar__body .link-go { margin-top: 30px; }
.listed { margin-top: clamp(88px, 10vw, 160px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); padding-top: 26px; border-top: 1px solid var(--line-2); }
.listed .kicker { grid-column: 1 / span 3; }
.listed p:last-child { grid-column: 4 / span 7; font: 300 clamp(1.35rem, 1.1rem + .9vw, 1.9rem)/1.3 var(--display); letter-spacing: -.012em; }
.hero-facts a { transition: color .2s; }
.hero-facts a:hover { color: var(--ember); }

/* Lists of short items (benefits, traits) */
.items { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: clamp(36px, 4vw, 64px) var(--gap); }
.item { border-top: 1px solid var(--line-2); padding-top: 22px; }
.item .h3, .item h3 { margin-top: 12px; }
.item h3:not(.h3) { font: 400 1.5rem/1.15 var(--display); letter-spacing: -.015em; }
.item p { margin-top: 10px; color: var(--muted); }
.item .tag + h3 { margin-top: 14px; }

/* Checklist with labels (program details, "what you'll do") */
.points { border-top: 1px solid var(--line-2); }
.points li { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 8px var(--gap); padding: 24px 0; border-bottom: 1px solid var(--line); }
.points h3 { font: 400 1.4rem/1.2 var(--display); letter-spacing: -.012em; }
.points p { color: var(--muted); }

/* Directory table (teams) */
.dir { width: 100%; border-collapse: collapse; }
.dir caption { text-align: left; }
.dir th, .dir td { text-align: left; vertical-align: top; padding: 20px 24px 20px 0; border-bottom: 1px solid var(--line); }
.dir thead th { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); border-bottom: 1px solid var(--line-2); padding-top: 0; }
.dir tbody th[scope='row'] { font: 400 1.25rem/1.25 var(--display); letter-spacing: -.01em; width: 30%; }
.dir td { color: var(--muted); }
.dir td:last-child { white-space: nowrap; color: var(--fg); font: 500 .8rem/1.6 var(--mono); letter-spacing: .06em; text-transform: uppercase; padding-right: 0; }
.dir .dir__group th { padding-top: 44px; font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); border-bottom: 1px solid var(--line-2); }
.dir tbody:first-of-type .dir__group th { padding-top: 26px; }

/* FAQ */
.faq { border-top: 1px solid var(--line-2); }
.faq details { border-bottom: 1px solid var(--line-2); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 26px 0; font: 400 clamp(1.25rem, 1.1rem + .5vw, 1.6rem)/1.25 var(--display); letter-spacing: -.012em; transition: color .25s; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--accent); }
.faq__icon { position: relative; width: 36px; height: 36px; border: 1px solid var(--line-2); border-radius: 50%; flex: none; transition: transform .4s var(--ease), background-color .3s, border-color .3s; }
.faq__icon::before, .faq__icon::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1px; background: currentColor; translate: -50% -50%; }
.faq__icon::after { rotate: 90deg; transition: rotate .4s var(--ease); }
.faq details[open] .faq__icon { background: var(--fg); border-color: var(--fg); color: var(--bg); }
.faq details[open] .faq__icon::after { rotate: 0deg; }
.faq__a { padding: 0 0 30px; max-width: 64ch; color: var(--muted); }
.faq__a p + p { margin-top: .8em; }
.faq__a a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* Offices */
.offices { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
.office { border-top: 1px solid var(--line-2); padding-top: 26px; }
.office__top { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; }
.office__city { font: 300 clamp(2.4rem, 1.6rem + 2.6vw, 4.2rem)/1 var(--display); letter-spacing: -.035em; }
.clock { font: 500 .8rem/1 var(--mono); letter-spacing: .08em; color: var(--label); white-space: nowrap; }
.clock b { font-weight: 500; color: var(--fg); }
.office p { margin-top: 22px; color: var(--muted); max-width: 46ch; }
.office address { margin-top: 26px; display: grid; gap: 4px; justify-items: start; }
.office .coords { margin-top: 18px; }

/* Forms ------------------------------------------------------------------ */
.form-shell { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 56px; }
.form-shell__aside { grid-column: 1 / span 4; }
.form-shell__main { grid-column: 6 / -1; }
.form-card { background: var(--white); color: var(--text-l); border-radius: 6px; padding: clamp(24px, 3.4vw, 56px); border: 1px solid rgba(17, 24, 22, .08); box-shadow: 0 40px 80px -48px rgba(17, 24, 22, .35); }
.form-card__head { margin-bottom: 36px; }
.form-card__head .h3 { font-size: clamp(1.8rem, 1.4rem + 1.2vw, 2.5rem); }
.form-card__head p { margin-top: 10px; color: var(--muted-l); font-size: var(--fs-small); }
.form { display: block; }
.form .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; }
.form .full { grid-column: 1 / -1; }
.field { margin: 0 0 26px; padding: 0; border: 0; min-width: 0; }
.field > label, .field > legend { display: block; margin-bottom: 9px; padding: 0; font: 600 .875rem/1.35 var(--sans); color: var(--text-l); }
.req { color: var(--ember-l); margin-left: 3px; }
.opt { margin-left: 6px; font-weight: 400; color: var(--muted-l); }
.box-in { position: relative; display: flex; align-items: center; background: var(--white); border: 1px solid rgba(17, 24, 22, .22); border-radius: 4px; transition: border-color .2s, box-shadow .2s; }
.box-in:hover { border-color: rgba(17, 24, 22, .45); }
.box-in:focus-within { border-color: var(--text-l); box-shadow: 0 0 0 2px var(--ember-l); } /* a solid 2px ring at 5.6:1 (WCAG 2.4.13), not a faint glow */
.box-in input, .box-in select, .box-in textarea { flex: 1; min-width: 0; width: 100%; border: 0; background: transparent; padding: 14px 15px; font-size: 1rem; line-height: 1.4; color: var(--text-l); outline: none; border-radius: 4px; }
.box-in select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; }
.box-in .chev { position: absolute; right: 15px; top: 50%; translate: 0 -50%; width: 12px; height: 12px; pointer-events: none; color: var(--muted-l); }
.box-in--area textarea { min-height: 160px; resize: vertical; }
.box-in input::placeholder, .box-in textarea::placeholder { color: #6A736F; }
.phone .cc { position: relative; display: flex; align-items: center; gap: 7px; padding: 0 12px 0 14px; align-self: stretch; border-right: 1px solid rgba(17, 24, 22, .14); }
.phone .cc img { width: 20px; height: auto; border-radius: 2px; }
.phone .cc .dial { font-size: .95rem; color: var(--text-l); font-variant-numeric: tabular-nums; }
.phone .cc .chev { position: static; translate: none; width: 10px; height: 10px; }
.phone .cc select { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.hint { margin-top: 8px; font-size: .84rem; line-height: 1.5; color: var(--muted-l); }
.hint a { color: var(--text-l); text-decoration: underline; text-underline-offset: 2px; }
.error { display: none; margin-top: 8px; font-size: .84rem; font-weight: 600; color: #A3311F; }
.field.invalid .error { display: block; }
.field.invalid .box-in { border-color: #A3311F; }
.field.invalid .choice > span { border-color: rgba(163, 49, 31, .55); }
.choices { display: grid; grid-template-columns: 1fr; gap: 8px; }
.choices--row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.choice { position: relative; display: grid; cursor: pointer; }
.choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.choice > span { display: grid; grid-template-columns: 18px 1fr; column-gap: 14px; padding: 15px 16px; border: 1px solid rgba(17, 24, 22, .18); border-radius: 4px; transition: border-color .2s, background-color .2s; }
.choice > span::before { content: ''; grid-row: 1 / span 2; width: 18px; height: 18px; margin-top: 2px; border: 1px solid rgba(17, 24, 22, .4); border-radius: 50%; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.choice strong { font-weight: 600; font-size: .95rem; line-height: 1.4; }
.choice small { color: var(--muted-l); font-size: .84rem; line-height: 1.45; }
.choice:hover > span { border-color: rgba(17, 24, 22, .45); }
.choice input:checked + span { border-color: var(--text-l); background: rgba(17, 24, 22, .035); }
.choice input:checked + span::before { border-color: var(--text-l); background: var(--text-l); box-shadow: inset 0 0 0 4px var(--white); }
.choice input:focus-visible + span { outline: 2px solid var(--ember-l); outline-offset: 2px; }
.careers-note .hint { margin: -10px 0 22px; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.ts { margin: 6px 0 18px; min-height: 65px; }
.consent { font-size: .84rem; line-height: 1.55; color: var(--muted-l); max-width: 60ch; }
.consent a { color: var(--text-l); text-decoration: underline; text-underline-offset: 2px; }
.submit { margin-top: 26px; display: inline-flex; align-items: center; gap: .75em; min-height: 56px; padding: 0 1.8em; border-radius: 999px; background: var(--ink); color: var(--bone); font: 500 1rem/1 var(--sans); transition: background-color .3s var(--ease); }
.submit:hover { background: #24302d; }
.submit:hover .i-arrow { transform: translateX(4px); }
.submit:disabled { opacity: .6; cursor: progress; }
.status { display: none; margin-top: 22px; padding: 18px 20px; border-radius: 4px; font-size: .95rem; }
.status.show { display: block; }
.status--ok { background: #E6EDE7; border: 1px solid #A9BFB0; color: #173322; }
.status--err { background: #F6E4DE; border: 1px solid #DDA08E; color: #6B1F10; }
.status h3 { font: 400 1.4rem/1.2 var(--display); margin-bottom: 6px; }
.status p + p { margin-top: .5em; }

/* Legal documents -------------------------------------------------------- */
.legal { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
.legal__toc { grid-column: 1 / span 3; }
.legal__toc .sticky { padding-top: 6px; }
.legal__body { grid-column: 5 / span 7; max-width: 72ch; }
.toc { border-top: 1px solid var(--line-2); margin-top: 16px; }
.toc li { border-bottom: 1px solid var(--line); }
.toc a { display: block; padding: 10px 0; font-size: .9rem; color: var(--muted); transition: color .2s; }
.toc a:hover { color: var(--fg); }
.legal__body .updated { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); margin-bottom: 28px; }
.legal__body > p, .legal__body li { color: var(--muted); }
.legal__body > * + * { margin-top: 1.1em; }
.legal__body h2 { font: 400 clamp(1.6rem, 1.3rem + 1vw, 2.2rem)/1.15 var(--display); letter-spacing: -.02em; color: var(--fg); margin-top: 2.4em; padding-top: 1.1em; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--hdr-h) + 24px); }
.legal__body h3 { font: 600 1.05rem/1.4 var(--sans); color: var(--fg); margin-top: 1.8em; }
.legal__body ul { display: grid; gap: .7em; }
.legal__body ul li { position: relative; padding-left: 26px; }
.legal__body ul li::before { content: ''; position: absolute; left: 0; top: .8em; width: 12px; height: 1px; background: var(--accent); }
.legal__body strong { color: var(--fg); }
.legal__body a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.legal__body a:hover { color: var(--accent); }
.legal__body address { color: var(--muted); }
.legal__body .legal-nav { display: none; }

/* Footer ----------------------------------------------------------------- */
.ftr { position: relative; overflow: hidden; padding-top: clamp(80px, 9vw, 140px); }
.ftr__top { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 56px; }
.ftr__intro { grid-column: 1 / span 4; }
.ftr__intro p { font: 300 clamp(1.5rem, 1.2rem + 1vw, 2.1rem)/1.18 var(--display); letter-spacing: -.02em; max-width: 18ch; }
.ftr__intro .actions { margin-top: 32px; }
.ftr__nav { grid-column: 6 / span 4; display: grid; grid-template-columns: 1fr 1fr; gap: 32px var(--gap); }
.ftr h2 { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--label-d); margin-bottom: 18px; }
.ftr__nav li + li { margin-top: 10px; }
.ftr__nav a, .ftr__offices a { color: rgba(238, 233, 223, .78); transition: color .2s; }
.ftr__nav a:hover, .ftr__offices a:hover { color: #fff; }
.ftr__offices { grid-column: 10 / -1; display: grid; gap: 30px; align-content: start; }
.ftr__offices address { color: rgba(238, 233, 223, .78); font-size: var(--fs-small); line-height: 1.6; }
.ftr__offices .clock { display: block; margin-bottom: 10px; }
.ftr__city { display: block; color: var(--text-d); font-weight: 600; font-size: 1rem; margin-bottom: 4px; }
.ftr__mark { margin-top: clamp(64px, 8vw, 128px); font: 300 clamp(5rem, 1rem + 21.6vw, 25rem)/.74 var(--display); letter-spacing: -.055em; color: rgba(238, 233, 223, .075); white-space: nowrap; user-select: none; transform: translateX(-.045em); }
.ftr__mark span { color: var(--ember); }
.ftr__legal { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 20px; border-top: 1px solid rgba(238, 233, 223, .12); padding-block: 32px 40px; margin-top: clamp(28px, 3vw, 44px); font-size: .82rem; color: var(--muted-d); }
.ftr__disclaimer { grid-column: 1 / span 7; line-height: 1.6; max-width: 80ch; }
.ftr__meta { grid-column: 9 / -1; display: grid; gap: 14px; justify-items: end; text-align: right; }
.ftr__meta ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 22px; }
.ftr__meta a { color: rgba(238, 233, 223, .78); }
.ftr__meta a:hover { color: #fff; }
.ftr__social { display: inline-flex; align-items: center; gap: 10px; }
.ftr__social svg { width: 16px; height: 16px; }
.to-top { position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: rgba(17, 24, 22, .9); color: var(--text-d); border: 1px solid rgba(238, 233, 223, .18); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .3s, transform .3s var(--ease); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
/* Hidden: not tappable, not focusable, not read (visibility switches after the fade; site.js also sets aria-hidden) */
.to-top:not(.show) { visibility: hidden; transition: opacity .3s, transform .3s var(--ease), visibility 0s linear .3s; }
@media (prefers-reduced-motion: reduce) { .to-top, .to-top:not(.show) { transition: none; transform: none; } }
.to-top svg { width: 16px; height: 16px; }

/* 404 */
.lost { min-height: 100svh; display: flex; align-items: flex-end; }
.lost .hero__in { padding-bottom: clamp(56px, 8vw, 120px); }
.lost .display { max-width: 9ch; }
.lost .hero__lead { margin-top: 32px; }
.lost .actions { margin-top: 36px; }

/* Counts and delays set by the components */
.n2 { --n: 2; } .n3 { --n: 3; } .n4 { --n: 4; } .n5 { --n: 5; } .n6 { --n: 6; }
[data-d='1'] { --d: 1; } [data-d='2'] { --d: 2; } [data-d='3'] { --d: 3; } [data-d='4'] { --d: 4; } [data-d='5'] { --d: 5; } [data-d='6'] { --d: 6; }
.nav__item.is-closed .drop { opacity: 0 !important; visibility: hidden !important; }

/* Misc layout helpers */
.mt-s { margin-top: 20px; } .mt-m { margin-top: clamp(32px, 3.4vw, 48px); } .mt-l { margin-top: clamp(56px, 6vw, 96px); } .mt-xl { margin-top: clamp(80px, 9vw, 144px); }
.max-40 { max-width: 40rem; } .max-50 { max-width: 50rem; }
.rule { border: 0; border-top: 1px solid var(--line); margin: 0; }
.center { text-align: center; }

/* Reveal ----------------------------------------------------------------- */
.js .rv { opacity: 0; transform: translateY(28px); transition: opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out); transition-delay: calc(var(--d, 0) * 90ms); }
.js .rv.in { opacity: 1; transform: none; }
.hero .rise { opacity: 0; transform: translateY(24px); animation: rise 1.2s var(--ease-out) forwards; animation-delay: calc(120ms + var(--d, 0) * 110ms); }
.hero .rise-line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; padding-top: .12em; margin-top: -.12em; } /* headroom for ascenders at line-height .9 */
.hero .rise-line > span { display: block; transform: translateY(105%); animation: line 1.3s var(--ease-out) forwards; animation-delay: calc(80ms + var(--d, 0) * 120ms); }
@keyframes rise { to { opacity: 1; transform: none; } }
/* The h1, the lead and the home hero foot are the largest-contentful-paint candidates. They rise from a visible,
   half-faded start (opacity 0 would hide them from first paint until the animation ends), a little sooner. The
   display lines on the home page slide up from partly inside their mask, for the same reason. (Ported from www, PR #21.) */
.hero .h1.rise, .hero .hero__lead.rise, .hero .hero__foot.rise { animation-name: rise-lcp; animation-duration: 1s; animation-fill-mode: both; animation-delay: calc(60ms + var(--d, 0) * 70ms); }
@keyframes rise-lcp { from { opacity: .5; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.hero .rise-line > span { transform: translateY(45%); animation-fill-mode: both; animation-name: line-lcp; }
@keyframes line-lcp { from { transform: translateY(45%); opacity: .5; } to { transform: none; opacity: 1; } }
@keyframes line { to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .js .rv, .hero .rise, .hero .rise-line > span, .hero .h1.rise, .hero .hero__lead.rise, .hero .hero__foot.rise { opacity: 1; transform: none; animation: none; }
  .js .manifesto[data-words].split .w { opacity: 1; }
}

/* ==========================================================================
   Caldrion Ventures layer: the parent system, with more room for products,
   founders and the work of building companies.
   ========================================================================== */
.mb-s { margin-bottom: 20px; }
.site-ventures { --hdr-h: 108px; }
.hdr--ventures .hdr__in { height: 76px; }
.parent-bar { border-bottom: 1px solid rgba(238, 233, 223, .08); font: 500 var(--fs-micro)/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label-d); transition: margin .4s var(--ease), opacity .3s; }
.parent-bar__in { display: flex; justify-content: space-between; align-items: center; height: 32px; }
.parent-bar a { color: rgba(238, 233, 223, .8); transition: color .2s; }
.parent-bar a:hover { color: #fff; }
.hdr.is-scrolled .parent-bar { margin-top: -33px; opacity: 0; }
.hdr.is-scrolled:focus-within .parent-bar { margin-top: 0; opacity: 1; }
.brand--ventures { display: inline-flex; align-items: baseline; gap: .42em; }
.brand__unit { font: 500 .7rem/1 var(--mono); letter-spacing: .2em; text-transform: uppercase; color: var(--ember); transform: translateY(-.15em); }
.drop__ext .ext { color: var(--ember); }
.mmenu__toggle--row { width: 100%; height: auto; border: 0; border-radius: 0; display: flex; align-items: center; justify-content: space-between; text-align: left; }
.mmenu__toggle--row .mmenu__link { padding: 18px 0; }
.mmenu__plus { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(238, 233, 223, .2); flex: none; }
.mmenu__plus svg { width: 12px; height: 12px; transition: transform .3s var(--ease); }
.mmenu__toggle--row[aria-expanded='true'] .mmenu__plus svg { transform: rotate(45deg); }
.mmenu__foot .btn--line { border-color: rgba(238, 233, 223, .3); }
.mmenu__offices a { color: var(--text-d); }
.ftr__nav--3 { grid-column: 6 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ftr__intro .link { color: var(--text-d); }
.ftr__intro .ftr__sub { margin-top: 16px; font: 400 var(--fs-small)/1.6 var(--sans); letter-spacing: 0; color: var(--muted-d); max-width: 34ch; }

/* Relationship labels: the same everywhere */
.rel { display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px 6px 9px; border-radius: 999px; border: 1px solid var(--line-2); font: 500 .68rem/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg); white-space: nowrap; }
.rel i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.rel--investment i { background: #5E8C76; box-shadow: 0 0 0 3px rgba(94, 140, 118, .18); }
.rel--studio i { background: var(--ember); box-shadow: 0 0 0 3px rgba(227, 154, 107, .2); }
.rel--incubation i { background: transparent; border: 1px solid var(--ember); }
.rel__note { color: var(--muted); letter-spacing: .06em; }
.rel-key { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); margin-top: clamp(48px, 6vw, 80px); padding-top: 24px; border-top: 1px solid var(--line); }
.rel-key dd { margin-top: 12px; color: var(--muted); font-size: var(--fs-small); max-width: 36ch; }

/* Logo tiles carry each company's own colors */
.logo-tile { --tile: #182120; display: inline-grid; place-items: center; background: var(--tile); border-radius: 10px; overflow: hidden; border: 1px solid rgba(17, 24, 22, .08); }
.logo-tile img { width: 100%; height: 100%; object-fit: contain; }
.logo-tile--sm { width: 96px; height: 34px; border-radius: 6px; }
.logo-tile--md { width: 168px; height: 56px; }
.logo-tile--lg { width: 252px; height: 84px; border-radius: 12px; }
.logo-tile__name { font: 500 1rem/1 var(--sans); color: #fff; padding: 0 12px; }

/* Company cards */
.co-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.co-card { --co: var(--ember); position: relative; display: flex; flex-direction: column; background: var(--white); color: var(--text-l); border: 1px solid rgba(17, 24, 22, .1); border-radius: 6px; overflow: hidden; transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .3s; }
.co-card::before { content: ''; position: absolute; inset: 0 0 auto; height: 3px; background: var(--co); z-index: 3; }
.co-card__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 22px 22px 18px; }
.co-card__top .rel { --fg: var(--text-l); --line-2: rgba(17, 24, 22, .2); }
.co-card__shot { aspect-ratio: 16 / 10; overflow: hidden; border-block: 1px solid rgba(17, 24, 22, .08); background: #ddd; }
.co-card__shot img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 1.2s var(--ease-out); }
.co-card__body { padding: 24px 22px 0; flex: 1; }
.co-card__body .h3 { font-size: clamp(1.6rem, 1.3rem + .9vw, 2.2rem); }
.co-card__tag { margin-top: 6px; font: 400 1.05rem/1.35 var(--display); font-style: italic; color: var(--co); filter: saturate(.9) brightness(.8); }
/* The brand color mixed toward ink so light brand colors (Slots at Sea's gold) still read as text on the white card
   (WCAG AA; ported from www.caldrion.com). */
@supports (color: color-mix(in oklab, red, blue)) { .co-card__tag { color: color-mix(in oklab, var(--co) 45%, var(--ink)); filter: none; } }
.co-card__body > p:last-child { margin-top: 14px; color: var(--muted-l); font-size: var(--fs-small); line-height: 1.6; }
.co-card__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 22px 22px 0; padding: 16px 0 22px; border-top: 1px solid rgba(17, 24, 22, .1); }
.co-card__facts dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label-l); }
.co-card__facts dd { margin-top: 4px; font-size: .9rem; }
.co-card__go { position: absolute; right: 18px; bottom: 18px; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(17, 24, 22, .2); transition: background-color .3s, color .3s, border-color .3s; }
.co-card__go svg { width: 14px; height: 14px; }
@media (hover: hover) {
  .co-card:hover { transform: translateY(-4px); box-shadow: 0 40px 70px -40px rgba(17, 24, 22, .45); border-color: rgba(17, 24, 22, .2); }
  .co-card:hover .co-card__shot img { transform: scale(1.03); }
  .co-card:hover .co-card__go { background: var(--ink); color: var(--bone); border-color: var(--ink); }
}
.tone-ink .co-card, .tone-ink2 .co-card { border-color: transparent; }

/* Platform diagram: parent -> Ventures -> two activities -> companies */
.org { margin-top: clamp(56px, 6vw, 96px); display: grid; gap: 0; max-width: 980px; }
.org__node { position: relative; display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); align-items: baseline; gap: 6px 28px; padding: 22px 0; border-top: 1px solid var(--line-2); }
.org__k { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--accent); grid-row: span 2; }
.org__name { font: 300 clamp(1.6rem, 1.2rem + 1.2vw, 2.4rem)/1 var(--display); letter-spacing: -.02em; }
.org__d { color: var(--muted); font-size: var(--fs-small); max-width: 52ch; }
.org__d a { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.org__node--unit { padding-left: 28px; }
.org__node--unit::before, .org__split::before, .org__node--cos::before { content: ''; position: absolute; left: 0; top: -1px; bottom: 50%; width: 14px; border-left: 1px solid var(--accent); border-bottom: 1px solid var(--accent); }
.org__split { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); padding-left: 56px; border-top: 1px solid var(--line-2); }
.org__split::before { left: 28px; }
.org__split .org__node { grid-template-columns: 1fr; border-top: 0; padding: 22px 0; transition: color .2s; }
.org__split .org__node .org__k { grid-row: auto; }
.org__split .org__node:hover .org__name { font-style: italic; color: var(--accent); }
.org__node--cos { padding-left: 84px; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); }
.org__node--cos::before { left: 56px; }
.org__node--cos .org__k { grid-row: auto; }

/* Two activities */
.arms { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
.arm { padding: clamp(28px, 3.4vw, 56px); border-radius: 6px; background: var(--bone); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 22px; }
.arm--studio { background: var(--ink); color: var(--text-d); --fg: var(--text-d); --muted: var(--muted-d); --label: var(--label-d); --accent: var(--ember); --line: rgba(238, 233, 223, .13); --line-2: rgba(238, 233, 223, .26); }
.arm .h2 { font-size: clamp(2.2rem, 1.5rem + 2.2vw, 3.8rem); }
.arm .prose ul { display: grid; gap: 10px; }
.arm .prose li { padding-left: 0; }
.arm .link-go { margin-top: auto; align-self: flex-start; }

/* Thesis rows */
.themes { border-top: 1px solid var(--line-2); }
.theme { position: relative; display: grid; grid-template-columns: 64px minmax(0, 6fr) minmax(0, 5fr); gap: var(--gap); align-items: baseline; padding: clamp(22px, 2.4vw, 34px) 0; border-bottom: 1px solid var(--line-2); }
.theme__n { font: 500 .78rem/1 var(--mono); color: var(--accent); }
.theme__name { font: 300 clamp(1.7rem, 1.2rem + 1.8vw, 3rem)/1.05 var(--display); letter-spacing: -.025em; transition: transform .5s var(--ease-out); }
.theme__d { color: var(--muted); }
@media (hover: hover) { .theme:hover .theme__name { transform: translateX(8px); font-style: italic; color: var(--accent); } }
.thesis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.thesis__block { border-top: 1px solid var(--line-2); padding-top: 22px; }
.thesis__block > p { margin-top: 14px; color: var(--muted); }
.thesis__block .dash { margin-top: 10px; }
.thesis__block .dash li { padding-block: 10px; font-size: var(--fs-small); }
.thesis__cos { margin-top: clamp(40px, 5vw, 64px); display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; }
.thesis__cos ul { display: flex; flex-wrap: wrap; gap: 14px; }
.thesis__co { display: inline-flex; align-items: center; gap: 14px; padding: 8px 18px 8px 8px; border: 1px solid var(--line-2); border-radius: 12px; transition: border-color .2s; }
.thesis__co:hover { border-color: var(--fg); }
.thesis__co > span:last-child { display: grid; gap: 6px; min-width: 0; }
/* At 320px a long name and badge must wrap inside the card rather than push the page sideways. */
.thesis__cos ul, .thesis__cos li, .thesis__co { min-width: 0; max-width: 100%; }
.thesis__co .rel { white-space: normal; }
.thesis__co .rel { padding: 4px 8px; font-size: .6rem; }

/* Studio process diagram */
.process__diagram { margin: 0; }
.process__track { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line-2); }
.process__stage { position: relative; display: grid; align-content: start; gap: 10px; padding: 30px clamp(14px, 1.6vw, 26px) 26px 0; }
.process__stage + .process__stage { padding-left: clamp(14px, 1.6vw, 26px); border-left: 1px dashed var(--line-2); }
.process__stage::before { content: ''; position: absolute; top: -6px; left: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--bg); border: 1px solid var(--accent); }
.process__stage:first-child::before { background: var(--accent); }
.process__stage + .process__stage::before { left: -6px; }
.process__n { font: 500 .78rem/1 var(--mono); color: var(--accent); }
.process__name { font: 300 clamp(1.5rem, 1.15rem + 1vw, 2.2rem)/1 var(--display); letter-spacing: -.02em; }
.process__q { color: var(--muted); font-size: var(--fs-small); line-height: 1.5; }
.process__gate { position: absolute; right: -9px; top: 50%; z-index: 2; width: 18px; height: 18px; transform: rotate(45deg); background: var(--bg); border: 1px solid var(--accent); }
.process__gate i { position: absolute; inset: 4px; background: var(--accent); opacity: .5; }
.process__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); }
.process__legend > span { display: inline-flex; align-items: center; gap: 10px; }
.process__legend-note { margin-left: auto; text-transform: none; letter-spacing: 0; font: 400 var(--fs-small)/1.4 var(--sans); color: var(--muted); }
.lg { display: inline-block; width: 10px; height: 10px; transform: rotate(45deg); border: 1px solid var(--accent); }
.lg--go { background: var(--accent); }
.lg--revise { background: linear-gradient(135deg, var(--accent) 50%, transparent 50%); }
.lg--close { background: transparent; }
.process__detail { margin-top: clamp(56px, 6vw, 96px); display: grid; gap: 0; }
.stage { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--gap); padding: clamp(32px, 3.4vw, 52px) 0; border-top: 1px solid var(--line-2); }
.stage__head { display: grid; align-content: start; gap: 10px; }
.stage__n { font: 500 .78rem/1 var(--mono); color: var(--accent); }
.stage__q { font: 300 1.25rem/1.3 var(--display); font-style: italic; color: var(--muted); }
.stage__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.stage__cols .kicker { margin-bottom: 8px; }
.stage__cols .dash li { padding-block: 10px; font-size: var(--fs-small); }
.stage__decide p { margin-top: 8px; color: var(--muted); font-size: var(--fs-small); line-height: 1.6; }
.stage__decide b { color: var(--fg); font-weight: 600; }

/* Capabilities */
.caps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-2); }
.cap { padding: 26px clamp(16px, 2vw, 30px) 30px 0; border-bottom: 1px solid var(--line); }
.cap:not(:nth-child(3n + 1)) { padding-left: clamp(16px, 2vw, 30px); border-left: 1px solid var(--line); }
.cap__who { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.cap h3 { margin-top: 14px; font: 400 1.5rem/1.15 var(--display); letter-spacing: -.015em; }
.cap p:last-child { margin-top: 10px; color: var(--muted); font-size: var(--fs-small); line-height: 1.55; }
.res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.res__col { border-top: 1px solid var(--line-2); padding-top: 22px; }
.res__col li { padding: 18px 0; border-bottom: 1px solid var(--line); }
.res__col h4 { font: 400 1.35rem/1.2 var(--display); }
.res__col p { margin-top: 6px; color: var(--muted); font-size: var(--fs-small); }

/* Sources, evaluation, principles, opportunities */
.sources { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.source { border-top: 1px solid var(--line-2); padding-top: 22px; }
.source__n { font: 300 3.6rem/.9 var(--display); color: var(--accent); letter-spacing: -.04em; }
.source .h3 { margin-top: 22px; }
.source p { margin-top: 12px; color: var(--muted); font-size: var(--fs-small); }
.evals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 var(--gap); }
.eval { padding: 24px 0 30px; border-top: 1px solid var(--line-2); }
.eval__n { font: 500 .78rem/1 var(--mono); color: var(--accent); }
.eval h3 { margin-top: 14px; font: 400 1.5rem/1.15 var(--display); }
.eval p { margin-top: 10px; color: var(--muted); font-size: var(--fs-small); }
.checklist li { padding: 18px 0 18px 36px; border-bottom: 1px solid var(--line); position: relative; color: var(--muted); }
.checklist li:first-child { border-top: 1px solid var(--line-2); }
.checklist li::before { content: ''; position: absolute; left: 4px; top: 1.55em; width: 12px; height: 6px; border-left: 1.5px solid var(--accent); border-bottom: 1.5px solid var(--accent); transform: rotate(-45deg); }
.checklist strong { color: var(--fg); }
.principles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); counter-reset: pr; }
.principles li { border-top: 1px solid var(--line-2); padding-top: 22px; counter-increment: pr; }
.principles li::before { content: counter(pr, upper-roman); font: 300 2rem/1 var(--display); color: var(--accent); }
.principles h3 { margin-top: 18px; font: 400 1.45rem/1.15 var(--display); }
.principles p { margin-top: 10px; color: var(--muted); font-size: var(--fs-small); }
.opps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
.opp { padding: 28px; border: 1px solid var(--line-2); border-radius: 6px; display: grid; gap: 14px; align-content: start; }
.opp p:not(.kicker) { color: var(--muted); }
.opp__seek span { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); margin-right: 8px; }
.empty { max-width: 62ch; padding: 28px 0; border-top: 1px solid var(--line-2); color: var(--muted); }
.org-roles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.org-roles article { border-top: 1px solid var(--line-2); padding-top: 22px; }
.org-roles p { margin-top: 12px; color: var(--muted); font-size: var(--fs-small); }
.prep { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.prep .dash { margin-top: 14px; }
.prep .dash li { font-size: var(--fs-small); padding-block: 11px; }
.sla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line-2); }
.sla > div { padding: 24px clamp(14px, 1.8vw, 26px) 0 0; }
.sla > div + div { padding-left: clamp(14px, 1.8vw, 26px); border-left: 1px solid var(--line); }
.sla dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.sla dd { margin-top: 14px; font: 300 1.3rem/1.35 var(--display); }
.other { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 40px; margin-top: clamp(48px, 5vw, 72px); padding-top: 26px; border-top: 1px solid var(--line-2); color: var(--muted); }
.other strong { color: var(--fg); }

/* Journeys (four ways in) */
.journeys { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.journey { display: flex; flex-direction: column; gap: 16px; min-height: 300px; padding: clamp(22px, 2.4vw, 34px); border: 1px solid var(--line-2); border-radius: 6px; transition: background-color .35s var(--ease), border-color .35s; }
.journey .h3 { margin-top: auto; font-size: clamp(1.6rem, 1.3rem + .9vw, 2.2rem); }
.journey p:not(.kicker) { color: var(--muted); font-size: var(--fs-small); }
.journey .link-go { align-self: flex-start; }
.tone-bone .journey--lead, .tone-stone .journey--lead, .tone-white .journey--lead { background: var(--ink); color: var(--text-d); --fg: var(--text-d); --muted: var(--muted-d); --label: var(--label-d); --accent: var(--ember); --line-2: rgba(238, 233, 223, .3); border-color: var(--ink); }
.tone-ink .journey--lead, .tone-ink2 .journey--lead { background: var(--bone); color: var(--text-l); --fg: var(--text-l); --muted: var(--muted-l); --label: var(--label-l); --accent: var(--ember-l); --line-2: rgba(17, 24, 22, .3); border-color: var(--bone); }
@media (hover: hover) { .journey:not(.journey--lead):hover { border-color: var(--fg); } }

/* People */
.people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 4vw, 56px) var(--gap); }
.people--compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.person__photo { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 4px; background: var(--stone); filter: grayscale(.2); }
.person__photo--none { display: grid; place-items: center; font: 300 3rem/1 var(--display); color: var(--accent); border: 1px solid var(--line-2); }
.person__name { margin-top: 18px; font: 400 1.6rem/1.15 var(--display); }
.person__title { margin-top: 4px; font: 500 var(--fs-micro)/1.4 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--label); }
.person__bio { margin-top: 14px; font-size: var(--fs-small); }
.person .link-go { margin-top: 14px; }

/* Articles */
.art-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.art-card { position: relative; display: flex; flex-direction: column; gap: 14px; padding-top: 22px; border-top: 1px solid var(--line-2); }
.art-card .h3 { font-size: clamp(1.45rem, 1.2rem + .7vw, 1.9rem); transition: color .2s; }
.art-card p:not(.kicker) { color: var(--muted); font-size: var(--fs-small); }
.art-card__by { margin-top: auto; font: 500 var(--fs-micro)/1.4 var(--mono) !important; letter-spacing: .1em; text-transform: uppercase; }
@media (hover: hover) { .art-card:hover .h3 { color: var(--accent); } }
.art-grid--list { row-gap: clamp(48px, 5vw, 72px); }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(36px, 4vw, 56px); }
.filters a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--line-2); border-radius: 999px; font-size: .9rem; transition: border-color .2s, background-color .2s; }
.filters a span { font: 500 .7rem/1 var(--mono); color: var(--label); }
.filters a:hover { border-color: var(--fg); }
.filters a[aria-current] { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.filters a[aria-current] span { color: inherit; opacity: .7; }

/* Article pages */
.hero--article { background: var(--ink); }
.hero--article::before { display: none; }
.hero--article .h1 { font-size: clamp(2.6rem, 1.5rem + 3.8vw, 5.4rem); max-width: 20ch; margin-top: 22px; }
.hero--article .hero__lead { max-width: 44rem; margin-top: 28px; }
.byline { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 36px; padding-top: 18px; border-top: 1px solid rgba(238, 233, 223, .14); font: 500 var(--fs-micro)/1.4 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--label-d); }
.byline a { color: var(--text-d); text-decoration: underline; text-underline-offset: 3px; }
.article { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 56px; }
.article__body { grid-column: 1 / span 8; }
.article__aside { grid-column: 10 / -1; }
.article__cos { display: grid; gap: 22px; margin-top: 16px; }
.article__cos .co-card__shot, .article__cos .co-card__facts { display: none; }
.prose--article { max-width: 68ch; font-size: clamp(1.06rem, 1rem + .25vw, 1.18rem); }
.prose--article h2 { font: 400 clamp(1.7rem, 1.3rem + 1.1vw, 2.4rem)/1.15 var(--display); letter-spacing: -.02em; color: var(--fg); margin-top: 1.8em; }
.prose--article h3 { font: 600 1.1rem/1.4 var(--sans); color: var(--fg); margin-top: 1.6em; }
.prose blockquote { margin: 1.6em 0; padding-left: 24px; border-left: 2px solid var(--accent); font: 300 1.5rem/1.35 var(--display); color: var(--fg); }
.prose blockquote p { color: var(--fg); }
.prose ul, .prose ol { display: grid; gap: .5em; padding-left: 1.2em; }
.prose ul { list-style: disc; } .prose ol { list-style: decimal; }
.prose li::marker { color: var(--accent); }
.prose code { font: .9em var(--mono); background: rgba(17, 24, 22, .06); padding: .1em .35em; border-radius: 3px; }
.prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.prose--lead p:first-child { font: 300 var(--fs-lead)/1.32 var(--display); letter-spacing: -.012em; color: var(--fg); }
.case { display: grid; gap: 0; margin-bottom: clamp(48px, 5vw, 72px); }
.case__part { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 7fr); gap: var(--gap); padding: 28px 0; border-top: 1px solid var(--line-2); }
.case__part h2 { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--accent); padding-top: .5em; }
.case__part--open { background: linear-gradient(90deg, rgba(158, 78, 40, .06), transparent 70%); padding-inline: 16px; }

/* Careers */
.roles { border-top: 1px solid var(--line-2); }
.role-row { position: relative; display: grid; gap: 10px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.role-row p:not(.kicker) { color: var(--muted); max-width: 70ch; }
.role-row__meta { display: flex; flex-wrap: wrap; gap: 6px 22px; font: 500 var(--fs-micro)/1.4 var(--mono) !important; letter-spacing: .1em; text-transform: uppercase; }
@media (hover: hover) { .role-row:hover .h3 { color: var(--accent); } }

/* Company profiles */
.company { --co: var(--ember); }
.hero--company .terrain::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--co) 34%, transparent), color-mix(in srgb, var(--co) 8%, transparent) 45%, transparent 70%); }
.hero--company::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--co); z-index: 3; }
.company__id { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; }
.company__id .rel { --fg: var(--text-d); --line-2: rgba(238, 233, 223, .3); }
.company__id .rel__note { color: var(--muted-d); }
.hero--company .h1 { margin-top: clamp(22px, 2.4vw, 34px); }
.hero--company .hero-facts a { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.sec--shot { padding-block: clamp(48px, 6vw, 96px) 0; }
.company .kicker__n, .company .sec-head .kicker__n { color: var(--co); filter: brightness(.85); }
.company .tone-ink .kicker__n { filter: none; }
/* Section numbers are text: the brand color is mixed toward ink on light sections and toward the light text on dark
   ones, so every company's numbers pass WCAG AA contrast (the brand color stays the accent of bars and dots). */
@supports (color: color-mix(in oklab, red, blue)) {
  .company .kicker__n, .company .sec-head .kicker__n { color: color-mix(in oklab, var(--co) 45%, var(--ink)); filter: none; }
  .company .tone-ink .kicker__n, .company .tone-ink2 .kicker__n, .company .hero .kicker__n { color: color-mix(in oklab, var(--co) 60%, var(--text-d)); }
}
.company__facts dl { display: grid; gap: 0; border-top: 1px solid var(--line-2); }
.company__facts dl > div { padding: 14px 0; border-bottom: 1px solid var(--line); }
.company__facts dt { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); }
.company__facts dd { margin-top: 6px; display: grid; gap: 4px; }
.company .grid12 > .company__prop { grid-column: 4 / span 6; }
.company .grid12 > .company__facts { grid-column: 10 / -1; }
.milestones { border-left: 1px solid var(--line-2); margin-left: 4px; }
.milestones li { position: relative; padding: 0 0 26px 30px; }
.milestones li::before { content: ''; position: absolute; left: -5px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--co); }
.milestones li.is-open::before { background: var(--bg); border: 1px dashed var(--co); }
.milestones time { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--label); }
.milestones p { margin-top: 6px; }
.milestones .tag { display: inline-block; margin-top: 8px; }
.involve__rel { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; color: var(--muted); }

/* Product screenshots */
.shot { margin: 0; }
.shot__frame { border-radius: 10px; overflow: hidden; background: #fff; border: 1px solid rgba(17, 24, 22, .14); box-shadow: 0 50px 90px -50px rgba(12, 17, 16, .55), 0 2px 6px rgba(12, 17, 16, .06); }
.shot__bar { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; background: #EFEBE3; border-bottom: 1px solid rgba(17, 24, 22, .1); }
.shot__bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(17, 24, 22, .16); }
.shot__bar span { margin: 0 auto; padding: 3px 16px; border-radius: 6px; background: #fff; font: 500 .72rem/1.4 var(--mono); color: var(--muted-l); transform: translateX(-21px); }
.shot img { width: 100%; height: auto; display: block; }
.shot figcaption { margin-top: 14px; font-size: var(--fs-small); color: var(--muted); max-width: 60ch; }
.shot--mobile .shot__frame { border-radius: 26px; border: 6px solid #141a18; max-width: 300px; }
.gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(36px, 4vw, 64px) var(--gap); align-items: start; }
.gallery .shot--mobile { grid-row: span 2; justify-self: center; }

/* Inquiry forms */
.form-step + .form-step { margin-top: 14px; padding-top: 30px; border-top: 1px solid rgba(17, 24, 22, .1); }
.form-step__title { display: flex; align-items: baseline; gap: 12px; margin-bottom: 22px; font: 400 1.45rem/1.2 var(--display); color: var(--text-l); }
.form-step__title span { font: 500 .72rem/1 var(--mono); color: var(--ember-l); }
.choices--compact .choice > span { grid-template-columns: 18px 1fr; padding: 12px 14px; }
.choices--compact .choice > span::before { grid-row: auto; }
.checks { display: flex; flex-wrap: wrap; gap: 8px; }
.check { position: relative; cursor: pointer; }
.check input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.check > span { display: inline-flex; align-items: center; gap: 10px; min-height: 42px; padding: 0 16px 0 12px; border: 1px solid rgba(17, 24, 22, .22); border-radius: 999px; font-size: .9rem; transition: border-color .2s, background-color .2s, color .2s; }
.check > span::before { content: ''; width: 14px; height: 14px; border: 1px solid rgba(17, 24, 22, .45); border-radius: 3px; transition: background-color .2s; }
.check strong { font-weight: 500; }
.check:hover > span { border-color: rgba(17, 24, 22, .5); }
.check input:checked + span { background: var(--ink); color: var(--bone); border-color: var(--ink); }
.check input:checked + span::before { background: var(--ember); border-color: var(--ember); box-shadow: inset 0 0 0 2px var(--ink); }
.check input:focus-visible + span { outline: 2px solid var(--ember-l); outline-offset: 2px; }
.field--checks .hint { margin: -2px 0 12px; }

/* Term sheets with sentences rather than figures */
.page-venture-capital .sheet__v { font-size: clamp(1.15rem, 1rem + .5vw, 1.45rem); line-height: 1.3; letter-spacing: -.01em; }

/* Preview banner and 404 */
.preview-bar { position: sticky; top: 0; z-index: 120; padding: 10px var(--gutter); background: var(--ember); color: var(--ink); font-size: .9rem; text-align: center; }
.nf { min-height: 100svh; }
.hero--home.hero--ventures .display { max-width: 12ch; }
/* Home titles whose hand-set lines run past ~18 characters (Private Credit, Digital Assets): one line per rise-line on desktop */
.hero--home .display--long { font-size: clamp(3.1rem, 1rem + 6.2vw, 8rem); }
.hero--home.hero--ventures .display--long { max-width: none; }

/* Responsive ------------------------------------------------------------- */
@media (max-width: 1180px) {
  .nav { display: none; }
  .hdr__cta { display: none; }
  .menu-btn { display: inline-flex; }
  .index__row { grid-template-columns: 48px minmax(0, 1fr) minmax(0, 1fr) 48px; row-gap: 10px; }
  .index__desc { grid-column: 2 / 4; grid-row: 2; }
  .index__metric { grid-column: 3; grid-row: 1; }
  .index__go { grid-column: 4; grid-row: 1 / span 2; }
  .sheet__head { grid-column: 1 / -1; margin-bottom: 40px; }
  .sheet__head .h2 { max-width: none; }
  .sheet__rows, .sheet__foot { grid-column: 1 / -1; }
  .ftr__intro { grid-column: 1 / -1; }
  .ftr__nav { grid-column: 1 / span 7; }
  .ftr__offices { grid-column: 8 / -1; }
  .ftr__nav--3 { grid-column: 1 / -1; }
  .co-grid { grid-template-columns: 1fr 1fr; }
  .journeys, .sources, .evals, .principles, .org-roles, .prep { grid-template-columns: 1fr 1fr; }
  .sla { grid-template-columns: 1fr 1fr; }
  .sla > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .sla > div:nth-child(n + 3) { border-top: 1px solid var(--line); margin-top: 24px; }
  .stage { grid-template-columns: 1fr; }
  .article__body { grid-column: 1 / -1; }
  .article__aside { grid-column: 1 / -1; }
  .article__cos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  :root { --hdr-h: 68px; }
  .sec-head { display: block; }
  .sec-head .kicker { padding-top: 0; }
  .sec-head .h2 { margin-top: 22px; }
  .sec-head__intro { margin-top: 22px; }
  .grid12 > [class^='c-'], .grid12 > [class*=' c-'] { grid-column: 1 / -1; }
  .sticky { position: static; }
  .hero__foot { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr 1fr; }
  .stat:nth-child(3) { padding-left: 0; border-left: 0; }
  .stat:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .aims { grid-template-columns: 1fr; gap: 36px; }
  .cols, .cols--rows { grid-template-columns: 1fr; row-gap: 48px; }
  .cols > * { padding: 0; border-left: 0; }
  .cols > * + * { padding-top: 40px; border-top: 1px solid var(--line); }
  .cols--rows > * + * { padding-top: 26px; }
  .steps { grid-template-columns: 1fr; row-gap: 0; border-left: 1px solid var(--line-2); margin-left: 4px; }
  .steps li { padding: 0 0 34px 32px; }
  .steps li::before { display: none; }
  .steps li::after { left: -5px; top: 4px; }
  .steps h3 { margin-top: 10px; }
  .value { grid-template-columns: 1fr; row-gap: 14px; }
  .value__n, .value__name, .value__body { grid-column: 1; }
  .doors { grid-template-columns: 1fr; }
  .sheet__rows { --n: 2 !important; }
  .sheet__row:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .sheet__row:nth-child(2n) { padding-left: 18px; border-left: 1px solid var(--line); }
  .sector { display: block; }
  .sector__head { position: static; margin-bottom: 28px; }
  .desk { display: block; }
  .desk__steps { margin-top: 64px; }
  .callouts { grid-template-columns: 1fr; }
  .tracks, .tracks--2 { grid-template-columns: 1fr; }
  .pillar { display: block; }
  .pillar__plate { aspect-ratio: 16 / 10; margin-bottom: 36px; }
  .listed { display: block; }
  .listed p:last-child { margin-top: 16px; }
  .track { min-height: 0; }
  .items { grid-template-columns: 1fr 1fr; }
  .points li { grid-template-columns: 1fr; }
  .offices { grid-template-columns: 1fr; row-gap: 56px; }
  /* Stacked, the page keeps its source order: "01 Before you start" (who it's for, what happens next,
     confidentiality) then "02" the form, so people read both before typing, and the visual order matches what screen
     readers hear (JOURNEY_REVIEW_ventures #1). */
  .form-shell { display: flex; flex-direction: column; row-gap: 56px; }
  .legal { display: block; }
  .legal__toc { margin-bottom: 48px; }
  .ftr__nav, .ftr__offices, .ftr__disclaimer, .ftr__meta { grid-column: 1 / -1; }
  .ftr__meta { justify-items: start; text-align: left; }
  .ftr__meta ul { justify-content: flex-start; }
  .hero-facts { grid-template-columns: 1fr 1fr; }
  .hero-facts > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .hero-facts > div:nth-child(n + 3) { border-top: 1px solid rgba(238, 233, 223, .14); margin-top: 18px; }
  .dir thead { display: none; }
  .dir, .dir tbody, .dir tr, .dir th, .dir td { display: block; width: auto !important; }
  .dir tr { padding: 18px 0; border-bottom: 1px solid var(--line); }
  .dir th, .dir td { padding: 0; border: 0; }
  .dir td { margin-top: 8px; }
  .dir td:last-child { margin-top: 10px; }
  .dir .dir__group { padding: 0; border: 0; }
  .dir .dir__group th { padding: 40px 0 14px; border-bottom: 1px solid var(--line-2); }
  .site-ventures { --hdr-h: 100px; }
  .hdr--ventures .hdr__in { height: 68px; }
  .arms, .thesis, .res, .opps, .gallery, .stage__cols { grid-template-columns: 1fr; }
  .caps { grid-template-columns: 1fr 1fr; }
  .cap:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .cap:nth-child(2n) { padding-left: clamp(16px, 2vw, 30px); border-left: 1px solid var(--line); }
  .process__track { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid var(--line-2); margin-left: 5px; }
  .process__stage, .process__stage + .process__stage { padding: 0 0 28px 30px; border-left: 0; }
  .process__stage::before, .process__stage + .process__stage::before { left: -6px; top: 4px; }
  .process__gate { right: auto; left: 22px; top: auto; bottom: 4px; width: 12px; height: 12px; }
  .process__legend-note { margin-left: 0; width: 100%; }
  .theme { grid-template-columns: 40px minmax(0, 1fr); }
  .theme__d { grid-column: 2; }
  .people, .art-grid { grid-template-columns: 1fr 1fr; }
  .people--compact { grid-template-columns: 1fr 1fr; }
  .case__part { grid-template-columns: 1fr; gap: 10px; }
  .company .grid12 > .company__prop, .company .grid12 > .company__facts { grid-column: 1 / -1; }
  .rel-key { grid-template-columns: 1fr; }
  .org__node, .org__node--cos { grid-template-columns: 1fr; }
  .org__k { grid-row: auto; }
}
@media (max-width: 640px) {
  :root { --fs-body: 1rem; }
  .hdr .brand { font-size: 1.5rem; }
  .hero::before { background: linear-gradient(0deg, rgba(12, 17, 16, .96) 0%, rgba(12, 17, 16, .72) 48%, rgba(12, 17, 16, .1) 82%), linear-gradient(180deg, rgba(12, 17, 16, .6) 0%, rgba(12, 17, 16, 0) 16%); }
  .hero--home .display { font-size: clamp(3.1rem, 1.6rem + 7.6vw, 4.6rem); }
  .legend__in { font-size: .66rem; gap: 8px 22px; }
  .legend__in > .hide-sm { display: none; }
  .actions { width: 100%; }
  .actions .btn { flex: 1 1 auto; }
  .stats { grid-template-columns: 1fr 1fr; }
  .index__row { grid-template-columns: 36px minmax(0, 1fr) 40px; }
  .index__metric { grid-column: 2; grid-row: 2; }
  .index__desc { grid-column: 2; grid-row: 3; }
  .index__go { grid-column: 3; grid-row: 1; width: 40px; height: 40px; }
  .items { grid-template-columns: 1fr; }
  .sheet__rows { --n: 1 !important; grid-template-columns: 1fr; }
  .sheet__row:nth-child(2n) { padding-left: 0; border-left: 0; }
  .sector__facts { grid-template-columns: 1fr; }
  .form .grid { grid-template-columns: 1fr; }
  .choices--row { grid-template-columns: 1fr; }
  .hero-facts { grid-template-columns: 1fr 1fr; }
  .next a { grid-template-columns: 1fr; }
  .next__go { display: none; }
  .ftr__nav { grid-template-columns: 1fr 1fr; }
  .to-top { right: 14px; bottom: 14px; }
  .hide-sm { display: none; }
  .co-grid, .journeys, .sources, .evals, .principles, .org-roles, .prep, .sla, .caps, .people, .people--compact, .art-grid, .article__cos { grid-template-columns: 1fr; }
  .sla > div + div, .cap:nth-child(2n) { padding-left: 0; border-left: 0; }
  .sla > div + div { border-top: 1px solid var(--line); margin-top: 24px; }
  .org__split { grid-template-columns: 1fr; padding-left: 40px; gap: 0; }
  .org__split::before { left: 20px; }
  .org__node--unit { padding-left: 20px; }
  .org__node--cos { padding-left: 60px; }
  .org__node--cos::before { left: 40px; }
  .ftr__nav--3 { grid-template-columns: 1fr 1fr; }
  .logo-tile--lg { width: 200px; height: 67px; }
  .journey { min-height: 0; }
  .shot__bar span { display: none; }
}

@media print {
  .hdr, .mmenu, .to-top, .terrain, .ftr__mark, .actions, .cta, .next { display: none !important; }
  body, [class*='tone-'], .hero { background: #fff !important; color: #000 !important; }
  .hero::before, .grain::after { display: none; }
  .hero--page, .hero--home { min-height: 0; }
  .js .rv { opacity: 1; transform: none; }
}

/* ---- Line breaks (ported from www.caldrion.com): balanced headings, no one-word last lines in running text ---- */
/* Not the headings set line by line in .rise-line masks (home hero, 404), whose breaks are chosen by hand. */
h2, h3, .h1, .h2, .h3, .display, .faq summary > span:first-child { text-wrap: balance; }
.display:has(.rise-line), h1:has(.rise-line) { text-wrap: wrap; }
p, .lead, .hero__lead, .cta__text, .faq__a p, li { text-wrap: pretty; }
.kicker { text-wrap: wrap; } /* mono labels keep their usual breaks */
/* ---- end line breaks ---- */

/* ---- form states (ported from www: public/css/site.css "form drafts & states", without drafts) ---- */
.status--warn { background: #F6EEDD; border: 1px solid #D9C08E; color: #4A3510; }
.status--sending { background: transparent; border: 1px solid rgba(17, 24, 22, .14); color: var(--muted-l); }
.submit[aria-disabled="true"] { opacity: .6; cursor: progress; }
/* Turnstile: api.js didn't load or couldn't start (message instead of an empty gap); a solved widget left too wide after rotating. */
.ts.ts--failed { min-height: 0; }
.ts-fail { font-size: .84rem; line-height: 1.55; color: #6B1F10; max-width: 60ch; }
.ts.ts--clip { max-width: 100%; overflow: hidden; }
/* No JavaScript: the <noscript> line, and the notice after a form posted without it (src/index.tsx). */
.form-nojs { margin: 0 0 18px; font-size: .84rem; line-height: 1.55; color: #6B1F10; max-width: 60ch; }
.form-nojs a, .form-nojs-post a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.status.form-nojs-post { margin: 0 0 28px; }
/* ---- end form states ---- */

/* ---- Journey links on company profiles (media route, co-investor route) ---- */
.company__route { max-width: 62ch; color: var(--muted); font-size: var(--fs-small); line-height: 1.55; }
/* Home hero: the operator and partnership routes under the two buttons. */
.hero__routes { margin-top: 18px; font-size: var(--fs-small); line-height: 1.55; color: var(--muted-d); }
.hero__routes .link { color: var(--text-d); }
/* Mobile menu: the operator and partnership routes under the two route buttons. */
.mmenu__routes { display: grid; gap: 2px; }
.mmenu__routes a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 2px; border-bottom: 1px solid rgba(238, 233, 223, .14); font-size: .95rem; color: var(--text-d); }
.mmenu__routes .i-arrow { color: var(--ember); }
/* ---- end journey links ---- */

/* ---- /apply: Find your route (src/pages/apply.tsx RouteFinder; public/js/site.js "Route finder") ---- */
/* Choices reuse the inquiry forms' radio cards (.choices / .choice). */
.finder { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 28px; }
.finder__intro { grid-column: 1 / span 4; }
.finder__form { grid-column: 5 / span 8; display: grid; gap: 28px; }
.finder__result { grid-column: 5 / span 8; }
.finder__q { border: 0; margin: 0; padding: 0; min-width: 0; }
.finder__q[hidden] { display: none; }
.finder__legend { padding: 0; margin-bottom: 14px; font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.finder__choices { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.finder__choice > span { min-height: 56px; align-content: center; }
.finder__go { justify-self: start; }
.finder__panel { padding: 26px 28px; border: 1px solid var(--text-l); border-radius: 4px; background: rgba(17, 24, 22, .03); }
.finder__panel:focus { outline: none; }
.finder__panel:focus-visible { outline: 2px solid var(--ember-l); outline-offset: 3px; }
.finder__who-h { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.finder__panel .actions { align-items: center; }
.finder__all { white-space: nowrap; }
@media (max-width: 960px) {
  .finder__intro, .finder__form, .finder__result { grid-column: 1 / -1; }
}
@media (max-width: 400px) {
  .finder__panel { padding: 20px 18px; }
}

/* ---- WCAG 2.2: text spacing (1.4.12), as on www ----
   With the WCAG text-spacing values at 320 CSS px, long words in display headings, nowrap button labels and the
   hero facts stuck out of their overflow:hidden sections. Let them wrap instead. Normal layout is unchanged, except
   that the silentVIP hero facts at 320 split their width a little more evenly. */
h1, h2, h3, .display, .h1, .h2, .h3 { overflow-wrap: break-word; }
.btn { white-space: normal; text-align: center; }
.hero-facts dd { overflow-wrap: anywhere; }

/* ---- site search (ported from www: public/js/search.js, /search, the 404 suggestions) ---- */
/* Header link: a pill like the Menu button; icon only on phones */
.hdr__search { display: inline-flex; align-items: center; gap: 9px; height: 42px; padding: 0 12px 0 14px; border: 1px solid rgba(238, 233, 223, .26); border-radius: 999px; font: 500 .875rem/1 var(--sans); color: var(--text-d); transition: border-color .2s, background-color .2s; }
.hdr__search:hover { border-color: rgba(238, 233, 223, .6); }
.hdr__search:focus-visible { outline: 2px solid var(--ember); outline-offset: 3px; }
.hdr__search .i { width: 15px; height: 15px; flex: none; }
.hdr__kbd { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border: 1px solid rgba(238, 233, 223, .3); border-radius: 4px; font: 500 .72rem/1 var(--mono); color: rgba(238, 233, 223, .75); }
@media (max-width: 640px) {
  .hdr__search { width: 42px; padding: 0; justify-content: center; }
  .hdr__search-l { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hdr__kbd { display: none; }
}
@media (hover: none) { .hdr__kbd { display: none; } }
.mmenu__search { color: var(--ember); }
/* Ventures: the wider brand (with VENTURES) leaves no room for the header Search button on phones; Search is in the menu there */
.hdr__search { flex: none; }
@media (max-width: 420px) { .hdr__search { display: none; } }

/* Command palette */
.cs[hidden] { display: none; }
.cs { position: fixed; inset: 0; z-index: 200; display: flex; justify-content: center; align-items: flex-start; padding: clamp(12px, 9vh, 120px) 16px 16px; }
.cs__scrim { position: absolute; inset: 0; background: rgba(12, 17, 16, .62); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.cs__panel { position: relative; width: min(680px, 100%); max-height: min(640px, calc(100svh - 24px)); display: flex; flex-direction: column; background: var(--white); color: var(--text-l); border-radius: 8px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .55); overflow: hidden; }
.cs__bar { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 16px; border-bottom: 1px solid rgba(17, 24, 22, .12); }
.cs__icon { width: 16px; height: 16px; flex: none; border: 1.5px solid var(--muted-l); border-radius: 50%; position: relative; }
.cs__icon::after { content: ''; position: absolute; width: 6px; height: 1.5px; background: var(--muted-l); right: -5px; bottom: -2px; transform: rotate(45deg); }
.cs__input { flex: 1; min-width: 0; height: 44px; border: 0; background: transparent; font: 400 1.1rem/1.3 var(--sans); color: var(--text-l); outline: none; }
.cs__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.cs__close { flex: none; min-height: 36px; padding: 0 12px; border: 1px solid rgba(17, 24, 22, .25); border-radius: 999px; font: 500 .8rem/1 var(--sans); color: var(--text-l); }
.cs__close:focus-visible, .cs__input:focus-visible { outline: 2px solid var(--ember-l); outline-offset: 2px; }
.cs__list { overflow-y: auto; overscroll-behavior: contain; padding: 6px 0 10px; }
.cs__group + .cs__group { border-top: 1px solid rgba(17, 24, 22, .08); margin-top: 4px; padding-top: 4px; }
.cs__gl { padding: 10px 16px 6px; font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--muted-l); }
.cs__opt { display: block; padding: 10px 16px; cursor: pointer; border-left: 3px solid transparent; }
.cs__opt[aria-selected='true'] { background: rgba(17, 24, 22, .055); border-left-color: var(--ember-l); }
.cs__t { display: block; font: 600 .95rem/1.35 var(--sans); overflow-wrap: anywhere; }
.cs__s { display: block; margin-top: 3px; font-size: .84rem; line-height: 1.45; color: var(--muted-l); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cs mark, .sr mark { background: rgba(227, 154, 107, .32); color: inherit; border-radius: 2px; padding: 0 1px; }
.cs__hint { padding: 12px 16px; font-size: .9rem; color: var(--muted-l); }
.cs__hint a { color: var(--text-l); text-decoration: underline; text-underline-offset: 2px; }
.cs__help { padding: 8px 16px; border-top: 1px solid rgba(17, 24, 22, .08); font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .06em; color: var(--muted-l); }
@media (hover: none) { .cs__help { display: none; } }
@media (max-width: 640px) { .cs { padding: 8px; } .cs__panel { max-height: calc(100svh - 16px); } }
html.cs-open { overflow: hidden; }
@media (prefers-reduced-motion: no-preference) { .cs:not([hidden]) .cs__panel { animation: cs-in .18s var(--ease); } }
@keyframes cs-in { from { opacity: 0; transform: translateY(-6px); } }

/* /search (no-JS results page) */
.sr__form { display: flex; gap: 10px; align-items: stretch; max-width: 680px; }
.sr__form .box-in { flex: 1; min-width: 0; }
.sr__form .btn { flex: none; }
.sr__count { margin-top: 28px; color: var(--muted); font-size: var(--fs-small); }
.sr__group { margin-top: 36px; max-width: 760px; }
.sr__gl { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); padding-bottom: 10px; border-bottom: 1px solid var(--line-2); }
.sr__item { padding: 16px 0; border-bottom: 1px solid var(--line); }
.sr__t { font: 400 1.25rem/1.25 var(--display); color: var(--fg); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 4px; overflow-wrap: anywhere; }
.sr__t:hover { text-decoration-color: currentColor; }
.sr__s { margin-top: 6px; color: var(--muted); font-size: .92rem; line-height: 1.5; overflow-wrap: anywhere; }
.sr__ctx { font-weight: 600; color: var(--fg); }
.sr__none { margin-top: 20px; max-width: 60ch; color: var(--muted); }
.sr__none p + p { margin-top: .6em; }
@media (max-width: 640px) { .sr__form { flex-direction: column; } }

/* 404: suggestions and a search box */
.lost__sug { margin-top: 32px; max-width: 60ch; }
.lost__sug-h { font: 500 var(--fs-micro)/1.3 var(--mono); letter-spacing: .13em; text-transform: uppercase; color: var(--label); }
.lost__sug ul { margin-top: 10px; display: grid; gap: 8px; }
.lost__ctx { color: var(--muted); font-size: var(--fs-small); }
.lost__search { margin-top: 28px; display: flex; gap: 10px; max-width: 520px; }
.lost__search input { flex: 1; min-width: 0; height: 44px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 4px; background: transparent; color: var(--fg); font: 400 1rem/1 var(--sans); }
.lost__search input:focus-visible { outline: 2px solid var(--ember); outline-offset: 2px; }
/* ---- end site search ---- */

/* ---- Modern navigation: view transitions, forced colours, more contrast ---- */
/* Cross-document view transitions (Chromium 126+, Safari 18.2+; others navigate as before). The page cross-fades
   (the root rules near the top of this file); the header is the same element on every page, so it is captured on
   its own and stays put while the page beneath it changes, instead of fading out and back in. Nothing is animated
   for visitors who prefer reduced motion: the navigation transition is switched off entirely. */
::view-transition-old(root) { animation-duration: .22s; }
::view-transition-new(root) { animation-duration: .35s; }
.hdr { view-transition-name: site-header; }
::view-transition-group(site-header) { animation-duration: .35s; animation-timing-function: var(--ease); }
::view-transition-old(site-header), ::view-transition-new(site-header) { animation-duration: .2s; }
/* The open mobile menu covers the header: keep the header in the page snapshot so it can't paint over the menu. */
body:has(.mmenu:not([hidden])) .hdr { view-transition-name: none; }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  .hdr { view-transition-name: none; }
}

/* Forced colours (Windows High Contrast and other OS contrast themes). The browser swaps every colour for the
   visitor's system colours and drops background colours and shadows; anything drawn only with a background or a
   box-shadow (dots, dashes, radio marks, the "+" icon lines) is redrawn here in system colours. */
@media (forced-colors: active) {
  /* Decorative art in colours the theme can't control: the terrain and its glow, film grain, image overlays. */
  .terrain canvas, .terrain::before, .grain::after, .hero::before, .cta::before, .door::before, .pillar__plate::after { display: none; }
  /* The giant footer wordmark would print at full strength: draw it as an outline instead. */
  .ftr__mark, .ftr__mark span { forced-color-adjust: none; color: Canvas; -webkit-text-stroke: 1px CanvasText; }
  /* Marks drawn as backgrounds */
  .kicker > span + span::before, .dash li::before, .track li::before, .legal__body ul li::before, .steps li::before,
  .sheet__foot::before, .scroll-cue i::after, .faq__icon::before, .faq__icon::after, .rel i,
  .nav__top[aria-current='page']::before, .nav__item.is-section > .nav__top::before { forced-color-adjust: none; background: CanvasText; }
  .menu-btn__lines::before, .menu-btn__lines::after { forced-color-adjust: none; background: ButtonText; }
  .rel i { box-shadow: none; }
  .rel--incubation i { background: transparent; border: 1px solid CanvasText; }
  /* The current page: not only a colour or a dot */
  .nav__top[aria-current='page'], .nav__item.is-section > .nav__top, .mmenu__link[aria-current='page'], .mmenu__sub a[aria-current='page'],
  .drop a[aria-current='page'] .drop__l, .crumbs [aria-current] { text-decoration: underline; text-underline-offset: .28em; }
  /* Custom radios: the mark is a background and an inset shadow, both dropped. Redraw it; the chosen card gets a
     2px border (padding 1px less, so nothing moves). */
  .choice > span::before { forced-color-adjust: none; background: Canvas; border-color: CanvasText; box-shadow: none; }
  .choice input:checked + span { border: 2px solid Highlight; padding: 14px 15px; }
  .choice input:checked + span::before { border: 5px solid Highlight; background: Canvas; }
  /* Text fields show focus with a border colour and shadow; give them a real outline. */
  .box-in:focus-within { outline: 2px solid Highlight; outline-offset: 2px; }
  /* Buttons that are only a background colour */
  .submit, .skip { border: 1px solid ButtonText; }
  .submit:disabled, .submit[aria-disabled='true'] { color: GrayText; border-color: GrayText; opacity: 1; }
  /* Brand logo tiles keep their own background, or a white logo would vanish on a white Canvas. */
  .logo-tile { forced-color-adjust: none; }
  /* Inline links are underlined with a background image, which forced colours drops: use a real underline. */
  .prose a, .link { background: none; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
  /* Faded text */
  .js .manifesto[data-words].split .w { opacity: 1; }
  .gloss-index span { opacity: 1; color: GrayText; }
}

/* More contrast (macOS "Increase contrast", iOS, Windows contrast themes without forced colours): muted text,
   labels and hairlines move closer to the text colour; the terrain behind hero text steps back. */
@media (prefers-contrast: more) {
  :root { --muted-d: #CBD2CD; --label-d: #B8C6BF; --muted-l: #2E3633; --label-l: #33443D; }
  .tone-ink, .tone-ink2, body { --line: rgba(238, 233, 223, .32); --line-2: rgba(238, 233, 223, .56); }
  .tone-bone, .tone-stone, .tone-white { --line: rgba(17, 24, 22, .34); --line-2: rgba(17, 24, 22, .62); }
  .hero__lead, .nav__top, .ftr__nav a, .ftr__offices a, .ftr__offices address, .ftr__meta a { color: var(--text-d); }
  .hero-facts, .hero-facts > div + div, .legend, .ftr__legal, .mmenu__list > li, .drop__all { border-color: rgba(238, 233, 223, .4); }
  .hdr.is-scrolled { background: rgba(12, 17, 16, .96); border-bottom-color: rgba(238, 233, 223, .3); }
  .drop { border-color: rgba(238, 233, 223, .35); }
  .menu-btn, .mmenu__close, .mmenu__toggle, .to-top { border-color: rgba(238, 233, 223, .6); }
  .terrain canvas.ready { opacity: .6; }
  .box-in { border-color: rgba(17, 24, 22, .62); }
  .choice > span { border-color: rgba(17, 24, 22, .5); }
  .choice > span::before { border-color: rgba(17, 24, 22, .75); }
  .phone .cc { border-right-color: rgba(17, 24, 22, .4); }
  .box-in input::placeholder, .box-in textarea::placeholder { color: #4F5955; }
  .form-card { border-color: rgba(17, 24, 22, .3); }
  .fit__group { border-top-color: rgba(17, 24, 22, .4); }
  .js .manifesto[data-words].split .w { opacity: .5; }
  .gloss-index span { opacity: .7; }
}
/* ---- end modern navigation ---- */