/* ========================================================================
   PNAQL · Shared Stylesheet v2 — Architectural / Quiet Luxury system
   Cinematic hero · whitespace-led · generous type · haze accents
   Palette: Black Grape · Off-White · Purple Haze (RLG022 v4)
   ======================================================================== */

/* --- BRAND FONTS ------------------------------------------------------- */
@font-face{
  font-family:"PP Valve";
  src:url("assets/fonts/PPValve-PlainMedium.woff2") format("woff2"),
      url("assets/fonts/PPValve-PlainMedium.woff") format("woff");
  font-weight:400 500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"DM Mono";
  src:url("assets/fonts/DMMono-Light.ttf") format("truetype");
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"DM Mono";
  src:url("assets/fonts/DMMono-Medium.ttf") format("truetype");
  font-weight:500;font-style:normal;font-display:swap;
}

/* --- TOKENS ------------------------------------------------------------ */
:root{
  --bg:#0A0014;
  --fg:#FFFFF0;
  --haze:#805DE8;
  --haze-soft:#b8a5ff;

  --sub:rgba(255,255,240,.80);
  --body:rgba(255,255,240,.60);
  --mute:rgba(255,255,240,.38);
  --rule:rgba(255,255,240,.08);
  --rule-haze:rgba(128,93,232,.35);

  --display:"PP Valve","Inter","Helvetica Neue",system-ui,sans-serif;
  --text:"Merriweather","Georgia",serif;
  /* legacy aliases — body/meta default to reading face */
  --sans:var(--text);
  --mono:var(--text);

  --s1:8px; --s2:16px; --s3:24px; --s4:32px;
  --s5:48px; --s6:64px; --s7:96px; --s8:128px; --s9:160px;

  --max:1440px;
  --pad-d:72px;
  --pad-m:24px;

  --t-meta:10px;
  --t-eyebrow:11px;
  --t-body:15px;
  --t-lead:18px;
  --t-h4:clamp(22px,1.8vw,26px);
  --t-h3:clamp(22px,1.8vw,26px);
  --t-h2:clamp(32px,3.4vw,48px);
  --t-h1:clamp(44px,5vw,72px);
}

/* --- RESET ------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--bg);
  color:var(--fg);
  font-family:var(--sans);
  font-size:var(--t-body);
  line-height:1.55;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
html{overflow-x:hidden}
img{display:block;max-width:100%}

/* Display face — PP Valve — for headings only */
h1,h2,h3,h4,h5,
.hero h1,.sec-heading,
.thesis-col h3,.hiw-row h4,.cinema h3,
.struct-row h3,.who-tile .tile-copy h4,
.schematic-row h5,.inv h5,
.service-inner .line p,
.page-cta h2,
.nav .logo,.mob-nav a{
  font-family:var(--display);
}
a{color:inherit;text-decoration:none}
button{font:inherit;background:none;border:none;color:inherit;cursor:pointer}
ul{list-style:none}

/* --- NAV --------------------------------------------------------------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:60;
  height:72px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--pad-d);
  background:rgba(10,0,20,.55);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.14em;text-transform:uppercase;
}
.nav-brand{display:flex;align-items:center;gap:22px}
.nav .logo{display:inline-flex;align-items:center;height:28px}
.nav .logo img{display:block;height:22px;width:auto;opacity:.96}
.mob-nav .logo img{height:20px;width:auto}
.nav .tag{color:var(--body)}
.nav ul{display:flex;gap:36px}
.nav ul a{color:var(--body);transition:color .2s}
.nav ul a:hover{color:var(--fg)}
.nav ul a.on{color:var(--haze)}
.nav .cta{color:var(--fg);display:flex;align-items:center;gap:10px}
.nav .cta .arr{color:var(--haze);transition:transform .2s}
.nav .cta:hover .arr{transform:translateX(3px)}

.mob-toggle{display:none;flex-direction:column;gap:5px;padding:14px;z-index:60;min-width:48px;min-height:48px;align-items:center;justify-content:center}
.mob-toggle span{display:block;width:24px;height:1.5px;background:var(--fg);transition:transform .25s,opacity .2s}

.mob-nav{
  display:none;position:fixed;top:60px;left:0;right:0;bottom:0;z-index:55;
  background:var(--bg);
  flex-direction:column;justify-content:center;align-items:center;gap:var(--s1);
  padding:var(--s5) var(--s4);
}
.mob-nav.open{display:flex}
.mob-nav a{
  width:100%;max-width:380px;text-align:center;
  padding:var(--s3) 0;
  font-family:var(--sans);font-weight:400;font-size:26px;letter-spacing:-.02em;
  color:var(--body);border-bottom:1px solid var(--rule);
  transition:color .2s;
}
.mob-nav a.on{color:var(--haze)}
.mob-nav a:hover{color:var(--fg)}
.mob-nav a:last-child{border-bottom:none}

/* ========================================================================
   HERO — composed layers over treated photography
   ======================================================================== */
.hero{
  position:relative;
  min-height:880px;height:auto;
  overflow:hidden;
  border-bottom:1px solid var(--rule);
}
.hero .bg{position:absolute;inset:0;z-index:0}
.hero .bg img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(.92) contrast(1.1) brightness(.36) saturate(.45);
}
/* Dark base to seat type + top fade for nav legibility */
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(10,0,20,.78) 0%,rgba(10,0,20,.55) 30%,rgba(10,0,20,.75) 70%,rgba(10,0,20,.95) 100%);
}
/* Single haze atmosphere — top-right only */
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 85% 18%,rgba(128,93,232,.32),transparent 62%);
}

.hero-inner{
  position:relative;z-index:2;
  min-height:880px;
  max-width:var(--max);margin:0 auto;
  padding:var(--s7) var(--pad-d) var(--s6);
  display:flex;flex-direction:column;justify-content:space-between;gap:var(--s5);
}
.hero-top{
  display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s5);
  font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.hero-top b{color:var(--haze);font-weight:500}
.hero-top .sec{color:var(--fg);font-weight:500}

.hero-body{max-width:900px}
.hero .eyebrow{
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.22em;text-transform:uppercase;color:var(--haze);
  margin-bottom:var(--s4);
}
.hero h1{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h1);
  line-height:1.0;letter-spacing:-.03em;max-width:15ch;
}
.hero h1 em{font-style:normal;color:var(--haze);font-weight:500}
.hero .lead{
  margin-top:var(--s4);max-width:54ch;
  font-size:var(--t-lead);line-height:1.45;color:var(--sub);font-weight:300;
}

