/* =========================================================
   Tomorrow & Co. — Design System
   Navy ink, one gold accent, warm paper. No gradients, no tints
   beyond the brand scale. Space Grotesk / Manrope / IBM Plex Mono.
   ========================================================= */

:root{
  /* ---- Brand color scale ---- */
  --navy-900:#0b1c3f;
  --navy-700:#1d3b7a;
  --gold-500:#f0bd5c;
  --gold-600:#cf9a35;
  --paper-50:#f6f3ee;
  --paper-100:#efe9dd;
  --paper-200:#e1d9c8;
  --warm-700:#5c5648;

  /* ---- Semantic tokens ---- */
  --bg:            var(--paper-50);
  --bg-alt:        var(--paper-100);
  --bg-inverse:    var(--navy-900);
  --ink:           var(--navy-900);
  --ink-soft:      var(--navy-700);
  --ink-muted:     var(--warm-700);
  --ink-inverse:   var(--paper-50);
  --ink-inverse-muted: #b9c2d6;
  --border:        var(--paper-200);
  --border-inverse: rgba(246,243,238,0.16);
  --accent:        var(--gold-500);
  --accent-strong: var(--gold-600);
  --focus-ring:    var(--navy-700);

  /* ---- Type ---- */
  --font-display: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-body:    'Manrope', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --fs-display: clamp(2.35rem, 1.4rem + 4.4vw, 4.6rem);
  --fs-h2:      clamp(1.85rem, 1.35rem + 2.2vw, 2.75rem);
  --fs-h3:      clamp(1.3rem, 1.1rem + 0.8vw, 1.6rem);
  --fs-lead:    clamp(1.05rem, 0.95rem + 0.4vw, 1.3rem);
  --fs-body:    1rem;
  --fs-small:   0.9rem;
  --fs-label:   0.75rem;
  --fs-stat:    clamp(2.5rem, 1.6rem + 3.6vw, 4rem);

  /* ---- Spacing ---- */
  --space-section: clamp(4.5rem, 3.6rem + 4vw, 8rem);
  --space-section-sm: clamp(3rem, 2.6rem + 2vw, 5rem);
  --gutter: clamp(1.25rem, 1rem + 2vw, 3rem);
  --container: 1200px;
  --measure: 62ch;

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --ease-standard: cubic-bezier(.4,0,.2,1);
  --dur-fast: 150ms;
  --dur-base: 240ms;
  --dur-slow: 420ms;
}

/* ---------------------------------------------------------
   Reset
   --------------------------------------------------------- */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
input, select, textarea{ font:inherit; color:inherit; }
svg{ display:block; }
svg.icon{ stroke:currentColor; fill:none; width:20px; height:20px; }

/* Never fully hide focus */
:focus-visible{
  outline:3px solid var(--focus-ring);
  outline-offset:3px;
  border-radius:4px;
}
.dark-ctx :focus-visible{ outline-color:var(--gold-500); }

.skip-link{
  position:absolute;
  left:1rem; top:-4rem;
  background:var(--navy-900);
  color:var(--paper-50);
  padding:.75rem 1.25rem;
  border-radius:var(--radius-sm);
  z-index:1000;
  transition:top var(--dur-base) var(--ease-standard);
  font-family:var(--font-mono);
  font-size:var(--fs-small);
}
.skip-link:focus{ top:1rem; }

/* ---------------------------------------------------------
   Type helpers
   --------------------------------------------------------- */
.eyebrow{
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-muted);
  display:inline-flex;
  align-items:center;
  gap:.6em;
  margin:0 0 1rem;
}
.eyebrow::before{
  content:"";
  width:1.4em;
  height:2px;
  background:var(--accent-strong);
  display:inline-block;
}
.dark-ctx .eyebrow{ color:var(--gold-500); }
.dark-ctx .eyebrow::before{ background:var(--gold-500); }

.h-display{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-display);
  line-height:1.04;
  letter-spacing:-0.01em;
  color:var(--ink);
  max-width:18ch;
}
.h2{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-h2);
  line-height:1.1;
  letter-spacing:-0.01em;
  color:var(--ink);
  max-width:20ch;
}
.h3{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-h3);
  line-height:1.25;
  color:var(--ink);
}
.dark-ctx .h-display, .dark-ctx .h2, .dark-ctx .h3{ color:var(--ink-inverse); }

.lead{
  font-size:var(--fs-lead);
  line-height:1.55;
  color:var(--ink-soft);
  max-width:var(--measure);
}
.dark-ctx .lead{ color:var(--ink-inverse-muted); }

.body-copy{ max-width:var(--measure); color:var(--ink-soft); }
.dark-ctx .body-copy{ color:var(--ink-inverse-muted); }

.small-print{ font-size:var(--fs-small); color:var(--ink-muted); }
.dark-ctx .small-print{ color:var(--ink-inverse-muted); }

.mono-label{
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  letter-spacing:.1em;
  text-transform:uppercase;
}

/* ---------------------------------------------------------
   Layout
   --------------------------------------------------------- */
.section{ padding:var(--space-section) 0; position:relative; }
.section-sm{ padding:var(--space-section-sm) 0; }
.section-alt{ background:var(--bg-alt); }
.dark-ctx{ background:var(--bg-inverse); }
.accent-ctx{ background:var(--gold-500); }

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

.section-head{
  max-width:44rem;
  margin-bottom:clamp(2rem, 1.6rem + 2vw, 3.5rem);
}
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head.center .eyebrow{ justify-content:center; }
.section-head.center .h2, .section-head.center .lead{ max-width:none; margin-inline:auto; }

.section-foot{
  margin-top:clamp(2rem, 1.6rem + 2vw, 3rem);
}

hr.rule{
  border:0;
  border-top:1px solid var(--border);
  margin:0;
}
.dark-ctx hr.rule{ border-top-color:var(--border-inverse); }

/* ---------------------------------------------------------
   Buttons
   --------------------------------------------------------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.55em;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1rem;
  padding:.95em 1.7em;
  border-radius:var(--radius-pill);
  cursor:pointer;
  transition:transform var(--dur-fast) var(--ease-standard), background-color var(--dur-base) var(--ease-standard), border-color var(--dur-base) var(--ease-standard), color var(--dur-base) var(--ease-standard);
  white-space:nowrap;
}
.btn:active{ transform:scale(.97); }
.btn .arrow{ width:.9em; height:.9em; flex:none; }

.btn-primary{
  background:var(--gold-500);
  color:var(--navy-900);
}
.btn-primary:hover{ background:var(--gold-600); }

.btn-outline{
  background:transparent;
  border:1.5px solid var(--navy-900);
  color:var(--navy-900);
}
.btn-outline:hover{ background:var(--navy-900); color:var(--paper-50); }

.dark-ctx .btn-outline{ border-color:var(--paper-50); color:var(--paper-50); }
.dark-ctx .btn-outline:hover{ background:var(--paper-50); color:var(--navy-900); }

.accent-ctx .btn-outline{ border-color:var(--navy-900); color:var(--navy-900); }
.accent-ctx .btn-outline:hover{ background:var(--navy-900); color:var(--gold-500); }

.btn-block{ width:100%; justify-content:center; }
.btn[disabled]{ opacity:.55; cursor:not-allowed; }

.link-arrow{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  font-family:var(--font-display);
  font-weight:700;
  color:var(--ink);
  border-bottom:1.5px solid var(--accent-strong);
  padding-bottom:.15em;
  transition:gap var(--dur-base) var(--ease-standard), color var(--dur-base) var(--ease-standard);
}
.link-arrow:hover{ gap:.75em; }
.link-arrow .arrow{ width:.85em; height:.85em; }
.dark-ctx .link-arrow{ color:var(--ink-inverse); border-color:var(--gold-500); }

.arrow{ stroke:var(--gold-500); fill:none; }
.btn-primary .arrow{ stroke:var(--navy-900); }

/* ---------------------------------------------------------
   Nav
   --------------------------------------------------------- */
.site-nav{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(246,243,238,0.92);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard);
}
.site-nav.is-scrolled{
  border-bottom-color:var(--border);
  box-shadow:0 8px 24px -20px rgba(11,28,63,0.4);
}
.nav-inner{
  max-width:var(--container);
  margin-inline:auto;
  padding:.85rem var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
}
.brand{ display:flex; align-items:center; }
.brand img{ height:44px; width:auto; }
.brand-text{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.1rem;
  color:var(--navy-900);
}

.nav-links{
  display:flex;
  align-items:center;
  gap:clamp(1.1rem, 1vw, 2rem);
}
.nav-links a{
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ink-soft);
  padding:.4rem .1rem;
  position:relative;
  transition:color var(--dur-base) var(--ease-standard);
}
.nav-links a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-2px;
  height:2px; background:var(--gold-600);
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--dur-base) var(--ease-standard);
}
.nav-links a:hover, .nav-links a.is-active{ color:var(--navy-900); }
.nav-links a:hover::after, .nav-links a.is-active::after{ transform:scaleX(1); }

