/* =====================================================================
   EULER ADVISORY — styles.css  (multi-page)
   Shared across index.html (executive narrative) and services.html
   (quantitative deep dive). "Quiet luxury meets academic rigour."

   Single surface: charcoal #0B0C0E throughout — NO light/dark intercalation.
   Raised cards sit a few values above the surface; full-bleed sections never do.
   Transitional serif display · geometric sans body · desaturated bronze ·
   sage ring-fenced to climate · tabular lining figures on all data.
   ===================================================================== */

/* ----------------------------- DESIGN TOKENS ----------------------------- */
:root {
  --c-bg:        #0B0C0E;   /* the single charcoal surface */
  --c-bg-raise:  #111317;   /* raised flat card */
  --c-bg-raise2: #15181D;   /* nested / hover */
  --c-line:      #23262C;   /* structural hairline */
  --c-line-soft: #1A1D22;

  --c-ink:       #F2F3F4;   /* primary   ~16.3:1 on bg */
  --c-ink-2:     #E2E2E2;   /* body — crisp off-white per accessibility audit ~13.6:1 */
  --c-ink-3:     #AEB2B8;   /* meta / small-caps — lifted so labels never dim ~7.0:1 */

  --c-bronze:    #B89766;   /* accent — hairlines + key metrics */
  --c-bronze-dk: #8C744E;
  --c-bronze-tn: rgba(184, 151, 102, 0.14);
  --c-gold:      #D4AF37;   /* premium metallic gold — feature titles/links */
  --c-gold-ink:  #7A5C12;   /* dark gold for text on white/off-white: 6.0:1 on #FAFAFA (WCAG AA) */

  --c-sage:      #AEB79C;   /* climate vertical only */
  --c-sage-line: #8F9779;
  --c-sage-tn:   rgba(143, 151, 121, 0.16);

  /* Homepage curtain-reveal palette (off-brand colourway, homepage only) */
  --c-offwhite:  #FAFAFA;   /* About + Solutions curtain surface */
  --c-keppel:    #3BBA9C;   /* mint accent — curtain edge + card buttons + link hover */
  --c-keppel-lt: #5AD8BA;   /* brighter mint for hover "light up" */
  --c-gunmetal:  #2E3047;   /* large display text on off-white; Sharpened Banner block */
  --c-rhythm:    #707793;   /* muted body / directory links on off-white */
  --c-arsenic:   #3C3F58;   /* service-card base */
  --c-outerspc:  #43455C;   /* service-card top of gradient */

  --spacing-x:   clamp(4rem, 8vw, 8rem);   /* consistent section inset / right thesis boundary */
  --edge-padding: var(--gutter);           /* = the page's left margin (gutter) — reused for hero bottom + thesis padding */

  --f-serif: "Newsreader", Georgia, "Times New Roman", serif;
  --f-sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --f-mono:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --num: "tnum" 1, "lnum" 1;

  --maxw: 1180px;
  --gutter: clamp(20px, 5vw, 56px);
  --edge: clamp(48px, 5vw, 96px);                 /* homepage and Who We Are: one left edge for every section (20px on phones, below) */
  --fs-page-title: clamp(48px, 6.5vw, 104px);      /* one size for every page title (homepage hero, page heroes, service pages, contact) */
  --fs-section-title: clamp(32px, 4.5vw, 64px);   /* one size for section titles: always smaller than a page title */
  /* MACRO dark space — heavy vertical rhythm for the executive read */
  --section-y: clamp(96px, 15vh, 200px);
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ----------------------------- RESET / BASE ----------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 110px; scrollbar-gutter: stable; }   /* offset = fixed header height (96px) + buffer; reserve scrollbar space */
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-ink);
  font-family: var(--f-sans);
  font-feature-settings: var(--num);
  font-variant-numeric: tabular-nums lining-nums;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

h1, h2, h3, h4 { margin: 0; font-weight: 400; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
::selection { background: var(--c-bronze); color: #0B0C0E; }

.container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
/* Centered, readable column — capped at 65ch per the executive-narrative brief */
.measure  { max-width: 65ch; margin-inline: auto; }
.measure-wide { max-width: 80ch; margin-inline: auto; }

.section { padding: var(--section-y) 0; position: relative; }
.section--tight { padding: clamp(64px, 9vh, 120px) 0; }

/* Section furniture */
.section-kicker {
  font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--c-bronze); margin-bottom: 22px;
}
.section-title {
  font-family: var(--f-serif); letter-spacing: -0.01em; color: var(--c-ink);
}
.section-lede {
  font-size: clamp(1.02rem, 1.4vw, 1.16rem); color: var(--c-ink-2);
  line-height: 1.6; margin-top: 24px;
}

/* ----------------------------- BUTTONS ----------------------------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--f-sans); font-size: 0.92rem; font-weight: 500; letter-spacing: 0.01em; line-height: 1;
  padding: 15px 28px; border: 1px solid var(--c-line);   /* height = 0.92rem + 30px padding + 2px border */
  transition: border-color .45s var(--ease), color .45s var(--ease), background .45s var(--ease);
  cursor: pointer;
}
.btn-primary { background: transparent; color: var(--c-ink); border-color: var(--c-bronze); }
.btn-primary:hover { background: var(--c-bronze-tn); border-color: var(--c-bronze); color: #fff; }
.btn-ghost { background: transparent; color: var(--c-ink-2); }
.btn-ghost:hover { color: var(--c-ink); border-color: var(--c-bronze-dk); }
/* Outline button for light surfaces (dark ink, bronze hairline) */
.btn-outline { background: transparent; color: #14161A; border-color: var(--c-bronze-dk); }
.btn-outline:hover { background: var(--c-bronze-tn); border-color: var(--c-bronze); color: #14161A; }
.btn .arrow { font-family: var(--f-mono); transition: transform .35s var(--ease); }
.btn:hover .arrow { transform: translateX(4px); }

/* Severe, monospaced terminal-style action link (not a body link) */
.link-quiet {
  font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--c-bronze);
  display: inline-flex; align-items: center; gap: 8px;
}
.link-quiet .arrow { transition: transform .35s var(--ease); }
.link-quiet:hover { color: #fff; }
.link-quiet:hover .arrow { transform: translateX(4px); }

/* ----------------------------- HEADER / NAV ----------------------------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  background: rgba(11, 12, 14, 0.72);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color .4s var(--ease), background .4s var(--ease);
}
.site-header.scrolled { border-bottom-color: var(--c-line); background: rgba(11,12,14,0.9); }
/* Header spans full width (not the centred 1180 container) so the logo sits on
   the same left-gutter guide as the Hero H1, and the nav is flush to the right
   gutter at the mirror distance. */
.site-header .container { max-width: none; }
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; }   /* 14px above and below the 44px logo */
/* Links flush right; adding Home on sub-pages expands them leftward. */
.site-nav { justify-content: flex-end; }

.brand { display: flex; align-items: center; gap: 10px; }
.brand-logo { height: 44px; width: auto; display: block; }   /* Königsberg graph + wordmark, gold on dark */
.brand-mark { font-family: var(--f-serif); font-size: 1.45rem; color: var(--c-bronze); line-height: 1; }
.brand-name { font-family: var(--f-serif); font-size: 1.18rem; letter-spacing: 0.01em; color: var(--c-ink); }
.brand-thin { color: var(--c-ink-2); }

.site-nav { display: flex; align-items: center; gap: 34px; }
.site-nav a { font-size: 0.86rem; color: var(--c-ink-2); letter-spacing: 0.01em; position: relative; padding: 4px 0; transition: color .35s var(--ease); }
.site-nav a::after { content: ""; position: absolute; left: 0; bottom: -2px; height: 1px; width: 0; background: var(--c-bronze); transition: width .4s var(--ease); }
.site-nav a:hover { color: var(--c-ink); }
.site-nav a:hover::after { width: 100%; }
.site-nav a.is-active { color: var(--c-ink); }
.site-nav a.is-active::after { width: 100%; }
.nav-cta { color: var(--c-gold) !important; }   /* one gold in the header, matching the logo */
/* ---- Hover/focus dropdown submenus (desktop) ---- */
.nav-item { position: relative; display: inline-flex; align-items: center; }
.nav-dropdown {
  position: absolute; top: calc(100% + 12px); right: 0; min-width: 234px;
  background: rgba(11, 12, 14, 0.975); border: 1px solid var(--c-line);
  padding: 8px 0; display: flex; flex-direction: column;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .26s var(--ease), transform .26s var(--ease), visibility .26s var(--ease);
  z-index: 60; box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
}
.nav-dropdown::before { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }   /* hover bridge */
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dropdown a { padding: 9px 20px; font-size: 0.82rem; color: var(--c-ink-2); white-space: nowrap; transition: color .25s var(--ease), background .25s var(--ease); }
.nav-dropdown a::after { display: none; }   /* no underline-grow inside the panel */
.nav-dropdown a:hover { color: var(--c-gold); background: var(--c-bg-raise); }

.nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: 0; cursor: pointer; padding: 6px; }
.nav-toggle span { width: 24px; height: 1.5px; background: var(--c-ink); transition: transform .35s var(--ease), opacity .35s; }
.mobile-nav { display: none; flex-direction: column; padding: 8px var(--gutter) 22px; border-bottom: 1px solid var(--c-line); background: rgba(11,12,14,0.96); }
.mobile-nav a { padding: 13px 0; color: var(--c-ink-2); border-bottom: 1px solid var(--c-line-soft); font-size: 0.95rem; }
.mobile-nav .mobile-sub { padding: 10px 0 10px 18px; font-size: 0.82rem; color: var(--c-ink-3); }   /* indented sub-items */
.mobile-nav .mobile-sub:hover { color: var(--c-gold); }
.mobile-nav.open { display: flex; }

/* ----------------------------- HERO (index) ----------------------------- */
/* Hero — value proposition vertically centred so it commands the first viewport */
.hero { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 96px 0 72px; overflow: hidden; }
/* Directional scrim — fades dark (left) to clear (right) so the copy reads over the video */
.hero::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(100deg, rgba(20, 22, 38, 0.95) 0%, rgba(20, 22, 38, 0.85) 28%, rgba(20, 22, 38, 0.40) 55%, rgba(20, 22, 38, 0.10) 100%); }
#hero .hero-scrim { display: none; }   /* replaced by the directional ::before so the right side stays clear */
.hero-surface {
  position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(180deg, rgba(11,12,14,0.55) 0%, rgba(11,12,14,0.78) 55%, var(--c-bg) 100%),
    url("Textured Black Surface.jpg") center/cover no-repeat;
}
.hero-light {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 38%), rgba(184,151,102,0.10) 0%, rgba(184,151,102,0.04) 35%, transparent 70%);
}
/* Hero text full-bleed left: strip the container's horizontal centring so the
   block anchors to the true left gutter, leaving the negative space on the right.
   Vertical centring (justify-content on .hero) is retained. */
.hero-inner { position: relative; z-index: 2; text-align: left; max-width: none; margin-left: 0; margin-right: 0; }
#hero .hero-inner {
  max-width: 100%;
  padding-left: clamp(3rem, 5vw, 6rem);
  padding-right: clamp(3rem, 5vw, 6rem);
  margin: 0;
}
.hero-inner .hero-title, .hero-inner .hero-slogan { max-width: 46ch; }
.hero-inner .hero-sub { max-width: 68ch; }   /* wraps the subheadline to exactly two lines */
.hero-slogan strong { font-weight: 600; font-style: italic; }
.eyebrow { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-bronze); margin-bottom: 30px; }
.hero-title { font-family: var(--f-serif); font-weight: 400; letter-spacing: -0.015em; color: #FFFFFF; }   /* dialled down — elegant, not screaming */
.hero-title .reveal-line { display: block; overflow: hidden; }
.hero-sub { margin-top: 30px; max-width: 60ch; font-size: clamp(1.02rem, 1.5vw, 1.22rem); color: var(--c-ink-2); line-height: 1.55; }

/* Hero value-proposition block (audiences + positioning). Left-aligned, constrained
   to the hero's left column, scales down cleanly on mobile via the clamp + max-width. */
.hero-subtext-container { margin-top: 2rem; margin-bottom: clamp(2rem, 4vh, 2.75rem); max-width: 88ch; font-size: clamp(1rem, 1.35vw, 1.125rem); line-height: 1.6; color: var(--c-ink-2); text-wrap: pretty; }
.hero-intro { margin: 0 0 0.5rem; color: var(--c-ink-3); }
.hero-list p { margin: 0; line-height: 1.75; }
.hero-outro { margin: 1rem 0 0; font-weight: 500; letter-spacing: 0.04em; color: #F4F1EA; }
.accent-gold { color: var(--c-gold); font-weight: 600; }   /* brand gold #D4AF37 */
/* Slogan — gold, italic, just below the subheadline */
.hero-slogan { margin-top: 22px; font-family: var(--f-serif); font-style: italic; font-size: clamp(1.05rem, 1.6vw, 1.32rem); color: var(--c-bronze); letter-spacing: 0.01em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 44px; }

.hero-inline-link {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease, border-bottom 0.3s ease;
  border-bottom: 1px solid transparent;
}
.hero-inline-link:hover {
  color: var(--c-gold, #C7A962);
  border-bottom: 1px solid var(--c-gold, #C7A962);
}

/* ---- Hero split: issuer/allocator self-selection, first screen ---- */
.hero-split { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.25rem, 2.5vw, 2rem); margin-top: auto; max-width: 1300px; }
.hero-split-panel { display: flex; flex-direction: column; gap: 0.85rem; padding: clamp(1.5rem, 2.5vw, 2rem); background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.14); text-decoration: none; transition: border-color .3s var(--ease), transform .3s var(--ease), background .3s var(--ease); }
.hero-split-panel:hover { border-color: rgba(212,175,55,0.5); background: rgba(255,255,255,0.05); transform: translateY(-3px); }
.hero-split-label { font-family: var(--f-serif); font-size: clamp(1.15rem, 1.8vw, 1.4rem); font-weight: 500; color: var(--c-gold); text-align: center; }
.hero-split-hook { font-size: clamp(0.92rem, 1.15vw, 1.02rem); line-height: 1.55; color: var(--c-ink-2); }
.hero-split-mech { font-size: 1.02rem; font-weight: 600; line-height: 1.5; color: #FFFFFF; }
.hero-split-mech strong { color: var(--c-gold); font-weight: 700; }
.hero-split-cta { margin-top: auto; padding-top: 0.5rem; font-family: var(--f-mono); font-size: 0.8rem; letter-spacing: 0.05em; color: var(--c-gold); }
@media (max-width: 760px) { .hero-split { grid-template-columns: 1fr; } }

/* ----------------------------- TRUST BAR ----------------------------- */
.trust-bar { border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.trust-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 0; flex-wrap: wrap; }
.trust-credential { font-size: 0.9rem; color: var(--c-ink-2); }
.trust-tags { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-ink-3); display: flex; gap: 12px; align-items: center; }
.trust-tags .dot, .footer-meta .dot { color: var(--c-bronze-dk); }

/* ----------------------------- THE PROBLEM (index) ----------------------------- */
.problem-statement {
  font-family: var(--f-serif);
  font-size: clamp(1.5rem, 3vw, 2.3rem);
  line-height: 1.34; letter-spacing: -0.01em; color: var(--c-ink); text-align: center;
}
.problem-foot { margin-top: 34px; text-align: center; color: var(--c-ink-3); font-size: 0.95rem; }

/* ----------------------------- CHALLENGE & SOLUTION (index) -----------------------------
   Structural two-column rows: serif gold sub-header (left) + body text (right),
   separated by clean horizontal dividers. */
.cs-rows { border-top: 1px solid var(--c-line); }
.cs-row {
  display: grid; grid-template-columns: 1fr 1fr;   /* hard 50/50 split: titles left half, text starts at exactly 50% */
  gap: 0; align-items: start;
  padding: clamp(30px, 4.5vh, 52px) 0;
  border-bottom: 1px solid var(--c-line);
}
.cs-label { font-family: var(--f-serif); font-size: clamp(1.2rem, 1.8vw, 1.55rem); line-height: 1.25; color: var(--c-bronze); }
.cs-body p { font-size: clamp(1rem, 1.25vw, 1.12rem); color: var(--c-ink-2); line-height: 1.72; max-width: none; }

/* ----------------------------- INSIGHTS & RESEARCH (index) ----------------------------- */
.insights-lede {
  font-family: var(--f-serif);
  font-size: clamp(1.35rem, 2.6vw, 1.95rem);
  line-height: 1.42; letter-spacing: -0.005em; color: var(--c-ink); text-align: center;
}
.insights-lede em { font-style: italic; color: var(--c-bronze); }

/* ----------------------------- PILLAR SUMMARY CARDS (index) ----------------------------- */
/* Practice-area cards, side-by-side. Desktop 3-up; tablet 2-up; mobile 1-up. */
.pillar-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.pillar-card {
  position: relative; background: var(--c-bg-raise);
  padding: clamp(24px, 1.8vw, 34px);
  display: flex; flex-direction: column; min-height: 340px;
  /* Strict hairline border in a low-opacity desaturated bronze for severity */
  border: 1px solid rgba(184, 151, 102, 0.25);
  transition: background .5s var(--ease), border-color .5s var(--ease);
}
.pillar-card:hover { background: var(--c-bg-raise2); border-color: var(--c-bronze-dk); }
/* Pillar 3 — Climate ring-fenced with the muted sage accent */
.pillar-card--climate { border-color: rgba(143, 151, 121, 0.4); }
.pillar-card--climate:hover { border-color: var(--c-sage-line); }
.pillar-card .pc-index { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.08em; color: var(--c-bronze); margin-bottom: 22px; }
.pillar-card--climate .pc-index { color: var(--c-sage); }
.pillar-card .pc-index { margin-bottom: 18px; }
.pillar-card .pc-title { font-family: var(--f-serif); font-size: clamp(1.3rem, 1.8vw, 1.6rem); line-height: 1.2; color: var(--c-ink); margin-bottom: 18px; }
.pillar-card .pc-summary { font-size: 0.9rem; color: var(--c-ink-2); line-height: 1.58; }
/* Two-paragraph practice-card body; second paragraph leads with bold "How we work:" */
.pillar-card .pc-text { font-size: 0.92rem; color: var(--c-ink-2); line-height: 1.62; margin-bottom: 16px; }
.pillar-card .pc-text strong { color: var(--c-ink); font-weight: 600; }
.pillar-card .pc-cta { margin-top: auto; padding-top: 30px; }

/* ----------------------------- LOGO GRIDS (pedigree + ecosystem) ----------------------------- */
.logo-block { margin-top: clamp(44px, 6vh, 76px); }
.logo-block:first-of-type { margin-top: 0; }
.logo-block-label { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-bronze); margin-bottom: 26px; padding-bottom: 14px; border-bottom: 1px solid var(--c-line); }
.logo-grid { display: grid; gap: 1px; background: var(--c-line); border: 1px solid var(--c-line); }
.logo-grid-academic { grid-template-columns: repeat(5, 1fr); }
.logo-grid-ecosystem { grid-template-columns: repeat(7, 1fr); }
.logo-cell { background: var(--c-bg-raise); aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center; padding: 22px; position: relative; transition: background .4s var(--ease); }
.logo-cell:hover { background: var(--c-bg-raise2); }
.logo-cell img {
  max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;
  filter: grayscale(1) invert(1) brightness(1.04);
  opacity: 0.6;                 /* monochrome, 60% per brief */
  transition: opacity .4s var(--ease);
}
.logo-cell:hover img { opacity: 0.95; }
/* Ecosystem logos are simple wordmarks/icons of mixed ink polarity; a uniform
   silhouette keeps every mark legible (plain invert drops the light ones). */
.logo-grid-ecosystem .logo-cell img { filter: grayscale(1) brightness(0) invert(0.82); }
/* Typographic fallback if a logo file is ever missing (JS adds .logo-missing). */
.logo-cell.logo-missing img { display: none; }
.logo-cell.logo-missing::after { content: attr(data-fallback); font-family: var(--f-serif); font-size: 0.92rem; line-height: 1.2; color: var(--c-ink-3); text-align: center; }

/* ----------------------------- ABOUT / FOUNDER (index #about) ----------------------------- */
.founder { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 90px); align-items: start; margin-bottom: clamp(56px, 8vh, 100px); }
.founder-name { font-family: var(--f-serif); font-size: clamp(1.6rem, 2.8vw, 2.1rem); color: var(--c-ink); line-height: 1.15; }
.founder-role { color: var(--c-ink-3); font-size: 0.6em; }
.founder-text { margin-top: 22px; font-size: clamp(1rem, 1.35vw, 1.1rem); color: var(--c-ink-2); line-height: 1.66; max-width: 62ch; }
.cv { display: flex; flex-direction: column; }
.cv li { display: grid; grid-template-columns: 130px 1fr; gap: 22px; padding: 18px 0; border-top: 1px solid var(--c-line); }
.cv-key { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-bronze); padding-top: 3px; }
.cv-val { font-size: 0.9rem; color: var(--c-ink-2); line-height: 1.55; }

/* ----------------------------- ALLIANCES split ----------------------------- */
.alliance-split { display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(28px, 5vw, 70px); align-items: start; }
.alliance-divider { width: 1px; background: var(--c-line); align-self: stretch; }
.alliance-role { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-bronze); margin-bottom: 14px; }
.alliance-col p:last-child { font-size: 0.94rem; color: var(--c-ink-2); line-height: 1.55; }

/* ----------------------------- CONTACT ----------------------------- */
.contact { position: relative; overflow: hidden; border-top: 1px solid var(--c-line); background: #1A1B28; }   /* synced to the Thesis Banner deep slate */
.contact .contact-surface { display: none; }   /* flat Gunmetal Slate, no texture overlay */
.contact-surface { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(11,12,14,0.82) 0%, rgba(11,12,14,0.92) 100%), url("Textured Black Surface.jpg") center/cover no-repeat; }
.contact-inner { position: relative; z-index: 1; text-align: center; }
.contact-title { font-family: var(--f-serif); font-size: clamp(1.45rem, 2vw, 1.95rem); font-weight: 500; line-height: 1.15; color: var(--c-gold); }   /* size/weight synced to Service-Card titles; colour synced to the Services title */
.contact-lede { margin: 24px auto 38px; max-width: 56ch; color: rgba(255,255,255,0.82); font-size: 1.05rem; }
.contact .section-kicker { color: rgba(255,255,255,0.9); }   /* invert kicker for the dark Gunmetal panel */
.contact-btn { font-family: var(--f-mono); letter-spacing: 0.02em; }

/* ----------------------------- FOOTER ----------------------------- */
.site-footer { border-top: 1px solid var(--c-line); padding: 60px 0 50px; }
.site-footer .container { max-width: none; }   /* full-bleed gutter — logo aligns to the section-title left margin */
/* 2-column footer: big logo left, all text right (flush to the right margin) */
.footer-inner { display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: clamp(32px, 6vw, 100px); }
.footer-logo { flex: none; }
.footer-logo-img { width: 292px; height: 72px; max-width: none; max-height: none; display: block; object-fit: contain; }   /* horizontal logo (same file as the header), fixed size: 292×72, 260×64 on phones */
.footer-text { display: flex; flex-direction: column; align-items: flex-end; gap: 16px; text-align: right; }
.footer-nav { display: flex; gap: 26px; flex-wrap: wrap; justify-content: flex-end; }
.footer-nav a { font-size: 0.84rem; color: var(--c-ink-2); }
.footer-nav a:hover { color: var(--c-bronze); }
.footer-statement { font-size: 0.82rem; color: var(--c-ink-3); line-height: 1.6; max-width: 80ch; }
.footer-meta { font-family: var(--f-mono); font-size: 0.74rem; color: var(--c-ink-3); display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: flex-end; letter-spacing: 0.03em; }
.footer-meta a { color: var(--c-ink-2); }
.footer-meta a:hover { color: var(--c-bronze); }

/* =====================================================================
   SERVICES.HTML — THE QUANTITATIVE DEEP DIVE
   ===================================================================== */