.hero-foot{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:var(--s5);margin-top:var(--s4);
}
.actions{display:flex;gap:var(--s2);flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:12px;
  padding:18px 28px;border-radius:999px;
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--rule);color:var(--fg);
  transition:background .25s,border-color .25s,transform .25s;
}
.btn .arr{transition:transform .2s;display:inline-block}
.btn:hover{border-color:var(--haze)}
.btn:hover .arr{transform:translateX(3px)}
.btn.primary{background:var(--fg);color:#0A0014;border-color:var(--fg)}
.btn.primary:hover{background:var(--haze);border-color:var(--haze);color:var(--fg)}

.hero-caption{
  font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
  text-align:right;line-height:1.8;max-width:280px;
}
.hero-caption b{color:var(--fg);font-weight:500;display:block}

/* Hero composed layout: body type left + instrument panel right */
.hero-stack{
  display:grid;grid-template-columns:1.4fr 1fr;gap:var(--s6);
  align-items:start;
}
/* When hero-stack has only hero-body (panel removed), go full width */
.hero-stack:has(> .hero-body:only-child){
  grid-template-columns:1fr;
}
/* Hero pillars line — quieter uppercase letterspaced */
.hero .pillars{
  margin-top:var(--s3);
  font-family:var(--text);
  font-size:var(--t-meta);
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--mute);
  font-weight:400;
}
.hero-panel{
  border:1px solid rgba(255,255,240,.14);
  background:rgba(10,0,20,.72);
  backdrop-filter:blur(12px) saturate(1.1);-webkit-backdrop-filter:blur(12px) saturate(1.1);
  position:relative;
}
.hero-panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 100% 0%,rgba(128,93,232,.14),transparent 60%);
}
.hero-panel .phead{
  display:flex;justify-content:space-between;align-items:center;
  padding:var(--s3) var(--s4);border-bottom:1px solid var(--rule);
  font-family:var(--text);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--mute);
}
.hero-panel .phead b{color:var(--fg);font-weight:500}
.hero-panel .phead .ref{color:var(--haze);font-family:var(--display);letter-spacing:.18em}

.hero-panel .inst{
  display:grid;grid-template-columns:48px 1fr 24px;gap:var(--s3);
  padding:var(--s4);border-bottom:1px solid var(--rule);
  align-items:start;position:relative;
  transition:background .25s,padding .35s cubic-bezier(.22,.61,.36,1);
}
.hero-panel .inst:last-child{border-bottom:none}
.hero-panel .inst .ix{
  font-family:var(--text);font-size:var(--t-meta);letter-spacing:.22em;
  color:var(--haze);padding-top:4px;
}
.hero-panel .inst .ttl{
  font-family:var(--display);font-size:18px;letter-spacing:-.015em;
  color:var(--fg);line-height:1.15;margin-bottom:6px;
}
.hero-panel .inst .sub{
  font-family:var(--text);font-size:12px;line-height:1.55;color:var(--body);font-weight:300;
}
.hero-panel .inst .arr{
  font-family:var(--text);font-size:14px;color:var(--mute);
  align-self:center;text-align:right;
  transition:color .25s,transform .25s;
}
.hero-panel .inst:hover{background:rgba(128,93,232,.06)}
.hero-panel .inst:hover .arr{color:var(--haze);transform:translateX(3px)}
.hero-panel .inst.quiet{grid-template-columns:48px 1fr;cursor:default}
.hero-panel .inst.quiet:hover{background:transparent}

/* Hero ref block — replaces caption */
.hero-ref{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  margin-top:var(--s5);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.hero-ref div{
  padding:var(--s3) var(--s3);border-right:1px solid var(--rule);
  font-size:var(--t-meta);letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.hero-ref div:last-child{border-right:none}
.hero-ref b{color:var(--fg);font-weight:500;display:block;margin-bottom:4px}

/* ========================================================================
   MARQUEE TICKER — scrolling market strip
   ======================================================================== */
.marquee{
  position:relative;width:100%;overflow:hidden;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  background:rgba(10,0,20,.6);
  padding:var(--s2) 0;
}
.marquee-track{
  display:flex;gap:var(--s6);white-space:nowrap;
  animation:marq 60s linear infinite;
  will-change:transform;
}
.marquee span{
  font-family:var(--text);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--mute);display:inline-flex;align-items:center;gap:12px;
}
.marquee span b{color:var(--fg);font-weight:500}
.marquee span .up{color:var(--haze)}
.marquee span .dn{color:rgba(255,255,240,.4)}
.marquee .dot{width:4px;height:4px;border-radius:50%;background:var(--haze);opacity:.6}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
}

/* ========================================================================
   SECTION SPINE — fixed left gutter with scroll-synced marker
   ======================================================================== */
.spine{
  position:fixed;left:0;top:72px;bottom:0;width:32px;z-index:40;
  pointer-events:none;
  display:flex;flex-direction:column;align-items:center;
  padding:var(--s5) 0;
}
.spine::before{
  content:"";position:absolute;left:50%;top:var(--s5);bottom:var(--s5);
  width:1px;background:var(--rule);transform:translateX(-.5px);
}
.spine .items{
  position:relative;flex:1;
  display:flex;flex-direction:column;justify-content:space-around;align-items:center;
  pointer-events:auto;
}
.spine a{
  font-family:var(--text);font-size:9px;letter-spacing:.18em;
  color:var(--mute);position:relative;
  transition:color .3s;
  display:block;width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;
}
.spine a::before{
  content:"";position:absolute;width:7px;height:7px;border-radius:50%;
  background:var(--bg);border:1px solid var(--mute);
  transition:background .3s,border-color .3s,box-shadow .3s,width .3s,height .3s;
}
.spine a span{display:none}
.spine a.on::before{
  background:var(--haze);border-color:var(--haze);width:9px;height:9px;
  box-shadow:0 0 14px rgba(128,93,232,.8);
}
.spine a:hover::before{border-color:var(--fg)}

/* ========================================================================
   GENERIC SECTION
   ======================================================================== */
.section{
  padding:var(--s5) var(--pad-d);
  max-width:var(--max);margin:0 auto;
  position:relative;
}
.section.loud{padding:var(--s6) var(--pad-d)}
.section.tight{padding:var(--s4) var(--pad-d)}
.sec-heading{margin-bottom:var(--s4)}

.sec-eyebrow{
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.22em;text-transform:uppercase;color:var(--haze);
  margin-bottom:var(--s4);
  display:flex;align-items:center;gap:var(--s2);
}
.sec-eyebrow::after{content:"";flex:0 0 120px;height:1px;background:var(--rule-haze)}

.sec-heading{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h2);
  line-height:1.05;letter-spacing:-.025em;max-width:20ch;
  margin-bottom:var(--s4);
}
.sec-heading em{font-style:normal;color:var(--haze);font-weight:500}

.sec-lead{
  max-width:58ch;font-size:var(--t-lead);line-height:1.5;
  color:var(--sub);font-weight:300;margin-bottom:var(--s5);
}

/* ========================================================================
   THESIS (three pillars) — gallery layout, not grid cells
   ======================================================================== */