.nav-cta{ display:flex; align-items:center; gap:1.25rem; }
.nav-cta .btn{ padding:.65em 1.35em; font-size:.85rem; }

.nav-toggle{
  display:none;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  cursor:pointer;
}
.nav-toggle svg{ width:22px; height:22px; }

.mobile-panel{
  display:none;
  position:fixed;
  inset:0;
  top:64px;
  background:var(--paper-50);
  z-index:99;
  padding:1.5rem var(--gutter) 2.5rem;
  overflow-y:auto;
}
.mobile-panel.is-open{ display:block; }
.mobile-panel .nav-links{ flex-direction:column; align-items:flex-start; gap:0; }
.mobile-panel .nav-links a{
  display:block;
  width:100%;
  padding:1rem 0;
  font-size:1rem;
  border-bottom:1px solid var(--border);
}
.mobile-panel .nav-cta{ margin-top:1.5rem; }

@media (max-width:920px){
  .nav-inner .nav-links, .nav-inner .nav-cta .link-arrow{ display:none; }
  .nav-cta .btn-primary{ display:inline-flex; }
  .nav-toggle{ display:inline-flex; }
}
.nav-cta .btn-primary span.short{ display:none; }
@media (max-width:560px){
  .nav-cta .btn-primary span.full{ display:none; }
  .nav-cta .btn-primary span.short{ display:inline; }
}

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.hero{ padding-top:clamp(3.5rem, 3rem + 3vw, 6rem); padding-bottom:var(--space-section); }
.hero-grid{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:clamp(2rem, 2vw, 4rem);
  align-items:center;
}
.hero-cta-row{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.25rem; }
.hero-credibility{
  display:flex; align-items:center; gap:.75rem;
  margin-top:2rem;
  color:var(--ink-muted);
}
.hero-credibility .dot{ width:5px; height:5px; border-radius:50%; background:var(--gold-600); flex:none; }

.hero-art{ position:relative; }
.hero-art svg{ width:100%; height:auto; }

@media (max-width:920px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-art{ max-width:22rem; margin-inline:auto; }
}

/* Hero copy: urgent-optimism line, reordered below the buttons on phones */
.hero-copy{ display:flex; flex-direction:column; }
.hero-copy .h-display{ max-width:14ch; }
.hero-urgent{
  margin-top:1.5rem;
  padding-left:1rem;
  border-left:3px solid var(--gold-500);
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(1rem, .95rem + .3vw, 1.15rem);
  line-height:1.45;
  color:var(--ink);
  max-width:44ch;
}
@media (max-width:640px){
  .hero{ padding-top:2rem; }
  .hero-art{ display:none; }
  .hero-copy .hero-cta-row{ order:3; margin-top:1.75rem; }
  .hero-copy .hero-urgent{ order:4; }
  .hero-cta-row .btn{ padding:.85em 1.35em; }
}

/* ---------------------------------------------------------
   Stat cards (Problem section)
   --------------------------------------------------------- */
.stat-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.5rem;
}
.stat-card{
  background:rgba(246,243,238,0.05);
  border:1px solid var(--border-inverse);
  border-radius:var(--radius-md);
  padding:clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
}
.stat-card .stat{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-stat);
  color:var(--gold-500);
  line-height:1;
  margin-bottom:.75rem;
}
.stat-card p{ color:var(--ink-inverse); font-size:var(--fs-lead); line-height:1.5; }
.stat-card cite{ display:block; margin-top:1rem; font-style:normal; }

.reframe-quote{
  max-width:52rem;
  margin:clamp(2.5rem,2rem + 2vw,4rem) auto 0;
  text-align:center;
  font-family:var(--font-display);
  font-size:var(--fs-h3);
  font-weight:500;
  color:var(--ink-inverse-muted);
  line-height:1.5;
}

@media (max-width:720px){
  .stat-grid{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Today -> 2040 carousel
   --------------------------------------------------------- */
.reframe-carousel{
  position:relative;
  max-width:920px;
  margin-inline:auto;
}
.carousel-viewport{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border);
}
.carousel-track{
  display:flex;
  transition:transform var(--dur-slow) var(--ease-standard);
}
.carousel-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
}
.carousel-slide img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:var(--paper-200);
}
.carousel-caption{
  position:absolute;
  left:0; right:0; bottom:0;
  display:flex;
  justify-content:space-between;
  gap:.85rem;
  padding:clamp(.75rem, .5rem + 1vw, 1.25rem);
}
.cap-now, .cap-future{
  flex:1 1 0;
  max-width:48%;
  padding:.8rem 1rem;
  border-radius:var(--radius-sm);
  backdrop-filter:blur(2px);
}
.cap-now{ background:rgba(239,233,221,0.94); }
.cap-future{ background:rgba(11,28,63,0.92); }
.cap-year{
  display:block;
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.1em;
  margin-bottom:.4rem;
}
.cap-now .cap-year{ color:var(--ink-muted); }
.cap-future .cap-year{ color:var(--gold-500); }
.cap-now p{ color:var(--ink); font-size:.88rem; line-height:1.4; }
.cap-future p{ color:var(--ink-inverse); font-size:.88rem; line-height:1.4; }

.carousel-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px; height:48px;
  border-radius:50%;
  background:rgba(11,28,63,0.85);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  z-index:2;
  transition:background-color var(--dur-base) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
}
.carousel-arrow:hover{ background:var(--navy-900); }
.carousel-arrow:active{ transform:translateY(-50%) scale(.94); }
.carousel-arrow svg{ width:20px; height:20px; stroke:var(--gold-500); }
.carousel-arrow.prev{ left:1rem; }
.carousel-arrow.prev svg{ transform:rotate(-135deg); }
.carousel-arrow.next{ right:1rem; }
.carousel-arrow.next svg{ transform:rotate(45deg); }

.carousel-dots{
  display:flex;
  justify-content:center;
  gap:.6rem;
  margin-top:1.5rem;
}
.carousel-dots button{
  width:9px; height:9px;
  border-radius:50%;
  border:1.5px solid var(--gold-600);
  background:transparent;
  cursor:pointer;
  padding:0;
  transition:background-color var(--dur-base) var(--ease-standard), width var(--dur-base) var(--ease-standard);
}
.carousel-dots button.is-active{
  background:var(--gold-600);
  width:22px;
  border-radius:5px;
}

@media (max-width:640px){
  .carousel-slide img{ aspect-ratio:3/4; }
  .carousel-caption{ flex-direction:column; gap:.5rem; }
  .cap-now, .cap-future{ max-width:100%; padding:.65rem .85rem; }
  .cap-now p, .cap-future p{ font-size:.82rem; }
  .carousel-arrow{ width:40px; height:40px; }
  .carousel-arrow.prev{ left:.5rem; }
  .carousel-arrow.next{ right:.5rem; }
}

/* ---------------------------------------------------------
   Feature grid (Why Tomorrow & Co.)
   --------------------------------------------------------- */
.feature-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:clamp(1.5rem, 1.2rem + 1.5vw, 2.75rem) clamp(1.5rem, 1.2rem + 1.5vw, 3rem);
}
.feature{ display:flex; gap:1.1rem; }
.feature .icon-wrap{
  flex:none;
  width:52px; height:52px;
  border-radius:var(--radius-sm);
  background:var(--navy-900);
  display:flex; align-items:center; justify-content:center;
}
.feature .icon-wrap svg{ width:26px; height:26px; stroke:var(--gold-500); }
.feature h3{ margin-bottom:.5rem; }
.feature p{ color:var(--ink-soft); font-size:.96rem; line-height:1.55; }