/* Page hero (compact, no full-viewport) */
.page-hero { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 96px 0 72px; border-bottom: 1px solid var(--c-line); position: relative; overflow: hidden; }   /* match the homepage hero height + vertical centering */
.page-hero-surface { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(11,12,14,0.74) 0%, var(--c-bg) 100%), url("Textured Black Surface.jpg") center/cover no-repeat; opacity: 0.6; }
.page-hero .container { position: relative; z-index: 1; max-width: none; }   /* full-bleed left, like the homepage hero */
.page-hero h1 { font-family: var(--f-serif); font-weight: 400; letter-spacing: -0.015em; max-width: none; }   /* standardized hero size across Services + Research */
.page-hero .page-sub { margin-top: 26px; max-width: 70ch; font-size: clamp(1.02rem, 1.4vw, 1.16rem); color: var(--c-ink-2); line-height: 1.6; }
/* Research hero — oversized display title, forced onto a single line (no wrap) */
.page-hero--xl h1 { white-space: nowrap; }   /* Research hero keeps the shared size, forced onto a single line */
.page-hero .hero-slogan { margin-top: 26px; }
.page-hero .hero-actions { margin-top: 36px; }
/* ---- Services hero: exact 50/50 vertical split ---- */
.page-hero--split { height: 100vh; min-height: 100vh; display: flex; flex-direction: column; justify-content: flex-start; padding: 0 !important; overflow: hidden; border-bottom: 0; margin-bottom: 0 !important; padding-bottom: 0 !important; }
/* Top half — dark; content anchored to the bottom with a one-button-height gap below the buttons */
.hero-top-half { position: relative; height: 66.66vh; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: calc(0.92rem + 32px); }
.hero-top-half .container { position: relative; z-index: 1; }
/* ---- Events hero: background-image-ready surface + dedicated dark overlay ---- */
.page-hero .hero-bg-image { background: var(--hero-image, url("Textured Black Surface.jpg")) center center / cover no-repeat; opacity: 1; }   /* bg-cover bg-center placeholder; drop in a photo later by setting --hero-image on the .page-hero section */
.page-hero-overlay { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(11,12,14,0.35) 0%, rgba(11,12,14,0.85) 100%); pointer-events: none; }   /* dark layer above the image, below the text, to guarantee legibility once a photo is set */
.page-hero .hero-lede { margin-top: 24px; max-width: 42rem; font-family: var(--f-sans); font-weight: 400; font-size: clamp(1.05rem, 1.5vw, 1.28rem); line-height: 1.65; letter-spacing: 0.005em; color: var(--c-ink-2); }   /* max-w-2xl equivalent, balanced leading, soft off-white */
/* Bottom half (50vh) — cloned 3-Pillar grid: white, full-width, gold titles, vertical dividers, flush bottom */
.hero-pillars { height: 33.33vh; width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); background: #FFFFFF; border-top: 1px solid rgba(20, 22, 26, 0.16); margin: 0 !important; padding: 0 !important; }
.hero-pillars--2 { grid-template-columns: repeat(2, 1fr); }   /* Events page: exactly 2 white cards */
.hero-pillar { display: flex; align-items: center; justify-content: center; text-align: center; height: 100%; padding: clamp(20px, 3vw, 44px); background: #FFFFFF; border: 0; margin: 0 !important; transition: background .35s var(--ease); }
.hero-pillar + .hero-pillar { border-left: 1px solid rgba(20, 22, 26, 0.16); }   /* same thin vertical dividers as the homepage grid */
.hero-pillar:hover { background: #F4F1EA; }
.hero-pillar-title { font-family: var(--f-serif); color: var(--c-gold); font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500; line-height: 1.25; text-align: center; transition: color .35s var(--ease); }   /* exact homepage gold title */
.hero-pillar:hover .hero-pillar-title { color: var(--c-bronze-dk); }

/* ---- Homepage hero: 'Two Doors' 2/3 dark + 1/3 white split ---- */
.hero.hero--split { height: 100vh; min-height: 100vh; display: flex; flex-direction: column; justify-content: flex-start; padding: 0 !important; overflow: hidden; border-bottom: 0; margin-bottom: 0 !important; padding-bottom: 0 !important; }
.hero.hero--split .hero-inner { margin: 0; }
/* Anchor the top content to the bottom: gap below the buttons == one button height (0.92rem + 32px) */
.hero.hero--split .hero-top-half { justify-content: flex-end; padding-bottom: calc(0.92rem + 32px); }
/* Two-door cards: stacked gold title + dark-grey sub, centred both axes (gold overrides the white-bg dark title used on Services) */
.hero .hero-pillar { flex-direction: column; gap: clamp(8px, 1.2vh, 14px); }
.hero .hero-pillar-title { color: var(--c-gold); font-size: clamp(1.3rem, 2vw, 1.75rem); }
.hero .hero-pillar:hover .hero-pillar-title { color: var(--c-bronze-dk); }
.hero .hero-pillar-sub { font-size: clamp(0.84rem, 1vw, 0.98rem); color: #5A5E64; line-height: 1.45; max-width: 36ch; text-align: center; }
/* 'Two Doors' content: prominent trigger, supporting body, gold action */
.hero .hero-pillar { gap: clamp(12px, 1.6vh, 20px); }
.hero .hero-pillar-trigger { font-family: var(--f-serif); font-size: clamp(1.15rem, 1.7vw, 1.55rem); font-weight: 500; color: #14161A; line-height: 1.28; max-width: 30ch; }
.hero .hero-pillar-body { font-size: clamp(0.86rem, 1vw, 0.98rem); color: #5A5E64; line-height: 1.5; max-width: 42ch; }
.hero .hero-pillar-action { font-family: var(--f-mono); font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-bronze-dk); transition: color .3s var(--ease); }
.hero .hero-pillar:hover .hero-pillar-action { color: var(--c-gold); }
/* In-door topic routers: quiet mono small-caps chips, '/'-separated, gold on hover */
.hero .hero-pillar-action { text-decoration: none; }
.hero .door-chips { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 0; margin-top: 4px; max-width: 40ch; }
.hero .door-chip { font-family: var(--f-mono); font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: #3A3D42; text-decoration: none; padding: 2px 10px; position: relative; transition: color .25s var(--ease); }
.hero .door-chip + .door-chip::before { content: "/"; position: absolute; left: -2px; color: rgba(20, 22, 26, 0.22); }
.hero .door-chip::after { display: none; }
.hero .door-chip:hover { color: var(--c-bronze-dk); text-decoration: underline; text-underline-offset: 3px; }

/* =====================================================================
   RESEARCH — Workshops, lectures & talks: solid black surface, gold accents,
   4-column ledger rows  [date + type] | [logo] | [content] | [status].
   ===================================================================== */
#engagements { background: #2E3047; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(64px, 9vh, 120px); }   /* top matches Bridging; bottom gives room below the CTA */
#engagements .container { max-width: none; }   /* full-bleed gutter width, matches the 'Bridging' section */
/* Title scaled up toward the oversized hero display size */
#engagements .section-title { color: var(--c-ink); font-weight: 500; letter-spacing: -0.015em; }

/* 4-column rows; extra top breathing room between the title and the first row */
#engagements .eng-rows { margin-top: clamp(80px, 14vh, 168px); position: relative; }   /* 2× the prior gap below the section title */
#engagements .eng-row {
  display: grid;
  grid-template-columns: minmax(110px, 0.7fr) minmax(150px, 1fr) 2.6fr minmax(110px, auto);
  gap: clamp(20px, 3vw, 56px); align-items: start;
  padding: clamp(30px, 4.5vh, 52px) 0;
  position: relative;
}
/* Dividers drawn left -> right on scroll, exactly like the homepage 'Bridging' rows.
   Pseudo-element lines (scaleX 0 -> 1) replace static borders; JS toggles .draw-in. */
#engagements .eng-row::after,
#engagements .eng-row:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(255, 255, 255, 0.22);
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#engagements .eng-row::after { bottom: 0; }
#engagements .eng-row:first-child::before { top: 0; }
#engagements .eng-row.draw-in::after,
#engagements .eng-row.draw-in::before { transform: scaleX(1); }
/* last row keeps its animated bottom divider, matching the rows above */
/* Centered 'View All Sessions' CTA below the final divider (same spacing as the Ongoing Research CTA) */
#engagements .sessions-cta, #presence .sessions-cta { display: flex; justify-content: center; margin-top: clamp(60px, 8vh, 96px); }
/* 1 — far left: date (top) + event type (bottom) — enlarged */
#engagements .eng-meta { display: flex; flex-direction: column; gap: 8px; }
#engagements .eng-date { font-family: var(--f-mono); font-size: clamp(1.1rem, 1.5vw, 1.4rem); letter-spacing: 0.04em; color: var(--c-gold); }
#engagements .eng-type { font-family: var(--f-mono); font-size: clamp(0.8rem, 1vw, 0.92rem); letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-ink-3); }
/* 2 — middle-left: institution logo, inverted for the dark surface — more prominent */
#engagements .eng-logo-cell { align-self: start; }
#engagements .eng-logo { height: 58px; width: auto; max-width: 220px; object-fit: contain; filter: grayscale(1) brightness(0) invert(0.82); opacity: 0.82; }

/* all-sessions.html only (.eng-compact): logos scaled ~80% and the logo column
   narrowed so the text block shifts left and the description gains width.
   Scoped so research.html's #engagements section is unaffected. */
#engagements.eng-compact .eng-logo { height: 46px; max-width: 176px; }
/* Institutional Presence logos: no fixed box — centred in the cell, sized per-logo by
   max-height so square and wide marks read at a comparable visual weight. */
#presence.eng-compact .eng-logo-cell { display: flex; align-items: center; justify-content: center; }
#presence.eng-compact .eng-logo { height: auto; width: auto; max-width: 100%; object-fit: contain; }
#presence .eng-logo.logo-waib { max-height: 87px; }   /* 58 × 1.5 */
#presence .eng-logo.logo-pot  { max-height: 69px; }   /* 46 × 1.5 */
#presence .eng-logo.logo-pbw  { max-height: 48px; }   /* 40 × 1.2 */
#presence .eng-logo.logo-daf  { max-height: 99px; }   /* 58 × 1.7 */
#engagements.eng-compact .eng-row { grid-template-columns: minmax(100px, 0.6fr) minmax(120px, 0.7fr) 3.2fr minmax(100px, auto); }
/* Workshops (ETH) + Institutional Presence share ONE 3-column template with FIXED date and
   logo columns, so the text column begins on the exact same vertical line in both sections. */
#engagements.eng-compact .eng-row--wide, #presence.eng-compact .eng-row { grid-template-columns: 140px 180px minmax(0, 1fr); }
/* Fluid section heading so 'Workshops, Lectures and Talks' (and Institutional Presence) scale down on 13-inch screens. */
#engagements.eng-compact .section-title, #presence.eng-compact .section-title { }
/* Bottom action row: 'Official Announcement' (left) and See more / Show less (right) on one baseline. */
#engagements .eng-title--date, #presence .eng-title--date { font-family: var(--f-mono); font-size: clamp(1.1rem, 1.5vw, 1.4rem); font-weight: 400; letter-spacing: 0.04em; color: var(--c-gold); line-height: 1.3; margin: 0; }

/* Line-clamp "See more / Show less" for long engagement descriptions.
   Clamps to 2 lines until JS adds .expanded. Scoped to #engagements. */
#engagements .clamp-text, #presence .clamp-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#engagements .clamp-text.expanded, #presence .clamp-text.expanded { -webkit-line-clamp: unset; display: block; overflow: visible; }
#engagements .clamp-toggle { flex: none; white-space: nowrap; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: currentColor; opacity: 0.6; transition: opacity 0.2s; }
#engagements .clamp-toggle:hover { opacity: 1; }
/* Institutional Presence action bar on WHITE: borderless text controls in dark ink. */
#presence .clamp-toggle { flex: none; white-space: nowrap; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: #14161A; opacity: 0.6; transition: opacity 0.2s; }
#presence .clamp-toggle:hover { opacity: 1; }
#presence .eng-actions a { color: #14161A; }
/* 3 — middle-right: title, venue, description */
#engagements .eng-content { display: flex; flex-direction: column; gap: 10px; }
#engagements .eng-title { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; color: var(--c-ink); line-height: 1.2; }
#engagements .eng-venue { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: var(--c-ink-3); }
#engagements .eng-role { font-size: clamp(1rem, 1.25vw, 1.12rem); color: var(--c-ink-2); line-height: 1.7; margin-top: 4px; }
/* 4 — far right: status pill */
#engagements .eng-row > .lr-status { justify-self: end; align-self: start; }
#engagements .eng-row:last-child { border-bottom: 0; }   /* no trailing divider; section bottom padding gives the breathing room */
#engagements .eng-logo-cell.logo-missing::after { color: var(--c-ink-3); }

/* --- About page only: Institutional Presence on a WHITE surface ---
   Gold accents (eng-date, lr-status bronze) are kept; every white/gray ink
   is inverted to near-black. Scoped to .eng-light so #engagements on
   research.html keeps the dark theme. */
#engagements.eng-light { background: #FFFFFF; }
#engagements.eng-light .section-title { color: #14161A; }
#engagements.eng-light .eng-title { color: #14161A; }
#engagements.eng-light .eng-role { color: #1A1C20; }
#engagements.eng-light .eng-type,
#engagements.eng-light .eng-venue,
#engagements.eng-light .eng-logo-cell.logo-missing::after { color: #5A5E64; }
#engagements.eng-light .eng-row::after,
#engagements.eng-light .eng-row:first-child::before { background: rgba(20, 22, 26, 0.18); }
#engagements.eng-light .btn-primary { color: #14161A; }
#engagements.eng-light .btn-primary:hover { color: #14161A; }

/* =====================================================================
   RESEARCH — Ongoing Research: hybrid (Ecosystem header + 3-Pillar card grid).
   ===================================================================== */
#pipeline { background: #FFFFFF; padding-top: clamp(64px, 9vh, 120px); padding-bottom: 0; }   /* inverted to white; top matches Ecosystem; bottom flush */
#pipeline .container { max-width: none; }   /* header full-bleed gutter, matches the Ecosystem header */
#pipeline .pedigree-head .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }   /* white section -> dark title, matched to Workshops / Research Areas */
#pipeline .pedigree-intro { color: #1A1C20; }
#pipeline .fb-grid { --fb-line: rgba(20, 22, 26, 0.16); margin-top: clamp(40px, 6vh, 64px); }   /* normalized to the standard header-to-content gap */
/* Card hover: 'pop up' + gold border, matching the Quantitative Development cards */
#pipeline .fb-col { position: relative; transition: background .4s var(--ease), box-shadow .4s var(--ease); }
#pipeline .fb-col:hover { box-shadow: inset 0 0 0 1px var(--c-gold); background: #F7F4EE; z-index: 1; }
/* Cover image at the very top of each card */
#pipeline .pl-cover { width: 100%; height: 170px; object-fit: cover; display: block; margin-bottom: clamp(18px, 2vw, 26px); background: #ECECEC; }   /* shorter panoramic header (was 220px) */
/* Status badge anchored to the card's bottom-right corner; border wraps the text */
#pipeline .pl-badge { position: absolute; bottom: 24px; right: 24px; z-index: 2; display: inline-block; width: max-content; white-space: nowrap; font-family: var(--f-mono); font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-gold); border: 1px solid var(--c-gold); background: rgba(11, 12, 14, 0.62); padding: 4px 10px; }
/* 'Read more' link, right-aligned just above the status badge */
#pipeline .pl-readmore, #pipeline .pl-readmore:visited { position: absolute; right: 24px; bottom: 56px; z-index: 2; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.04em; color: var(--c-gold); text-decoration: none; transition: opacity .3s var(--ease); }
#pipeline .pl-readmore:hover { text-decoration: underline; opacity: 0.72; }
/* Centered 'View All Research' CTA below the trimmed grid */
#pipeline .pipeline-cta { display: flex; justify-content: center; margin-top: clamp(60px, 8vh, 96px); }
#pipeline:has(.pipeline-cta) { padding-bottom: clamp(64px, 9vh, 120px); }   /* restore bottom padding only when the CTA is present (main page) */
#pipeline .fb-col .fb-title { color: var(--c-gold); margin-bottom: 16px; }   /* gold kept exactly as specified */
#pipeline .fb-col { padding-top: clamp(22px, 2.6vw, 40px); padding-bottom: clamp(22px, 2.6vw, 40px); }   /* tighter top/bottom than the shared .fb-col */
#pipeline .fb-col .fb-text { color: #1A1C20; font-size: 0.86rem; line-height: 1.5; margin-bottom: 0; }   /* remove excess gap before the collaborators footer */
/* Collaborators block pinned to the card bottom */
#pipeline .fb-col .pl-collab { margin-top: 0; padding-top: 16px; }   /* sit right below the text; gap equals the 16px title-to-text gap */
#pipeline .pl-collab-label { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.04em; color: var(--c-gold); margin-bottom: 16px; }
#pipeline .pl-collab-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; }
#pipeline .pl-collab-logos img { height: 30px; width: auto; max-width: 92px; object-fit: contain; filter: grayscale(1); opacity: 0.72; }
/* Banque de France mark: larger, full-contrast, and multiplied so its white/grey
   JPEG background disappears into the white card. */
#pipeline .pl-collab-logos img.bdf-logo { height: auto; width: auto; max-height: 75px; max-width: 220px; filter: none; opacity: 1; mix-blend-mode: multiply; }   /* ~1.5x larger (50px -> 75px); width capped so it never reaches the WORKING PAPER badge */
#pipeline .fb-col:nth-child(n+4) { border-top: 1px solid var(--fb-line); }   /* divider between the two card rows */
#pipeline .fb-col:nth-child(3n+1) { border-left: 0; }   /* no stray left border on row-2 first column */

/* =====================================================================
   RESEARCH — Research areas: split header + full-bleed 2×2 grid (gold titles).
   ===================================================================== */
#research-areas { background: #FFFFFF; padding-top: clamp(64px, 9vh, 120px); }   /* white background, black text */
#research-areas .container { max-width: none; }   /* full-bleed gutter */
/* Asymmetric split: header left, accordion right */
#research-areas .ra-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: start; }
#research-areas .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }
#research-areas .pedigree-intro { color: #1A1C20; margin-top: 26px; max-width: 36ch; }
/* Accordion — clean text rows divided by hairlines, no boxes */
#research-areas .ra-accordion { border-top: 1px solid rgba(20, 22, 26, 0.18); margin-top: clamp(44px, 5.5vw, 84px); }   /* drop the first item below the title baseline */
#research-areas .ra-item { border-bottom: 1px solid rgba(20, 22, 26, 0.18); }
#research-areas .ra-row { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: none; border: 0; cursor: pointer; padding: clamp(20px, 2.4vw, 30px) 0; text-align: left; }
#research-areas .ra-title { font-family: var(--f-serif); font-size: clamp(1.25rem, 1.9vw, 1.6rem); font-weight: 500; color: #14161A; line-height: 1.25; transition: color .3s var(--ease); }
#research-areas .ra-icon { flex: none; font-family: var(--f-sans); font-size: 1.7rem; line-height: 1; color: var(--c-bronze-dk); transition: transform .35s var(--ease), color .3s var(--ease); }
#research-areas .ra-row:hover .ra-title { color: var(--c-bronze-dk); }
#research-areas .ra-row:hover .ra-icon { color: var(--c-gold); }
#research-areas .ra-item.open .ra-icon { transform: rotate(45deg); }   /* + becomes × */
#research-areas .ra-panel { overflow: hidden; max-height: 0; transition: max-height .45s var(--ease); }
#research-areas .ra-panel p { font-size: clamp(1rem, 1.2vw, 1.1rem); color: #1A1C20; line-height: 1.7; padding-bottom: clamp(20px, 2.4vw, 30px); max-width: none; padding-right: clamp(0px, 2vw, 32px); }   /* fill the accordion column; small right inset keeps text off the edge */
#research-areas .ra-item.open .ra-panel { max-height: 340px; }

/* =====================================================================
   RESEARCH — Institutional R&D Commitment: white, asymmetric 1fr 2fr split.
   ===================================================================== */
#rd-commitment { background: var(--c-bg); padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(40px, 6vh, 84px); }   /* top matches Research Areas; bottom trimmed to ~1/3 */
#rd-commitment .container { max-width: none; }   /* full-bleed gutter */
#rd-commitment .rd-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: start; }   /* 1fr 1fr — identical to Research Areas, so the vertical divider aligns */
#rd-commitment .section-title { color: var(--c-ink); font-weight: 500; letter-spacing: -0.015em; }   /* matched to the Workshops title */
#rd-commitment .rd-intro, #rd-commitment .rd-outro { font-size: clamp(1rem, 1.25vw, 1.14rem); color: var(--c-ink-2); line-height: 1.72; max-width: none; }   /* span the full column to the right margin */
#rd-commitment .rd-list { list-style: none; margin: clamp(26px, 3.4vh, 40px) 0; padding: 0; }
#rd-commitment .rd-list li { position: relative; padding-left: 26px; margin-bottom: 16px; font-size: clamp(1rem, 1.2vw, 1.1rem); color: var(--c-ink-2); line-height: 1.6; max-width: none; }
#rd-commitment .rd-list li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 6px; height: 6px; background: #FFFFFF; border-radius: 50%; }   /* white bullet dots */
/* Academic trust-signal logo block — homepage 'Foundational Research & Rigor' treatment, on the dark surface */
#rd-commitment { --logo-scale: 1; }   /* logos scale down on smaller laptops (media queries below) */
#rd-commitment .rd-logos { margin-top: clamp(48px, 7vh, 96px); }
#rd-commitment .logo-strip { flex-wrap: nowrap; align-items: flex-start; gap: clamp(0.8rem, 1.8vw, 2.5rem); }
#rd-commitment .logo-strip--left { justify-content: flex-start; gap: clamp(3rem, 7vw, 8rem); }
#rd-commitment .logo-strip-block { padding-bottom: 0; }   /* trim dead space below the logos */
#rd-commitment .logo-strip-overline { color: var(--c-gold); }   /* gold overline, exactly as on the homepage */
/* Academic & Research logos: per-logo sizing copied verbatim from the homepage #pedigree
   block so the strip renders 100% identically on both pages (dark surface, inverted marks). */
#rd-commitment .logo-strip-item { min-height: 0; }
#rd-commitment .logo-strip-item img { height: calc(50px * var(--logo-scale)); width: auto; max-width: calc(215px * var(--logo-scale)); object-fit: contain; filter: grayscale(1) brightness(0) invert(0.82); opacity: 0.82; }
#rd-commitment .logo-strip-item[data-fallback="ENS"] img             { height: calc(50px * var(--logo-scale)); max-width: calc(215px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="CNRS"] img            { height: calc(65px * var(--logo-scale)); max-width: calc(280px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="ERC"] img             { height: calc(75px * var(--logo-scale)); max-width: calc(323px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="Sorbonne"] img        { height: calc(60px * var(--logo-scale)); max-width: calc(258px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="CentraleSupélec"] img { height: calc(65px * var(--logo-scale)); max-width: calc(280px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="ETH Zürich"] img      { height: calc(45px * var(--logo-scale)); max-width: calc(194px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="ESILV"] img           { height: calc(75px * var(--logo-scale)); max-width: calc(323px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="Inria"] img           { height: calc(46px * var(--logo-scale)); max-width: calc(210px * var(--logo-scale)); }
#rd-commitment .logo-strip-item[data-fallback="FSMP"] img            { height: calc(60px * var(--logo-scale)); max-width: calc(200px * var(--logo-scale)); }
#rd-commitment .logo-strip-item:hover img { opacity: 1; }
#rd-commitment .logo-strip-item.logo-missing::after { color: var(--c-ink-3); }

/* Independence framing strip + audience */
.framing { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--c-line); border: 1px solid var(--c-line); }
.framing .fr-cell { background: var(--c-bg-raise); padding: 26px clamp(18px, 1.6vw, 26px); }
.framing .fr-idx { font-family: var(--f-serif); font-size: 1.2rem; color: var(--c-bronze); }
.framing .fr-cell h3 { font-size: 0.96rem; color: var(--c-ink); margin: 12px 0 8px; line-height: 1.25; }
.framing .fr-cell p { font-size: 0.82rem; color: var(--c-ink-3); line-height: 1.5; }

.audience-band { display: flex; flex-wrap: wrap; gap: 10px; }
.audience-chip { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.04em; color: var(--c-ink-2); border: 1px solid var(--c-line); padding: 8px 14px; }

/* Pillar section header on services. Sections are colour-blocked and sit flush:
   no bottom padding (grid edge meets the next section), generous card padding. */
.pillar-section { scroll-margin-top: 110px; padding-bottom: 0; }
.pillar-section .fb-col { padding-block: clamp(44px, 6vh, 88px); }
/* Same hover dynamics as the homepage cards: background pop + gold border */
.pillar-section .fb-col:hover { box-shadow: inset 0 0 0 1px var(--c-gold); background: var(--c-bg-raise2); }
.pillar-section--light .fb-col:hover { background: #F2EFE9; }
.pillar-section--gold .fb-col:hover { background: #C9A94A; }
/* Strategy section has a gold background — make text selection legible (white) */
#strategy-due-diligence ::selection { background-color: #FFFFFF; color: #2E3047; }

/* ===== 3-colour scroll rhythm across the three pillars ===== */
/* Section 1 — White: black body text, gold accents kept. */
.pillar-section--light { background: #FFFFFF; }
.pillar-section--light .section-title { color: #14161A; }
.pillar-section--light .fb-grid { --fb-line: rgba(20, 22, 26, 0.16); }
.pillar-section--light .fb-title { color: var(--c-bronze); }
.pillar-section--light .ps-text { color: #14161A; }
.pillar-section--light .ps-solution + .ps-text { color: #2E3047; }
.pillar-section--light .ps-pain { color: #4A4E54; }
.pillar-section--light .ps-solution { color: var(--c-bronze); }
/* Section 2 — Black: site default (white text, gold accents) — no overrides. */
/* Solid-black pillar variant (used by Quantitative Development) */
.pillar-section--dark { background: #2E3047; }
/* Section 3 — Gold (#B89766): black text, black accents for contrast. */
.pillar-section--gold { background: #D4AF37; }   /* solid brand gold (Strategy section) */
.pillar-section--gold .section-title { color: #14161A; }
.pillar-section--gold .fb-grid { --fb-line: rgba(0, 0, 0, 0.24); }
.pillar-section--gold .fb-title { color: #14161A; }
.pillar-section--gold .ps-text { color: #1A1C20; }
.pillar-section--gold .ps-solution + .ps-text { color: #2E3047; }
.pillar-section--gold .ps-pain,
.pillar-section--gold .ps-solution { color: #14161A; }
.pillar-head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 14px; }
.pillar-head .ph-idx { font-family: var(--f-mono); font-size: 0.82rem; color: var(--c-bronze); }
.pillar-section--climate .ph-idx { color: var(--c-sage); }
.pillar-head h2 { font-family: var(--f-serif); font-size: clamp(1.6rem, 2.8vw, 2.2rem); line-height: 1.16; color: var(--c-ink); }
.pillar-intro { color: var(--c-ink-2); font-size: 1rem; line-height: 1.6; max-width: 76ch; margin-bottom: 38px; }
/* Section subtitle under each pillar title — elegant serif italic */
.pillar-subtitle { font-family: var(--f-serif); font-style: italic; font-size: clamp(1.08rem, 1.6vw, 1.32rem); color: var(--c-ink-2); line-height: 1.4; max-width: 70ch; margin-bottom: clamp(34px, 5vh, 52px); }

/* Pain / Solution blocks inside the expanded accordion — monospaced labels,
   clean typographic hierarchy. Pain reads muted; Solution carries the gold accent. */
.pa-ps + .pa-ps { margin-top: 22px; }   /* divider line removed */
/* top (former "Pain") block grows so the SOLUTION blocks align across the row */
.pillar-section .fb-col .pa-ps:first-of-type { flex-grow: 1; }   /* pushes every 'Solution' block to the same bottom line across the row */
/* Centered gold card titles + enlarged gold 'Solution' label — matched to the homepage 3-Pillar cards */
.pillar-section .fb-title { text-align: center; font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500; }
.pillar-section--dark .fb-title,
.pillar-section--light .fb-title { color: var(--c-gold); }
.pillar-section .ps-solution { font-size: 0.8rem; }
.pillar-section--dark .ps-solution,
.pillar-section--light .ps-solution { color: var(--c-gold); }
.ps-label { font-family: var(--f-mono); font-size: 0.64rem; letter-spacing: 0.18em; text-transform: uppercase; margin-bottom: 11px; }
.ps-pain { color: var(--c-ink-3); }
.ps-solution { color: var(--c-bronze); }
.ps-text { font-size: 0.96rem; color: var(--c-ink-2); line-height: 1.64; max-width: 82ch; }
.ps-solution + .ps-text { color: var(--c-ink); }
.pillar-why { font-size: 0.92rem; color: var(--c-ink-2); line-height: 1.6; max-width: 80ch; margin-top: 30px; }
.why-label { display: inline-block; font-family: var(--f-mono); font-size: 0.64rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-bronze); margin-right: 10px; border: 1px solid var(--c-bronze-dk); padding: 2px 8px; vertical-align: middle; }
.pillar-section--climate .why-label { color: var(--c-sage); border-color: var(--c-sage-line); }

/* ===== FULL-BLEED EDGE-TO-EDGE GRID (homepage practice + services pillars) =====
   Rendered as a direct child of <section> (outside .container) so it spans the
   full viewport width. Columns sit flush, separated by 1px grid lines, with
   internal padding for text breathability. Equal-height columns (grid stretch). */
.fb-grid {
  --fb-line: var(--c-line);
  display: grid; width: 100%; align-items: stretch;
  border-top: 1px solid var(--fb-line);
  border-bottom: 1px solid var(--fb-line);
}
.fb-grid--3 { grid-template-columns: repeat(3, 1fr); }
.fb-grid--2 { grid-template-columns: repeat(2, 1fr); }
.fb-col {
  height: 100%;
  padding: clamp(28px, 3.4vw, 56px);
  display: flex; flex-direction: column;
  transition: background .4s var(--ease);
}
.fb-col + .fb-col { border-left: 1px solid var(--fb-line); }
.fb-title { font-family: var(--f-serif); font-size: clamp(1.2rem, 1.8vw, 1.5rem); line-height: 1.22; color: var(--c-bronze); margin-bottom: 22px; }
.fb-text { font-size: 0.92rem; color: var(--c-ink-2); line-height: 1.62; margin-bottom: 16px; }
.fb-text strong { color: var(--c-ink); font-weight: 600; }
.fb-cta { margin-top: auto; padding-top: 26px; }

/* Typographic regulatory citations (shared).
   COMPLIANCE: regulators are NEVER rendered as logos/icons — only neutral
   monospaced reference tags. */
.legal-citation { font-family: var(--f-mono); font-size: 0.66rem; letter-spacing: 0.02em; color: var(--c-ink-3); border: 1px solid var(--c-line); padding: 2px 7px; white-space: nowrap; }
.pa-citations .legal-citation { color: var(--c-bronze); border-color: var(--c-bronze-dk); }

/* Pipeline + walled commercial on services */
.pipeline-note { font-size: 0.88rem; color: var(--c-ink-3); line-height: 1.6; border-left: 1px solid var(--c-bronze-dk); padding-left: 18px; max-width: 84ch; }
.pipeline-tag { display: inline-block; font-family: var(--f-mono); font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-bronze); margin-right: 10px; }

/* Commercial Web3 — isolated at the absolute bottom of services.html,
   visually demoted: no card border, lowered opacity. */
#commercial.section { border-top: 1px solid var(--c-line); }
.commercial-wall { border: 0; padding: 0; opacity: 0.75; }
.commercial-kicker { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-ink-3); margin-bottom: 16px; }
.commercial-title { font-family: var(--f-serif); font-size: clamp(1.5rem, 2.6vw, 2.1rem); color: var(--c-ink-2); margin-bottom: 16px; }
.commercial-note { font-size: 0.94rem; color: var(--c-ink-3); line-height: 1.6; max-width: 78ch; margin-bottom: 36px; }
.commercial-items { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.commercial-item h3 { font-family: var(--f-serif); font-size: 1.1rem; color: var(--c-ink-2); margin-bottom: 10px; line-height: 1.25; }
.commercial-item p { font-size: 0.85rem; color: var(--c-ink-3); line-height: 1.55; }

/* =====================================================================
   RESEARCH.HTML — academic archive aesthetic (text-driven, no imagery)
   ===================================================================== */

/* Terminal-style action link (also used in the homepage Insights block) */
.terminal-link {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--f-mono); font-size: 0.82rem; letter-spacing: 0.03em;
  color: var(--c-bronze); border: 1px solid var(--c-bronze-dk);
  padding: 13px 20px; transition: background .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease);
}
.terminal-link .tl-caret { color: var(--c-bronze); }
.terminal-link:hover { background: var(--c-bronze-tn); color: #fff; border-color: var(--c-bronze); }

/* Section 1 — Academic Engagements: a severe mono ledger, no images */
.ledger { border-top: 1px solid var(--c-line); }
.ledger-row {
  display: grid; grid-template-columns: 110px 96px 1fr auto;
  gap: clamp(16px, 2vw, 36px); align-items: start;
  padding: 28px 0; border-bottom: 1px solid var(--c-line);
}

/* Monochrome institutional logo — a small scan anchor, height-locked so it
   never breaks the typographic vertical rhythm. Luminance-inverted so dark-ink
   logos stay visible on charcoal (plain grayscale would vanish here). */
.eng-logo-cell { display: inline-flex; align-items: center; min-height: 32px; align-self: start; margin-top: 2px; }
.eng-logo {
  height: 32px; width: auto; max-width: 96px; object-fit: contain;
  filter: grayscale(1) invert(1) brightness(1.04);
  opacity: 0.7;                 /* muted */
  transition: opacity .4s var(--ease);
}
.ledger-row:hover .eng-logo { opacity: 0.92; }
/* Graceful text fallback when a placeholder logo file is absent */
.eng-logo-cell.logo-missing .eng-logo { display: none; }
.eng-logo-cell.logo-missing::after {
  content: attr(data-fallback);
  font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--c-ink-3); line-height: 1.3;
}
.lr-meta { display: flex; flex-direction: column; gap: 6px; }
.lr-date { font-family: var(--f-mono); font-size: 0.92rem; color: var(--c-bronze); }
.lr-type { font-family: var(--f-mono); font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-ink-3); }
.lr-title { font-family: var(--f-serif); font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.25; color: var(--c-ink); }
.lr-venue { font-size: 0.9rem; color: var(--c-ink-2); margin-top: 9px; }
.lr-role { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.02em; color: var(--c-ink-3); margin-top: 9px; line-height: 1.5; }
.lr-status { font-family: var(--f-mono); font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-bronze); border: 1px solid var(--c-bronze-dk); padding: 4px 9px; white-space: nowrap; align-self: start; }
.ledger-note { margin-top: 24px; font-family: var(--f-mono); font-size: 0.74rem; color: var(--c-ink-3); letter-spacing: 0.02em; }

/* Section 2 — Research Pipeline: ongoing investigations */
.pipeline-list { display: flex; flex-direction: column; gap: 1px; background: var(--c-line); border: 1px solid var(--c-line); }
.pipeline-item { background: var(--c-bg-raise); padding: clamp(26px, 2.8vw, 40px); }
.pl-head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.pl-status { font-family: var(--f-mono); font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-bronze); border: 1px solid var(--c-bronze-dk); padding: 3px 9px; white-space: nowrap; }
.pl-head h3 { font-family: var(--f-serif); font-size: clamp(1.2rem, 1.9vw, 1.55rem); line-height: 1.22; color: var(--c-ink); }
.pl-desc { font-size: 0.95rem; color: var(--c-ink-2); line-height: 1.62; max-width: 82ch; }
.pl-foot { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 20px; align-items: center; }
.pl-feeds { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.03em; color: var(--c-ink-3); }
.pl-focus { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-bronze); margin-bottom: 22px; }

/* =====================================================================
   BLUEPRINT SVG SCHEMATICS — retint the provided infographics into glowing
   monochrome engineering diagrams (desaturated bronze + light grey).
   Inline-SVG colour/stroke overrides (presentation attributes lose to CSS).
   ===================================================================== */
.schematic-wrap { margin: clamp(36px, 5vh, 64px) auto 0; max-width: 920px; }
.schematic { width: 100%; height: auto; display: block; filter: drop-shadow(0 0 10px rgba(184, 151, 102, 0.10)); }
/* text classes */
.schematic .gold { fill: #B89766 !important; }
.schematic .cream { fill: #E2E2E2 !important; }
.schematic .muted { fill: #9DA1A7 !important; }
/* panel fills -> transparent / faint so it reads as a wireframe on charcoal */
.schematic rect[fill="#100f12"] { fill: transparent !important; }
.schematic rect[fill="#17171b"], .schematic rect[fill="#1b1813"], .schematic rect[fill="#141417"] { fill: rgba(255, 255, 255, 0.018) !important; }
.schematic rect[fill="#1c1c21"] { fill: rgba(184, 151, 102, 0.06) !important; }
/* gold solids (ribbon, padlock) -> bronze */
.schematic rect[fill="#C2A14D"], .schematic circle[fill="#C2A14D"], .schematic path[fill="#C2A14D"] { fill: #B89766 !important; }
/* structural hairlines + borders -> faint bronze gridlines */
.schematic [stroke="#2a2a30"], .schematic [stroke="#2c2c33"], .schematic [stroke="#2f2f36"], .schematic [stroke="#3a3324"] { stroke: rgba(184, 151, 102, 0.22) !important; }
.schematic [stroke="#C2A14D"] { stroke: #B89766 !important; }
/* the "blocked" fault markers -> muted, de-saturated (no startup colour) */
.schematic [stroke="#9a5048"], .schematic [stroke="#C9594B"] { stroke: #9c7268 !important; }

/* =====================================================================
   FOUNDER PORTRAIT (about.html) — severe, desaturated, sharp 1px, no shadow
   ===================================================================== */
.founder-layout { display: grid; grid-template-columns: 260px 1fr; gap: clamp(36px, 5vw, 72px); align-items: start; }
.founder-portrait { position: sticky; top: 112px; }
.founder-photo {
  display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: center 20%;
  border: 1px solid rgba(184, 151, 102, 0.35);
  filter: grayscale(1) contrast(1.03) brightness(0.97);
  /* deliberately no border-radius and no box-shadow */
}
.founder-portrait-name { font-family: var(--f-serif); font-size: 1.2rem; color: var(--c-ink); margin-top: 18px; line-height: 1.2; }
.founder-portrait-role { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-ink-3); margin-top: 6px; }
.founder-portrait .terminal-link { margin-top: 18px; font-size: 0.74rem; padding: 10px 14px; }
.founder-narrative .founder-text:first-child { margin-top: 0; }
.founder-narrative .cv { margin-top: 32px; }

/* =====================================================================
   ABOUT PAGE — restructured top half (global H2 sizing for all sections)
   ===================================================================== */
#mandate-standard .section-title, #principles .section-title,
#founder .section-title, #presence .section-title { font-weight: 500; letter-spacing: -0.015em;
}

/* The Mandate & The Standard — white, 30/70 rows, dividers that draw in (like 'Bridging') */
#mandate-standard { background: #FFFFFF; }
#mandate-standard .container { max-width: none; }
#mandate-standard .ms-row { display: grid; grid-template-columns: 3fr 7fr; gap: clamp(40px, 6vw, 90px); align-items: start; padding: clamp(34px, 5vh, 60px) 0; position: relative; }
#mandate-standard .ms-row::after,
#mandate-standard .ms-row:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(20, 22, 26, 0.16);
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#mandate-standard .ms-row::after { bottom: 0; }
#mandate-standard .ms-row:first-child::before { top: 0; }
#mandate-standard .ms-row.draw-in::after,
#mandate-standard .ms-row.draw-in::before { transform: scaleX(1); }
#mandate-standard .ms-title { font-family: var(--f-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 500; color: var(--c-gold); line-height: 1.1; letter-spacing: -0.01em; }   /* gold row titles, like the 'Bridging' labels */
#mandate-standard .ms-text { font-size: clamp(1rem, 1.25vw, 1.14rem); color: #1A1C20; line-height: 1.72; max-width: 74ch; }

/* Foundational Principles — black, title + rule + 2x2 grid */
#principles { background: #2E3047; }
#principles .container { max-width: none; }
#principles .section-title { color: var(--c-ink); }
#principles .fp-divider { width: 100%; height: 1px; background: rgba(255, 255, 255, 0.16); margin: clamp(28px, 4vh, 48px) 0 clamp(40px, 5.5vh, 68px); }
#principles .fp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
#principles .fp-title { font-family: var(--f-serif); font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 500; color: var(--c-ink); line-height: 1.2; margin-bottom: 14px; }
#principles .fp-num { color: var(--c-gold); }
#principles .fp-text { font-size: clamp(1rem, 1.2vw, 1.12rem); color: var(--c-ink-2); line-height: 1.7; max-width: 58ch; }

/* The Founder — inverted to white (gold/bronze accents kept exactly) */
#founder { background: #FFFFFF; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(64px, 9vh, 120px); }   /* REF spacing: top + bottom matched to #engagements / #euler-standard */
#founder .section-title { color: #14161A; }
#founder .founder-text { color: #1A1C20; }
#founder .founder-portrait-name { color: #14161A; }
#founder .founder-portrait-role { color: #5A5E64; }
#founder .cv li { border-top-color: rgba(20, 22, 26, 0.16); }
#founder .cv-val { color: #1A1C20; }

/* =====================================================================
   SECTION 3 — THE 3-PILLAR MODEL ARCHITECTURE: dark (black) full-bleed grid,
   white / off-white text. Title forced onto a single line.
   ===================================================================== */
#services { background: var(--c-bg); }   /* solid: part of the sticky-reveal stack */
#services .section-head { max-width: none; }                 /* let the title use full width */
#services { background: #2E3047; padding-top: calc(var(--section-y) / 2); padding-bottom: calc(var(--section-y) / 2); }   /* gunmetal; top + bottom padding halved (−50%) */
#services .section-title { color: var(--c-ink); white-space: nowrap; }   /* white title */
/* The 3-Pillar title + 3-pillar card titles command more attention */
#services .section-title, .pillar-section .section-title { font-weight: 500; letter-spacing: -0.02em;
}
/* Services-page pillar titles enlarged to match the 'Ongoing Research' title */
.pillar-section .section-title { white-space: nowrap; }   /* force single line */
#services .fb-title { font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500; }
#services .fb-grid { --fb-line: var(--c-line); }   /* light hairlines on black */
/* Card top padding == the section title's top margin (clamp 64/9vh/120), doubling
   the original vertical padding so cards stretch much taller. */
#services .fb-col { background: transparent; padding-block: clamp(64px, 9vh, 120px); position: relative; transition: background .4s var(--ease), box-shadow .4s var(--ease); }
#services .fb-col:hover { background: var(--c-bg-raise2); box-shadow: inset 0 0 0 1px var(--c-gold); }   /* dark bg pop + gold border, no lift */
#services .fb-title { text-align: center; color: var(--c-gold); min-height: 2.6em; }   /* gold titles kept */
#services .fb-text { color: var(--c-ink-2); }   /* light body on black */
#services .fb-col .fb-text:first-of-type { flex-grow: 1; }   /* first paragraph absorbs slack -> 'How we work' + CTA bottom-align across the row */
#services .fb-text strong { color: #FFFFFF; }
#services .fb-col .link-quiet { color: var(--c-gold); }
#services .fb-col .link-quiet:hover { color: #FFFFFF; }

/* =====================================================================
   HOMEPAGE — WHO WE ADVISE: black, gold subheaders, 3-Pillar-style grid.
   ===================================================================== */
#who-we-advise { background: #2E3047; }
#who-we-advise .container { max-width: none; }   /* full-bleed gutter */
#who-we-advise .wa-split { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: start; }   /* hard 50/50, identical to the 'Bridging' rows above — text starts at exactly 50% */
#who-we-advise .section-title { color: var(--c-ink); font-weight: 500; letter-spacing: -0.015em; }   /* matches the homepage section titles */
#who-we-advise .wa-list { border-top: 1px solid var(--c-line); }
#who-we-advise .wa-item { padding: clamp(26px, 3.6vh, 44px) 0; border-bottom: 1px solid var(--c-line); }   /* thin divider between archetypes */
#who-we-advise .wa-title { font-family: var(--f-serif); font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500; color: var(--c-gold); line-height: 1.2; margin-bottom: 12px; }   /* gold subheader */
#who-we-advise .wa-text { font-size: clamp(1rem, 1.2vw, 1.12rem); color: var(--c-ink-2); line-height: 1.7; max-width: 72ch; }

/* =====================================================================
   SERVICES — THE ENGAGEMENT PROCESS: white, 30/70 split, numbered steps.
   ===================================================================== */
#engagement-process { background: #FFFFFF; }
#engagement-process .container { max-width: none; }   /* full-bleed gutter, like the Ecosystem header */
#engagement-process .ep-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: start; }   /* 1fr 1fr — identical to the R&D Commitment split, so the dividing line aligns */
#engagement-process .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }   /* matches the Services pillar titles */
#engagement-process .ep-steps { border-top: 0; }
#engagement-process .ep-step { padding: clamp(26px, 3.6vh, 44px) 0; position: relative; }
/* Dividers drawn left -> right on scroll, exactly like the homepage 'Bridging' rows (JS toggles .draw-in) */
#engagement-process .ep-step::after,
#engagement-process .ep-step:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(20, 22, 26, 0.16);
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#engagement-process .ep-step::after { bottom: 0; }
#engagement-process .ep-step:first-child::before { top: 0; }
#engagement-process .ep-step.draw-in::after,
#engagement-process .ep-step.draw-in::before { transform: scaleX(1); }
#engagement-process .ep-title { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; color: var(--c-gold); line-height: 1.2; margin-bottom: 12px; }   /* gold step titles */
#engagement-process .ep-num { color: var(--c-gold); }   /* gold step number */
#engagement-process .ep-text { font-size: clamp(1rem, 1.2vw, 1.12rem); color: #1A1C20; line-height: 1.7; max-width: 72ch; }

/* =====================================================================
   SECTION 2 — CHALLENGE & SOLUTION: white, full-bleed gutter width (mirrors
   Hero/nav margins), deep-dark text, black dividers that draw in on scroll.
   ===================================================================== */
#challenge-solution { background: #FFFFFF; padding-bottom: 0; }   /* flush to Section 3 */
#challenge-solution .container { max-width: none; }          /* mirror Hero/nav left+right gutter */
#challenge-solution .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }
#challenge-solution .cs-label { color: var(--c-gold); font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500; }
#challenge-solution .cs-body p { color: #1A1C20; }
/* last row keeps its normal bottom padding (spacing matches the other rows) but
   drops its bottom divider — no line borders the transition into Section 3 */
#challenge-solution .cs-row:last-child::after { display: none; }
/* Black dividers, drawn left -> right EACH time a row enters view (.draw-in, re-triggering) */
/* three perfectly equal-height blocks: tallest row sets the height for all */
#challenge-solution .cs-rows { border-top: 0; display: grid; grid-auto-rows: 1fr; }
#challenge-solution .cs-row { border-bottom: 0; position: relative; }
#challenge-solution .cs-row::after,
#challenge-solution .cs-row:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: #2E3047;
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#challenge-solution .cs-row::after { bottom: 0; }
#challenge-solution .cs-row:first-child::before { top: 0; }
#challenge-solution .cs-row.draw-in::after,
#challenge-solution .cs-row.draw-in::before { transform: scaleX(1); }

/* =====================================================================
   SECTION 4 — PARTNERS & PEDIGREE: clean off-white, borderless logo strips.
   Uniform grayscale + muted opacity; full opacity (and colour) on hover.
   ===================================================================== */
/* Header pinned to the top, logo group pushed to the bottom (the "split").
   Top padding matches the 3-Pillar section; bottom padding matches a full
   section (var(--section-y), as the old Euler Standard section used). */
#pedigree {
  background: #2E3047;   /* matches the overall Services SECTION background (gunmetal) */
  display: flex; flex-direction: column; min-height: auto;
  padding-top: clamp(64px, 9vh, 120px);
  padding-bottom: 2rem;
  --logo-scale: 1;   /* logos shrink proportionally on smaller laptops (see media queries) */   /* = the Standard Gap (logo-strip-overline margin-bottom) */
}
#pedigree .container { max-width: none; display: flex; flex-direction: column; }   /* full-bleed gutter width */
/* Section header — title + intro, matching Section 2 typography (50/50 like cs-rows) */
.pedigree-head { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: start; }
.pedigree-head .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }   /* dark title on white */
.pedigree-intro { font-size: clamp(1rem, 1.25vw, 1.12rem); color: #1A1C20; line-height: 1.72; }
/* Stack the head so the intro sits below the label on the same left axis (was col 2 of a 2-col grid) */
/* Two-column header: gold overline label left, intro paragraph right, tops aligned. */
#pedigree .pedigree-head { grid-template-columns: 1fr 1fr; align-items: baseline; gap: clamp(2rem, 5vw, 6rem); }
#pedigree .pedigree-intro {
  text-align: right;
  padding-right: 0;
  margin-top: 0;
  max-width: none;
  font-family: var(--f-serif);         /* match the row titles (.logo-strip-overline) */
  font-weight: 500;
  font-size: clamp(1.5rem, 2.3vw, 2rem);
  letter-spacing: -0.01em;
  line-height: 1.25;
}
/* --- Ecosystem dark-mode text mapping --- */
#pedigree .pedigree-head .section-title { color: var(--c-gold); font-family: var(--f-mono); font-size: 0.72rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; }   /* reverted to the standard ALL-CAPS gold label size */
#pedigree .pedigree-intro { color: #FFFFFF; }   /* full match to the row titles */                              /* matches the "To preserve market…" firewall subtext */
#pedigree .logo-strip-overline { color: #FFFFFF; }                                /* sub-headers to pure white */
#pedigree .logo-strip-block + .logo-strip-block { border-top: 1px solid rgba(255,255,255,0.10); }
#pedigree .logo-strip-item img { filter: grayscale(1) brightness(0) invert(0.82); opacity: 0.82; }   /* invert marks so logos stay legible on the dark surface */
#pedigree .logo-strip-item:hover img { opacity: 1; }   /* id-scoped hover to match #rd-commitment (the base .logo-strip-item:hover rule is out-ranked by the id-level opacity above) */
#pedigree .logo-strip-item[data-fallback="AAVA"] img { height: calc(60px * var(--logo-scale)); max-width: calc(258px * var(--logo-scale)); }   /* normalized (was 187.5px) so it no longer inflates the Industry row height */

/* --- Unified vertical rhythm: identical subheading→logo gap in both rows --- */
#pedigree .logo-strip-overline { margin-bottom: 2rem; }
#pedigree .logo-strip { margin: 0; padding: 0; flex-wrap: nowrap; align-items: flex-start; gap: clamp(0.8rem, 1.8vw, 2.5rem); }
#pedigree .logo-strip-item { min-height: 0; }

/* --- Optical-weight multipliers on the 50px / 215px base --- */
#pedigree .logo-strip-item[data-fallback="ENS"] img             { height: calc(50px * var(--logo-scale)); max-width: calc(215px * var(--logo-scale)); }   /* 1×   */
#pedigree .logo-strip-item[data-fallback="CNRS"] img            { height: calc(65px * var(--logo-scale)); max-width: calc(280px * var(--logo-scale)); }   /* 1.3× */
#pedigree .logo-strip-item[data-fallback="ERC"] img             { height: calc(75px * var(--logo-scale)); max-width: calc(323px * var(--logo-scale)); }   /* 1.5× (listed as "HEC") */
#pedigree .logo-strip-item[data-fallback="Sorbonne"] img        { height: calc(60px * var(--logo-scale)); max-width: calc(258px * var(--logo-scale)); }   /* 1.2× */
#pedigree .logo-strip-item[data-fallback="CentraleSupélec"] img { height: calc(65px * var(--logo-scale)); max-width: calc(280px * var(--logo-scale)); }   /* 1.3× */
#pedigree .logo-strip-item[data-fallback="ETH Zürich"] img      { height: calc(45px * var(--logo-scale)); max-width: calc(194px * var(--logo-scale)); }   /* 0.9× */
#pedigree .logo-strip-item[data-fallback="Caan"] img            { height: calc(50px * var(--logo-scale)); max-width: calc(215px * var(--logo-scale)); }   /* 1×   */
#pedigree .logo-strip-item[data-fallback="Clius"] img           { height: calc(40px * var(--logo-scale)); max-width: calc(172px * var(--logo-scale)); }   /* 0.8× */
#pedigree .logo-strip-item[data-fallback="Hashlock"] img        { height: calc(60px * var(--logo-scale)); max-width: calc(258px * var(--logo-scale)); }   /* 1.2× */
#pedigree .logo-strip-item[data-fallback="Security4Web3"] img   { height: calc(75px * var(--logo-scale)); max-width: calc(323px * var(--logo-scale)); }   /* 1.5× */
#pedigree .logo-strip-item[data-fallback="ChainAware"] img      { height: calc(60px * var(--logo-scale)); max-width: calc(258px * var(--logo-scale)); }   /* 1.2× */
#pedigree .logo-strip-item[data-fallback="ESILV"] img           { height: calc(75px * var(--logo-scale)); max-width: calc(323px * var(--logo-scale)); }   /* 1.5× */
#pedigree .logo-strip-item[data-fallback="Inria"] img           { height: calc(46px * var(--logo-scale)); max-width: calc(210px * var(--logo-scale)); }   /* wide 3.4:1 mark */
#pedigree .logo-strip-item[data-fallback="FSMP"] img            { height: calc(60px * var(--logo-scale)); max-width: calc(200px * var(--logo-scale)); }
/* Row 2 "Academic & Research Collaborations": only two logos — centre them (not space-between). */
#pedigree .logo-strip--left { justify-content: flex-start; gap: clamp(3rem, 7vw, 8rem); }   /* ETH + ESILV flush left, same gap as before */
.pedigree-logos { margin-top: clamp(28px, 4vh, 44px); }   /* compacted: header sits close to the first row */
/* Light-surface logo treatment (default): dark grayscale marks legible on white; gold overline kept */
.pedigree-logos .logo-strip-block:last-child { padding-bottom: 0; }   /* section padding-bottom is the only space below */
#pedigree .logo-strip-block { padding: clamp(23px, 3.3vh, 40px) 0; }   /* ~40% tighter than base (was 38/66) — compacts the gaps between the 3 rows */
#pedigree .pedigree-logos .logo-strip-block:last-child { padding-bottom: 0; }   /* keep 2rem section-bottom as the only trailing gap */
.logo-strip-block { padding: clamp(38px, 5.5vh, 66px) 0; }
.logo-strip-block + .logo-strip-block { border-top: 1px solid rgba(20, 22, 26, 0.08); }
/* Kicker sized + coloured to match the 3-Pillar card titles (gold) */
/* matches the Section 3 card titles (serif, weight 500, gold) — not uppercased */
.logo-strip-overline {
  font-family: var(--f-serif); font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 500;
  letter-spacing: -0.01em; color: var(--c-gold); margin-bottom: clamp(28px, 3.8vh, 44px);
}
.logo-strip {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: clamp(2rem, 4vw, 3.5rem);   /* min breathing room; space-between distributes across the wide row */
}
.logo-strip-item { display: inline-flex; align-items: center; min-height: 52px; }
/* Anchor wrapper must not disturb flex alignment / vertical centring */
.logo-strip-item > a { display: flex; align-items: center; text-decoration: none; line-height: 0; }
.logo-strip-item img {
  height: 50px; width: auto; max-width: 215px; object-fit: contain; display: block;   /* ~32% larger */
  filter: grayscale(100%);
  opacity: 0.7;
  transition: opacity .4s var(--ease), filter .4s var(--ease);
}
.logo-strip-item:hover img { opacity: 1; }
/* A couple of partner logos are light-coloured and would otherwise disappear on
   the light strip — darken just those so the row stays uniform and legible. */
.logo-strip-item[data-fallback="Clius"] img,
.logo-strip-item[data-fallback="AAVA"] img { filter: grayscale(100%) brightness(0.42) contrast(1.25); }
/* graceful text fallback if a logo file is absent (e.g. ERC) */
.logo-strip-item.logo-missing img { display: none; }
.logo-strip-item.logo-missing::after {
  content: attr(data-fallback);
  font-family: var(--f-serif); font-size: 1.05rem; color: #3A3D42; letter-spacing: 0.01em; white-space: nowrap;
}

/* ----------------------------- REVEAL ANIMATIONS ----------------------------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.reveal-line { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(10px); transition: clip-path .9s var(--ease), opacity .9s var(--ease), transform .9s var(--ease); }
.reveal-line.in { opacity: 1; clip-path: inset(0 0 -2% 0); transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-line { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .hero-light { display: none; }
  /* dividers shown statically, no draw animation */
  #challenge-solution .cs-row::after, #challenge-solution .cs-row::before,
  #mandate-standard .ms-row::after, #mandate-standard .ms-row::before,
  #euler-standard .es-step::after, #euler-standard .es-step::before { transform: none !important; transition: none !important; }
}

/* ----------------------------- RESPONSIVE ----------------------------- */
/* Full-bleed grids stack to a single column on tablet/mobile; the vertical
   divider becomes a horizontal one so the grid lines stay continuous. */
@media (max-width: 980px) {
  .fb-grid--3, .fb-grid--2 { grid-template-columns: 1fr; }
  .fb-col + .fb-col { border-left: 0; border-top: 1px solid var(--fb-line); }
}

/* Collapse the primary nav into the hamburger before the 7-item menu (after adding
   'Events') can collide with the logo on medium/tablet widths. Raised from 960px. */
@media (max-width: 1080px) {
  .site-nav { display: none; }
  .nav-toggle { display: flex; }
}

@media (max-width: 960px) {
  /* Services split hero: relax the rigid 50/50 + stack the pillar cards */
  .page-hero.page-hero--split, .hero.hero--split { height: auto; min-height: 0; }
  .hero-top-half { height: auto; min-height: 64vh; padding: 120px 0 56px; }
  .hero-pillars { height: auto; grid-template-columns: 1fr; }
  .hero-pillar { min-height: 120px; }
  .hero-pillar + .hero-pillar { border-left: 0; border-top: 1px solid rgba(20, 22, 26, 0.16); }
  .serve-strip-row { grid-template-columns: 1fr 1fr; }
  #serve .serve-grid { grid-template-columns: 1fr; }   /* stack the 4 cards on mobile */
  .wss-grid { grid-template-columns: 1fr; }   /* stack the audience sub-items */
  #why-us .why-grid { grid-template-columns: 1fr; gap: 32px; }
  #segments .seg-grid { grid-template-columns: 1fr; }   /* stack the 4 segment cards */
  .svc-grid { grid-template-columns: 1fr; }   /* stack the 3 service cards */
  .svc-card { height: auto; }                 /* size to content on touch (no hover) */
  .svc-card-body { justify-content: flex-start; }
  .svc-card-menu { opacity: 1 !important; max-height: 400px !important; transform: none !important; margin-top: 20px; }   /* touch: always show menu */
  .routing-grid { grid-template-columns: 1fr; gap: 40px; }   /* stack the routing columns */
  .boundary-lines { grid-template-columns: 1fr; gap: 18px; }
  #digital-asset-engineering .track-grid { grid-template-columns: 1fr; gap: 36px; }
  #euler-standard .es-step { grid-template-columns: 1fr; gap: 14px; }
  .framing { grid-template-columns: 1fr 1fr; }
  .founder { grid-template-columns: 1fr; }
  .founder-layout { grid-template-columns: 1fr; }
  .founder-portrait { position: static; max-width: 240px; }
  .alliance-split { grid-template-columns: 1fr; gap: 30px; }
  .alliance-divider { width: 100%; height: 1px; }
  .commercial-items { grid-template-columns: 1fr; gap: 22px; }
  .logo-grid-academic { grid-template-columns: repeat(4, 1fr); }
  .logo-grid-ecosystem { grid-template-columns: repeat(4, 1fr); }
  /* Footer stacks below 960px: side by side, a logo as tall as the text column squeezes the text and both grow */
  .footer-inner { flex-direction: column; align-items: flex-start; gap: 30px; }
  .footer-text { align-items: flex-start; text-align: left; }
  .footer-nav, .footer-meta { justify-content: flex-start; }
  .footer-logo-img { width: 292px; height: 72px; }   /* stacked layout: logo above the text */
}
@media (max-width: 640px) {
  .framing { grid-template-columns: 1fr; }
  .trust-bar-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  .cv li { grid-template-columns: 1fr; gap: 8px; }
  .hero, .page-hero { min-height: 92vh; }
  .logo-grid-academic { grid-template-columns: repeat(3, 1fr); }
  .logo-grid-ecosystem { grid-template-columns: repeat(3, 1fr); }
  .ledger-row { grid-template-columns: 1fr; gap: 12px; }
  .lr-status { justify-self: start; }
  .legal-citation { font-size: 0.6rem; }
  .fb-col { padding: clamp(24px, 7vw, 40px); }
  .cs-row { grid-template-columns: 1fr; gap: 10px; padding: 26px 0; }
  #services .section-title, .pillar-section .section-title { white-space: normal; }   /* allow wrap on small screens */
  #challenge-solution .cs-rows { grid-auto-rows: auto; }   /* don't force equal heights when stacked */
  #engagements .eng-row { grid-template-columns: 1fr; gap: 16px; }   /* stack engagement rows */
  #engagements.eng-compact .eng-row, #engagements.eng-compact .eng-row--wide, #presence.eng-compact .eng-row { grid-template-columns: 1fr; gap: 16px; }   /* keep the compact Workshops + Presence layout stacked on mobile */
  #engagements .eng-row > .lr-status { justify-self: start; }   /* status pill left-aligned when stacked */
  #pedigree .pedigree-head { grid-template-columns: 1fr; gap: 16px; }
  #pedigree .pedigree-intro { text-align: left; margin-top: 10px; }
  #research-areas .ra-split { grid-template-columns: 1fr; gap: 30px; }   /* stack header above accordion */
  #rd-commitment .rd-split { grid-template-columns: 1fr; gap: 24px; }
  #engagement-process .ep-split { grid-template-columns: 1fr; gap: 28px; }
  #who-we-advise .wa-split { grid-template-columns: 1fr; gap: 28px; }
  #mandate-standard .ms-row { grid-template-columns: 1fr; gap: 14px; }
  #principles .fp-grid { grid-template-columns: 1fr; gap: 28px; }
  .logo-strip { justify-content: flex-start; gap: 1.8rem 2.2rem; }
  .logo-strip-item img { height: 40px; max-width: 160px; }
}

/* Focus visibility */
a:focus-visible, button:focus-visible, .btn:focus-visible, summary:focus-visible { outline: 2px solid var(--c-bronze); outline-offset: 3px; }

/* =====================================================================
   HOMEPAGE — Who-we-serve routing strip (minimalist, dark, divided).
   ===================================================================== */
.serve-strip { background: var(--c-bg); border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.hero .serve-strip { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 3; border-bottom: 0; }   /* pinned to the bottom edge of the 100vh hero */
.serve-strip-row { display: grid; grid-template-columns: repeat(4, 1fr); }
.serve-link { display: flex; align-items: center; justify-content: center; text-align: center; padding: clamp(18px, 2.6vh, 32px) clamp(14px, 1.6vw, 26px); font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.4; color: var(--c-ink-3); border-left: 1px solid var(--c-line); transition: color .3s var(--ease), background .3s var(--ease); }
.serve-link::after { display: none; }
.serve-link:first-child { border-left: 0; }
.serve-link:hover { color: var(--c-gold); background: var(--c-bg-raise); }

/* =====================================================================
   WHO WE SERVE PAGE — four archetype rows (dark, gold titles).
   ===================================================================== */
#serve { background: var(--c-bg); }
#serve .container { max-width: none; }
/* Balanced 2x2 grid — all four cards equal width + equal height */
#serve .serve-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; border-top: 1px solid var(--c-line); border-left: 1px solid var(--c-line); }
#serve .serve-card { display: flex; flex-direction: column; gap: 16px; padding: clamp(32px, 4vw, 64px); border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); scroll-margin-top: 120px; }
#serve .serve-title { font-family: var(--f-serif); font-size: clamp(1.6rem, 2.6vw, 2.3rem); font-weight: 500; color: var(--c-gold); line-height: 1.18; }
#serve .serve-text { font-size: clamp(1.05rem, 1.35vw, 1.2rem); color: var(--c-ink-2); line-height: 1.7; max-width: 60ch; }

/* =====================================================================
   WHO WE ARE — The Euler Standard: black, three sequential steps.
   ===================================================================== */
#euler-standard { background: #2E3047; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(64px, 9vh, 120px); }   /* REF spacing: top + bottom matched to #engagements 'Institutional Presence' */
#euler-standard .container { max-width: none; }
#euler-standard .section-title { color: var(--c-ink); font-weight: 500; letter-spacing: -0.015em; }   /* size/weight matched to #engagements 'Institutional Presence' title */
#euler-standard .es-steps { margin-top: clamp(40px, 6vh, 80px); }
#euler-standard .es-step { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: clamp(32px, 5vh, 64px) 0; align-items: start; position: relative; }   /* 1fr 1fr — body text starts at 50%, aligned with 'What Drives Us' */
/* Dividers drawn left -> right on scroll, exactly like 'What Drives Us' (JS toggles .draw-in) */
#euler-standard .es-step::after,
#euler-standard .es-step:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(255, 255, 255, 0.16);
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#euler-standard .es-step::after { bottom: 0; }
#euler-standard .es-step:first-child::before { top: 0; }
#euler-standard .es-step.draw-in::after,
#euler-standard .es-step.draw-in::before { transform: scaleX(1); }
#euler-standard .es-step:last-child::after { display: none; }   /* no trailing divider on the last item */
#euler-standard .es-step:last-child { padding-bottom: 0; }   /* zero space before the next section */
#euler-standard .es-title { font-family: var(--f-serif); font-size: clamp(2rem, 3vw, 3rem); font-weight: 400; color: var(--c-gold); line-height: 1.3; }   /* type ramp copied from .thesis-lead + .thesis-gold (homepage 'AI made quantitative models a commodity') */
#euler-standard .es-text { font-size: clamp(1rem, 1.25vw, 1.16rem); color: var(--c-ink-2); line-height: 1.72; max-width: 72ch; }

/* =====================================================================
   HOMEPAGE — Element 1: Positioning statement (left-aligned, hairline above).
   ===================================================================== */
.positioning { border-top: 1px solid var(--c-line); }
.block-eyebrow { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: clamp(28px, 4vh, 48px); }
.positioning-line { font-family: var(--f-serif); font-size: clamp(1.9rem, 4vw, 3.2rem); color: var(--c-ink); line-height: 1.16; letter-spacing: -0.012em; max-width: 24ch; }
.positioning-sub { margin-top: clamp(28px, 4vh, 40px); font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: var(--c-ink-3); line-height: 1.6; max-width: 60ch; }

/* =====================================================================
   HOMEPAGE — Element 3: Proof-of-method slot (reusable featured block).
   ===================================================================== */
.proof { border-top: 1px solid var(--c-line); }
.proof-card { max-width: 72ch; }
.proof-headline { font-family: var(--f-serif); font-size: clamp(1.8rem, 3.4vw, 2.8rem); color: var(--c-ink); line-height: 1.2; letter-spacing: -0.01em; margin: 22px 0 24px; max-width: 22ch; }
.proof-summary { font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: var(--c-ink-3); line-height: 1.65; max-width: 62ch; }
.proof-attr { margin-top: 18px; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-ink-3); }
.proof-link { margin-top: clamp(28px, 4vh, 40px); }
.proof-link .link-quiet { color: var(--c-gold); }
.proof-link .link-quiet:hover { color: var(--c-bronze-dk); }

/* =====================================================================
   HOMEPAGE — 'Why Us': 3 scannable columns with gold rules + titles.
   ===================================================================== */
#why-us .why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 4vw, 72px); }
#why-us .why-item { padding-top: 22px; border-top: 2px solid var(--c-gold); }
#why-us .why-title { font-family: var(--f-serif); font-size: clamp(1.35rem, 1.9vw, 1.7rem); font-weight: 500; color: var(--c-gold); margin-bottom: 14px; line-height: 1.2; }
#why-us .why-text { font-size: clamp(1rem, 1.2vw, 1.12rem); color: var(--c-ink-2); line-height: 1.65; }

/* =====================================================================
   WHO WE SERVE — uniform 4-card buyer-persona grid (2x2, equal height).
   ===================================================================== */
#segments { background: var(--c-bg); }
#segments .container { max-width: none; }
#segments .seg-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; border-top: 1px solid var(--c-line); border-left: 1px solid var(--c-line); }
#segments .seg-card { display: flex; flex-direction: column; gap: clamp(14px, 1.6vh, 22px); padding: clamp(32px, 3.5vw, 60px); border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); scroll-margin-top: 120px; transition: background .35s var(--ease); }
#segments .seg-card:hover { background: var(--c-bg-raise); }
#segments .seg-who { font-family: var(--f-serif); font-size: clamp(1.5rem, 2.2vw, 2rem); font-weight: 500; color: var(--c-gold); line-height: 1.18; }
#segments .seg-trigger { font-size: clamp(1.05rem, 1.35vw, 1.22rem); color: var(--c-ink); line-height: 1.5; }
#segments .seg-meta { display: flex; flex-direction: column; gap: 4px; }
#segments .seg-label { font-family: var(--f-mono); font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-bronze); }
#segments .seg-value { font-size: 0.98rem; color: var(--c-ink-2); line-height: 1.55; }
#segments .seg-route { margin-top: auto; padding-top: 10px; font-family: var(--f-mono); font-size: 0.8rem; letter-spacing: 0.04em; color: var(--c-bronze-dk); transition: color .3s var(--ease); }
#segments .seg-card:hover .seg-route { color: var(--c-gold); }

/* =====================================================================
   WHO WE SERVE — two large audience sections (dark + white), gold titles.
   ===================================================================== */
.wss-section--dark { background: var(--c-bg); }
.wss-section--light { background: #FFFFFF; }
.wss-section .container { max-width: none; }
.wss-section .section-title { font-weight: 500; letter-spacing: -0.015em; margin-bottom: clamp(40px, 6vh, 80px); }
.wss-section--dark .section-title { color: var(--c-ink); }
.wss-section--light .section-title { color: #14161A; }
.wss-grid { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; border-top: 1px solid var(--c-line); border-left: 1px solid var(--c-line); }
.wss-card { display: flex; flex-direction: column; gap: 16px; padding: clamp(32px, 4vw, 64px); border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); scroll-margin-top: 120px; }
.wss-title { font-family: var(--f-serif); font-size: clamp(1.6rem, 2.6vw, 2.3rem); font-weight: 500; color: var(--c-gold); line-height: 1.18; }
.wss-text { font-size: clamp(1.05rem, 1.35vw, 1.2rem); line-height: 1.7; }
.wss-section--dark .wss-text { color: var(--c-ink-2); }
/* light section: dark borders + dark body text (gold titles kept) */
.wss-section--light .wss-grid { border-top-color: rgba(20, 22, 26, 0.16); border-left-color: rgba(20, 22, 26, 0.16); }
.wss-section--light .wss-card { border-right-color: rgba(20, 22, 26, 0.16); border-bottom-color: rgba(20, 22, 26, 0.16); }
.wss-section--light .wss-text { color: #1A1C20; }

/* =====================================================================
   EVENTS PAGE — Institutional Presence: white surface, 4-column rows,
   black text, gold accents kept. (mirrors the dark Workshops list).
   ===================================================================== */
#presence { background: #FFFFFF; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(64px, 9vh, 120px); }
#presence .container { max-width: none; }
#presence .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }
#presence .eng-rows { position: relative; }
#presence .eng-row { display: grid; grid-template-columns: minmax(110px, 0.7fr) minmax(150px, 1fr) 2.6fr minmax(110px, auto); gap: clamp(20px, 3vw, 56px); align-items: start; padding: clamp(30px, 4.5vh, 52px) 0; position: relative; }
/* dark hairline dividers, drawn left -> right on scroll */
#presence .eng-row::after,
#presence .eng-row:first-child::before {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(20, 22, 26, 0.16);
  transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease);
}
#presence .eng-row::after { bottom: 0; }
#presence .eng-row:first-child::before { top: 0; }
#presence .eng-row.draw-in::after,
#presence .eng-row.draw-in::before { transform: scaleX(1); }
#presence .eng-row:last-child::after { display: none; }
#presence .eng-meta { display: flex; flex-direction: column; gap: 8px; }
#presence .eng-date { font-family: var(--f-mono); font-size: clamp(1.1rem, 1.5vw, 1.4rem); letter-spacing: 0.04em; color: var(--c-gold); }   /* gold matched to Workshops 'May 2026' */
#presence .eng-type { font-family: var(--f-mono); font-size: clamp(0.8rem, 1vw, 0.92rem); letter-spacing: 0.16em; text-transform: uppercase; color: #5A5E64; }
#presence .eng-logo-cell { align-self: start; }
#presence .eng-logo { height: 58px; width: auto; max-width: 220px; object-fit: contain; filter: grayscale(100%); opacity: 0.75; }
#presence .eng-content { display: flex; flex-direction: column; gap: 10px; }
#presence .eng-title { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; color: #14161A; line-height: 1.2; }
#presence .eng-venue { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: #5A5E64; }
#presence .eng-role { font-size: clamp(1rem, 1.25vw, 1.12rem); color: #1A1C20; line-height: 1.7; margin-top: 4px; }
#presence .eng-row > .lr-status { justify-self: end; align-self: start; }   /* gold badge kept */
#presence .eng-logo-cell.logo-missing::after { color: #5A5E64; }

/* =====================================================================
   SERVICES — Independence Boundary band + Practice 1 (flagship) + Practice 2.
   ===================================================================== */
.boundary-band { background: var(--c-bg); border-top: 1px solid var(--c-bronze-dk); border-bottom: 1px solid var(--c-bronze-dk); padding: clamp(40px, 6vh, 76px) 0; }
.boundary-band .container { max-width: none; }
.boundary-eyebrow { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: clamp(20px, 3vh, 34px); }
.boundary-lines { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 72px); }
.boundary-line { font-family: var(--f-serif); font-size: clamp(1.2rem, 2vw, 1.7rem); color: var(--c-ink); line-height: 1.3; position: relative; padding-left: 24px; }
.boundary-line::before { content: ""; position: absolute; left: 0; top: 0.4em; width: 9px; height: 9px; background: var(--c-gold); }

/* Practice eyebrow + flagship trigger */
.practice-eyebrow { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 18px; }
.practice-trigger { font-family: var(--f-serif); font-size: clamp(1.3rem, 2.2vw, 1.95rem); color: var(--c-ink); line-height: 1.3; max-width: 34ch; margin: 22px auto 0; }

/* Practice 2 — two buyer-type tracks (contained, visually secondary) + firewall note */
#digital-asset-engineering { padding-bottom: clamp(80px, 10vh, 140px); }
#digital-asset-engineering .track-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 5vw, 90px); border-top: 1px solid rgba(20, 22, 26, 0.16); padding-top: clamp(40px, 5vh, 64px); }
#digital-asset-engineering .track-head { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; color: #14161A; margin-bottom: 22px; }
#digital-asset-engineering .track-who { display: block; font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-bronze-dk); margin-top: 7px; }
#digital-asset-engineering .track-list { list-style: none; margin: 0; padding: 0; }
#digital-asset-engineering .track-list li { padding: 14px 0; border-bottom: 1px solid rgba(20, 22, 26, 0.10); font-size: clamp(1rem, 1.2vw, 1.12rem); color: #1A1C20; line-height: 1.5; }
#digital-asset-engineering .track-list li strong { color: #14161A; font-weight: 600; }
#digital-asset-engineering .firewall-note { margin-top: clamp(40px, 5vh, 64px); font-family: var(--f-mono); font-size: 0.82rem; letter-spacing: 0.04em; color: var(--c-bronze-dk); border-left: 2px solid var(--c-gold); padding-left: 16px; }

/* =====================================================================
   HOMEPAGE OVERHAUL — What Euler Is / Services 3-box / Solutions matrix.
   ===================================================================== */
/* Hero — second subtext paragraph sits tighter under the first */
.hero-sub--2 { margin-top: clamp(16px, 2vh, 22px); }

/* =====================================================================
   STICKY HERO REVEAL (homepage only) — the hero pins to the top of the
   viewport while the solid intro section slides up over it like a curtain.
   Scoped to #hero so the split heroes on Services/Events are untouched.
   ===================================================================== */
#hero.hero { position: sticky; top: 0; height: 100svh; min-height: 100svh; z-index: 1; background-color: var(--c-gunmetal); background-image: url('Images/hero_background.jpg'); background-size: cover; background-position: right center; background-repeat: no-repeat; justify-content: center; padding-top: clamp(160px, 26vh, 360px); padding-bottom: 90px; }   /* static hero image pinned right; gunmetal fallback; void kept left */
/* Cinematic hero video + brand scrim */
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-scrim { position: absolute; inset: 0; z-index: 1; background: rgba(46, 48, 71, 0.6); pointer-events: none; }   /* transparent #2E3047 brand layer over the ocean footage */
#hero .hero-surface { display: none; }   /* hide the textured overlay so the hero reads as a flat solid tone */
/* Every section after the hero must be opaque and stacked above it so the
   pinned hero never bleeds through. Most already carry a solid background;
   the two transparent ones are made solid below. */
.hero ~ section { position: relative; z-index: 2; }
.what-euler { z-index: 10; box-shadow: 0 -24px 60px rgba(0,0,0,0.5); }   /* the curtain: stacked above + soft lift over the hero (solid off-white bg + Keppel seam set in the Intro/About block) */
.site-footer { position: relative; z-index: 2; background: var(--c-bg); }

/* Intro / About — left edge aligned to the Ecosystem section title (gutter axis) */
.what-euler { background: var(--c-offwhite); border-top: 2px solid var(--c-gold); padding-top: var(--edge-padding); padding-bottom: var(--edge-padding); }   /* curtain edge now gold (= Services title colour); top/bottom padding = left margin for a uniform inset */
.what-euler .container { max-width: none; }   /* full-bleed gutter: shares the exact left axis as #pedigree title + hero */
.we-lead { font-family: var(--f-serif); font-size: clamp(1.7rem, 3.4vw, 2.9rem); color: var(--c-gunmetal); line-height: 1.22; letter-spacing: -0.01em; max-width: none; }   /* no measure cap so the explicit <br /> breaks are the only line breaks */
.we-sub { margin-top: clamp(28px, 4vh, 44px); font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: var(--c-rhythm); line-height: 1.62; max-width: 64ch; }
.we-signoff { margin-top: clamp(26px, 3.5vh, 40px); font-family: var(--f-serif); font-size: clamp(1.1rem, 1.6vw, 1.4rem); color: var(--c-rhythm); }
.we-signoff strong { color: var(--c-rhythm); font-weight: 700; font-style: italic; }

/* Sharpened Banner — full-width authoritative statement between intro and services */
.sharp-banner { background: #3C3F58; padding-top: var(--edge-padding); padding-bottom: var(--edge-padding); }   /* synced to the Services Arsenic card tone; padding = the page left margin */
.sharp-banner .container { max-width: none; }
.sharp-text { font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.7rem, 3.4vw, 2.9rem); color: #FFFFFF; line-height: 1.22; letter-spacing: -0.01em; max-width: 52ch; margin-left: auto; text-align: right; padding-right: var(--edge-padding); }   /* typography matches .we-lead; colour intentionally left white */

/* Services — 3-card interactive grid.
   Fixed-height cards: title centred by default; on hover the body re-centres as the
   menu expands (title rides up, menu fades in below); the View button stays pinned. */
.svc-section { border-top: 1px solid var(--c-line); }
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: clamp(40px, 6vh, 72px); border-top: 1px solid var(--c-line); border-left: 1px solid var(--c-line); }
.svc-card { display: flex; flex-direction: column; height: clamp(460px, 56vh, 560px); padding: clamp(34px, 3vw, 52px) clamp(34px, 3vw, 52px) clamp(40px, 4vw, 60px); border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); overflow: hidden; background: linear-gradient(160deg, var(--c-outerspc) 0%, var(--c-arsenic) 100%); transition: all 0.3s ease; outline: none; }
.svc-card:hover, .svc-card:focus-visible { background: #1A1B28; box-shadow: inset 0 0 0 2px var(--c-gold); }   /* bg = Contact slate; inset ring = 2px gold "border" without grid reflow */
.svc-card-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: flex-start; }   /* titles start at the same top Y across all three cards */
.svc-card-title { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.45rem, 2vw, 1.95rem); color: var(--c-gold); line-height: 1.18; text-align: center; min-height: 2.36em; }   /* reserve 2 lines so the menu top aligns on one Y across all 3 cards */
.svc-card-menu { list-style: none; margin: 0; padding: 0; opacity: 0; max-height: 0; overflow: hidden; transform: translateY(10px); transition: opacity .45s var(--ease), transform .45s var(--ease), max-height .55s var(--ease), margin-top .45s var(--ease); }
.svc-card:hover .svc-card-menu, .svc-card:focus-within .svc-card-menu { opacity: 1; max-height: 360px; transform: none; margin-top: 22px; }
.svc-card-menu li { padding: 9px 0; border-top: 1px solid rgba(255,255,255,0.14); font-size: 0.92rem; color: #FFFFFF; line-height: 1.4; cursor: pointer; transition: color 0.2s ease; }
.svc-card-menu li:hover { color: var(--c-gold); }   /* snaps to the gold Services-title accent */
.svc-card-menu li:first-child { border-top: 0; }
.svc-card-btn { flex: 0 0 auto; margin-top: clamp(20px, 3vh, 30px); font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-gold); transition: color .3s var(--ease); }
.svc-card-btn span { display: inline-block; transition: transform .3s var(--ease), color .3s var(--ease); }
.svc-card:hover .svc-card-btn, .svc-card:focus-within .svc-card-btn { color: var(--c-gold); }   /* gold persists on static + hover */
.svc-card:hover .svc-card-btn span, .svc-card:focus-within .svc-card-btn span { transform: translateX(4px); }
.svc-firewall { margin: clamp(34px, 5vh, 54px) auto 0; max-width: 72ch; text-align: center; font-size: 0.9rem; color: var(--c-ink-3); line-height: 1.62; }

/* Solutions — minimalist routing directory (By role / By topic), off-white footer-style */
.routing-section { background: var(--c-offwhite); border-top: 1px solid rgba(46,48,71,0.12); padding-top: calc(var(--section-y) / 2); padding-bottom: calc(var(--section-y) / 2); }
/* Share the exact left axis as the SERVICES title (full-bleed + identical inset) */
.routing-section .container { max-width: none; padding-left: clamp(3rem, 5vw, 6rem); padding-right: clamp(3rem, 5vw, 6rem); }   /* synced to the Services top padding (half section-y) */
.routing-section .block-eyebrow { color: var(--c-gold); }   /* reverted to standard section-header size (gold) */
.routing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 8vw, 120px); margin-top: clamp(28px, 4vh, 48px); }
.routing-head { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-gunmetal); padding-bottom: 16px; border-bottom: 1px solid rgba(46,48,71,0.18); }
.routing-list { list-style: none; margin: 0; padding: 0; }
.routing-list li { border-bottom: 1px solid rgba(46,48,71,0.12); }
.routing-list a { display: block; padding: 9px 0; font-family: var(--f-serif); font-size: clamp(1.1rem, 1.5vw, 1.35rem); color: var(--c-rhythm); transition: color .25s var(--ease), padding-left .25s var(--ease); }
.routing-list a:hover { color: var(--c-gold); padding-left: 10px; }

/* =====================================================================
   LATEST INSIGHTS — sticky title + horizontally scrolling card rail
   ===================================================================== */
.insights-section { background: var(--c-bg); padding: clamp(4rem, 9vh, 8rem) 0; }
/* Asymmetric: ~27% aside / rail. No right padding so cards bleed off-screen. */
.insights-layout { display: grid; grid-template-columns: minmax(220px, 27%) 1fr; gap: clamp(2rem, 4vw, 4.5rem); align-items: start; padding-left: clamp(3rem, 5vw, 6rem); }

.insights-aside { position: sticky; top: 140px; align-self: start; }

/* Right column: nav arrows sit above the rail, flush to the page's right inset */
.insights-main { display: flex; flex-direction: column; min-width: 0; }
.insights-nav { align-self: flex-end; display: flex; gap: 0.75rem; margin-bottom: clamp(1.25rem, 2.5vw, 2rem); padding-right: clamp(3rem, 5vw, 6rem); }
.insights-arrow { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; background: none; border: 1px solid rgba(255,255,255,0.14); border-radius: 2px; color: var(--c-ink-3); cursor: pointer; transition: color .25s var(--ease), border-color .25s var(--ease); }
.insights-arrow svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.insights-arrow:hover { color: var(--c-gold); border-color: var(--c-gold); }
.insights-arrow:disabled { opacity: 0.3; cursor: default; }
.insights-arrow:disabled:hover { color: var(--c-ink-3); border-color: rgba(255,255,255,0.14); }
.insights-title { font-family: var(--f-serif); font-weight: 500; letter-spacing: -0.02em; color: var(--c-ink); margin: 0; }
.insights-viewall { display: inline-flex; align-items: center; gap: 0.6rem; margin-top: clamp(1.5rem, 3vw, 2.5rem); padding-bottom: 0.5rem; border-bottom: 1px solid rgba(255,255,255,0.25); font-family: var(--f-sans); font-size: 0.95rem; color: var(--c-ink-2); transition: color .25s var(--ease), border-color .25s var(--ease); }
.insights-viewall span { display: inline-block; transition: transform .25s var(--ease); }
.insights-viewall:hover { color: var(--c-gold); border-color: var(--c-gold); }
.insights-viewall:hover span { transform: translateX(4px); }

/* Rail: flex + overflow-x, scrollbar hidden, snap per card */
.insights-rail { display: flex; gap: clamp(1.25rem, 2vw, 2rem); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding-bottom: 1.5rem; scrollbar-width: none; -ms-overflow-style: none; }
.insights-rail::-webkit-scrollbar { display: none; }

/* Card blends into the page — boundary is the hairline border alone */
.insight-card { flex: 0 0 clamp(280px, 26vw, 380px); scroll-snap-align: start; display: flex; flex-direction: column; background: rgba(255,255,255,0.015); border: 1px solid rgba(255,255,255,0.08); border-radius: 2px; text-decoration: none; transition: border-color .3s var(--ease), background .3s var(--ease); }
.insight-card:hover { border-color: var(--c-gold); background: rgba(255,255,255,0.03); }

/* Neutral charcoal placeholder — no blue cast; an <img> covers it when supplied */
.insight-media { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(135deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.025) 55%, rgba(255,255,255,0.01) 100%); }
.insight-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.insight-body { flex: 1; display: flex; flex-direction: column; padding: clamp(1.4rem, 2vw, 1.9rem); }
.insight-tag { font-family: var(--f-mono); font-size: 0.68rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 0.9rem; }
.insight-headline { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.25rem, 1.6vw, 1.55rem); line-height: 1.22; color: var(--c-ink); margin: 0 0 0.9rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.insight-excerpt { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.6; color: rgba(255,255,255,0.82); margin: 0 0 1.6rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.insight-cta { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 0.5rem; padding-bottom: 0.4rem; border-bottom: 1px solid rgba(255,255,255,0.2); font-family: var(--f-sans); font-size: 0.9rem; font-weight: 500; color: var(--c-ink-2); transition: color .25s var(--ease), border-color .25s var(--ease); }
.insight-cta span { display: inline-block; transition: transform .25s var(--ease); }
.insight-card:hover .insight-cta { color: var(--c-gold); border-color: var(--c-gold); }
.insight-card:hover .insight-cta span { transform: translateX(4px); }

/* ---- Latest Insights: ported research "pipeline" cards ----
   The research cards are white-surface fb-col cards; here they sit in the dark
   horizontal rail. Give them a fixed rail width + white background, replicate the
   pipeline card styling, and pin the collaborators footer to the bottom (margin-top:auto)
   so cards stay aligned regardless of the truncated text length. */
#insights .insights-rail .fb-col {
  flex: 0 0 clamp(280px, 26vw, 380px); scroll-snap-align: start;
  position: relative; height: auto; display: flex; flex-direction: column;
  background: #FFFFFF; border: 1px solid rgba(255,255,255,0.10); border-radius: 2px;
  padding: clamp(22px, 1.8vw, 30px); overflow: hidden;
  transition: border-color .3s var(--ease);
}
#insights .insights-rail .fb-col:hover { border-color: var(--c-gold); }
#insights .insights-rail .fb-col + .fb-col { border-left: 1px solid rgba(255,255,255,0.10); }   /* uniform card border, not the grid divider */
#insights .pl-cover { width: 100%; height: 150px; object-fit: cover; display: block; margin-bottom: clamp(16px, 1.6vw, 22px); background: #ECECEC; }
#insights .pl-badge { position: absolute; top: clamp(22px, 1.8vw, 30px); right: clamp(22px, 1.8vw, 30px); z-index: 2; width: max-content; white-space: nowrap; font-family: var(--f-mono); font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-gold); border: 1px solid var(--c-gold); background: rgba(11, 12, 14, 0.62); padding: 4px 9px; }
#insights .pl-readmore { display: none; }   /* the floating "Read more" (dead link) is omitted on the compact home cards */
#insights .fb-col .fb-title { font-family: var(--f-serif); font-size: clamp(1.15rem, 1.5vw, 1.4rem); font-weight: 500; color: var(--c-gold); line-height: 1.2; margin: 0 0 12px; }
#insights .fb-col .fb-text { font-size: 0.86rem; line-height: 1.5; color: #1A1C20; margin: 0 0 16px; }
#insights .pl-collab { margin-top: auto; padding-top: 4px; }
#insights .pl-collab-label { font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.04em; color: var(--c-gold); margin-bottom: 12px; }
#insights .pl-collab-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; }
#insights .pl-collab-logos img { height: 26px; width: auto; max-width: 84px; object-fit: contain; filter: grayscale(1); opacity: 0.75; }
#insights .pl-collab-logos img.bdf-logo { height: auto; width: auto; max-height: 58px; max-width: 190px; filter: none; opacity: 1; mix-blend-mode: multiply; }

/* =====================================================================
   COMMON QUESTIONS — asymmetric sticky title + hairline accordion
   ===================================================================== */
/* Light surface — identical palette to the Solutions directory */
.faq-section { background: var(--c-offwhite); border-top: 1px solid rgba(46,48,71,0.12); padding: clamp(4rem, 9vh, 8rem) 0; }
.faq-layout { display: grid; grid-template-columns: minmax(220px, 27%) 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; padding: 0 clamp(3rem, 5vw, 6rem); }

.faq-aside { position: sticky; top: 140px; align-self: start; }
.faq-title { font-family: var(--f-serif); font-weight: 500; letter-spacing: -0.02em; color: var(--c-gunmetal); margin: 0; }
.faq-sub { margin-top: clamp(1rem, 2vw, 1.5rem); font-family: var(--f-sans); font-size: 1rem; line-height: 1.6; color: var(--c-rhythm); max-width: 30ch; }

/* No boxes, no radii — separation is a single dark hairline per row */
.faq-item { border-bottom: 1px solid rgba(46,48,71,0.12); }
.faq-item:first-child { border-top: 1px solid rgba(46,48,71,0.12); }
.faq-q { margin: 0; }
.faq-trigger { display: flex; align-items: flex-start; justify-content: space-between; gap: clamp(1.5rem, 3vw, 3rem); width: 100%; padding: clamp(1.5rem, 2.6vw, 2.1rem) 0; background: none; border: 0; border-radius: 0; text-align: left; cursor: pointer; color: var(--c-gunmetal); transition: color .3s var(--ease); }
.faq-q-text { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.15rem, 1.7vw, 1.5rem); line-height: 1.3; letter-spacing: -0.005em; }
/* Icon inherits currentColor, so it makes the same dark → gold transition */
.faq-trigger:hover, .faq-trigger[aria-expanded="true"] { color: var(--c-gold); }