.thesis{position:relative}
.thesis::before{
  content:"";position:absolute;inset:auto -10% 20% auto;width:60%;height:60%;
  background:radial-gradient(ellipse at 80% 30%,rgba(128,93,232,.10),transparent 65%);
  pointer-events:none;z-index:0;
}
.thesis-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5) var(--s6);
  position:relative;z-index:1;align-items:start;
}
.thesis-col .num{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--haze);margin-bottom:var(--s4);
}
.thesis-col h3{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h3);
  line-height:1.02;letter-spacing:-.025em;margin-bottom:var(--s3);
}
.thesis-col h3 em{font-style:normal;color:var(--haze);font-weight:500}
.thesis-col p{
  color:var(--sub);font-size:var(--t-body);line-height:1.6;
  max-width:38ch;font-weight:300;
}
/* .lead modifier retained but no longer overrides — unified type scale */

/* ========================================================================
   HOW IT WORKS — numbered editorial rows
   ======================================================================== */
.hiw-rows{display:flex;flex-direction:column;gap:0}
.hiw-row{
  display:grid;grid-template-columns:120px 1.2fr 2fr;gap:var(--s5);
  padding:var(--s4) 0;border-top:1px solid var(--rule);align-items:start;
}
.hiw-row:last-child{border-bottom:1px solid var(--rule)}
.hiw-row .num{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--haze);padding-top:8px;
}
.hiw-row h4{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h4);
  line-height:1.1;letter-spacing:-.02em;max-width:18ch;
}
.hiw-row p{color:var(--sub);font-size:var(--t-body);line-height:1.55;font-weight:300;max-width:50ch}
.hiw-row .artifact{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.18em;
  text-transform:uppercase;color:var(--mute);line-height:1.9;
  padding-top:8px;text-align:right;
}
.hiw-row .artifact b{color:var(--fg);font-weight:500;display:block}

/* ========================================================================
   CINEMATIC PLATE — full-bleed break between sections
   ======================================================================== */
.cinema{
  position:relative;
  height:min(56vh,560px);
  overflow:hidden;
  margin:var(--s5) 0;
}
.cinema img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:grayscale(.88) contrast(1.1) brightness(.44) saturate(.5);
}
.cinema::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(90deg,rgba(10,0,20,.85) 0%,rgba(10,0,20,.15) 55%,rgba(10,0,20,.35) 100%);
}
.cinema::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse 45% 55% at 78% 45%,rgba(128,93,232,.26),transparent 62%);
}
.cinema-inner{
  position:relative;z-index:2;height:100%;
  max-width:var(--max);margin:0 auto;padding:var(--s5) var(--pad-d);
  display:flex;flex-direction:column;justify-content:center;
}
.cinema .eyebrow{
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.22em;text-transform:uppercase;color:var(--haze);
  margin-bottom:var(--s3);
}
.cinema h3{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h2);
  line-height:1.02;letter-spacing:-.03em;max-width:16ch;
}
.cinema h3 em{font-style:normal;color:var(--haze);font-weight:500}
.cinema .caption{
  position:absolute;right:var(--pad-d);bottom:var(--s5);z-index:3;
  font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);text-align:right;
}
.cinema .caption b{color:var(--fg);font-weight:500;display:block}

/* ========================================================================
   STRUCTURES — three offers as editorial rows, not grid cells
   ======================================================================== */
.struct-list{display:flex;flex-direction:column;gap:0}
.struct-row{
  display:grid;grid-template-columns:200px 1fr;gap:var(--s5);
  padding:var(--s5) 0;border-top:1px solid var(--rule);position:relative;
}
.struct-row:last-child{border-bottom:1px solid var(--rule)}
.struct-row .badge{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.18em;
  text-transform:uppercase;color:var(--haze);line-height:1.5;
  display:flex;flex-direction:column;gap:var(--s3);
}
.struct-row .badge .thumb{
  position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;
  border:1px solid var(--rule);
}
.struct-row .badge .thumb img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(.92) contrast(1.1) brightness(.5) saturate(.55);
  transition:transform 1s cubic-bezier(.22,.61,.36,1),filter .6s;
}
.struct-row .badge .thumb::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 60% at 80% 25%,rgba(128,93,232,.22),transparent 65%);
}
.struct-row:hover .badge .thumb img{transform:scale(1.04);filter:grayscale(.78) contrast(1.15) brightness(.58) saturate(.7)}
.struct-row .badge .label{padding-top:0}
.struct-row h3{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h3);
  line-height:1.1;letter-spacing:-.02em;margin-bottom:var(--s2);max-width:18ch;
}
.struct-row p{
  color:var(--sub);font-size:var(--t-body);line-height:1.55;font-weight:300;
  max-width:60ch;margin-bottom:var(--s3);
}
.struct-row .tickers{display:flex;gap:var(--s1);flex-wrap:wrap;margin-top:var(--s2)}
.struct-row .tickers span{
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  color:var(--mute);padding:5px 10px;border:1px solid var(--rule);
}
.struct-row .datastrip{
  display:flex;gap:var(--s4);margin-top:var(--s3);padding-top:var(--s3);
  border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.18em;
  text-transform:uppercase;color:var(--mute);
}
.struct-row .datastrip div b{color:var(--fg);font-weight:500;display:block;margin-bottom:2px}

/* ========================================================================
   WHO IT'S FOR — editorial tile grid
   ======================================================================== */
.who-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);
  position:relative;
}
.who-grid::before{
  content:"";position:absolute;inset:-6% -15% -6% -15%;
  background:radial-gradient(ellipse at 60% 50%,rgba(128,93,232,.10),transparent 65%);
  pointer-events:none;z-index:0;
}
.who-tile{
  position:relative;aspect-ratio:3/2;overflow:hidden;
  border:1px solid var(--rule);background:#000;
  transition:transform .6s cubic-bezier(.22,.61,.36,1),border-color .4s;
  z-index:1;
}
.who-tile img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:grayscale(.88) contrast(1.1) brightness(.46) saturate(.55);
  transition:transform 1.2s cubic-bezier(.22,.61,.36,1),filter .6s;
}
.who-tile::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(10,0,20,.25) 0%,rgba(10,0,20,0) 30%,rgba(10,0,20,0) 45%,rgba(10,0,20,.92) 100%),
    radial-gradient(ellipse 60% 50% at 78% 22%,rgba(128,93,232,.22),transparent 65%);
}
.who-tile .tile-idx{
  position:absolute;top:var(--s4);left:var(--s4);z-index:2;
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--haze);
}
.who-tile .tile-idx .slash{color:var(--body);margin:0 10px}
.who-tile .tile-copy{
  position:absolute;left:var(--s4);right:var(--s4);bottom:var(--s4);z-index:2;
}
.who-tile .tile-copy h4{
  font-family:var(--sans);font-weight:400;
  font-size:clamp(22px,1.9vw,28px);line-height:1.1;letter-spacing:-.02em;
  color:var(--fg);margin-bottom:var(--s1);max-width:16ch;
}
.who-tile .tile-copy h4 em{font-style:normal;color:var(--haze);font-weight:400}
.who-tile .tile-copy p{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.18em;
  text-transform:uppercase;color:var(--body);line-height:1.6;
}
.who-tile:hover{border-color:var(--rule-haze)}
.who-tile:hover img{transform:scale(1.04);filter:grayscale(.7) contrast(1.15) brightness(.52) saturate(.7)}