@media (max-width:720px){
  .feature-grid{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Methodology 2x2
   --------------------------------------------------------- */
.method-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.method-cell{ background:var(--bg); padding:clamp(1.75rem, 1.4rem + 1.5vw, 2.75rem); }
.method-cell .letter{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  border-radius:50%;
  background:var(--navy-900);
  color:var(--gold-500);
  font-family:var(--font-display); font-weight:700;
  margin-bottom:1.1rem;
}
.method-cell h3{ margin-bottom:.6rem; }
.method-cell p{ color:var(--ink-soft); font-size:.95rem; }

.method-note{
  margin-top:1.5rem;
  display:flex; gap:1rem; align-items:flex-start;
  padding:1.25rem 1.5rem;
  background:var(--paper-100);
  border-radius:var(--radius-md);
}
.method-note .letter{
  flex:none;
  width:36px; height:36px;
  border-radius:50%;
  background:var(--navy-900);
  color:var(--gold-500);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:.85rem;
}
.method-note p{ font-style:italic; color:var(--ink-soft); font-size:.95rem; }

@media (max-width:720px){
  .method-grid{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Program Pathway stepper
   --------------------------------------------------------- */
.pathway{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:.75rem;
  counter-reset:step;
}
.pathway-step{
  position:relative;
  padding-top:1.25rem;
}
.pathway-step::before{
  content:"";
  position:absolute; top:0; left:0; right:0;
  height:2px;
  background:var(--border-inverse);
}
.pathway-step.is-first::before{ left:50%; }
.pathway-step.is-last::before{ right:50%; }
.pathway-step .node{
  position:absolute; top:-9px; left:50%; transform:translateX(-50%);
  width:20px; height:20px; border-radius:50%;
  background:var(--gold-500);
  border:3px solid var(--navy-900);
}
.pathway-step .icon-circle{
  width:64px; height:64px;
  margin:1.5rem auto 1rem;
  border-radius:50%;
  border:1.5px solid var(--border-inverse);
  display:flex; align-items:center; justify-content:center;
}
.pathway-step .icon-circle svg{ width:28px; height:28px; stroke:var(--gold-500); }
.pathway-step .num{
  display:block; text-align:center;
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em;
  color:var(--gold-500); margin-bottom:.4rem;
}
.pathway-step h4{
  text-align:center;
  font-family:var(--font-display); font-weight:700; color:var(--ink-inverse);
  font-size:.95rem; margin-bottom:.4rem; line-height:1.3;
}
.pathway-step p{
  text-align:center; color:var(--ink-inverse-muted); font-size:.82rem; line-height:1.45;
}

.pathway-note{
  margin-top:clamp(2.5rem,2rem + 2vw,4rem);
  border-top:1px solid var(--border-inverse);
  padding-top:2rem;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
}
.pathway-note li{
  color:var(--ink-inverse-muted);
  font-size:.92rem;
  padding-left:1.4rem;
  position:relative;
}
.pathway-note li::before{
  content:"";
  position:absolute; left:0; top:.5em;
  width:8px; height:8px;
  background:var(--gold-500);
}

@media (max-width:980px){
  .pathway{ grid-template-columns:repeat(4,1fr); row-gap:2.5rem; }
  .pathway-step::before{ display:none; }
  .pathway-note{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .pathway{ grid-template-columns:repeat(2,1fr); }
}

/* ---------------------------------------------------------
   Format comparison cards
   --------------------------------------------------------- */
.format-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.5rem;
}
.format-card{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:clamp(1.75rem, 1.4rem + 1.5vw, 2.75rem);
  display:flex;
  flex-direction:column;
}
.format-card.is-featured{ border-color:var(--navy-900); border-width:2px; }
.format-card .format-kicker{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1rem;
}
.format-card .format-kicker .badge{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase;
  background:var(--navy-900); color:var(--gold-500);
  padding:.35em .75em; border-radius:var(--radius-pill);
}
.format-card h3{ margin-bottom:.6rem; }
.format-card > p.desc{ color:var(--ink-soft); font-size:.95rem; margin-bottom:1.5rem; }
.format-card .list{ display:flex; flex-direction:column; gap:.85rem; margin-bottom:1.5rem; flex:1; }
.format-card .list li{
  display:flex; gap:.75rem; align-items:flex-start;
  font-size:.92rem; color:var(--ink-soft); line-height:1.5;
}
.format-card .list li svg{ flex:none; width:18px; height:18px; margin-top:.15em; stroke:var(--gold-600); }
.format-card .weeks{ display:flex; flex-direction:column; gap:.6rem; margin-bottom:1.5rem; }
.format-card .weeks .wk{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-600); }
.format-card .weeks li{ font-size:.9rem; color:var(--ink-soft); padding-bottom:.6rem; border-bottom:1px solid var(--border); }
.format-card .weeks li:last-child{ border-bottom:0; padding-bottom:0; }

@media (max-width:820px){
  .format-grid{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Learnings (manifesto + gain tiles)
   --------------------------------------------------------- */
.learn-layout{
  display:grid;
  grid-template-columns:0.82fr auto 1.18fr;
  gap:clamp(1.5rem, 1rem + 2vw, 3rem);
  align-items:stretch;
}
.believe-col h3, .gain-col h3{ margin-bottom:1.5rem; }

.manifesto{ display:flex; flex-direction:column; }
.manifesto-item{
  display:flex;
  gap:1.25rem;
  padding:1.4rem 0;
  border-bottom:1px solid var(--border);
}
.manifesto-item:first-child{ padding-top:0; }
.manifesto-item:last-child{ border-bottom:0; padding-bottom:0; }
.manifesto-num{
  flex:none;
  width:2.4ch;
  font-family:var(--font-display);
  font-weight:700;
  font-size:2rem;
  line-height:1;
  color:var(--gold-600);
}
.manifesto-item p{
  font-size:1rem;
  color:var(--ink-soft);
  line-height:1.6;
  padding-top:.3rem;
}
.manifesto-item b{ color:var(--ink); }

.learn-divider{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1rem;
}
.learn-divider .line{ flex:1; width:1px; background:var(--border); min-height:1.5rem; }
.learn-divider .node{
  flex:none;
  width:40px; height:40px;
  border-radius:50%;
  border:1.5px solid var(--gold-600);
  display:flex; align-items:center; justify-content:center;
}
.learn-divider .node svg{ width:18px; height:18px; stroke:var(--gold-600); }

.gain-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1rem;
}
.gain-tile{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:1.4rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:.9rem;
  transition:transform var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard), border-color var(--dur-base) var(--ease-standard);
}
.gain-tile:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 40px -28px rgba(11,28,63,0.38);
  border-color:var(--navy-900);
}
.gain-tile svg{ width:26px; height:26px; stroke:var(--gold-600); }
.gain-tile p{ font-size:.92rem; color:var(--ink-soft); line-height:1.55; }
.gain-tile b{ color:var(--ink); }
.gain-tile.is-lead{
  grid-column:1 / -1;
  flex-direction:row;
  align-items:center;
  gap:1.5rem;
  background:var(--navy-900);
  border-color:var(--navy-900);
}
.gain-tile.is-lead svg{ flex:none; width:32px; height:32px; stroke:var(--gold-500); }
.gain-tile.is-lead p{ color:var(--ink-inverse); font-size:1rem; }
.gain-tile.is-lead b{ color:var(--gold-500); }
.gain-tile.is-lead:hover{ border-color:var(--navy-900); }

@media (max-width:900px){
  .learn-layout{ grid-template-columns:1fr; }
  .learn-divider{ flex-direction:row; padding:.5rem 0; }
  .learn-divider .line{ height:1px; min-height:0; width:auto; min-width:1.5rem; }
}
@media (max-width:560px){
  .gain-grid{ grid-template-columns:1fr; }
  .gain-tile.is-lead{ flex-direction:column; align-items:flex-start; }
}

/* ---------------------------------------------------------
   Gallery of outcomes + lightbox
   --------------------------------------------------------- */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:clamp(1.25rem, 1rem + 1vw, 1.75rem);
}
.gallery-card{
  display:block;
  width:100%;
  text-align:left;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  overflow:hidden;
  cursor:pointer;
  transition:transform var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard), border-color var(--dur-base) var(--ease-standard);
}
.gallery-card:hover, .gallery-card:focus-visible{
  transform:translateY(-4px);
  box-shadow:0 24px 44px -28px rgba(11,28,63,0.4);
  border-color:var(--navy-900);
}
.gallery-frame{
  position:relative;
  display:block;
  aspect-ratio:16/9;
  overflow:hidden;
  background:var(--paper-200);
}
.gallery-frame img{
  width:100%; height:100%; object-fit:cover;
  transition:transform var(--dur-slow) var(--ease-standard);
}
.gallery-card:hover .gallery-frame img, .gallery-card:focus-visible .gallery-frame img{ transform:scale(1.045); }
.gallery-frame::after{
  content:"View full size";
  position:absolute; right:.85rem; bottom:.85rem;
  background:rgba(11,28,63,0.88);
  color:var(--paper-50);
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.07em;
  text-transform:uppercase;
  padding:.5em .85em;
  border-radius:var(--radius-pill);
  opacity:0;
  transform:translateY(6px);
  transition:opacity var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.gallery-card:hover .gallery-frame::after, .gallery-card:focus-visible .gallery-frame::after{
  opacity:1; transform:none;
}
.gallery-cap{ display:block; padding:1.5rem 1.6rem 1.75rem; }
.gallery-cap .fig{
  display:block;
  font-family:var(--font-mono);
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin-bottom:.6rem;
}
.gallery-title{
  display:block;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.15rem;
  color:var(--ink);
  margin-bottom:.5rem;
}
.gallery-desc{ display:block; font-size:.92rem; color:var(--ink-soft); line-height:1.55; }

@media (max-width:760px){
  .gallery-grid{ grid-template-columns:1fr; }
}

.lightbox{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
  padding:clamp(1rem,4vw,3rem);
}
.lightbox[hidden]{ display:none; }
.lightbox-backdrop{ position:absolute; inset:0; background:rgba(11,28,63,0.82); }
.lightbox-panel{
  position:relative;
  background:var(--paper-50);
  border-radius:var(--radius-lg);
  max-width:min(920px,92vw);
  max-height:90vh;
  overflow:auto;
  z-index:1;
}
.lightbox-close{
  position:absolute; top:.75rem; right:.75rem;
  width:40px; height:40px;
  border-radius:50%;
  background:var(--navy-900);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  z-index:2;
}
.lightbox-close svg{ stroke:var(--paper-50); width:18px; height:18px; }
.lightbox-img{ width:100%; display:block; max-height:60vh; object-fit:contain; background:var(--navy-900); }
.lightbox-info{ padding:1.5rem 1.75rem 1.75rem; }
.lightbox-info .fig{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-600); display:block; margin-bottom:.5rem;
}
.lightbox-info h3{ margin-bottom:.5rem; }
.lightbox-info p{ color:var(--ink-soft); font-size:.96rem; }

