/* MESADEN — shared site styles
   Tokens carried over from the launch page so the full site reads as one brand. */

:root {
  --obsidian: #0B0D0E;
  --porcelain: #F2EEE5;
  --graphite: #282A2B;
  --gold: #AC9568;
  --gold-deep: #7A6338;
  --stone: #D9D2C3;

  --ink-soft: rgba(242, 238, 229, 0.66);
  --ink-faint: rgba(242, 238, 229, 0.42);
  --graphite-soft: rgba(40, 42, 43, 0.68);

  --serif: 'Instrument Serif', 'Times New Roman', serif;
  --sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --gutter: clamp(20px, 6vw, 96px);
  --maxw: 1240px;
  --ease: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--obsidian);
  color: var(--porcelain);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }

.container { max-width: var(--maxw); margin: 0 auto; padding-inline: var(--gutter); }

.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 100;
  background: var(--gold); color: var(--obsidian); padding: 10px 16px; font-weight: 700; text-decoration: none;
}
.skip-link:focus { top: 12px; }

/* ---------- Header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(11, 13, 14, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(172, 149, 104, 0.18);
}
.site-header .container {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  min-height: 76px;
}
.brand img { width: 168px; height: auto; }
.nav { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 34px); }
.nav a {
  text-decoration: none; font-size: 14.5px; font-weight: 600; color: var(--ink-soft);
  padding: 6px 0; border-bottom: 1px solid transparent; transition: color 200ms ease, border-color 200ms ease;
}
.nav a:hover { color: var(--porcelain); }
.nav a[aria-current="page"] { color: var(--porcelain); border-color: var(--gold); }
.nav .nav-cta {
  color: var(--obsidian); background: var(--gold); padding: 10px 18px; border: none;
  transition: background 200ms ease;
}
.nav .nav-cta:hover { background: #C2AC7E; color: var(--obsidian); }

.menu-toggle {
  display: none; background: none; border: 1px solid rgba(172, 149, 104, 0.5); color: var(--porcelain);
  font: 600 14px var(--sans); padding: 9px 14px; cursor: pointer;
}

@media (max-width: 960px) {
  .menu-toggle { display: inline-block; }
  .nav {
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--obsidian); border-bottom: 1px solid rgba(172, 149, 104, 0.25);
    padding: 8px var(--gutter) 24px;
    display: none;
  }
  .nav.open { display: flex; }
  .nav a { padding: 14px 0; font-size: 17px; border-bottom: 1px solid rgba(242, 238, 229, 0.08); }
  .nav a[aria-current="page"] { border-bottom-color: rgba(242, 238, 229, 0.08); color: var(--gold); }
  .nav .nav-cta { margin-top: 16px; text-align: center; padding: 14px; }
  .brand img { width: 140px; }
}

/* ---------- Buttons & links ---------- */
.btn {
  display: inline-block; text-decoration: none; font-weight: 700; font-size: 15px; letter-spacing: 0.2px;
  padding: 15px 26px; transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}
.btn-gold { background: var(--gold); color: var(--obsidian); }
.btn-gold:hover { background: #C2AC7E; }
.btn-line { border: 1px solid rgba(242, 238, 229, 0.35); color: var(--porcelain); }
.btn-line:hover { border-color: var(--gold); color: var(--gold); }
.on-light .btn-line { border-color: rgba(40, 42, 43, 0.35); color: var(--graphite); }
.on-light .btn-line:hover { border-color: var(--gold-deep); color: var(--gold-deep); }

.text-link {
  font-weight: 700; font-size: 15px; text-decoration: none;
  border-bottom: 1px solid currentColor; padding-bottom: 3px;
  transition: color 200ms ease;
}

/* ---------- Sections ---------- */
.band { padding-block: clamp(88px, 12vw, 168px); position: relative; }
.on-dark { background: var(--obsidian); color: var(--porcelain); }
.on-light { background: var(--porcelain); color: var(--graphite); }
.on-graphite { background: var(--graphite); color: var(--porcelain); }

.section-tag {
  display: block; font-size: 14px; font-weight: 600; color: var(--gold);
  margin: 0 0 22px;
}
.on-light .section-tag { color: var(--gold-deep); }

.display {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  line-height: 1.08; margin: 0; letter-spacing: -0.2px;
}
.h-xl { font-size: clamp(44px, 7.2vw, 96px); }
.h-lg { font-size: clamp(34px, 4.8vw, 60px); }
.h-md { font-size: clamp(28px, 3.4vw, 42px); }

.lede { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.65; max-width: 34em; }
.on-dark .lede, .on-graphite .lede { color: var(--ink-soft); }
.on-light .lede { color: var(--graphite-soft); }

/* ---------- Hero ---------- */
.hero { min-height: min(92vh, 860px); display: flex; align-items: center; overflow: hidden; padding-block: 72px 96px; }
.hero .container {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(32px, 5vw, 72px); align-items: center; width: 100%;
}
.hero h1 { max-width: 11.5em; }
.hero .lede { margin: 32px 0 44px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }

.resolve { width: 100%; max-width: 520px; justify-self: end; overflow: visible; }
.resolve .stroke { fill: none; stroke: var(--gold); stroke-width: 1.4; stroke-linecap: round; }
.resolve .frag {
  transition: transform 1700ms var(--ease), opacity 1200ms ease;
  transform-box: view-box;
}
.resolve .fill-a { fill: var(--gold); opacity: 0; transition: opacity 1200ms ease 1500ms; }
.resolve .apex { fill: var(--porcelain); opacity: 0; transition: opacity 600ms ease 1900ms; }
.resolve:not(.resolved) .f1 { transform: translate(-120px, -40px) rotate(-38deg); opacity: .35; }
.resolve:not(.resolved) .f2 { transform: translate(110px, -70px) rotate(42deg); opacity: .35; }
.resolve:not(.resolved) .f3 { transform: translate(-60px, 90px) rotate(24deg); opacity: .35; }
.resolve:not(.resolved) .f4 { transform: translate(140px, 60px) rotate(-30deg); opacity: .35; }
.resolve:not(.resolved) .f5 { transform: translate(-150px, 40px) rotate(60deg); opacity: .35; }
.resolve:not(.resolved) .f6 { transform: translate(60px, 120px) rotate(-55deg); opacity: .35; }
.resolve.resolved .fill-a, .resolve.resolved .apex { opacity: 1; }
.resolve .stroke { transition: opacity 900ms ease 2100ms; }
.resolve.resolved .stroke { opacity: 0; }
.resolve-caption {
  margin-top: 18px; font-size: 13.5px; color: var(--ink-faint); text-align: right; max-width: 520px; justify-self: end;
}
.hero-art { display: flex; flex-direction: column; }

@media (max-width: 860px) {
  .hero { min-height: 0; padding-block: 48px 88px; }
  .hero .container { grid-template-columns: 1fr; }
  .hero-art { order: -1; }
  .resolve { max-width: 240px; justify-self: start; }
  .resolve-caption { display: none; }
}

/* ---------- Insight ---------- */
.reframes { margin-top: clamp(56px, 8vw, 96px); display: grid; gap: 0; max-width: 980px; }
.reframe {
  display: grid; grid-template-columns: minmax(180px, 0.8fr) 1.2fr; gap: 32px; align-items: baseline;
  padding: 30px 0; border-top: 1px solid rgba(40, 42, 43, 0.14);
}
.reframe:last-child { border-bottom: 1px solid rgba(40, 42, 43, 0.14); }
.reframe .asked {
  font-weight: 600; font-size: 16px; color: rgba(40, 42, 43, 0.5);
  text-decoration: line-through; text-decoration-color: rgba(122, 99, 56, 0.7); text-decoration-thickness: 1.5px;
}
.reframe .meant { font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.8vw, 34px); line-height: 1.25; color: var(--graphite); }
@media (max-width: 640px) { .reframe { grid-template-columns: 1fr; gap: 8px; padding: 24px 0; } }

/* ---------- Method ---------- */
.method-steps { list-style: none; padding: 0; margin-bottom: 0; margin-top: clamp(56px, 8vw, 88px); display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
.method-steps::before {
  content: ''; position: absolute; top: 31px; left: 0; right: 0; height: 1px; background: rgba(172, 149, 104, 0.45);
}
.step { padding-right: clamp(20px, 3vw, 48px); position: relative; }
.step .num { font-family: var(--serif); font-style: italic; color: var(--gold); font-size: 20px; display: block; background: var(--obsidian); width: max-content; padding-right: 14px; position: relative; line-height: 62px; }
.step h3 { font-weight: 800; font-size: clamp(22px, 2.4vw, 30px); letter-spacing: 0.5px; margin: 18px 0 12px; }
.step p { color: var(--ink-soft); margin: 0; max-width: 24em; }
@media (max-width: 760px) {
  .method-steps { grid-template-columns: 1fr; gap: 40px; }
  .method-steps::before { display: none; }
  .step .num { line-height: 1; }
}
.method-close { margin-top: clamp(56px, 8vw, 88px); font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.4vw, 28px); color: var(--gold); }

/* ---------- Solve / Build / Go ---------- */
.paths { margin-top: clamp(48px, 7vw, 80px); border-top: 1px solid rgba(40, 42, 43, 0.16); }
.path {
  display: grid; grid-template-columns: minmax(200px, 0.9fr) 1.3fr auto; gap: clamp(20px, 4vw, 56px); align-items: center;
  padding: clamp(28px, 4vw, 44px) 0; border-bottom: 1px solid rgba(40, 42, 43, 0.16);
  text-decoration: none; color: var(--graphite);
}
.path .word {
  font-weight: 800; font-size: clamp(48px, 7.4vw, 104px); line-height: 0.95; letter-spacing: -1px;
  color: rgba(40, 42, 43, 0.22); transition: color 300ms ease;
}
.path .situation { font-family: var(--serif); font-style: italic; font-size: clamp(21px, 2.3vw, 28px); line-height: 1.3; margin: 0; max-width: 22em; }
.path .go-label { font-weight: 700; font-size: 15px; white-space: nowrap; border-bottom: 1px solid var(--gold-deep); padding-bottom: 3px; color: var(--gold-deep); }
.path:hover .word, .path:focus-visible .word { color: var(--graphite); }
.path:focus-visible { outline-offset: -2px; }
@media (max-width: 760px) {
  .path { grid-template-columns: 1fr; gap: 10px; }
  .path .word { color: var(--graphite); }
  .path .go-label { justify-self: start; margin-top: 8px; }
}

/* ---------- Director ---------- */
.director .container { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(36px, 6vw, 96px); align-items: center; }
.director figure { margin: 0; }
.director img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.director .name { font-weight: 700; font-size: 18px; margin: 34px 0 2px; }
.director .role { color: var(--ink-faint); margin: 0; font-size: 15px; }
.record { list-style: none; padding: 0; margin: 36px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.record li { padding: 18px 0; border-top: 1px solid rgba(242, 238, 229, 0.14); color: var(--ink-soft); font-size: 15.5px; line-height: 1.5; }
.record strong { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--porcelain); font-size: 26px; line-height: 1.2; margin-bottom: 4px; }
.record-note { font-size: 13px; color: var(--ink-faint); margin: 18px 0 32px; }
@media (max-width: 860px) {
  .director .container { grid-template-columns: 1fr; }
  .director figure { max-width: 420px; }
}
@media (max-width: 520px) { .record { grid-template-columns: 1fr; } }

/* ---------- Closing call ---------- */
.closing { text-align: left; }
.closing .container { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 36px; }
.closing .lede { margin-top: 22px; }

/* ---------- Placeholder pages ---------- */
.page-intro { padding-block: clamp(96px, 14vw, 180px); min-height: 62vh; }
.page-intro .lede { margin-top: 28px; }
.page-intro .btn { margin-top: 40px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--obsidian); border-top: 1px solid rgba(172, 149, 104, 0.22); padding-block: 72px 40px; color: var(--ink-soft); font-size: 14.5px; }
.footer-top { display: grid; grid-template-columns: 1.2fr repeat(3, 1fr); gap: 40px; }
.footer-top img { width: 190px; height: auto; }
.footer-top h2 { font-size: 14px; font-weight: 700; color: var(--porcelain); margin: 0 0 14px; }
.footer-top ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.footer-top a { text-decoration: none; }
.footer-top a:hover { color: var(--gold); }
.legal { margin-top: 56px; padding-top: 24px; border-top: 1px solid rgba(242, 238, 229, 0.1); font-size: 13px; line-height: 1.7; color: var(--ink-faint); }
.legal p { margin: 0 0 4px; }
@media (max-width: 860px) { .footer-top { grid-template-columns: 1fr 1fr; } .footer-top > div:first-child { grid-column: 1 / -1; } }

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; transition-delay: 0s !important; }
}

/* ---------- Method on a light band ---------- */
.on-light .step .num { background: var(--porcelain); color: var(--gold-deep); }
.on-light .method-steps::before { background: rgba(122, 99, 56, 0.4); }
.on-light .step p { color: var(--graphite-soft); }
.on-light .method-close { color: var(--gold-deep); }

/* ---------- Cases ---------- */
.case-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(40px, 6vw, 64px) 0 clamp(32px, 4vw, 48px); }
.case-tabs button {
  font: 600 15px var(--sans); color: var(--ink-soft); background: none; cursor: pointer;
  border: 1px solid rgba(242, 238, 229, 0.25); padding: 12px 20px; transition: color 200ms ease, border-color 200ms ease, background 200ms ease;
}
.case-tabs button:hover { color: var(--porcelain); border-color: rgba(242, 238, 229, 0.5); }
.case-tabs button[aria-selected="true"] { color: var(--obsidian); background: var(--gold); border-color: var(--gold); }