/* ========================================================================
   CAPITAL FLOW — architectural schematic panel
   ======================================================================== */
.schematic{
  position:relative;border:1px solid var(--rule);
  background:#0A0014;
  margin-top:var(--s5);margin-bottom:var(--s6);
  overflow:hidden;
}
.schematic::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 50% at 85% 20%,rgba(128,93,232,.18),transparent 60%),
    radial-gradient(ellipse 50% 60% at 10% 95%,rgba(128,93,232,.10),transparent 60%);
}
.schematic-head{
  display:grid;grid-template-columns:80px 1fr 1fr 220px;
  gap:var(--s4);padding:var(--s3) var(--s5);
  border-bottom:1px solid var(--rule);position:relative;z-index:1;
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--body);
}
.schematic-head b{color:var(--haze);font-weight:500}
.schematic-body{position:relative;z-index:1;padding:var(--s4) 0}
.schematic-row{
  display:grid;grid-template-columns:80px 1fr 1fr 220px;
  gap:var(--s4);padding:var(--s4) var(--s5);
  align-items:center;position:relative;
  border-bottom:1px solid var(--rule);
}
.schematic-row:last-child{border-bottom:none}
.schematic-row .node{
  position:relative;font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;color:var(--haze);padding-left:32px;
}
.schematic-row .node::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:14px;height:14px;border-radius:50%;
  background:var(--bg);border:1px solid var(--haze);
  box-shadow:0 0 0 3px var(--bg),0 0 12px rgba(128,93,232,.4);
}
.schematic-row .node::after{
  content:"";position:absolute;left:6px;top:calc(50% + 7px);
  width:1px;height:calc(var(--s4) * 2 + 1px);
  background:repeating-linear-gradient(180deg,var(--rule-haze) 0 4px,transparent 4px 8px);
}
.schematic-row:last-child .node::after{display:none}
.schematic-row h5{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h4);
  letter-spacing:-.015em;line-height:1.1;color:var(--fg);
}
.schematic-row .desc{
  color:var(--body);font-size:15px;font-weight:300;line-height:1.5;max-width:32ch;
}
.schematic-row .ticker{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--body);padding:var(--s2) var(--s3);
  border:1px solid var(--rule);background:rgba(255,255,240,.02);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  position:relative;
}
.schematic-row .ticker b{color:var(--fg);font-weight:500}
.schematic-row .ticker .dot{
  width:6px;height:6px;border-radius:50%;background:var(--haze);
  box-shadow:0 0 8px rgba(128,93,232,.6);
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}

.investors{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  margin-top:var(--s5);border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.inv{padding:var(--s4);border-right:1px solid var(--rule)}
.inv:last-child{border-right:none}
.inv .ilabel{
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--haze);margin-bottom:var(--s2);
}
.inv h5{
  font-family:var(--sans);font-weight:400;font-size:22px;letter-spacing:-.015em;
  margin-bottom:var(--s1);color:var(--fg);
}
.inv p{color:var(--body);font-size:15px;font-weight:300;line-height:1.5}

/* ========================================================================
   SERVICE STATEMENT
   ======================================================================== */
.service{
  padding:var(--s6) var(--pad-d);
  position:relative;overflow:hidden;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.service::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 55% 60% at 80% 50%,rgba(128,93,232,.14),transparent 65%);
}
.service-inner{
  max-width:var(--max);margin:0 auto;position:relative;
  display:flex;flex-direction:column;
}
.service-inner .eyebrow{
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.22em;text-transform:uppercase;color:var(--haze);
  margin-bottom:var(--s4);
}
.service-inner .line{
  display:grid;grid-template-columns:48px 1fr;gap:var(--s3);
  padding:var(--s3) 0;border-top:1px solid var(--rule);align-items:baseline;
}
.service-inner .line:last-child{border-bottom:1px solid var(--rule)}
.service-inner .line .mark{
  font-family:var(--mono);font-size:var(--t-eyebrow);letter-spacing:.22em;
  color:var(--haze);
}
.service-inner .line p{
  font-family:var(--sans);font-weight:400;
  font-size:clamp(22px,2.2vw,32px);line-height:1.1;letter-spacing:-.02em;
  color:var(--fg);
}
.service em{font-style:normal;color:var(--haze);font-weight:500}

/* Reference strip — quiet institutional credibility row */
.refstrip{
  max-width:var(--max);margin:0 auto;
  padding:var(--s3) var(--pad-d);
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);
  font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.22em;
  text-transform:uppercase;color:var(--mute);
}
.refstrip b{color:var(--fg);font-weight:500;display:block;margin-bottom:4px}

/* ========================================================================
   PAGE CTA — closing
   ======================================================================== */
.page-cta{
  padding:var(--s6) var(--pad-d);
  max-width:var(--max);margin:0 auto;
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:1fr auto;gap:var(--s7);align-items:end;
}
.page-cta::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 90% 70% at 50% 110%,rgba(128,93,232,.22),transparent 65%);
}
.page-cta > *{position:relative}
.page-cta .eyebrow{
  font-family:var(--mono);font-size:var(--t-eyebrow);
  letter-spacing:.22em;text-transform:uppercase;color:var(--haze);
  margin-bottom:var(--s4);
}
.page-cta h2{
  font-family:var(--sans);font-weight:400;font-size:var(--t-h2);
  line-height:1.05;letter-spacing:-.025em;margin-bottom:var(--s3);
  max-width:16ch;
}
.page-cta h2 em{font-style:normal;color:var(--haze);font-weight:500}
.page-cta p{color:var(--sub);font-size:var(--t-lead);font-weight:300;max-width:40ch}
.page-cta .cta-aside{
  text-align:right;padding-bottom:var(--s3);
}
.page-cta .cta-aside .email{
  display:block;font-family:var(--sans);font-weight:400;
  font-size:clamp(18px,1.8vw,24px);letter-spacing:-.015em;color:var(--fg);
  margin-bottom:var(--s2);transition:color .2s;
}
.page-cta .cta-aside .email:hover{color:var(--haze)}
.page-cta .cta-aside .meta{
  font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.page-cta .actions{margin-top:var(--s5)}

/* ========================================================================
   FOOTER
   ======================================================================== */
.foot{
  border-top:1px solid var(--rule);
  padding:var(--s6) var(--pad-d);max-width:var(--max);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--s5);align-items:center;
  font-family:var(--mono);font-size:var(--t-meta);
  letter-spacing:.22em;text-transform:uppercase;color:var(--mute);
}
.foot .mid{display:flex;justify-content:center;gap:var(--s3)}
.foot .mid a{opacity:.45;transition:opacity .2s;padding:8px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
.foot .mid a:hover{opacity:1}
.foot .mid svg{width:20px;height:20px;fill:var(--fg);display:block}
.foot .end{display:flex;justify-content:flex-end;gap:var(--s4);flex-wrap:wrap}
.foot .end a:hover{color:var(--fg)}

/* ========================================================================
   MOTION — on-load hero stagger + scroll reveal
   ======================================================================== */
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes heroImg{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}

.hero .bg img{animation:heroImg 1.6s cubic-bezier(.22,.61,.36,1) both}
.hero-top{animation:rise .9s cubic-bezier(.22,.61,.36,1) .1s both}
.hero .eyebrow{animation:rise .9s cubic-bezier(.22,.61,.36,1) .35s both}
.hero h1{animation:rise 1s cubic-bezier(.22,.61,.36,1) .5s both}
.hero .lead{animation:rise 1s cubic-bezier(.22,.61,.36,1) .75s both}
.hero-foot{animation:rise 1s cubic-bezier(.22,.61,.36,1) 1s both}

/* Scroll reveal — elements with .reveal start hidden, .reveal.in animates */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.d1{transition-delay:.08s}
.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}