/* ---------------------------------------------------------
   Founder
   --------------------------------------------------------- */
.founder-grid{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:clamp(2rem, 2vw, 4rem);
  align-items:start;
}
.founder-photo{
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border-inverse);
}
.founder-photo img{ width:100%; height:100%; object-fit:cover; }
.founder-credentials{
  display:flex; flex-wrap:wrap; gap:.6rem;
  margin-top:1.75rem;
}
.founder-credentials span{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.05em;
  color:var(--ink-inverse-muted);
  border:1px solid var(--border-inverse);
  padding:.4em .85em; border-radius:var(--radius-pill);
}
.founder-contact{
  margin-top:1.75rem;
  display:flex; flex-wrap:wrap; gap:1.5rem;
  color:var(--ink-inverse-muted);
  font-family:var(--font-mono); font-size:.85rem;
}
.founder-contact a{ color:var(--ink-inverse); border-bottom:1px solid var(--border-inverse); }
.founder-contact a:hover{ border-color:var(--gold-500); }

@media (max-width:760px){
  .founder-grid{ grid-template-columns:1fr; }
  .founder-photo{ max-width:16rem; }
}

/* ---------------------------------------------------------
   CTA banner
   --------------------------------------------------------- */
.cta-banner{
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem; flex-wrap:wrap;
}
.cta-banner .h2{ color:var(--navy-900); margin-bottom:.5rem; }
.cta-banner p{ color:var(--navy-900); opacity:.8; max-width:34rem; }
.accent-ctx .eyebrow{ color:var(--navy-900); }
.accent-ctx .eyebrow::before{ background:var(--navy-900); }

/* ---------------------------------------------------------
   Contact / Form
   --------------------------------------------------------- */
.contact-grid{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:clamp(2rem, 2vw, 4rem);
}
.contact-info .info-item{ display:flex; gap:1rem; margin-bottom:1.5rem; }
.contact-info .info-item svg{ flex:none; width:22px; height:22px; stroke:var(--gold-600); margin-top:.15rem; }
.contact-info .info-item a, .contact-info .info-item span{ color:var(--ink-soft); }
.contact-info .info-item a:hover{ color:var(--ink); }