.case-meta { font-size: 14px; color: var(--ink-faint); margin: 0 0 14px; }
.draft-flag { display: inline-block; margin-left: 10px; padding: 2px 10px; background: #8A3B2E; color: #fff; font-size: 12px; font-weight: 700; }
.case-title { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.2; margin: 0; max-width: 24em; }

/* Case scenes: live, incident-style visuals */
.viz-wrap {
  position: relative; display: grid; grid-template-columns: 1.25fr 0.9fr; gap: clamp(24px, 4vw, 56px); align-items: center;
  margin: clamp(32px, 5vw, 56px) 0; padding: clamp(18px, 3vw, 32px);
  border: 1px solid rgba(172, 149, 104, 0.22);
  background: radial-gradient(ellipse 70% 80% at 35% 50%, rgba(172, 149, 104, 0.07), transparent 70%), #0E1112;
}
.viz { width: 100%; height: auto; display: block; overflow: visible; }
.viz .v-grid { opacity: 0; transition: opacity 900ms ease; }
.viz-wrap.play .v-grid { opacity: 0.07; }
.viz .v-scan { opacity: 0; transform: translateX(-80px); }
.viz-wrap.play .v-scan { animation: v-scan 2.2s var(--ease) 0.1s 1 both; }
@keyframes v-scan { 0% { opacity: 0; transform: translateX(-80px); } 15% { opacity: 1; } 100% { opacity: 0; transform: translateX(620px); } }

.viz .v-link { fill: none; stroke-width: 1.6; stroke-dasharray: 1; stroke-dashoffset: 1; }
.viz .v-link.red { stroke: rgba(214, 104, 82, 0.75); filter: url(#glow-r); }
.viz .v-link.white { stroke: rgba(242, 238, 229, 0.55); }
.viz .v-link.gold { stroke: var(--gold); stroke-width: 2.4; }
.viz .v-link.gold#r-fix { filter: url(#glow-r); }
.viz .v-link.trace { filter: url(#glow-s); stroke-linejoin: round; }

.viz .v-node .dot { fill: var(--porcelain); opacity: 0; transition: opacity 400ms ease; }
.viz .v-node .pulse { fill: none; stroke: var(--porcelain); stroke-width: 1.5; opacity: 0; transform-box: fill-box; transform-origin: center; }
.viz-wrap.play .v-node .dot { opacity: 1; }
.viz-wrap.play .v-node .pulse { animation: v-pulse 2.4s ease-out infinite; }
.viz-wrap.play .v-node.n2 .pulse { animation-delay: .4s; } .viz-wrap.play .v-node.n3 .pulse { animation-delay: .8s; } .viz-wrap.play .v-node.n4 .pulse { animation-delay: 1.2s; }
@keyframes v-pulse { 0% { opacity: .6; transform: scale(1); } 100% { opacity: 0; transform: scale(3.2); } }
.viz .v-label { fill: var(--ink-soft); font: 600 14px var(--sans); opacity: 0; transition: opacity 500ms ease .3s; }
.viz-wrap.play .v-label { opacity: 1; }

.viz .v-core { fill: #1A1D1E; stroke: rgba(242, 238, 229, 0.3); stroke-width: 1.5; transition: stroke 600ms ease, fill 600ms ease; }
.viz .v-core-label { fill: var(--porcelain); font: 700 15px var(--sans); }
.viz .v-core-sub { font: 600 12px var(--sans); }
.viz .v-core-sub .state-a { fill: #D66852; opacity: 0; transition: opacity 400ms ease; }
.viz .v-core-sub .state-b { fill: var(--gold); opacity: 0; transition: opacity 400ms ease; }
.viz-wrap.s-alert .v-core { stroke: #D66852; fill: #241615; }
.viz-wrap.s-alert .v-core-sub .state-a { opacity: 1; }
.viz-wrap.s-resolved .v-core { stroke: var(--gold); fill: #1E1B14; }
.viz-wrap.s-resolved .v-core-sub .state-a { opacity: 0; }
.viz-wrap.s-resolved .v-core-sub .state-b { opacity: 1; }
.viz .v-core-sub tspan.state-b { }

.viz .v-shield { fill: none; stroke: var(--gold); stroke-width: 2; stroke-dasharray: 18 10; opacity: 0; transform-box: fill-box; transform-origin: center; filter: url(#glow-r); }
.viz-wrap.s-resolved .v-shield { opacity: 1; animation: v-spin 14s linear infinite; transition: opacity 800ms ease; }
@keyframes v-spin { to { transform: rotate(360deg); } }
.viz .v-target { fill: none; stroke: var(--gold); stroke-width: 2; opacity: 0; transform-box: fill-box; transform-origin: center; }
.viz-wrap.s-resolved .v-target { animation: v-lock 1s var(--ease) forwards; }
.viz-wrap.s-resolved .v-target.t2 { animation: v-lock 1s var(--ease) .15s forwards, v-pulse 2.4s ease-out 1.2s infinite; }
@keyframes v-lock { 0% { opacity: 0; transform: scale(2.4); } 100% { opacity: 1; transform: scale(1); } }

.viz .v-choke rect { fill: #1A1D1E; stroke: rgba(242, 238, 229, 0.5); stroke-width: 1.5; transition: stroke 400ms ease, fill 400ms ease; }
.viz .v-choke text { fill: var(--porcelain); font: 800 12px var(--sans); letter-spacing: 2px; }
.viz .v-label.mid { transition-delay: .5s; }
.viz-wrap.s-alert .v-choke rect { stroke: #D66852; fill: #241615; animation: v-flicker 0.9s steps(2) infinite; }
.viz-wrap.s-resolved .v-choke { opacity: .35; transition: opacity 800ms ease; }
.viz-wrap.s-resolved .v-choke rect { animation: none; }
.viz .v-cut line { stroke: #D66852; stroke-width: 3; stroke-linecap: round; opacity: 0; }
.viz-wrap.s-resolved .v-cut line { opacity: 1; transition: opacity 400ms ease .3s; }
.viz-wrap.s-resolved #s-main { opacity: .18; transition: opacity 800ms ease; }
@keyframes v-flicker { 50% { stroke-opacity: .25; } }
.viz .v-gold-label { fill: var(--gold); font: 600 14px var(--sans); opacity: 0; transition: opacity 500ms ease; }
.viz-wrap.s-build .v-gold-label { opacity: 1; }

.viz-wrap.p-1 .v-link.red, .viz-wrap.p-1 .v-link.white { stroke-dashoffset: 0; transition: stroke-dashoffset 900ms var(--ease); }
.viz-wrap.s-resolved .v-link.red { opacity: .14; transition: opacity 900ms ease; }
.viz-wrap.s-build .v-link.gold { stroke-dashoffset: 0; transition: stroke-dashoffset 1300ms var(--ease); }

.viz .v-p { r: 2.6; }
.viz .v-p.red { fill: #FF8A70; filter: url(#glow-r); }
.viz .v-p.white { fill: var(--porcelain); }
.viz .v-p.gold { fill: #E3C98F; }
.viz [data-tone="gold"] .v-p, .viz [data-tone="white"] .v-p { filter: url(#glow-s); }
.viz-wrap[data-scene="ransom"] [data-tone="gold"] .v-p { filter: url(#glow-r); }

/* HUD log */
.hud { font-size: 14px; }
.hud-log { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; min-height: 230px; }
.hud-log li {
  color: var(--ink-soft); line-height: 1.45; padding-left: 14px; border-left: 2px solid rgba(242, 238, 229, 0.25);
  opacity: 0; transform: translateY(6px); transition: opacity 400ms ease, transform 400ms var(--ease);
}
.hud-log li.on { opacity: 1; transform: none; }
.hud-log li.alert { border-left-color: #D66852; }
.hud-log li.ok { border-left-color: var(--gold); color: var(--porcelain); }
.hud-log .t { display: block; font-size: 11.5px; font-weight: 700; color: var(--ink-faint); font-variant-numeric: tabular-nums; letter-spacing: .4px; }
.hud-log li.alert .t { color: #D66852; }
.hud-log li.ok .t { color: var(--gold); }
.hud-meter { margin-top: 22px; display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; align-items: baseline; }
.hud-meter .m-label { font-size: 12.5px; font-weight: 700; color: var(--ink-faint); }
.hud-meter .m-val { font: 700 20px var(--sans); color: #D66852; font-variant-numeric: tabular-nums; transition: color 400ms ease; }
.hud-meter .m-val.done { color: var(--gold); }
.hud-meter .m-bar { grid-column: 1 / -1; height: 4px; background: rgba(242, 238, 229, 0.1); position: relative; overflow: hidden; }
.hud-meter .m-bar i { position: absolute; inset: 0 auto 0 0; width: 100%; background: #D66852; transition: background 400ms ease; }
.hud-meter .m-bar i.done { background: var(--gold); }
.hud-result { margin: 22px 0 0; font: italic 400 clamp(30px, 3.4vw, 42px) / 1.1 var(--serif); color: var(--gold); opacity: 0; transform: translateY(8px); transition: opacity 600ms ease, transform 600ms var(--ease); }
.hud-result.on { opacity: 1; transform: none; }
.replay {
  position: absolute; right: 12px; bottom: 10px; background: none; border: none; cursor: pointer;
  font: 600 12.5px var(--sans); color: var(--ink-faint); padding: 6px 8px;
}
.replay:hover { color: var(--gold); }

@media (max-width: 860px) {
  .viz-wrap { grid-template-columns: 1fr; padding-bottom: 44px; }
  .hud-log { min-height: 0; }
  .viz .v-label { font-size: 18px; }
}

.case-body { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); }
.case-body h4 { font-size: 14px; font-weight: 700; color: var(--gold); margin: 30px 0 8px; }
.case-body > div > h4:first-child { margin-top: 0; }
.case-body p, .case-body li { color: var(--ink-soft); margin: 0; font-size: 16px; line-height: 1.6; }
.case-body ul { margin: 0; padding-left: 18px; display: grid; gap: 8px; }
.case-body li::marker { color: var(--gold); }
.case-body .the-one { font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.6vw, 30px); line-height: 1.25; color: var(--porcelain); }
.case-body .outcome { color: var(--porcelain); font-weight: 600; font-size: 17px; }
.cases-note { margin-top: clamp(48px, 6vw, 72px); font-size: 13.5px; color: var(--ink-faint); }

@media (max-width: 760px) {
  .case-body { grid-template-columns: 1fr; gap: 0; }
  .case-body > div + div { margin-top: 30px; }
  .case-tabs button { flex: 1 1 100%; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .viz .v-link { stroke-dashoffset: 0; }
}
.viz-wrap.s-resolved .v-link.gold#r-fix { stroke-dashoffset: 0; transition: stroke-dashoffset 900ms var(--ease); }

/* Case 3: distributorship scene */
.viz .v-capsule { fill: rgba(214, 104, 82, 0.05); stroke: #D66852; stroke-width: 1.5; stroke-dasharray: 6 6; opacity: 0; transform-box: fill-box; transform-origin: center; }
.viz-wrap.s-acquire .v-capsule { opacity: 1; animation: v-lock 900ms var(--ease) both; }
.viz-wrap.s-resolved .v-capsule { stroke: rgba(242, 238, 229, 0.25); fill: none; transition: stroke 700ms ease; }
.viz .v-capsule-label { fill: #D66852; font: 700 12px var(--sans); letter-spacing: 1px; opacity: 0; }
.viz-wrap.s-acquire .v-capsule-label { opacity: 1; transition: opacity 400ms ease .3s; }
.viz-wrap.s-resolved .v-capsule-label { fill: var(--ink-faint); }
.viz .v-us circle { fill: #1A1D1E; stroke: var(--porcelain); stroke-width: 1.5; }
.viz .v-us text { fill: var(--porcelain); font: 800 14px var(--sans); letter-spacing: 1px; }
.viz .v-us .v-label-us { font: 600 13px var(--sans); fill: var(--ink-soft); letter-spacing: 0; }
.viz .v-us { opacity: 0; transform-box: fill-box; transform-origin: center; }
.viz-wrap.s-acquire .v-us { animation: v-lock 900ms var(--ease) both; opacity: 1; }
.viz .v-orbit-path { fill: none; stroke: rgba(242, 238, 229, 0.12); stroke-width: 1; }
.viz .v-orbit-dots circle { fill: var(--porcelain); }
.viz .v-orbit { opacity: 0; transition: opacity 600ms ease .3s; }
.viz-wrap.play .v-orbit { opacity: 1; }
.viz .v-orbit-dots { transform-box: view-box; transform-origin: 280px 290px; }
.viz-wrap.play .v-orbit-dots { animation: v-spin 22s linear infinite; }
.viz-wrap.s-alert .v-orbit-dots circle { fill: #D66852; animation: v-blink 1s steps(2) infinite; }
.viz-wrap.s-resolved .v-orbit-dots circle { fill: #E3C98F; animation: none; }
@keyframes v-blink { 50% { opacity: .3; } }
.viz .v-fence { fill: none; stroke: var(--gold); stroke-width: 2; stroke-dasharray: 14 8; opacity: 0; filter: url(#glow-d); transform-box: fill-box; transform-origin: center; }
.viz-wrap.s-resolved .v-fence { animation: v-lock 900ms var(--ease) both, v-spin 30s linear 1s infinite; opacity: 1; }
.viz-wrap[data-scene="distribution"] .v-link.red { filter: url(#glow-d); }
.viz-wrap[data-scene="distribution"] .v-link.gold { filter: url(#glow-d); }
.viz-wrap[data-scene="distribution"].s-alert #d-supply { opacity: .15; transition: opacity 600ms ease; }
.viz-wrap[data-scene="distribution"].s-alert .v-link.red { stroke-dashoffset: 0; transition: stroke-dashoffset 900ms var(--ease); }
.viz-wrap[data-scene="distribution"].s-resolved .v-link.gold { stroke-dashoffset: 0; transition: stroke-dashoffset 1100ms var(--ease); }
.viz-wrap[data-scene="distribution"] [data-tone] .v-p { filter: url(#glow-d); }
.viz-wrap[data-scene="distribution"].s-resolved .v-gold-label { opacity: 1; transition-delay: .8s; }
.viz-wrap[data-scene="distribution"]:not(.s-alert):not(.s-resolved) .v-link.red { stroke-dashoffset: 1; }

/* ============ Industry scenes (hybrid: photo backdrop + gold line-art) ============ */
.viz-wrap { overflow: hidden; isolation: isolate; }
.viz-wrap::before {
  content: ''; position: absolute; inset: -4%; z-index: -2;
  background: var(--photo, none) center / cover no-repeat;
  opacity: .32; filter: grayscale(.4) contrast(1.05) brightness(.8);
  animation: kenburns 26s ease-in-out infinite alternate;
}
.viz-wrap::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(100deg, rgba(11,13,14,.55) 0%, rgba(11,13,14,.35) 45%, rgba(11,13,14,.88) 66%, rgba(11,13,14,.95) 100%);
}
@keyframes kenburns { from { transform: scale(1) translate(0, 0); } to { transform: scale(1.08) translate(-1.5%, -1%); } }
.viz-wrap .replay { z-index: 2; }
@media (max-width: 860px) { .viz-wrap::after { background: linear-gradient(180deg, rgba(11,13,14,.35) 0%, rgba(11,13,14,.5) 45%, rgba(11,13,14,.95) 62%); } }
@media (prefers-reduced-motion: reduce) { .viz-wrap::before { animation: none; } }

.sc { font-family: var(--sans); }
.sc text { font-family: var(--sans); }
.sc .lbl { fill: var(--ink-soft); font-size: 14px; font-weight: 600; }
.sc .lbl.gold { fill: var(--gold); opacity: 0; transition: opacity 600ms ease .6s; }

/* --- Data centre --- */
.sc-dc .persp line { stroke: rgba(242,238,229,.12); stroke-width: 1; }
.sc-dc .rack-frame { fill: rgba(14,17,18,.75); stroke: rgba(242,238,229,.45); stroke-width: 1.1; opacity: 0; transition: opacity 600ms ease var(--k); }
.viz-wrap.play .sc-dc .rack-frame { opacity: 1; }
.sc-dc .leds circle { fill: rgba(242,238,229,.25); transition: fill 300ms ease calc(var(--k) * 1.4); }
.viz-wrap.p-1 .sc-dc .leds circle { fill: #CFE7E0; }
.viz-wrap.s-alert .sc-dc .leds circle { fill: #FF5A43; filter: url(#gl-dc); }
.viz-wrap.s-resolved .sc-dc .leds circle { fill: #CFE7E0; filter: none; }
.viz-wrap.s-resolved .sc-dc .rack.vendor .leds circle { fill: #E3C98F; filter: url(#gl-dc); }
.viz-wrap.s-resolved .sc-dc .rack.vendor .rack-frame { stroke: var(--gold); }
.sc-dc .rain { opacity: 0; transition: opacity 500ms ease; }
.sc-dc .rain-col { fill: #FF6F57; font: 600 13px var(--sans); font-variant-numeric: tabular-nums; }
.viz-wrap.s-alert .sc-dc .rain { opacity: .55; }
.viz-wrap.s-alert .sc-dc .rain-col { animation: rain var(--rs) linear var(--rd) infinite; }
.viz-wrap.s-resolved .sc-dc .rain { opacity: 0; }
@keyframes rain { from { transform: translateY(-120px); } to { transform: translateY(640px); } }
.sc-dc .notice { opacity: 0; transform: translateX(40px); transition: opacity 500ms ease, transform 600ms var(--ease); }
.sc-dc .notice rect:first-child { fill: rgba(20,10,9,.92); stroke: #D66852; stroke-width: 1.2; }
.sc-dc .n-h { fill: #D66852; font-size: 12px; font-weight: 800; letter-spacing: 2px; }
.sc-dc .n-hl { fill: rgba(214,104,82,.25); }
.sc-dc .n-b { fill: var(--porcelain); font-size: 15px; font-weight: 600; }
.viz-wrap.s-alert .sc-dc .notice { opacity: 1; transform: none; }
.viz-wrap.s-resolved .sc-dc .notice { opacity: .3; }
.sc-dc .sweep { opacity: 0; }
.viz-wrap.s-resolved .sc-dc .sweep { animation: sweep 1.6s var(--ease) 1 both; }
@keyframes sweep { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(1100px); } }
.sc-dc .lock { opacity: 0; transform-box: fill-box; transform-origin: center; }
.sc-dc .lock path { fill: none; stroke: var(--gold); stroke-width: 3; filter: url(#gl-dc); }
.sc-dc .lock text { fill: var(--gold); font-size: 15px; font-weight: 700; }
.sc-dc .lock text.sub { fill: var(--ink-soft); font-size: 13px; font-weight: 600; }
.viz-wrap.s-resolved .sc-dc .lock { animation: v-lock 900ms var(--ease) .9s both; opacity: 1; }

/* --- Pharma line --- */
.sc-ph .ground { stroke: rgba(242,238,229,.2); }
.sc-ph .belt { fill: rgba(242,238,229,.06); stroke: rgba(242,238,229,.5); stroke-width: 1.2; }
.sc-ph .rollers circle { fill: none; stroke: rgba(242,238,229,.35); }
.sc-ph .filler rect { fill: rgba(14,17,18,.8); stroke: rgba(242,238,229,.55); }
.sc-ph .filler line { stroke: rgba(242,238,229,.45); }
.sc-ph .filler text { fill: var(--ink-soft); font-size: 12px; font-weight: 800; letter-spacing: 3px; }
.sc-ph .vial rect { fill: rgba(207,231,224,.08); stroke: #CFE7E0; stroke-width: 1.2; }
.sc-ph .vial .cap { fill: rgba(242,238,229,.35); }
.sc-ph .vial line { stroke: rgba(207,231,224,.6); }
.viz-wrap.play .sc-ph .vials { animation: belt 1.3s linear infinite; }
.viz-wrap.s-alert .sc-ph .vials { animation-duration: 6s; }
.viz-wrap.s-resolved .sc-ph .vials { animation-duration: 1.1s; }
@keyframes belt { from { transform: translateX(-90px); } to { transform: translateX(0); } }
.sc-ph .src { fill: var(--porcelain); }
.sc-ph .feed { fill: none; stroke: rgba(242,238,229,.6); stroke-width: 2; stroke-dasharray: 3 9; }
.viz-wrap.p-1 .sc-ph .feed { animation: flow 0.8s linear infinite; }
.viz-wrap.s-alert .sc-ph .feed { stroke: #D66852; animation-duration: 4s; }
.viz-wrap.s-resolved .sc-ph .feed { opacity: .15; animation: none; }
@keyframes flow { to { stroke-dashoffset: -12; } }
.sc-ph .bit { fill: rgba(207,231,224,.7); font-size: 11px; font-weight: 700; opacity: 0; }
.viz-wrap.p-1 .sc-ph .bit { animation: bit 1.6s ease-in-out var(--bd) infinite; }
.viz-wrap.s-resolved .sc-ph .bits { opacity: 0; transition: opacity 500ms ease; }
@keyframes bit { 0%, 100% { opacity: 0; } 50% { opacity: .9; } }
.sc-ph .codebox rect { fill: #1A1D1E; stroke: rgba(242,238,229,.6); stroke-width: 1.4; }
.sc-ph .codebox text { fill: var(--porcelain); font-size: 12px; font-weight: 800; letter-spacing: 3px; }
.viz-wrap.s-alert .sc-ph .codebox rect { stroke: #D66852; fill: #241615; animation: v-flicker .9s steps(2) infinite; }
.viz-wrap.s-resolved .sc-ph .codebox { opacity: .35; transition: opacity 600ms ease; }
.viz-wrap.s-resolved .sc-ph .codebox rect { animation: none; }
.sc-ph .cut line { stroke: #D66852; stroke-width: 3; stroke-linecap: round; opacity: 0; }
.viz-wrap.s-resolved .sc-ph .cut line { opacity: 1; transition: opacity 400ms ease .3s; }
.sc-ph .feed-gold { fill: none; stroke: var(--gold); stroke-width: 3; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; filter: url(#gl-ph); }
.viz-wrap.s-build .sc-ph .feed-gold { stroke-dashoffset: 0; transition: stroke-dashoffset 1300ms var(--ease); }
.viz-wrap.s-build .sc-ph .lbl.gold { opacity: 1; }
.sc-ph .halt { fill: #D66852; font-size: 13px; font-weight: 800; letter-spacing: 3px; opacity: 0; }
.viz-wrap.s-alert .sc-ph .halt { opacity: 1; animation: v-blink 1s steps(2) infinite; }
.viz-wrap.s-resolved .sc-ph .halt { opacity: 0; animation: none; }
.sc-ph .stamp { opacity: 0; transform-box: fill-box; transform-origin: center; }
.sc-ph .stamp circle { fill: none; stroke: var(--gold); stroke-width: 2; }
.sc-ph .stamp text { fill: var(--gold); font-size: 12px; font-weight: 800; letter-spacing: 2px; }
.sc-ph .stamp .s2 { font-size: 9px; letter-spacing: 1.5px; }
.viz-wrap.s-resolved .sc-ph .stamp { animation: stamp 600ms cubic-bezier(.2,1.6,.4,1) .8s both; }
@keyframes stamp { 0% { opacity: 0; transform: scale(1.8) rotate(-24deg); } 100% { opacity: 1; transform: scale(1) rotate(-12deg); } }

/* --- Highway --- */
.sc-hw .horizon { stroke: rgba(242,238,229,.18); }
.sc-hw .hills { fill: none; stroke: rgba(242,238,229,.22); }
.sc-hw .road line { stroke: rgba(242,238,229,.55); stroke-width: 1.4; }
.sc-hw .road .center { stroke: rgba(242,238,229,.7); stroke-width: 3; stroke-dasharray: 22 26; }
.viz-wrap.play .sc-hw .road .center { animation: lane 1.2s linear infinite; }
@keyframes lane { to { stroke-dashoffset: -48; } }
.sc-hw .paver rect, .sc-hw .paver path, .sc-hw .paver circle { fill: rgba(14,17,18,.85); stroke: rgba(242,238,229,.6); stroke-width: 1.3; }
.sc-hw .plate rect { fill: #14171A; stroke: rgba(242,238,229,.5); }
.sc-hw .plate text { font-size: 11.5px; font-weight: 800; letter-spacing: 1.5px; opacity: 0; transition: opacity 300ms ease; }
.sc-hw .p-it { fill: var(--porcelain); opacity: 1; }
.sc-hw .p-us { fill: #FF6F57; }
.sc-hw .p-ok { fill: var(--gold); }
.viz-wrap.s-acquire .sc-hw .p-it { opacity: 0; }
.viz-wrap.s-acquire .sc-hw .p-us { opacity: 1; }
.viz-wrap.s-acquire .sc-hw .plate rect { stroke: #D66852; }
.viz-wrap.s-resolved .sc-hw .p-us { opacity: 0; }
.viz-wrap.s-resolved .sc-hw .p-ok { opacity: 1; }
.viz-wrap.s-resolved .sc-hw .plate rect { stroke: var(--gold); }
.sc-hw .pin path { fill: var(--gold); opacity: 0; transition: opacity 400ms ease var(--pd), fill 300ms ease; }
.sc-hw .pin circle { fill: var(--obsidian); }
.sc-hw .pin text { fill: var(--ink-soft); font-weight: 600; opacity: 0; transition: opacity 400ms ease var(--pd); }
.viz-wrap.play .sc-hw .pin path, .viz-wrap.play .sc-hw .pin text { opacity: 1; }
.viz-wrap.s-alert .sc-hw .pin path { fill: #FF6F57; animation: v-blink .9s steps(2) var(--pd) infinite; }
.viz-wrap.s-resolved .sc-hw .pin path { fill: #E3C98F; animation: none; filter: url(#gl-hw); }
.sc-hw .rail-line { fill: none; stroke: var(--gold); stroke-width: 2.4; stroke-dasharray: 1; stroke-dashoffset: 1; filter: url(#gl-hw); }
.viz-wrap.s-resolved .sc-hw .rail-line { stroke-dashoffset: 0; transition: stroke-dashoffset 1400ms var(--ease) .3s; }
.sc-hw .posts line { stroke: var(--gold); stroke-width: 2; opacity: 0; }
.viz-wrap.s-resolved .sc-hw .posts line { opacity: 1; transition: opacity 300ms ease calc(.3s + var(--gd)); }
.sc-hw .guard-label { fill: var(--gold); font-size: 14px; font-weight: 700; opacity: 0; }
.viz-wrap.s-resolved .sc-hw .guard-label { opacity: 1; transition: opacity 600ms ease 1.6s; }
@media (prefers-reduced-motion: reduce) {
  .sc-ph .feed-gold, .sc-hw .rail-line { stroke-dashoffset: 0; }
}

/* ---------- Photo effects: tint by story state, focus pull, parallax, grain ---------- */
.viz-wrap { --mx: 0; --my: 0; }
.viz-wrap::before {
  translate: calc(var(--mx) * -14px) calc(var(--my) * -10px);
  transition: filter 1.2s ease, opacity 1.2s ease, translate 600ms var(--ease);
}
.viz-wrap.s-alert::before { filter: grayscale(.2) contrast(1.15) brightness(.7) blur(2px); opacity: .42; }
.viz-wrap.s-resolved::before { filter: grayscale(.35) contrast(1.05) brightness(.95) blur(0); opacity: .38; }
.fx-tint { position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: color; opacity: 0; background: transparent; transition: opacity 1.2s ease, background-color 1.2s ease; }
.viz-wrap.s-alert .fx-tint { background-color: #C2402E; opacity: .5; animation: tint-pulse 1.8s ease-in-out infinite; }
.viz-wrap.s-resolved .fx-tint { background-color: #AC9568; opacity: .35; animation: none; }
@keyframes tint-pulse { 50% { opacity: .28; } }
.fx-grain {
  position: absolute; inset: -50%; z-index: 0; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grain 1s steps(6) infinite;
}
@keyframes grain { 0% { transform: translate(0, 0); } 20% { transform: translate(-3%, 2%); } 40% { transform: translate(2%, -3%); } 60% { transform: translate(-2%, -1%); } 80% { transform: translate(3%, 2%); } 100% { transform: translate(0, 0); } }
.viz-wrap > .viz, .viz-wrap > .hud { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) { .fx-grain { animation: none; } .viz-wrap.s-alert .fx-tint { animation: none; } }

/* ============ "Lit" pass: more light, brighter gold highlights, visible photography ============ */
:root { --gold-lit: #E2C27E; --gold-glow: #F3D99B; }

/* Hero gets a warm light source instead of flat black */
.hero { background:
  radial-gradient(ellipse 60% 70% at 78% 45%, rgba(226, 194, 126, .16), transparent 65%),
  radial-gradient(ellipse 50% 60% at 10% 100%, rgba(226, 194, 126, .07), transparent 70%),
  var(--obsidian); }
.btn-gold { background: linear-gradient(180deg, #E2C27E 0%, #B99A5E 100%); }
.btn-gold:hover { background: linear-gradient(180deg, #F0D394 0%, #C7A869 100%); }
.nav .nav-cta { background: linear-gradient(180deg, #E2C27E 0%, #B99A5E 100%); }
.section-tag, .step .num, .method-close { color: var(--gold-lit); }
.on-light .section-tag, .on-light .step .num, .on-light .method-close { color: var(--gold-deep); }

/* Cases band: graphite with a soft light, not pure black */
.cases { background:
  radial-gradient(ellipse 70% 50% at 50% 0%, rgba(226, 194, 126, .10), transparent 70%),
  #15191B; }
.case-tabs button[aria-selected="true"] { background: linear-gradient(180deg, #E2C27E, #B99A5E); border-color: #E2C27E; }
.case-body h4, .case-body li::marker { color: var(--gold-lit); }

/* Photos clearly visible; dark only behind the log */
.viz-wrap { background: #101416; border-color: rgba(226, 194, 126, .35); box-shadow: 0 30px 80px -40px rgba(0,0,0,.8), 0 0 0 1px rgba(226,194,126,.06) inset; }
.viz-wrap::before { opacity: .62; filter: grayscale(.1) contrast(1.05) brightness(.85) saturate(.9); }
.viz-wrap::after { background: linear-gradient(100deg, rgba(11,13,14,.30) 0%, rgba(11,13,14,.18) 40%, rgba(11,13,14,.82) 64%, rgba(11,13,14,.93) 100%); }
@media (max-width: 860px) { .viz-wrap::after { background: linear-gradient(180deg, rgba(11,13,14,.2) 0%, rgba(11,13,14,.3) 45%, rgba(11,13,14,.93) 62%); } }
.viz-wrap.s-alert::before { filter: grayscale(.1) contrast(1.15) brightness(.7) blur(1.5px); opacity: .62; }
.viz-wrap.s-resolved::before { filter: grayscale(0) contrast(1.08) brightness(1) saturate(1) blur(0); opacity: .7; }

/* Red is an accent, not a flood */
.viz-wrap.s-alert .fx-tint { opacity: .26; }
@keyframes tint-pulse { 50% { opacity: .14; } }
.viz-wrap.s-resolved .fx-tint { background-color: #E2C27E; opacity: .16; }
.fx-grain { opacity: .035; }

/* Brighter gold in the scenes */
.sc-dc .lock path, .sc-ph .feed-gold, .sc-hw .rail-line, .viz .v-link.gold { stroke: var(--gold-lit); }
.sc-dc .lock text, .sc-ph .stamp text, .sc-hw .guard-label, .sc .lbl.gold, .sc-hw .p-ok { fill: var(--gold-glow); }
.sc-ph .stamp circle, .sc-hw .posts line { stroke: var(--gold-lit); }
.viz-wrap.s-resolved .sc-dc .rack.vendor .leds circle, .viz-wrap.s-resolved .sc-hw .pin path { fill: var(--gold-glow); }
.sc-dc .rack-frame { fill: rgba(14,17,18,.55); stroke: rgba(242,238,229,.7); }
.sc-dc .leds circle { fill: rgba(242,238,229,.45); }
.viz-wrap.p-1 .sc-dc .leds circle { fill: #E6FFF8; }
.sc-ph .belt { stroke: rgba(242,238,229,.75); }
.sc-ph .vial rect { stroke: #EAFBF6; fill: rgba(207,231,224,.12); }
.sc-hw .road line { stroke: rgba(242,238,229,.8); }
.sc .lbl, .viz .v-label { fill: #E9E4D8; }
.hud-result { color: var(--gold-glow); text-shadow: 0 0 24px rgba(226,194,126,.35); }
.hud-log li.ok { border-left-color: var(--gold-lit); }
.hud-log li.ok .t, .hud-meter .m-val.done { color: var(--gold-lit); }
.hud-meter .m-bar i.done { background: var(--gold-lit); }

/* Director band: warmer graphite with light */
.on-graphite { background: radial-gradient(ellipse 60% 80% at 20% 50%, rgba(226,194,126,.09), transparent 70%), #2A2D2E; }
.record strong { color: #FFFFFF; }
.path .go-label { color: var(--gold-deep); border-color: var(--gold-deep); }

/* ============ Cases on a cream band, scenes as framed dark panels ============ */
.cases.on-light { background:
  radial-gradient(ellipse 70% 40% at 50% 0%, rgba(226,194,126,.18), transparent 70%),
  var(--porcelain); color: var(--graphite); }
.cases.on-light .section-tag { color: var(--gold-deep); }
.cases.on-light .case-tabs button { color: var(--graphite-soft); border-color: rgba(40,42,43,.25); }
.cases.on-light .case-tabs button:hover { color: var(--graphite); border-color: rgba(40,42,43,.5); }
.cases.on-light .case-tabs button[aria-selected="true"] { color: var(--obsidian); background: linear-gradient(180deg, #E2C27E, #B99A5E); border-color: #B99A5E; }
.cases.on-light .case-meta { color: rgba(40,42,43,.55); }
.cases.on-light .case-title { color: var(--graphite); }
.cases.on-light .viz-wrap { border: none; box-shadow: 0 40px 90px -45px rgba(20,18,12,.55), 0 2px 0 rgba(226,194,126,.5) inset; }
.cases.on-light .case-body h4 { color: var(--gold-deep); }
.cases.on-light .case-body li::marker { color: var(--gold-deep); }
.cases.on-light .case-body p, .cases.on-light .case-body li { color: var(--graphite-soft); }
.cases.on-light .case-body .the-one { color: var(--graphite); }
.cases.on-light .case-body .outcome { color: var(--graphite); }
.cases.on-light .cases-note { color: rgba(40,42,43,.5); }
/* method follows the cases, so it goes dark to keep the light/dark rhythm */

/* ============ Readability pass: stronger contrast, larger text ============ */
:root {
  --ink-soft: rgba(242, 238, 229, 0.84);
  --ink-faint: rgba(242, 238, 229, 0.62);
  --graphite-soft: rgba(40, 42, 43, 0.84);
}
body { font-size: 18px; }
.lede { font-size: clamp(18px, 1.7vw, 21px); }
.section-tag { font-size: 15px; font-weight: 700; }
.case-meta { font-size: 15px; }
.case-body p, .case-body li { font-size: 17.5px; line-height: 1.62; }
.case-body h4 { font-size: 15px; }
.cases.on-light .case-body p, .cases.on-light .case-body li { color: #33363A; }
.cases.on-light .case-meta { color: rgba(40,42,43,.7); }
.path .situation { color: var(--graphite); }
.path .word { color: rgba(40, 42, 43, 0.32); }
.step p { font-size: 17px; }
.record li { font-size: 16.5px; }
.record strong { font-size: 28px; }
.hud { font-size: 15.5px; }
.hud-log li { color: #E9E4D8; }
.hud-log .t { font-size: 12.5px; color: rgba(242,238,229,.7); }
.hud-meter .m-label { font-size: 13.5px; color: rgba(242,238,229,.75); }
.sc .lbl, .viz .v-label { font-size: 16px; }
.sc-dc .lock text { font-size: 17px; } .sc-dc .lock text.sub { font-size: 14.5px; }
.sc-hw .guard-label { font-size: 16px; }
.nav a { font-size: 15px; color: rgba(242,238,229,.85); }
.site-footer { font-size: 15px; }
.legal { font-size: 13.5px; color: rgba(242,238,229,.6); }

/* --- Software licence audit: design-tool canvas --- */
.sc-au .artboard { opacity: 0; transition: opacity 800ms ease; }
.viz-wrap.play .sc-au .artboard { opacity: .09; }
.sc-au .ab-label { fill: rgba(242,238,229,.7); font-size: 13px; font-weight: 600; }
.sc-au .dev rect { fill: rgba(14,17,18,.7); stroke: rgba(242,238,229,.7); stroke-width: 1.2; opacity: 0; transition: opacity 400ms ease var(--dd), stroke 500ms ease, fill 500ms ease; }
.sc-au .dev line { stroke: rgba(242,238,229,.55); opacity: 0; transition: opacity 400ms ease var(--dd); }
.sc-au .dev .glyph { fill: none; stroke: #9FD3FF; stroke-width: 1.5; opacity: 0; transition: opacity 400ms ease var(--dd), stroke 500ms ease; }
.viz-wrap.play .sc-au .dev rect, .viz-wrap.play .sc-au .dev line, .viz-wrap.play .sc-au .dev .glyph { opacity: 1; }
.viz-wrap.s-alert .sc-au .dev rect { stroke: #FF6F57; }
.viz-wrap.s-alert .sc-au .dev .glyph { stroke: #FF6F57; }
.viz-wrap.s-resolved .sc-au .dev rect, .viz-wrap.s-resolved .sc-au .dev line, .viz-wrap.s-resolved .sc-au .dev .glyph { opacity: .22; }
.viz-wrap.s-resolved .sc-au .dev.in rect { opacity: 1; stroke: var(--gold-lit); }
.viz-wrap.s-resolved .sc-au .dev.in line { opacity: 1; }
.viz-wrap.s-resolved .sc-au .dev.in .glyph { opacity: 1; stroke: var(--gold-glow); }
.sc-au .marquee { opacity: 0; transform-box: fill-box; transform-origin: 0 0; transform: scale(.25); }
.sc-au .marquee rect { fill: rgba(214,104,82,.06); stroke: #FF6F57; stroke-width: 1.6; stroke-dasharray: 8 6; }
.sc-au .marquee text { fill: #FF8A70; font-size: 14px; font-weight: 700; }
.viz-wrap.s-alert .sc-au .marquee { opacity: 1; transform: scale(1); transition: transform 1200ms var(--ease), opacity 300ms ease; }
.viz-wrap.s-alert .sc-au .marquee rect { animation: ants 1s linear infinite; }
@keyframes ants { to { stroke-dashoffset: -14; } }
.viz-wrap.s-resolved .sc-au .marquee { opacity: 0; transform: scale(1.04); transition: opacity 700ms ease, transform 700ms ease; }
.sc-au .sel { opacity: 0; }
.sc-au .sel-box { fill: rgba(226,194,126,.07); stroke: var(--gold-lit); stroke-width: 2; filter: url(#gl-au); }
.sc-au .handles rect { fill: #0B0D0E; stroke: var(--gold-glow); stroke-width: 1.6; }
.sc-au .sel text { fill: var(--gold-glow); font-size: 15px; font-weight: 700; }
.viz-wrap.s-resolved .sc-au .sel { opacity: 1; transition: opacity 500ms ease .4s; }
.sc-au .cursor { fill: #F2EEE5; stroke: #0B0D0E; stroke-width: 1.2; opacity: 0; transform: translate(780px, 520px); }
.viz-wrap.s-build .sc-au .cursor { opacity: 1; transform: translate(408px, 254px); transition: transform 900ms var(--ease), opacity 200ms ease; }
.viz-wrap.s-resolved .sc-au .cursor { opacity: 0; transition: opacity 600ms ease 1.4s; transform: translate(408px, 254px); }
.sc-au .callout { opacity: 0; transition: opacity 400ms ease var(--cd); }
.viz-wrap.s-alert .sc-au .callout { opacity: 1; }
.sc-au .c-old { fill: #FF8A70; font-size: 15px; font-weight: 700; transition: fill 500ms ease; }
.sc-au .c-strike { stroke: #FF8A70; stroke-width: 2; stroke-dasharray: 260; stroke-dashoffset: 260; }
.sc-au .c-new { fill: var(--gold-glow); font-size: 15px; font-weight: 700; opacity: 0; }
.viz-wrap.s-resolved .sc-au .c-old { fill: rgba(242,238,229,.45); }
.viz-wrap.s-resolved .sc-au .c-strike { stroke-dashoffset: 0; transition: stroke-dashoffset 500ms ease calc(.6s + var(--cd)); }
.viz-wrap.s-resolved .sc-au .c-new { opacity: 1; transition: opacity 400ms ease calc(1s + var(--cd)); }
.sc-au .closed { opacity: 0; transform-box: fill-box; transform-origin: center; }
.sc-au .closed rect { fill: rgba(11,13,14,.9); stroke: var(--gold-lit); stroke-width: 2; }
.sc-au .closed text { fill: var(--gold-glow); font-size: 15px; font-weight: 800; letter-spacing: 2px; }
.sc-au .closed .s2 { fill: rgba(242,238,229,.8); font-size: 12px; letter-spacing: .5px; font-weight: 600; }
.viz-wrap.s-resolved .sc-au .closed { animation: stamp 600ms cubic-bezier(.2,1.6,.4,1) 2.2s both; }

/* --- Managed (healthcare): record timeline + heart monitor --- */
.sc-md .md-label { fill: rgba(242,238,229,.8); font-size: 14px; font-weight: 700; }
.sc-md .rec-line { stroke: rgba(242,238,229,.35); stroke-width: 1.2; }
.sc-md .doc rect { fill: rgba(14,17,18,.85); stroke: rgba(242,238,229,.75); stroke-width: 1.2; opacity: 0; transition: opacity 300ms ease var(--di); }
.sc-md .doc line { stroke: rgba(242,238,229,.55); opacity: 0; transition: opacity 300ms ease var(--di); }
.viz-wrap.play .sc-md .doc rect, .viz-wrap.play .sc-md .doc line { opacity: 1; }
.sc-md .contra { fill: none; stroke: #FF6F57; stroke-width: 1.8; stroke-dasharray: 6 5; opacity: 0; filter: url(#gl-md); }
.sc-md .flash { fill: none; stroke: #FF6F57; stroke-width: 2; opacity: 0; }
.viz-wrap.s-alert .sc-md .contra { opacity: 1; transition: opacity 400ms ease var(--ci); }
.viz-wrap.s-alert .sc-md .flash { opacity: 1; animation: v-blink 1s steps(2) var(--ci) infinite; }
.viz-wrap.s-resolved .sc-md .contra { opacity: .18; }
.viz-wrap.s-resolved .sc-md .flash { opacity: 0; animation: none; }
.sc-md .thread { fill: none; stroke: var(--gold-lit); stroke-width: 2.6; stroke-dasharray: 1; stroke-dashoffset: 1; filter: url(#gl-md); }
.viz-wrap.s-build .sc-md .thread { stroke-dashoffset: 0; transition: stroke-dashoffset 1400ms var(--ease); }
.sc-md .vt { fill: var(--gold-glow); opacity: 0; }
.viz-wrap.s-build .sc-md .vt { opacity: 1; transition: opacity 300ms ease calc(.3s + var(--vi)); }
.sc-md .md-gold { fill: var(--gold-glow); font-size: 15px; font-weight: 700; opacity: 0; }
.viz-wrap.s-resolved .sc-md .md-gold { opacity: 1; transition: opacity 500ms ease 1.2s; }
.sc-md .ecg-bg { fill: rgba(6,14,12,.72); stroke: rgba(159,227,200,.25); }
.sc-md .ecg-grid { opacity: .12; }
.sc-md .ecg { fill: none; stroke-width: 2.2; stroke-linejoin: round; }
.sc-md .ecg.err { stroke: #9FE3C8; filter: url(#gl-md); }
.sc-md .ecg.calm { stroke: var(--gold-glow); filter: url(#gl-md); opacity: 0; }
.viz-wrap.play .sc-md .ecg-move { animation: ecg-scroll 6s linear infinite; }
.viz-wrap.play .sc-md .steady-move { animation-duration: 5.4s; }
@keyframes ecg-scroll { from { transform: translateX(0); } to { transform: translateX(-900px); } }
.viz-wrap.s-alert .sc-md .ecg.err { stroke: #FF6F57; }
.viz-wrap.s-alert .sc-md .err-move, .viz-wrap.s-alert .sc-md .ecg-move:not(.steady-move) { animation-duration: 3s; }
.viz-wrap.s-resolved .sc-md .ecg.err { opacity: 0; transition: opacity 900ms ease; }
.viz-wrap.s-resolved .sc-md .ecg.calm { opacity: 1; transition: opacity 900ms ease .3s; }
.sc-md .status { opacity: 0; }
.sc-md .status text { fill: var(--gold-glow); font-size: 18px; font-weight: 700; }
.sc-md .beat { fill: var(--gold-glow); transform-box: fill-box; transform-origin: center; }
.viz-wrap.s-resolved .sc-md .status { opacity: 1; transition: opacity 600ms ease 1.4s; }
.viz-wrap.s-resolved .sc-md .beat { animation: beat 1s ease-in-out infinite; }
@keyframes beat { 0%, 100% { transform: scale(1); opacity: 1; } 15% { transform: scale(1.6); } 30% { transform: scale(1); opacity: .7; } }
.page-intro + .cases { padding-top: clamp(72px, 9vw, 120px); }
.hud-meter .m-val[data-to="100"] { color: var(--gold-lit); }
.hud-meter:has(.m-val[data-to="100"]) .m-bar i { background: var(--gold-lit); }

/* --- People across borders: departures board --- */
.sc-ap .board { fill: rgba(8,10,11,.88); stroke: rgba(242,238,229,.25); }
.sc-ap .bh { fill: #FFD27A; font-size: 22px; font-weight: 800; letter-spacing: 6px; }
.sc-ap .bh2 { fill: rgba(242,238,229,.55); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; }
.sc-ap .cell { fill: rgba(242,238,229,.04); stroke: rgba(242,238,229,.08); }
.sc-ap .ft { fill: #F2EEE5; font-size: 16px; font-weight: 700; letter-spacing: 2px; font-variant-numeric: tabular-nums; }
.sc-ap .ft.dest { fill: #FFD27A; }
.sc-ap .frow { opacity: 0; transition: opacity 400ms ease var(--ri); }
.viz-wrap.play .sc-ap .frow { opacity: 1; }
.sc-ap .flap-bg { fill: #14181A; stroke: rgba(242,238,229,.18); }
.sc-ap .hinge { stroke: rgba(0,0,0,.6); stroke-width: 1.2; }
.sc-ap .st { font-size: 15px; font-weight: 800; letter-spacing: 3px; transform-box: fill-box; transform-origin: center; }
.sc-ap .st.old { fill: rgba(242,238,229,.75); }
.sc-ap .st.new { fill: var(--gold-glow); opacity: 0; }
.viz-wrap.s-alert .sc-ap .st.old { fill: #FF6F57; animation: v-blink 1s steps(2) infinite; }
.viz-wrap.s-alert .sc-ap .flap-bg { stroke: rgba(255,111,87,.6); }
.viz-wrap.s-resolved .sc-ap .st.old { animation: flap-out 260ms ease-in calc(.2s + var(--ri) * 2.6) both; }
.viz-wrap.s-resolved .sc-ap .st.new { animation: flap-in 300ms ease-out calc(.46s + var(--ri) * 2.6) both; }
.viz-wrap.s-resolved .sc-ap .flap-bg { stroke: var(--gold-lit); transition: stroke 300ms ease calc(.46s + var(--ri) * 2.6); }
@keyframes flap-out { to { transform: scaleY(0); opacity: 0; } }
@keyframes flap-in { from { transform: scaleY(0); opacity: 1; } to { transform: scaleY(1); opacity: 1; } }
.sc-ap .court { fill: #FF8A70; font-size: 13px; font-weight: 700; opacity: 0; }
.viz-wrap.s-alert .sc-ap .court { opacity: 1; transition: opacity 400ms ease .5s; }
.viz-wrap.s-resolved .sc-ap .court { opacity: 0; }
.sc-ap .runway { stroke: rgba(242,238,229,.45); stroke-width: 1.4; }
.sc-ap .runway.dash { stroke: rgba(242,238,229,.7); stroke-dasharray: 18 22; stroke-width: 2; }
.viz-wrap.play .sc-ap .runway.dash { animation: lane 1.6s linear infinite; }
.sc-ap .arc { fill: none; stroke: var(--gold-lit); stroke-width: 2.4; stroke-dasharray: 1; stroke-dashoffset: 1; filter: url(#gl-ap); }
.viz-wrap.s-resolved .sc-ap .arc { stroke-dashoffset: 0; transition: stroke-dashoffset 1600ms var(--ease) 1.6s; }
.sc-ap .plane path { fill: var(--gold-glow); filter: url(#gl-ap); }
.sc-ap .plane { offset-path: path("M120 520 C 360 520, 560 470, 840 410"); offset-distance: 0%; offset-rotate: auto; opacity: 0; }
.viz-wrap.play .sc-ap .plane { opacity: 1; }
.viz-wrap.s-resolved .sc-ap .plane { offset-distance: 100%; transition: offset-distance 1600ms var(--ease) 1.6s; }
.sc-ap .home { fill: var(--gold-glow); font-size: 16px; font-weight: 700; opacity: 0; }
.viz-wrap.s-resolved .sc-ap .home { opacity: 1; transition: opacity 500ms ease 3s; }
@media (prefers-reduced-motion: reduce) { .sc-ap .st.old { display: none; } .sc-ap .st.new { opacity: 1; } .sc-ap .plane { offset-distance: 100%; } }
.case-body li strong { font-weight: 700; color: inherit; }

/* ============ About: hero + Director bio ============ */
.about-hero { position: relative; background: var(--obsidian); }
.about-hero img { width: 100%; height: min(86vh, 900px); object-fit: cover; object-position: 50% 30%; }
.about-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,13,14,0) 45%, rgba(11,13,14,.9) 100%); pointer-events: none; }
.about-hero-caption { position: absolute; left: 0; right: 0; bottom: clamp(32px, 6vw, 72px); z-index: 1; }
.about-hero-caption h1 { max-width: 14em; }
@media (max-width: 760px) {
  .about-hero img { height: 62vh; object-position: 50% 40%; }
  .about-hero-caption { position: static; padding-top: 32px; padding-bottom: 48px; }
  .about-hero::after { display: none; }
}
.bio-grid { display: grid; grid-template-columns: minmax(260px, 0.8fr) 1.5fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.bio-side { position: sticky; top: 100px; }
.bio-side img { width: 100%; aspect-ratio: 4/5; object-fit: cover; box-shadow: 0 30px 70px -40px rgba(20,18,12,.6); }
.bio-name { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(30px, 3vw, 38px); margin: 28px 0 2px; color: var(--graphite); }
.bio-role { margin: 0 0 24px; font-weight: 700; color: var(--gold-deep); }
.bio-facts { margin: 0; display: grid; gap: 0; }
.bio-facts dt { font-size: 13px; font-weight: 700; color: rgba(40,42,43,.6); padding-top: 14px; border-top: 1px solid rgba(40,42,43,.14); }
.bio-facts dd { margin: 4px 0 14px; font-size: 15.5px; line-height: 1.5; color: var(--graphite); }
.bio-facts a { color: var(--gold-deep); }
.bio-text { max-width: 40em; color: #33363A; }
.bio-text p { margin: 0 0 20px; font-size: 18px; line-height: 1.75; }
.bio-text h3 { font-size: 15px; font-weight: 700; color: var(--gold-deep); margin: 48px 0 14px; }
.bio-question { font-family: var(--serif); font-style: italic; font-size: clamp(28px, 3.2vw, 42px) !important; line-height: 1.22 !important; color: var(--graphite); margin-bottom: 24px !important; }
.bio-lead { font-size: 20px !important; color: var(--graphite); }
.disciplines { list-style: none; padding: 0; margin: 28px 0 8px; border-left: 2px solid var(--gold-lit); }
.disciplines li { padding: 8px 0 8px 22px; font-size: 17.5px; line-height: 1.5; }
.disciplines strong { color: var(--graphite); }
.bio-pull { margin: 36px 0; padding: 0; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.3; color: var(--graphite); }
.bio-pull::before { content: ''; display: block; width: 56px; height: 2px; background: var(--gold-lit); margin-bottom: 18px; }
.bio-close { font-family: var(--serif); font-style: italic; font-size: clamp(26px, 2.8vw, 34px) !important; line-height: 1.25 !important; color: var(--gold-deep); margin-top: 36px !important; }
@media (max-width: 860px) { .bio-grid { grid-template-columns: 1fr; } .bio-side { position: static; max-width: 420px; } }
.about-hero::after { display: none; }
.about-hero img { height: auto; max-height: 92vh; aspect-ratio: 2400 / 1794; object-position: 50% 45%; }
.about-intro { padding-block: clamp(48px, 7vw, 88px) clamp(56px, 8vw, 96px); }
.about-intro h1 { max-width: 15em; }
.bio-side img { height: auto; }
@media (max-width: 760px) { .about-hero img { height: auto; max-height: none; } }
.bio-motto { font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.4vw, 30px) !important; line-height: 1.25 !important; color: var(--graphite); margin: 28px 0 !important; }

/* ============ Team cards ============ */
.people-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); margin-top: clamp(48px, 7vw, 80px); }
.person-photo { position: relative; aspect-ratio: 4 / 5; background: linear-gradient(160deg, #1B1F21, #101315); overflow: hidden; box-shadow: 0 30px 70px -40px rgba(0,0,0,.8); }
.person-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.person-photo .initials { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; font-family: var(--serif); font-style: italic; font-size: 72px; color: rgba(226,194,126,.55); }
.person-photo.empty img { display: none; }
.person-photo.empty .initials { display: flex; }
.person-name { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(30px, 3vw, 38px); margin: 28px 0 4px; color: var(--porcelain); }
.person-role { margin: 0; font-weight: 700; font-size: 15.5px; color: var(--gold-lit); }
.person-line { margin: 16px 0 0; font-family: var(--serif); font-style: italic; font-size: 21px; line-height: 1.35; color: rgba(242,238,229,.9); }
.person-bio { margin-top: 22px; padding-top: 22px; border-top: 1px solid rgba(242,238,229,.14); }
.person-bio p { margin: 0 0 16px; font-size: 16.5px; line-height: 1.7; color: rgba(242,238,229,.84); }
.person.pending .person-line { color: rgba(242,238,229,.5); font-size: 17px; }
@media (max-width: 860px) { .people-grid { grid-template-columns: 1fr; } .person-photo { max-width: 460px; } }

/* Office of the Director: horizontal rows */
.people-rows { margin-top: clamp(48px, 7vw, 80px); display: grid; gap: clamp(56px, 8vw, 96px); }
.people-rows .person { display: grid; grid-template-columns: minmax(260px, 0.75fr) 1.25fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.people-rows .person + .person { padding-top: clamp(56px, 8vw, 96px); border-top: 1px solid rgba(242,238,229,.12); }
.people-rows .person-name { margin-top: 0; }
.people-rows .person-bio p { font-size: 17px; }
@media (max-width: 860px) { .people-rows .person { grid-template-columns: 1fr; } }

/* ============ Advisory council ============ */
.advisors .person-senior {
  position: relative; margin-top: clamp(48px, 7vw, 80px);
  display: grid; grid-template-columns: minmax(260px, 0.75fr) 1.25fr; gap: clamp(32px, 5vw, 72px); align-items: start;
  padding: clamp(28px, 4vw, 56px);
  background: #FBF8F1;
  border: 2px solid var(--gold-lit);
  outline: 1px solid rgba(122,99,56,.35); outline-offset: 8px;
  box-shadow: 0 40px 90px -50px rgba(60,48,20,.55);
}
.senior-badge {
  position: absolute; top: -15px; left: clamp(28px, 4vw, 56px);
  background: linear-gradient(180deg, #E2C27E, #B99A5E); color: var(--obsidian);
  font-size: 13px; font-weight: 800; letter-spacing: .4px; padding: 6px 14px;
}
.advisors .person-name { color: var(--graphite); margin-top: 0; }
.advisors .person-role { color: var(--gold-deep); }
.advisors .person-line { color: var(--graphite); }
.advisors .person-bio { border-top-color: rgba(40,42,43,.14); }
.advisors .person-bio p { color: #33363A; font-size: 17px; }
.advisors .person-photo { background: linear-gradient(160deg, #E9E2D3, #D9D0BE); }
.advisors .person-photo .initials { color: rgba(122,99,56,.6); }
.markers { list-style: none; padding: 0; margin: 8px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.markers li { padding: 12px 0 12px 18px; border-top: 1px solid rgba(40,42,43,.12); font-size: 15px; font-weight: 600; color: var(--graphite); position: relative; line-height: 1.4; }
.markers li::before { content: ''; position: absolute; left: 0; top: 19px; width: 7px; height: 7px; background: var(--gold-lit); transform: rotate(45deg); }
@media (max-width: 860px) { .advisors .person-senior { grid-template-columns: 1fr; } .markers { grid-template-columns: 1fr; } }

/* Advisors below the senior card */
.advisor-rows { margin-top: clamp(56px, 8vw, 96px); display: grid; gap: clamp(48px, 7vw, 80px); }
.advisor-rows .person { display: grid; grid-template-columns: minmax(200px, 0.55fr) 1.45fr; gap: clamp(28px, 4vw, 64px); align-items: start; }
.advisor-rows .person + .person { padding-top: clamp(48px, 7vw, 80px); border-top: 1px solid rgba(40,42,43,.12); }
.advisor-rows .person-name { margin-top: 0; }
@media (max-width: 860px) { .advisor-rows .person { grid-template-columns: 1fr; } .advisor-rows .person-photo { max-width: 340px; } }

/* Risk Intelligence */
.risk-intel { border-top: 1px solid rgba(242,238,229,.10); }
.credential { display: inline-flex; align-items: center; gap: 14px; margin: 20px 0 4px; padding: 12px 20px 12px 16px; border: 1.5px solid var(--gold-lit); font-size: 15px; line-height: 1.35; letter-spacing: .01em; color: rgba(242,238,229,.88); background: rgba(226,194,126,.08); }
.credential strong { display: block; font-weight: 700; color: var(--gold-glow); }
.cred-mark { flex: none; width: 10px; height: 10px; background: var(--gold-lit); transform: rotate(45deg); }
.person-text .markers { margin-top: 22px; }
.on-dark .markers li { color: rgba(242,238,229,.9); border-top-color: rgba(242,238,229,.14); }

/* Board */
.board .people-rows .person-board { grid-template-columns: minmax(0, 300px) 1fr; }
@media (max-width: 860px) { .board .people-rows .person-board { grid-template-columns: 1fr; } }
/* Hero: always show the full photo, including hands and watch */
.about-hero img { height: auto; max-height: none; aspect-ratio: 2400 / 1794; object-fit: contain; display: block; }

/* Founder prominence: the largest portrait on the page, framed in gold */
.bio-grid { grid-template-columns: minmax(300px, 1fr) 1.25fr; }
.bio-side figure, .bio-side > img { position: relative; }
.bio-side > img { display: block; outline: 1.5px solid var(--gold-lit); outline-offset: 14px; box-shadow: 0 50px 90px -40px rgba(20,18,12,.55); margin: 14px; width: calc(100% - 28px); }
.bio-name { font-size: clamp(38px, 3.8vw, 52px); line-height: 1.05; margin-top: 44px; }
.bio-role { font-size: 16px; letter-spacing: .02em; }
@media (max-width: 860px) { .bio-side { max-width: 480px; } }

/* Founder panel (no second portrait) */
.bio-grid { grid-template-columns: minmax(280px, 0.85fr) 1.4fr; }
.bio-side { padding: 40px 36px 32px; border: 1.5px solid var(--gold-lit); outline: 1px solid rgba(172,149,104,.35); outline-offset: 10px; background: #F7F3EA; box-shadow: 0 40px 80px -50px rgba(20,18,12,.45); }
.bio-mark { display: block; width: 44px; height: 44px; background: url('/assets/img/mesaden-a.png') center/contain no-repeat; margin-bottom: 26px; }
.bio-side .bio-name { margin-top: 0; font-size: clamp(40px, 3.6vw, 52px); }
.bio-side .bio-role { margin-bottom: 0; padding-bottom: 24px; border-bottom: 2px solid var(--gold-lit); }
.bio-side .bio-facts { margin-top: 8px; }
.bio-side .bio-facts dt:first-child { border-top: 0; }
@media (max-width: 860px) { .bio-side { padding: 28px 24px; } }
.risk-intel + .board { border-top: 1px solid rgba(242,238,229,.10); }

/* =========================================================
   HOME — the walk-through (launch-page language, rebuilt)
   ========================================================= */
.home section { position: relative; }
.j-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 200; pointer-events: none; }
.j-progress i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold-deep), #E2C27E); }
.j-mark { position: fixed; width: 14px; height: 14px; border: 1px solid #8a8a8a; mix-blend-mode: difference; opacity: .55; z-index: 150; pointer-events: none; }
.j-mark.tl { top: 86px; left: 18px; border-right: 0; border-bottom: 0; }
.j-mark.tr { top: 86px; right: 18px; border-left: 0; border-bottom: 0; }
.j-mark.bl { bottom: 18px; left: 18px; border-right: 0; border-top: 0; }
.j-mark.br { bottom: 18px; right: 18px; border-left: 0; border-top: 0; }

.j-tag { position: absolute; top: clamp(26px, 4vw, 48px); left: var(--gutter); display: flex; align-items: baseline; gap: 12px; z-index: 3; }
.j-tag .n { font-family: var(--serif); font-style: italic; font-size: 19px; color: #E2C27E; }
.j-tag .t { font-size: 11px; letter-spacing: .32em; text-transform: uppercase; font-weight: 700; opacity: .55; }
.on-light .j-tag .n { color: var(--gold-deep); }

.j-seam { display: block; width: 1px; height: 64px; margin: 0 0 40px; background: linear-gradient(#E2C27E, rgba(226,194,126,0)); transform: scaleY(0); transform-origin: top; transition: transform 900ms var(--ease); }
.on-light .j-seam { background: linear-gradient(var(--gold-deep), rgba(122,99,56,0)); }
.on .j-seam, .on > .container > .j-seam { transform: scaleY(1); }

.j-cue { display: inline-flex; align-items: center; gap: 14px; margin-top: 56px; text-decoration: none; font-size: 11px; letter-spacing: .32em; text-transform: uppercase; font-weight: 700; color: var(--ink-faint); }
.j-cue i { width: 40px; height: 1px; background: currentColor; animation: jcue 2.2s ease-in-out infinite; }
@keyframes jcue { 0%,100% { transform: translateX(0); opacity: .4 } 50% { transform: translateX(8px); opacity: 1 } }

/* 01 — The name */
.j-name { padding-block: clamp(120px, 15vw, 200px); overflow: hidden; background:
  radial-gradient(60% 50% at 50% 55%, rgba(226,194,126,.10), transparent 70%), var(--obsidian); }
.j-name h2 { text-align: center; margin: 0 auto; }
.j-name .j-seam { margin-inline: auto; }
.j-word { margin: clamp(56px, 8vw, 96px) auto 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; max-width: 1100px; }
.j-word .half { display: flex; flex-direction: column; transition: transform 1400ms var(--ease); }
.j-word .mesa { align-items: flex-end; text-align: right; transform: translateX(-9vw); }
.j-word .den { align-items: flex-start; text-align: left; transform: translateX(9vw); }
.j-name.on .j-word .half { transform: translateX(0); }
.j-word .letters { font-family: 'Cormorant Garamond', var(--serif); font-weight: 500; font-size: clamp(54px, 10.5vw, 150px); line-height: 1; letter-spacing: .14em; color: transparent;
  background: linear-gradient(180deg, #F3D99B 0%, #C9A866 48%, #8E733F 100%); -webkit-background-clip: text; background-clip: text; display: inline-flex; align-items: flex-end; }
.j-word .den .letters { padding-left: .06em; }
.j-word .a-mark { display: inline-block; height: .74em; margin-left: .04em; margin-bottom: .02em; }
.j-word .a-mark img { height: 100%; width: auto; }
.j-word .join { width: 1px; align-self: stretch; margin-inline: clamp(8px, 1.4vw, 18px); background: linear-gradient(transparent, rgba(226,194,126,.7), transparent); opacity: 0; transition: opacity 900ms ease 900ms; }
.j-name.on .j-word .join { opacity: 1; }
.j-word .def { margin: 26px 0 0; max-width: 21em; font-size: 16px; line-height: 1.6; color: var(--ink-soft); opacity: 0; transform: translateY(10px); transition: opacity 900ms ease 1000ms, transform 900ms var(--ease) 1000ms; }
.j-word .def strong { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 26px; color: var(--porcelain); margin-bottom: 4px; }
.j-name.on .j-word .def { opacity: 1; transform: none; }
.j-name-close { margin: clamp(56px, 7vw, 88px) auto 0; max-width: 34em; text-align: center; font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.35; color: var(--porcelain); opacity: 0; transition: opacity 1000ms ease 1500ms; }
.j-name.on .j-name-close { opacity: 1; }

/* 02 — The insight */
.j-insight { padding-block: clamp(120px, 14vw, 190px); }
.j-transforms { list-style: none; margin: clamp(56px, 8vw, 96px) 0 0; padding: 0; display: grid; gap: clamp(40px, 6vw, 64px); max-width: 900px; }
.j-transforms li { display: flex; flex-direction: column; gap: 12px; opacity: 0; transform: translateX(-22px); transition: opacity 800ms ease, transform 800ms var(--ease); }
.j-transforms li.r { margin-left: auto; text-align: right; align-items: flex-end; transform: translateX(22px); }
.j-transforms li.on { opacity: 1; transform: none; }
.j-transforms .old { position: relative; align-self: flex-start; font-weight: 800; font-size: 15px; letter-spacing: .18em; text-transform: uppercase; color: rgba(40,42,43,.42); }
.j-transforms li.r .old { align-self: flex-end; }
.j-transforms .old::after { content: ''; position: absolute; left: -4px; right: -4px; top: 52%; height: 2px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 700ms var(--ease) 500ms; }
.j-transforms li.on .old::after { transform: scaleX(1); }
.j-transforms .new { font-family: var(--serif); font-style: italic; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.15; color: var(--graphite); opacity: 0; transition: opacity 900ms ease 900ms; }
.j-transforms li.on .new { opacity: 1; }

/* 03 — The method */
.j-method { text-align: center; padding-block: clamp(120px, 14vw, 190px); background: radial-gradient(70% 60% at 50% 60%, rgba(226,194,126,.07), transparent 70%), var(--obsidian); }
.j-method .j-seam { margin-inline: auto; }
.j-method h2 { margin: 0 auto; }
.j-loop { position: relative; max-width: 1080px; margin: clamp(64px, 9vw, 108px) auto 0; }
.j-loop .frame { position: absolute; inset: -28px -24px; border: 1px solid rgba(226,194,126,.24); opacity: 0; transform: scale(.94); transition: opacity 1000ms ease, transform 1000ms var(--ease); }
.j-loop .f2 { inset: -50px -44px; border-color: rgba(226,194,126,.12); transform: scale(.9); }
.j-method.on .j-loop .frame { opacity: 1; transform: none; }
.j-loop ol { list-style: none; margin: 0; padding: 32px 0; display: grid; grid-template-columns: 1fr 70px 1fr 70px 1fr; align-items: start; position: relative; z-index: 1; }
.j-loop .w { display: block; font-weight: 800; font-size: clamp(26px, 3.6vw, 48px); letter-spacing: .04em; text-transform: uppercase; color: var(--porcelain); }
.j-loop li p { margin: 16px auto 0; max-width: 17em; font-size: 15.5px; line-height: 1.6; color: var(--ink-soft); }
.j-loop .c { height: 2px; margin-top: clamp(18px, 2vw, 26px); background: linear-gradient(90deg, #E2C27E, var(--gold)); transform: scaleX(0); transform-origin: left; transition: transform 900ms var(--ease) 600ms; }
.j-loop .c:last-of-type { transition-delay: 1100ms; }
.j-method.on .j-loop .c { transform: scaleX(1); }
.j-method-close { margin: clamp(56px, 7vw, 80px) 0 0; font-family: var(--serif); font-style: italic; font-size: clamp(26px, 3vw, 36px); color: #E2C27E; }

/* 04 — Solve / Build / Go */
.j-sbg { padding-block: clamp(120px, 14vw, 190px); overflow: hidden; background:
  radial-gradient(50% 40% at 15% 10%, rgba(226,194,126,.18), transparent 70%), radial-gradient(40% 40% at 90% 90%, rgba(172,149,104,.14), transparent 70%), var(--porcelain); }
.j-field span { position: absolute; font-weight: 800; letter-spacing: .2em; font-size: clamp(14px, 2vw, 24px); color: rgba(122,99,56,.13); opacity: 0; transition: opacity 1400ms ease; pointer-events: none; }
.j-sbg.on .j-field span { opacity: 1; }
.j-field span:nth-child(1) { top: 7%; left: 5%; transform: rotate(-6deg); }
.j-field span:nth-child(2) { top: 11%; left: 74%; transform: rotate(4deg); }
.j-field span:nth-child(3) { top: 46%; left: 1%; transform: rotate(-90deg); }
.j-field span:nth-child(4) { top: 40%; left: 95%; }
.j-field span:nth-child(5) { top: 93%; left: 8%; transform: rotate(3deg); }
.j-field span:nth-child(6) { top: 95%; left: 62%; transform: rotate(-3deg); }
.j-field span:nth-child(7) { top: 3%; left: 42%; }
.j-cards { margin-top: clamp(56px, 7vw, 88px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2vw, 28px); }
.j-card { position: relative; display: flex; flex-direction: column; min-height: 640px; padding: 0 clamp(24px, 2.4vw, 36px) clamp(28px, 3vw, 40px); text-decoration: none; color: var(--porcelain);
  background: linear-gradient(180deg, #15181A 0%, #0B0D0E 100%); border: 1px solid rgba(226,194,126,.18); overflow: hidden;
  box-shadow: 0 50px 90px -50px rgba(20,18,12,.7); opacity: 0; transform: translateY(36px);
  transition: opacity 900ms ease, transform 900ms var(--ease), border-color 400ms ease, box-shadow 400ms ease; }
.j-sbg.on .j-card { opacity: 1; transform: none; }
.j-sbg.on .j-card.build { transition-delay: 150ms, 150ms, 0s, 0s; }
.j-sbg.on .j-card.go { transition-delay: 300ms, 300ms, 0s, 0s; }
.j-card::before { content: ''; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, #E2C27E, transparent); transform: scaleX(0); transition: transform 700ms var(--ease); }
.j-card:hover, .j-card:focus-visible { border-color: rgba(226,194,126,.7); transform: translateY(-8px); box-shadow: 0 60px 100px -50px rgba(20,18,12,.85), 0 0 0 1px rgba(226,194,126,.25); }
.j-card:hover::before, .j-card:focus-visible::before { transform: scaleX(1); }
.j-card .art { width: calc(100% + 2 * clamp(24px, 2.4vw, 36px)); margin: 0 calc(-1 * clamp(24px, 2.4vw, 36px)); height: auto; aspect-ratio: 16/10; display: block;
  background: radial-gradient(60% 70% at 50% 60%, rgba(226,194,126,.12), transparent 70%); border-bottom: 1px solid rgba(226,194,126,.14); }
.j-card .art * { fill: none; stroke: #E2C27E; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.j-card .idx { margin-top: 28px; font-family: var(--serif); font-style: italic; font-size: 18px; color: #E2C27E; }
.j-card .word { font-weight: 800; font-size: clamp(44px, 4.6vw, 64px); line-height: 1; letter-spacing: .02em; text-transform: uppercase; margin-top: 6px; }
.j-card .verb { margin: 18px 0 0; font-family: var(--serif); font-style: italic; font-size: 23px; line-height: 1.3; color: #F3D99B; }
.j-card .sit { margin: 14px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--ink-soft); }
.j-card ul { list-style: none; margin: 22px 0 0; padding: 0; border-top: 1px solid rgba(242,238,229,.12); }
.j-card li { padding: 10px 0 10px 18px; position: relative; font-size: 14.5px; font-weight: 600; color: rgba(242,238,229,.86); border-bottom: 1px solid rgba(242,238,229,.08); }
.j-card li::before { content: ''; position: absolute; left: 0; top: 18px; width: 6px; height: 6px; background: #E2C27E; transform: rotate(45deg); }
.j-card .enter { margin-top: auto; padding-top: 28px; display: inline-flex; align-items: center; gap: 12px; font-weight: 700; font-size: 15px; color: #E2C27E; }
.j-card .enter::after { content: ''; width: 34px; height: 1px; background: currentColor; transition: width 400ms var(--ease); }
.j-card:hover .enter::after { width: 64px; }
/* card art motion */
.j-card .knot { stroke-dasharray: 600; stroke-dashoffset: 600; opacity: .55; }
.j-card .clear { stroke-width: 2.2; stroke-dasharray: 260; stroke-dashoffset: 260; }
.j-card .target { opacity: .35; transition: opacity 600ms ease; }
.j-sbg.on .j-card.solve .knot { animation: jdraw 2.4s var(--ease) .4s forwards, jfade 1.2s ease 2.6s forwards; }
.j-sbg.on .j-card.solve .clear { animation: jdraw 1.4s var(--ease) 2.8s forwards; }
.j-sbg.on .j-card.solve .target { opacity: 1; transition-delay: 3.6s; }
.j-card.solve:hover .target circle:last-child { fill: #E2C27E; }
@keyframes jdraw { to { stroke-dashoffset: 0; } }
@keyframes jfade { to { opacity: .12; } }
.j-card .grid { opacity: .18; }
.j-card .blk { stroke-width: 1.6; fill: rgba(226,194,126,.08); opacity: 0; transform: translateY(-40px); transform-box: fill-box; }
.j-sbg.on .j-card.build .blk { animation: jdrop .9s var(--ease) forwards; }
.j-sbg.on .j-card.build .b1 { animation-delay: .7s; } .j-sbg.on .j-card.build .b2 { animation-delay: 1.0s; }
.j-sbg.on .j-card.build .b3 { animation-delay: 1.3s; } .j-sbg.on .j-card.build .b4 { animation-delay: 1.6s; }
.j-sbg.on .j-card.build .b5 { animation-delay: 1.9s; }
.j-card.build:hover .b5 { fill: rgba(226,194,126,.35); }
@keyframes jdrop { to { opacity: 1; transform: none; } }
.j-card .globe { opacity: .3; }
.j-card .route { stroke-dasharray: 4 6; opacity: .8; }
.j-card .pin, .j-card .traveller { fill: #E2C27E; stroke: none; }
.j-card .traveller { filter: drop-shadow(0 0 6px rgba(243,217,155,.9)); }

/* 05 — Cases, one after another */
.cases.on-light { padding-top: clamp(120px, 14vw, 190px); }
.j-bridge { margin-top: 22px; }
.j-case { margin-top: clamp(80px, 10vw, 128px); padding-top: clamp(56px, 7vw, 80px); border-top: 1px solid rgba(40,42,43,.14); opacity: 0; transform: translateY(30px); transition: opacity 900ms ease, transform 900ms var(--ease); }
.j-case.on { opacity: 1; transform: none; }
.j-case:first-of-type { border-top: 0; padding-top: 0; }
.j-case-n { display: block; margin-bottom: 18px; font-family: var(--serif); font-style: italic; font-size: 18px; color: var(--gold-deep); }
.j-brief { margin-top: clamp(32px, 4vw, 44px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 80px); }
.j-brief h4 { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--gold-deep); }
.j-brief .the-one { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.3; color: var(--graphite); }
.j-brief .outcome { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.55; color: var(--graphite); }
.j-more { margin-top: 32px; }
.j-more summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 12px; padding: 12px 22px; border: 1px solid rgba(40,42,43,.3); font-weight: 700; font-size: 15px; color: var(--graphite); transition: border-color 300ms ease, color 300ms ease; }
.j-more summary::-webkit-details-marker { display: none; }
.j-more summary::after { content: '+'; font-size: 20px; line-height: 1; color: var(--gold-deep); transition: transform 300ms ease; }
.j-more[open] summary::after { transform: rotate(45deg); }
.j-more summary:hover { border-color: var(--gold-deep); color: var(--gold-deep); }
.j-more .close, .j-more[open] .open { display: none; }
.j-more[open] .close { display: inline; }
.j-more .case-body { margin-top: 40px; }

/* 06 — The Director, slim */
.j-director { padding-block: clamp(96px, 11vw, 140px); }
.j-director .container { display: grid; grid-template-columns: 220px 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; max-width: 980px; }
.j-director figure { margin: 0; outline: 1px solid rgba(226,194,126,.5); outline-offset: 10px; }
.j-director img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.j-director .q { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.15; color: var(--porcelain); }
.j-director .name { margin: 24px 0 0; font-weight: 700; font-size: 17px; }
.j-director .role { margin: 2px 0 22px; color: #E2C27E; font-size: 15px; }

/* 07 — Signature */
.j-close { text-align: center; padding-block: clamp(130px, 15vw, 200px); background: radial-gradient(60% 60% at 50% 40%, rgba(226,194,126,.1), transparent 70%), var(--obsidian); }
.j-close .container { display: flex; flex-direction: column; align-items: center; opacity: 0; transform: translateY(16px); transition: opacity 900ms ease, transform 900ms var(--ease); }
.j-close.on .container { opacity: 1; transform: none; }
.j-close .sig { width: min(340px, 70vw); height: auto; margin-bottom: 48px; }
.j-close .lede { margin: 22px auto 40px; }

@media (max-width: 980px) {
  .j-cards { grid-template-columns: 1fr; }
  .j-card { min-height: 0; }
  .j-loop ol { grid-template-columns: 1fr; gap: 28px; }
  .j-loop .c { width: 2px; height: 36px; margin: 0 auto; transform: scaleY(0); transform-origin: top; }
  .j-method.on .j-loop .c { transform: scaleY(1); }
}
@media (max-width: 760px) {
  .j-mark { display: none; }
  .j-word { grid-template-columns: 1fr; justify-items: center; }
  .j-word .mesa, .j-word .den { align-items: center; text-align: center; transform: translateY(20px); }
  .j-word .join { width: 60px; height: 1px; margin: 22px 0; align-self: center; }
  .j-transforms li.r { margin-left: 0; text-align: left; align-items: flex-start; }
  .j-transforms li.r .old { align-self: flex-start; }
  .j-brief { grid-template-columns: 1fr; }
  .j-director .container { grid-template-columns: 1fr; }
  .j-director figure { max-width: 220px; }
  .j-field { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .j-word .half, .j-word .def, .j-name-close, .j-transforms li, .j-transforms .new, .j-card, .j-case, .j-close .container { opacity: 1 !important; transform: none !important; transition: none !important; }
  .j-transforms .old::after, .j-loop .c, .j-seam { transform: none !important; }
  .j-card .knot, .j-card .clear { stroke-dashoffset: 0; animation: none; }
  .j-card .blk { opacity: 1; transform: none; animation: none; }
}
.j-director img { height: auto; }
.j-transforms .old { line-height: 1.3; }
.j-transforms .old::after { top: calc(50% - 1px); }
.j-method { overflow: hidden; }
@media (max-width: 760px) { .j-loop .f1 { inset: -16px -6px; } .j-loop .f2 { inset: -28px -14px; } }
/* Solve/Build/Go: photographs */
.j-card .art { position: relative; aspect-ratio: 4/3; overflow: hidden; background: #0B0D0E; border-bottom: 1px solid rgba(226,194,126,.22); }
.j-card .art::before { content: ''; position: absolute; inset: 0; background: var(--img) center/cover no-repeat; transform: scale(1.04); transition: transform 1600ms var(--ease), filter 600ms ease; filter: saturate(.95) brightness(.92); }
.j-card .art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,13,14,0) 45%, rgba(11,13,14,.55) 80%, #0E1112 100%); }
.j-card:hover .art::before, .j-card:focus-visible .art::before { transform: scale(1.1); filter: saturate(1.05) brightness(1); }
.j-sbg.on .j-card .art::before { animation: jpan 14s ease-in-out infinite alternate; }
.j-sbg.on .j-card.build .art::before { animation-delay: -5s; } .j-sbg.on .j-card.go .art::before { animation-delay: -9s; }
@keyframes jpan { from { transform: scale(1.04) translate(0,0); } to { transform: scale(1.1) translate(-1.5%,-1%); } }
.j-card:hover .art::before { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .j-card .art::before { animation: none !important; } }

/* 03 — The method, scroll scene */
.m-scene { padding: 0 !important; text-align: left; background: radial-gradient(60% 55% at 72% 50%, rgba(226,194,126,.08), transparent 70%), var(--obsidian); }
.m-scene .j-tag { top: clamp(26px, 4vw, 48px); }
.m-track { height: 330vh; position: relative; }
.m-stick { position: sticky; top: 72px; height: calc(100vh - 72px); display: flex; align-items: center; overflow: hidden; }
.m-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 80px); align-items: center; width: 100%; }
.m-copy { position: relative; }
.m-copy h2 { margin: 0 0 clamp(32px, 4vw, 48px); max-width: 12em; }
.m-rail { position: absolute; left: 21px; top: 0; bottom: 0; width: 1px; background: rgba(226,194,126,.18); display: none; }
.m-steps { list-style: none; margin: 0; padding: 0; position: relative; display: grid; gap: 6px; }
.m-steps::before { content: ''; position: absolute; left: 21px; top: 12px; bottom: 12px; width: 1px; background: rgba(242,238,229,.14); }
.m-steps::after { content: ''; position: absolute; left: 21px; top: 12px; width: 1px; height: calc((100% - 24px) * var(--mp, 0)); background: linear-gradient(#E2C27E, #AC9568); }
.m-steps li { position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 18px; padding: 14px 0; opacity: .32; transition: opacity 600ms ease; }
.m-steps li .n { position: relative; z-index: 1; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(242,238,229,.25); border-radius: 50%; background: var(--obsidian); font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--ink-soft); transition: all 600ms var(--ease); }
.m-steps .w { display: block; font-weight: 800; font-size: clamp(26px, 3vw, 40px); line-height: 1.1; letter-spacing: .04em; text-transform: uppercase; color: var(--porcelain); margin-top: 4px; }
.m-steps p { margin: 0; max-height: 0; overflow: hidden; opacity: 0; font-size: 16px; line-height: 1.65; color: var(--ink-soft); max-width: 30em; transition: max-height 700ms var(--ease), opacity 500ms ease, margin 500ms ease; }
.m-steps li.on { opacity: 1; }
.m-steps li.on .n { border-color: #E2C27E; color: var(--obsidian); background: linear-gradient(180deg, #F3D99B, #C9A866); box-shadow: 0 0 0 6px rgba(226,194,126,.12), 0 0 24px rgba(226,194,126,.35); }
.m-steps li.on p { max-height: 160px; opacity: 1; margin-top: 10px; }
.m-steps li.done { opacity: .6; }
.m-steps li.done .n { border-color: rgba(226,194,126,.7); color: #E2C27E; }
.m-close { margin: clamp(28px, 3vw, 40px) 0 0 62px; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.6vw, 34px); color: #E2C27E; opacity: 0; transform: translateY(8px); transition: opacity 700ms ease, transform 700ms var(--ease); }
.m-stage[data-stage="2"] ~ * , .m-scene.fin .m-close { opacity: 1; transform: none; }

.m-stage { position: relative; aspect-ratio: 1; width: 100%; max-height: calc(100vh - 140px); margin-inline: auto; }
.m-svg { width: 100%; height: 100%; overflow: visible; }
.m-lines path { fill: none; stroke-width: 1.4; stroke-linecap: round; }
.m-stage[data-stage="2"] .m-lines path { stroke-dasharray: 3 9; animation: mflow 1.2s linear infinite; }
@keyframes mflow { to { stroke-dashoffset: -24; } }
.m-lens { opacity: 0; transition: opacity 500ms ease; }
.m-lens .ring { fill: none; stroke: #E2C27E; stroke-width: 1.2; }
.m-lens .r2 { stroke-opacity: .35; stroke-dasharray: 2 6; }
.m-lens .tick { stroke: #E2C27E; stroke-width: 1.2; }
.m-stage[data-stage="1"] .m-lens { opacity: 1; }
.m-node, .m-a { opacity: 0; transition: opacity 700ms ease; }
.m-stage[data-stage="2"] .m-node, .m-stage[data-stage="2"] .m-a { opacity: 1; }
.m-node .core { fill: #F3D99B; }
.m-node .halo { animation: mpulse 2.6s ease-in-out infinite; transform-origin: 452px 300px; transform-box: view-box; }
@keyframes mpulse { 0%,100% { transform: scale(.85); opacity: .7 } 50% { transform: scale(1.1); opacity: 1 } }
.m-lab { position: absolute; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(242,238,229,.6); white-space: nowrap; opacity: 0; transform: translateY(6px); transition: opacity 500ms ease, transform 500ms var(--ease); pointer-events: none; }
.m-lab.red { color: #E07A62; text-transform: none; letter-spacing: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 20px; }
.m-lab.gold { color: #F3D99B; }
.m-lab.dim { color: rgba(226,194,126,.55); font-size: 11px; }
.m-stage[data-stage="0"] .s0, .m-stage[data-stage="1"] .s1, .m-stage[data-stage="2"] .s2 { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .m-track { height: 300vh; }
  .m-stick { top: 60px; height: calc(100vh - 60px); height: calc(100svh - 60px); align-items: flex-start; padding-top: 18px; }
  .m-grid { grid-template-columns: 1fr; gap: 6px; }
  .m-copy h2 { font-size: 28px; margin-bottom: 12px; }
  .m-stage { order: -1; width: min(78vw, 42vh); }
  .m-steps li { padding: 6px 0; grid-template-columns: 36px 1fr; gap: 12px; }
  .m-steps li .n { width: 36px; height: 36px; font-size: 14px; }
  .m-steps::before, .m-steps::after { left: 17px; }
  .m-steps .w { font-size: 20px; }
  .m-steps p { font-size: 14.5px; }
  .m-steps li.on p { max-height: 140px; margin-top: 4px; }
  .m-close { margin-left: 48px; font-size: 22px; margin-top: 8px; }
  .m-lab { font-size: 10px; } .m-lab.red { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .m-track { height: auto; } .m-stick { position: relative; top: 0; height: auto; padding-block: 120px; }
  .m-steps li { opacity: 1; } .m-steps p { max-height: none; opacity: 1; margin-top: 8px; } .m-close { opacity: 1; transform: none; }
  .m-stage[data-stage="2"] .m-lines path { animation: none; }
}
.j-method.m-scene { overflow: visible; overflow-x: clip; }
/* The name: A at the same proportion as the official wordmark
   (apex rises ~1.4x the cap height, base sits on the baseline) */
.j-word .letters { align-items: baseline; }
.j-word .a-mark { height: .9em; margin: 0 0 0 .02em; display: inline-flex; align-items: flex-end; align-self: baseline; }
.j-word .a-mark img { height: 100%; width: auto; display: block; }
/* 06 — Director strip: boardroom backdrop */
.j-director { position: relative; overflow: hidden; background: #111314; padding-block: clamp(120px, 13vw, 170px); }
.j-director::before { content: ''; position: absolute; inset: -4%; background: url(/assets/img/director-bg.jpg) center 42%/cover no-repeat; transform: scale(1.02); }
.j-director.on::before { animation: jdbg 22s ease-in-out infinite alternate; }
@keyframes jdbg { to { transform: scale(1.08) translateX(-1.5%); } }
.j-director::after { content: ''; position: absolute; inset: 0; background:
  linear-gradient(90deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.72) 38%, rgba(11,13,14,.55) 62%, rgba(11,13,14,.78) 100%),
  linear-gradient(180deg, rgba(11,13,14,.55), rgba(11,13,14,0) 30%, rgba(11,13,14,0) 70%, rgba(11,13,14,.75)); }
.j-director > * { position: relative; z-index: 1; }
.j-director figure { box-shadow: 0 40px 80px -30px rgba(0,0,0,.8); }
.j-director .q { text-shadow: 0 2px 24px rgba(0,0,0,.5); }
@media (prefers-reduced-motion: reduce) { .j-director::before { animation: none !important; } }
.j-director > .j-tag { position: absolute; z-index: 2; }
.j-director::before { background-position: center 60%; }
.j-director::after { background:
  linear-gradient(90deg, rgba(11,13,14,.9) 0%, rgba(11,13,14,.66) 38%, rgba(11,13,14,.48) 62%, rgba(11,13,14,.74) 100%),
  linear-gradient(180deg, rgba(11,13,14,.6), rgba(11,13,14,0) 30%, rgba(11,13,14,0) 75%, rgba(11,13,14,.6)); }
.j-director { background: #0E1215; }
.j-director::after { background:
  linear-gradient(90deg, rgba(9,12,15,.9) 0%, rgba(9,12,15,.62) 38%, rgba(9,12,15,.46) 62%, rgba(9,12,15,.72) 100%),
  linear-gradient(180deg, rgba(9,12,15,.6), rgba(9,12,15,0) 30%, rgba(9,12,15,0) 75%, rgba(9,12,15,.6)); }
.j-director figure { outline-color: rgba(226,194,126,.55); }
.j-director { background: #111314; }
.j-director::after { background:
  linear-gradient(90deg, rgba(11,13,14,.9) 0%, rgba(11,13,14,.64) 38%, rgba(11,13,14,.48) 62%, rgba(11,13,14,.74) 100%),
  linear-gradient(180deg, rgba(11,13,14,.6), rgba(11,13,14,0) 30%, rgba(11,13,14,0) 75%, rgba(11,13,14,.6)); }

/* =========================================================
   Readability pass (Home + About, desktop and phone)
   ========================================================= */
:root { --ink-soft: rgba(242,238,229,.8); --ink-faint: rgba(242,238,229,.6); --graphite-soft: rgba(40,42,43,.8); }
body { font-size: 17.5px; }
.lede { font-size: clamp(18px, 1.7vw, 21px); }
/* chapter labels and small captions */
.j-tag .t { font-size: 12.5px; opacity: .78; letter-spacing: .26em; }
.j-tag .n { font-size: 21px; }
.j-cue { font-size: 12px; color: rgba(242,238,229,.7); }
.section-tag { font-size: 15.5px; }
.resolve-caption { font-size: 15px; }
.cases-note, .cases.on-light .cases-note { font-size: 14.5px; color: rgba(40,42,43,.7); }
.replay { font-size: 13.5px; }
.m-label { font-size: 14px; }
/* name, insight, method */
.j-word .def { font-size: 17px; }
.j-name-close { font-size: clamp(23px, 2.5vw, 31px); }
.j-transforms .old { font-size: 16px; color: rgba(40,42,43,.55); }
.m-steps p { font-size: 17px; }
.m-lab { font-size: 13px; color: rgba(242,238,229,.75); }
.m-lab.dim { font-size: 12px; color: rgba(226,194,126,.75); }
/* solve / build / go cards */
.j-card .sit { font-size: 16.5px; }
.j-card li { font-size: 15.5px; }
.j-card .enter { font-size: 16px; }
/* cases */
.case-meta { font-size: 15.5px; }
.case-body h4, .j-brief h4 { font-size: 15px; }
.case-body p, .case-body li { font-size: 17px; line-height: 1.7; }
.j-brief .outcome { font-size: 19px; }
.j-more summary { font-size: 16px; }
.hud-log li { font-size: 15.5px; }
/* director strip: larger portrait */
.j-director .container { grid-template-columns: minmax(0, 340px) 1fr; max-width: 1080px; gap: clamp(40px, 6vw, 88px); }
.j-director .role, .j-director .text-link { font-size: 16px; }
.j-director .name { font-size: 18px; }
/* about */
.person-role { font-size: 16.5px; }
.person-bio p, .people-rows .person-bio p, .advisors .person-bio p { font-size: 17.5px; line-height: 1.75; }
.bio-facts dt { font-size: 13.5px; color: rgba(40,42,43,.75); letter-spacing: .02em; }
.bio-facts dd { font-size: 16.5px; }
.markers li { font-size: 15.5px; }
.credential { font-size: 15.5px; }
.bio-text p { font-size: 18.5px; }
@media (max-width: 760px) {
  body { font-size: 17px; }
  .j-tag .t { font-size: 11.5px; letter-spacing: .2em; }
  .m-lab { font-size: 11.5px; } .m-lab.dim { font-size: 11px; } .m-lab.red { font-size: 16px; }
  .m-steps p { font-size: 15.5px; }
  .j-word .def { font-size: 16.5px; }
  .case-body p, .case-body li { font-size: 16.5px; }
  .person-bio p, .people-rows .person-bio p, .advisors .person-bio p { font-size: 17px; }
  .bio-text p { font-size: 17.5px; }
  .j-director figure { max-width: 300px; }
  .j-director .q { font-size: 30px; }
}
@media (max-width: 860px) { .bio-grid { grid-template-columns: minmax(0, 1fr); } .bio-side { position: static; max-width: none; } }
@media (max-width: 760px) { .bio-side { outline-offset: 6px; margin-inline: 6px; } }

/* Team bios on phones: opening paragraph first, the rest on request */
.bio-more { display: none; }
@media (max-width: 760px) {
  .person-bio.clamp:not(.open) p:not(:first-child) { display: none; }
  .person-bio.clamp:not(.open) p:first-child { position: relative; margin-bottom: 0; }
  .bio-more { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 4px; padding: 11px 18px; background: none; cursor: pointer;
    font: 700 15px/1 var(--sans); color: #E2C27E; border: 1px solid rgba(226,194,126,.55); }
  .bio-more::after { content: '+'; font-size: 18px; line-height: 1; transition: transform 300ms ease; }
  .bio-more[aria-expanded="true"]::after { transform: rotate(45deg); }
  .advisors .bio-more { color: var(--gold-deep); border-color: rgba(122,99,56,.5); }
  .person { scroll-margin-top: 72px; }
}
/* Director's bio: read the full story */
.story-more { display: inline-flex; align-items: center; gap: 12px; margin: 8px 0 8px; padding: 13px 22px; background: none; cursor: pointer;
  font: 700 15.5px/1 var(--sans); color: var(--gold-deep); border: 1px solid rgba(122,99,56,.5); transition: border-color 300ms ease, background 300ms ease; }
.story-more::after { content: '+'; font-size: 19px; line-height: 1; transition: transform 300ms ease; }
.story-more[aria-expanded="true"]::after { transform: rotate(45deg); }
.story-more:hover { border-color: var(--gold-deep); background: rgba(226,194,126,.12); }
.bio-full:not([hidden]) { animation: storyIn 600ms var(--ease); }
@keyframes storyIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.bio-full + .story-more[aria-expanded="true"] { margin-top: 4px; }

/* Home — MESADEN People strip */
.j-people { position: relative; overflow: hidden; background: #F4EEE2; color: var(--graphite); padding-block: clamp(96px, 11vw, 150px); }
.jp-photo { position: absolute; inset: 0 0 0 46%; background: url(/assets/img/people/hands.jpg) 40% center/cover no-repeat; }
.jp-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #F4EEE2 0%, rgba(244,238,226,.85) 18%, rgba(244,238,226,0) 55%); }
.j-people .container { position: relative; z-index: 1; }
.jp-text { max-width: 560px; opacity: 0; transform: translateY(18px); transition: opacity 900ms ease, transform 900ms var(--ease); }
.j-people.on .jp-text { opacity: 1; transform: none; }
.jp-tag { display: inline-block; font-size: 15.5px; font-weight: 700; color: var(--gold-deep); margin-bottom: 18px; }
.j-people h2 { margin: 0; }
.j-people .lede { margin: 20px 0 30px; color: #3A3C3E; }
.jp-gens { list-style: none; margin: 0 0 32px; padding: 0; border-top: 1px solid rgba(40,42,43,.15); }
.jp-gens li { display: grid; grid-template-columns: 150px 1fr; gap: 18px; padding: 15px 0; border-bottom: 1px solid rgba(40,42,43,.15); align-items: baseline; }
.jp-gens .g { font-size: 14px; font-weight: 700; color: var(--gold-deep); }
.jp-gens .q { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.9vw, 24px); line-height: 1.3; color: var(--graphite); }
.j-people .text-link { color: var(--graphite); }
@media (max-width: 860px) {
  .j-people { padding-top: 0; }
  .jp-photo { position: relative; inset: auto; height: 300px; margin-bottom: 40px; background-position: 55% center; }
  .jp-photo::after { background: linear-gradient(180deg, rgba(244,238,226,0) 55%, #F4EEE2 100%); }
  .jp-gens li { grid-template-columns: 1fr; gap: 4px; }
}

/* People page */
.pp-hero { padding-block: clamp(80px, 9vw, 130px); background: radial-gradient(50% 60% at 80% 40%, rgba(226,194,126,.12), transparent 70%), var(--obsidian); }
.pp-hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.pp-hero h1 { margin: 18px 0 0; max-width: 11em; }
.pp-hero .lede { margin-top: 28px; }
.pp-hero-photo { margin: 0; outline: 1px solid rgba(226,194,126,.45); outline-offset: 12px; }
.pp-hero-photo img { width: 100%; height: auto; aspect-ratio: 2/3; object-fit: cover; }
.pp-cards { margin-top: clamp(48px, 6vw, 72px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2vw, 28px); }
.pp-card { background: #FBF8F2; border: 1px solid rgba(122,99,56,.22); padding: clamp(28px, 3vw, 40px); box-shadow: 0 30px 60px -45px rgba(20,18,12,.4); }
.pp-card .idx { font-family: var(--serif); font-style: italic; font-size: 19px; color: var(--gold-deep); }
.pp-card h3 { margin: 8px 0 0; font-size: 15px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--graphite); }
.pp-card .q { margin: 14px 0 0; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.22; color: var(--graphite); }
.pp-card p:not(.q) { margin: 18px 0 0; font-size: 17px; line-height: 1.7; color: #3A3C3E; }
.pp-approach-grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.pp-hands { margin: 0; }
.pp-hands img { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; }
.pp-approach h2 { margin: 16px 0 24px; }
.pp-approach p { font-size: 18px; line-height: 1.75; color: var(--ink-soft); margin: 0 0 18px; max-width: 34em; }
.pp-approach .pp-note { margin-top: 28px; font-family: var(--serif); font-style: italic; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.3; color: #E2C27E; }
.pp-close .container { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.pp-close h2 { margin: 0; max-width: 22em; }
@media (max-width: 900px) {
  .pp-hero-grid, .pp-approach-grid, .pp-cards { grid-template-columns: 1fr; }
  .pp-hero-photo { max-width: 360px; }
}
/* People page: living beings */
.pp-living { background: #F6F1E7; }
.pp-living-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.pp-living h2 { margin: 16px 0 24px; max-width: 16em; }
.pp-living p { font-size: 18px; line-height: 1.75; color: #3A3C3E; margin: 0 0 18px; max-width: 34em; }
.pp-living-photo { margin: 0; outline: 1px solid rgba(122,99,56,.35); outline-offset: 12px; }
.pp-living-photo img { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; }
@media (max-width: 900px) { .pp-living-grid { grid-template-columns: 1fr; } }
/* Research status */
.jp-status, .pp-status { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 700; letter-spacing: .04em; }
.jp-status { margin: 0 0 18px; color: var(--gold-deep); display: flex; }
.pp-status { margin-left: 14px; padding: 5px 12px; border: 1px solid rgba(226,194,126,.45); color: #E2C27E; vertical-align: middle; }
.jp-status i, .pp-status i { width: 8px; height: 8px; border-radius: 50%; background: #C9A866; box-shadow: 0 0 0 0 rgba(201,168,102,.6); animation: jlive 2s ease-out infinite; }
@keyframes jlive { 70% { box-shadow: 0 0 0 9px rgba(201,168,102,0); } 100% { box-shadow: 0 0 0 0 rgba(201,168,102,0); } }
.pp-now-lede { font-size: 18.5px; line-height: 1.7; color: #3A3C3E; max-width: 36em; margin: 18px 0 0; }
.pp-track { list-style: none; margin: clamp(44px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; }
.pp-track::before { content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 1px; background: rgba(40,42,43,.18); }
.pp-track::after { content: ''; position: absolute; left: 0; width: 50%; top: 7px; height: 2px; background: linear-gradient(90deg, #AC9568, #E2C27E); }
.pp-track li { position: relative; padding: 34px 24px 0 0; }
.pp-track li::before { content: ''; position: absolute; left: 0; top: 0; width: 15px; height: 15px; border-radius: 50%; background: #F2EEE5; border: 1.5px solid rgba(40,42,43,.3); z-index: 1; }
.pp-track li.now::before { background: #E2C27E; border-color: #AC9568; box-shadow: 0 0 0 5px rgba(226,194,126,.25); }
.pp-track .st { font-size: 13px; font-weight: 700; color: rgba(40,42,43,.6); letter-spacing: .04em; }
.pp-track li.now .st { color: var(--gold-deep); }
.pp-track h3 { margin: 6px 0 8px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 26px; color: var(--graphite); }
.pp-track p { margin: 0; font-size: 16.5px; line-height: 1.65; color: #3A3C3E; }
.pp-close-note { margin: -8px 0 0; font-size: 18px; line-height: 1.65; color: #3A3C3E; max-width: 34em; }
@media (max-width: 860px) {
  .pp-track { grid-template-columns: 1fr; gap: 28px; padding-left: 28px; }
  .pp-track::before { left: 7px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; }
  .pp-track::after { left: 7px; top: 0; width: 2px; height: 46%; background: linear-gradient(#AC9568, #E2C27E); }
  .pp-track li { padding: 0; } .pp-track li::before { left: -28px; top: 4px; }
  .pp-status { margin: 10px 0 0; display: inline-flex; }
}
@media (prefers-reduced-motion: reduce) { .jp-status i, .pp-status i { animation: none; } }
/* living beings: its own dark chapter so it isn't lost between light bands */
.pp-living.on-dark { background: radial-gradient(55% 60% at 75% 50%, rgba(226,194,126,.1), transparent 70%), var(--obsidian); }
.pp-living.on-dark h2 { color: var(--porcelain); }
.pp-living.on-dark p { color: var(--ink-soft); }
.pp-living.on-dark .pp-living-photo { outline-color: rgba(226,194,126,.45); }
/* People: closing invitation over the sunset */
.pp-close.on-dark { position: relative; overflow: hidden; background: #0B0D0E; padding-block: clamp(130px, 15vw, 210px); }
.pp-close.on-dark::before { content: ''; position: absolute; inset: 0; background: url(/assets/img/people/invite.jpg) 62% 70%/cover no-repeat; }
.pp-close.on-dark::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,13,14,.9) 0%, rgba(11,13,14,.7) 40%, rgba(11,13,14,.2) 75%, rgba(11,13,14,.35) 100%), linear-gradient(180deg, rgba(11,13,14,.45), rgba(11,13,14,0) 35%); }
.pp-close.on-dark .container { position: relative; z-index: 1; }
.pp-close.on-dark h2 { color: var(--porcelain); max-width: 18em; }
.pp-close.on-dark .pp-close-note { color: var(--ink-soft); }
@media (max-width: 760px) { .pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,.85) 0%, rgba(11,13,14,.7) 55%, rgba(11,13,14,.3) 100%); } }
.pp-close.on-dark::before { background-position: right center; }
.pp-close.on-dark::after { background: linear-gradient(90deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.75) 38%, rgba(11,13,14,.15) 70%, rgba(11,13,14,.1) 100%); }
@media (max-width: 760px) { .pp-close.on-dark::before { background-position: 85% center; } .pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,.88) 0%, rgba(11,13,14,.72) 60%, rgba(11,13,14,.35) 100%); } }
.pp-close.on-dark h2 { max-width: 15em; }
.pp-close.on-dark::after { background: linear-gradient(90deg, rgba(11,13,14,.9) 0%, rgba(11,13,14,.7) 35%, rgba(11,13,14,.12) 62%, rgba(11,13,14,.05) 100%); }
/* invitation: centred over the sky, lantern scene below */
.pp-close.on-dark { padding-block: clamp(110px, 12vw, 160px) clamp(300px, 30vw, 440px); text-align: center; }
.pp-close.on-dark::before { background-position: center bottom; background-size: cover; }
.pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.72) 32%, rgba(11,13,14,.25) 60%, rgba(11,13,14,.1) 80%, rgba(11,13,14,.45) 100%); }
.pp-close.on-dark .container { align-items: center; }
.pp-close.on-dark h2 { max-width: 20em; margin-inline: auto; }
.pp-close.on-dark .pp-close-note { margin-inline: auto; }
@media (max-width: 760px) {
  .pp-close.on-dark { padding-bottom: 260px; }
  .pp-close.on-dark::before { background-position: 58% bottom; }
  .pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.75) 45%, rgba(11,13,14,.15) 75%, rgba(11,13,14,.4) 100%); }
}
.pp-close.on-dark { padding-block: clamp(100px, 10vw, 140px) clamp(420px, 40vw, 560px); }
.pp-close.on-dark::before { inset: 26% 0 0 0; background-position: center 70%; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 28%); mask-image: linear-gradient(180deg, transparent 0%, #000 28%); }
.pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,.2) 0%, rgba(11,13,14,0) 60%, rgba(11,13,14,.45) 100%); }
@media (max-width: 760px) {
  .pp-close.on-dark { padding-bottom: 340px; }
  .pp-close.on-dark::before { inset: 48% 0 0 0; background-position: 52% 65%; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%); mask-image: linear-gradient(180deg, transparent 0%, #000 22%); }
  .pp-close.on-dark::after { background: linear-gradient(180deg, rgba(11,13,14,0) 60%, rgba(11,13,14,.4) 100%); }
}

/* 05 — Where we are starting: three fronts, in motion */
.j-fronts { padding-block: clamp(120px, 14vw, 190px); background: radial-gradient(60% 50% at 50% 0%, rgba(226,194,126,.09), transparent 70%), var(--obsidian); overflow: hidden; }
.j-fronts h2 { margin: 0; max-width: 14em; }
.j-fronts .lede { margin: 24px 0 0; max-width: 38em; }
.f-grid { margin-top: clamp(56px, 7vw, 88px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2vw, 28px); }
.f-card { position: relative; display: flex; flex-direction: column; text-decoration: none; color: var(--porcelain); background: #101314; border: 1px solid rgba(226,194,126,.16); overflow: hidden;
  opacity: 0; transform: translateY(36px); transition: opacity 900ms ease, transform 900ms var(--ease), border-color 400ms ease, box-shadow 400ms ease; }
.j-fronts.on .f-card { opacity: 1; transform: none; }
.j-fronts.on .f-card:nth-child(2) { transition-delay: 150ms, 150ms, 0s, 0s; }
.j-fronts.on .f-card:nth-child(3) { transition-delay: 300ms, 300ms, 0s, 0s; }
.f-card:hover, .f-card:focus-visible { border-color: rgba(226,194,126,.65); box-shadow: 0 50px 90px -50px rgba(0,0,0,.9), 0 0 0 1px rgba(226,194,126,.2); transform: translateY(-8px); }
.f-stage { position: relative; aspect-ratio: 4/3.2; background: #07090A; border-bottom: 1px solid rgba(226,194,126,.16); overflow: hidden; }
.f-cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.f-status { position: absolute; top: 16px; left: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em;
  background: rgba(11,13,14,.7); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); border: 1px solid rgba(226,194,126,.4); color: #E2C27E; }
.f-status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.f-status.live i { animation: jlive 2s ease-out infinite; box-shadow: 0 0 0 0 rgba(226,194,126,.6); }
.f-status.emerging { color: #F3D99B; } .f-status.dev { color: rgba(242,238,229,.8); border-color: rgba(242,238,229,.3); }
.f-status.dev i { background: transparent; border: 1.5px solid currentColor; }
.f-body { display: flex; flex-direction: column; flex: 1; padding: clamp(24px, 2.4vw, 34px); }
.f-idx { font-family: var(--serif); font-style: italic; font-size: 19px; color: #E2C27E; }
.f-card h3 { margin: 6px 0 0; font-weight: 800; font-size: clamp(22px, 1.9vw, 27px); line-height: 1.18; letter-spacing: .01em; }
.f-card.talent h3 { font-family: 'Cormorant Garamond', var(--serif); font-weight: 600; font-size: clamp(25px, 2.2vw, 31px); letter-spacing: .02em; }
.f-line { margin: 14px 0 0; font-family: var(--serif); font-style: italic; font-size: 22px; line-height: 1.3; color: #F3D99B; }
.f-sit { margin: 14px 0 0; font-size: 16.5px; line-height: 1.65; color: var(--ink-soft); }
.f-go { margin-top: auto; padding-top: 26px; display: inline-flex; align-items: center; gap: 12px; font-weight: 700; font-size: 16px; color: #E2C27E; }
.f-go::after { content: ''; width: 34px; height: 1px; background: currentColor; transition: width 400ms var(--ease); }
.f-card:hover .f-go::after { width: 64px; }
@media (max-width: 980px) { .f-grid { grid-template-columns: 1fr; } .f-stage { aspect-ratio: 16/10; } }
@media (prefers-reduced-motion: reduce) { .f-card { opacity: 1 !important; transform: none !important; } .f-status.live i { animation: none; } }

/* =========================================================
   SOLVE — problem finder
   ========================================================= */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.sv-hero { padding-block: clamp(80px, 9vw, 130px); background: radial-gradient(55% 60% at 80% 20%, rgba(226,194,126,.12), transparent 70%), var(--obsidian); }
.sv-hero h1 { margin: 18px 0 0; }
.sv-hero .lede { margin-top: 22px; max-width: 36em; }
.sv-search { position: relative; margin-top: 36px; max-width: 760px; }
.sv-search input { width: 100%; padding: 22px 24px 22px 60px; font: 500 18px/1.3 var(--sans); color: var(--porcelain); background: rgba(242,238,229,.06); border: 1px solid rgba(226,194,126,.4); outline: none; transition: border-color 300ms ease, background 300ms ease; }
.sv-search input::placeholder { color: rgba(242,238,229,.45); }
.sv-search input:focus { border-color: #E2C27E; background: rgba(242,238,229,.09); }
.sv-search-ico { position: absolute; left: 22px; top: 50%; width: 18px; height: 18px; margin-top: -10px; border: 2px solid #E2C27E; border-radius: 50%; }
.sv-search-ico::after { content: ''; position: absolute; width: 8px; height: 2px; background: #E2C27E; right: -7px; bottom: -3px; transform: rotate(45deg); }
.sv-quick { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.sv-quick span { font-size: 14px; color: var(--ink-faint); margin-right: 4px; }
.sv-quick button { padding: 8px 14px; font: 600 14px/1 var(--sans); color: var(--porcelain); background: transparent; border: 1px solid rgba(242,238,229,.25); cursor: pointer; transition: border-color 200ms, color 200ms; }
.sv-quick button:hover { border-color: #E2C27E; color: #E2C27E; }
.sv-urgent { margin-top: 30px; display: inline-flex; align-items: center; gap: 12px; font-size: 15.5px; font-weight: 600; color: #F3D99B; text-decoration: none; border-bottom: 1px solid rgba(243,217,155,.35); padding-bottom: 4px; }
.sv-urgent i { width: 9px; height: 9px; border-radius: 50%; background: #E07A62; box-shadow: 0 0 0 0 rgba(224,122,98,.6); animation: svpulse 1.8s ease-out infinite; }
@keyframes svpulse { 70% { box-shadow: 0 0 0 10px rgba(224,122,98,0); } 100% { box-shadow: 0 0 0 0 rgba(224,122,98,0); } }

.sv-talk { padding-block: clamp(96px, 11vw, 150px); }
.sv-talk h2 { margin: 0; max-width: 16em; }
.sv-promise { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 4vw, 56px); max-width: 1000px; }
.sv-promise p { margin: 0; font-size: 17.5px; line-height: 1.7; color: #3A3C3E; }
.sv-promise strong { display: block; color: var(--gold-deep); font-size: 15px; margin-bottom: 4px; }
.sv-themes { margin-top: clamp(40px, 5vw, 56px); display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid rgba(40,42,43,.15); }
.sv-themes button { padding: 12px 16px; font: 700 15px/1 var(--sans); color: rgba(40,42,43,.6); background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
.sv-themes button[aria-selected="true"] { color: var(--graphite); border-bottom-color: var(--gold-deep); }
.sv-problems { margin-top: 26px; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.sv-prob { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 150px; padding: 24px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.2); text-decoration: none; color: var(--graphite); transition: transform 300ms var(--ease), border-color 300ms, box-shadow 300ms; animation: svin 500ms var(--ease) both; }
.sv-prob:nth-child(2) { animation-delay: 40ms } .sv-prob:nth-child(3) { animation-delay: 80ms } .sv-prob:nth-child(4) { animation-delay: 120ms } .sv-prob:nth-child(5) { animation-delay: 160ms } .sv-prob:nth-child(6) { animation-delay: 200ms }
@keyframes svin { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.sv-prob:hover { transform: translateY(-4px); border-color: var(--gold-deep); box-shadow: 0 30px 50px -35px rgba(20,18,12,.45); }
.sv-prob .q { font-family: var(--serif); font-style: italic; font-size: 22px; line-height: 1.28; }
.sv-prob .go { font-size: 14.5px; font-weight: 700; color: var(--gold-deep); display: inline-flex; align-items: center; gap: 10px; }
.sv-prob .go::after { content: ''; width: 26px; height: 1px; background: currentColor; transition: width 300ms; }
.sv-prob:hover .go::after { width: 44px; }
.sv-prob.any { background: var(--graphite); color: var(--porcelain); border-color: var(--graphite); }
.sv-prob.any .go { color: #E2C27E; }
.sv-talk-note { margin: 22px 0 0; font-size: 14.5px; color: rgba(40,42,43,.7); max-width: 52em; }

.sv-finder { padding-block: clamp(96px, 11vw, 150px); }
.sv-finder h2 { margin: 0; }
.sv-lenses { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 8px; }
.sv-lenses button { padding: 14px 20px; font: 700 15.5px/1 var(--sans); color: var(--ink-soft); background: rgba(242,238,229,.04); border: 1px solid rgba(242,238,229,.18); cursor: pointer; transition: all 200ms; }
.sv-lenses button.lead { border-color: rgba(226,194,126,.45); }
.sv-lenses button[aria-selected="true"] { color: var(--obsidian); background: linear-gradient(180deg, #F3D99B, #C9A866); border-color: #C9A866; }
.sv-lenses b { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-left: 6px; border-radius: 50%; background: #E2C27E; color: var(--obsidian); font-size: 11px; }
.sv-lenses button[aria-selected="true"] b { background: var(--obsidian); color: #F3D99B; }
.sv-opts { margin-top: 22px; }
.sv-hint { margin: 0 0 12px; font-size: 14px; color: var(--ink-faint); }
.sv-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sv-chips button { padding: 10px 16px; font: 600 15px/1.2 var(--sans); color: var(--porcelain); background: transparent; border: 1px solid rgba(242,238,229,.22); cursor: pointer; transition: all 200ms; }
.sv-chips button:hover { border-color: #E2C27E; }
.sv-chips button[aria-pressed="true"] { border-color: #E2C27E; background: rgba(226,194,126,.14); color: #F3D99B; }
.sv-active { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-height: 10px; }
.sv-active .lbl { font-size: 14px; color: var(--ink-faint); margin-right: 4px; }
.sv-active button { padding: 7px 12px; font: 600 14px/1 var(--sans); color: var(--obsidian); background: #E2C27E; border: 0; cursor: pointer; }
.sv-active button.clear { background: none; color: var(--ink-soft); text-decoration: underline; }
.sv-region { margin-top: 32px; padding: clamp(24px, 3vw, 36px); border: 1px solid rgba(226,194,126,.35); background: linear-gradient(135deg, rgba(226,194,126,.08), rgba(226,194,126,.02)); }
.sv-region .tag { font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #E2C27E; }
.sv-region .cols { margin-top: 18px; display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(24px, 4vw, 56px); }
.sv-region h4 { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--ink-soft); }
.sv-region ul { list-style: none; margin: 0; padding: 0; }
.sv-region li { padding: 10px 0; border-top: 1px solid rgba(242,238,229,.1); display: flex; flex-direction: column; gap: 3px; }
.sv-region li span { font-size: 16px; color: var(--porcelain); }
.sv-region li em { font-style: normal; font-size: 13.5px; font-weight: 700; color: #E2C27E; }
.sv-results { margin-top: 36px; display: grid; gap: clamp(36px, 4vw, 52px); }
.sv-tier header { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(226,194,126,.3); }
.sv-tier h3 { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(26px, 2.6vw, 34px); }
.sv-tier header span { font-size: 14px; color: var(--ink-faint); text-align: right; }
.sv-cards { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.sv-card { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 22px 22px 20px; background: #111415; border: 1px solid rgba(242,238,229,.1); animation: svin 450ms var(--ease) both; transition: border-color 250ms, transform 250ms var(--ease); }
.sv-card:hover { border-color: rgba(226,194,126,.55); transform: translateY(-3px); }
.sv-card.spec { border-color: rgba(226,194,126,.35); }
.sv-card .fn { font-size: 12.5px; font-weight: 700; letter-spacing: .06em; color: #E2C27E; }
.sv-badge { position: absolute; top: 18px; right: 18px; font-size: 11.5px; font-weight: 700; color: var(--obsidian); background: #E2C27E; padding: 4px 8px; }
.sv-card h4 { margin: 2px 0 0; font-size: 18.5px; font-weight: 700; line-height: 1.3; color: var(--porcelain); padding-right: 0; }
.sv-card p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--ink-soft); flex: 1; }
.sv-card .go { margin-top: 8px; font-size: 14px; font-weight: 700; color: #E2C27E; text-decoration: none; }
.sv-card .go:hover { text-decoration: underline; }
.sv-tier.t-M h3::after { content: ' ↗'; color: #E2C27E; font-style: normal; font-size: .7em; }
.sv-none { margin-top: 36px; padding: 32px; border: 1px dashed rgba(226,194,126,.4); }
.sv-none p { margin: 0 0 18px; font-family: var(--serif); font-style: italic; font-size: 24px; }

.sv-fronts { padding-block: clamp(90px, 10vw, 130px); }
.sv-fronts h2 { margin: 0; }
.sv-front-grid { margin-top: 36px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.sv-front { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 34px; padding-top: 68px; background: var(--obsidian); color: var(--porcelain); text-decoration: none; border: 1px solid rgba(226,194,126,.2); transition: transform 300ms var(--ease), border-color 300ms; }
.sv-front:hover { transform: translateY(-5px); border-color: rgba(226,194,126,.6); }
.sv-front .f-status { top: 22px; left: 22px; }
.sv-front h3 { margin: 0; font-size: 26px; font-weight: 800; }
.sv-front.talent h3 { font-family: 'Cormorant Garamond', var(--serif); font-weight: 600; font-size: 30px; }
.sv-front p { margin: 0; font-size: 16.5px; line-height: 1.65; color: var(--ink-soft); }
.sv-front .f-go { padding-top: 10px; }
.sv-close { padding-block: clamp(100px, 11vw, 150px); text-align: center; }
.sv-close .container { display: flex; flex-direction: column; align-items: center; }
.sv-close h2 { margin: 0; max-width: 16em; }
.sv-close .lede { margin: 20px auto 34px; }
@media (max-width: 860px) {
  .sv-promise, .sv-region .cols, .sv-front-grid { grid-template-columns: 1fr; }
  .sv-lenses { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scrollbar-width: none; }
  .sv-lenses button { flex: none; }
  .sv-themes { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .sv-themes button { flex: none; }
  .sv-tier header { flex-direction: column; gap: 4px; }
  .sv-tier header span { text-align: left; }
}
@media (prefers-reduced-motion: reduce) { .sv-prob, .sv-card { animation: none; } .sv-urgent i { animation: none; } }
/* Solve: clarity pass */
.sv-doors { margin-top: 28px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 1060px; }
.door { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 22px 22px; text-decoration: none; color: var(--porcelain); background: rgba(242,238,229,.04); border: 1px solid rgba(226,194,126,.28); transition: border-color 250ms, background 250ms, transform 250ms var(--ease); }
.door:hover, .door:focus-visible { border-color: #E2C27E; background: rgba(226,194,126,.09); transform: translateY(-3px); }
.door .n { font-family: var(--serif); font-style: italic; font-size: 17px; color: #E2C27E; }
.door strong { font-size: 18.5px; font-weight: 800; }
.door em { font-style: normal; font-size: 14.5px; line-height: 1.5; color: var(--ink-soft); }
.door::after { content: '→'; position: absolute; right: 20px; top: 20px; color: #E2C27E; transition: transform 250ms; }
.door:hover::after { transform: translateX(4px); }
.sv-count { margin: 18px 0 0; font-size: 15px; font-weight: 700; color: #E2C27E; min-height: 1px; }
.sv-more { margin-top: 16px; padding: 12px 20px; font: 700 15px/1 var(--sans); color: #E2C27E; background: none; border: 1px solid rgba(226,194,126,.5); cursor: pointer; }
.sv-more:hover { background: rgba(226,194,126,.1); }
.sv-more.all { display: block; margin: 22px auto 0; }
.sv-tier.t-F h3 { color: #F3D99B; }
.sv-lenses { position: sticky; top: 72px; z-index: 5; padding-block: 12px; background: linear-gradient(var(--obsidian) 80%, rgba(11,13,14,0)); }
.sv-prob { min-height: 128px; }
@media (max-width: 860px) {
  .sv-doors { grid-template-columns: 1fr; }
  .sv-lenses { top: 60px; }
  .sv-chips { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--gutter)); padding: 0 var(--gutter) 6px; scrollbar-width: none; }
  .sv-chips button { flex: none; }
}
.sv-qhint { display: inline-block; margin-top: 12px; font-size: 15px; font-weight: 700; color: #F3D99B; text-decoration: none; }
.sv-qhint:hover { text-decoration: underline; }
.sv-lenses { top: 76px; background: var(--obsidian); padding-block: 14px; margin-bottom: 0; box-shadow: 0 14px 18px -14px rgba(0,0,0,.9); }
.sv-finder .container { position: relative; }
@media (max-width: 860px) { .sv-lenses { top: 76px; } }

/* Contact: two-line conversation form */
.ct { padding-block: clamp(80px, 9vw, 130px); min-height: 70vh; background: radial-gradient(55% 60% at 85% 30%, rgba(226,194,126,.1), transparent 70%), var(--obsidian); }
.ct-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.ct-intro h1 { margin: 18px 0 0; }
.ct-intro .lede { margin-top: 22px; }
.ct-promise { list-style: none; margin: 30px 0 0; padding: 0; }
.ct-promise li { position: relative; padding: 12px 0 12px 22px; border-top: 1px solid rgba(242,238,229,.1); font-size: 16.5px; color: var(--ink-soft); }
.ct-promise li::before { content: ''; position: absolute; left: 0; top: 20px; width: 7px; height: 7px; background: #E2C27E; transform: rotate(45deg); }
.ct-form { padding: clamp(26px, 3vw, 40px); background: #111415; border: 1px solid rgba(226,194,126,.3); display: grid; gap: 18px; }
.ct-field { display: grid; gap: 8px; }
.ct-field span { font-size: 15px; font-weight: 700; color: var(--porcelain); }
.ct-field input, .ct-field textarea { width: 100%; padding: 14px 16px; font: 400 17px/1.5 var(--sans); color: var(--porcelain); background: rgba(242,238,229,.05); border: 1px solid rgba(242,238,229,.2); outline: none; resize: vertical; }
.ct-field input:focus, .ct-field textarea:focus { border-color: #E2C27E; }
.ct-field ::placeholder { color: rgba(242,238,229,.4); }
.ct-more summary { cursor: pointer; font-size: 15px; color: #E2C27E; }
.ct-more[open] summary { margin-bottom: 14px; }
.ct-more .ct-field + .ct-field { margin-top: 14px; }
.ct-check { display: flex; align-items: center; gap: 10px; font-size: 15.5px; color: var(--ink-soft); }
.ct-check input { width: 18px; height: 18px; accent-color: #C9A866; }
.ct-send { justify-self: start; padding-inline: 40px; }
.ct-send:disabled { opacity: .6; }
.ct-status { margin: 0; font-size: 15px; color: #F3D99B; min-height: 1em; }
.ct-status a, .ct-fine a { color: #E2C27E; }
.ct-fine { margin: 0; font-size: 13.5px; color: var(--ink-faint); }
.hp { position: absolute; left: -9999px; }
.ct-done h2 { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 34px; }
.ct-done p { margin: 12px 0 0; color: var(--ink-soft); }
@media (max-width: 860px) { .ct-grid { grid-template-columns: 1fr; } }

/* Solve: visual pass */
.sv-hero { position: relative; overflow: hidden; }
.sv-hero-cv { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.sv-hero .container { position: relative; z-index: 1; }
@media (max-width: 860px) { .sv-hero-cv { opacity: .35; } }
/* icons */
.sv-card .fn { display: inline-flex; align-items: center; gap: 8px; }
.sv-card .fn .ico { width: 20px; height: 20px; flex: none; color: #E2C27E; }
.sv-chips .ico { width: 17px; height: 17px; margin-right: 8px; vertical-align: -3px; color: #E2C27E; }
.sv-chips button { display: inline-flex; align-items: center; }
/* tier colours */
.sv-card { border-left-width: 3px; }
.sv-card.tier-E { border-left-color: #C9A866; }
.sv-card.tier-H { border-left-color: #E8A35A; }
.sv-card.tier-M { border-left-color: #7FC4D6; background: linear-gradient(135deg, rgba(127,196,214,.06), transparent 45%), #111415; }
.sv-card.tier-S { border-left-color: #8A6A3C; }
.sv-tier header h3::before { content: ''; display: inline-block; width: 10px; height: 10px; margin-right: 12px; vertical-align: middle; transform: rotate(45deg); background: #C9A866; }
.sv-tier.t-H header h3::before { background: #E8A35A; } .sv-tier.t-M header h3::before { background: #7FC4D6; } .sv-tier.t-S header h3::before { background: #8A6A3C; }
.sv-tier.t-F header h3::before { background: #F3D99B; }
.sv-tier.t-M h3::after { content: none; }
/* front photos */
.sv-front { padding: 0; overflow: hidden; }
.sv-front-img { display: block; aspect-ratio: 16/8; background: var(--img) center/cover no-repeat; position: relative; transition: transform 1200ms var(--ease); }
.sv-front-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,13,14,0) 45%, var(--obsidian) 100%); }
.sv-front:hover .sv-front-img { transform: scale(1.04); }
.sv-front .f-status { top: 18px; left: 18px; }
.sv-front h3, .sv-front p, .sv-front .f-go { margin-inline: 32px; }
.sv-front h3 { margin-top: -6px; position: relative; }
.sv-front .f-go { margin-bottom: 30px; }
/* warm paper texture on light Solve bands */
.sv-talk, .sv-fronts { position: relative; isolation: isolate; }
.sv-talk::before, .sv-fronts::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background: radial-gradient(50% 60% at 90% 0%, rgba(226,194,126,.18), transparent 70%),
    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='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .48 0 0 0 0 .39 0 0 0 0 .22 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
@media (max-width: 1100px) { .sv-hero-cv { display: none; } }
.f-sub { display: block; margin-top: 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(243,217,155,.8); }
.sv-front .f-sub { margin: -4px 32px 0; }
/* Solve: outcome-labelled cases */
.sv-outcomes { margin-top: clamp(36px, 5vw, 56px); display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sv-out { display: flex; flex-direction: column; gap: 10px; padding: 24px; text-decoration: none; background: #FBF8F2; border: 1px solid rgba(122,99,56,.22); border-top: 3px solid #C9A866; color: var(--graphite); transition: transform 300ms var(--ease), box-shadow 300ms; }
.sv-out:hover { transform: translateY(-4px); box-shadow: 0 30px 50px -35px rgba(20,18,12,.45); }
.sv-out .o { font-family: var(--serif); font-style: italic; font-size: 30px; line-height: 1.1; color: var(--graphite); }
.sv-out .w { font-size: 15.5px; line-height: 1.6; color: #3A3C3E; flex: 1; }
.sv-out .m { font-size: 13px; font-weight: 700; color: var(--gold-deep); }
.sv-out.live { border-top-color: #7FC4D6; }
@media (max-width: 980px) { .sv-outcomes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sv-outcomes { grid-template-columns: 1fr; } }

/* =========================================================
   BUILD — the most forward-looking page
   ========================================================= */
.bd-hero { position: relative; overflow: hidden; min-height: min(92vh, 900px); display: flex; align-items: center; padding-block: 100px; background: radial-gradient(45% 60% at 75% 50%, rgba(226,194,126,.09), transparent 70%), var(--obsidian); }
.bd-radar { position: absolute; inset: 0; width: 100%; height: 100%; }
.bd-hero .container { position: relative; z-index: 1; width: 100%; }
.bd-hero h1 { margin: 18px 0 0; max-width: 9em; }
.bd-hero .lede { margin-top: 24px; max-width: 30em; }
.bd-hero-legend { margin-top: 30px; display: flex; gap: 22px; font-size: 13px; font-weight: 700; color: var(--ink-soft); }
.bd-hero-legend span::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; }
.bd-hero-legend .now::before { background: #F3D99B; } .bd-hero-legend .y27::before { background: #E2C27E; opacity: .7; } .bd-hero-legend .y28::before { background: #7FC4D6; }
@media (max-width: 900px) { .bd-hero { align-items: flex-end; padding-top: 52vh; } .bd-radar { opacity: .7; } }

.bd-signal { padding-block: clamp(110px, 12vw, 160px); }
.bd-signal h2 { margin: 0; max-width: 14em; }
.bd-signal .lede { margin-top: 22px; }
.bd-ticker { margin: clamp(40px, 5vw, 60px) 0; overflow: hidden; border-block: 1px solid rgba(226,194,126,.2); padding: 16px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.bd-ticker-track { display: flex; gap: 56px; width: max-content; animation: bdtick 90s linear infinite; }
.bd-ticker-track span { white-space: nowrap; font-size: 15px; font-weight: 600; color: var(--ink-soft); }
.bd-ticker-track span::before { content: '◆'; color: #E2C27E; font-size: 9px; margin-right: 14px; vertical-align: 2px; }
@keyframes bdtick { to { transform: translateX(-50%); } }
.bd-themes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(226,194,126,.16); border: 1px solid rgba(226,194,126,.16); }
.bd-theme { position: relative; background: var(--obsidian); padding: 26px 24px 24px; display: flex; flex-direction: column; gap: 10px; transition: background 300ms; }
.bd-theme:hover { background: #121516; }
.bd-theme .i { font-family: var(--serif); font-style: italic; font-size: 18px; color: #E2C27E; }
.bd-theme .hz { position: absolute; top: 24px; right: 22px; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; padding: 3px 8px; border: 1px solid; }
.bd-theme .hz.h0 { color: #F3D99B; border-color: rgba(243,217,155,.5); } .bd-theme .hz.h1 { color: #E2C27E; border-color: rgba(226,194,126,.35); } .bd-theme .hz.h2 { color: #7FC4D6; border-color: rgba(127,196,214,.45); }
.bd-theme h3 { margin: 0; font-size: 19px; font-weight: 800; line-height: 1.25; color: var(--porcelain); }
.bd-theme p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-soft); flex: 1; }
.bd-theme .where { font-size: 12.5px; font-weight: 700; color: rgba(226,194,126,.85); }
.bd-src { margin: 22px 0 0; font-size: 13.5px; color: var(--ink-faint); max-width: 60em; }
.bd-src.dark { color: rgba(40,42,43,.6); }
@media (max-width: 1100px) { .bd-themes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .bd-themes { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; background: none; border: 0; margin-right: -24px; padding-right: 24px; scrollbar-width: none; }
  .bd-themes::-webkit-scrollbar { display: none; }
  .bd-theme { flex: 0 0 82%; scroll-snap-align: start; border: 1px solid rgba(226,194,126,.22); min-height: 260px; }
}

.bd-pipe { padding-block: clamp(110px, 12vw, 160px); position: relative; isolation: isolate; }
.bd-pipe::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .5; background: radial-gradient(50% 60% at 90% 0%, rgba(226,194,126,.18), transparent 70%); }
.bd-pipe h2 { margin: 0; }
.bd-pipe .lede { margin-top: 22px; }
.bd-stages { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 8px; }
.bd-stages button { padding: 12px 18px; font: 700 15px/1 var(--sans); color: var(--graphite); background: #FBF8F2; border: 1px solid rgba(40,42,43,.18); cursor: pointer; }
.bd-stages button b { display: inline-grid; place-items: center; min-width: 20px; height: 20px; margin-left: 6px; border-radius: 10px; font-size: 11.5px; background: rgba(40,42,43,.1); }
.bd-stages button[aria-selected="true"] { background: var(--graphite); color: var(--porcelain); border-color: var(--graphite); }
.bd-stages button[aria-selected="true"] b { background: #E2C27E; color: var(--obsidian); }
.bd-board { margin-top: 26px; display: grid; gap: 16px; }
.bd-board.all { grid-template-columns: repeat(4, 1fr); align-items: start; }
.bd-board.one .bd-col { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.bd-board.one .bd-col h3 { grid-column: 1 / -1; }
.bd-col h3 { margin: 0 0 12px; display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--graphite); padding-bottom: 12px; border-bottom: 2px solid; }
.bd-col h3 i { width: 9px; height: 9px; border-radius: 50%; }
.c-dep h3 { border-color: #C9A866; } .c-dep h3 i { background: #C9A866; box-shadow: 0 0 0 4px rgba(201,168,102,.2); animation: jlive 2s ease-out infinite; }
.c-bld h3 { border-color: #E8A35A; } .c-bld h3 i { background: #E8A35A; }
.c-lrn h3 { border-color: #7FC4D6; } .c-lrn h3 i { background: #7FC4D6; }
.c-nxt h3 { border-color: rgba(40,42,43,.35); } .c-nxt h3 i { background: transparent; border: 1.5px solid rgba(40,42,43,.5); }
.bd-item { margin-bottom: 12px; padding: 20px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.18); display: flex; flex-direction: column; gap: 8px; transition: transform 250ms var(--ease), box-shadow 250ms; }
.bd-board.one .bd-item { margin: 0; }
.bd-item:hover { transform: translateY(-3px); box-shadow: 0 26px 44px -32px rgba(20,18,12,.45); }
.bd-item .tag { align-self: flex-start; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; color: var(--gold-deep); padding: 3px 8px; background: rgba(226,194,126,.18); }
.c-lrn .bd-item .tag { color: #2E6E80; background: rgba(127,196,214,.2); } .c-nxt .bd-item .tag { color: rgba(40,42,43,.7); background: rgba(40,42,43,.07); }
.bd-item h4 { margin: 2px 0 0; font-size: 17.5px; font-weight: 800; line-height: 1.3; color: var(--graphite); }
.bd-item p { margin: 0; font-size: 15px; line-height: 1.6; color: #3A3C3E; }
.bd-item .th { font-size: 12.5px; font-weight: 700; color: rgba(40,42,43,.55); }
.bd-item a { font-size: 14px; font-weight: 700; color: var(--gold-deep); }
@media (max-width: 1100px) { .bd-board.all { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .bd-board.all { grid-template-columns: 1fr; } .bd-stages { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .bd-stages button { flex: none; } }

.bd-ready { padding-block: clamp(110px, 12vw, 160px); background: radial-gradient(50% 60% at 78% 50%, rgba(226,194,126,.1), transparent 70%), var(--obsidian); }
.bd-ready-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.bd-ready h2 { margin: 16px 0 0; max-width: 13em; }
.bd-ready .lede { margin-top: 20px; }
.f-status.in { position: static; margin-left: 12px; vertical-align: 2px; }
.bd-ready-try { margin: 30px 0 18px; font-family: var(--serif); font-style: italic; font-size: 22px; color: #F3D99B; }
.bd-pulse { display: grid; gap: 14px; }
.bd-dim { display: grid; gap: 8px; padding: 14px 0; border-top: 1px solid rgba(242,238,229,.1); }
.bd-dim .t b { display: block; font-size: 15.5px; font-weight: 800; color: var(--porcelain); }
.bd-dim .t em { font-style: normal; font-size: 15px; color: var(--ink-soft); }
.bd-dim input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; background: linear-gradient(90deg, #7A6338, #E2C27E); border-radius: 2px; outline: none; }
.bd-dim input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: #F3D99B; border: 3px solid var(--obsidian); box-shadow: 0 0 0 1px #E2C27E; cursor: pointer; }
.bd-dim input[type=range]::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; background: #F3D99B; border: 3px solid var(--obsidian); cursor: pointer; }
.bd-dim .ends { display: flex; justify-content: space-between; font-size: 12px; color: var(--ink-faint); } .bd-dim .ends i { font-style: normal; }
.bd-ready-out { position: sticky; top: 110px; padding: clamp(24px, 3vw, 36px); border: 1px solid rgba(226,194,126,.3); background: #0F1213; display: grid; gap: 18px; }
.bd-pulse-cv { width: 100%; aspect-ratio: 1; display: block; }
.bd-score { display: flex; align-items: baseline; gap: 12px; }
.bd-score .n { font-weight: 800; font-size: 56px; line-height: 1; color: var(--porcelain); }
.bd-score .l { font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #E2C27E; }
.bd-first h4 { margin: 0 0 6px; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); }
.bd-first p { margin: 0; font-size: 16.5px; line-height: 1.6; color: var(--porcelain); }
.bd-ready-cta { justify-self: start; }
.bd-fine { margin: 0; font-size: 13px; color: var(--ink-faint); }
@media (max-width: 900px) { .bd-ready-grid { grid-template-columns: 1fr; } .bd-ready-out { position: static; } }

.bd-corr { padding-block: clamp(110px, 12vw, 160px) clamp(80px, 9vw, 120px); overflow: hidden; }
.bd-corr h2 { margin: 0; max-width: 15em; }
.bd-corr .lede { margin-top: 22px; }
.bd-map-wrap { margin: clamp(30px, 4vw, 50px) auto 0; max-width: 1400px; padding-inline: var(--gutter); }
.bd-map { width: 100%; aspect-ratio: 2.4; display: block; }
.bd-corr-list { margin-top: 26px; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.bd-c { padding: 20px; border: 1px solid rgba(226,194,126,.2); background: rgba(242,238,229,.02); cursor: pointer; transition: border-color 250ms, background 250ms; }
.bd-c:hover { border-color: #E2C27E; background: rgba(226,194,126,.07); }
.bd-c h3 { margin: 0; font-size: 18px; font-weight: 800; color: var(--porcelain); }
.bd-c .s { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 800; letter-spacing: .06em; color: #F3D99B; }
.bd-c p { margin: 8px 0 0; font-size: 15px; line-height: 1.55; color: var(--ink-soft); }
@media (max-width: 700px) { .bd-map { aspect-ratio: 1.5; } }

.bd-horizon { padding-block: clamp(110px, 12vw, 160px); position: relative; isolation: isolate; }
.bd-horizon h2 { margin: 0; }
.bd-horizon .lede { margin-top: 22px; }
.bd-time ol { list-style: none; margin: clamp(44px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); position: relative; }
.bd-time ol::before { content: ''; position: absolute; left: 0; right: 0; top: 9px; height: 2px; background: linear-gradient(90deg, #7A6338, #E2C27E 60%, rgba(226,194,126,.2)); }
.bd-time li { position: relative; padding: 36px 16px 0 0; }
.bd-time li::before { content: ''; position: absolute; left: 0; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #F2EEE5; border: 2px solid #C9A866; }
.bd-time li:first-child::before { background: #E2C27E; box-shadow: 0 0 0 5px rgba(226,194,126,.25); }
.bd-time .d { font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--gold-deep); }
.bd-time h3 { margin: 8px 0 8px; font-size: 16px; font-weight: 800; line-height: 1.35; color: var(--graphite); }
.bd-time p { margin: 0; font-size: 14.5px; line-height: 1.55; color: #3A3C3E; }
.bd-time p b { color: var(--gold-deep); font-weight: 700; }
@media (max-width: 1100px) {
  .bd-time ol { grid-template-columns: 1fr; gap: 26px; padding-left: 30px; }
  .bd-time ol::before { left: 6px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: linear-gradient(#7A6338, #E2C27E 60%, rgba(226,194,126,.2)); }
  .bd-time li { padding: 0; } .bd-time li::before { left: -30px; top: 6px; }
}

.bd-loop { padding-block: clamp(110px, 12vw, 160px); }
.bd-loop h2 { margin: 0; max-width: 14em; }
.bd-loop-steps { list-style: none; margin: clamp(44px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; counter-reset: s; }
.bd-loop-steps li { position: relative; padding: 26px 22px; border: 1px solid rgba(226,194,126,.2); background: rgba(242,238,229,.02); }
.bd-loop-steps li:not(:last-child)::after { content: '→'; position: absolute; right: -14px; top: 50%; transform: translateY(-50%); color: #E2C27E; z-index: 1; background: var(--obsidian); padding: 2px 0; }
.bd-loop-steps .n { font-family: var(--serif); font-style: italic; font-size: 20px; color: #E2C27E; }
.bd-loop-steps h3 { margin: 10px 0 8px; font-size: 17px; font-weight: 800; }
.bd-loop-steps p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-soft); }
@media (max-width: 1000px) { .bd-loop-steps { grid-template-columns: 1fr; } .bd-loop-steps li:not(:last-child)::after { content: '↓'; right: auto; left: 24px; top: auto; bottom: -16px; transform: none; } }

.bd-close { text-align: center; padding-block: clamp(120px, 13vw, 180px); background: radial-gradient(55% 60% at 50% 30%, rgba(226,194,126,.1), transparent 70%), var(--obsidian); border-top: 1px solid rgba(226,194,126,.12); }
.bd-close .container { display: flex; flex-direction: column; align-items: center; }
.bd-close h2 { margin: 0; }
.bd-close .lede { margin: 20px auto 36px; }
.bd-close-ctas { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
@media (prefers-reduced-motion: reduce) { .bd-ticker-track { animation: none; } .c-dep h3 i { animation: none; } }
.bd-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.7) 42%, rgba(11,13,14,0) 62%); }
.bd-hero .container { z-index: 2; }
@media (max-width: 900px) { .bd-hero::after { background: linear-gradient(180deg, rgba(11,13,14,0) 30%, rgba(11,13,14,.85) 55%); } .bd-hero { padding-top: 46vh; } }
.bd-signal { overflow-x: clip; }

/* =========================================================
   BUILD — mission control (page-scoped: body.lab)
   ========================================================= */
.lab { --void: #05080A; --cy: #7FC4D6; --cy-rgb: 127,196,214; --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: var(--void); }
.lab .site-header { background: rgba(5,8,10,.82); border-bottom-color: rgba(127,196,214,.14); }
.lab .site-footer { background: var(--void); }
.lx-k { margin: 0 0 22px; font: 600 12.5px/1.4 var(--mono); letter-spacing: .18em; text-transform: uppercase; color: var(--cy); display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.lx-k .live { width: 7px; height: 7px; border-radius: 50%; background: var(--cy); box-shadow: 0 0 0 0 rgba(127,196,214,.6); animation: lxlive 2s ease-out infinite; }
@keyframes lxlive { 70% { box-shadow: 0 0 0 9px rgba(127,196,214,0); } 100% { box-shadow: 0 0 0 0 rgba(127,196,214,0); } }
.lx-chip { font: 600 11px/1 var(--mono); letter-spacing: .14em; padding: 5px 9px; border: 1px solid; }
.lx-chip.amber { color: #E8A35A; border-color: rgba(232,163,90,.5); }
.lx-h1 { margin: 0; font-family: var(--sans); font-weight: 800; text-transform: uppercase; font-size: clamp(46px, 7.4vw, 112px); line-height: .94; letter-spacing: -.012em; color: #F4F6F6; }
.lx-h2 { margin: 0; font-family: var(--sans); font-weight: 800; text-transform: uppercase; font-size: clamp(30px, 4.3vw, 60px); line-height: 1.02; letter-spacing: -.005em; color: #F4F6F6; max-width: 15em; }
.lx-lede { margin: 26px 0 0; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.65; color: rgba(232,238,240,.74); max-width: 34em; }
.lab .bd-src { color: rgba(232,238,240,.45); font-family: var(--mono); font-size: 12px; letter-spacing: .02em; line-height: 1.7; }

/* boot */
.lx-boot { position: fixed; inset: 0; z-index: 100; background: var(--void); display: grid; place-items: center; transition: opacity 800ms var(--ease), visibility 800ms; }
.lx-boot pre { margin: 0; min-width: 320px; font: 500 13.5px/1.9 var(--mono); color: var(--cy); white-space: pre; }
.lx-boot pre::after { content: '▌'; animation: lxblink 1s steps(1) infinite; }
@keyframes lxblink { 50% { opacity: 0; } }
.lx-boot.done { opacity: 0; visibility: hidden; }
html.booting { overflow: hidden; }

/* hero */
.lx-hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: radial-gradient(60% 70% at 70% 50%, rgba(127,196,214,.06), transparent 70%), var(--void); }
.lx-globe { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.lx-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(5,8,10,.9) 0%, rgba(5,8,10,.55) 38%, rgba(5,8,10,0) 58%); }
.lx-hero .container { position: relative; z-index: 2; width: 100%; padding-block: 110px 120px; }
.lx-hero .lx-h1 { font-size: clamp(46px, 6.6vw, 100px); }
.lx-hero .lx-lede { max-width: 30em; }
.lx-tele { margin: 48px 0 0; display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 0; border-top: 1px solid rgba(127,196,214,.2); max-width: 760px; }
.lx-tele div { padding: 16px 26px 0 0; margin-right: 26px; border-right: 1px solid rgba(127,196,214,.14); }
.lx-tele div:last-child { border-right: 0; }
.lx-tele dt { font: 600 10.5px/1.4 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: rgba(232,238,240,.55); max-width: 15em; }
.lx-tele dd { margin: 8px 0 0; font: 500 14px var(--mono); color: rgba(232,238,240,.7); white-space: nowrap; }
.lx-tele dd b { font: 700 30px/1 var(--mono); color: #F4F6F6; letter-spacing: -.02em; }
.lx-cue { position: absolute; z-index: 2; left: 50%; bottom: 28px; transform: translateX(-50%); display: grid; justify-items: center; gap: 10px; font: 600 10.5px var(--mono); letter-spacing: .3em; text-transform: uppercase; color: rgba(232,238,240,.5); text-decoration: none; }
.lx-cue i { width: 1px; height: 38px; background: linear-gradient(var(--cy), transparent); animation: lxcue 2.2s ease-in-out infinite; transform-origin: top; }
@keyframes lxcue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }
@media (max-width: 900px) {
  .lx-hero { align-items: flex-start; }
  .lx-hero::after { background: linear-gradient(180deg, rgba(5,8,10,.92) 0%, rgba(5,8,10,.7) 45%, rgba(5,8,10,0) 70%); }
  .lx-hero .container { padding-block: 64px 46vh; }
  .lx-tele { grid-template-columns: 1fr 1fr; row-gap: 16px; }
  .lx-tele div { margin-right: 0; padding-right: 14px; border-right: 0; }
  .lx-tele dd b { font-size: 24px; }
}

/* photo chapter bands */
.lx-band { position: relative; overflow: hidden; min-height: 82vh; display: flex; align-items: flex-end; padding-block: 140px clamp(60px, 7vw, 100px); background: var(--void); isolation: isolate; }
.lx-img { position: absolute; inset: 0; z-index: -1; background-size: cover; background-position: center; }
.lx-band .lx-img { animation: lxdrift 36s ease-in-out infinite alternate; }
@keyframes lxdrift { from { transform: scale(1.02); } to { transform: scale(1.1) translateY(-1.5%); } }
.lx-band::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5,8,10,.55) 0%, rgba(5,8,10,0) 28%, rgba(5,8,10,.35) 55%, var(--void) 100%), linear-gradient(90deg, rgba(5,8,10,.6), rgba(5,8,10,0) 60%); }
.lx-band .container { width: 100%; }

/* sections */
.lx-sec { position: relative; isolation: isolate; background: var(--void); color: #F4F6F6; padding-block: clamp(50px, 6vw, 80px) clamp(100px, 11vw, 150px); }
.lx-sec .lx-img { z-index: -1; }

/* 01 listening */
.lab .bd-signal { padding-top: 0; }
.lab .bd-ticker { margin-top: 0; border-color: rgba(127,196,214,.16); }
.lab .bd-ticker-track span { font: 500 13px var(--mono); letter-spacing: .04em; color: rgba(232,238,240,.66); }
.lab .bd-ticker-track span::before { content: '//'; color: var(--cy); font-size: 12px; vertical-align: 0; }
.lab .bd-themes { background: rgba(127,196,214,.12); border-color: rgba(127,196,214,.12); }
.lab .bd-theme { background: var(--void); }
.lab .bd-theme:hover { background: #0A1114; }
.lab .bd-theme .i { font: 600 12px var(--mono); letter-spacing: .12em; color: rgba(127,196,214,.85); }
.lab .bd-theme .hz { font-family: var(--mono); font-weight: 600; font-size: 10.5px; letter-spacing: .14em; }
.lab .bd-theme .hz.h0 { color: var(--cy); border-color: rgba(127,196,214,.55); background: rgba(127,196,214,.08); }
.lab .bd-theme .hz.h1 { color: #E2C27E; border-color: rgba(226,194,126,.4); }
.lab .bd-theme .hz.h2 { color: rgba(232,238,240,.6); border-color: rgba(232,238,240,.25); }
.lab .bd-theme h3 { color: #F4F6F6; }
.lab .bd-theme .where { color: rgba(127,196,214,.75); font-weight: 600; }
@media (max-width: 600px) { .lab .bd-theme { border-color: rgba(127,196,214,.2); } }

/* 02 manifest */
.lab .bd-pipe { padding-top: clamp(30px, 4vw, 50px); }
.lab .bd-pipe::before { display: none; }
.lab .bd-stages { margin-top: 0; }
.lab .bd-stages button { font: 600 12.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: rgba(232,238,240,.7); background: transparent; border-color: rgba(127,196,214,.22); }
.lab .bd-stages button b { background: rgba(127,196,214,.12); color: var(--cy); }
.lab .bd-stages button[aria-selected="true"] { background: var(--cy); color: var(--void); border-color: var(--cy); }
.lab .bd-stages button[aria-selected="true"] b { background: var(--void); color: var(--cy); }
.lab .bd-col h3 { font: 600 12.5px var(--mono); letter-spacing: .18em; color: #F4F6F6; border-bottom-width: 1px; }
.lab .c-dep h3 { border-color: var(--cy); } .lab .c-dep h3 i { background: var(--cy); animation: lxlive 2s ease-out infinite; box-shadow: none; }
.lab .c-bld h3 { border-color: #E8A35A; }
.lab .c-lrn h3 { border-color: rgba(232,238,240,.6); } .lab .c-lrn h3 i { background: rgba(232,238,240,.75); }
.lab .c-nxt h3 { border-color: rgba(232,238,240,.22); } .lab .c-nxt h3 i { border-color: rgba(232,238,240,.5); }
.lab .bd-item { background: #091013; border-color: rgba(127,196,214,.14); }
.lab .bd-item:hover { border-color: rgba(127,196,214,.45); box-shadow: 0 0 0 1px rgba(127,196,214,.12), 0 24px 50px -30px rgba(127,196,214,.25); }
.lab .bd-item .tag { font: 600 10.5px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cy); background: rgba(127,196,214,.1); }
.lab .c-bld .bd-item .tag { color: #E8A35A; background: rgba(232,163,90,.1); }
.lab .c-lrn .bd-item .tag { color: rgba(232,238,240,.85); background: rgba(232,238,240,.08); }
.lab .c-nxt .bd-item .tag { color: rgba(232,238,240,.6); background: rgba(232,238,240,.05); }
.lab .bd-item h4 { color: #F4F6F6; }
.lab .bd-item p { color: rgba(232,238,240,.72); }
.lab .bd-item .th { font: 500 11.5px var(--mono); color: rgba(232,238,240,.42); letter-spacing: .04em; }
.lab .bd-item a { color: var(--cy); }
.bd-item.redacted { border-style: dashed; }
.bd-item .rd { font: 600 14px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: rgba(232,238,240,.8); }
.bd-item .rd s { text-decoration: none; color: rgba(232,238,240,.85); letter-spacing: -.02em; }
.bd-item.redacted .th { color: #E8A35A; }

/* 03 systems check */
.lab .bd-ready { background: var(--void); padding-block: clamp(110px, 12vw, 160px); overflow: hidden; }
.lx-img.side { left: 46%; opacity: .5; -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%); mask-image: linear-gradient(90deg, transparent, #000 40%); background-position: center 30%; }
.lab .bd-ready-try { font-family: var(--mono); font-style: normal; font-size: 14px; letter-spacing: .04em; color: var(--cy); }
.lab .bd-dim { border-top-color: rgba(127,196,214,.12); }
.lab .bd-dim input[type=range] { background: linear-gradient(90deg, #22505C, var(--cy)); }
.lab .bd-dim input[type=range]::-webkit-slider-thumb { background: #E6F6FA; border-color: var(--void); box-shadow: 0 0 0 1px var(--cy), 0 0 14px rgba(127,196,214,.6); }
.lab .bd-dim input[type=range]::-moz-range-thumb { background: #E6F6FA; border-color: var(--void); }
.lab .bd-dim .ends { font-family: var(--mono); font-size: 11px; letter-spacing: .06em; }
.lab .bd-ready-out { background: rgba(5,10,12,.78); border-color: rgba(127,196,214,.3); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.lab .bd-score .n { font-family: var(--mono); font-weight: 700; }
.lab .bd-score .l, .lab .bd-first h4 { font-family: var(--mono); font-weight: 600; color: var(--cy); }
@media (max-width: 900px) { .lx-img.side { left: 0; opacity: .22; -webkit-mask-image: linear-gradient(180deg, #000, transparent 50%); mask-image: linear-gradient(180deg, #000, transparent 50%); } }

/* 04 flight paths */
.lab .bd-corr { padding-top: 10px; }
.lab .bd-c { border-color: rgba(127,196,214,.16); background: #081013; }
.lab .bd-c:hover { border-color: var(--cy); background: rgba(127,196,214,.06); }
.lab .bd-c .s { font: 600 11px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cy); }

/* 05 launch window */
.lab .bd-horizon { padding-block: clamp(110px, 12vw, 160px) clamp(120px, 12vw, 180px); overflow: hidden; }
.lab .bd-time li { text-shadow: 0 1px 12px rgba(5,8,10,.85), 0 0 2px rgba(5,8,10,.6); }
.lx-img.bottom { background-position: center 58%; opacity: .95; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 55%); mask-image: linear-gradient(180deg, transparent 0%, #000 55%); }
.lab .bd-time ol::before { background: linear-gradient(90deg, var(--cy), rgba(127,196,214,.5) 60%, rgba(127,196,214,.1)); height: 1px; top: 10px; }
.lab .bd-time li::before { background: var(--void); border: 1.5px solid var(--cy); }
.lab .bd-time li:first-child::before { background: var(--cy); box-shadow: 0 0 0 5px rgba(127,196,214,.2); }
.lab .bd-time .d { font: 600 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cy); font-style: normal; }
.bd-time .tminus { display: inline-block; margin-left: 8px; font: 700 11px var(--mono); letter-spacing: .08em; color: var(--void); background: #E8A35A; padding: 3px 6px; }
.lab .bd-time h3 { color: #F4F6F6; }
.lab .bd-time p { color: rgba(232,238,240,.7); }
.lab .bd-time p b { color: rgba(232,238,240,.5); font: 600 10.5px var(--mono); letter-spacing: .12em; text-transform: uppercase; display: block; margin-bottom: 3px; }
@media (max-width: 1100px) { .lab .bd-time ol::before { background: linear-gradient(var(--cy), rgba(127,196,214,.1)); width: 1px; height: auto; } .bd-time .tminus { margin: 6px 0 0; display: table; } }

/* 06 loop */
.lab .bd-loop { overflow: hidden; }
.lx-img.dim { opacity: .2; }
.lab .bd-loop-steps li { background: rgba(5,8,10,.72); border-color: rgba(127,196,214,.16); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lab .bd-loop-steps li::after { color: var(--cy) !important; background: var(--void) !important; }
.lab .bd-loop-steps .n { font: 600 12px var(--mono); letter-spacing: .14em; color: var(--cy); font-style: normal; }

/* close */
.lx-close { position: relative; isolation: isolate; overflow: hidden; min-height: 92vh; display: flex; align-items: center; background: var(--void); padding-block: 140px; }
.lx-close .lx-img { z-index: -1; background-position: 30% center; }
.lx-close::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,8,10,.85) 0%, rgba(5,8,10,.2) 60%, rgba(5,8,10,0)); }
.lx-close .container { width: 100%; }
.lx-close .bd-close-ctas { justify-content: flex-start; margin-top: 40px; }
.lab .btn-gold { background: #F4F6F6; color: var(--void); }
.lab .btn-gold:hover { background: var(--cy); }
.lab .btn-line { border-color: rgba(127,196,214,.5); color: #F4F6F6; }
.lab .btn-line:hover { border-color: var(--cy); color: var(--cy); }
.lx-credit { margin: 70px 0 0; font: 500 10.5px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: rgba(232,238,240,.35); }
@media (max-width: 700px) { .lx-close::after { background: linear-gradient(180deg, rgba(5,8,10,.3), rgba(5,8,10,.85)); } .lx-band { min-height: 64vh; } }
@media (prefers-reduced-motion: reduce) { .lx-band .lx-img, .lx-k .live, .lx-cue i { animation: none; } }

.lx-def { margin: 26px 0 0; font-size: clamp(18px, 1.7vw, 22px); line-height: 1.55; color: rgba(240,244,245,.9); max-width: 30em; }
.lx-now { margin-top: 28px; display: flex; flex-direction: column; gap: 8px; max-width: 520px; }
.lx-now a { display: flex; align-items: center; gap: 12px; padding: 11px 14px; text-decoration: none; color: #F4F6F6; font-size: 15px; font-weight: 600; border: 1px solid rgba(127,196,214,.18); background: rgba(5,8,10,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: border-color 200ms, background 200ms; }
.lx-now a:hover { border-color: var(--cy); background: rgba(127,196,214,.08); }
.lx-now b { font: 600 10.5px var(--mono); letter-spacing: .16em; text-transform: uppercase; min-width: 70px; color: rgba(232,238,240,.6); }
.lx-now i { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.lx-now .s-live { background: var(--cy); animation: lxlive 2s ease-out infinite; }
.lx-now .s-bld { background: #E8A35A; }
.lx-now .s-nxt { border: 1.5px solid rgba(232,238,240,.6); }
.lx-now a::after { content: '→'; margin-left: auto; color: var(--cy); opacity: .7; }
.lx-hero .lx-tele { margin-top: 36px; }
@media (max-width: 900px) { .lx-now a { font-size: 14px; } .lx-now b { min-width: 62px; } }

.lx-modes { padding-block: clamp(100px, 11vw, 150px); border-top: 1px solid rgba(127,196,214,.1); background: radial-gradient(50% 70% at 85% 60%, rgba(127,196,214,.07), transparent 70%), var(--void); }
.lx-mode-grid { margin-top: clamp(40px, 5vw, 60px); display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.lx-mode { position: relative; padding: clamp(28px, 3.4vw, 44px); border: 1px solid rgba(127,196,214,.18); background: #081013; display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.lx-mode.bespoke { border-color: rgba(226,194,126,.4); background: linear-gradient(160deg, rgba(226,194,126,.08), rgba(8,16,19,1) 55%); }
.lx-mode-k { font: 600 11px var(--mono); letter-spacing: .18em; text-transform: uppercase; color: var(--cy); }
.lx-mode.bespoke .lx-mode-k { color: #E2C27E; }
.lx-mode h3 { margin: 0; font-size: clamp(22px, 2.2vw, 28px); font-weight: 800; line-height: 1.2; color: #F4F6F6; max-width: 16em; }
.lx-mode p { margin: 0 0 8px; font-size: 16.5px; line-height: 1.65; color: rgba(232,238,240,.74); flex: 1; }
.lx-mode-link { font: 600 12px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cy); text-decoration: none; border-bottom: 1px solid rgba(127,196,214,.4); padding-bottom: 4px; }
.lx-mode-link::after { content: ' \2192'; }
.lab .lx-mode.bespoke .btn-gold { background: #E2C27E; color: var(--void); }
.lab .lx-mode.bespoke .btn-gold:hover { background: #F3D99B; }
.lx-close .bd-close-ctas .btn-gold { background: #E2C27E; }
@media (max-width: 800px) { .lx-mode-grid { grid-template-columns: 1fr; } }
.lx-now .s-ord { background: #E2C27E; }
.lx-now a.ord { border-color: rgba(226,194,126,.4); }
.lx-now a.ord b { color: #E2C27E; }
.lx-now a.ord::after { color: #E2C27E; }

/* =========================================================
   GO — The Grand Tour, on business (page-scoped: body.tour)
   ========================================================= */
.tour { --ivory: #F6F1E7; --sand: #EDE4D3; --sea: #1E3A4C; --sea-soft: #4F6B7B; --sun: #C9964A; --ink: #1F2224; background: var(--ivory); }
.tour .site-footer { background: var(--obsidian); }
.gt-k { margin: 0 0 22px; display: flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--sun); }
.gt-k .dot { width: 7px; height: 7px; border-radius: 50%; background: #E7B567; box-shadow: 0 0 0 0 rgba(231,181,103,.6); animation: gtpulse 2.2s ease-out infinite; }
@keyframes gtpulse { 70% { box-shadow: 0 0 0 10px rgba(231,181,103,0); } 100% { box-shadow: 0 0 0 0 rgba(231,181,103,0); } }
.gt-h1 { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(46px, 6.6vw, 98px); line-height: 1.02; letter-spacing: -.01em; max-width: 12em; }
.gt-h2 { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(34px, 4.6vw, 62px); line-height: 1.06; color: var(--ink); max-width: 15em; }
.gt-lede { margin: 24px 0 0; font-size: clamp(17px, 1.55vw, 20px); line-height: 1.65; max-width: 34em; }
.gt-note { margin: 28px 0 0; font-size: 14px; line-height: 1.6; color: var(--sea-soft); max-width: 60em; }
.gt-ctas { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 12px; }
.gt-btn { background: #E7C68A; color: #1A1A18; }
.gt-btn:hover { background: #F2D9A6; }
.gt-btn-line { border: 1px solid rgba(246,241,231,.6); color: #FFF8EC; }
.gt-btn-line:hover { border-color: #E7C68A; color: #F2D9A6; }

/* hero */
.gt-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; padding-block: 140px clamp(70px, 9vw, 120px); color: #FFF8EC; background: #2B2118; }
.gt-hero-img, .gt-who-img, .gt-season-img, .gt-corr-img, .gt-close-img { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; }
.gt-hero-img { background-position: 62% 60%; animation: gtdolly 40s ease-in-out infinite alternate; }
@keyframes gtdolly { from { transform: scale(1.03); } to { transform: scale(1.12) translateX(-1.5%); } }
.gt-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(28,20,12,.78) 0%, rgba(28,20,12,.35) 50%, rgba(28,20,12,0) 75%), linear-gradient(0deg, rgba(20,14,8,.65), rgba(20,14,8,0) 45%); }
.gt-hero .container { width: 100%; }
.gt-hero .gt-lede { color: rgba(255,248,236,.86); max-width: 31em; }
.gt-hero .gt-k { color: #F2D9A6; }
.gt-ticket { position: absolute; right: var(--gutter); bottom: clamp(70px, 9vw, 120px); display: grid; grid-template-columns: auto auto auto; gap: 14px 22px; align-items: center; padding: 20px 24px; background: rgba(246,241,231,.94); color: var(--ink); border-radius: 4px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); -webkit-mask: radial-gradient(circle 8px at 0 50%, transparent 98%, #000) , radial-gradient(circle 8px at 100% 50%, transparent 98%, #000); -webkit-mask-composite: source-in; mask: radial-gradient(circle 8px at 0 50%, transparent 98%, #000) intersect, radial-gradient(circle 8px at 100% 50%, transparent 98%, #000); }
.gt-ticket div { display: grid; gap: 3px; }
.gt-ticket i { font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--sea-soft); }
.gt-ticket b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 21px; color: var(--ink); }
.gt-ticket b.on { color: #2E7D5B; }
.gt-ticket .arrow { font-size: 18px; color: var(--sun); }
.gt-ticket .sep { grid-column: 1 / -1; border-top: 1px dashed rgba(31,34,36,.25); }
.gt-ticket div:nth-child(5) { grid-column: 1; } 
@media (max-width: 1100px) { .gt-ticket { position: relative; right: auto; bottom: auto; margin: 36px var(--gutter) 0; justify-self: start; } .gt-hero { flex-direction: column; align-items: stretch; justify-content: flex-end; } }

/* sections */
.gt-sec { position: relative; isolation: isolate; padding-block: clamp(100px, 11vw, 150px); color: var(--ink); }
.gt-jump { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 8px; }
.gt-jump a { padding: 10px 16px; font-size: 14px; font-weight: 700; color: var(--sea); text-decoration: none; border: 1px solid rgba(30,58,76,.22); border-radius: 999px; transition: background 200ms, color 200ms; }
.gt-jump a:hover { background: var(--sea); color: var(--ivory); }

/* six ways */
.gt-modes { margin-top: clamp(40px, 5vw, 60px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.gt-mode { display: flex; flex-direction: column; background: #FFFDF8; border: 1px solid rgba(122,99,56,.16); scroll-margin-top: 100px; transition: transform 300ms var(--ease), box-shadow 300ms; }
.gt-mode:hover { transform: translateY(-4px); box-shadow: 0 34px 60px -40px rgba(60,40,10,.5); }
.gt-mode-img { aspect-ratio: 4 / 3; background-size: cover; background-position: center; }
.m-explore .gt-mode-img { background-position: center 40%; }
.m-create .gt-mode-img { background-position: center 55%; }
.m-now .gt-mode-img { background-position: center 70%; }
.gt-mode-body { padding: 26px 26px 28px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.gt-no { font-size: 12px; font-weight: 800; letter-spacing: .18em; color: var(--sun); }
.gt-mode h3 { margin: 0; font-size: 22px; font-weight: 800; color: var(--ink); }
.gt-says { margin: 0; font-family: var(--serif); font-style: italic; font-size: 24px; line-height: 1.2; color: var(--sea); }
.gt-line { margin: 4px 0 0; font-size: 15.5px; line-height: 1.6; color: #45494C; }
.gt-mode ul { margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; flex: 1; }
.gt-mode li { position: relative; padding-left: 18px; font-size: 15px; line-height: 1.5; color: #2B2F31; }
.gt-mode li::before { content: ''; position: absolute; left: 0; top: .62em; width: 8px; height: 1px; background: var(--sun); }
.gt-send { margin-top: 14px; align-self: flex-start; font-size: 14px; font-weight: 800; color: var(--sea); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.gt-send::after { content: ' \2192'; }
.gt-mode.m-now { background: #14181B; border-color: #14181B; }
.gt-mode.m-now h3 { color: #FFF8EC; } .gt-mode.m-now .gt-says { color: #F2D9A6; } .gt-mode.m-now .gt-line, .gt-mode.m-now li { color: rgba(255,248,236,.8); } .gt-mode.m-now .gt-send { color: #F2D9A6; }
@media (max-width: 1050px) { .gt-modes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .gt-modes { grid-template-columns: 1fr; } }

/* who */
.gt-who { background: var(--sand); overflow: hidden; }
.gt-who-img { left: 58%; z-index: -1; -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%); opacity: .9; }
.gt-who-list { list-style: none; margin: clamp(40px, 5vw, 56px) 0 0; padding: 0; max-width: 680px; display: grid; gap: 0; }
.gt-who-list li { display: grid; grid-template-columns: 54px 1fr; column-gap: 10px; padding: 18px 0; border-top: 1px solid rgba(31,34,36,.14); }
.gt-who-list .n { grid-row: span 2; font-family: var(--serif); font-style: italic; font-size: 26px; color: var(--sun); }
.gt-who-list h3 { margin: 0; font-size: 18.5px; font-weight: 800; }
.gt-who-list p { margin: 4px 0 0; font-size: 15.5px; line-height: 1.55; color: #4A4E50; }
@media (max-width: 900px) { .gt-who-img { left: 0; opacity: .18; -webkit-mask-image: none; mask-image: none; } }

/* how */
.gt-how { background: var(--ivory); }
.gt-itin { list-style: none; margin: clamp(44px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
.gt-itin::before { content: ''; position: absolute; left: 0; right: 0; top: 7px; border-top: 1px dashed rgba(30,58,76,.35); }
.gt-itin li { position: relative; padding: 32px 18px 0 0; }
.gt-itin li::before { content: ''; position: absolute; left: 0; top: 0; width: 13px; height: 13px; border-radius: 50%; background: var(--ivory); border: 2px solid var(--sun); }
.gt-itin li:nth-child(2)::before { background: var(--sun); }
.gt-itin .t { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--sea-soft); }
.gt-itin h3 { margin: 6px 0 8px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 28px; color: var(--ink); }
.gt-itin p { margin: 0; font-size: 15px; line-height: 1.6; color: #45494C; }
.gt-fares { margin-top: clamp(50px, 6vw, 76px); display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.gt-fares article { position: relative; padding: 24px 22px 22px; background: #FFFDF8; border: 1px solid rgba(122,99,56,.18); border-top: 3px solid var(--sea); }
.gt-fares .cls { font-size: 11.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--sea); }
.gt-fares h3 { margin: 10px 0 8px; font-size: 18px; font-weight: 800; }
.gt-fares p { margin: 0; font-size: 15px; line-height: 1.55; color: #45494C; }
.gt-fares .hot { background: #14181B; border-color: #14181B; border-top-color: #E7B567; }
.gt-fares .hot .cls { color: #E7B567; } .gt-fares .hot h3 { color: #FFF8EC; } .gt-fares .hot p { color: rgba(255,248,236,.78); }
@media (max-width: 1000px) { .gt-itin { grid-template-columns: 1fr; gap: 24px; padding-left: 30px; } .gt-itin::before { left: 6px; right: auto; top: 0; bottom: 0; border-top: 0; border-left: 1px dashed rgba(30,58,76,.35); } .gt-itin li { padding: 0; } .gt-itin li::before { left: -30px; top: 4px; } .gt-fares { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .gt-fares { grid-template-columns: 1fr; } }

/* season */
.gt-season { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(100px, 11vw, 150px); }
.gt-season-img { background-position: center 30%; }
.gt-season::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(246,241,231,.97) 0%, rgba(246,241,231,.92) 52%, rgba(246,241,231,.25) 80%, rgba(246,241,231,0)); }
.gt-season-in { max-width: 720px; color: var(--ink); }
.gt-cal { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 34px; }
.gt-cal li { display: grid; grid-template-columns: 48px 1fr; gap: 10px; align-items: baseline; padding: 12px 0; border-top: 1px solid rgba(31,34,36,.14); }
.gt-cal b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 22px; color: var(--sun); }
.gt-cal span { font-size: 15px; font-weight: 600; line-height: 1.45; color: var(--ink); }
@media (max-width: 900px) { .gt-season::after { background: rgba(246,241,231,.9); } .gt-cal { grid-template-columns: 1fr; } }

/* corridors */
.gt-corr { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(110px, 13vw, 180px); color: #FFF8EC; background: #1C1A22; }
.gt-corr-img { background-position: center 40%; }
.gt-corr::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(18,16,22,.55), rgba(18,16,22,.35) 40%, rgba(18,16,22,.85)); }
.gt-corr .gt-h2 { color: #FFF8EC; }
.gt-corr .gt-k { color: #F2D9A6; }
.gt-route { display: block; width: 100%; height: auto; margin-top: 50px; overflow: visible; }
.gt-route path { fill: none; stroke: #E7C68A; stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.6s var(--ease); }
.gt-corr.in .gt-route path { stroke-dashoffset: 0; }
.gt-cities { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(8, 1fr); gap: 10px; }
.gt-cities li { display: grid; gap: 4px; padding-top: 14px; border-top: 1px solid rgba(255,248,236,.3); }
.gt-cities b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 24px; }
.gt-cities span { font-size: 12.5px; font-weight: 700; color: rgba(255,248,236,.72); }
@media (max-width: 900px) { .gt-cities { grid-template-columns: repeat(2, 1fr); row-gap: 18px; } .gt-route { display: none; } }

/* case band on tour page */
.tour .cases { background: var(--ivory); }

/* close */
.gt-close { position: relative; isolation: isolate; overflow: hidden; min-height: 88vh; display: flex; align-items: center; padding-block: 140px; color: #FFF8EC; background: #1A1C22; }
.gt-close-img { background-position: center 60%; }
.gt-close::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14,14,18,.8), rgba(14,14,18,.25) 65%); }
.gt-close .container { width: 100%; }
.gt-close .gt-k { color: #F2D9A6; }
.gt-close .gt-lede { color: rgba(255,248,236,.85); }
@media (prefers-reduced-motion: reduce) { .gt-hero-img { animation: none; } .gt-k .dot { animation: none; } .gt-route path { transition: none; stroke-dashoffset: 0; } }
.gt-hero .gt-h1 { font-size: clamp(44px, 5.6vw, 86px); max-width: 9.5em; text-shadow: 0 2px 30px rgba(20,14,8,.45); }
.gt-hero::after { background: linear-gradient(90deg, rgba(24,17,10,.86) 0%, rgba(24,17,10,.55) 42%, rgba(24,17,10,0) 68%), linear-gradient(0deg, rgba(20,14,8,.7), rgba(20,14,8,0) 45%); }
.gt-mode ul { align-content: start; }
@media (max-width: 900px) {
  .gt-hero-img { background-position: 70% 50%; }
  .gt-hero::after { background: linear-gradient(180deg, rgba(24,17,10,.35) 0%, rgba(24,17,10,.78) 38%, rgba(24,17,10,.9) 100%); }
  .gt-ticket { grid-template-columns: auto auto; margin-inline: 0; } .gt-ticket .arrow { display: none; }
}
@media (min-width: 1101px) { .gt-ticket-wrap { position: absolute; inset: auto 0 clamp(70px, 9vw, 120px); display: flex; justify-content: flex-end; pointer-events: none; } .gt-ticket-wrap .gt-ticket { position: static; pointer-events: auto; } }
@media (max-width: 1100px) { .gt-ticket-wrap .gt-ticket { margin: 36px 0 0; display: inline-grid; } }
.gt-def { color: #FFF8EC !important; font-size: clamp(18px, 1.7vw, 22px); max-width: 30em; }
.gt-chips { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 8px; max-width: 640px; }
.gt-chips a { padding: 9px 15px; font-size: 14px; font-weight: 700; color: #FFF8EC; text-decoration: none; border: 1px solid rgba(255,248,236,.4); border-radius: 999px; background: rgba(24,17,10,.35); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background 200ms, border-color 200ms; }
.gt-chips a:hover { background: rgba(231,198,138,.25); border-color: #E7C68A; }
.gt-chips a.now { border-color: #E7B567; color: #F2D9A6; }
.gt-chips a.now::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #E7B567; margin-right: 7px; vertical-align: 2px; }
.gt-hero .gt-ctas { margin-top: 30px; }

/* =========================================================
   THE OFFICE & CONTACT
   ========================================================= */
.of-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 88vh; display: flex; align-items: flex-end; padding-block: 140px clamp(70px, 8vw, 110px); color: var(--porcelain); background: var(--obsidian); }
.of-hero-img { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center 30%; }
.of-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11,13,14,.92) 0%, rgba(11,13,14,.7) 45%, rgba(11,13,14,.15) 80%), linear-gradient(0deg, rgba(11,13,14,.85), rgba(11,13,14,0) 50%); }
.of-hero .container { width: 100%; }
.of-hero h1 { margin: 0; }
.of-hero .lede { margin-top: 24px; color: rgba(242,238,229,.85); max-width: 32em; }
.of-doors { margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 340px)); gap: 14px; }
.of-door { position: relative; display: grid; gap: 6px; padding: 22px 54px 22px 22px; text-decoration: none; color: var(--porcelain); border: 1px solid rgba(172,149,104,.55); background: rgba(11,13,14,.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background 250ms, border-color 250ms; }
.of-door:hover { background: rgba(172,149,104,.18); border-color: #E2C27E; }
.of-door .k { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #E2C27E; }
.of-door b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 28px; }
.of-door i { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-style: normal; font-size: 22px; color: #E2C27E; }
.of-door.alt { border-color: rgba(242,238,229,.35); }
@media (max-width: 700px) { .of-doors { grid-template-columns: 1fr; } }
.ct h2 { margin: 0; }
#talk, #join, #office { scroll-margin-top: 76px; }

.jn { padding-block: clamp(100px, 11vw, 150px); background: var(--porcelain); color: var(--graphite); }
.jn .section-tag { color: var(--gold-deep); }
.jn h2 { margin: 0; max-width: 14em; }
.jn .lede { margin-top: 22px; color: var(--graphite-soft); }
.jn-clocks { list-style: none; margin: 44px 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid rgba(40,42,43,.16); }
.jn-clocks li { padding: 16px 12px 0 0; display: grid; gap: 4px; }
.jn-clocks b { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: rgba(40,42,43,.6); }
.jn-clocks span { font-family: var(--serif); font-style: italic; font-size: 34px; color: rgba(40,42,43,.45); }
.jn-clocks li.day span { color: var(--gold-deep); }
.jn-clocks li.day b::after { content: ' · working'; color: var(--gold-deep); letter-spacing: .06em; text-transform: none; font-weight: 700; }
.jn-clock-note { margin: 14px 0 0; font-size: 14px; color: rgba(40,42,43,.6); }
.jn-grid { margin-top: clamp(50px, 6vw, 80px); display: grid; grid-template-columns: 1fr minmax(0, 480px); gap: clamp(40px, 6vw, 90px); align-items: start; }
.jn-h { margin: 0 0 14px; font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-deep); }
.jn-h:not(:first-child) { margin-top: 40px; }
.jn-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.jn-list li { font-size: 16.5px; line-height: 1.6; color: #3A3C3E; }
.jn-list b { color: var(--graphite); }
.jn-ways { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.jn-ways li { padding: 18px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.2); display: grid; gap: 6px; }
.jn-ways b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 24px; color: var(--graphite); }
.jn-ways span { font-size: 14.5px; line-height: 1.5; color: #4A4C4E; }
.jn-who { margin: 0; font-size: 16.5px; line-height: 1.65; color: #3A3C3E; }
.jn-form { position: sticky; top: 100px; padding: clamp(24px, 3vw, 36px); background: var(--obsidian); color: var(--porcelain); display: grid; gap: 16px; }
.jn-form select { width: 100%; font: inherit; font-size: 16px; color: var(--porcelain); background: transparent; border: 0; border-bottom: 1px solid rgba(242,238,229,.3); padding: 10px 0; }
.jn-form select option { color: #111; }
.jn-status { margin: 0; font-size: 14px; color: #E2C27E; }
@media (max-width: 900px) { .jn-grid { grid-template-columns: 1fr; } .jn-form { position: static; } .jn-clocks { grid-template-columns: repeat(3, 1fr); row-gap: 14px; } .jn-ways { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .jn-clocks { grid-template-columns: repeat(2, 1fr); } .jn-clocks span { font-size: 28px; } }

.of { padding-block: clamp(100px, 11vw, 150px); }
.of h2 { margin: 0; }
.of-gallery { margin-top: clamp(40px, 5vw, 60px); display: grid; grid-template-columns: 1.15fr 1fr; grid-template-rows: auto auto; gap: 14px; }
.of-gallery figure { margin: 0; overflow: hidden; background: #111; }
.of-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.of-gallery figure:hover img { transform: scale(1.03); }
.of-a { grid-row: span 2; aspect-ratio: 936 / 717; }
.of-b { aspect-ratio: 16 / 9; } .of-c { aspect-ratio: 16 / 9; }
.of-info { margin-top: clamp(40px, 5vw, 60px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; border-top: 1px solid rgba(172,149,104,.3); padding-top: 30px; }
.of-info h3 { margin: 0 0 10px; font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #E2C27E; }
.of-info p { margin: 0 0 12px; font-size: 16px; line-height: 1.7; color: rgba(242,238,229,.85); }
.of-info a { color: var(--porcelain); }
@media (max-width: 900px) { .of-gallery { grid-template-columns: 1fr; } .of-a { grid-row: auto; } .of-info { grid-template-columns: 1fr; } }
.of-gallery { grid-template-rows: repeat(2, clamp(200px, 21vw, 300px)); }
.of-a, .of-b, .of-c { aspect-ratio: auto; height: 100%; }
.of-b img { object-position: 30% center; }
@media (max-width: 900px) { .of-gallery { grid-template-rows: none; } .of-a { aspect-ratio: 936/717; } .of-b, .of-c { aspect-ratio: 16/9; } }
/* office gallery v2: boardroom wide, plaque tall */
.of-gallery { grid-template-columns: 1.6fr 1fr; grid-template-rows: clamp(260px, 27vw, 400px) clamp(160px, 15vw, 220px); grid-template-areas: "a b" "c b"; }
.of-a { grid-area: a; grid-row: auto; } .of-b { grid-area: b; } .of-c { grid-area: c; }
.of-b img { object-position: center 40%; }
.of-gallery figure { position: relative; box-shadow: 0 40px 80px -50px rgba(0,0,0,.9); }
.of-gallery figure::after { content: ''; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(226,194,126,.18); }
@media (max-width: 900px) { .of-gallery { grid-template-columns: 1fr; grid-template-rows: none; grid-template-areas: "a" "b" "c"; } .of-a { aspect-ratio: 1240/548; } .of-b { aspect-ratio: 810/880; } .of-c { aspect-ratio: 1100/330; } }
.of-c img { object-position: center 15%; }

/* contact: what happens next */
.ct-next { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; counter-reset: n; }
.ct-next li { position: relative; padding: 16px 14px 0 0; border-top: 1px solid rgba(172,149,104,.45); display: grid; gap: 4px; counter-increment: n; }
.ct-next li::before { content: ''; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: #E2C27E; }
.ct-next b { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #E2C27E; }
.ct-next span { font-size: 15px; line-height: 1.45; color: rgba(242,238,229,.88); }
.ct-next + .ct-promise { margin-top: 26px; }
@media (max-width: 560px) { .ct-next { grid-template-columns: 1fr; gap: 14px; } }

/* legal pages */
.lg-hero { padding-block: clamp(110px, 12vw, 160px) clamp(50px, 6vw, 80px); }
.lg-hero h1 { margin: 0; }
.lg-upd { margin: 20px 0 0; font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #E2C27E; }
.lg { padding-block: clamp(60px, 7vw, 100px) clamp(100px, 11vw, 150px); }
.lg-grid { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: clamp(40px, 6vw, 90px); align-items: start; }
.lg-toc { position: sticky; top: 100px; }
.lg-toc p { margin: 0 0 12px; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-deep); }
.lg-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lg-toc a { font-size: 14.5px; color: var(--graphite-soft); text-decoration: none; }
.lg-toc a:hover { color: var(--gold-deep); }
.lg-sum { padding: 26px 28px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.22); border-left: 3px solid var(--gold); margin-bottom: 44px; }
.lg-sum h2 { margin: 0 0 12px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 28px; color: var(--graphite); }
.lg-sum ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.lg-sum li { font-size: 16.5px; line-height: 1.6; color: #2F3133; }
.lg-sec { scroll-margin-top: 96px; padding-top: 26px; margin-top: 26px; border-top: 1px solid rgba(40,42,43,.12); }
.lg-sec h2 { margin: 0 0 14px; font-size: 21px; font-weight: 800; color: var(--graphite); }
.lg-sec h3 { margin: 20px 0 8px; font-size: 15px; font-weight: 800; color: var(--gold-deep); }
.lg-sec p, .lg-sec li { font-size: 16.5px; line-height: 1.7; color: #3A3C3E; }
.lg-sec p { margin: 0 0 14px; }
.lg-sec ul { margin: 0 0 14px; padding-left: 20px; display: grid; gap: 6px; }
.lg-sec a, .lg-sum a { color: var(--gold-deep); }
.lg-sec table { width: 100%; border-collapse: collapse; margin: 6px 0 16px; font-size: 15px; }
.lg-sec th, .lg-sec td { text-align: left; vertical-align: top; padding: 12px 14px 12px 0; border-bottom: 1px solid rgba(40,42,43,.12); line-height: 1.55; color: #3A3C3E; }
.lg-sec th { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-deep); }
@media (max-width: 900px) { .lg-grid { grid-template-columns: 1fr; } .lg-toc { position: static; } .lg-toc ol { grid-template-columns: 1fr 1fr; } }
.jn-life { margin-top: clamp(44px, 5vw, 64px); display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.jn-life figure { margin: 0; overflow: hidden; aspect-ratio: 5 / 4; box-shadow: 0 30px 60px -40px rgba(40,30,10,.55); }
.jn-life img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.jn-life-cap { grid-column: 1 / -1; margin: 4px 0 0; font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--gold-deep); }
.of-a img { object-position: center 45%; }
@media (max-width: 600px) { .jn-life { grid-template-columns: 1fr; } }

/* Home method: plays in place, no scroll lock */
.m-track { height: auto !important; }
.m-stick { position: relative !important; top: 0 !important; height: auto !important; min-height: min(100vh, 900px); padding-block: clamp(110px, 12vw, 160px); }
@media (max-width: 760px) { .m-stick { min-height: 0; padding-block: 100px 80px; } }

/* Home 02: the insight, as a live rewrite */
.j-insight.in2 { padding-block: clamp(120px, 13vw, 180px); background: radial-gradient(55% 60% at 80% 40%, rgba(226,194,126,.09), transparent 70%), var(--obsidian); }
.in2 h2 { margin: 0; max-width: 13em; }
.in2-stage { margin-top: clamp(50px, 6vw, 80px); max-width: 1000px; }
.in2-cols { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; font-size: 12px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-faint); padding-bottom: 16px; border-bottom: 1px solid rgba(226,194,126,.25); }
.in2-list { list-style: none; margin: 0; padding: 0; position: relative; }
.in2-list li { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; align-items: baseline; padding: 30px 0; }
.in2-stage.live .in2-list { min-height: clamp(150px, 15vw, 190px); }
.in2-stage.live .in2-list li { position: absolute; inset: 0 0 auto 0; opacity: 0; transition: opacity 600ms ease; pointer-events: none; }
.in2-stage.live .in2-list li.on { opacity: 1; position: relative; }
.in2-stage.static .in2-list li { border-bottom: 1px solid rgba(242,238,229,.08); }
.in2 .ask { position: relative; justify-self: start; font-size: clamp(20px, 2.2vw, 28px); font-weight: 700; color: rgba(242,238,229,.75); }
.in2 .ask::after { content: ''; position: absolute; left: -4px; right: -4px; top: 55%; height: 3px; background: #E2C27E; transform: scaleX(0); transform-origin: left; transition: transform 700ms var(--ease); }
.in2 .real { font-family: var(--serif); font-style: italic; font-size: clamp(30px, 3.8vw, 52px); line-height: 1.12; color: #F3E3BF; opacity: 0; transform: translateY(10px); transition: opacity 800ms ease 200ms, transform 800ms var(--ease) 200ms; }
.in2-stage.live li.struck .ask { color: rgba(242,238,229,.4); }
.in2-stage.live li.struck .ask::after, .in2-stage.static .ask::after { transform: scaleX(1); }
.in2-stage.live li.struck .real, .in2-stage.static .real { opacity: 1; transform: none; }
.in2-dots { display: flex; gap: 10px; margin-top: 18px; }
.in2-dots button { width: 26px; height: 3px; padding: 0; border: 0; background: rgba(242,238,229,.2); cursor: pointer; transition: background 300ms, width 300ms; }
.in2-dots button.on { background: #E2C27E; width: 46px; }
.in2-close { margin: clamp(40px, 5vw, 60px) 0 0; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #E2C27E; }
@media (max-width: 760px) { .in2-cols { display: none; } .in2-list li { grid-template-columns: 1fr; gap: 14px; } .in2-stage.live .in2-list { min-height: 230px; } }
.j-insight.in2.on-light { background: radial-gradient(55% 60% at 85% 30%, rgba(226,194,126,.22), transparent 70%), var(--porcelain); }
.in2.on-light .in2-cols { color: rgba(40,42,43,.5); border-bottom-color: rgba(122,99,56,.3); }
.in2.on-light .ask { color: rgba(40,42,43,.8); }
.in2.on-light .in2-stage.live li.struck .ask, .in2.on-light li.struck .ask { color: rgba(40,42,43,.4); }
.in2.on-light .ask::after { background: var(--gold); }
.in2.on-light .real { color: var(--graphite); }
.in2.on-light .in2-dots button { background: rgba(40,42,43,.15); }
.in2.on-light .in2-dots button.on { background: var(--gold); }
.in2.on-light .in2-close { color: var(--gold-deep); }

/* About hero: framed, not edge-to-edge */
.about-hero { padding: clamp(28px, 4vw, 56px) var(--gutter) 0; }
.about-hero img { width: min(1040px, 100%); margin: 0 auto; box-shadow: 0 50px 90px -50px rgba(0,0,0,.9); outline: 1px solid rgba(226,194,126,.22); outline-offset: 10px; }
@media (max-width: 760px) { .about-hero { padding: 20px 16px 0; } .about-hero img { outline-offset: 6px; } }
.about-hero img { width: auto; max-width: min(900px, 100%); max-height: 74vh; }
.nav .nav-people { position: relative; margin-left: 6px; padding-left: clamp(18px, 2.4vw, 34px) !important; }
.nav .nav-people::before { content: ''; position: absolute; left: 0; top: 50%; width: 1px; height: 16px; transform: translateY(-50%); background: rgba(172,149,104,.45); }
@media (max-width: 960px) { .nav .nav-people { margin-left: 0; padding-left: 0 !important; } .nav .nav-people::before { display: none; } }

/* Team bios on every screen: opening paragraph first, full bio on request */
.person-bio.clamp:not(.open) p:not(:first-child) { display: none; }
.person-bio.clamp:not(.open) p:first-child { margin-bottom: 0; }
.bio-more { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 4px; padding: 11px 18px; background: none; cursor: pointer;
  font: 700 15px/1 var(--sans); color: #E2C27E; border: 1px solid rgba(226,194,126,.55); transition: background 200ms, color 200ms; }
.bio-more:hover { background: rgba(226,194,126,.12); }
.bio-more::after { content: '+'; font-size: 18px; line-height: 1; transition: transform 300ms ease; }
.bio-more[aria-expanded="true"]::after { transform: rotate(45deg); }
.advisors .bio-more { color: var(--gold-deep); border-color: rgba(122,99,56,.5); }
.person { scroll-margin-top: 90px; }

/* Home hero: caption centred under the A, larger */
.hero-art { align-items: flex-end; }
.hero-art .resolve { align-self: flex-end; }
.resolve-caption { width: 100%; max-width: 520px; align-self: flex-end; text-align: center; padding-left: 2.8%; margin-top: 10px;
  font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.8vw, 26px) !important; line-height: 1.3; color: rgba(242,238,229,.8); }

/* About intro: smaller headline under the banner */
.about-intro h1.h-xl { font-size: clamp(34px, 4.4vw, 60px); max-width: 17em; }
/* nav: never wrap; tighten on mid-size screens */
.nav a { white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1240px) {
  .nav { gap: 16px; } .nav a { font-size: 13.5px; } .brand img { width: 140px; }
  .nav .nav-people { padding-left: 16px !important; margin-left: 0; }
  .nav .nav-cta { padding: 9px 13px; }
}

/* Home 02: six placards */
.pc-grid { list-style: none; margin: clamp(48px, 6vw, 76px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pc { position: relative; display: flex; flex-direction: column; padding: 30px 28px 32px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.2); border-top: 3px solid var(--gold); box-shadow: 0 30px 60px -45px rgba(60,40,10,.45);
  opacity: 0; transform: translateY(18px); transition: opacity 700ms ease var(--d), transform 700ms var(--ease) var(--d), box-shadow 300ms; }
.pc.on, .pc.is-visible { opacity: 1; transform: none; }
.pc:hover { box-shadow: 0 40px 70px -40px rgba(60,40,10,.55); }
.pc-n { position: absolute; top: 22px; right: 24px; font-family: var(--serif); font-style: italic; font-size: 22px; color: rgba(122,99,56,.55); }
.pc-k { font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: rgba(40,42,43,.45); }
.pc-k.k2 { margin-top: 22px; padding-top: 18px; border-top: 1px dashed rgba(122,99,56,.35); color: var(--gold-deep); }
.pc-ask { position: relative; align-self: flex-start; margin-top: 8px; font-size: 19px; font-weight: 700; color: rgba(40,42,43,.5); }
.pc-ask::after { content: ''; position: absolute; left: -3px; right: -3px; top: 54%; height: 2px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 700ms var(--ease) calc(var(--d) + 500ms); }
.pc.on .pc-ask::after, .pc.is-visible .pc-ask::after { transform: scaleX(1); }
.pc-real { margin-top: 8px; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.1vw, 30px); line-height: 1.18; color: var(--graphite); }
@media (max-width: 1000px) { .pc-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .pc-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .pc { opacity: 1; transform: none; } .pc-ask::after { transform: scaleX(1); } }

/* Home hero: breathing room below the 00 tag */
.hero .container { padding-top: clamp(70px, 8vw, 110px); }
.hero h1 { font-size: clamp(44px, 6.2vw, 88px); }
.pc-lede { margin-top: 20px; color: var(--graphite-soft); }
.hero .container { padding-top: clamp(56px, 6vw, 84px); }
.hero h1 { font-size: clamp(42px, 5.5vw, 80px); }
.hero .lede { margin: 26px 0 36px; }

/* About hero: ambient stage behind the framed portrait */
.about-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(40px, 5vw, 72px); }
.about-hero::before { content: ''; position: absolute; inset: -40px; z-index: -2; background: url(/assets/img/about-ambient.jpg) center/cover; transform: scale(1.08); }
.about-hero::after { content: ''; display: block !important; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 70% at 50% 45%, rgba(226,194,126,.16), transparent 70%), linear-gradient(180deg, rgba(11,13,14,.25) 0%, rgba(11,13,14,0) 30%, rgba(11,13,14,.85) 100%); }
.about-hero img { position: relative; box-shadow: 0 60px 120px -40px rgba(0,0,0,.95), 0 0 0 1px rgba(226,194,126,.35); outline-color: rgba(226,194,126,.4); }
/* About: night skyline stage; portrait beside the bio */
.about-hero::before { background: url(/assets/img/about-ambient.jpg) center 62%/cover; transform: none; inset: 0; }
.about-hero::after { background: radial-gradient(55% 65% at 50% 50%, rgba(226,194,126,.10), transparent 70%), linear-gradient(180deg, rgba(11,13,14,.15) 0%, rgba(11,13,14,0) 35%, rgba(11,13,14,.9) 100%) !important; }
.bio-side .bio-portrait { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; margin-bottom: 26px; outline: 1px solid rgba(172,149,104,.55); outline-offset: 10px; box-shadow: 0 40px 80px -45px rgba(20,18,12,.7); }
/* About banner: let the portrait melt into the skyline */
.about-hero img { outline: none !important; box-shadow: none !important;
  -webkit-mask-image: radial-gradient(ellipse 72% 78% at 50% 46%, #000 62%, transparent 100%);
          mask-image: radial-gradient(ellipse 72% 78% at 50% 46%, #000 62%, transparent 100%); }
.about-hero img {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 8%, #000 86%, transparent 100%);
          mask-composite: intersect; }
.about-hero img {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4.5%, #000 95.5%, transparent 100%), linear-gradient(180deg, transparent 0, #000 4%, #000 92%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 4.5%, #000 95.5%, transparent 100%), linear-gradient(180deg, transparent 0, #000 4%, #000 92%, transparent 100%);
  filter: brightness(.94) contrast(1.03); }

/* About banner: hallmark frame (replaces the edge fade) */
.about-hero img { -webkit-mask-image: none !important; mask-image: none !important; filter: none; outline: none !important; box-shadow: none !important; max-width: 100%; max-height: 70vh; width: auto; margin: 0; display: block; }
.ah-frame { position: relative; width: fit-content; max-width: min(900px, 100%); margin: 0 auto; padding: 14px; background: linear-gradient(145deg, #1a1712, #0d0c0a); box-shadow: 0 70px 120px -50px rgba(0,0,0,.95), 0 0 0 1px rgba(226,194,126,.55), inset 0 0 0 1px rgba(226,194,126,.18); }
.ah-frame::before { content: ''; position: absolute; inset: 6px; border: 1px solid rgba(226,194,126,.35); pointer-events: none; }
.ah-c { position: absolute; width: 22px; height: 22px; border-color: #E2C27E; border-style: solid; border-width: 0; z-index: 2; }
.ah-c.tl { top: -7px; left: -7px; border-top-width: 2px; border-left-width: 2px; }
.ah-c.tr { top: -7px; right: -7px; border-top-width: 2px; border-right-width: 2px; }
.ah-c.bl { bottom: -7px; left: -7px; border-bottom-width: 2px; border-left-width: 2px; }
.ah-c.br { bottom: -7px; right: -7px; border-bottom-width: 2px; border-right-width: 2px; }
.ah-plate { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 16px 10px 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: #E2C27E; }
.ah-plate i { width: 5px; height: 5px; transform: rotate(45deg); background: #E2C27E; }
.ah-plate span:last-child { color: rgba(242,238,229,.7); }
@media (max-width: 760px) { .ah-frame { padding: 8px; } .ah-plate { flex-direction: column; gap: 6px; letter-spacing: .18em; font-size: 10.5px; } .ah-plate i { display: none; } .ah-c { width: 14px; height: 14px; } }
/* About banner: quiet version */
.ah-frame { padding: 0; background: none; box-shadow: 0 50px 100px -40px rgba(0,0,0,.9), 0 0 80px -20px rgba(226,194,126,.12); }
.ah-frame::before { inset: 0; border: 0; box-shadow: inset 0 0 0 1px rgba(242,238,229,.08); z-index: 1; }
.ah-frame img { max-height: 72vh; }
/* About hero: the room itself, edge to edge */
.about-hero.ah-stage { padding: 0 !important; overflow: hidden; background: #0d0f10; }
.about-hero.ah-stage::before { display: none !important; }
.about-hero.ah-stage::after { content: ''; display: block !important; position: absolute; inset: auto 0 0 0; height: 22%; z-index: 1; background: linear-gradient(180deg, rgba(11,13,14,0), var(--obsidian)) !important; pointer-events: none; }
.about-hero.ah-stage img { width: 100% !important; max-width: none !important; height: min(78vh, 50vw) !important; max-height: none !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: 50% 30% !important; margin: 0 !important; display: block; filter: none; -webkit-mask-image: none !important; mask-image: none !important; box-shadow: none !important; outline: none !important; }
@media (max-width: 760px) { .about-hero.ah-stage img { height: 62vw !important; object-position: 50% 20% !important; } }
.about-hero.ah-stage::after { height: 7% !important; }
.about-hero.ah-stage img { height: auto !important; aspect-ratio: 2 / 1 !important; max-height: 82vh !important; object-position: 50% 100% !important; }
@media (max-width: 760px) { .about-hero.ah-stage img { aspect-ratio: 2400 / 1794 !important; max-height: none !important; object-position: 50% 50% !important; } }
.bio-side .bio-portrait { outline: none; }
/* About stage: never crop; wider landscape */
@media (min-width: 761px) { .about-hero.ah-stage img { width: 100% !important; height: auto !important; aspect-ratio: 4800 / 1900 !important; max-height: none !important; object-fit: contain !important; } }
@media (min-width: 761px) { .about-hero.ah-stage img { aspect-ratio: 4800 / 1900 !important; } }

/* Director's bio: full story shown on desktop (the left panel is tall enough); toggle stays on phones */
@media (min-width: 861px) {
  #bio-full[hidden] { display: block !important; }
  .story-more { display: none !important; }
}
/* Office gallery: boardroom + tower */
.of-gallery { grid-template-columns: 1.75fr 1fr; grid-template-rows: clamp(300px, 32vw, 470px); grid-template-areas: "a b"; }
.of-b img { object-position: center 35%; }
@media (max-width: 900px) { .of-gallery { grid-template-columns: 1fr; grid-template-rows: none; grid-template-areas: "a" "b"; } .of-b { aspect-ratio: 4/3; } }

/* Home cases: introduction, reading guide and index */
.cs-guide { margin-top: clamp(34px, 4vw, 52px); display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.cs-how { padding: 26px 28px; background: #FBF8F2; border: 1px solid rgba(122,99,56,.2); border-left: 3px solid var(--gold); }
.cs-how-k { margin: 0 0 14px; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-deep); }
.cs-how ol { margin: 0; padding: 0; list-style: none; counter-reset: c; display: grid; gap: 12px; }
.cs-how li { counter-increment: c; display: grid; grid-template-columns: 30px 1fr; column-gap: 8px; }
.cs-how li::before { content: counter(c); grid-row: span 2; font-family: var(--serif); font-style: italic; font-size: 22px; line-height: 1; color: var(--gold); }
.cs-how b { font-size: 16px; color: var(--graphite); } .cs-how span { font-size: 15px; color: #4A4C4E; line-height: 1.5; }
.cs-index { display: grid; gap: 10px; }
.cs-index a { display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; padding: 16px 18px; text-decoration: none; border: 1px solid rgba(40,42,43,.14); background: rgba(255,255,255,.4); transition: border-color 200ms, background 200ms, transform 200ms; }
.cs-index a:hover { border-color: var(--gold); background: #FBF8F2; transform: translateX(4px); }
.cs-index span { grid-row: span 2; font-family: var(--serif); font-style: italic; font-size: 26px; color: var(--gold); line-height: 1; }
.cs-index b { font-size: 17px; color: var(--graphite); } .cs-index i { font-style: normal; font-size: 13px; font-weight: 700; color: rgba(40,42,43,.55); }
.cs-note { margin: 18px 0 0; font-size: 14px; color: rgba(40,42,43,.6); }
.j-case { scroll-margin-top: 90px; }
@media (max-width: 860px) { .cs-guide { grid-template-columns: 1fr; } }

/* Home: tighter rhythm between chapters */
.hero ~ section.j-name, .j-insight.in2, .j-sbg, .j-fronts, .home-cases, .j-people, .j-director, .j-close { padding-block: clamp(72px, 8vw, 112px) !important; }
.band.cases { padding-block: clamp(72px, 8vw, 112px); }
.m-stick { min-height: 0 !important; padding-block: clamp(72px, 8vw, 112px) !important; }
.pc-grid { margin-top: clamp(32px, 4vw, 52px); }
.in2-close { margin-top: clamp(28px, 3vw, 40px); }
#cases.band { padding-top: clamp(64px, 7vw, 100px) !important; padding-bottom: clamp(64px, 7vw, 100px) !important; }
/* cases: index full width; bold case headers */
.cs-index { margin-top: clamp(30px, 4vw, 48px); grid-template-columns: repeat(4, 1fr); }
.cs-index a { grid-template-columns: 1fr; row-gap: 6px; padding: 18px 20px; }
.cs-index span { grid-row: auto; }
@media (max-width: 1000px) { .cs-index { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .cs-index { grid-template-columns: 1fr; } }
.j-case-n { display: flex !important; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 20px !important; padding-bottom: 16px; border-bottom: 1px solid rgba(122,99,56,.25); font-style: normal !important; }
.j-case-n .k { font-size: 13px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-deep); }
.j-case-n .t { font-family: var(--sans); font-style: normal; font-weight: 800; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.15; color: var(--graphite); }
/* Build hero headline: more air between words */
.lx-h1 { word-spacing: .18em; letter-spacing: .005em; line-height: 1.02; }
.lx-h2 { word-spacing: .12em; }
.lx-hero .lx-def { max-width: 27em; text-shadow: 0 1px 14px rgba(5,8,10,.9); }

/* Team: larger section labels; perspective badges */
.about-page .section-tag, .office .section-tag, .advisors .section-tag, .risk-intel .section-tag, .board .section-tag,
section.band.office > .container > .section-tag, section.band.advisors > .container > .section-tag { font-size: clamp(15px, 1.3vw, 18px); font-weight: 800; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 18px; }
.person-badge { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 6px 12px; font-size: 11.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; border: 1px solid; }
.person-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.person-badge.em { color: #E2C27E; border-color: rgba(226,194,126,.45); background: rgba(226,194,126,.06); }
.person-badge.ej { color: var(--gold-deep); border-color: rgba(122,99,56,.45); background: rgba(172,149,104,.08); }

/* About banner: designation signature */
.ah-sign { position: relative; z-index: 2; margin: clamp(-46px, -3vw, -24px) 0 0; padding: 0 var(--gutter) clamp(26px, 3vw, 40px); display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.ah-sign .nm { font-family: var(--serif); font-style: italic; font-size: clamp(30px, 3vw, 44px); line-height: 1.1; color: #FFF6E2; }
.ah-sign .rl { display: inline-flex; align-items: center; gap: 14px; font-size: clamp(11.5px, 1vw, 13.5px); font-weight: 800; letter-spacing: .32em; text-transform: uppercase; color: #E2C27E; }
.ah-sign .rl::before, .ah-sign .rl::after { content: ''; width: clamp(28px, 4vw, 56px); height: 1px; background: linear-gradient(90deg, transparent, rgba(226,194,126,.8)); }
.ah-sign .rl::after { background: linear-gradient(90deg, rgba(226,194,126,.8), transparent); }
.ah-sign .rl i { width: 5px; height: 5px; transform: rotate(45deg); background: #E2C27E; }
@media (max-width: 760px) { .ah-sign { margin-top: 18px; } .ah-sign .rl { letter-spacing: .2em; gap: 10px; } }
/* Jasleen: Silicon Valley highlight */
.person-bio .hl { color: var(--gold-deep); font-weight: 700; background: linear-gradient(transparent 62%, rgba(226,194,126,.32) 62%); padding: 0 2px; }

/* Home hero on phones: A centred, caption shown */
@media (max-width: 860px) {
  .hero-art { align-items: center !important; }
  .hero-art .resolve { align-self: center !important; justify-self: center !important; margin: 0 auto; max-width: 220px; }
  .resolve-caption { display: block !important; align-self: center !important; text-align: center !important; padding-left: 0 !important; margin: 6px auto 8px !important; max-width: 300px; font-size: 19px !important; }
}
.ah-sign { margin-top: clamp(14px, 1.6vw, 24px) !important; padding-bottom: clamp(18px, 2vw, 30px); }
.about-hero.ah-stage + .about-intro { padding-top: clamp(30px, 4vw, 56px); }

/* Phone header: Team shortcut beside Menu */
.m-actions { display: none; }
@media (max-width: 960px) {
  .m-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
  .m-team { font: 700 14px var(--sans); color: var(--obsidian); background: linear-gradient(180deg, #E2C27E, #C9A866); padding: 10px 14px; text-decoration: none; border: 1px solid #C9A866; }
}