@media (prefers-reduced-motion:reduce){
  .hero .bg img,.hero-top,.hero .eyebrow,.hero h1,.hero .lead,.hero-foot{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
}

/* ========================================================================
   RESPONSIVE — 860 and 480
   ======================================================================== */
@media (max-width:860px){
  :root{--pad-d:var(--pad-m)}

  .nav{padding:0 var(--pad-m);height:60px}
  .nav ul,.nav .cta{display:none}
  .mob-toggle{display:flex}
  .nav .tag{display:none}

  /* HERO on mobile: composed layout collapses */
  .hero{min-height:0;height:auto}
  .hero-inner{padding:calc(60px + var(--s3)) var(--pad-m) var(--s4)}
  .hero-top{gap:var(--s3)}
  .hero-stack{gap:var(--s4)}
  .hero-body{max-width:none}
  .hero-foot{flex-direction:column;align-items:stretch;gap:var(--s3);margin-top:var(--s4)}
  .hero-caption{text-align:left;max-width:none;display:none}
  .actions{flex-direction:column;gap:var(--s2)}
  .btn{justify-content:space-between}
  .hero-panel{padding:var(--s3)}
  .hero-panel .phead{margin-bottom:var(--s2);padding-bottom:var(--s2)}
  .hero-panel .inst{padding:var(--s3) 0;grid-template-columns:32px 1fr !important;gap:var(--s2)}
  .hero-panel .inst .ix{font-size:11px}
  .hero-panel .inst .ttl{font-size:15px;line-height:1.25}
  .hero-panel .inst .sub{font-size:13px;line-height:1.45;margin-top:4px}

  .section{padding:var(--s5) var(--pad-m)}
  .section.compact,.section.tight{padding:var(--s4) var(--pad-m)}

  .thesis-grid{grid-template-columns:1fr;gap:var(--s6)}
  .thesis::before{display:none}

  .hiw-row{grid-template-columns:1fr;gap:var(--s3);padding:var(--s5) 0}
  .hiw-row .num{padding-top:0}

  .cinema{height:auto;min-height:0;aspect-ratio:4/5;margin:var(--s6) 0}
  .cinema-inner{padding:var(--s6) var(--pad-m);justify-content:flex-end}
  .cinema h3{font-size:clamp(28px,7vw,40px)}
  .cinema .caption{right:var(--pad-m);bottom:var(--s4)}

  .struct-row{grid-template-columns:1fr;gap:var(--s3);padding:var(--s5) 0}
  .struct-row .badge{padding-top:0}

  .who-grid{grid-template-columns:1fr;gap:var(--s3)}
  .who-tile{aspect-ratio:3/2}

  .hiw-row{grid-template-columns:1fr;gap:var(--s2);padding:var(--s4) 0}
  .hiw-row .artifact{text-align:left;padding-top:0}

  .struct-row .datastrip{flex-wrap:wrap;gap:var(--s2)}
  .refstrip{grid-template-columns:1fr 1fr;gap:var(--s3);padding:var(--s3) var(--pad-m)}
  .service-inner .line{grid-template-columns:40px 1fr;gap:var(--s2)}

  .schematic-head{display:none}
  .schematic-row{grid-template-columns:1fr;gap:var(--s2);padding:var(--s4) var(--pad-m)}
  .schematic-row .node::after{display:none}
  .schematic-row .ticker{justify-self:start}
  .investors{grid-template-columns:1fr;margin-top:var(--s5)}
  .inv{border-right:none;border-bottom:1px solid var(--rule)}
  .inv:last-child{border-bottom:none}

  .service{padding:var(--s5) var(--pad-m)}
  .page-cta{padding:var(--s5) var(--pad-m);grid-template-columns:1fr;gap:var(--s4)}
  .page-cta .cta-aside{text-align:left;padding-bottom:0}

  .foot{grid-template-columns:1fr;gap:var(--s4);padding:var(--s5) var(--pad-m);text-align:left}
  .foot .mid{justify-content:flex-start}
  .foot .end{justify-content:flex-start;display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}

  /* CTA button hierarchy on mobile */
  .actions .btn:not(.primary){background:transparent;border-color:var(--rule);padding:14px 24px;font-size:var(--t-meta)}
  .actions .btn.primary{padding:18px 28px}

  /* Contact form submit button full-width */
  .contact-form button.btn.primary{width:100%;display:flex;justify-content:space-between}
}

@media (max-width:480px){
  :root{
    --t-h1:clamp(34px,9vw,48px);
    --t-h2:clamp(28px,7vw,40px);
    --t-h3:clamp(22px,5.5vw,30px);
    --t-h4:20px;
    --t-lead:16px;
  }
  .hero .bg{aspect-ratio:3/4}
  .cinema{aspect-ratio:3/4}
  .hero-stack{grid-template-columns:1fr;gap:var(--s5)}
  .hero-ref{grid-template-columns:1fr 1fr}
  .hero-ref div:nth-child(2){border-right:none}
  .hero-ref div:nth-child(1),.hero-ref div:nth-child(2){border-bottom:1px solid var(--rule)}
  .spine{display:none}
}

/* ========================================================================
   TYPE FAMILY OVERRIDE — last in cascade so it always wins
   PP Valve = display headings only. Merriweather = everything else.
   ======================================================================== */
body,
p,.sec-lead,.hero .lead,
.sec-eyebrow,.hero .eyebrow,.cinema .eyebrow,.page-cta .eyebrow,
.hiw-row .num,.hiw-row .artifact,.hiw-row p,
.struct-row .badge,.struct-row p,.struct-row .tickers span,.struct-row .datastrip,
.who-tile .tile-idx,.who-tile .tile-copy p,
.schematic-head,.schematic-row .node,.schematic-row .desc,.schematic-row .ticker,
.inv .ilabel,.inv p,
.refstrip,
.service-inner .eyebrow,.service-inner .line .mark,
.page-cta p,.page-cta .cta-aside .email,.page-cta .cta-aside .meta,
.hero-top,.hero-caption,
.nav,.nav ul a,.nav .cta,
.foot,
.thesis-col .num,.thesis-col p,
.btn,.hero-foot .caption{
  font-family:var(--text) !important;
}
/* Heading highlight span — colour only, identical face, no italic risk. */
h1 .hl,h2 .hl,h3 .hl,h4 .hl,h5 .hl,
.sec-heading .hl,.thesis-col h3 .hl,.struct-row h3 .hl,
.cinema h3 .hl,.page-cta h2 .hl,.who-tile .tile-copy h4 .hl{
  font-family:inherit !important;
  font-style:normal !important;
  font-weight:inherit !important;
  font-synthesis:none !important;
  color:var(--haze) !important;
}
/* Heading <em> = colour only. Same family, never italic, never synthesised. */
.hero h1 em,
.sec-heading em,
.thesis-col h3 em,
.hiw-row h4 em,
.cinema h3 em,
.struct-row h3 em,
.who-tile .tile-copy h4 em,
.schematic-row h5 em,
.inv h5 em,
.service-inner .line p em,
.page-cta h2 em{
  font-family:var(--display) !important;
  font-style:normal !important;
  font-weight:inherit !important;
  font-synthesis:none !important;
  color:var(--haze) !important;
}
.hero h1,
.sec-heading,
.thesis-col h3,
.hiw-row h4,
.cinema h3,
.struct-row h3,
.who-tile .tile-copy h4,
.schematic-row h5,
.inv h5,
.service-inner .line p,
.page-cta h2,
.nav .logo,
.mob-nav a{
  font-family:var(--display) !important;
}

/* ---------- Additive: FAQ + Contact form (haze treatment) ---------- */
.faq-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--rule)}
.faq-item{border-bottom:1px solid var(--rule);padding:var(--s2) 0}
.faq-q{cursor:pointer;font-family:var(--display);font-size:1rem;color:var(--fg);list-style:none;padding:.4rem 0;display:flex;justify-content:space-between;align-items:center;gap:1rem;font-weight:500}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:"+";color:var(--haze);font-size:1.4rem;line-height:1;transition:transform .2s}
.faq-item[open] .faq-q::after{content:"−"}
.faq-a{padding:.6rem 0 .2rem;color:var(--body);font-family:var(--display);line-height:1.7;max-width:780px}
.faq-a a{color:var(--haze);text-decoration:underline;text-underline-offset:3px}