.form-card{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.field{ margin-bottom:1.25rem; }
.field label{
  display:block;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.07em;
  text-transform:uppercase;
  color:var(--ink-muted);
  margin-bottom:.55rem;
}
.field label .req{ color:var(--gold-600); }
.field input, .field select, .field textarea{
  width:100%;
  background:var(--bg);
  border:1.5px solid var(--border);
  border-radius:var(--radius-sm);
  padding:.85em 1em;
  font-size:.98rem;
  color:var(--ink);
  min-height:48px;
  transition:border-color var(--dur-base) var(--ease-standard);
}
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{
  border-color:var(--navy-700);
  outline:none;
}
.field .hint{ font-size:.8rem; color:var(--ink-muted); margin-top:.4rem; }
.field.has-error input, .field.has-error select, .field.has-error textarea{ border-color:#b3432c; }
.field .error-msg{ font-size:.82rem; color:#b3432c; margin-top:.4rem; display:none; }
.field.has-error .error-msg{ display:block; }

.form-status{
  margin-top:1.25rem;
  padding:1rem 1.25rem;
  border-radius:var(--radius-sm);
  font-size:.92rem;
  display:none;
}
.form-status.is-success{ display:block; background:#e4efe1; color:#2d5233; }
.form-status.is-error{ display:block; background:#f6e3dd; color:#8c3a24; }

@media (max-width:920px){
  .contact-grid{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .form-row{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.site-footer{
  background:var(--paper-200);
  padding:clamp(3rem, 2.5rem + 2vw, 5rem) 0 2rem;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 0.8fr 1fr;
  gap:2.5rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid rgba(11,28,63,0.12);
}
.footer-brand img{ height:46px; margin-bottom:1rem; }
.footer-brand p{ color:var(--ink-muted); font-size:.92rem; max-width:26rem; }
.footer-col h4{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-muted); margin-bottom:1rem;
}
.footer-col ul{ display:flex; flex-direction:column; gap:.7rem; }
.footer-col a{ color:var(--ink-soft); font-size:.92rem; }
.footer-col a:hover{ color:var(--ink); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
  padding-top:1.5rem;
  color:var(--ink-muted); font-size:.82rem;
}

@media (max-width:820px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .footer-brand{ grid-column:1 / -1; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Page hero (program.html)
   --------------------------------------------------------- */
.page-hero{ padding:clamp(3rem,2.4rem + 3vw,5rem) 0 clamp(2rem,1.6rem+2vw,3rem); }
.breadcrumb{
  display:flex; align-items:center; gap:.5rem;
  font-family:var(--font-mono); font-size:.8rem; color:var(--ink-muted);
  margin-bottom:1.5rem;
}
.breadcrumb a{ color:var(--ink-soft); }
.breadcrumb a:hover{ color:var(--ink); }

/* ---------------------------------------------------------
   Pathway detail (program.html) — vertical list
   --------------------------------------------------------- */
.pathway-detail{ display:flex; flex-direction:column; }
.pathway-row{
  display:grid;
  grid-template-columns:80px 60px 1fr;
  gap:1.5rem;
  padding:2rem 0;
  border-bottom:1px solid var(--border);
}
.pathway-row:first-child{ padding-top:0; }
.pathway-row .num{ font-family:var(--font-display); font-weight:700; font-size:1.75rem; color:var(--paper-200); }
.pathway-row .icon-circle{
  width:56px; height:56px; border-radius:50%;
  background:var(--navy-900);
  display:flex; align-items:center; justify-content:center;
}
.pathway-row .icon-circle svg{ width:26px; height:26px; stroke:var(--gold-500); }
.pathway-row h3{ margin-bottom:.5rem; }
.pathway-row p{ color:var(--ink-soft); font-size:.96rem; max-width:46rem; }

@media (max-width:640px){
  .pathway-row{ grid-template-columns:44px 1fr; }
  .pathway-row .num{ display:none; }
}

/* ---------------------------------------------------------
   Reveal-on-scroll
   --------------------------------------------------------- */
[data-reveal]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity var(--dur-slow) var(--ease-standard), transform var(--dur-slow) var(--ease-standard);
}
[data-reveal].is-visible{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1; transform:none; }
}

/* ---------------------------------------------------------
   Misc utilities
   --------------------------------------------------------- */
.center-text{ text-align:center; }
.mt-lg{ margin-top:clamp(2rem,1.6rem + 2vw,3.5rem); }
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ---------------------------------------------------------
   How it works: three steps
   --------------------------------------------------------- */
.steps{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(1.5rem, 1rem + 2vw, 3rem);
}
.step{ border-top:2px solid var(--navy-900); padding-top:1.5rem; }
.step-num{
  display:block;
  font-family:var(--font-display);
  font-weight:700;
  font-size:2.6rem;
  line-height:1;
  color:var(--gold-600);
  margin-bottom:1rem;
}
.step h3{ margin-bottom:.6rem; }
.step p{ color:var(--ink-soft); font-size:.98rem; }
.steps-note{
  margin-top:clamp(2rem, 1.6rem + 2vw, 3rem);
  font-family:var(--font-display);
  font-weight:500;
  font-size:var(--fs-lead);
  color:var(--ink);
}
@media (max-width:820px){
  .steps{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Who it's for: audience cards
   --------------------------------------------------------- */
.audience-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
}
.audience-card{
  display:flex;
  flex-direction:column;
  border:1px solid var(--border-inverse);
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:rgba(246,243,238,0.04);
  transition:border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.audience-card:hover, .audience-card:focus-visible{ border-color:var(--gold-500); transform:translateY(-3px); }
.audience-card img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.audience-body{ padding:1.5rem 1.6rem 1.75rem; display:flex; flex-direction:column; gap:.75rem; flex:1; }
.audience-body p{ color:var(--ink-inverse-muted); font-size:.96rem; line-height:1.55; flex:1; }
.audience-body .link-arrow{ align-self:flex-start; }
@media (max-width:920px){
  .audience-grid{ grid-template-columns:1fr; max-width:34rem; }
  .audience-card img{ aspect-ratio:16/8; }
}

/* ---------------------------------------------------------
   Three-format grid and plain two-column cells
   --------------------------------------------------------- */
.format-grid.three{ grid-template-columns:repeat(3, 1fr); }
.format-card .works-as{
  margin-top:auto;
  padding-top:1rem;
  border-top:1px solid var(--border);
  font-size:.88rem;
  color:var(--ink-muted);
}
.format-note{ margin-top:1.5rem; color:var(--ink-soft); max-width:var(--measure); }
@media (max-width:980px){
  .format-grid.three{ grid-template-columns:1fr; }
}
.method-cell.plain .h3{ margin-bottom:.75rem; }

/* Single Today -> 2040 panel (audience pages) */
.reframe-single{ max-width:920px; margin-inline:auto; }
ol.steps{ list-style:none; margin:0; padding:0; }

/* ---------------------------------------------------------
   Visual format cards (homepage)
   --------------------------------------------------------- */
.format-visual{
  background:var(--paper-100);
  border-radius:var(--radius-md);
  padding:1.25rem 1.25rem 1rem;
  margin-bottom:1.5rem;
}
.sun-arc{ width:100%; height:auto; overflow:visible; }
.sun-arc .horizon{ stroke:var(--paper-200); stroke-width:2; }
.sun-arc .arc{ fill:none; stroke:var(--navy-700); stroke-width:2; stroke-dasharray:2 7; stroke-linecap:round; }
.sun-arc .sun circle{ fill:var(--gold-500); }
.sun-arc .sun path{ stroke:var(--gold-500); stroke-width:2.2; stroke-linecap:round; }
.sun-arc .node circle{ fill:var(--navy-900); }
.sun-arc .node-end circle{ fill:var(--gold-500); }
.sun-arc .node text{ fill:var(--gold-500); font-family:var(--font-display); font-weight:700; font-size:15px; text-anchor:middle; }
.sun-arc .node-end text{ fill:var(--navy-900); }
.arc-ends{
  display:flex; justify-content:space-between;
  margin-top:.35rem;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-muted);
}

.day-steps{
  list-style:none; margin:0 0 1.25rem; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.25rem;
  flex:1;
}
.day-steps li{ display:flex; gap:.7rem; align-items:flex-start; }
.day-steps .n{
  flex:none; width:26px; height:26px; border-radius:50%;
  background:var(--navy-900); color:var(--gold-500);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:.8rem;
}
.day-steps li:last-child .n{ background:var(--gold-500); color:var(--navy-900); }
.day-steps p{ font-size:.9rem; line-height:1.5; color:var(--ink-soft); }
.day-steps b{ color:var(--ink); }

.track{
  list-style:none; margin:0; padding:.5rem 0 0;
  display:flex; align-items:flex-start; justify-content:space-between;
  position:relative;
}
.track::before{
  content:""; position:absolute; left:22px; right:22px; top:calc(.5rem + 21px);
  height:2px; background:var(--navy-700); opacity:.35;
}
.track .stop{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:.55rem; width:44px; }
.track .dot{
  width:44px; height:44px; border-radius:50%;
  background:var(--navy-900); color:var(--gold-500);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:1.05rem;
  box-shadow:0 0 0 5px var(--paper-100);
}
.track .stop-end .dot{ background:var(--gold-500); color:var(--navy-900); }
.track .stop-end .dot svg{ width:22px; height:22px; stroke:var(--navy-900); }
.track .lbl{
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-soft); white-space:nowrap;
}
.track .touch{
  position:relative; z-index:1; flex:none;
  width:9px; height:9px; margin-top:calc(21px - 4px);
  border-radius:50%; background:var(--gold-600);
  box-shadow:0 0 0 3px var(--paper-100);
}
.track-key{
  display:flex; align-items:center; gap:.5rem;
  margin-top:1.25rem; padding-top:.85rem; border-top:1px solid var(--paper-200);
  font-size:.8rem; color:var(--ink-muted);
}
.track-key .key-dot{ width:9px; height:9px; border-radius:50%; background:var(--gold-600); flex:none; }

@media (max-width:480px){
  .day-steps{ grid-template-columns:1fr; }
  .track .dot{ width:38px; height:38px; font-size:.95rem; }
  .track .stop{ width:38px; }
  .track::before{ left:19px; right:19px; top:calc(.5rem + 18px); }
  .track .touch{ width:7px; height:7px; margin-top:calc(18px - 3px); }
  .track .lbl{ font-size:.58rem; letter-spacing:.03em; }
}

.vtrack{ list-style:none; margin:0; padding:0; position:relative; }
.vtrack::before{
  content:""; position:absolute; left:17px; top:18px; bottom:18px;
  width:2px; background:var(--navy-700); opacity:.3;
}
.vtrack .stop{ position:relative; display:flex; gap:.9rem; align-items:center; }
.vtrack .dot{
  flex:none; position:relative; z-index:1;
  width:36px; height:36px; border-radius:50%;
  background:var(--navy-900); color:var(--gold-500);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:.95rem;
  box-shadow:0 0 0 4px var(--paper-100);
}
.vtrack .stop-end .dot{ background:var(--gold-500); color:var(--navy-900); }
.vtrack .stop-end .dot svg{ width:19px; height:19px; stroke:var(--navy-900); }
.vtrack p{ font-size:.88rem; line-height:1.45; color:var(--ink-soft); }
.vtrack .lbl{
  display:block;
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); margin-bottom:.1rem;
}
.vtrack .touch{ height:18px; position:relative; }
.vtrack .touch span{
  position:absolute; left:14px; top:5px;
  width:8px; height:8px; border-radius:50%; background:var(--gold-600);
  box-shadow:0 0 0 3px var(--paper-100);
}
.format-card .format-kicker{ flex-wrap:wrap; gap:.5rem .75rem; }
.format-card .format-kicker .badge{ white-space:nowrap; }

/* ---------------------------------------------------------
   Method: the question each part answers
   --------------------------------------------------------- */
.method-cell .method-q{
  font-family:var(--font-display);
  font-weight:500;
  font-size:1.02rem;
  color:var(--ink);
  margin-bottom:.5rem;
}

/* ---------------------------------------------------------
   Companies: futures cone (hero illustration)
   --------------------------------------------------------- */
.cone{ width:100%; height:auto; overflow:visible; }
.cone .plausible-fill{ fill:var(--paper-100); stroke:none; }
.cone .edge{ fill:none; stroke:var(--navy-700); stroke-opacity:.35; stroke-width:1.5; }
.cone .edge.outer{ stroke-opacity:.2; }
.cone .guide{ stroke:var(--navy-700); stroke-opacity:.22; stroke-width:1; stroke-dasharray:2 5; }
.cone .axis-line{ stroke:var(--paper-200); stroke-width:2; }
.cone .default{ fill:none; stroke:var(--ink-muted); stroke-width:2; stroke-dasharray:1 6; stroke-linecap:round; }
.cone .chosen{ fill:none; stroke:var(--gold-500); stroke-width:3.5; stroke-linecap:round; }
.cone .today{ fill:var(--paper-50); stroke:var(--navy-900); stroke-width:2.5; }
.cone .mile{ fill:var(--navy-900); }
.cone .end{ fill:var(--gold-500); stroke:var(--navy-900); stroke-width:2; }
.cone text{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; fill:var(--ink-muted); }
.cone .axis text{ text-anchor:middle; font-size:11.5px; }
.cone .axis .end-lbl{ fill:var(--ink); font-weight:500; }
.cone-key{
  display:flex; flex-wrap:wrap; gap:.5rem 1.4rem;
  margin-top:.75rem;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-muted);
}
.cone-key span{ display:inline-flex; align-items:center; gap:.5rem; }
.cone-key i{ display:inline-block; width:24px; border-top:3px solid var(--gold-500); }
.cone-key i.dotted{ border-top:2px dotted var(--ink-muted); }

/* ---------------------------------------------------------
   Companies: what's changing (Today -> 2040 rows)
   --------------------------------------------------------- */
.shift-list{ list-style:none; margin:2rem 0 0; padding:0; border-top:1px solid var(--border); }
.shift{
  display:grid;
  grid-template-columns:10.5rem minmax(0,1fr) minmax(0,1fr);
  gap:.75rem 2rem;
  padding:1.35rem 0;
  border-bottom:1px solid var(--border);
  align-items:start;
}
.shift-tag{
  display:flex; align-items:center; gap:.6rem;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink);
  padding-top:.1rem;
}
.shift-tag svg{ width:22px; height:22px; stroke:var(--gold-600); flex:none; }
.shift .yr{
  display:block;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em;
  color:var(--ink-muted);
  margin-bottom:.3rem;
}
.shift .future .yr{ color:var(--ink); }
.shift .future .yr::before{
  content:""; display:inline-block; width:8px; height:8px; margin-right:.45rem;
  background:var(--gold-500); border-radius:50%; vertical-align:1px;
}
.shift p{ font-size:.96rem; line-height:1.5; }
.shift .now p{ color:var(--ink-soft); }
.shift .future p{ color:var(--ink); font-weight:600; }
@media (max-width:720px){
  .shift{ grid-template-columns:1fr; gap:.6rem; }
}

/* ---------------------------------------------------------
   Companies: the three tests (desirable, viable, feasible)
   --------------------------------------------------------- */
.tests{
  margin-top:2.5rem;
  display:grid;
  grid-template-columns:minmax(0,17rem) minmax(0,1fr);
  gap:clamp(1.5rem, 1rem + 2vw, 3.5rem);
  align-items:center;
  padding:clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
}
.venn{ width:100%; max-width:17rem; height:auto; margin-inline:auto; display:block; }
.venn .set{ fill:none; stroke:var(--navy-900); stroke-width:1.75; }
.venn .core{ fill:var(--gold-500); stroke:var(--navy-900); stroke-width:2; }
.venn text{ font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; fill:var(--ink); text-anchor:middle; }
.tests dl{ margin:1.1rem 0 0; display:grid; gap:.9rem; }
.tests dt{ font-family:var(--font-display); font-weight:700; color:var(--ink); }
.tests dd{ margin:.15rem 0 0; color:var(--ink-soft); font-size:.96rem; }
.tests .tests-close{ margin-top:1.4rem; font-family:var(--font-display); font-weight:500; color:var(--ink); }
@media (max-width:760px){
  .tests{ grid-template-columns:1fr; }
}

/* ---------------------------------------------------------
   Companies: "how you run" chips inside an outcome tile
   --------------------------------------------------------- */
.run-chips{ display:flex; flex-wrap:wrap; gap:.4rem; }
.run-chips span{
  display:inline-flex; align-items:center; gap:.35rem;
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-soft);
  border:1px solid var(--border); border-radius:var(--radius-pill);
  padding:.3em .7em;
}
.run-chips svg{ width:13px; height:13px; stroke:var(--gold-600); }

/* ---------------------------------------------------------
   Companies: people and purpose
   --------------------------------------------------------- */
.purpose-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(2rem, 2vw, 4rem);
  align-items:center;
}
.purpose-list{ list-style:none; margin:1.75rem 0 0; padding:0; display:grid; gap:1.1rem; }
.purpose-list li{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:.9rem; align-items:start; }
.purpose-list svg{ width:24px; height:24px; stroke:var(--gold-600); margin-top:.15rem; }
.purpose-list b{ display:block; font-family:var(--font-display); color:var(--ink); margin-bottom:.15rem; }
.purpose-list p{ color:var(--ink-soft); font-size:.96rem; }
.purpose-photo{ border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); }
.purpose-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
@media (max-width:860px){
  .purpose-grid{ grid-template-columns:1fr; }
  .purpose-photo img{ aspect-ratio:16/10; }
}

/* ---------------------------------------------------------
   Companies: client strip above the founder bio
   --------------------------------------------------------- */
.client-strip{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem 1.6rem;
  padding-bottom:clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem);
  margin-bottom:clamp(2rem, 1.5rem + 2vw, 3rem);
  border-bottom:1px solid var(--border-inverse);
}
.client-strip .strip-label{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold-500);
}
.client-strip .name{ font-family:var(--font-display); font-weight:500; font-size:1.1rem; color:var(--ink-inverse); }