/* Minimalist +/− built from two rules; the vertical one collapses when open */
.faq-icon { position: relative; flex: 0 0 auto; width: 16px; height: 16px; margin-top: 0.35em; }
.faq-icon::before, .faq-icon::after { content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: currentColor; transition: transform .35s var(--ease), opacity .35s var(--ease); }
.faq-icon::after { transform: rotate(90deg); }
.faq-trigger[aria-expanded="true"] .faq-icon::after { transform: rotate(0deg); opacity: 0; }

/* Height animated via JS-set max-height.
   NOTE: the panel is a sibling of the <h3>, NOT of the button — an adjacent
   selector on .faq-trigger can never match it, so visibility is driven by
   an .is-open class on .faq-item instead. */
.faq-panel { overflow: hidden; max-height: 0; opacity: 0; transition: max-height .45s var(--ease), opacity .35s var(--ease); }
.faq-item.is-open .faq-panel { opacity: 1; }
.faq-panel-inner { padding: 0 clamp(2rem, 6vw, 6rem) clamp(1.5rem, 2.6vw, 2.1rem) 0; }
.faq-panel-inner p { font-family: var(--f-sans); font-size: clamp(0.98rem, 1.1vw, 1.08rem); line-height: 1.75; color: rgba(46,48,71,0.82); margin: 0; }