.contact-form{display:flex;flex-direction:column;gap:var(--s2);max-width:880px;margin-top:var(--s3)}
.contact-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
@media (max-width:760px){.contact-form .form-row{grid-template-columns:1fr}}
.contact-form .form-group{display:flex;flex-direction:column;gap:.4rem}
.contact-form label{font-family:var(--display);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--haze)}
.contact-form input,.contact-form select,.contact-form textarea{
  background:transparent;border:1px solid var(--rule);color:var(--fg);
  padding:.85rem 1rem;font-family:var(--display);font-size:.95rem;border-radius:0;outline:none;
}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--haze)}
.contact-form textarea{resize:vertical;min-height:140px}
.contact-form button{cursor:pointer}

/* Mobile section TOC — research page */
.mob-toc{display:none}
@media(max-width:860px){
  .mob-toc{
    display:flex;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;
    position:sticky;top:60px;z-index:50;
    background:rgba(10,0,20,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid var(--rule);
    padding:0 var(--pad-m);
    scrollbar-width:none;
  }
  .mob-toc::-webkit-scrollbar{display:none}
  .mob-toc a{
    flex:0 0 auto;padding:14px 16px;
    font-family:var(--text);font-size:var(--t-meta);
    letter-spacing:.18em;text-transform:uppercase;color:var(--mute);
    white-space:nowrap;border-bottom:2px solid transparent;
    transition:color .2s,border-color .2s;
  }
  .mob-toc a:hover,.mob-toc a:active{color:var(--fg);border-bottom-color:var(--haze)}
}

/* Subsidy vs CWF chart (policy.html) */
.svc-chart-wrap{border:1px solid rgba(255,255,240,.10);border-radius:10px;padding:20px;background:rgba(255,255,240,.01);max-width:640px;margin:36px 0 0}
.svc-chart-wrap svg#svc-chart{width:100%;display:block}
.svc-chart-wrap .chart-legend{display:flex;gap:24px;margin-top:12px;padding:0 4px;flex-wrap:wrap}
.svc-chart-wrap .chart-leg-item{display:flex;align-items:center;gap:8px}
.svc-chart-wrap .chart-caption{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;color:rgba(155,143,212,.6);margin-top:10px;line-height:1.6}

/* ============================================================
   REGISTERS — scoped visual tones (additive, non-destructive)
   .rh   = Rights Holders (artists.html) — unchanged, uses base
   .ed   = Editorial (research.html, about.html)
   .inst = Institutional (policy.html, contact.html)
   ============================================================ */

/* ---- Shared: kill hero background image ---- */
body.ed .hero .bg,
body.inst .hero .bg{display:none !important}
body.ed .hero,
body.inst .hero{background:var(--bg,#0a0014)}
body.ed .hero::after,
body.inst .hero::after{display:none}
body.ed .hero .bg img,
body.inst .hero .bg img{display:none !important}

/* =========================================
   EDITORIAL (.ed) — working-paper energy
   ========================================= */
body.ed .hero{min-height:0}
body.ed .hero-inner{max-width:960px;padding-top:calc(96px + var(--s4,32px))}
body.ed .hero h1{
  font-size:clamp(2.2rem,4.6vw,4.4rem);
  letter-spacing:-.02em;
  line-height:1.04;
  max-width:20ch;
}
body.ed .hero .lead{max-width:640px;line-height:1.65}
body.ed{line-height:1.65}
body.ed .hero::before{
  background:radial-gradient(ellipse 52% 40% at 18% 40%,rgba(128,93,232,.08) 0%,transparent 70%);
}
/* sparse hairlines between sections */
body.ed section + section,
body.ed .sec + .sec{border-top:1px solid rgba(255,255,240,.06)}
/* narrower measure on body copy */
body.ed p{max-width:66ch}
body.ed .hero .lead{max-width:640px}

/* =========================================
   INSTITUTIONAL (.inst) — architectural / restrained
   ========================================= */
body.inst .hero{min-height:0;position:relative;overflow:hidden}
body.inst .hero-inner{max-width:1040px;padding-top:calc(88px + var(--s4,32px))}
body.inst .hero h1{
  font-size:clamp(2.4rem,4.8vw,4.8rem);
  letter-spacing:-.02em;
  line-height:1.03;
  max-width:22ch;
}
body.inst .hero .lead{max-width:620px;line-height:1.6}
/* abstract architectural backdrop — faint grid */
body.inst .hero::before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(rgba(255,255,240,.035) 1px,transparent 1px) 0 0/72px 72px,
    linear-gradient(90deg,rgba(255,255,240,.035) 1px,transparent 1px) 0 0/72px 72px,
    radial-gradient(ellipse 60% 50% at 80% 20%,rgba(128,93,232,.06) 0%,transparent 70%);
  pointer-events:none;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.9),rgba(0,0,0,.25) 70%,transparent);
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.9),rgba(0,0,0,.25) 70%,transparent);
}
body.inst .hero-inner{position:relative;z-index:1}
/* tighter section padding than .ed */
body.inst section{padding-top:var(--s5,56px);padding-bottom:var(--s5,56px)}