/* Companies hero: the futures cone carries meaning, so it stays on phones */
@media (max-width:640px){
  .hero-art.hero-art-keep{ display:block; margin-top:2rem; max-width:100%; }
}

/* Communities hero: the time jump (reuses .cone node, axis and label styles) */
.jump .halo{ fill:var(--gold-500); fill-opacity:.18; }
.jump .head-gold{ fill:var(--gold-500); }
.jump .head-ink{ fill:var(--ink-muted); }
.jump .arc-lbl{ text-anchor:middle; fill:var(--ink); font-weight:500; }
.jump .back-lbl{ text-anchor:middle; }

/* Artefacts brought back from 2040 */
.artefacts{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1rem;
  margin-bottom:clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem);
}
.artefact{ display:flex; flex-direction:column; gap:.65rem; margin:0; }
.artefact svg{
  width:100%; height:auto;
  background:var(--paper-50);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
}
.artefact figcaption{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-muted);
}
.artefact .ink{ fill:var(--navy-900); }
.artefact .soft{ fill:var(--paper-100); }
.artefact .ln{ stroke:var(--paper-200); stroke-width:5; stroke-linecap:round; }
.artefact .ln.dark{ stroke:var(--navy-700); stroke-opacity:.55; }
.artefact .gold{ fill:var(--gold-500); }
.artefact .gold-line{ fill:none; stroke:var(--gold-600); stroke-width:2; }
.artefact .ink-line{ fill:none; stroke:var(--navy-900); stroke-width:1.6; }
.artefact text{ font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; fill:var(--paper-50); }
.artefact text.on-paper{ fill:var(--ink); }
@media (max-width:720px){
  .artefacts{ grid-template-columns:repeat(2, 1fr); }
}

/* One-line "also works for" note */
.also-line{
  display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.25rem;
  padding-top:1.5rem;
  border-top:1px solid var(--border);
  color:var(--ink-soft);
  font-size:.98rem;
}

/* Two-sentence hero headlines run a size down so they hold to four or five lines */
.hero-copy .h-display.is-long{ font-size:clamp(2.25rem, 1.7rem + 2.4vw, 3.5rem); max-width:18ch; }

/* Honeypot: hidden from people, filled in by bots */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Compact founder card on audience pages; the full bio lives on the homepage */
.founder-card{
  display:grid;
  grid-template-columns:96px 1fr auto;
  gap:1.25rem 2rem;
  align-items:center;
}
.founder-card-photo{
  width:96px; height:96px; border-radius:50%;
  object-fit:cover;
  border:1px solid var(--border-inverse);
}
.founder-card .h3{ margin-top:.35rem; }
.founder-card .body-copy{ margin-top:.4rem; max-width:58ch; }
@media (max-width:720px){
  .founder-card{ grid-template-columns:72px 1fr; }
  .founder-card-photo{ width:72px; height:72px; }
  .founder-card .link-arrow{ grid-column:1 / -1; justify-self:start; }
}

/* Method wheel: four parts around 2040, AI as the ring */
.method-visual{
  display:grid;
  grid-template-columns:minmax(16rem, 22rem) 1fr;
  gap:clamp(2rem, 1.5rem + 3vw, 4.5rem);
  align-items:center;
}
.method-wheel{ width:100%; height:auto; overflow:visible; }
.method-wheel .ai-ring{ fill:none; stroke:var(--gold-600); stroke-width:1.5; stroke-dasharray:3 7; stroke-linecap:round; }
.method-wheel .ai-pill{ fill:var(--gold-500); }
.method-wheel .ai-l{ font-family:var(--font-display); font-weight:700; font-size:12px; text-anchor:middle; fill:var(--navy-900); }
.method-wheel .spoke{ stroke:var(--navy-700); stroke-opacity:.18; stroke-width:1.5; stroke-dasharray:2 5; }
.method-wheel .flow{ fill:none; stroke:var(--navy-700); stroke-opacity:.55; stroke-width:2; }
.method-wheel .head{ fill:var(--navy-700); fill-opacity:.7; }
.method-wheel .node{ fill:var(--navy-900); }
.method-wheel .node-l{ font-family:var(--font-display); font-weight:700; font-size:20px; text-anchor:middle; fill:var(--gold-500); }
.method-wheel .core{ fill:var(--gold-500); stroke:var(--navy-900); stroke-width:2; }
.method-wheel .core-l{ font-family:var(--font-mono); font-weight:500; font-size:13px; letter-spacing:.06em; text-anchor:middle; fill:var(--navy-900); }