@media (max-width: 900px) {
  .faq-layout { grid-template-columns: 1fr; gap: 2rem; padding: 0 clamp(1.5rem, 5vw, 3rem); }
  .faq-aside { position: static; }
  .faq-title { }
  .faq-sub { max-width: none; }
  .faq-panel-inner { padding-right: 0; }
}

@media (max-width: 900px) {
  .insights-layout { grid-template-columns: 1fr; gap: 2rem; padding-left: clamp(1.5rem, 5vw, 3rem); }
  .insights-aside { position: static; }
  .insights-title { }
  .insight-card { flex-basis: min(78vw, 340px); }
}
/* Grouped sub-headers inside the "By role" column (no divider beneath them) */
.routing-list li.routing-subhead { border-bottom: 0; padding: 0.6rem 0 0.5rem; font-family: var(--f-mono); font-size: 0.75rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); }
.routing-list li.routing-subhead--gap { margin-top: 2rem; }

/* =====================================================================
   HOME THESIS — full-width display block (max 1400px, centred)
   ===================================================================== */
/* Tune the measure here: raise --thesis-max for longer lines at the same type size */
:root { --thesis-max: 1400px; }
/* Full-bleed escape hatch — the section needs no parent override today, but this
   guarantees it can span edge-to-edge if a constrained wrapper is ever introduced. */
.full-bleed { width: 100vw; max-width: 100vw; margin-left: 50%; transform: translateX(-50%); }
/* Top space halved (was clamp(100px,15vh,180px)); the removed half is transferred
   to the bottom, so the text shifts up while total section height is unchanged. */