/* =========================================
   Mobile — both registers stack cleanly
   ========================================= */
@media(max-width:860px){
  body.ed .hero-inner,
  body.inst .hero-inner{
    max-width:none;
    padding-top:calc(60px + var(--s4,32px));
  }
  body.ed .hero h1{font-size:clamp(2rem,7.5vw,2.8rem)}
  body.inst .hero h1{font-size:clamp(2.1rem,7.8vw,3rem)}
  body.ed .hero .lead,
  body.inst .hero .lead{max-width:none}
  body.inst .hero::before{background-size:48px 48px,48px 48px,auto}
}
@media(max-width:480px){
  body.ed .hero h1{font-size:clamp(1.85rem,8.5vw,2.4rem)}
  body.inst .hero h1{font-size:clamp(1.95rem,8.8vw,2.5rem)}
  body.inst .hero::before{background-size:36px 36px,36px 36px,auto}
}

/* =========================================
   APPENDED — page-scoped bespoke treatments
   Scoped to body classes / page ids so artists.html
   and other pages are unaffected.
   ========================================= */

/* ---------- INDEX (body.idx) ---------- */
/* optical italic nudge on hero lead */
body.idx .hero-body .lead{transform:translateX(-.12em)}

/* triage cards — real visual weight */
body.idx #sec-1 .thesis-grid{gap:16px;border:none;grid-template-columns:repeat(3,1fr)}
body.idx #sec-1 .thesis-col{
  position:relative;
  padding:36px 32px 40px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,0));
  transition:background .25s ease,border-color .25s ease,transform .25s ease;
  overflow:hidden;
}
body.idx #sec-1 .thesis-col::before{
  content:attr(data-n);
  position:absolute;top:24px;right:28px;
  font-family:var(--display,"Merriweather",serif);
  font-size:3.4rem;line-height:1;letter-spacing:-.03em;
  color:rgba(128,93,232,.18);font-weight:300;font-style:italic;
  pointer-events:none;transition:color .25s ease,transform .25s ease;
}
body.idx #sec-1 .thesis-col:hover{background:rgba(128,93,232,.05);border-color:rgba(128,93,232,.45);transform:translateY(-2px)}
body.idx #sec-1 .thesis-col:hover::before{color:rgba(128,93,232,.55)}
body.idx #sec-1 .thesis-col .num{
  font-family:var(--mono,"DM Mono",monospace);
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  opacity:.7;margin:0 0 20px;padding-right:80px;
}
body.idx #sec-1 .thesis-col p{font-size:1.02rem;line-height:1.6;margin:0 0 14px;max-width:34ch}
body.idx #sec-1 .thesis-col p a:hover{color:#fff}
body.idx #sec-1 .thesis-col.c-a{border-top:2px solid rgba(128,93,232,.4)}
body.idx #sec-1 .thesis-col.c-b{border-top:2px solid rgba(147,241,230,.35)}
body.idx #sec-1 .thesis-col.c-c{border-top:2px solid rgba(255,255,240,.35)}

/* Interchange diagram in page-cta */
body.idx .interchange{
  margin-top:48px;padding-top:36px;border-top:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:18px;max-width:920px;
}
body.idx .interchange .ix-lbl{
  font-family:var(--mono,"DM Mono",monospace);
  font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;
  opacity:.55;margin-bottom:2px;
}
body.idx .interchange svg{width:100%;height:auto;display:block;overflow:visible}
body.idx .interchange .ix-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:18px}
body.idx .interchange .ix-node{
  font-family:var(--display,"Merriweather",serif);
  font-size:.96rem;line-height:1.25;color:#fff;font-weight:500;
}
body.idx .interchange .ix-node em{font-style:italic;font-weight:300;color:#805DE8}
body.idx .interchange .ix-line{
  height:1px;background:linear-gradient(90deg,rgba(128,93,232,.1),rgba(128,93,232,.55),rgba(128,93,232,.1));
  min-width:40px;position:relative;
}
body.idx .interchange .ix-line::before,
body.idx .interchange .ix-line::after{
  content:"";position:absolute;top:50%;width:5px;height:5px;
  border-top:1px solid rgba(128,93,232,.7);border-right:1px solid rgba(128,93,232,.7);
  transform:translateY(-50%) rotate(45deg);
}
body.idx .interchange .ix-line::before{left:-1px;transform:translateY(-50%) rotate(-135deg)}
body.idx .interchange .ix-line::after{right:-1px}
body.idx .interchange .ix-cap{
  font-family:var(--mono,"DM Mono",monospace);font-size:.6rem;
  letter-spacing:.18em;text-transform:uppercase;opacity:.45;margin-top:4px;
}
@media(max-width:860px){
  body.idx #sec-1 .thesis-grid{grid-template-columns:1fr;gap:14px}
  body.idx .interchange .ix-row{grid-template-columns:1fr;gap:6px;text-align:center}
  body.idx .interchange .ix-line{height:24px;width:1px;min-width:0;min-height:24px;background:linear-gradient(180deg,transparent,rgba(128,93,232,.55),transparent);margin:0 auto;position:relative}
  body.idx .interchange .ix-line::before{display:block;content:"";position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid rgba(128,93,232,.55)}
  body.idx .interchange .ix-line::after{display:none}
}

/* ---------- POLICY (body.pol) ---------- */
/* Re-enable hero bg image for policy only, override inst default */
body.pol.inst .hero .bg{display:block !important;z-index:0}
body.pol.inst .hero .bg img{display:block !important;width:100%;height:100%;object-fit:cover;opacity:.28;filter:grayscale(.4) contrast(1.05)}
body.pol.inst .hero{min-height:72vh}
body.pol.inst .hero::after{
  content:"";display:block;position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,0,20,.55) 0%,rgba(10,0,20,.25) 40%,rgba(10,0,20,.85) 85%,#0a0014 100%);
  pointer-events:none;z-index:1;
}
body.pol.inst .hero-inner{position:relative;z-index:2}
body.pol.inst .hero::before{opacity:.55}