.method-list{ list-style:none; margin:0; padding:0; display:grid; gap:0; }
.method-list li{
  display:grid; grid-template-columns:40px 1fr; gap:1rem; align-items:start;
  padding:1.05rem 0;
  border-top:1px solid var(--border);
}
.method-list li:first-child{ border-top:0; padding-top:0; }
.method-list .letter{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:var(--navy-900); color:var(--gold-500);
  font-family:var(--font-display); font-weight:700;
}
.method-list .h3{ font-size:1.1rem; }
.method-list p{ margin-top:.2rem; color:var(--ink-soft); font-size:.95rem; }
.method-list li.is-ai .letter{ background:var(--gold-500); color:var(--navy-900); font-size:.85rem; }
@media (max-width:820px){
  .method-visual{ grid-template-columns:1fr; }
  .method-wheel{ max-width:18rem; margin-inline:auto; }
}

/* How it works: the journey (three phases and the exhibition) */
.journey{
  display:grid;
  grid-template-columns:3fr 2fr 2fr 1.15fr;
  margin-top:clamp(1rem, .5rem + 1.5vw, 2rem);
}
.phase{ --c:var(--navy-700); display:flex; flex-direction:column; min-width:0; }
.phase.ph-jump{ --c:var(--gold-500); }
.phase.ph-back{ --c:var(--navy-700); }
.phase.ph-build{ --c:var(--navy-900); }
.phase.ph-show{ --c:var(--gold-600); }
.phase-head{
  display:grid; grid-template-columns:auto 1fr; column-gap:.65rem; align-items:center;
  padding:.85rem 1rem .9rem;
  border-top:4px solid var(--c);
  background:var(--paper-100);
}
.phase + .phase .phase-head{ border-left:1px solid var(--paper-50); }
.phase-num{
  grid-row:span 2;
  width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--c); color:var(--paper-50);
  font-family:var(--font-display); font-weight:700; font-size:.9rem;
}
.ph-jump .phase-num{ color:var(--navy-900); }
.phase-name{ font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--ink); line-height:1.2; }
.phase-method{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-muted); }
.stops{
  list-style:none; margin:0; padding:1.5rem 0 0;
  display:grid; grid-template-columns:repeat(var(--stops), 1fr);
  position:relative; flex:1;
}
.stops::before{
  content:""; position:absolute; left:0; right:0; top:calc(1.5rem + 21px);
  border-top:2px solid var(--paper-200);
}
.stop{ position:relative; display:flex; flex-direction:column; gap:.35rem; padding:0 .9rem 0 1rem; }
.stop-icon{
  position:relative; z-index:1;
  width:44px; height:44px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--bg); border:2px solid var(--c);
  margin-bottom:.45rem;
}
.stop-icon svg{ width:20px; height:20px; stroke:var(--navy-900); }
.ph-show .stop-icon{ background:var(--gold-500); border-color:var(--gold-600); }
.stop-num{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; color:var(--ink-muted); }
.stop b{ font-family:var(--font-display); font-weight:700; font-size:1rem; color:var(--ink); line-height:1.25; }
.stop-desc{ font-size:.88rem; color:var(--ink-soft); line-height:1.5; }
@media (max-width:960px){
  .journey{ grid-template-columns:1fr; gap:1.25rem; }
  .phase + .phase .phase-head{ border-left:0; }
  .stops{ grid-template-columns:1fr; padding-top:1.1rem; row-gap:1.1rem; }
  .stops::before{ top:1.1rem; bottom:0; left:21px; right:auto; border-top:0; border-left:2px solid var(--paper-200); }
  .stop{ display:grid; grid-template-columns:44px 1fr; column-gap:1rem; padding:0; }
  .stop-icon{ grid-row:span 3; margin:0; }
}

/* Formats: how much of the journey each one covers, and what happens */
.coverage{ display:grid; grid-template-columns:repeat(4, 1fr); gap:4px; margin:1.1rem 0 1.4rem; }
.coverage .seg{
  display:flex; flex-direction:column; gap:.4rem;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted);
}
.coverage .seg i{ display:block; height:8px; border-radius:4px; background:var(--paper-200); }
.coverage .seg.full i{ background:var(--navy-900); }
.coverage .seg.light i{ background:repeating-linear-gradient(135deg, var(--navy-700) 0 3px, var(--paper-200) 3px 6px); }
.coverage .seg.none{ color:var(--paper-200); }
.coverage .seg.full, .coverage .seg.light{ color:var(--ink-soft); }
.coverage-key{
  display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; margin-top:1.5rem;
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted);
}
.coverage-key span{ display:inline-flex; align-items:center; gap:.5rem; }
.coverage-key i{ display:inline-block; width:22px; height:8px; border-radius:4px; background:var(--paper-200); }
.coverage-key i.full{ background:var(--navy-900); }
.coverage-key i.light{ background:repeating-linear-gradient(135deg, var(--navy-700) 0 3px, var(--paper-200) 3px 6px); }

.flow{ list-style:none; margin:0 0 1.25rem; padding:0; display:grid; gap:.7rem; position:relative; flex:1; align-content:start; }
.flow::before{ content:""; position:absolute; left:6px; top:8px; bottom:8px; border-left:2px solid var(--paper-200); }
.flow li{ position:relative; display:grid; grid-template-columns:14px 1fr; gap:.85rem; align-items:start; font-size:.94rem; color:var(--ink-soft); line-height:1.45; }
.flow li::before{
  content:""; position:relative; z-index:1; margin-top:.3rem;
  width:14px; height:14px; border-radius:50%;
  background:var(--bg); border:2px solid var(--navy-700);
}
.flow li:last-child::before{ background:var(--gold-500); border-color:var(--gold-600); }
.flow.with-badges::before{ left:13px; top:14px; bottom:14px; }
.flow.with-badges li{ grid-template-columns:28px 1fr; align-items:center; }
.flow.with-badges li::before{ display:none; }
.flow.with-badges .letter{
  position:relative; z-index:1;
  width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--navy-900); color:var(--gold-500);
  font-family:var(--font-display); font-weight:700; font-size:.78rem;
}
.flow.with-badges li:last-child .letter{ background:var(--gold-500); color:var(--navy-900); }
/* Journey: put every phase header on one shared row so the stop line runs level */
@media (min-width:961px){
  .journey{ grid-template-rows:auto auto; grid-auto-flow:column; }
  .phase{ display:contents; }
  .phase-head{ grid-row:1; }
  .stops{ grid-row:2; }
}
.flow{ flex:none; }
.format-card .works-as{ margin-top:auto; }

/* Homepage outcomes: cohort work */
.work-strip{ display:grid; grid-template-columns:repeat(4, 1fr); gap:1.25rem; }
.work-item{ margin:0; display:flex; flex-direction:column; gap:.75rem; }
.work-item img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--radius-md); border:1px solid var(--border);
}
.work-item figcaption{ font-size:.92rem; color:var(--ink-soft); line-height:1.45; }
.work-foot{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem 1.5rem;
  margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid var(--border);
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted);
}
@media (max-width:860px){ .work-strip{ grid-template-columns:repeat(2, 1fr); } }

/* Colleges hero photo */
.hero-photo{ margin:0; position:relative; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); }
.hero-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; display:block; }
.hero-photo figcaption{
  position:absolute; left:1rem; right:1rem; bottom:1rem;
  display:flex; flex-direction:column; gap:.3rem;
  padding:.85rem 1rem; border-radius:var(--radius-sm);
  background:var(--navy-900); color:var(--ink-inverse);
  font-size:.92rem; line-height:1.4;
}
.hero-photo .cap-year{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; color:var(--gold-500); }
@media (max-width:640px){ .hero-photo img{ aspect-ratio:4/3.4; } }

/* Colleges: single stream or across departments */
.stream-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.stream-card{
  border:1px solid var(--border); border-radius:var(--radius-md);
  padding:clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem);
  display:flex; flex-direction:column; gap:.5rem;
}
.stream-svg{ width:100%; max-width:22rem; height:auto; margin:0 auto 1rem; overflow:visible; }
.stream-svg .set{ fill:var(--navy-700); fill-opacity:.06; stroke:var(--navy-700); stroke-width:1.5; }
.stream-svg .set.solo{ fill-opacity:.08; }
.stream-svg .core{ fill:var(--gold-500); stroke:var(--navy-900); stroke-width:1.5; }
.stream-svg .lbl{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.1em; fill:var(--ink-muted); }
.stream-svg .lbl.strong{ fill:var(--ink); font-weight:500; font-size:10.5px; }
.stream-card p{ color:var(--ink-soft); }
@media (max-width:760px){ .stream-grid{ grid-template-columns:1fr; } }