.thesis { width: 100%; background: var(--c-offwhite, #F8F8F8); padding: clamp(50px, 7.5vh, 90px) 0; }
.thesis-wrap { width: 100%; max-width: var(--thesis-max); margin: 0 auto; padding: 0 clamp(1rem, 3vw, 2.5rem); text-align: left; }
.thesis-lead { font-family: var(--f-sans); font-weight: 400; font-size: clamp(2rem, 3vw, 3rem); line-height: 1.3; color: #1A1B28; margin: 0 0 clamp(2.5rem, 5vw, 4rem); max-width: none; text-wrap: pretty; }
.thesis-gold { color: var(--c-gold); font-family: var(--f-serif); }
.thesis-outro { font-family: var(--f-serif); font-weight: 400; font-size: clamp(3rem, 5vw, 4.5rem); line-height: 1.08; letter-spacing: -0.015em; color: var(--c-gold); margin: 0; max-width: none; }

/* ---- Thesis metric grid: 4 columns split by hairline rules ---- */
.metric-grid { display: grid; grid-template-columns: repeat(5, 1fr); margin: clamp(3.5rem, 7vw, 6rem) 0 0; padding: 0; border-top: 1px solid rgba(46,48,71,0.10); }
.metric { padding: clamp(2rem, 3.5vw, 3rem) clamp(1rem, 2.5vw, 2.25rem); }
/* Delicate dividers — faint, never harsh; inset so they read as rules, not borders */
.metric + .metric { border-left: 1px solid rgba(46,48,71,0.10); }
.metric-value { font-family: var(--f-serif); font-weight: 400; font-size: clamp(2.75rem, 5vw, 4.25rem); line-height: 1; letter-spacing: -0.02em; color: #23263A; margin: 0; font-variant-numeric: lining-nums; }
.metric-label { margin: clamp(0.9rem, 1.6vw, 1.25rem) 0 0; font-family: var(--f-sans); font-weight: 500; font-size: 0.66rem; line-height: 1.5; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-rhythm); max-width: 22ch; }

/* --- Stats band: dark surface matching the Services header (#2E3047) --- */
#proof-metrics { background: #2E3047; padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem); }
/* Top padding is dark too, so the gap under the Services cards reads as one block */
#proof-metrics .metric-value,
#proof-metrics .metric-label { color: var(--c-offwhite); }
/* Hairlines lifted to a subtle white so they stay visible on the dark ground */
#proof-metrics .metric-grid { border-top-color: rgba(255,255,255,0.14); }
#proof-metrics .metric + .metric { border-left-color: rgba(255,255,255,0.14); }

@media (max-width: 900px) {
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .metric:nth-child(odd) { border-left: 0; }                   /* column-1 items (1,3,5) in the 2-col layout */
  .metric:nth-child(n+3) { border-top: 1px solid rgba(46,48,71,0.10); }
  #proof-metrics .metric:nth-child(n+3) { border-top-color: rgba(255,255,255,0.14); }
}
@media (max-width: 520px) {
  .metric-grid { grid-template-columns: 1fr; }
  .metric + .metric { border-left: 0; border-top: 1px solid rgba(46,48,71,0.10); }
  #proof-metrics .metric + .metric { border-top-color: rgba(255,255,255,0.14); }
  .metric-label { max-width: none; }
}
/* Keeps hyphenated terms intact — plain ASCII hyphens, no U+2011 (which font-fell-back and looked spaced) */
.nb { white-space: nowrap !important; }
/* Hand-ragged desktop line breaks — disabled so text reflows naturally on mobile */
@media (max-width: 768px) {
  .desktop-break { display: none; }
}
.text-gold { color: var(--c-gold); }

/* Home — lock Ecosystem to the SERVICES eyebrow's left-axis (X) and top spacing */
#pedigree { padding-top: clamp(3rem, 5vw, 6rem); }
#pedigree .container { padding-left: clamp(3rem, 5vw, 6rem); padding-right: clamp(3rem, 5vw, 6rem); }

/* Sovereign & Public Sector band — slim authority bridge between mandates and independence */
.sovereign-band { background: #1A1B28; padding: 80px 0; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); transition: background 0.3s ease, box-shadow 0.3s ease; cursor: pointer; }
.sovereign-band:hover { background: #2E3047; /* Matches the solid background of the Services section */ box-shadow: inset 0 0 0 1px var(--c-gold, #C7A962); border-color: transparent; }
.sovereign-inner { max-width: 1300px; margin: 0 auto; padding: 0 clamp(1.5rem, 5vw, 4rem); }
.sovereign-title { font-family: var(--f-mono); font-weight: 400; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 2.5rem; }   /* identical treatment to the SERVICES eyebrow */
.sovereign-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(2rem, 4vw, 3.5rem); }
.sovereign-col { margin: 0; font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.55; color: #D8D5CC; }
.sovereign-lead { display: block; margin-bottom: 8px; font-size: 1.05rem; color: var(--c-gold); font-weight: 700; }
.sovereign-link { display: inline-block; margin-top: 3rem; font-family: var(--f-sans); font-size: 1rem; font-style: normal; color: #C9A24B; border-bottom: 1px solid rgba(201,162,75,0.4); padding-bottom: 2px; text-decoration: none; transition: color 0.25s ease, border-color 0.25s ease; }
.sovereign-link span { display: inline-block; transition: transform 0.25s ease; }
.sovereign-link:hover { color: var(--c-gold); border-color: var(--c-gold); }
.sovereign-link:hover span { transform: translateX(4px); }
@media (max-width: 760px) { .sovereign-grid { grid-template-columns: 1fr; gap: 1.8rem; } }

/* Service-page post-hero band — gold lead + white body */
.gold-text-class { font-family: var(--f-serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 500; line-height: 1.3; color: var(--c-gold); margin-bottom: 2rem; }
.reality-body { font-family: var(--f-sans); font-size: 1.25rem; font-weight: 400; line-height: 1.8; color: #FFFFFF; margin-bottom: 1.5rem; }
.reality-body:last-child { margin-bottom: 0; }

/* Inverted Fractional / Standing-Mandate section: card gradient bg + dark text → white */
.daa-section.section-inverted { background: linear-gradient(160deg, var(--c-outerspc) 0%, var(--c-arsenic) 100%); }
.daa-section.section-inverted .daa-macro,
.daa-section.section-inverted .daa-body,
.daa-section.section-inverted .daa-summary { color: #FFFFFF; }

/* Service-page contact: padding −50% + typography synced to the post-hero band */
.contact--service { padding-top: calc(var(--section-y) / 2); padding-bottom: calc(var(--section-y) / 2); }
.contact--service .contact-title { font-family: var(--f-serif); font-weight: 500; color: var(--c-gold); }   /* size from .contact-title, as on the homepage */
.contact--service .contact-lede { font-family: var(--f-sans); font-size: 1.25rem; font-weight: 400; line-height: 1.8; color: #FFFFFF; max-width: none; }
/* Procedural note above the service CTA: deliberately quieter than .contact-lede (a footnote, not a headline). */
.contact--service .contact-procurement {
  font-family: var(--f-sans); font-size: 0.95rem; font-weight: 400; line-height: 1.65;
  color: rgba(255,255,255,0.55); max-width: 64ch; margin: 2rem auto 2.25rem;
}

/* =====================================================================
   DIGITAL ASSET ARCHITECTURE & RWA — sub-page (Zanders-style 2-col,
   strictly on the Euler dark theme).
   ===================================================================== */
/* Hero + anchor nav — full-bleed gutter width + left-aligned, matching the homepage hero */
.daa-hero { background: #1A1B28; padding-top: clamp(140px, 20vh, 220px); padding-bottom: clamp(40px, 6vh, 72px); }   /* unified with the section below — one seamless dark document */
.daa-hero .container { max-width: none; text-align: left; padding-left: calc(var(--gutter) * 2); padding-right: calc(var(--gutter) * 2); }   /* expand to gutter, then doubled inset for luxurious outer margins */
.daa-eyebrow { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: clamp(20px, 3vh, 32px); }
.daa-title { font-family: var(--f-serif); font-weight: 400; letter-spacing: -0.015em; color: #FFFFFF; }
.daa-anchors { display: flex; flex-wrap: wrap; gap: clamp(24px, 4vw, 56px); margin-top: clamp(32px, 5vh, 56px); border-bottom: 4px solid #3C3F58; }   /* heavy structural divider in the lighter slate */
.daa-anchors a { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-gold); padding-bottom: 18px; position: relative; transition: color .25s var(--ease); }
.daa-anchors a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 4px; background: var(--c-gold); transform: scaleX(0); transform-origin: left; transition: transform .25s var(--ease); }
.daa-anchors a:hover { color: var(--c-gold); }
.daa-anchors a:hover::after { transform: scaleX(1); }
.daa-macro { font-family: var(--f-sans); font-weight: 500; font-size: clamp(1.18rem, 1.6vw, 1.5rem); line-height: 1.5; color: var(--c-gunmetal); max-width: none; margin-bottom: clamp(28px, 4vh, 48px); }   /* full-width executive preamble — medium weight, slightly larger than body */

/* Sticky-reveal hero: dark header + banner image fill 100vh and pin; content slides over */
.daa-hero-wrap { position: sticky; top: 0; height: 100vh; width: 100%; display: flex; flex-direction: column; z-index: 0; overflow: hidden; }

/* Post-hero reality band: must sit above the sticky hero-wrap stacking context */
.reality-band { position: relative; z-index: 10; background: #1A1B28; }
.daa-content { position: relative; z-index: 10; background: #ffffff; }   /* solid overlay so the pinned image never bleeds through */
/* Banner absorbs the remaining height below the dark header */
.daa-banner { flex: 1; width: 100%; min-height: 0; overflow: hidden; margin: 0; padding: 0; line-height: 0; background: #2E3047; }
.daa-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; display: block; }

/* Body sections — high-contrast inversion: off-white surface, gunmetal text, gold accents kept.
   Wide gap pushes the right column's left edge onto one shared vertical axis across all 4 sections. */
.daa-section { background: var(--c-offwhite); padding: clamp(56px, 8vh, 104px) 0; border-top: 1px solid rgba(46,48,71,0.14); scroll-margin-top: 110px; }
.daa-hero + .daa-section { border-top: 0; }   /* hero (dark) meets the first inverted section cleanly */
/* Full-container hairline between the light-zone sections. Matches the
   THE WORK / WHAT YOU GET divider (1px rgba(46,48,71,0.2)) but spans the
   whole container. Vertical balance comes from the equal section paddings
   either side, so the rule sits centred in the gap. */
.daa-rule { background: var(--c-offwhite); padding: 0 calc(var(--gutter) * 2); }
.daa-rule span { display: block; height: 1px; background: rgba(46,48,71,0.2); }
/* Suppress the full-bleed section border where an explicit rule now sits */
.daa-rule + .daa-section, #dynamical-systems, #diligence-matrix, #lifecycle-check, #teardown-matrix { border-top: 0; }
.daa-grid { max-width: none; padding-left: calc(var(--gutter) * 2); padding-right: calc(var(--gutter) * 2); }   /* doubled horizontal inset across all 4 sections */
.daa-sec-title { font-family: var(--f-serif); font-weight: 500; font-size: clamp(2.2rem, 3.6vw, 3.4rem); line-height: 1.18; letter-spacing: -0.01em; color: var(--c-gold); white-space: nowrap; margin-bottom: clamp(28px, 4vh, 48px); }   /* own full-width row above the columns */
.daa-cols { display: grid; grid-template-columns: 1fr 2.5fr; gap: clamp(32px, 4vw, 80px); align-items: start; border-top: 1px solid rgba(46,48,71,0.2); padding-top: 3rem; padding-bottom: 2rem; }   /* left/right text tops share one Y-axis */
.daa-summary { font-family: var(--f-sans); font-weight: 500; font-size: clamp(1.12rem, 1.5vw, 1.4rem); line-height: 1.5; color: var(--c-gunmetal); max-width: none; }   /* uncapped so the explicit <br /> breaks are the only breaks */
.daa-right { display: flex; flex-direction: column; align-items: flex-end; gap: clamp(18px, 2.4vh, 26px); text-align: left; }   /* block stays anchored right; text reads naturally left-to-right */
.daa-body { font-family: var(--f-sans); font-size: clamp(1rem, 1.2vw, 1.1rem); line-height: 1.75; color: var(--c-gunmetal); max-width: none; text-align: left; }   /* uncapped; reads left-to-right */
.daa-link { margin-top: clamp(10px, 1.6vh, 18px); font-family: var(--f-mono); font-size: 0.82rem; letter-spacing: 0.06em; color: var(--c-gold); transition: color .25s var(--ease); }
.daa-link span { display: inline-block; transition: transform .25s var(--ease); }
.daa-link:hover { color: var(--c-bronze); }
.daa-link:hover span { transform: translateX(5px); }
/* Section-title + typeset sub-line (e.g. "Credit Ratings · ESG Ratings · Hybrid Methodologies") */
.daa-title-group { margin-bottom: clamp(28px, 4vh, 48px); }
.daa-title-group .daa-sec-title { margin-bottom: 0; }
.daa-sec-sub { margin: 0.7rem 0 0; font-family: var(--f-mono); font-size: clamp(0.82rem, 1vw, 0.98rem); letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-bronze); }
/* Bulleted list inside a right-column body block */
.daa-ul { list-style: none; margin: 0; padding: 0; align-self: stretch; display: flex; flex-direction: column; gap: clamp(10px, 1.4vh, 14px); }
.daa-ul li { position: relative; padding-left: 1.5rem; font-family: var(--f-sans); font-size: clamp(1rem, 1.2vw, 1.1rem); line-height: 1.7; color: var(--c-gunmetal); text-align: left; }
.daa-ul li::before { content: ""; position: absolute; left: 0.1rem; top: 0.66em; width: 6px; height: 6px; border-radius: 50%; background: var(--c-gold); }
.daa-ul li strong { font-weight: 600; }
/* Small regulatory-citation footnote beneath a section preamble */
.daa-cite { margin: 0.5rem 0 0; font-family: var(--f-sans); font-size: clamp(0.78rem, 0.95vw, 0.86rem); line-height: 1.55; color: var(--c-gunmetal); opacity: 0.55; max-width: 80ch; }

/* Execution Grid — 3-column "threat / defense / arsenal" band below the text */
.daa-exec { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; border-top: 1px solid rgba(46,48,71,0.14); padding-top: 2rem; margin-top: 3rem; }   /* dark separator: white would vanish on the off-white surface */
.daa-exec-col { display: flex; flex-direction: column; }
.daa-exec-title { font-family: var(--f-mono); font-weight: 400; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 14px; }   /* matches the "Services" eyebrow style */
.daa-mission { font-family: var(--f-mono); font-weight: 400; font-size: 1.15rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 1rem; }   /* "Our Mission" label — same eyebrow style */
.daa-exec-body { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.62; color: var(--c-rhythm); }   /* #707793 muted slate, matching the main body */

/* The Diligence Matrix */
.matrix-grid { display: flex; flex-direction: column; width: 100%; margin-top: 1rem; }
.matrix-row { display: grid; grid-template-columns: 4fr 5fr; gap: clamp(32px, 4vw, 80px); border-top: 1px solid rgba(46,48,71,0.2); padding: 2.5rem 0; align-items: start; }
.matrix-left { font-family: var(--f-serif); font-style: italic; font-size: clamp(1.1rem, 1.4vw, 1.35rem); color: var(--c-gunmetal); opacity: 0.85; line-height: 1.5; }
.matrix-right { font-family: var(--f-sans); font-size: clamp(1.05rem, 1.25vw, 1.2rem); color: var(--c-gunmetal); line-height: 1.6; }
.matrix-closing { padding-top: 0.5rem; font-family: var(--f-sans); font-size: clamp(1.2rem, 1.6vw, 1.4rem); font-weight: 500; color: var(--c-gunmetal); line-height: 1.5; }
/* Column headers (gold all-caps, matching THE WORK / WHAT YOU GET) + separator line.
   Border uses a dark hairline since this matrix sits on the off-white surface (a white
   rgba(255,255,255,0.2) line would be invisible here). */
.matrix-header { display: grid; grid-template-columns: 4fr 5fr; gap: clamp(32px, 4vw, 80px); padding-bottom: 1rem; border-bottom: 1px solid rgba(46,48,71,0.2); }
.matrix-head-cell { font-family: var(--f-mono); font-weight: 400; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); }

/* ---- Single-Sided Wall diagram (Home, above the Independence band) ---- */
/* Single-sided wall — inside the SERVICES section, pushed down toward the cards */
.services-wall { position: relative; margin-top: clamp(2.5rem, 6vw, 5rem); margin-bottom: clamp(1rem, 2vw, 2rem); }
/* Vertical line drops from the centred badge, locked to the 50% card divider */
.services-wall::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); width: 1px; height: clamp(1.5rem, 3vw, 2.75rem); background: rgba(255,255,255,0.3); }
.wall-inner { max-width: 1000px; margin: 0 auto; display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: clamp(1rem, 3vw, 2.5rem); }
.wall-col { flex: 1 1 0; text-align: center; white-space: nowrap; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.6); }   /* synced to the SERVICES eyebrow; equal flex basis keeps the badge dead-centre */
.wall-badge { flex: 0 0 auto; white-space: nowrap; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; color: var(--c-gold); font-weight: 700; padding: 0.55rem 1.4rem; border-radius: 999px; border: 1px solid rgba(199,169,98,0.4); background: #2E3047; }   /* SERVICES-title type, gold kept */
@media (max-width: 600px) { .wall-col { font-size: 0.6rem; letter-spacing: 0.1em; } .wall-badge { font-size: 0.58rem; letter-spacing: 0.08em; padding: 0.45rem 0.9rem; } }

/* SERVICES cards — centre all body text below the gold titles */
.mandate-card { text-align: center; }
.mandate-card-body, .mandate-card-sub, .mandate-card-mech, .mandate-card-btn { text-align: center; }

/* Artifacts & Evidence — flagship display cases (matches SERVICES inset/eyebrow) */
.artifacts-inner { padding-left: clamp(3rem, 5vw, 6rem); padding-right: clamp(3rem, 5vw, 6rem); }
.artifacts-eyebrow { font-family: var(--f-mono); font-weight: 400; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin-bottom: clamp(2rem, 4vh, 3rem); }
.artifacts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); }
.artifact-card { display: flex; flex-direction: column; background: #1A1C28; border: 1px solid rgba(255,255,255,0.1); padding: clamp(1.8rem, 3vw, 2.8rem); text-decoration: none; transition: border-color 0.3s ease, transform 0.3s ease; }
.artifact-card:hover { border-color: rgba(199,169,98,0.5); transform: translateY(-3px); }
.artifact-tag { font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.5); margin-bottom: 1.25rem; }
.artifact-title { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; line-height: 1.25; color: #FFFFFF; margin-bottom: 1rem; }
.artifact-snippet { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.55; color: rgba(255,255,255,0.7); margin-bottom: 1.75rem; }
.artifact-link { margin-top: auto; font-family: var(--f-sans); font-size: 0.9rem; font-weight: 500; color: var(--c-gold); transition: color 0.25s ease; }
.artifact-link span { display: inline-block; transition: transform 0.25s ease; }
.artifact-card:hover .artifact-link { color: #E6C66B; }
.artifact-card:hover .artifact-link span { transform: translateX(4px); }
@media (max-width: 760px) { .artifacts-grid { grid-template-columns: 1fr; } }

/* ---- Mandate-card mechanism — the proof line, not a footnote ---- */
.mandate-card-mech { margin-top: auto; padding-top: 2.5rem; font-size: 1.15rem; font-weight: 600; font-style: normal; line-height: 1.5; color: #FFFFFF; }

/* ---- Numbered process strip (service pages) ---- */
.process-strip { background: #1A1B28; padding: clamp(2.5rem, 5vh, 4rem) clamp(1.5rem, 5vw, 4rem); border-bottom: 1px solid rgba(255,255,255,0.1); }
.process-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; }
.process-step { display: flex; align-items: center; gap: 0.9rem; flex-shrink: 0; }
.process-num { display: inline-flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid rgba(199,169,98,0.5); color: var(--c-gold); font-family: var(--f-mono); font-size: 0.95rem; flex-shrink: 0; }
.process-label { font-family: var(--f-sans); font-size: clamp(0.9rem, 1.1vw, 1.05rem); color: rgba(255,255,255,0.85); letter-spacing: 0.01em; }
.process-line { flex-grow: 1; height: 1px; background: rgba(255,255,255,0.2); margin: 0 clamp(1rem, 2.5vw, 2rem); }
.process-caption { max-width: 1100px; margin: clamp(1rem, 2vh, 1.5rem) auto 0; font-family: var(--f-sans); font-size: clamp(0.82rem, 1vw, 0.95rem); color: rgba(255,255,255,0.6); letter-spacing: 0.01em; }
/* Pace signal beneath the process steps */
.process-timeline { max-width: 1100px; margin: clamp(2rem, 3.5vw, 2.75rem) auto 0; text-align: center; font-family: var(--f-sans); font-size: clamp(0.95rem, 1.1vw, 1.05rem); color: rgba(255,255,255,0.72); }

@media (max-width: 760px) {
  .process-inner { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .process-line { display: none; }
  .process-timeline { text-align: left; }
}

@media (max-width: 880px) {
  .matrix-row { grid-template-columns: 1fr; gap: 1.5rem; padding: 2rem 0; }
  .matrix-header { display: none; }   /* stacked rows don't align to 2 headers */
  .daa-cols { grid-template-columns: 1fr; gap: clamp(20px, 4vh, 32px); }
  .daa-exec { grid-template-columns: 1fr; gap: 2rem; }
  .daa-summary { max-width: none; }
  .daa-sec-title { white-space: normal; }   /* allow titles to wrap on small screens (no overflow) */
  .daa-body { text-align: left; }
  .daa-right { align-items: stretch; text-align: left; }   /* revert to left-aligned once stacked */
}

/* Institutional Banner CTA */
.btn-gold-solid {
  display: inline-block;
  background-color: var(--c-gold);
  color: #1A1B28;
  font-family: var(--f-mono, monospace);
  font-weight: 600;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 18px 36px;
  text-decoration: none;
  border: 1px solid var(--c-gold);
  transition: all 0.3s ease;
  cursor: pointer;
}
.btn-gold-solid:hover {
  background-color: transparent;
  color: var(--c-gold);
}

/* =====================================================================
   PRINT / PDF — one major section per page; keep brand colours & images.
   ===================================================================== */
@media print {
  /* Render background colours and images exactly (Chrome/Safari + standard) */
  *, *::before, *::after { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* The fixed header must not overlap printed content */
  .site-header { position: static; }
  .nav-toggle, .mobile-nav { display: none !important; }

  /* Each major section starts on a fresh page */
  main > section { break-after: page; page-break-after: always; break-inside: avoid-page; }
  main > section:last-child { break-after: auto; page-break-after: avoid; }   /* no trailing blank page */

  /* Drop full-viewport hero heights so a hero doesn't waste a whole sheet */
  .hero, .page-hero { min-height: 0; }
}

/* ============================ NEW MANDATES GRID ============================ */
.mandates-section {
  width: 100%;
  max-width: 100vw;
  overflow: hidden;
}

.mandates-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
  margin: 0;
  padding: 0;
}

.mandate-card {
  box-sizing: border-box;
  padding: clamp(3rem, 4vw, 5rem); /* Slightly reduced padding to fit 3 columns */
  background: linear-gradient(160deg, var(--c-outerspc) 0%, var(--c-arsenic) 100%);
  border: 1px solid #000000;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: border-color 0.3s ease;
  position: relative;
}

/* Paragraph absorbs the free space so the link always sits on the card floor */
.mandate-card .mandate-card-body { flex-grow: 1; margin-bottom: 0; }

.mandate-link {
  font-family: var(--f-mono, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-gold, #C7A962);
  font-weight: 600;
  text-decoration: none;
  text-align: right;
  align-self: flex-end;
  margin-top: 4rem;
  transition: opacity 0.3s ease;
}
.mandate-link:hover { opacity: 0.8; }

.mandate-card:last-child {
  border-right: none;
}

.mandate-card:hover {
  border-color: var(--c-gold, #C7A962);   /* border colour only — background stays static */
  z-index: 2;
}

.mandate-card-title {
  font-family: var(--f-serif, serif);
  font-size: clamp(1.8rem, 3vw, 2.6rem); /* Updated to match the Thesis hook */
  color: var(--c-gold, #C7A962);
  margin-bottom: 3rem;
  font-weight: 500;
  line-height: 1.2;
}

.mandate-card-body {
  font-size: 1.1rem;
  line-height: 1.6;
  color: #FFFFFF;
  margin-bottom: 1.5rem;
}

.mandate-card-sub {
  font-style: italic;
  opacity: 0.7;
  color: #FFFFFF;
  margin-bottom: 2rem;
  font-size: 0.95rem;
}

.mandate-card-btn {
  font-family: var(--f-mono, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-gold, #C7A962);
  text-decoration: none;
  font-weight: 600;
  align-self: flex-start;
  transition: opacity 0.3s ease;
}

.mandate-card-btn:hover {
  opacity: 0.8;
}

@media (max-width: 980px) {
  .mandates-grid {
    grid-template-columns: 1fr;
  }
  .mandate-card {
    border-right: none;
  }
}

/* 13-inch laptops (~1024–1280px): shrink the ETH Zürich logo a touch more so it
   doesn't crowd the description before the mobile breakpoint takes over. */
@media (min-width: 1024px) and (max-width: 1280px) {
  #engagements.eng-compact .eng-logo { max-width: 140px; }
}

/* 13-15" laptops: the research section titles hit their 4.4rem cap and feel oversized.
   Scale them to ~0.7x below 1440px (16" screens at >=1536px keep the full size). */
@media (max-width: 1440px) {
  #research-areas .section-title,
  #rd-commitment .section-title,
  #pipeline .pedigree-head .section-title {
  }
}


/* Ecosystem logos: keep all logos on ONE line by scaling them down on smaller
   laptop viewports (16" >=1441px stays at full size). Phones fall back to wrap. */
@media (max-width: 1440px) { #pedigree, #rd-commitment { --logo-scale: 0.86; } }
@media (max-width: 1280px) { #pedigree, #rd-commitment { --logo-scale: 0.72; } }
@media (max-width: 1080px) { #pedigree, #rd-commitment { --logo-scale: 0.60; } }
@media (max-width: 767px)  { #pedigree, #rd-commitment { --logo-scale: 0.9; } #pedigree .logo-strip, #rd-commitment .logo-strip { flex-wrap: wrap; } }

/* ================= V58: service-page hero (CTA row + "Where are you now?" chips) ================= */
.hero-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: clamp(28px, 4vh, 40px); }
.hero-cta-link { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--f-sans); font-size: 0.95rem; color: rgba(255,255,255,0.82); text-decoration: underline; text-underline-offset: 4px; }
.hero-cta-link:hover { color: #FFFFFF; }
.hero-chips { margin-top: clamp(28px, 5vh, 48px); padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.12); }
.hero-chips-label { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.62); margin: 0 0 12px; }
.hero-chips-list { display: flex; flex-wrap: wrap; gap: 10px; }
.hero-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid rgba(212,175,55,0.45); color: #E9E4D4; font-family: var(--f-sans); font-size: 0.9rem; text-decoration: none; transition: border-color .2s ease, color .2s ease; }
.hero-chip:hover, .hero-chip:focus-visible { border-color: #D4AF37; color: #FFFFFF; }

/* Service-page hero: stop clipping on phones and short screens */
@media (max-width: 768px), (max-height: 760px) {
  .daa-hero-wrap { position: relative; height: auto; overflow: visible; }
  .daa-banner { display: none; }
}

/* ================= V58: offer cards (service pages) ================= */
.offers { position: relative; z-index: 10; background: var(--c-offwhite); padding: clamp(64px, 9vh, 112px) 0; scroll-margin-top: 110px; }
.offers .container { max-width: 1240px; }
.offers-eyebrow { font-family: var(--f-mono); font-size: 0.74rem; letter-spacing: 0.2em; text-transform: uppercase; color: #7A5C12; margin: 0 0 12px; }
.offers-title { font-family: var(--f-serif); font-weight: 500; font-size: clamp(2rem, 3.4vw, 2.75rem); line-height: 1.12; letter-spacing: -0.01em; color: #1A1B28; margin: 0 0 clamp(28px, 4vh, 44px); }
.offers-intro { font-family: var(--f-sans); font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.6; color: #2E3047; max-width: 70ch; margin: 0 0 clamp(28px, 4vh, 44px); }
.offer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; align-items: stretch; }
.offer-grid--two { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 560px)); }
.offer-card { display: flex; flex-direction: column; gap: 20px; padding: clamp(24px, 3vw, 32px); background: #FFFFFF; border: 1px solid rgba(46,48,71,0.14); scroll-margin-top: 110px; }
.offer-type, .offer-label { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: #7A5C12; margin: 0; }
.offer-head, .offer-block { display: grid; gap: 8px; }
.offer-name { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.6rem, 2.2vw, 1.9rem); line-height: 1.15; color: #1A1B28; margin: 0; }
.offer-for { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.06em; color: #4A4E66; margin: 0; }
.offer-outcome { font-family: var(--f-sans); font-weight: 500; font-size: 1.05rem; line-height: 1.5; color: #1A1B28; margin: 0; }
.offer-list { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; }
.offer-list li { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.5; color: #2E3047; }
.offer-facts { margin: 0; padding-top: 16px; border-top: 1px solid rgba(46,48,71,0.12); font-family: var(--f-mono); font-size: 0.78rem; line-height: 1.6; color: #4A4E66; }
.offer-more summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-family: var(--f-sans); font-size: 0.9rem; color: #2E3047; text-decoration: underline; text-underline-offset: 4px; }
.offer-more p { font-family: var(--f-sans); font-size: 0.9rem; line-height: 1.55; color: #2E3047; margin: 10px 0 0; }
.offer-more a { color: #7A5C12; }
.offer-cta { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; background: #1A1B28; color: #FFFFFF; font-family: var(--f-mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; transition: background .2s ease; }
.offer-cta:hover, .offer-cta:focus-visible { background: #2E3047; color: #FFFFFF; }
.offers-rule, .offers-note { margin: 28px 0 0; font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.6; color: #4A4E66; }
.offers-note { margin-top: 8px; }
.offers-note a { color: #7A5C12; }

/* ================= V58: proof band (allocator page) ================= */
.proof-band { position: relative; z-index: 10; background: #FFFFFF; border-top: 1px solid rgba(46,48,71,0.10); padding: clamp(48px, 7vh, 80px) 0; }
.proof-text { font-family: var(--f-sans); font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.6; color: #2E3047; max-width: 70ch; margin: 0 0 16px; }
.proof-punch { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.25; color: #1A1B28; max-width: 32ch; margin: 0; }

/* ================= V58: principal strip (service pages) ================= */
.principal-strip { position: relative; z-index: 10; background: #2E3047; color: #FFFFFF; padding: clamp(48px, 7vh, 72px) 0; }
.principal-name { font-family: var(--f-serif); font-weight: 500; font-size: clamp(1.3rem, 2vw, 1.6rem); line-height: 1.3; color: #FFFFFF; margin: 0 0 clamp(24px, 4vh, 36px); }
.principal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 28px 40px; }
.principal-label { font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: #D4AF37; margin: 0 0 8px; }
.principal-text { font-family: var(--f-sans); font-size: 1rem; line-height: 1.55; color: rgba(255,255,255,0.9); margin: 0; }

/* ================= V58: homepage ================= */
.thesis-lead--v58 { font-family: var(--f-serif); font-weight: 400; font-size: clamp(2.25rem, 4.2vw, 4rem); line-height: 1.1; letter-spacing: -0.015em; color: #7A5C12; max-width: 24ch; margin: 0 0 clamp(20px, 3vh, 32px); }
.thesis-body { font-family: var(--f-sans); font-weight: 400; font-size: clamp(1.15rem, 1.6vw, 1.5rem); line-height: 1.5; color: #2E3047; max-width: 46ch; margin: 0; }
.mandate-card-offers { list-style: none; margin: 1.75rem auto 0; padding: 0; max-width: 30ch; }
.mandate-card-offers li { border-top: 1px solid rgba(212,175,55,0.3); }
.mandate-card-offers li:last-child { border-bottom: 1px solid rgba(212,175,55,0.3); }
.mandate-card-offers a { display: block; padding: 0.75rem 0; font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.4; color: #FFFFFF; text-decoration: none; }
.mandate-card-offers a:hover, .mandate-card-offers a:focus-visible { color: var(--c-gold); }
.metric-word { font-family: var(--f-serif); }

/* V58 fix: the Events and Research pages already style #engagements as a dark band (id rules outrank .offers).
   Scoped to #engagements.offers so only the service-page offers section is affected. */
#engagements.offers { background: var(--c-offwhite); padding: clamp(64px, 9vh, 112px) 0; }
#engagements.offers .container { max-width: 1240px; }
/* V58 fix: the global reset (ul, ol { list-style: none }) hides the bullets these two lists are spaced for */
.offer-list, .contact-page-list { list-style: disc; }

/* =====================================================================
   Accessibility: gold and bronze text on light sections
   #D4AF37 on #FAFAFA = 2.0:1 and #B89766 on #FFFFFF = 2.7:1, both below WCAG AA.
   Text on white/off-white uses --c-gold-ink (#7A5C12, 6.0:1). Gold hairlines,
   borders and dark-section text are unchanged. Selectors mirror the rules they override.
   ===================================================================== */
#insights .fb-col .fb-title,
#insights .pl-collab-label,
#pipeline .fb-col .fb-title,
#pipeline .pl-collab-label,
#pipeline .pl-readmore, #pipeline .pl-readmore:visited,
#presence .eng-date,
#presence .eng-title--date,
.cv-key,
#founder .terminal-link,
#founder .terminal-link .tl-caret,
.daa-sec-title,
.matrix-head-cell,
.routing-list li.routing-subhead,
.routing-section .block-eyebrow,
.routing-list a:hover,
.faq-trigger:hover, .faq-trigger[aria-expanded="true"],
#research-areas .ra-row:hover .ra-icon { color: var(--c-gold-ink); }
#founder .terminal-link { border-color: var(--c-gold-ink); }
/* the default hover (white text on a 14% bronze tint) is invisible on the white founder section */
#founder .terminal-link:hover { background: var(--c-gold-ink); color: #FFFFFF; border-color: var(--c-gold-ink); }
#founder .terminal-link:hover .tl-caret { color: #FFFFFF; }

/* =====================================================================
   Phone check (390 px), October 2026
   ===================================================================== */
@media (max-width: 960px) {
  /* These stacking rules already existed higher up but lost to later desktop rules of equal specificity */
  .routing-grid { grid-template-columns: 1fr; gap: 40px; }           /* Solutions: By product, then By role */
  #euler-standard .es-step { grid-template-columns: 1fr; gap: 14px; } /* About, Our Standard: title above text */
  /* Footer meta on the stacked footer: one item per line, no orphaned separators */
  .footer-meta { flex-direction: column; align-items: flex-start; gap: 6px; }
  .footer-meta .dot { display: none; }
}
@media (max-width: 1199px) {
  /* Research cards: keep the collaborator logos clear of the absolutely positioned 'Read more' and status badge */
  #pipeline .fb-col { padding-bottom: 88px; }
}
@media (max-width: 640px) {
  .pedigree-head { grid-template-columns: 1fr; gap: 16px; }          /* Research, Ongoing Research: title above text */
  /* Service pages: one side margin. Hero and matrix used a doubled inset (40px), offers, proof and principal bands the single one (20px) */
  .daa-hero .container, .daa-grid { padding-left: var(--gutter); padding-right: var(--gutter); }
  .daa-rule { padding: 0 var(--gutter); }
}

/* =====================================================================
   V59 layout, October 2026
   ===================================================================== */
/* Regulated page: two engagement cards side by side on desktop and tablet.
   The old 560px tracks plus the gap overflowed the container, so auto-fit fell back to one column. */
.offer-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Service pages: Engagements, the 2025 band and the principal strip take the hero and matrix inset (2 x gutter) */
#engagements.offers .container,
.proof-band .container,
.principal-strip .container { max-width: none; padding-left: calc(var(--gutter) * 2); padding-right: calc(var(--gutter) * 2); }
@media (max-width: 640px) {
  .offer-grid--two { grid-template-columns: 1fr; }   /* phones: stack */
  #engagements.offers .container,
  .proof-band .container,
  .principal-strip .container { padding-left: var(--gutter); padding-right: var(--gutter); }
}

/* Allocator page, fractional retainer card: fee-credit line under the facts row */
.offer-credit { margin: 0; font-family: var(--f-sans); font-size: 0.9rem; line-height: 1.55; color: #2E3047; }

/* =====================================================================
   V60, October 2026
   ===================================================================== */
/* Matrices: three questions first; "See all seven questions" opens the other four in place.
   script.js adds .is-collapsed and reveals the button, so without JavaScript all seven rows show. */

/* =====================================================================
   V61: About page, Vision and Mission + How We Work (October 2026)
   ===================================================================== */
#vision { background: #2E3047; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(64px, 9vh, 120px); }
#vision .container { max-width: none; }
#vision .section-title { color: var(--c-ink); font-weight: 500; letter-spacing: -0.015em; }
.vm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 5vw, 96px); margin-top: clamp(40px, 6vh, 80px); }
.vm-label { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin: 0 0 18px; }
.vm-lead { font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.3; color: var(--c-ink); margin: 0 0 20px; }
.vm-text { font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.7; color: var(--c-ink-2); margin: 0 0 12px; max-width: 62ch; }
.vm-text strong, .vm-not strong { color: #FFFFFF; font-weight: 600; }
.vm-not-title { font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.3; color: var(--c-gold); margin: clamp(56px, 8vh, 96px) 0 0; padding-top: clamp(32px, 5vh, 56px); border-top: 1px solid rgba(255, 255, 255, 0.16); }
.vm-not { list-style: none; margin: clamp(24px, 4vh, 36px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px clamp(32px, 5vw, 96px); }
.vm-not li { font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.6; color: var(--c-ink-2); }
/* How We Work: four items, two by two (replaces the stacked 'Our Standard' rows) */
#euler-standard .es-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 5vw, 96px); }
#euler-standard .es-grid .es-step { grid-template-columns: 1fr; gap: 14px; padding: clamp(28px, 4vh, 48px) 0; }
#euler-standard .es-grid .es-step::after { display: none; }
#euler-standard .es-grid .es-step::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgba(255, 255, 255, 0.16); transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease); }
#euler-standard .es-grid .es-title { font-size: clamp(1.6rem, 2.4vw, 2.3rem); }
@media (max-width: 640px) {
  .vm-grid, .vm-not, #euler-standard .es-grid { grid-template-columns: 1fr; }
}
#euler-standard .es-grid .es-step.draw-in::before { transform: scaleX(1); }

/* =====================================================================
   V62: Research page (October 2026)
   ===================================================================== */
#research-areas .ra-panel p.ra-text { padding-bottom: 12px; }
#research-areas .ra-panel p.ra-powers { font-family: var(--f-mono); font-size: 0.8rem; letter-spacing: 0.02em; line-height: 1.7; color: #1A1C20; }
#research-areas .ra-powers-label { text-transform: uppercase; letter-spacing: 0.14em; font-size: 0.72rem; color: var(--c-gold-ink); margin-right: 6px; }
#research-areas .ra-powers a { color: var(--c-gold-ink); text-decoration: underline; text-underline-offset: 3px; }
#research-areas .ra-powers a:hover { color: #1A1B28; }
/* closed panels: links not reachable by Tab until the row is opened */
#research-areas .ra-item:not(.open) .ra-panel { visibility: hidden; transition: max-height .45s var(--ease), visibility 0s linear .45s; }
#research-areas .ra-item.open .ra-panel { visibility: visible; max-height: 420px; }
/* four working papers: two by two on desktop instead of 3 + 1 */
@media (min-width: 961px) { .fb-grid--papers4 { grid-template-columns: repeat(2, 1fr); } }

/* =====================================================================
   V63: one title size system (October 2026)
   Page titles and section titles take their size from these two rules only.
   Kept outside the system: contact-band headlines, small uppercase gold labels, card titles,
   and the document-style titles of the legal notice and privacy pages.
   ===================================================================== */
.hero-title, .page-hero h1, .daa-title, .contact-page-heading { font-size: var(--fs-page-title); line-height: 1.08; }
.section-title, .insights-title, .faq-title { font-size: var(--fs-section-title); line-height: 1.1; }
/* Research & Innovation and All Research Pipeline stay on one line on wide screens, wrap below 961px */
@media (max-width: 960px) { .page-hero--xl h1 { white-space: normal; } }

/* =====================================================================
   V63: one left edge on the homepage and Who We Are
   Every section starts its content where the homepage hero title starts:
   20px up to 640px wide, then 5% of the screen width between 48px and 96px.
   The closing contact band stays centred, as on every other page.
   ===================================================================== */
@media (max-width: 640px) { :root { --edge: 20px; } }
/* homepage */
#hero .hero-inner { padding-left: var(--edge); padding-right: var(--edge); }
.page-home .thesis-wrap { max-width: none; margin: 0; padding: 0 var(--edge); }   /* thesis keeps its 24ch / 46ch line lengths */
.page-home #proof-metrics .metric-grid { max-width: 1320px; }                       /* metrics keep their previous maximum width */
.page-home #proof-metrics .metric:first-child { padding-left: 0; }                  /* first metric's text sits on the edge */
.routing-section .container, #pedigree .container { padding-left: var(--edge); padding-right: var(--edge); }
.insights-layout { padding-left: var(--edge); }
.faq-layout { padding-left: var(--edge); padding-right: var(--edge); }
@media (max-width: 900px) { .page-home #proof-metrics .metric:nth-child(odd) { padding-left: 0; } }
/* Who We Are */
.page-about .page-hero .container,
.page-about #vision .container,
.page-about #founder .container,
.page-about #euler-standard .container { max-width: none; padding-left: var(--edge); padding-right: var(--edge); }

/* =====================================================================
   V63b: hero button spacing (phone layout now in the V64 block)
   On 360x640 and 393x660 the hero content was taller than the screen: the title ran under the
   menu bar and the booking button sat below the fold, then got covered by the next section.
   Phones only: tighter spacing and padding so everything sits between the menu bar and the bottom edge.
   ===================================================================== */
#hero .hero-actions { margin-top: 3rem; }   /* moved from an inline style; unchanged on larger screens */

/* =====================================================================
   V64: homepage content and phone layout (October 2026)
   ===================================================================== */
/* Arrow links ("→ SEE THE ENGAGEMENTS" style), with a 44px tap area */
.arrow-link { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--f-mono); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; transition: opacity .3s ease; }
.arrow-link:hover, .arrow-link:focus-visible { opacity: 0.8; }
.arrow-link--inline { display: inline; min-height: 0; padding: 12px 0; margin-left: 6px; white-space: nowrap; font-size: 0.72rem; }

/* Services: core engagement block, card label, fee-credit line, 'Across the table' band */
#services .svc-label { font-family: var(--f-mono); font-size: 0.72rem; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); margin: 0 0 16px; }
#services .fractional { padding: 0 var(--edge) clamp(40px, 6vh, 64px); }
#services .fractional-title { font-family: var(--f-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 500; line-height: 1.2; color: var(--c-gold); margin: 0 0 20px; }
#services .fractional-text { font-family: var(--f-sans); font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.7; color: #FFFFFF; max-width: 70ch; margin: 0 0 20px; }
#services .fractional-facts { font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); line-height: 1.6; margin: 0 0 8px; }
#services .fractional-links { display: flex; flex-wrap: wrap; gap: 0 32px; margin: 0; }
#services .svc-label--cards { margin: 0 var(--edge) 2rem; }
#services .svc-credit { margin: 24px var(--edge) 0; font-family: var(--f-sans); font-size: 0.9rem; line-height: 1.5; color: rgba(255, 255, 255, 0.78); }
#services .expert-band { margin-top: clamp(40px, 6vh, 64px); padding: clamp(32px, 5vh, 48px) var(--edge); border-top: 1px solid rgba(255, 255, 255, 0.14); }
#services .expert-text { font-family: var(--f-sans); font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.7; color: #FFFFFF; max-width: 70ch; margin: 0 0 4px; }

/* Metrics: larger label text at every size */
.metric-label { font-size: 0.72rem; }

/* Insights: the whole paper card is a link (stretched from the title) */
#insights .fb-col { position: relative; }
#insights .card-link { color: inherit; text-decoration: none; }
#insights .card-link::after { content: ""; position: absolute; inset: 0; z-index: 3; }
#insights .card-link:focus-visible { outline: none; }
#insights .card-link:focus-visible::after { outline: 2px solid var(--c-gold); outline-offset: -2px; }

/* Ecosystem: Security4Web3 name beside its icon */
#pedigree .logo-strip-item[data-fallback="Security4Web3"] > a { display: inline-flex; align-items: center; }
#pedigree .logo-name { margin-left: 10px; font-family: var(--f-sans); font-size: 0.82rem; line-height: 1.2; letter-spacing: 0.02em; color: rgba(255, 255, 255, 0.72); white-space: nowrap; }

/* FAQ: tighter rows at every size */
.faq-trigger { padding: 16px 0; }
.faq-q-text { font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.6; }
.faq-panel-inner { padding-bottom: clamp(1rem, 1.5vw, 1.4rem); }

/* Solutions: the column heads are buttons; they only open and close on phones */
.routing-toggle { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; background: none; border: 0; border-bottom: 1px solid rgba(46, 48, 71, 0.18); border-radius: 0; margin: 0; padding: 0 0 16px; text-align: left; cursor: default; }
.routing-toggle .faq-icon { display: none; margin-top: 0; }

@media (max-width: 640px) {
  /* 4.1 Homepage hero: no longer pinned on phones; grows with its content, at least one screen tall */
  #hero.hero { position: relative; height: auto; min-height: 100svh; padding-top: 92px; padding-bottom: 40px; justify-content: flex-start; }
  #hero .hero-title br { display: none; }                      /* the title wraps naturally */
  #hero .hero-subtext-container { margin-top: 20px; margin-bottom: 0; }
  #hero .hero-list p + p { margin-top: 5px; }
  #hero .hero-outro { display: none; }                          /* kept on laptops and desktops */
  #hero .hero-actions { margin-top: 20px; }

  /* 4.2 FAQ rows on phones */
  .faq-trigger { padding: 14px 0; }

  /* 4.3 Ecosystem logos: rows of three, half their desktop size, never wider than their cell */
  #pedigree { --logo-scale: 0.5; }
  #pedigree .logo-strip, #pedigree .logo-strip--left { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 16px; justify-items: center; align-items: center; }
  #pedigree .logo-strip-item { min-height: 0; max-width: 100%; justify-content: center; }
  #pedigree .logo-strip-item > a { max-width: 100%; justify-content: center; }
  #pedigree .logo-strip-item[data-fallback] img { max-width: 100%; object-fit: contain; }
  #pedigree .logo-strip-item[data-fallback="Security4Web3"] > a { flex-direction: column; }
  #pedigree .logo-name { margin: 4px 0 0; font-size: 0.62rem; }

  /* 4.4 Metrics: two columns */
  .page-home .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .page-home #proof-metrics .metric + .metric { border-top: 0; border-left: 1px solid rgba(255, 255, 255, 0.14); }
  .page-home #proof-metrics .metric:nth-child(odd) { border-left: 0; padding-left: 0; }
  .page-home #proof-metrics .metric:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, 0.14); }

  /* 4.5 Solutions: 'By product' and 'By role' open and close, closed by default */
  .routing-toggle { cursor: pointer; min-height: 44px; padding: 12px 0; }
  .routing-toggle .faq-icon { display: block; }
  .routing-toggle[aria-expanded="true"] .faq-icon::after { transform: rotate(0deg); opacity: 0; }
  .routing-col.is-closed .routing-list { display: none; }

  /* 4.6 Service cards: link straight under the list, 44px tap area */
  .mandate-card .mandate-card-body { flex-grow: 0; }
  .mandate-card .mandate-link { margin-top: 8px; min-height: 44px; display: inline-flex; align-items: center; }

  /* 5.5 Page heroes (Who We Are, Research, All Research, Events): fit their content */
  .page-hero { min-height: 0; height: auto; justify-content: flex-start; padding-top: 128px; padding-bottom: 64px; }
}

/* =====================================================================
   V65: homepage proof under the thesis, core-engagement panel, contact email (October 2026)
   ===================================================================== */
/* Hero: the line under the audience lines (same size, light grey, shown on every screen) */
#hero .hero-led { font-weight: 400; letter-spacing: normal; color: var(--c-ink-3); }

/* Metrics now sit under the thesis, on the off-white surface, with dark text and a thin rule above */
.metric-grid--thesis { margin: clamp(2.5rem, 5vw, 4rem) 0 0; max-width: 1320px; border-top: 1px solid rgba(46, 48, 71, 0.18); }
.metric-grid--thesis .metric-value { color: #23263A; }
.metric-grid--thesis .metric-label { text-transform: none; font-size: 0.9rem; font-weight: 400; letter-spacing: normal; line-height: 1.45; color: #2E3047; max-width: none; }
.page-home .metric-grid--thesis .metric:first-child { padding-left: 0; }
@media (max-width: 900px) { .page-home .metric-grid--thesis .metric:nth-child(odd) { padding-left: 0; } }

/* Services: the core engagement as a bordered two-column panel */
#services .fractional { margin: 0 var(--edge) 48px; padding: 56px; border: 1px solid rgba(212, 175, 55, 0.35); background: rgba(255, 255, 255, 0.04); display: grid; grid-template-columns: minmax(0, 55fr) minmax(0, 45fr); gap: clamp(32px, 4vw, 64px); align-items: start; }
#services .fractional-text { margin-bottom: 16px; }
#services .fractional-facts { margin-bottom: 24px; }
#services .fractional-btn { margin: 0 0 12px; }
#services .fractional-links { gap: 0 28px; }
#services .fractional-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, 0.14); }
#services .fractional-list li { padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14); font-family: var(--f-sans); font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.5; color: #FFFFFF; }

/* Contact band: email alternative under the button */
.contact-email { margin: 20px 0 0; font-family: var(--f-sans); font-size: 0.85rem; line-height: 1.5; color: rgba(255, 255, 255, 0.6); text-align: center; }
.contact-email a { color: var(--c-gold); }

@media (max-width: 640px) {
  /* hero: the 'Led by' line is shown on phones too */
  #hero .hero-outro { display: block; margin-top: 10px; line-height: 1.5; }
  #hero .hero-list p { line-height: 1.5; }   /* keeps the button inside a 620px-tall screen */
  /* metrics: two columns, dark rules */
  .page-home .metric-grid--thesis .metric + .metric { border-top: 0; border-left: 1px solid rgba(46, 48, 71, 0.10); }
  .page-home .metric-grid--thesis .metric:nth-child(odd) { border-left: 0; padding-left: 0; }
  .page-home .metric-grid--thesis .metric:nth-child(n+3) { border-top: 1px solid rgba(46, 48, 71, 0.10); }
  /* core-engagement panel stacks */
  #services .fractional { grid-template-columns: 1fr; padding: 24px; margin-bottom: 32px; gap: 28px; }
  /* service cards: tighter inner space */
  .mandate-card { padding: 28px 20px; }
}

/* =====================================================================
   V66: service pages share the homepage left edge and title sizes (October 2026)
   ===================================================================== */
/* Hero, Engagements, Diligence Matrix, thin rule, 2025 band and principal strip start at the homepage edge:
   20px up to 640px wide, then 5% of the screen width between 48px and 96px (was 2 x gutter = 112px) */
.daa-hero .container, .daa-grid, #engagements.offers .container, .proof-band .container, .principal-strip .container { padding-left: var(--edge); padding-right: var(--edge); }
.daa-rule { padding: 0 var(--edge); }
/* Service-page section titles use the site section-title size, dark ink, and wrap */
.offers-title, .daa-sec-title { font-size: var(--fs-section-title); line-height: 1.06; color: #14161A; white-space: normal; }

/* =====================================================================
   V67: service-page cards line up section by section; warm-paper matrix (October 2026)
   ===================================================================== */
/* From 700px wide, each card spans eight shared rows (CSS subgrid): type label, title + outcome,
   'Call us when', 'You get', rule + facts, fee-credit line (empty where a card has none),
   'How it works · Not covered', button. Sections keep their natural height and sit at the top of
   their row; the 20px space between sections is a top margin, so an empty row adds no space.
   Browsers without subgrid keep the flex column layout above. */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 700px) {
    .offer-grid { row-gap: 0; margin-bottom: -24px; }
    .offer-card { display: grid; grid-template-rows: subgrid; grid-row: span 8; row-gap: 0; margin-bottom: 24px; }
    .offer-card > * { align-self: start; margin-top: 20px; }
    .offer-card > .offer-type { grid-row: 1; margin-top: 0; }
    .offer-card > .offer-head { grid-row: 2; }
    .offer-card > .offer-head + .offer-block { grid-row: 3; }
    .offer-card > .offer-block + .offer-block { grid-row: 4; }
    .offer-card > .offer-facts { grid-row: 5; }
    .offer-card > .offer-credit { grid-row: 6; }
    .offer-card > .offer-more { grid-row: 7; }
    .offer-card > .offer-cta { grid-row: 8; }
  }
}
/* The Diligence Matrix on a warm paper tone drawn from the brand bronze, so it no longer shares
   the off-white of the Engagements section above it. Text colours and row rules unchanged. */
.daa-section.diligence-matrix { background: #F3EEE6; }

/* =====================================================================
   V68: hero 'Led by' line and Engagements audience line, shared by the allocator and regulated pages;
   the 2025 band below exists on the allocator page only
   ===================================================================== */
/* Hero: 'Led by' line under the buttons */
.hero-byline { margin: 18px 0 0; font-family: var(--f-sans); font-size: 0.95rem; font-weight: 400; line-height: 1.5; color: rgba(255, 255, 255, 0.65); }
/* Engagements: audience line under the title (pulled up to ~14px; keeps the title-to-cards gap below it) */
.offers-audience { margin: calc(14px - clamp(28px, 4vh, 44px)) 0 clamp(28px, 4vh, 44px); max-width: 64ch; font-family: var(--f-sans); font-size: 1.05rem; line-height: 1.6; color: #4A4E66; }
/* 'What 2025 taught allocators': deep slate band, two columns from 900px */
.proof-band { background: #1A1B28; border-top: 0; }
.proof-band .offers-eyebrow { color: #D4AF37; }
.proof-band .proof-text { color: rgba(255, 255, 255, 0.82); margin: 0; }
.proof-band .proof-punch { color: #FAFAFA; font-size: clamp(1.75rem, 2.8vw, 2.5rem); line-height: 1.2; max-width: 24ch; }
.proof-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.proof-cta { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; font-family: var(--f-sans); font-size: 1rem; color: #D4AF37; text-decoration: underline; text-underline-offset: 4px; }
.proof-cta:hover, .proof-cta:focus-visible { color: #FAFAFA; }
@media (min-width: 900px) {
  .proof-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: clamp(40px, 5vw, 96px); align-items: end; }
}

/* =====================================================================
   V72: Research & Innovation (research.html only: everything scoped to .page-research)
   ===================================================================== */
/* Standard page edge: 20px up to 640px wide, then 5% of the screen width between 48px and 96px */
.page-research .page-hero .container,
.page-research #research-areas .container,
.page-research #rd-commitment .container,
.page-research #pipeline .container,
.page-research #engagements .container { padding-left: var(--edge); padding-right: var(--edge); }
/* Research Areas: line under the title */
.page-research .ra-intro { margin: 16px 0 0; max-width: 30ch; font-family: var(--f-sans); font-size: 1.05rem; line-height: 1.6; color: #4A4E66; }
/* Ongoing Research: outer card text on the page edge; grid lines and inner padding unchanged */
.page-research #pipeline .fb-col:first-child { padding-left: var(--edge); }
.page-research #pipeline .fb-col:last-child { padding-right: var(--edge); }
.page-research #pipeline .pl-badge { right: clamp(28px, 3.4vw, 56px); }            /* on the card's right text edge */
.page-research #pipeline .fb-col:last-child .pl-badge { right: var(--edge); }
@media (max-width: 980px) {
  .page-research #pipeline .fb-col { padding-left: var(--edge); padding-right: var(--edge); }
  .page-research #pipeline .pl-badge { right: var(--edge); }
}

/* =====================================================================
   V73: research.html laptop fit (scoped to .page-research)
   ===================================================================== */
/* Research Areas: compact, all seven rows visible on a 13-inch screen */
.page-research #research-areas { padding-top: clamp(48px, 8vh, 96px); padding-bottom: clamp(48px, 8vh, 96px); }
.page-research #research-areas .ra-accordion { margin-top: 0; }
.page-research #research-areas .ra-row { padding-top: clamp(11px, 1.1vw, 16px); padding-bottom: clamp(11px, 1.1vw, 16px); }
.page-research #research-areas .ra-title { font-size: clamp(1.1rem, 1.55vw, 1.4rem); }
.page-research #research-areas .ra-panel p.ra-powers { padding-bottom: clamp(14px, 1.4vw, 20px); }
/* How We Publish */
.page-research #rd-commitment { padding-top: clamp(44px, 7vh, 96px); }
/* Ongoing Research */
.page-research #pipeline { padding-top: clamp(48px, 7vh, 96px); }
.page-research #pipeline .fb-grid { margin-top: clamp(28px, 4vh, 48px); }
.page-research #pipeline .pipeline-cta { margin-top: clamp(32px, 5vh, 56px); }
.page-research #pipeline .fb-col { padding-top: clamp(20px, 2vw, 32px); padding-bottom: clamp(20px, 2vw, 32px); }
.page-research #pipeline .pl-cover { height: 104px; margin-bottom: 16px; }
.page-research #pipeline .pl-collab-logos { height: 60px; align-items: center; flex-wrap: nowrap; }
.page-research #pipeline .pl-collab-logos img.bdf-logo { max-height: 60px; }
/* 'Working paper' label on the cover image, 12px inside its top-right corner */
.page-research #pipeline .pl-badge { top: calc(clamp(20px, 2vw, 32px) + 12px); bottom: auto; right: calc(clamp(28px, 3.4vw, 56px) + 12px); }
.page-research #pipeline .fb-col:last-child .pl-badge { right: calc(var(--edge) + 12px); }
@media (max-width: 980px) {
  .page-research #pipeline .pl-badge { right: calc(var(--edge) + 12px); }
}
/* Cards side by side line up row by row: cover, title, summary, collaborators (CSS subgrid) */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 981px) {
    .page-research #pipeline .fb-col { display: grid; grid-template-rows: subgrid; grid-row: span 4; height: auto; }
    .page-research #pipeline .fb-col > :not(.pl-badge) { align-self: start; }
    .page-research #pipeline .fb-col > .pl-cover { grid-row: 1; }
    .page-research #pipeline .fb-col > .fb-title { grid-row: 2; }
    .page-research #pipeline .fb-col > .fb-text { grid-row: 3; }
    .page-research #pipeline .fb-col > .pl-collab { grid-row: 4; }
  }
}
/* Workshops and Talks */
.page-research #engagements { padding-top: clamp(52px, 8vh, 120px); padding-bottom: clamp(52px, 8vh, 120px); }

/* =====================================================================
   V78: flat menu, "Book a call" outlined in gold, Workshops formats band
   ===================================================================== */
.site-nav a.nav-cta { border: 1px solid var(--c-gold); padding: 9px 16px; line-height: 1; transition: background .3s var(--ease); }
.site-nav a.nav-cta::after { display: none; }   /* no hover underline on the button */
.site-nav a.nav-cta:hover, .site-nav a.nav-cta.is-active { background: rgba(212, 175, 55, 0.12); }
.mobile-nav a.nav-cta { color: var(--c-gold); }
/* Workshops: line under the three format cards, as on the homepage Services section */
#formats .svc-credit { margin: 24px var(--edge) 0; font-family: var(--f-sans); font-size: 0.9rem; line-height: 1.5; color: rgba(255, 255, 255, 0.78); }
/* Footer: nine links fit on one line beside the logo on 13-inch laptops */
.footer-nav { column-gap: 20px; }
/* Footer logo on phones */
@media (max-width: 640px) { .footer-logo-img { width: 260px; height: 64px; } }

/* =====================================================================
   HOME — SERVICES EXPLORER
   Heading and menu on the left (.sx-side), one panel on the right.
   script.js adds .is-ready; without it every group's offers and all
   13 panels show, each panel in its own frame.
   ===================================================================== */
.page-home #services.sx-section { background: #2E3047; padding: clamp(28px, 5.5vh, 80px) var(--edge); }   /* overrides the older #services padding */
#services .sx-eyebrow { margin: 0 0 clamp(10px, 1.8vh, 18px); }
#services .sx-title { font-family: var(--f-serif); font-size: clamp(1.9rem, min(3.2vw, 5.6vh), 3.25rem); font-weight: 400; line-height: 1.12; letter-spacing: -0.01em; color: #FFFFFF; margin: 0 0 clamp(8px, 1.4vh, 14px); text-wrap: balance; }
#services .sx-lede { font-family: var(--f-sans); font-size: clamp(1rem, min(1.25vw, 2.3vh), 1.2rem); line-height: 1.5; color: rgba(255, 255, 255, 0.8); margin: 0; }
.sx { width: 100%; max-width: 1560px; margin: 0; }
.sx-side { min-width: 0; }
.sx-menu { margin-top: clamp(20px, 4vh, 44px); }

/* Menu: groups (name + short line) and their offers */
.sx-group { border-top: 1px solid rgba(255, 255, 255, 0.12); }
.sx-group:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.sx-gbtn { -webkit-appearance: none; appearance: none; display: flex; flex-direction: column; align-items: flex-start; width: 100%; margin: 0; padding: clamp(8px, 1.6vh, 15px) 16px; background: none; border: 0; border-left: 2px solid transparent; border-radius: 0; text-align: left; color: inherit; font: inherit; cursor: pointer; transition: border-color .45s var(--ease); }
.sx-gname { font-family: var(--f-serif); font-size: clamp(1.2rem, min(1.6vw, 2.9vh), 1.6rem); font-weight: 400; line-height: 1.1; color: rgba(255, 255, 255, 0.62); transition: color .45s var(--ease); }
.sx-gsub { margin-top: 4px; font-family: var(--f-mono); font-size: 0.64rem; line-height: 1.25; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.42); }
.sx-group.is-open .sx-gbtn { border-left-color: var(--c-gold); }
.sx-group.is-open .sx-gname, .sx-gbtn:hover .sx-gname { color: #FFFFFF; }
.sx-offers { list-style: none; margin: 0; padding: 0 0 10px 18px; }
.sx-offer { -webkit-appearance: none; appearance: none; display: flex; align-items: flex-start; gap: 12px; width: 100%; margin: 0; padding: clamp(5px, 0.9vh, 8px) 0; background: none; border: 0; border-radius: 0; text-align: left; font-family: var(--f-sans); font-size: clamp(0.88rem, min(1.05vw, 1.95vh), 1rem); line-height: 1.3; color: rgba(255, 255, 255, 0.7); cursor: pointer; transition: color .25s ease; }
.sx-offer::before { content: ""; flex: 0 0 auto; box-sizing: border-box; width: 6px; height: 6px; margin-top: calc(0.65em - 3px); border: 1px solid rgba(212, 175, 55, 0.55); transform: rotate(45deg); transition: background .25s ease, border-color .25s ease; }   /* diamond level with the first line */
.sx-offer:hover, .sx-offer[aria-current="true"] { color: #FFFFFF; }
.sx-offer[aria-current="true"]::before { background: var(--c-gold); border-color: var(--c-gold); }
.sx-gbtn:focus-visible, .sx-offer:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }

/* Panels: without JS each has its own frame, one after another */
.sx-panels { display: grid; gap: 16px; min-width: 0; }
.sx-panel { box-sizing: border-box; min-width: 0; display: flex; flex-direction: column; background: linear-gradient(160deg, var(--c-outerspc) 0%, var(--c-arsenic) 100%); border: 1px solid rgba(212, 175, 55, 0.35); padding: clamp(22px, 3.6vh, 44px) clamp(24px, 2.6vw, 48px); }
.sx-type { margin: 0 0 6px; font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-gold); }
.sx-name { margin: 0 0 8px; font-family: var(--f-serif); font-size: clamp(1.5rem, min(2.4vw, 4.4vh), 2.4rem); font-weight: 500; line-height: 1.15; color: var(--c-gold); }
.sx-promise { margin: 0 0 14px; font-family: var(--f-sans); font-size: clamp(1rem, min(1.35vw, 2.45vh), 1.25rem); line-height: 1.45; color: #FFFFFF; }
.sx-get { margin: 0 0 6px; font-family: var(--f-mono); font-size: 0.64rem; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255, 255, 255, 0.5); }
.sx-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(212, 175, 55, 0.22); }
.sx-list li { padding: clamp(5px, 1vh, 9px) 0; border-bottom: 1px solid rgba(212, 175, 55, 0.22); font-family: var(--f-sans); font-size: clamp(0.92rem, min(1.12vw, 2.05vh), 1.08rem); line-height: 1.45; color: rgba(255, 255, 255, 0.88); }
.sx-facts { margin: 14px 0 0; font-family: var(--f-mono); font-size: 0.68rem; line-height: 1.6; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.62); }
.sx-credit { margin: 6px 0 0; font-family: var(--f-sans); font-size: 0.86rem; line-height: 1.5; color: rgba(255, 255, 255, 0.7); }
.sx-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 28px; margin-top: auto; padding-top: 16px; }   /* pinned to the bottom of the frame, at least 16px below the content */

/* With JS: the frame moves to the panel area and stays still; panels share one grid cell and only the content fades */
.sx.is-ready .sx-panels { gap: 0; background: linear-gradient(160deg, var(--c-outerspc) 0%, var(--c-arsenic) 100%); border: 1px solid rgba(212, 175, 55, 0.35); }
.sx.is-ready .sx-panel { grid-area: 1 / 1; background: none; border: 0; visibility: hidden; opacity: 0; transform: translateY(8px); transition: opacity .2s ease, visibility 0s linear .2s, transform 0s linear .2s; }
.sx.is-ready .sx-panel.is-current { visibility: visible; opacity: 1; transform: none; transition: opacity .6s ease .15s, transform .7s var(--ease) .15s, visibility 0s; }

/* 1200px and wider: two columns; the menu is a grid (buttons left, the open group's offers right) */
@media (min-width: 1200px) {
  .sx { display: grid; grid-template-columns: minmax(480px, 40%) minmax(0, 1fr); column-gap: clamp(28px, 3vw, 56px); align-items: stretch; }
  .sx.is-ready .sx-menu { display: grid; grid-template-columns: max-content minmax(0, 1fr); grid-template-rows: repeat(5, auto); column-gap: 22px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
  .sx.is-ready .sx-group { display: contents; }   /* button and list sit directly in the menu grid */
  .sx.is-ready .sx-gbtn { grid-column: 1; width: auto; border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .sx.is-ready .sx-offers { grid-column: 2; align-self: start; min-width: 0; padding: clamp(5px, 1.2vh, 11px) 0 0; visibility: hidden; opacity: 0; transform: translateX(-6px); transition: opacity .2s ease, visibility 0s linear .2s, transform 0s linear .2s; }
  .sx.is-ready .sx-group.is-open .sx-offers { visibility: visible; opacity: 1; transform: none; transition: opacity .45s ease .12s, transform .5s var(--ease) .12s, visibility 0s; }
  .sx.is-ready .sx-group:nth-child(1) .sx-gbtn { grid-row: 1; }
  .sx.is-ready .sx-group:nth-child(2) .sx-gbtn { grid-row: 2; }
  .sx.is-ready .sx-group:nth-child(3) .sx-gbtn { grid-row: 3; }
  .sx.is-ready .sx-group:nth-child(4) .sx-gbtn { grid-row: 4; }
  .sx.is-ready .sx-group:nth-child(5) .sx-gbtn { grid-row: 5; }
  .sx.is-ready .sx-group:nth-child(1) .sx-offers { grid-row: 1 / 6; }
  .sx.is-ready .sx-group:nth-child(2) .sx-offers { grid-row: 2 / 6; }
  .sx.is-ready .sx-group:nth-child(3) .sx-offers { grid-row: 3 / 6; }
  .sx.is-ready .sx-group:nth-child(4) .sx-offers { grid-row: 4 / 6; }
  .sx.is-ready .sx-group:nth-child(5) .sx-offers { grid-row: 5 / 6; }
}

/* Below 1200px: one column; groups become outlined buttons that wrap, the open group's offers follow, one panel underneath */
@media (max-width: 1199px) {
  .sx-gsub { display: none; }
  .sx.is-ready .sx-menu { display: flex; flex-wrap: wrap; gap: 8px; }
  .sx.is-ready .sx-group { display: contents; }
  .sx.is-ready .sx-gbtn { display: inline-flex; width: auto; min-height: 44px; justify-content: center; padding: 8px 14px; border: 1px solid rgba(255, 255, 255, 0.28); }
  .sx.is-ready .sx-gname { font-size: 1.08rem; color: rgba(255, 255, 255, 0.8); }
  .sx.is-ready .sx-group.is-open .sx-gbtn { border-color: var(--c-gold); }
  .sx.is-ready .sx-group.is-open .sx-gname { color: #FFFFFF; }
  .sx.is-ready .sx-offers { order: 2; flex: 0 0 100%; display: flex; flex-wrap: wrap; gap: 0 22px; padding: 8px 0 0; }
  .sx.is-ready .sx-group:not(.is-open) .sx-offers { display: none; }
  .sx.is-ready .sx-offer { width: auto; min-height: 44px; align-items: center; padding: 6px 0; }
  .sx.is-ready .sx-offer::before { margin-top: 0; }
  .sx-panels { margin-top: 16px; }
  .sx.is-ready .sx-panel:not(.is-current) { display: none; }
  .sx-panel { scroll-margin-top: 16px; }
  @starting-style { .sx.is-ready .sx-panel.is-current { opacity: 0; transform: translateY(8px); } }
}

@media (prefers-reduced-motion: reduce) {
  .sx .sx-gbtn, .sx .sx-gname, .sx .sx-offer, .sx .sx-offer::before,
  .sx.is-ready .sx-panel, .sx.is-ready .sx-panel.is-current,
  .sx.is-ready .sx-offers, .sx.is-ready .sx-group.is-open .sx-offers { transition: none !important; transform: none !important; }
}

/* =====================================================================
   HOME — ONE SCREEN PER SECTION (961px and wider), thesis sizes,
   Ecosystem & Foundations on the light surface, Insights on navy
   ===================================================================== */
.page-home #thesis { padding: clamp(28px, 5.5vh, 80px) 0; }
.page-home #pedigree { background: #FAFAFA; padding: clamp(28px, 5.5vh, 80px) 0; }
@media (min-width: 961px) {
  .page-home #thesis, .page-home #services, .page-home #pedigree {
    min-height: calc(100vh - 73px);
    min-height: calc(100svh - 73px);
    display: flex; flex-direction: column; justify-content: center;
  }
  .page-home #pedigree .container { width: 100%; }   /* keeps the full width inside the flex column */
  .page-home .thesis-body { max-width: none; }
  .page-home .thesis-line { display: block; }        /* the paragraph reads on three lines */
}

/* Thesis, tied to the window height */
.page-home .thesis-lead--v58 { font-size: clamp(2rem, min(4.2vw, 7.4vh), 4rem); margin: 0 0 clamp(14px, 2.6vh, 32px); }
.page-home .thesis-body { font-size: clamp(1.05rem, min(1.6vw, 2.9vh), 1.5rem); }
.page-home .metric-grid--thesis { margin-top: clamp(20px, 4.4vh, 64px); }
.page-home .metric-grid--thesis .metric { padding-top: clamp(16px, 3.4vh, 48px); padding-bottom: clamp(8px, 2vh, 40px); }
.page-home .metric-grid--thesis .metric-value { font-size: clamp(2.25rem, min(5vw, 8.4vh), 4.25rem); }
.page-home .metric-grid--thesis .metric-label { margin-top: clamp(8px, 1.6vh, 20px); }

/* Ecosystem & Foundations: one left-aligned column on #FAFAFA, dark silhouettes */
.page-home #pedigree .pedigree-head { display: block; }
.page-home #pedigree .pedigree-head .section-title { color: #7A5C12; margin: 0 0 clamp(10px, 1.8vh, 18px); }
.page-home #pedigree .pedigree-intro { text-align: left; margin: 0; max-width: 60ch; font-family: var(--f-serif); font-size: clamp(1.3rem, min(1.9vw, 3.4vh), 1.85rem); line-height: 1.3; color: #1A1B28; }
.page-home #pedigree .pedigree-logos { margin-top: clamp(16px, 3.4vh, 44px); }
.page-home #pedigree .logo-strip-block { padding: clamp(14px, 2.7vh, 34px) 0; }
.page-home #pedigree .pedigree-logos .logo-strip-block:last-child { padding-bottom: 0; }
.page-home #pedigree .logo-strip-block + .logo-strip-block { border-top: 1px solid rgba(46, 48, 71, 0.12); }
.page-home #pedigree .logo-strip-overline { margin: 0 0 clamp(12px, 2.4vh, 26px); font-family: var(--f-mono); font-size: 0.7rem; font-weight: 400; line-height: 1.4; letter-spacing: 0.18em; text-transform: uppercase; color: #707793; }
.page-home #pedigree .logo-strip { align-items: center; }
.page-home #pedigree .logo-strip-item img { filter: grayscale(1) brightness(0); opacity: 0.62; }
.page-home #pedigree .logo-strip-item:hover img { opacity: 0.9; }
.page-home #pedigree .logo-name { color: rgba(26, 27, 40, 0.72); }

/* Latest Insights on the Services navy */
.page-home #insights { background: #2E3047; }

/* =====================================================================
   HOME HERO — what the firm is, and three audience routes
   ===================================================================== */
#hero .hero-what { margin: 0 0 clamp(18px, 2.6vh, 28px); max-width: 40em; font-family: var(--f-sans); font-size: clamp(1.08rem, 1.45vw, 1.3rem); line-height: 1.5; color: #FFFFFF; }
#hero .hero-routes { list-style: none; margin: 0; padding: 0; max-width: 46em; }
#hero .hero-routes a { display: grid; grid-template-columns: 9.5em minmax(0, 1fr) auto; align-items: baseline; column-gap: 18px; padding: 7px 0; color: var(--c-ink-2); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.08); transition: border-color .3s var(--ease); }
#hero .hero-routes li:first-child a { border-top: 1px solid rgba(255, 255, 255, 0.08); }
#hero .hr-who { color: var(--c-gold); font-weight: 600; }
#hero .hr-what { transition: color .3s var(--ease); }
#hero .hr-arrow { color: var(--c-gold); opacity: 0.55; transition: opacity .3s var(--ease), transform .3s var(--ease); }
#hero .hero-routes a:hover, #hero .hero-routes a:focus-visible { border-color: rgba(212, 175, 55, 0.45); }
#hero .hero-routes a:hover .hr-what, #hero .hero-routes a:focus-visible .hr-what { color: #FFFFFF; }
#hero .hero-routes a:hover .hr-arrow, #hero .hero-routes a:focus-visible .hr-arrow { opacity: 1; transform: translateX(4px); }
@media (max-width: 640px) {
  #hero .hero-routes a { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  #hero .hr-who { grid-column: 1; grid-row: 1; }
  #hero .hr-what { grid-column: 1; grid-row: 2; }
  #hero .hr-arrow { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}
@media (prefers-reduced-motion: reduce) {
  #hero .hero-routes a, #hero .hr-what, #hero .hr-arrow { transition: none; }
  #hero .hero-routes a:hover .hr-arrow, #hero .hero-routes a:focus-visible .hr-arrow { transform: none; }
}

/* =====================================================================
   AUDIENCE PAGES — one engagement per row (.offers-rows)
   Left: type, for line, name and promise, 'Call us when', facts, extra line, button.
   Right: 'You get', 'How it works', 'Not covered' (always visible).
   ===================================================================== */
.offer-left, .offer-right { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.offer-text { margin: 0; font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.6; color: #2E3047; }
.offer-text a { color: #7A5C12; }
.offers-rows .offer-card { scroll-margin-top: 0; }   /* html scroll-padding-top (110px) sets the offset; the card's own 110px margin doubled it to 220px */
@media (min-width: 1100px) {
  .offers-rows .offer-grid { display: flex; flex-direction: column; gap: 24px; row-gap: 24px; margin-bottom: 0; }
  .offers-rows .offer-card { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); grid-template-rows: none; grid-row: auto; column-gap: clamp(36px, 4.5vw, 80px); row-gap: 0; margin-bottom: 0; padding: clamp(32px, 4.4vh, 52px) clamp(28px, 3.2vw, 52px); align-items: stretch; }
  .offers-rows .offer-card > * { grid-row: auto; margin-top: 0; align-self: stretch; }   /* overrides the subgrid rows of the three-card grid */
  .offers-rows .offer-right { gap: 22px; border-left: 1px solid rgba(46, 48, 71, 0.12); padding-left: clamp(24px, 3vw, 52px); }
  .offers-rows .offer-left .offer-cta { margin-top: auto; align-self: flex-start; }
}
@media (max-width: 1099px) {
  .offers-rows .offer-card { display: flex; flex-direction: column; gap: 0; grid-template-rows: none; grid-row: auto; margin-bottom: 0; }
  .offers-rows .offer-grid { row-gap: 24px; margin-bottom: 0; }
  .offers-rows .offer-card > * { grid-row: auto; margin-top: 0; }
  .offers-rows .offer-right { margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(46, 48, 71, 0.12); }
}

/* =====================================================================
   AUDIENCE PAGES — the three matrices: all seven rows on one screen
   ===================================================================== */
.daa-section.diligence-matrix { padding: clamp(24px, 4.5vh, 72px) 0; }
@media (min-width: 961px) {
  .daa-section.diligence-matrix {
    min-height: calc(100vh - 73px);
    min-height: calc(100svh - 73px);
    display: flex; flex-direction: column; justify-content: center;
  }
  .daa-section.diligence-matrix > .container { width: 100%; }
}
.daa-section.diligence-matrix .daa-sec-title { font-size: clamp(1.9rem, min(3.4vw, 6vh), 3.25rem); margin-bottom: clamp(8px, 1.4vh, 14px); }
.daa-section.diligence-matrix .daa-macro { font-size: clamp(1rem, min(1.3vw, 2.4vh), 1.25rem); line-height: 1.45; margin-bottom: clamp(14px, 2.8vh, 32px); }
.daa-section.diligence-matrix .matrix-header { grid-template-columns: 4fr 8fr; gap: clamp(28px, 3.5vw, 64px); padding-bottom: clamp(6px, 1.1vh, 12px); }
.daa-section.diligence-matrix .matrix-row { grid-template-columns: 4fr 8fr; gap: clamp(28px, 3.5vw, 64px); padding: clamp(6px, 1.25vh, 14px) 0; }
.daa-section.diligence-matrix .matrix-left { font-size: clamp(0.95rem, min(1.12vw, 2.05vh), 1.2rem); line-height: 1.35; }
.daa-section.diligence-matrix .matrix-right { font-size: clamp(0.9rem, min(1.02vw, 1.9vh), 1.08rem); line-height: 1.45; }
.daa-section.diligence-matrix .matrix-right > span:last-child:not(:first-child) { white-space: nowrap; }   /* the section tag (§ …) never breaks */
.daa-section.diligence-matrix .matrix-closing { padding-top: clamp(8px, 1.8vh, 22px); font-size: clamp(1rem, min(1.25vw, 2.3vh), 1.3rem); }
.daa-section.diligence-matrix .matrix-closing p { margin: 0; }
@media (max-width: 960px) {
  .daa-section.diligence-matrix .matrix-header { display: none; }   /* stacked rows don't align to the two headers */
  .daa-section.diligence-matrix .matrix-row { grid-template-columns: 1fr; gap: 8px; padding: 16px 0; }
}

/* =====================================================================
   RESEARCH — Ongoing Research as rows (light version of the Past sessions list)
   ===================================================================== */
.page-research #pipeline.research-rows { padding-bottom: clamp(48px, 7vh, 96px); }
#pipeline .eng-rows { position: relative; margin-top: clamp(28px, 4vh, 48px); }
#pipeline .eng-row { position: relative; display: grid; grid-template-columns: 140px 180px minmax(0, 1fr); gap: clamp(20px, 3vw, 56px); align-items: start; padding: clamp(26px, 4vh, 44px) 0; scroll-margin-top: 0; }   /* the page's scroll-padding-top (110px) already keeps a linked row below the header; a 110px margin on top of it doubled the offset */
#pipeline .eng-row::after,
#pipeline .eng-row:first-child::before { content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(20, 22, 26, 0.16); transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease); }
#pipeline .eng-row::after { bottom: 0; }
#pipeline .eng-row:first-child::before { top: 0; }
#pipeline .eng-row.draw-in::after,
#pipeline .eng-row.draw-in::before { transform: scaleX(1); }
#pipeline .eng-meta { display: flex; flex-direction: column; gap: 8px; }
#pipeline .eng-date { font-family: var(--f-mono); font-size: clamp(1rem, 1.3vw, 1.2rem); letter-spacing: 0.04em; color: #7A5C12; }
#pipeline .eng-type { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: #5A5E64; }
#pipeline .eng-logos { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
#pipeline .eng-logo { display: block; height: 40px; width: auto; max-width: 160px; object-fit: contain; object-position: left center; filter: grayscale(1); opacity: 0.75; }
#pipeline .eng-content { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
#pipeline .eng-title { margin: 0; font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; line-height: 1.2; color: #14161A; }
#pipeline .eng-venue { margin: 0; font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: #5A5E64; }
#pipeline .eng-role { margin: 4px 0 0; font-family: var(--f-sans); font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.7; color: #1A1C20; }
#pipeline .clamp-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#pipeline .clamp-text.expanded { display: block; -webkit-line-clamp: unset; overflow: visible; }
#pipeline .eng-actions { display: flex; justify-content: flex-end; }
#pipeline .clamp-toggle { flex: none; min-height: 32px; white-space: nowrap; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: #14161A; opacity: 0.6; transition: opacity .2s; }
#pipeline .clamp-toggle:hover, #pipeline .clamp-toggle:focus-visible { opacity: 1; }
@media (max-width: 900px) {
  #pipeline .eng-row { grid-template-columns: 1fr; gap: 16px; }
  #pipeline .eng-logos { flex-direction: row; flex-wrap: wrap; align-items: center; }
}

/* =====================================================================
   FOOTER LOGO — sized to the room beside the footer text
   ===================================================================== */
@media (min-width: 961px) {
  .footer-logo-img { height: clamp(72px, 6.2vw, 112px); width: auto; }
  .footer-inner { gap: clamp(32px, 4vw, 80px); }
}
@media (max-width: 960px) { .footer-logo-img { height: 72px; width: auto; } }
@media (max-width: 640px) { .footer-logo-img { height: 64px; width: auto; } }


/* =====================================================================
   V82/V83: allocator page, 2025 case file (public data) right after the hero
   ===================================================================== */
.case-file { position: relative; z-index: 10; background: #2E3047; color: #FFFFFF; padding: clamp(24px, 4.5vh, 72px) 0; }
@media (min-width: 961px) { .case-file { box-sizing: border-box; min-height: calc(100vh - 73px); min-height: calc(100svh - 73px); display: flex; flex-direction: column; justify-content: center; } }
@media (min-width: 961px) and (max-height: 700px) { .case-file { padding: 18px 0; } }
.case-file .container { max-width: none; padding-left: var(--edge); padding-right: var(--edge); width: 100%; box-sizing: border-box; }
.cf-eyebrow { margin: 0 0 clamp(10px, 1.8vh, 18px); font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-gold); }
.cf-title { margin: 0 0 clamp(8px, 1.4vh, 14px); max-width: 36ch; font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.5rem, min(3.2vw, 4.6vh), 3rem); line-height: 1.12; letter-spacing: -0.01em; color: #FFFFFF; text-wrap: balance; }
.cf-lede { margin: 0; max-width: 62rem; font-family: var(--f-sans); font-size: clamp(0.98rem, min(1.2vw, 2.2vh), 1.15rem); line-height: 1.5; color: rgba(255, 255, 255, 0.78); }

/* tabs */
.cf-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(12px, 2.4vh, 32px) 0 clamp(8px, 1.4vh, 18px); }
.cf-tab { -webkit-appearance: none; appearance: none; display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 44px; padding: 9px 16px; background: none; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 0; color: rgba(255, 255, 255, 0.72); text-align: left; cursor: pointer; font: inherit; transition: border-color .4s ease, color .4s ease, background .4s ease; }
.cf-tab-date { font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-gold); }
.cf-tab-name { font-family: var(--f-sans); font-size: 0.95rem; }
.cf-tab:hover { color: #FFFFFF; border-color: rgba(212, 175, 55, 0.55); }
.cf-tab[aria-selected="true"] { color: #FFFFFF; border-color: var(--c-gold); background: rgba(212, 175, 55, 0.08); }
.cf-tab:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }

/* panels: all show without JS; with JS one at a time, in one grid cell so nothing jumps */
.cf-panels { display: grid; gap: 24px; }
.cf-panel { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 64px); align-items: stretch; padding: clamp(14px, 2.4vh, 30px) clamp(18px, 2.4vw, 36px); background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(212, 175, 55, 0.3); }
.case-file.is-ready .cf-panels { gap: 0; }
.case-file.is-ready .cf-panel { grid-area: 1 / 1; visibility: hidden; opacity: 0; transition: opacity .25s ease, visibility 0s linear .25s; }
.case-file.is-ready .cf-panel.is-current { visibility: visible; opacity: 1; transition: opacity .6s ease .1s, visibility 0s; }
.cf-figure { margin: 0; min-width: 0; display: flex; flex-direction: column; }
.cf-cap { margin: 0 0 clamp(8px, 1.6vh, 22px); font-family: var(--f-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }

/* panel 1: dot plot on a price scale ($0.60 to $1.00); position encodes the price */
.cf-dots { --lab: 5.5rem; --val: 8.5rem; position: relative; flex: 1 1 auto; display: flex; flex-direction: column; padding-top: clamp(6px, 1.6vh, 22px); }
.cf-scale { position: relative; height: 16px; margin: 0 var(--val) 6px var(--lab); }
.cf-scale span { position: absolute; top: 0; transform: translateX(-50%); font-family: var(--f-mono); font-size: 0.68rem; color: rgba(255, 255, 255, 0.5); }
.cf-dot-row { display: grid; grid-template-columns: var(--lab) minmax(0, 1fr) var(--val); align-items: center; flex: 1 1 auto; min-height: clamp(32px, 5.4vh, 58px); border-top: 1px solid rgba(255, 255, 255, 0.08); }
.cf-dot-row:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.cf-venue { font-family: var(--f-sans); font-size: 0.95rem; color: #FFFFFF; }
.cf-track { position: relative; height: 2px; background: rgba(255, 255, 255, 0.16); }
.cf-peg { position: absolute; right: 0; top: -14px; bottom: -14px; width: 1px; background: rgba(255, 255, 255, 0.45); }
.cf-dot { position: absolute; top: 50%; left: var(--x); width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--c-gold); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.18); }
.cf-val { padding-left: 16px; font-family: var(--f-mono); font-size: 0.82rem; color: var(--c-gold); white-space: nowrap; }

/* panel 2: dependency map, bars start at zero and scale with the amount lent */
.cf-map-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr); gap: 0; align-items: center; }
.cf-node--hub { position: relative; padding: clamp(14px, 2.2vh, 22px) clamp(14px, 1.6vw, 22px); border: 1px solid var(--c-gold); background: rgba(212, 175, 55, 0.07); }
.cf-node--hub::after { content: ""; position: absolute; top: 50%; right: -28px; width: 28px; height: 1px; background: rgba(212, 175, 55, 0.6); }
.cf-node-name { margin: 0 0 8px; font-family: var(--f-serif); font-size: clamp(1.1rem, 1.5vw, 1.35rem); color: var(--c-gold); }
.cf-node-fact { margin: 0 0 6px; font-family: var(--f-sans); font-size: 0.88rem; line-height: 1.45; color: rgba(255, 255, 255, 0.86); }
.cf-node-fact:last-child { margin-bottom: 0; }
.cf-lenders { position: relative; margin-left: 28px; padding-left: 24px; border-left: 1px solid rgba(212, 175, 55, 0.6); display: flex; flex-direction: column; gap: clamp(8px, 1.6vh, 14px); }
.cf-lender { position: relative; display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) 4.8rem; align-items: center; column-gap: 12px; row-gap: 4px; }
.cf-lender::before { content: ""; position: absolute; left: -24px; top: 0.75em; width: 18px; height: 1px; background: rgba(212, 175, 55, 0.6); }
.cf-l-name { font-family: var(--f-sans); font-size: 0.92rem; color: #FFFFFF; }
.cf-bar { height: 10px; background: rgba(255, 255, 255, 0.08); }
.cf-bar span { display: block; height: 100%; width: var(--w); background: var(--c-gold); opacity: 0.85; }
.cf-l-amt { font-family: var(--f-mono); font-size: 0.82rem; color: var(--c-gold); text-align: right; }
.cf-l-note { grid-column: 2 / 4; font-family: var(--f-sans); font-size: 0.82rem; line-height: 1.4; color: rgba(255, 255, 255, 0.72); }
.cf-total { margin: 4px 0 0; font-family: var(--f-mono); font-size: 0.72rem; line-height: 1.5; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.6); }

/* reading column */
.cf-read { min-width: 0; align-self: start; }
.cf-k { margin: 0 0 8px; font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-gold); }
.cf-say { margin: 0 0 12px; font-family: var(--f-serif); font-size: clamp(1.25rem, min(1.8vw, 3.2vh), 1.7rem); line-height: 1.2; color: #FFFFFF; }
.cf-body { margin: 0 0 14px; font-family: var(--f-sans); font-size: clamp(0.92rem, min(1.05vw, 1.95vh), 1.02rem); line-height: 1.55; color: rgba(255, 255, 255, 0.82); }
.cf-src { margin: 0; font-family: var(--f-mono); font-size: 0.7rem; line-height: 1.6; color: rgba(255, 255, 255, 0.55); }
.cf-src a { color: rgba(255, 255, 255, 0.75); text-decoration: underline; text-underline-offset: 3px; }
.cf-src a:hover { color: var(--c-gold); }
.cf-actions { margin: clamp(10px, 2vh, 24px) 0 0; }
.cf-cta { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; }
.cf-cta:hover { text-decoration: underline; text-underline-offset: 4px; }

/* the dots and bars draw in when their panel appears */
.case-file.is-ready .cf-panel .cf-dot { left: 100%; transition: left 1.1s var(--ease) .2s; }
.case-file.is-ready .cf-panel.is-current .cf-dot { left: var(--x); }
.case-file.is-ready .cf-panel .cf-bar span { width: 0; transition: width 1.1s var(--ease) .2s; }
.case-file.is-ready .cf-panel.is-current .cf-bar span { width: var(--w); }
@media (prefers-reduced-motion: reduce) {
  .case-file.is-ready .cf-panel, .case-file.is-ready .cf-panel.is-current,
  .case-file.is-ready .cf-panel .cf-dot, .case-file.is-ready .cf-panel .cf-bar span { transition: none; }
  .case-file.is-ready .cf-panel.is-current { animation: none; }
}

@keyframes cf-in { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 960px) {
  /* stacked panels differ in height: each takes its own, so the dot chart never stretches */
  .case-file.is-ready .cf-panel { grid-area: auto; }
  .case-file.is-ready .cf-panel:not(.is-current) { display: none; }
  .case-file.is-ready .cf-panel.is-current { animation: cf-in .6s ease both; }
  .cf-dots, .cf-dot-row { flex: 0 0 auto; }
  .cf-panel { grid-template-columns: 1fr; }
  .cf-map-grid { grid-template-columns: 1fr; }
  .cf-node--hub::after { display: none; }
  .cf-lenders { margin: 0; padding: 16px 0 0 18px; border-left: 1px solid rgba(212, 175, 55, 0.6); }
  .cf-lender::before { left: -18px; width: 12px; }
}
@media (max-width: 640px) {
  .cf-dots { --lab: 4.3rem; --val: 7.6rem; }
  .cf-scale span:nth-child(even) { display: none; }
  .cf-val { padding-left: 10px; font-size: 0.74rem; }
  .cf-lender { grid-template-columns: 6.2rem minmax(0, 1fr) 4.2rem; }
  .cf-tab { flex: 1 1 100%; }
}

/* audience heroes: the stock banner image is gone, so the hero fills its full-screen wrapper */
.daa-hero-wrap > .daa-hero { flex: 1 0 auto; }
/* audience heroes: content centred in the first screen now that the banner is gone (V83) */
.daa-hero-wrap > .daa-hero { display: flex; flex-direction: column; justify-content: center; padding-top: calc(73px + clamp(24px, 5vh, 64px)); padding-bottom: clamp(32px, 6vh, 72px); }
.daa-hero-wrap > .daa-hero > .container { width: 100%; box-sizing: border-box; }
/* short screens and phones: the hero wrapper is not pinned there, so it keeps at least one screen of height */
@media (max-width: 768px), (max-height: 760px) { .daa-hero-wrap { min-height: 100vh; min-height: 100svh; } }

/* =====================================================================
   V83: audience pages, engagement rows and short laptop windows
   ===================================================================== */
/* 'Use it to': what the client does with the deliverable, set one step darker than the blocks around it */
.offer-use .offer-text { font-size: 0.98rem; font-weight: 500; line-height: 1.55; color: #1A1B28; }

/* the three matrices on short laptop windows (1280×650, 1366×657): all seven rows still on one screen */
@media (min-width: 961px) and (max-height: 700px) {
  .daa-section.diligence-matrix { padding: 16px 0; }
  .daa-section.diligence-matrix .daa-sec-title { margin-bottom: 6px; }
  .daa-section.diligence-matrix .daa-macro { margin-bottom: 10px; line-height: 1.4; }
  .daa-section.diligence-matrix .matrix-header { grid-template-columns: 3.4fr 8.6fr; padding-bottom: 4px; }
  .daa-section.diligence-matrix .matrix-row { grid-template-columns: 3.4fr 8.6fr; padding: 4px 0; }
  .daa-section.diligence-matrix .matrix-left { line-height: 1.3; }
  .daa-section.diligence-matrix .matrix-right { line-height: 1.36; }
  .daa-section.diligence-matrix .matrix-closing { padding-top: 8px; }
}

/* =====================================================================
   V84: engagement cards name what the client receives
   ===================================================================== */
/* 'The report covers': each item opens with its section name */
.offer-covers strong { font-weight: 600; color: #1A1B28; }
/* the cross-link in a card's note line reads as a link */
.offer-credit a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* =====================================================================
   V86: issuers page, the deUSD reserve split in the case file
   ===================================================================== */
.cf-reserve-body { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; gap: clamp(12px, 2vh, 22px); padding-top: clamp(6px, 1.6vh, 22px); }
.cf-stack { position: relative; height: clamp(28px, 4.6vh, 44px); background: rgba(255, 255, 255, 0.10); }
.cf-stack-a { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); background: var(--c-gold); }
.cf-stack-key { display: grid; gap: 6px; }
.cf-stack-key p { margin: 0; font-family: var(--f-sans); font-size: 0.95rem; color: rgba(255, 255, 255, 0.85); }
.cf-key { display: inline-block; width: 10px; height: 10px; margin-right: 10px; vertical-align: 1px; }
.cf-key--a { background: var(--c-gold); }
.cf-key--b { background: rgba(255, 255, 255, 0.25); }
.cf-stack-fact { margin: 0; font-family: var(--f-mono); font-size: 0.82rem; color: var(--c-gold); }
.cf-stack-fact strong { font-weight: 500; }
.case-file.is-ready .cf-panel .cf-stack-a { width: 0; transition: width 1.1s var(--ease) .2s; }
.case-file.is-ready .cf-panel.is-current .cf-stack-a { width: var(--w); }
@media (prefers-reduced-motion: reduce) { .case-file.is-ready .cf-panel .cf-stack-a { transition: none; } }
@media (max-width: 960px) { .cf-reserve-body { flex: 0 0 auto; } }

/* =====================================================================
   V90: workshops page. Plain hero, topic list, format cards, light past sessions
   ===================================================================== */
.page-hero.page-hero--plain { background: #1A1B28; }
.ws-topics { background: #FAFAFA; color: #1A1B28; padding: clamp(64px, 10vh, 128px) 0; }
.ws-formats { background: #2E3047; color: #FFFFFF; padding: clamp(64px, 10vh, 128px) 0; }
.ws-topics .container, .ws-formats .container { max-width: none; }   /* same left edge as the hero and past sessions */
.ws-eyebrow { margin: 0 0 14px; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: #7A5C12; }
.ws-formats .ws-eyebrow { color: var(--c-gold); }
.ws-title { margin: 0 0 12px; font-family: var(--f-serif); font-weight: 400; font-size: clamp(2rem, 3.4vw, 3.25rem); line-height: 1.1; letter-spacing: -0.01em; color: inherit; }
.ws-lede { margin: 0; max-width: 60rem; font-family: var(--f-sans); font-size: clamp(1rem, 1.3vw, 1.2rem); line-height: 1.5; color: #2E3047; }
.ws-topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 72px); margin-top: clamp(32px, 5vh, 56px); }
.ws-topic-head { margin: 0 0 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(46, 48, 71, 0.25); font-family: var(--f-mono); font-size: 0.75rem; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase; color: #7A5C12; }
.ws-topic-list { list-style: none; margin: 0; padding: 0; }
.ws-topic-list li { padding: 10px 0; border-bottom: 1px solid rgba(46, 48, 71, 0.12); font-family: var(--f-sans); font-size: 0.98rem; line-height: 1.45; color: #1A1B28; }
.ws-format-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); margin-top: clamp(28px, 4vh, 48px); }
.ws-format { display: flex; flex-direction: column; padding: clamp(24px, 2.6vw, 40px); background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(212, 175, 55, 0.3); }
.ws-format-title { margin: 0 0 20px; font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.4rem, 2vw, 1.8rem); line-height: 1.15; color: var(--c-gold); }
.ws-format-facts { margin: 0; display: grid; gap: 14px; align-content: start; flex: 1 1 auto; }
.ws-format-facts div { display: grid; gap: 4px; }
.ws-format-facts dt { font-family: var(--f-mono); font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.ws-format-facts dd { margin: 0; font-family: var(--f-sans); font-size: 0.98rem; line-height: 1.5; color: rgba(255, 255, 255, 0.9); }
.ws-format-mech { margin: 24px 0 0; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.14); font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.75); }
.ws-format-link { margin-top: 16px; font-family: var(--f-mono); font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; }
.ws-format-link:hover { text-decoration: underline; text-underline-offset: 3px; }
/* past sessions on a light surface: gold turns to the darker gold ink, the logo stays dark */
#engagements.eng-light.ws-past { background: #F3EEE6; }
#engagements.eng-light.ws-past .eng-date, #engagements.eng-light.ws-past .eng-title--date { color: #7A5C12; }
#engagements.eng-light.ws-past .eng-logo { filter: grayscale(1); opacity: 0.85; }
#engagements.eng-light.ws-past .eng-actions a, #engagements.eng-light.ws-past .clamp-toggle { color: #1A1B28; }
@media (max-width: 960px) {
  .ws-topic-grid, .ws-format-grid { grid-template-columns: 1fr; }
}

/* Workshops formats: the labels (For, Material, Leaves with, Not included) line up across the three cards,
   the duration line and the link sit at the bottom. CSS subgrid; browsers without it keep the flex cards. */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 901px) {
    .ws-format-grid { grid-template-rows: auto auto auto auto auto 1fr auto; }
    .ws-format { display: grid; grid-template-rows: subgrid; grid-row: span 7; row-gap: 0; }
    .ws-format-facts { display: contents; }
    .ws-format-title { grid-row: 1; }
    .ws-format-facts > div { margin-top: 14px; align-content: start; }
    .ws-format-facts > div:nth-child(1) { grid-row: 2; }
    .ws-format-facts > div:nth-child(2) { grid-row: 3; }
    .ws-format-facts > div:nth-child(3) { grid-row: 4; }
    .ws-format-facts > div:nth-child(4) { grid-row: 5; }
    .ws-format-mech { grid-row: 6; align-self: end; }
    .ws-format-link { grid-row: 7; }
  }
}

/* =====================================================================
   V91: institutions named in text, not shown as logos
   ===================================================================== */
.cred-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); margin-top: clamp(40px, 6vh, 80px); }
.cred-head { margin: 0 0 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.18); font-family: var(--f-mono); font-size: 0.75rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-gold); }
.cred-list { list-style: none; margin: 0; padding: 0; }
.cred-list li { padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.10); font-family: var(--f-sans); font-size: 1rem; line-height: 1.5; color: rgba(255, 255, 255, 0.88); }
.cred-list a { color: inherit; text-decoration: underline; text-decoration-color: rgba(212, 175, 55, 0.6); text-underline-offset: 3px; }
.cred-list a:hover { text-decoration-color: var(--c-gold); }
/* research: working-paper rows without the logo column */
#pipeline .eng-row { grid-template-columns: 140px minmax(0, 1fr); }
/* home: collaborators named in text on the working-paper cards */
.pl-collab-names { margin: 0; font-family: var(--f-sans); font-size: 0.9rem; line-height: 1.4; color: #2E3047; }
/* home: the same record on the light 'Research record & partners' section */
#pedigree .cred-head { color: #7A5C12; border-bottom-color: rgba(20, 22, 26, 0.18); }
#pedigree .cred-list li { color: #1A1B28; border-bottom-color: rgba(20, 22, 26, 0.10); }
#pedigree .cred-list a { text-decoration-color: rgba(122, 92, 18, 0.6); }
#pedigree .cred-grid { margin-top: clamp(24px, 4vh, 48px); margin-bottom: clamp(24px, 4vh, 48px); }
/* workshops: past session row without the logo column */
#engagements.eng-compact .eng-row--wide.ws-nologo { grid-template-columns: 140px minmax(0, 1fr); }
@media (max-width: 960px) {
  .cred-grid { grid-template-columns: 1fr; }
  #pipeline .eng-row, #engagements.eng-compact .eng-row--wide.ws-nologo { grid-template-columns: 1fr; }
}

/* =====================================================================
   V92: research rows. "See more" on the abstract's second line; Publications
   ===================================================================== */
#publications { background: #F3EEE6; padding-top: clamp(64px, 9vh, 120px); padding-bottom: clamp(48px, 7vh, 96px); }
#publications .container { max-width: none; padding-left: var(--edge); padding-right: var(--edge); }
#publications .pedigree-head .section-title { color: #14161A; font-weight: 500; letter-spacing: -0.015em; }
#publications .pedigree-intro { color: #1A1C20; }
#publications .eng-rows { position: relative; margin-top: clamp(28px, 4vh, 48px); }
#publications .eng-row { position: relative; display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: clamp(20px, 3vw, 56px); align-items: start; }
#publications .eng-row::after,
#publications .eng-row:first-child::before { content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(20, 22, 26, 0.16); }   /* static dividers: the draw-in script only watches the Ongoing Research rows */
#publications .eng-row::after { bottom: 0; }
#publications .eng-row:first-child::before { top: 0; }
#publications .eng-meta { display: flex; flex-direction: column; gap: 8px; }
#publications .eng-date { font-family: var(--f-mono); font-size: clamp(1rem, 1.3vw, 1.2rem); letter-spacing: 0.04em; color: #7A5C12; }
#publications .eng-type { font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: #5A5E64; }
#publications .eng-title { margin: 0; font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; line-height: 1.2; color: #14161A; }
#publications .eng-title a { color: inherit; text-decoration: none; }
#publications .eng-title a:hover, #publications .eng-title a:focus-visible { text-decoration: underline; text-decoration-color: #7A5C12; text-underline-offset: 4px; }
#publications .eng-ext { font-size: 0.7em; color: #7A5C12; }
#publications .eng-venue { margin: 0; font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: #5A5E64; }
#publications .eng-role { font-family: var(--f-sans); font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.7; color: #1A1C20; }
#publications .clamp-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#publications .clamp-text.expanded { display: block; -webkit-line-clamp: unset; overflow: visible; }
#publications .clamp-toggle { flex: none; white-space: nowrap; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: #14161A; opacity: 0.6; transition: opacity .2s; }
#publications .clamp-toggle:hover, #publications .clamp-toggle:focus-visible { opacity: 1; }
/* both lists: tighter rows; the abstract shows two lines, with "See more" at the end of the second */
#pipeline .eng-row, #publications .eng-row { padding: clamp(18px, 2.6vh, 28px) 0; }
#pipeline .eng-content, #publications .eng-content { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: clamp(20px, 3vw, 48px); row-gap: 8px; align-items: end; min-width: 0; }
#pipeline .eng-content > *, #publications .eng-content > * { grid-column: 1 / -1; }
#pipeline .eng-content > .eng-role, #publications .eng-content > .eng-role { grid-column: 1; margin: 2px 0 0; }
#pipeline .eng-content > .eng-actions, #publications .eng-content > .eng-actions { grid-column: 2; display: flex; justify-content: flex-end; align-self: end; }
#pipeline .clamp-toggle, #publications .clamp-toggle { min-height: 0; line-height: 1.7; }
@media (max-width: 900px) {
  #publications .eng-row { grid-template-columns: 1fr; gap: 12px; }
}

/* =====================================================================
   V93: home, "Research record & partners" title at section-title size
   ===================================================================== */
.page-home #pedigree .pedigree-head .section-title { font-family: var(--f-serif); font-size: var(--fs-section-title); font-weight: 500; line-height: 1.1; letter-spacing: -0.02em; text-transform: none; color: #14161A; margin: 0 0 clamp(16px, 2.6vh, 28px); }

/* =====================================================================
   V94/V95: Publications intro below the title, Industry Partners label colour,
   one-line type labels
   ===================================================================== */
#publications .pedigree-intro { font-family: var(--f-serif); font-size: clamp(1.3rem, min(1.9vw, 3.4vh), 1.85rem); line-height: 1.3; color: #1A1B28; margin: 0; }
#publications .eng-type { white-space: nowrap; }
#publications .eng-row { grid-template-columns: 176px minmax(0, 1fr); }
@media (max-width: 900px) { #publications .eng-row { grid-template-columns: 1fr; } }

/* V95: Publications intro sits below the title, as on the home page; Industry Partners label in the Academic record colour */
#publications .pedigree-head { display: block; }
#publications .pedigree-head .section-title { font-family: var(--f-serif); font-size: var(--fs-section-title); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 clamp(10px, 1.8vh, 18px); }
#publications .pedigree-intro { text-align: left; max-width: 60ch; }
.page-home #pedigree .logo-strip-overline { color: #7A5C12; }

/* V97: Publications reveals three rows at a time (script.js); without script all rows show */
.pub-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: clamp(24px, 3.5vh, 40px); }
.pub-controls[hidden] { display: none; }
.pub-count { margin: 0; font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: #5A5E64; }
.pub-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.pub-btn { padding: 14px 28px; border: 1px solid #14161A; background: transparent; font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: #14161A; cursor: pointer; transition: background 0.25s var(--ease), color 0.25s var(--ease); }
.pub-btn:hover, .pub-btn:focus-visible { background: #14161A; color: #F3EEE6; }
.pub-btn[hidden] { display: none; }
#publications .eng-row[hidden] { display: none; }

/* V98: About, "What We Believe": three statements, one per row */
.conv { list-style: none; margin: clamp(24px, 4vh, 36px) 0 0; padding: 0; counter-reset: conv; }
.conv li { counter-increment: conv; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 8px clamp(32px, 5vw, 96px); align-items: baseline; padding: clamp(20px, 3.2vh, 32px) 0; border-top: 1px solid rgba(255, 255, 255, 0.14); }
.conv li:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.conv-lead { margin: 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.25; color: var(--c-ink); }
.conv-text { margin: 0; font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.65; color: var(--c-ink-2); max-width: 62ch; }
@media (max-width: 960px) { .conv li { grid-template-columns: 1fr; } }

/* =====================================================================
   V98: About page. Order: plain hero, founder (white), What We Believe
   (navy), How We Work with What We Are Not (beige), contact (dark)
   ===================================================================== */
.page-about #vision .wb-intro { margin-top: clamp(28px, 4vh, 48px); max-width: 64ch; }
.page-about #vision .wb-lead { margin: 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.25; color: var(--c-gold); }
.page-about #vision .wb-text { margin: 14px 0 0; font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.65; color: var(--c-ink-2); }
.page-about #vision .conv { margin-top: clamp(36px, 5.5vh, 64px); }


.page-about #euler-standard { background: #F3EEE6; border-top: 0; }
.page-about #euler-standard .section-title { color: #14161A; }
.page-about #euler-standard .es-title { color: #7A5C12; }
.page-about #euler-standard .es-text { color: #1A1C20; }
.page-about #euler-standard .es-grid .es-step::before { background: rgba(20, 22, 26, 0.16); }
.page-about #euler-standard .es-step:last-child { padding-bottom: clamp(28px, 4vh, 48px); }
.page-about #euler-standard .vm-not-title { color: #7A5C12; border-top-color: rgba(20, 22, 26, 0.16); margin-top: clamp(32px, 5vh, 56px); }
.page-about #euler-standard .vm-not li { color: #1A1C20; }
.page-about #euler-standard .vm-not strong { color: #14161A; }
.page-about #euler-standard .es-grid .es-step { align-content: start; }

/* =====================================================================
   V99: About page. Compact What We Believe and How We Work (thesis
   section spacing), opening statement on one line from 768px
   ===================================================================== */
.page-about #vision, .page-about #euler-standard { padding-top: clamp(28px, 5.5vh, 80px); padding-bottom: clamp(28px, 5.5vh, 80px); }
.page-about #vision .wb-intro { max-width: none; margin-top: clamp(12px, 1.8vh, 22px); }
.page-about #vision .wb-text { max-width: 64ch; margin-top: 8px; }
@media (min-width: 768px) { .page-about #vision .wb-lead { white-space: nowrap; } }
.page-about #vision .conv { margin-top: clamp(18px, 3vh, 36px); }
.page-about #vision .conv li { padding: clamp(10px, 1.7vh, 18px) 0; }
.page-about #euler-standard .es-steps { margin-top: clamp(14px, 2.4vh, 30px); }
.page-about #euler-standard .es-grid .es-step { padding: clamp(10px, 1.8vh, 20px) 0; gap: 6px; }
.page-about #euler-standard .es-grid .es-title { font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.25; }
.page-about #euler-standard .es-step:last-child { padding-bottom: clamp(10px, 1.8vh, 20px); }
.page-about #euler-standard .vm-not-title { margin-top: clamp(8px, 1.4vh, 16px); padding-top: clamp(12px, 2vh, 22px); }
.page-about #euler-standard .vm-not { margin-top: clamp(12px, 2vh, 20px); row-gap: 10px; }
.page-about #vision .wb-text { max-width: 96ch; }
.page-about #vision .conv li { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.page-about #vision .conv-text { max-width: none; }
.page-about #euler-standard .vm-not li { line-height: 1.5; text-wrap: pretty; }
@media (max-width: 960px) { .page-about #vision .conv li { grid-template-columns: 1fr; } }

/* V99 fit: the supplied spacing ran 5px (1440x790) and 11px (1024x768) past one screen; slightly tighter section padding */
.page-about #vision, .page-about #euler-standard { padding-top: clamp(28px, 4.5vh, 80px); padding-bottom: clamp(28px, 4.5vh, 80px); }

/* V100: About hero line wraps without a single word left alone on the last line */
.page-about .page-hero .page-sub { text-wrap: pretty; }

/* =====================================================================
   V102: home. Hero line under the heading set larger; case-file link
   under the thesis in dark gold; thesis line wraps evenly; services
   title at the same size as the other section titles
   ===================================================================== */
#hero .hero-what { font-size: clamp(1.25rem, min(1.9vw, 3.3vh), 1.7rem); line-height: 1.35; max-width: 34em; text-wrap: balance; }
.page-home .thesis-lead--v58 { text-wrap: pretty; }
.page-home .thesis-proof { margin: clamp(10px, 1.8vh, 18px) 0 0; }
.page-home .thesis-proof .arrow-link { color: #7A5C12; min-height: 0; padding: 6px 0; }
#services .sx-title { font-size: var(--fs-section-title); font-weight: 500; line-height: 1.1; letter-spacing: -0.02em; }

/* V103: home figures, four columns from 901px (two columns below, as before) */
@media (min-width: 901px) { .page-home .metric-grid--thesis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* V104: home figures, five columns from 901px; below 901px the fifth figure spans the full row, so no figure sits alone in half a row */
@media (min-width: 901px) { .page-home .metric-grid--thesis { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 900px) { .page-home .metric-grid--thesis .metric:nth-child(5) { grid-column: 1 / -1; border-left: 0; padding-left: 0; } }

/* =====================================================================
   V105: home thesis line on two set lines at desktop widths; MiCA article
   links in the offer lists, underlined like the credentials links
   ===================================================================== */
.page-home .thesis-lead--v58 { max-width: none; }
.sx-list a, .offer-card li a { color: inherit; text-decoration: underline; text-decoration-color: rgba(212, 175, 55, 0.6); text-underline-offset: 3px; }
.sx-list a:hover, .offer-card li a:hover { text-decoration-color: var(--c-gold); }
.offer-card li a { text-decoration-color: rgba(122, 92, 18, 0.6); }
.offer-card li a:hover { text-decoration-color: #7A5C12; }

/* =====================================================================
   V106: home hero without background image (plain, as the other pages);
   on phones, each route on fewer lines and a slightly smaller heading
   ===================================================================== */
#hero.hero { background-image: none; background-color: #1A1B28; }
@media (max-width: 640px) {
  #hero .hero-title { font-size: 2.5rem; }
  #hero .hero-what { font-size: 1.15rem; margin-bottom: 14px; }
  #hero .hero-routes a { display: block; position: relative; padding: 6px 22px 6px 0; }
  #hero .hr-who { display: inline; margin-right: 8px; }
  #hero .hr-what { display: inline; }
  #hero .hr-arrow { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
}

/* =====================================================================
   V107: audience pages. Hero facts line; every "Book a scoping call"
   button in the same typeface as the hero button; case-file and matrix
   titles at the same size as the other section titles
   ===================================================================== */
.hero-facts { margin: clamp(10px, 1.6vh, 16px) 0 0; font-family: var(--f-mono); font-size: 0.78rem; letter-spacing: 0.06em; color: rgba(255, 255, 255, 0.72); }
.offer-cta, .contact-btn { font-family: var(--f-sans); font-size: 0.92rem; font-weight: 500; letter-spacing: 0.01em; text-transform: none; }
.cf-title, .daa-section.diligence-matrix .daa-sec-title { font-size: var(--fs-section-title); font-weight: 500; line-height: 1.06; letter-spacing: -0.02em; }
.cf-title { max-width: none; }

/* =====================================================================
   V108: case-file link in the same style as the hero text link; label
   above the issuers questions table
   ===================================================================== */
.cf-cta { font-family: var(--f-sans); font-size: 0.95rem; letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: 4px; }
.cf-cta:hover { color: #FFFFFF; }
.daa-section.diligence-matrix .offers-eyebrow { margin-bottom: clamp(6px, 1.2vh, 14px); }

/* =====================================================================
   V112: arrow links (home cards, thesis, about) in the same style as the
   case-file and hero text links: body typeface, normal capitalisation
   ===================================================================== */
.arrow-link { font-family: var(--f-sans); font-size: 0.95rem; font-weight: 500; letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: 4px; }
.arrow-link--inline { font-size: 0.95rem; }
.page-home .thesis-proof .arrow-link { padding: 2px 0; font-size: 0.9rem; }

/* =====================================================================
   V113: workshops page on the site's standard page edge; section titles
   at the shared size; past-session title in the title typeface; text
   links in the same style as the other pages
   ===================================================================== */
.page-hero--plain .container, .ws-topics .container, .ws-formats .container, #engagements.ws-past .container { padding-left: var(--edge); padding-right: var(--edge); }
.ws-title { font-size: var(--fs-section-title); line-height: 1.06; }
#engagements.eng-light.ws-past .eng-title--date { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 500; letter-spacing: 0; line-height: 1.2; }
.ws-format-link, .ws-event-link { font-family: var(--f-sans); font-size: 0.95rem; font-weight: 500; letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: 4px; }
.ws-event-link { color: #7A5C12; }
@media (min-width: 901px) { .ws-format-mech { align-self: stretch; } }   /* the rule above each duration line sits at the same height in all three cards */
.ws-format-mech a, #engagements.ws-past .eng-venue a, .cv-val a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }   /* the ETH Zurich links read as links in the facts lines and the CV */


/* =====================================================================
   V119 — HOME: What We Deliver cards with one exhibit each
   (appended at the end of styles.css; overrides earlier rules)
   ===================================================================== */

/* Section height follows its content: no forced full-screen height, no vertical centring */
@media (min-width: 961px) {
  .page-home #services { min-height: 0; justify-content: flex-start; }
  /* every offer list starts at the top of its column, whichever group is open */
  .sx.is-ready .sx-group .sx-offers { grid-row: 1 / 6 !important; }
}

/* Card: text column + exhibit column */
.sx-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.sx-text { min-width: 0; display: flex; flex-direction: column; }
@media (min-width: 1200px) {
  .sx-body { grid-template-columns: minmax(0, 0.85fr) minmax(280px, 1.15fr); column-gap: clamp(20px, 2.2vw, 36px); align-items: start; }
}
.sx-panel .sx-actions { margin-top: 0; padding-top: 18px; }

/* Exhibit */
.sx-ex { margin: 0; min-width: 0; }
.sx-ex-svg { display: block; width: 100%; height: auto; overflow: visible; }
.sx-ex-cap { margin: 8px 0 0; font-family: var(--f-mono); font-size: 0.62rem; line-height: 1.5; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.55); }
.sx-ex-cap a { color: rgba(255, 255, 255, 0.72); text-decoration: underline; text-decoration-color: rgba(212, 175, 55, 0.55); text-underline-offset: 2px; }
.sx-ex-cap a:hover { color: #FFFFFF; text-decoration-color: var(--c-gold); }

/* Exhibit typography (SVG text) */
.sx-ex-svg text { font-family: var(--f-mono); }
.sx-ex-svg .ex-lbl   { font-size: 9.5px;  fill: rgba(255, 255, 255, 0.55); }
.sx-ex-svg .ex-lbl-s { font-size: 8.5px;  fill: rgba(255, 255, 255, 0.55); }
.sx-ex-svg .ex-leg   { font-size: 8px; letter-spacing: 0.08em; fill: rgba(255, 255, 255, 0.6); }
.sx-ex-svg .ex-axt   { font-family: var(--f-sans); font-size: 10.5px; fill: rgba(255, 255, 255, 0.7); }
.sx-ex-svg .ex-row   { font-family: var(--f-sans); font-size: 11.5px; fill: rgba(255, 255, 255, 0.88); }
.sx-ex-svg .ex-row-s { font-family: var(--f-sans); font-size: 10px; fill: rgba(255, 255, 255, 0.88); }
.sx-ex-svg .ex-val   { font-size: 10px; fill: #FFFFFF; }
.sx-ex-svg .ex-note  { font-size: 8.5px; letter-spacing: 0.06em; fill: var(--c-gold); }

/* Exhibit marks */
.sx-ex-svg .ex-axis  { stroke: rgba(255, 255, 255, 0.28); stroke-width: 1; }
.sx-ex-svg .ex-rule  { stroke: rgba(212, 175, 55, 0.4); stroke-width: 1; }
.sx-ex-svg .ex-text  { stroke: rgba(255, 255, 255, 0.22); stroke-width: 3; stroke-linecap: round; }
.sx-ex-svg .ex-ref   { stroke: rgba(255, 255, 255, 0.45); stroke-width: 1; stroke-dasharray: 3 3; }
.sx-ex-svg .ex-line  { fill: none; stroke: var(--c-gold); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.sx-ex-svg .ex-stem  { stroke: var(--c-gold); stroke-width: 2; stroke-linecap: round; }
.sx-ex-svg .ex-edge  { fill: none; stroke: rgba(212, 175, 55, 0.75); stroke-width: 1.4; }
.sx-ex-svg .ex-lead  { stroke: var(--c-gold); stroke-width: 1; }
.sx-ex-svg .ex-join  { stroke: rgba(255, 255, 255, 0.3); stroke-width: 1; stroke-dasharray: 2 2; }
.sx-ex-svg .ex-dot   { fill: var(--c-gold); }
.sx-ex-svg .ex-diamond { fill: var(--c-gold); }
.sx-ex-svg .ex-xmark { stroke: var(--c-gold); stroke-width: 2; stroke-linecap: round; }
.sx-ex-svg .ex-bar   { fill: var(--c-gold); }
.sx-ex-svg .ex-bar-out { fill: none; stroke: rgba(255, 255, 255, 0.45); stroke-width: 1; }
.sx-ex-svg .ex-bar-neg { fill: rgba(255, 255, 255, 0.38); }
.sx-ex-svg .ex-bar-breach { fill: none; stroke: var(--c-gold); stroke-width: 1.5; }
.sx-ex-svg .ex-cell  { fill: var(--c-gold); }
.sx-ex-svg .ex-cell-on  { fill: var(--c-gold); }
.sx-ex-svg .ex-cell-off { fill: none; stroke: rgba(255, 255, 255, 0.3); stroke-width: 1; }
.sx-ex-svg .ex-flag  { fill: none; stroke: #FFFFFF; stroke-width: 1.5; }
.sx-ex-svg .ex-box   { fill: rgba(255, 255, 255, 0.04); stroke: rgba(255, 255, 255, 0.35); stroke-width: 1; }
.sx-ex-svg .ex-box-main  { fill: rgba(212, 175, 55, 0.12); stroke: var(--c-gold); }
.sx-ex-svg .ex-box-alert { fill: none; stroke: var(--c-gold); stroke-dasharray: 3 2; }
.sx-ex-svg .ex-page  { fill: rgba(255, 255, 255, 0.04); stroke: rgba(255, 255, 255, 0.35); stroke-width: 1; }
.sx-ex-svg .ex-seg   { fill: rgba(212, 175, 55, 0.14); stroke: var(--c-gold); stroke-width: 1; }

/* One movement, when a card opens: lines draw in, marks fade in. Nothing loops. */
@media (prefers-reduced-motion: no-preference) {
  .sx-panel.is-current .ex-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: exDraw 1s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(0.25s + var(--d, 0s)); }
  .sx-panel.is-current .ex-fade { opacity: 0; animation: exFade .6s ease forwards; animation-delay: calc(0.2s + var(--d, 0s)); }
  .sx-panel.is-current .ex-grow-y { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); animation: exGrowY .7s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(0.25s + var(--d, 0s)); }
  .sx-panel.is-current .ex-pop { opacity: 0; animation: exFade .3s ease forwards; animation-delay: calc(0.25s + var(--d, 0s)); }
  .sx-panel.is-current .ex-mark { opacity: 0; animation: exFade .5s ease forwards; animation-delay: 1.15s; }
}
@keyframes exDraw  { to { stroke-dashoffset: 0; } }
@keyframes exFade  { to { opacity: 1; } }
@keyframes exGrowY { to { transform: scaleY(1); } }


/* =====================================================================
   V120 — HOME: the card exhibits wait until What We Deliver is on screen
   (script.js adds .sx-pending on load and swaps it for .sx-seen when the cards appear)
   ===================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .sx.sx-pending .sx-ex-svg { visibility: hidden; }
  .sx:not(.sx-seen) .sx-panel.is-current .ex-draw,
  .sx:not(.sx-seen) .sx-panel.is-current .ex-fade,
  .sx:not(.sx-seen) .sx-panel.is-current .ex-grow-y,
  .sx:not(.sx-seen) .sx-panel.is-current .ex-pop,
  .sx:not(.sx-seen) .sx-panel.is-current .ex-mark { animation: none; }
}


/* =====================================================================
   V121 — ISSUERS: offer rows in the hero, and one exhibit in each offer card
   ===================================================================== */
.daa-hero .iss-routes { list-style: none; margin: clamp(18px, 3vh, 32px) 0 0; padding: 0; max-width: 58em; }
.daa-hero .iss-routes a { display: grid; grid-template-columns: 17em minmax(0, 1fr) auto; align-items: baseline; column-gap: 18px; padding: 8px 0; color: var(--c-ink-2, rgba(255,255,255,0.82)); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.08); transition: border-color .3s var(--ease); }
.daa-hero .iss-routes li:first-child a { border-top: 1px solid rgba(255, 255, 255, 0.08); }
.daa-hero .iss-routes .hr-who { color: var(--c-gold); font-weight: 600; }
.daa-hero .iss-routes .hr-facts { display: block; margin: 3px 0 0; font-family: var(--f-mono); font-size: 0.74em; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.55); }
.daa-hero .iss-routes .hr-arrow { color: var(--c-gold); opacity: 0.55; transition: opacity .3s var(--ease), transform .3s var(--ease); }
.daa-hero .iss-routes a:hover, .daa-hero .iss-routes a:focus-visible { border-color: rgba(212, 175, 55, 0.45); }
.daa-hero .iss-routes a:hover .hr-what, .daa-hero .iss-routes a:focus-visible .hr-what { color: #FFFFFF; }
.daa-hero .iss-routes a:hover .hr-arrow, .daa-hero .iss-routes a:focus-visible .hr-arrow { opacity: 1; transform: translateX(4px); }
@media (max-width: 1100px) {
  .daa-hero .iss-routes a { grid-template-columns: minmax(0, 1fr) auto; }
  .daa-hero .iss-routes .hr-who { grid-column: 1; grid-row: 1; }
  .daa-hero .iss-routes .hr-what { grid-column: 1; grid-row: 2; }
  .daa-hero .iss-routes .hr-arrow { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}

.daa-hero .hero-cta-row { margin-top: clamp(18px, 3vh, 32px); }

/* Exhibits on the white offer cards: dark gold on white */
.offer-card .sx-ex--light { max-width: 380px; margin: 4px 0 6px; }
.sx-ex--light .sx-ex-cap { color: #5A5E64; }
.sx-ex--light .sx-ex-svg .ex-lbl, .sx-ex--light .sx-ex-svg .ex-lbl-s { fill: #5A5E64; }
.sx-ex--light .sx-ex-svg .ex-leg  { fill: #4A4E66; }
.sx-ex--light .sx-ex-svg .ex-axt, .sx-ex--light .sx-ex-svg .ex-row, .sx-ex--light .sx-ex-svg .ex-row-s { fill: #1A1B28; }
.sx-ex--light .sx-ex-svg .ex-val  { fill: #1A1B28; }
.sx-ex--light .sx-ex-svg .ex-note { fill: #7A5C12; }
.sx-ex--light .sx-ex-svg .ex-axis { stroke: rgba(26, 27, 40, 0.3); }
.sx-ex--light .sx-ex-svg .ex-ref  { stroke: rgba(26, 27, 40, 0.45); }
.sx-ex--light .sx-ex-svg .ex-line, .sx-ex--light .sx-ex-svg .ex-lead { stroke: #A8841C; }
.sx-ex--light .sx-ex-svg .ex-dot, .sx-ex--light .sx-ex-svg .ex-diamond, .sx-ex--light .sx-ex-svg .ex-bar, .sx-ex--light .sx-ex-svg .ex-cell-on { fill: #C9A230; }
.sx-ex--light .sx-ex-svg .ex-bar-out { stroke: rgba(26, 27, 40, 0.45); }
.sx-ex--light .sx-ex-svg .ex-cell-off { stroke: rgba(26, 27, 40, 0.3); }

/* One movement, when the card comes into view: the same draw-in as the home cards */
@media (prefers-reduced-motion: no-preference) {
  .sx-ex--light.in .ex-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: exDraw 1s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(0.5s + var(--d, 0s)); }
  .sx-ex--light.in .ex-fade { opacity: 0; animation: exFade .6s ease forwards; animation-delay: calc(0.45s + var(--d, 0s)); }
  .sx-ex--light.in .ex-grow-y { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); animation: exGrowY .7s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(0.5s + var(--d, 0s)); }
  .sx-ex--light.in .ex-mark { opacity: 0; animation: exFade .5s ease forwards; animation-delay: 1.4s; }
}


/* =====================================================================
   V122 — ALLOCATORS: hatched region in the insolvency chart
   ===================================================================== */
.sx-ex-svg .ex-hatch { stroke: rgba(212, 175, 55, 0.22); stroke-width: 1; }
.sx-ex--light .sx-ex-svg .ex-hatch { stroke: rgba(168, 132, 28, 0.28); }


/* =====================================================================
   V123 — REGULATED FIRMS: light versions of the matrix and waterfall marks
   ===================================================================== */
.sx-ex--light .sx-ex-svg .ex-flag { stroke: #1A1B28; }
.sx-ex--light .sx-ex-svg .ex-cell { fill: #C9A230; }
.sx-ex--light .sx-ex-svg .ex-bar-neg { fill: rgba(26, 27, 40, 0.22); }
.sx-ex--light .sx-ex-svg .ex-bar-breach { fill: none; stroke: #A8841C; }
.sx-ex--light .sx-ex-svg .ex-join { stroke: rgba(26, 27, 40, 0.3); }


/* =====================================================================
   V124 — WORKSHOPS: format rows in the hero, and one exhibit in each format card
   ===================================================================== */
.page-hero .iss-routes { list-style: none; margin: clamp(18px, 3vh, 32px) 0 0; padding: 0; max-width: 58em; }
.page-hero .iss-routes a { display: grid; grid-template-columns: 17em minmax(0, 1fr) auto; align-items: baseline; column-gap: 18px; padding: 8px 0; color: rgba(255, 255, 255, 0.82); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.08); transition: border-color .3s var(--ease); }
.page-hero .iss-routes li:first-child a { border-top: 1px solid rgba(255, 255, 255, 0.08); }
.page-hero .iss-routes .hr-who { color: var(--c-gold); font-weight: 600; }
.page-hero .iss-routes .hr-facts { display: block; margin: 3px 0 0; font-family: var(--f-mono); font-size: 0.74em; letter-spacing: 0.04em; color: rgba(255, 255, 255, 0.55); }
.page-hero .iss-routes .hr-arrow { color: var(--c-gold); opacity: 0.55; transition: opacity .3s var(--ease), transform .3s var(--ease); }
.page-hero .iss-routes a:hover, .page-hero .iss-routes a:focus-visible { border-color: rgba(212, 175, 55, 0.45); }
.page-hero .iss-routes a:hover .hr-what, .page-hero .iss-routes a:focus-visible .hr-what { color: #FFFFFF; }
.page-hero .iss-routes a:hover .hr-arrow, .page-hero .iss-routes a:focus-visible .hr-arrow { opacity: 1; transform: translateX(4px); }
@media (max-width: 1100px) {
  .page-hero .iss-routes a { grid-template-columns: minmax(0, 1fr) auto; }
  .page-hero .iss-routes .hr-who { grid-column: 1; grid-row: 1; }
  .page-hero .iss-routes .hr-what { grid-column: 1; grid-row: 2; }
  .page-hero .iss-routes .hr-arrow { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}
.page-hero .iss-routes + .hero-actions { margin-top: clamp(18px, 3vh, 32px); }

/* Exhibits in the format cards: one row of their own, so the three line up */
.ws-format .sx-ex { margin: 22px 0 0; }
.ws-format-facts dd a { color: inherit; text-decoration: underline; text-decoration-color: rgba(212, 175, 55, 0.6); text-underline-offset: 3px; }
@supports (grid-template-rows: subgrid) {
  @media (min-width: 901px) {
    .ws-format-grid { grid-template-rows: auto auto auto auto auto auto 1fr auto; }
    .ws-format { grid-row: span 8; }
    .ws-format .sx-ex { grid-row: 6; align-self: start; }
    .ws-format-mech { grid-row: 7; }
    .ws-format-link { grid-row: 8; }
  }
}

/* One movement, when the card comes into view */
@media (prefers-reduced-motion: no-preference) {
  .sx-ex--scroll.in .ex-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: exDraw 1s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(0.5s + var(--d, 0s)); }
  .sx-ex--scroll.in .ex-fade { opacity: 0; animation: exFade .6s ease forwards; animation-delay: calc(0.45s + var(--d, 0s)); }
  .sx-ex--scroll.in .ex-mark { opacity: 0; animation: exFade .5s ease forwards; animation-delay: 1.4s; }
}

/* =====================================================================
   V126 — HOME: hero without the four rows; text link to What We Deliver
   ===================================================================== */
#hero .hero-actions { align-items: center; column-gap: 32px; row-gap: 16px; }
#hero .hero-deliver { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.4; color: #D4AF37; text-decoration: none; border-bottom: 1px solid rgba(212, 175, 55, 0.45); padding-bottom: 2px; transition: color 0.2s ease, border-color 0.2s ease; }
#hero .hero-deliver:hover, #hero .hero-deliver:focus-visible { color: #FFFFFF; border-color: rgba(255, 255, 255, 0.7); }
@media (prefers-reduced-motion: reduce) { #hero .hero-deliver { transition: none; } }

/* Four industry partner logos: two by two on phones, instead of three and one */
@media (max-width: 640px) {
  #pedigree #alliances .logo-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* =====================================================================
   V128 — HOME, What We Deliver
   Below 1200px: two one-line pickers (audiences, then offers) replace the
   menu and stay pinned under the header while the card scrolls.
   ===================================================================== */
.sx-strips { display: none; }
@media (max-width: 1199px) {
  .sx.is-ready .sx-side { display: contents; }   /* title and pickers sit directly in .sx, so the pickers stay pinned along the whole card */
  .sx.is-ready .sx-menu { display: none; }
  .sx.is-ready .sx-strips { display: block; position: sticky; top: var(--sx-stick, 73px); z-index: 5; margin-top: 10px; padding: 2px 0 6px; background: #2E3047; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
  .sx-strip { position: relative; display: flex; align-items: baseline; gap: 24px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scrollbar-width: none; white-space: nowrap;
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent 100%); mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent 100%); }
  .sx-strip::-webkit-scrollbar { display: none; }
  .sx-strip.is-scrolled { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%); }
  .sx-strip.is-end { -webkit-mask-image: none; mask-image: none; }
  .sx-strip.is-scrolled.is-end { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 36px); mask-image: linear-gradient(to right, transparent 0, #000 36px); }
  .sx-pick { -webkit-appearance: none; appearance: none; flex: 0 0 auto; margin: 0; padding: 10px 0; background: none; border: 0; border-radius: 0; cursor: pointer; font-family: var(--f-serif); font-size: 1.02rem; line-height: 1.2; color: rgba(255, 255, 255, 0.42); transition: color .3s ease; }
  .sx-pick[aria-current="true"] { font-size: 1.38rem; color: #FFFFFF; }
  .sx-strip--offers .sx-pick { padding: 6px 0 8px; font-family: var(--f-sans); font-size: 0.86rem; }
  .sx-strip--offers .sx-pick[aria-current="true"] { font-size: 1rem; color: #FFFFFF; }
  .sx-pick:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
  .sx-panels { margin-top: 12px; }
}
@media (max-width: 1199px) and (prefers-reduced-motion: reduce) { .sx-pick { transition: none; } }
/* Phones: a tighter card and a smaller chart */
@media (max-width: 640px) {
  .sx-panel { padding: 18px 20px; }
  .sx-body { gap: 12px; }
  .sx-panel .sx-ex { max-width: 300px; }
  .sx-panel .sx-actions { padding-top: 12px; }
}
/* Tablets and small laptops: text and chart side by side, as on desktop */
@media (min-width: 700px) and (max-width: 1199px) {
  .sx-body { grid-template-columns: minmax(0, 0.9fr) minmax(260px, 1.1fr); column-gap: 28px; align-items: start; }
}
/* Card actions: the main button and "Full details" on one line */
.sx-panel .sx-actions { flex-wrap: nowrap; gap: 0 24px; }
.sx-panel .sx-actions .sx-more { white-space: nowrap; margin-left: auto; }   /* right-aligned, level with the right edge of the chart */
@media (max-width: 640px) {
  .sx-panel .sx-actions { gap: 0 20px; }
  .sx-panel .sx-actions .btn { padding: 10px 18px; font-size: 0.9rem; }
}

/* Header below 1081px: a "Book a call" button beside the menu button; the other links stay in the menu */
@media (max-width: 1080px) {
  .site-nav { display: flex; margin-left: auto; margin-right: 14px; gap: 0; }
  .site-nav a:not(.nav-cta) { display: none; }
  .site-nav a.nav-cta { padding: 8px 12px; font-size: 0.82rem; }
}
@media (max-width: 400px) {
  .brand-logo { height: 36px; }
  .site-nav { margin-right: 10px; }
}
@media (max-width: 380px) {
  .sx-panel { padding: 14px 16px; }
  .sx-panel .sx-ex { max-width: 260px; }
}


/* =====================================================================
   V129 — HOME on phones: each section fits under the header on one screen
   ===================================================================== */
@media (max-width: 640px) {
  /* Hero: title and text centred in the screen, the two calls to action at the bottom */
  #hero.hero { min-height: 100svh; padding-top: 73px; padding-bottom: 28px; justify-content: stretch; }
  #hero .hero-inner { flex: 1 1 auto; display: flex; flex-direction: column; }
  #hero .hero-title { margin-top: auto; }
  #hero .hero-actions { margin-top: auto; padding-top: 24px; }

  /* Thesis: tighter spacing so the title, the text and the five figures fit under the header */
  .page-home #thesis { padding-top: 22px; padding-bottom: 22px; }
  .page-home #thesis .thesis-lead--v58 { margin-bottom: 10px; }
  .page-home #thesis .thesis-body { font-size: 0.98rem; line-height: 1.5; }
  .page-home #thesis .metric-grid--thesis { margin-top: 16px; }

  /* Thesis figures: PhD and 4+ on the first row, 10+, 50+ and 8+ on the second */
  .page-home #thesis .metric-grid--thesis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .page-home #thesis .metric-grid--thesis .metric { grid-column: span 2; border: 0; padding: 12px 8px 8px 0; }
  .page-home #thesis .metric-grid--thesis .metric-value { font-size: 1.9rem; }
  .page-home #thesis .metric-grid--thesis .metric-label { margin-top: 6px; font-size: 0.78rem; line-height: 1.4; }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(4) { order: 1; grid-column: span 3; }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(2) { order: 2; grid-column: span 3; border-left: 1px solid rgba(46, 48, 71, 0.10); padding-left: 12px; }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(1) { order: 3; border-top: 1px solid rgba(46, 48, 71, 0.10); }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(3),
  .page-home #thesis .metric-grid--thesis .metric:nth-child(5) { grid-column: span 2; border-top: 1px solid rgba(46, 48, 71, 0.10); border-left: 1px solid rgba(46, 48, 71, 0.10); padding-left: 10px; }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(3) { order: 4; }
  .page-home #thesis .metric-grid--thesis .metric:nth-child(5) { order: 5; }

  /* What We Deliver: title, pickers and card together under the header */
  .page-home #services.sx-section { padding-top: 18px; }
  #services .sx-title { margin-bottom: 4px; }
  .sx.is-ready .sx-strips { margin-top: 4px; padding: 0 0 4px; }
  .sx-pick { padding: 7px 0; }
  .sx-strip--offers .sx-pick { padding: 4px 0 6px; }
  .sx-panels { margin-top: 10px; }
  .sx-name { font-size: 1.3rem; }
  .sx-promise { font-size: 0.95rem; line-height: 1.4; margin-bottom: 6px; }
  .sx-panel .sx-ex { max-width: 250px; }
  .sx-ex-cap { margin-top: 4px; }
}
@media (max-width: 380px) {
  .page-home #thesis .thesis-lead--v58 { font-size: 1.75rem; }
  .page-home #thesis .thesis-body { font-size: 0.92rem; }
  .page-home #thesis .metric-grid--thesis .metric-value { font-size: 1.7rem; }
  .page-home #thesis .metric-grid--thesis .metric-label { font-size: 0.74rem; }
  .sx-promise { font-size: 0.9rem; }
}


/* =====================================================================
   V130 — HOME: the thesis and What We Deliver each fill the screen under
   the header; the figures sit at the bottom of the thesis. Gold buttons.
   ===================================================================== */
.page-home #thesis, .page-home #services.sx-section { box-sizing: border-box; min-height: calc(100vh - 73px); min-height: calc(100svh - 73px); display: flex; flex-direction: column; }
.page-home #thesis .thesis-wrap { flex: 1 1 auto; display: flex; flex-direction: column; }
.page-home #thesis .thesis-body { margin-bottom: clamp(20px, 4vh, 48px); }
.page-home #thesis .metric-grid--thesis { margin-top: auto; }   /* the space goes between the text and the figures */
.page-home #services.sx-section { justify-content: center; }
@media (max-width: 1199px) { .page-home #services.sx-section { justify-content: flex-start; } }

/* Main calls to action: gold, with a slight lift */
.btn-primary.contact-btn, .btn-primary.sx-btn, #hero .btn-primary {
  background: var(--cta-bg, #D4AF37); border-color: var(--cta-bg, #D4AF37); color: var(--cta-fg, #0B0C0E); font-weight: 600;
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.28); transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn-primary.contact-btn:hover, .btn-primary.sx-btn:hover, #hero .btn-primary:hover,
.btn-primary.contact-btn:focus-visible, .btn-primary.sx-btn:focus-visible, #hero .btn-primary:focus-visible {
  background: var(--cta-bg-h, #E2C25A); border-color: var(--cta-bg-h, #E2C25A); color: var(--cta-fg, #0B0C0E); transform: translateY(-2px); box-shadow: 0 10px 26px rgba(212, 175, 55, 0.38); }
@media (prefers-reduced-motion: reduce) { .btn-primary.contact-btn, .btn-primary.sx-btn, #hero .btn-primary { transition: none; } .btn-primary.contact-btn:hover, .btn-primary.sx-btn:hover, #hero .btn-primary:hover { transform: none; } }
@media (max-width: 1199px) { .page-home #services.sx-section { padding-bottom: 20px; } }
@media (max-width: 640px) {
  .page-home #thesis { padding-bottom: 10px; }
  .page-home #thesis .thesis-body { margin-bottom: 14px; }
}


/* =====================================================================
   V131 — Gold header button; a shorter thesis on desktop; phones: thesis
   title lower, every audience and offer visible, charts centred
   ===================================================================== */

/* Header "Book a call": the same solid gold as the hero button, on every page */
.site-nav a.nav-cta { background: #D4AF37; border-color: #D4AF37; color: #0B0C0E !important; font-weight: 600; box-shadow: 0 4px 14px rgba(212, 175, 55, 0.25); transition: background .25s ease, box-shadow .25s ease, transform .25s ease; }
.site-nav a.nav-cta:hover, .site-nav a.nav-cta:focus-visible, .site-nav a.nav-cta.is-active { background: #E2C25A; border-color: #E2C25A; color: #0B0C0E !important; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(212, 175, 55, 0.35); }
@media (prefers-reduced-motion: reduce) { .site-nav a.nav-cta { transition: none; } .site-nav a.nav-cta:hover { transform: none; } }

/* Thesis on laptops and desktops: a short section, about the height of Latest Research */
@media (min-width: 961px) {
  .page-home #thesis { min-height: 0; justify-content: flex-start; padding: clamp(4rem, 9vh, 8rem) 0; }   /* the same padding as Latest Research */
  .page-home #thesis .thesis-wrap { flex: 0 0 auto; }
  .page-home #thesis .metric-grid--thesis { margin-top: clamp(28px, 5vh, 56px); }
  .page-home #thesis .thesis-body { margin-bottom: 0; }
}

@media (max-width: 640px) {
  /* Thesis: twice the space above the title, so the title and text sit lower */
  .page-home #thesis { padding-top: 44px; padding-bottom: 14px; }
  .page-home #thesis .thesis-lead--v58 { font-size: 1.8rem; }
  .page-home #thesis .thesis-body { font-size: 0.93rem; line-height: 1.45; }
  .page-home #thesis .metric-grid--thesis .metric { padding-top: 10px; padding-bottom: 6px; }

  /* What We Deliver: every audience and every offer visible, names wrapping onto two lines */
  .page-home #services .sx.is-ready { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between; }
  .sx-strip { overflow: visible; white-space: normal; -webkit-mask-image: none !important; mask-image: none !important; }
  .sx-strip--groups { justify-content: space-between; align-items: center; gap: 6px; }
  .sx-strip--groups .sx-pick { width: min-content; text-align: center; font-size: 0.95rem; line-height: 1.15; padding: 6px 0; }
  .sx-strip--groups .sx-pick[aria-current="true"] { font-size: 1.15rem; }
  .sx-strip--offers { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
  .sx-strip--offers .sx-pick { text-align: left; font-size: 0.82rem; line-height: 1.3; padding: 4px 0 6px; }
  .sx-strip--offers .sx-pick[aria-current="true"] { font-size: 0.9rem; }
  /* A more compact card, with its chart centred */
  .sx-panel { padding: 14px 18px; }
  .sx-name { margin-bottom: 6px; }
  .sx-promise { font-size: 0.88rem; line-height: 1.4; }
  .sx-body { gap: 8px; }
  .sx-panel .sx-ex { max-width: 215px; margin-left: auto; margin-right: auto; }
  .sx-panel .sx-actions { padding-top: 10px; }
}
@media (max-width: 380px) {
  .page-home #thesis .thesis-lead--v58 { font-size: 1.6rem; }
  .page-home #thesis .thesis-body { font-size: 0.88rem; }
  .sx-strip--groups .sx-pick { font-size: 0.9rem; }
  .sx-strip--groups .sx-pick[aria-current="true"] { font-size: 1.05rem; }
  .sx-strip--offers { gap: 10px; }
  .sx-strip--offers .sx-pick { font-size: 0.78rem; }
  .sx-strip--offers .sx-pick[aria-current="true"] { font-size: 0.84rem; }
  .sx-panel { padding: 12px 16px; }
  .sx-panel .sx-ex { max-width: 180px; }
  .sx-promise { font-size: 0.85rem; }
  .page-home #thesis { padding-bottom: 10px; }
  .page-home #services.sx-section { padding-bottom: 12px; }
}


/* =====================================================================
   V132 — HOME on phones: sections as tall as their content (no stretched
   gaps on tall phones); audiences as tabs, offers as outlined boxes;
   larger chart on tall phones
   ===================================================================== */
@media (max-width: 640px) {
  /* Thesis and What We Deliver take the height of their content, never more than the screen */
  .page-home #thesis, .page-home #services.sx-section { min-height: 0; }
  .page-home #thesis .metric-grid--thesis { margin-top: 8px; }
  .page-home #services .sx.is-ready { flex: 0 0 auto; display: block; }
  .page-home #services.sx-section { padding-bottom: 24px; }

  /* Audiences: a tab bar, the selected audience underlined in gold */
  .sx.is-ready .sx-strips { margin-top: 12px; padding: 0 0 8px; border-bottom: 0; }
  .sx-strip--groups { align-items: stretch; border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
  .sx-strip--groups .sx-pick { display: flex; align-items: center; justify-content: center; padding: 6px 0 8px; margin-bottom: -1px; border-bottom: 2px solid transparent; }   /* one-word and two-word names centred on the same middle line */
  .sx-strip--groups .sx-pick[aria-current="true"] { border-bottom-color: var(--c-gold); }

  /* Offers of the selected audience: outlined boxes under the tab bar, the selected one in gold */
  .sx-strip--offers { margin-top: 10px; gap: 8px; align-items: stretch; }
  .sx-strip--offers .sx-pick, .sx-strip--offers .sx-pick[aria-current="true"] { font-size: 0.8rem; line-height: 1.3; padding: 7px 9px; }
  .sx-strip--offers .sx-pick { border: 1px solid rgba(255, 255, 255, 0.22); color: rgba(255, 255, 255, 0.62); }
  .sx-strip--offers .sx-pick[aria-current="true"] { border-color: var(--c-gold); background: rgba(212, 175, 55, 0.12); color: #FFFFFF; }
  .sx-panels { margin-top: 12px; }
}
@media (max-width: 380px) {
  .sx-strip--offers { gap: 6px; }
  .sx-strip--offers .sx-pick, .sx-strip--offers .sx-pick[aria-current="true"] { font-size: 0.74rem; padding: 5px 7px; }
  .sx.is-ready .sx-strips { margin-top: 8px; }
  .sx-panels { margin-top: 10px; }
}
@media (max-width: 380px) and (max-height: 650px) {
  .sx-panel .sx-ex { max-width: 165px; }
}
@media (max-width: 380px) and (min-height: 651px) {
  .sx-panel .sx-ex { max-width: 215px; }
}
/* Tall phones (iPhone 16 and similar): use the height for a larger chart and text */
@media (max-width: 640px) and (min-height: 740px) {
  .sx-panel { padding: 18px 20px; }
  .sx-promise { font-size: 0.95rem; }
  .sx-panel .sx-ex { max-width: 290px; }
  .page-home #thesis .thesis-body { font-size: 0.98rem; }
}


/* =====================================================================
   V133 — Teaching & Partners: one column of teaching, two items side by
   side on wide screens. Tablets: thesis and What We Deliver as tall as
   their content, as on phones.
   ===================================================================== */
#pedigree .cred-grid--single { grid-template-columns: 1fr; }
@media (min-width: 768px) {
  #pedigree .cred-grid--single .cred-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(28px, 4vw, 72px); }
}
@media (min-width: 641px) and (max-width: 960px) {
  .page-home #thesis, .page-home #services.sx-section { min-height: 0; }
  .page-home #thesis .metric-grid--thesis { margin-top: clamp(24px, 4vh, 40px); }
  .page-home #thesis .thesis-body { margin-bottom: 0; }
}


/* =====================================================================
   V134 — ISSUERS: hero without the product rows; gold buttons; cards with
   one chart position and a "What's included" fold on phones
   ===================================================================== */

/* Hero: gold button and a text link to the engagements, as on the home page */
.daa-hero .hero-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: clamp(24px, 4vh, 40px); }
.daa-hero .hero-deliver { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.4; color: #D4AF37; text-decoration: none; border-bottom: 1px solid rgba(212, 175, 55, 0.45); padding-bottom: 2px; transition: color .2s ease, border-color .2s ease; }
.daa-hero .hero-deliver:hover, .daa-hero .hero-deliver:focus-visible { color: #FFFFFF; border-color: rgba(255, 255, 255, 0.7); }
@media (max-width: 640px) {
  .daa-hero-wrap > .daa-hero { justify-content: flex-start; min-height: 100vh; min-height: 100svh; padding-top: 73px; padding-bottom: 28px; }
  .daa-hero-wrap > .daa-hero > .container { flex: 1 1 auto; display: flex; flex-direction: column; }
  .daa-hero .daa-eyebrow { margin-top: auto; }   /* title and text centred in the screen */
  .daa-hero .hero-cta-row { margin-top: auto; padding-top: 24px; }   /* the calls to action at the bottom */
}

/* Gold calls to action: hero, cards, case file and contact, as on the home page */
.daa-hero .btn-primary, .offer-cta, .cf-cta, .btn-primary.contact-btn {
  display: inline-flex; align-items: center; justify-content: center; background: #D4AF37; border: 1px solid #D4AF37; color: #0B0C0E !important; font-weight: 600; text-decoration: none;
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.28); transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.offer-cta, .cf-cta { padding: 12px 24px; }
.daa-hero .btn-primary:hover, .offer-cta:hover, .cf-cta:hover, .btn-primary.contact-btn:hover,
.daa-hero .btn-primary:focus-visible, .offer-cta:focus-visible, .cf-cta:focus-visible, .btn-primary.contact-btn:focus-visible {
  background: #E2C25A; border-color: #E2C25A; color: #0B0C0E !important; transform: translateY(-2px); box-shadow: 0 10px 26px rgba(212, 175, 55, 0.38); }
@media (prefers-reduced-motion: reduce) { .daa-hero .btn-primary, .offer-cta, .cf-cta, .btn-primary.contact-btn { transition: none; transform: none !important; } }

/* Engagements: the scope line under the section title */
.offers-sub { margin: 10px 0 0; font-family: var(--f-sans); font-size: clamp(1rem, 1.2vw, 1.12rem); line-height: 1.5; color: #4A4E66; }

/* Cards: the chart sits in the left column, above the button, on every card */
.offer-left .sx-ex--light { margin: 18px 0 18px; }

/* "What's included": open on screens 768px and wider (title hidden), one tappable line on phones */
.offer-more > summary { list-style: none; }
.offer-more > summary::-webkit-details-marker { display: none; }
@media (min-width: 768px) { .offer-more > summary { display: none; } }
@media (max-width: 767px) {
  .offer-more > summary { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; border-top: 1px solid rgba(20, 22, 26, 0.12); cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: #7A5C12; }
  .offer-more > summary::after { content: "+"; font-family: var(--f-sans); font-size: 1.2rem; letter-spacing: 0; line-height: 1; }
  .offer-more[open] > summary::after { content: "\2212"; }
  .offer-more > summary:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
}


/* =====================================================================
   V135 — ISSUERS: the quant's questions as a short section, the size of
   the home page thesis; on phones each answer opens with a tap
   ===================================================================== */
.daa-section.diligence-matrix { min-height: 0; display: block; padding: clamp(4rem, 9vh, 8rem) 0; }   /* the same padding as the home thesis */
.daa-section.diligence-matrix .daa-sec-title { margin-bottom: clamp(20px, 3.5vh, 40px); }
.daa-section.diligence-matrix .matrix-row { padding: clamp(12px, 2.2vh, 22px) 0; }
@media (max-width: 640px) {
  .daa-section.diligence-matrix { padding: 44px 0 20px; }
  .daa-section.diligence-matrix .daa-sec-title { margin-bottom: 12px; }
}
@media (max-width: 767px) {
  .daa-section.diligence-matrix .js-fold .matrix-row { padding: 0; }
  .daa-section.diligence-matrix .js-fold .matrix-left { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 0; cursor: pointer; }
  .daa-section.diligence-matrix .js-fold .matrix-left::after { content: "+"; flex: 0 0 auto; font-family: var(--f-sans); font-style: normal; font-size: 1.2rem; line-height: 1.1; color: #7A5C12; }
  .daa-section.diligence-matrix .js-fold .matrix-row.is-open .matrix-left::after { content: "\2212"; }
  .daa-section.diligence-matrix .js-fold .matrix-left:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
  .daa-section.diligence-matrix .js-fold .matrix-right { display: none; padding: 0 0 14px; }
  .daa-section.diligence-matrix .js-fold .matrix-row.is-open .matrix-right { display: block; }
}


/* =====================================================================
   V138 — WORKSHOPS: hero without the format rows; gold buttons; topics
   fold behind "+" on phones
   ===================================================================== */

/* Hero: gold button and a text link to the formats */
.page-hero--plain .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.page-hero--plain .btn-primary, .ws-format-link {
  display: inline-flex; align-items: center; justify-content: center; background: #D4AF37; border: 1px solid #D4AF37; color: #0B0C0E !important; font-weight: 600; text-decoration: none !important;
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.28); transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.ws-format-link { justify-self: start; align-self: start; padding: 12px 24px; font-family: var(--f-sans); font-size: 0.92rem; letter-spacing: 0.01em; text-transform: none; }
.page-hero--plain .btn-primary:hover, .ws-format-link:hover, .page-hero--plain .btn-primary:focus-visible, .ws-format-link:focus-visible {
  background: #E2C25A; border-color: #E2C25A; color: #0B0C0E !important; transform: translateY(-2px); box-shadow: 0 10px 26px rgba(212, 175, 55, 0.38); text-decoration: none; }
@media (prefers-reduced-motion: reduce) { .page-hero--plain .btn-primary, .ws-format-link { transition: none; transform: none !important; } }
.page-hero--plain .hero-deliver { font-family: var(--f-sans); font-size: 0.95rem; line-height: 1.4; color: #D4AF37; text-decoration: none; border-bottom: 1px solid rgba(212, 175, 55, 0.45); padding-bottom: 2px; transition: color .2s ease, border-color .2s ease; }
.page-hero--plain .hero-deliver:hover, .page-hero--plain .hero-deliver:focus-visible { color: #FFFFFF; border-color: rgba(255, 255, 255, 0.7); }

/* Phones: the hero fills one screen, title and text centred, calls to action at the bottom */
@media (max-width: 640px) {
  .page-hero--plain { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; box-sizing: border-box; padding-top: 73px; padding-bottom: 28px; }
  .page-hero--plain > .container { flex: 1 1 auto; display: flex; flex-direction: column; }
  .page-hero--plain .hero-top { flex: 1 1 auto; display: flex; flex-direction: column; }
  .page-hero--plain .hero-top > h1 { margin-top: auto; }
  .page-hero--plain .hero-actions { margin-top: auto; padding-top: 24px; }
}

/* Topics: the three column titles stay as headings on wide screens; on phones each opens with "+" */
.ws-fold > summary { list-style: none; }
.ws-fold > summary::-webkit-details-marker { display: none; }
@media (min-width: 768px) { .ws-fold > summary { pointer-events: none; cursor: default; } }
@media (max-width: 767px) {
  .ws-fold > summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer; padding: 14px 0; margin: 0; }
  .ws-fold > summary::after { content: "+"; font-family: var(--f-sans); font-size: 1.2rem; letter-spacing: 0; line-height: 1; color: #7A5C12; }
  .ws-fold[open] > summary::after { content: "\2212"; }
  .ws-fold > summary:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
}


/* =====================================================================
   V139 — ISSUERS: the quant's questions read as question and answer on
   every screen; "Why us" block on the cards
   ===================================================================== */
@media (max-width: 960px) {
  #diligence-matrix .matrix-header { display: block; padding-bottom: 8px; }
  #diligence-matrix .matrix-head-cell:nth-child(2) { display: none; }
  #diligence-matrix .matrix-right::before { content: "Our report answers"; display: block; margin: 0 0 6px; font-family: var(--f-mono); font-size: 0.68rem; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase; color: #7A5C12; }
}
.offer-why { margin-top: 4px; }

/* =====================================================================
   V140 — SERVICE CARDS: right column carries "You receive", the scope fold,
   the chart and "Book a call"; the scope fold is closed at every width
   ===================================================================== */
.offer-more > summary,
.offer-more summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 14px 0; border-top: 1px solid rgba(20, 22, 26, 0.12); border-bottom: 1px solid rgba(20, 22, 26, 0.12); cursor: pointer; font-family: var(--f-mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: #7A5C12; text-decoration: none; }
.offer-more > summary::after { content: "+"; font-family: var(--f-sans); font-size: 1.2rem; letter-spacing: 0; line-height: 1; }
.offer-more[open] > summary::after { content: "\2212"; }
.offer-more[open] > summary { border-bottom: 0; }
.offer-more > summary:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
.offer-more > .offer-block { margin-top: 4px; }
.offer-more[open] { padding-bottom: 14px; border-bottom: 1px solid rgba(20, 22, 26, 0.12); }
.offer-right .sx-ex--light { margin: 8px 0 4px; }
.offers-rows .offer-right .offer-cta { align-self: flex-start; }
@media (min-width: 1100px) {
  .offers-rows .offer-right .offer-cta { margin-top: auto; }
}

/* =====================================================================
   V141 — SERVICE CARDS: on computers, the chart is centred in the right
   column and "Book a call" sits under its left edge, both at the bottom
   ===================================================================== */
@media (min-width: 1100px) {
  .offers-rows .offer-right .sx-ex--light { align-self: center; width: 100%; max-width: 380px; margin: auto 0 0; }
  .offers-rows .offer-right .offer-cta { margin-top: 0; align-self: flex-start; margin-left: max(0px, calc((100% - 380px) / 2)); }
}

/* =====================================================================
   V142 — SERVICE CARDS: on computers, "Book a call" and the chart share
   the last row of the right column: the button on the left, the chart
   centred in the space between the button and the card's right edge
   ===================================================================== */
@media (min-width: 1100px) {
  .offers-rows .offer-right { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto 1fr auto; column-gap: 32px; row-gap: 22px; align-content: stretch; }
  .offers-rows .offer-right > .offer-block,
  .offers-rows .offer-right > .offer-more { grid-column: 1 / -1; }
  .offers-rows .offer-right > .sx-ex--light { grid-column: 2; grid-row: 4; justify-self: center; align-self: center; width: 100%; max-width: 380px; margin: 0; }
  .offers-rows .offer-right > .offer-cta { grid-column: 1; grid-row: 4; align-self: center; justify-self: start; margin: 0; }
}

/* =====================================================================
   V157 — SERVICE CARDS on computers: the intro line above the scope fold
   spans the column (it pushed the chart out of its cell); the chart row
   is centred in the space under the fold; "Book a call" is level with
   the bottom of the chart
   ===================================================================== */
@media (min-width: 1100px) {
  .offers-rows .offer-right { grid-template-rows: auto auto 1fr auto 1fr; }
  .offers-rows .offer-right > .offer-text { grid-column: 1 / -1; margin: 0; }
  .offers-rows .offer-right > .sx-ex--light { grid-row: 4; align-self: end; }
  .offers-rows .offer-right > .offer-cta { grid-row: 4; align-self: end; }
}

/* V158 — WORKSHOPS: the labels For, The material and The outcome in gold */
.ws-format-facts dt { color: #D4AF37; }
.ws-format-facts > div:nth-child(4) dt { color: rgba(255, 255, 255, 0.6); }

/* =====================================================================
   V159 — HOME hero: the title and the subtext use the same sizes as the
   hero of the service pages (title: page-title size; subtext: 1.1 to 1.3rem)
   ===================================================================== */
#hero .hero-title { font-size: var(--fs-page-title); line-height: 1.08; }
#hero .hero-what { font-size: clamp(1.1rem, 1.5vw, 1.3rem); line-height: 1.6; }

/* =====================================================================
   V164 — HOME hero subtext: three lines on computers and tablets
   (the break after "boards and" only applies from 1024px wide)
   ===================================================================== */
#hero .hero-what .br-wide { display: none; }
@media (min-width: 1024px) {
  #hero .hero-what { max-width: none; text-wrap: initial; }
  #hero .hero-what .br-wide { display: inline; }
}

/* =====================================================================
   V171 — SERVICE CARDS on computers: the chart is centred under the scope
   fold, "Book a call" sits at the bottom left of the right column; on
   phones "Why us" opens with a "+"; heroes of Research and Who we are
   centred on phones; home "Teaching and partners" sized like the thesis
   ===================================================================== */
@media (min-width: 1100px) {
  .offers-rows .offer-right { display: flex; flex-direction: column; gap: 22px; }
  .offers-rows .offer-right > .sx-ex--light { grid-row: auto; grid-column: auto; align-self: center; justify-self: auto; width: 100%; max-width: 380px; margin: 8px 0 0; }
  .offers-rows .offer-right > .offer-cta { grid-row: auto; grid-column: auto; align-self: flex-start; justify-self: auto; margin: auto 0 0; }
}

/* Phones: "Why us" folds behind a "+", like the scope fold */
@media (max-width: 767px) {
  .offer-why.js-why > .offer-label { display: flex; align-items: center; justify-content: space-between; min-height: 44px; margin: 0; padding: 14px 0; border-top: 1px solid rgba(20, 22, 26, 0.12); border-bottom: 1px solid rgba(20, 22, 26, 0.12); cursor: pointer; }
  .offer-why.js-why > .offer-label::after { content: "+"; font-family: var(--f-sans); font-size: 1.2rem; letter-spacing: 0; line-height: 1; color: #7A5C12; }
  .offer-why.js-why.is-open > .offer-label::after { content: "\2212"; }
  .offer-why.js-why > .offer-label:focus-visible { outline: 1px solid var(--c-gold); outline-offset: 3px; }
  .offer-why.js-why:not(.is-open) > .offer-list { display: none; }
  .offer-why.js-why.is-open > .offer-list { margin-top: 12px; }
}

/* Phones: Research and Who we are heroes, title and text centred in the screen, button at the bottom */
@media (max-width: 640px) {
  .page-hero--plain > .container > h1:first-child { margin-top: auto; }
}

/* Home: "Teaching and partners" takes the thesis section's height rules (no full-screen minimum) */
.page-home #pedigree { min-height: 0; justify-content: flex-start; }
@media (min-width: 768px) {
  .page-home #pedigree { padding-top: clamp(4rem, 9vh, 8rem); padding-bottom: clamp(4rem, 9vh, 8rem); }
}