/* Bespoke stat block */
.polstats{
  max-width:1200px;margin:0 auto;padding:72px 48px 56px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);
}
.polstats .stat{
  padding:36px 32px;border-left:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:10px;
}
.polstats .stat:first-child{border-left:none}
.polstats .stat .ix{
  font-family:var(--mono,"DM Mono",monospace);font-size:.62rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.5;
}
.polstats .stat .big{
  font-family:var(--display,"Merriweather",serif);
  font-size:clamp(3.6rem,7vw,6.4rem);line-height:.95;letter-spacing:-.035em;
  color:#fff;font-weight:300;
}
.polstats .stat.accent .big{color:#805DE8;font-style:italic}
.polstats .stat .lbl{
  font-family:var(--display,"Merriweather",serif);
  font-size:.98rem;line-height:1.45;color:rgba(255,255,240,.72);max-width:24ch;
}
.polstats .stat .meta{
  font-family:var(--mono,"DM Mono",monospace);font-size:.6rem;
  letter-spacing:.18em;text-transform:uppercase;opacity:.4;margin-top:6px;
}
.polmeta-line{
  max-width:1200px;margin:0 auto;padding:14px 48px 0;
  font-family:var(--mono,"DM Mono",monospace);font-size:.62rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.45;text-align:right;
}
@media(max-width:860px){
  .polstats{grid-template-columns:1fr;padding:40px 20px 32px}
  .polstats .stat{border-left:none;border-top:1px solid rgba(255,255,255,.1);padding:28px 0}
  .polstats .stat:first-child{border-top:none}
  .polmeta-line{padding:12px 20px 0;text-align:left}
}
/* chart breathing room */
body.pol .svc-chart-wrap{margin-top:40px;padding:32px 0}

/* ---------- RESEARCH — SSRN citation card in hero ---------- */
body.ed .ssrn-card{
  margin-top:36px;max-width:520px;
  border:1px solid rgba(255,255,255,.15);
  padding:22px 24px;background:rgba(255,255,255,.02);
  display:grid;grid-template-columns:auto 1fr;gap:4px 22px;align-items:baseline;
}
body.ed .ssrn-card .k{
  font-family:var(--mono,"DM Mono",monospace);font-size:.58rem;
  letter-spacing:.2em;text-transform:uppercase;opacity:.5;
}
body.ed .ssrn-card .v{
  font-family:var(--display,"Merriweather",serif);font-size:.92rem;
  color:rgba(255,255,240,.92);line-height:1.4;
}
body.ed .ssrn-card .v em{color:#805DE8;font-style:italic}
body.ed .ssrn-card .v a{color:#805DE8;text-decoration:underline;text-underline-offset:3px}
body.ed .ssrn-card hr{grid-column:1/-1;border:0;border-top:1px solid rgba(255,255,255,.1);margin:8px 0}

/* Thaler pull-quote upgrade */
.thaler-pq{
  margin:36px 0;padding:40px 44px;
  border-left:2px solid #805DE8;
  background:linear-gradient(90deg,rgba(128,93,232,.06),transparent 80%);
  position:relative;
}
.thaler-pq::before{
  content:"\201C";position:absolute;top:-12px;left:20px;
  font-family:var(--display,"Merriweather",serif);
  font-size:5rem;line-height:1;color:rgba(128,93,232,.35);
}
.thaler-pq q,.thaler-pq .q{
  display:block;font-family:var(--display,"Merriweather",serif);
  font-size:clamp(1.9rem,3.6vw,2.8rem);line-height:1.15;
  font-weight:300;font-style:italic;color:#fff;letter-spacing:-.01em;
  margin:0 0 20px;quotes:none;
}
.thaler-pq q::before,.thaler-pq q::after{content:""}
.thaler-pq cite{
  font-family:var(--mono,"DM Mono",monospace);font-size:.64rem;
  letter-spacing:.2em;text-transform:uppercase;opacity:.6;font-style:normal;
}
@media(max-width:860px){
  .thaler-pq{padding:28px 24px 28px 28px}
}

/* ---------- ABOUT — founders bespoke ---------- */
.founders-list{
  margin-top:32px;border-top:1px solid rgba(255,255,255,.12);
}
.founders-list .fnd{
  display:grid;grid-template-columns:minmax(240px,1fr) 2.2fr;gap:48px;
  padding:40px 0;border-bottom:1px solid rgba(255,255,255,.1);
  align-items:start;
}
.founders-list .fnd .role{
  font-family:var(--mono,"DM Mono",monospace);font-size:.62rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.55;margin-bottom:10px;
}
.founders-list .fnd .nm{
  font-family:var(--display,"Merriweather",serif);
  font-size:clamp(2rem,3.8vw,3.2rem);line-height:1;letter-spacing:-.02em;
  font-weight:400;color:#fff;margin:0;
}
.founders-list .fnd .nm em{color:#805DE8;font-style:italic;font-weight:300;display:block;font-size:.58em;margin-top:6px;letter-spacing:0}
.founders-list .fnd .bio{
  font-family:var(--display,"Merriweather",serif);
  font-size:1rem;line-height:1.65;color:rgba(255,255,240,.78);
  max-width:56ch;margin:0;
}
.founders-list .fnd .ix{
  font-family:var(--mono,"DM Mono",monospace);font-size:.58rem;
  letter-spacing:.22em;opacity:.35;display:block;margin-bottom:14px;
}
@media(max-width:860px){
  .founders-list .fnd{grid-template-columns:1fr;gap:14px;padding:32px 0}
}

/* ---------- CONTACT — 2-col form + faq ---------- */
.contact-2col{
  display:grid;grid-template-columns:1.1fr 1fr;gap:64px;
  max-width:1240px;margin:0 auto;padding:0 48px;
}
.contact-2col > div{min-width:0}
.contact-2col .col-head{
  font-family:var(--mono,"DM Mono",monospace);font-size:.62rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.55;
  margin-bottom:10px;
}
.contact-2col h3.col-ttl{
  font-family:var(--display,"Merriweather",serif);
  font-size:clamp(1.4rem,2.2vw,1.8rem);font-weight:400;
  letter-spacing:-.01em;margin:0 0 24px;color:#fff;
}
.contact-2col .faq-list{margin-top:0}
.boilerband{
  border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);
  padding:56px 48px;margin-top:56px;
}
.boilerband .inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:220px 1fr;gap:48px}
.boilerband .eye{
  font-family:var(--mono,"DM Mono",monospace);font-size:.62rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.55;
}
.boilerband p{
  font-family:var(--display,"Merriweather",serif);font-size:.96rem;
  line-height:1.65;color:rgba(255,255,240,.78);max-width:72ch;margin:0 0 12px;
}
.boilerband p:last-child{margin-bottom:0}
body.ctc .hero-body .eyebrow{color:rgba(128,93,232,.85)}
@media(max-width:860px){
  .contact-2col{grid-template-columns:1fr;gap:40px;padding:0 20px}
  .boilerband{padding:36px 20px}
  .boilerband .inner{grid-template-columns:1fr;gap:16px}
}