/* Homepage How it works: the time jump above the three steps */
.jump-figure{ max-width:34rem; margin:0 auto clamp(2rem, 1.5rem + 2vw, 3rem); }
/* Colleges hero caption: smaller on phones so the photo shows */
@media (max-width:640px){
  .hero-photo figcaption{ left:.6rem; right:auto; bottom:.6rem; max-width:78%; padding:.55rem .75rem; font-size:.82rem; gap:.15rem; }
  .hero-photo .cap-year{ font-size:.62rem; }
}

/* Colleges hero: four streams meet, then one path to 2040 (reuses .cone styles) */
.campus .stream-line{ fill:none; stroke:var(--navy-700); stroke-opacity:.5; stroke-width:2; stroke-linecap:round; }
.campus .today.small{ stroke-width:2; }
.campus .halo{ fill:var(--gold-500); fill-opacity:.18; }
.cone-key i.thin{ border-top:2px solid var(--navy-700); opacity:.6; }

/* ---------------------------------------------------------
   Industry readiness tool (readiness.html) and teasers
   --------------------------------------------------------- */
.rd-sr{ position:absolute; left:-9999px; }
.rd-search{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.rd-search input, .rd-pick input, .rd-teaser-form input{
  flex:1 1 18rem; min-width:0; padding:.95rem 1.1rem; border-radius:var(--radius-sm);
  border:1px solid var(--paper-200); background:#fff; color:var(--ink); font-size:1rem;
}
.rd-status{ font-size:var(--fs-small); color:var(--ink-muted); margin-top:.85rem; min-height:1.4em; }
.rd-sugg{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem; }
.rd-chip{ padding:.55em 1em; font-size:.85rem; }
.rd-link{ margin-top:.75rem; color:var(--navy-700); font-weight:600; font-size:var(--fs-small); text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:0; }
.rd-pick{ margin-top:1rem; background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); padding:1rem; display:flex; flex-direction:column; gap:.75rem; }
.rd-plist{ max-height:22rem; overflow-y:auto; display:flex; flex-direction:column; gap:2px; }
.rd-prow{ text-align:left; width:100%; padding:.7rem .85rem; border-radius:var(--radius-sm); cursor:pointer; }
.rd-prow:hover, .rd-prow:focus-visible{ background:var(--paper-100); }
.rd-prow strong{ display:block; font-weight:600; }
.rd-prow span{ font-size:.82rem; color:var(--ink-muted); }

.rd-sheet{ background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); padding:clamp(1.5rem, 1.2rem + 1.5vw, 2.75rem); display:flex; flex-direction:column; gap:2.25rem; }
.rd-head{ display:flex; justify-content:space-between; gap:1.25rem; flex-wrap:wrap; align-items:flex-start; }
.rd-tag{ color:var(--ink-muted); }
.rd-example{ background:var(--gold-500); color:var(--navy-900); padding:.15em .6em; border-radius:var(--radius-pill); margin-right:.4em; }
.rd-title{ margin-top:.5rem; max-width:30ch; }
.rd-qword{ padding:0 .25em; border-radius:6px; }
.rd-q1-ink{ background:var(--navy-900); color:var(--paper-50); }
.rd-q2-ink{ background:var(--gold-500); color:var(--navy-900); }
.rd-q3-ink{ background:var(--paper-100); color:var(--navy-900); }
.rd-q4-ink{ background:var(--navy-700); color:var(--paper-50); }
.rd-seg{ display:inline-flex; border:1px solid var(--border); border-radius:var(--radius-pill); overflow:hidden; }
.rd-seg button{ padding:.55rem 1rem; font-size:.85rem; color:var(--ink-muted); cursor:pointer; }
.rd-seg button[aria-pressed="true"]{ background:var(--navy-900); color:var(--paper-50); }

.rd-grid{ display:grid; grid-template-columns:minmax(0,15rem) minmax(0,1fr); gap:2rem; }
@media (max-width:720px){ .rd-grid{ grid-template-columns:minmax(0,1fr); } }
.rd-compass{ display:grid; grid-template-columns:1fr 1fr; gap:4px; aspect-ratio:1; max-width:15rem; }
.rd-cell{ border-radius:var(--radius-sm); display:flex; align-items:flex-end; padding:.6rem; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; opacity:.35; }
.rd-cell.is-on{ opacity:1; box-shadow:0 0 0 3px var(--gold-600); }
.rd-q1{ background:var(--navy-900); color:var(--paper-50); }
.rd-q2{ background:var(--gold-500); color:var(--navy-900); }
.rd-q3{ background:var(--paper-100); color:var(--navy-900); border:1px solid var(--paper-200); }
.rd-q4{ background:var(--navy-700); color:var(--paper-50); }
.rd-axes{ display:flex; justify-content:space-between; max-width:15rem; margin-top:.5rem; font-size:.75rem; color:var(--ink-muted); }
.rd-note{ font-size:.75rem; color:var(--ink-muted); margin-top:.25rem; }
.rd-qname{ font-family:var(--font-display); font-weight:700; font-size:var(--fs-h3); }
.rd-metrics{ display:grid; grid-template-columns:repeat(auto-fit,minmax(10rem,1fr)); gap:1rem; margin-top:1.25rem; }
.rd-metric{ border-top:2px solid var(--gold-500); padding-top:.6rem; }
.rd-metric .mono-label{ color:var(--ink-muted); }
.rd-metric p:last-child{ font-weight:600; margin-top:.2rem; }

.rd-sub{ margin-bottom:1.25rem; }
.rd-layers{ border-left:2px solid var(--paper-200); }
.rd-layer{ position:relative; padding:0 0 1.5rem 1.4rem; }
.rd-layer:last-child{ padding-bottom:.25rem; }
.rd-layer::before{ content:""; position:absolute; left:-8px; top:3px; width:14px; height:14px; border-radius:50%; background:#fff; border:2px solid var(--gold-600); }
.rd-layer.is-deep::before{ background:var(--gold-500); }
.rd-layer .mono-label{ color:var(--gold-600); margin-bottom:.35rem; }
.rd-layer p{ max-width:var(--measure); color:var(--ink-soft); }
.rd-layer.is-see p:last-child{ color:var(--ink-muted); }
.rd-myth{ font-family:var(--font-display); color:var(--ink); }
.rd-unc{ display:flex; flex-direction:column; gap:.65rem; }
.rd-urow{ display:grid; grid-template-columns:minmax(0,13rem) minmax(0,1fr); gap:.35rem 1rem; align-items:baseline; }
@media (max-width:600px){ .rd-urow{ grid-template-columns:minmax(0,1fr); } }
.rd-ulab{ font-weight:600; color:var(--ink) !important; }
.rd-poles{ display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; }
.rd-poles span{ background:var(--paper-100); border-radius:6px; padding:.15em .6em; font-size:.92rem; color:var(--ink); }
.rd-poles em{ font-style:normal; font-size:.8rem; color:var(--ink-muted); }
.rd-wi{ font-family:var(--font-display); font-size:clamp(1.1rem, 1rem + .4vw, 1.35rem); line-height:1.35; color:var(--ink) !important; }
.rd-src{ font-size:.8rem; color:var(--ink-muted); margin-top:1rem; }
.rd-src a{ color:var(--navy-700); text-decoration:underline; text-underline-offset:2px; }

.rd-offer{ border-radius:var(--radius-md); padding:clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem); display:flex; flex-direction:column; gap:1.1rem; }
.rd-qn{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.35rem, 1.1rem + 1vw, 1.9rem); line-height:1.25; color:var(--paper-50); max-width:34ch; }

.rd-report{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,26rem); gap:2.5rem; align-items:start; }
@media (max-width:860px){ .rd-report{ grid-template-columns:minmax(0,1fr); } }
.rd-report .form-card button[type="submit"]{ justify-self:start; }
.rd-foot{ margin-top:2.5rem; max-width:70ch; }

/* Teaser blocks on Home and Companies */
.rd-teaser{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,30rem); gap:2rem; align-items:end; }
@media (max-width:860px){ .rd-teaser{ grid-template-columns:minmax(0,1fr); } }
.rd-teaser-form{ display:flex; flex-wrap:wrap; gap:.75rem; }
.rd-teaser .small-print{ margin-top:.75rem; }
.rd-pick[hidden]{ display:none; }
.rd-pick input{ flex:none; }
#rd-result{ scroll-margin-top:6rem; }

/* Nav fits six links: keep labels on one line, tighten between 921px and 1180px */
.nav-links a{ white-space:nowrap; }
@media (min-width:921px) and (max-width:1180px){
  .nav-links{ gap:.85rem; }
  .nav-links a{ font-size:.7rem; letter-spacing:.05em; }
}