/* ============================================================
   NAVIRA — design system v2
   Colours are sampled from the Navira mark: the deep ribbon green
   (#1F3832) and the taupe-gold arch (#C0AC93). Dark "night" bands carry
   the 3D sculpture; cool mist surfaces carry reading content. The logo's
   dot is the one recurring ornament (labels, bullets, active states);
   the logo's arch shape appears on monograms and step markers.
============================================================ */
:root{
  --night:     #0E1F1B;
  --night-2:   #132823;
  --pine:      #1F3832;
  --pine-700:  #2C4A42;
  --pine-600:  #3A5B52;
  --taupe:     #C0AC93;
  --taupe-300: #DCCFBD;
  --taupe-200: #EAE1D4;
  --taupe-700: #765F45;
  --mist:      #EEF0EC;
  --mist-2:    #E3E7E1;
  --paper:     #F8F9F6;
  --line:      #D2D9D1;
  --ink:       #13241E;
  --ink-soft:  #44534C;
  --ink-faint: #5E6B65;
  --cream:     #F3F1EA;

  --shadow-1: 0 1px 2px rgba(14,31,27,.06);
  --shadow-2: 0 14px 34px -18px rgba(14,31,27,.38);
  --shadow-3: 0 30px 64px -30px rgba(14,31,27,.5);

  --r-s: 6px;
  --r-m: 14px;
  --r-l: 22px;
  --arch: 999px 999px 8px 8px;

  --ease: cubic-bezier(.2,.8,.2,1);
  --nav-h: 78px;
  --gutter: clamp(16px, 5.5vw, 72px);
  --max: 1240px;

  --font-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --font-body: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;
  color-scheme: light;
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important; animation-delay: 0s !important;
    animation-iteration-count: 1 !important; transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body{
  margin: 0; background: var(--mist); color: var(--ink);
  font-family: var(--font-body); font-size: 16.5px; line-height: 1.65;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img{ max-width: 100%; display: block; }
a{ color: inherit; text-decoration: none; }
h1,h2,h3,h4,h5{ font-family: var(--font-display); font-weight: 400; margin: 0; text-wrap: balance; letter-spacing: 0; }
p{ margin: 0; text-wrap: pretty; }
ul{ margin: 0; padding: 0; list-style: none; }
button{ font: inherit; border: none; background: none; color: inherit; cursor: pointer; }
::selection{ background: var(--taupe-300); color: var(--night); }
:focus-visible{ outline: 2px solid var(--taupe-700); outline-offset: 3px; border-radius: 4px; }
.on-dark :focus-visible{ outline-color: var(--taupe); }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
#app{ position: relative; isolation: isolate; }

/* ---------- surfaces: components read these variables ---------- */
.on-light{
  background: var(--mist); color: var(--ink);
  --fg: var(--ink); --fg-head: var(--pine); --fg-soft: var(--ink-soft); --fg-faint: var(--ink-faint);
  --rule: var(--line); --rule-strong: rgba(31,56,50,.32);
  --surface: var(--paper); --surface-2: #fff;
  --accent: var(--taupe-700); --dot: var(--taupe);
  --btn-bg: var(--pine); --btn-fg: var(--cream); --btn-bg-hover: var(--night);
}
.on-light.alt{ background: var(--mist-2); }
.on-dark{
  background: var(--night); color: var(--cream);
  --fg: var(--cream); --fg-head: var(--cream); --fg-soft: rgba(243,241,234,.84); --fg-faint: rgba(243,241,234,.7);
  --rule: rgba(192,172,147,.26); --rule-strong: rgba(243,241,234,.42);
  --surface: rgba(255,255,255,.05); --surface-2: rgba(255,255,255,.08);
  --accent: var(--taupe); --dot: var(--taupe);
  --btn-bg: var(--taupe); --btn-fg: var(--night); --btn-bg-hover: var(--taupe-300);
}

/* label: sentence case, preceded by the logo's dot */
.eyebrow{
  font-family: var(--font-body); font-size: 14px; font-weight: 600; letter-spacing: .01em;
  display: inline-flex; align-items: center; gap: 10px; color: var(--accent);
}
.eyebrow::before{ content:""; width: 8px; height: 8px; border-radius: 50%; background: var(--dot); flex: none; }

.section{ position: relative; padding-block: clamp(76px, 10vw, 140px); padding-inline: var(--gutter); }
.inner{ max-width: var(--max); margin: 0 auto; position: relative; z-index: 2; }
.kicker-block{ max-width: 760px; display:flex; flex-direction:column; gap:18px; margin-bottom: clamp(40px,6vw,72px); }
.kicker-block h1, .kicker-block h2{ font-size: clamp(32px, 4.4vw, 56px); line-height: 1.06; color: var(--fg-head); }
.lede{ font-size: clamp(16.5px, 1.45vw, 19.5px); line-height: 1.6; max-width: 58ch; color: var(--fg-soft); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding: 14px 28px; min-height: 50px; border-radius: 999px;
  font-size: 15px; font-weight: 600; letter-spacing: .005em; line-height: 1.2;
  transition: transform .35s var(--ease), background .3s, color .3s, border-color .3s, box-shadow .3s;
}
.btn-gold{ background: var(--btn-bg, var(--pine)); color: var(--btn-fg, var(--cream)); }
.btn-gold:hover{ background: var(--btn-bg-hover, var(--night)); transform: translateY(-2px); box-shadow: var(--shadow-2); }
.btn-line{ border: 1px solid var(--rule-strong, rgba(31,56,50,.32)); color: var(--fg, var(--pine)); }
.btn-line:hover{ border-color: var(--accent); background: var(--surface-2); transform: translateY(-2px); }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- navigation ---------- */
.nav{
  position: fixed; top:0; left:0; right:0; z-index: 60;
  height: calc(var(--nav-h) + env(safe-area-inset-top,0px));
  padding: env(safe-area-inset-top,0px) var(--gutter) 0;
  display:flex; align-items:center; justify-content:space-between; gap: 20px;
  color: var(--ink);
  background: rgba(238,240,236,.86);
  backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
  transition: background .45s var(--ease), box-shadow .45s var(--ease), color .45s;
}
.nav.is-solid{ background: rgba(238,240,236,.95); box-shadow: 0 1px 0 var(--line); color: var(--ink); }
.hero-dark .nav:not(.is-solid){ background: linear-gradient(180deg, rgba(14,31,27,.72), rgba(14,31,27,0)); backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--cream); }
.nav-brand{ display:flex; align-items:center; gap:14px; flex: none; }
.nav-brand img{ width: 44px; height: 44px; padding: 8px 7px; object-fit: contain; border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 1px rgba(192,172,147,.5); }
.nav-brand .word{ font-family: var(--font-display); font-size: 19px; letter-spacing: .34em; color: currentColor; }
.nav-links{ display:flex; align-items:center; gap: clamp(16px,2vw,30px); }
.nav-links a{ font-size: 14.5px; font-weight: 500; color: currentColor; opacity: .82; padding: 8px 0; position:relative; white-space:nowrap; transition: opacity .25s; }
.nav-links a::after{ content:""; position:absolute; left:50%; bottom:-2px; width:5px; height:5px; margin-left:-2.5px; border-radius:50%; background: var(--taupe); transform: scale(0); transition: transform .35s var(--ease); }
.nav-links a:hover, .nav-links a.is-active{ opacity: 1; }
.nav-links a:hover::after, .nav-links a.is-active::after{ transform: scale(1); }
.nav-cta{ border:1px solid var(--taupe); opacity: 1 !important; padding: 10px 20px !important; border-radius: 999px; font-weight: 600 !important; }
.nav-cta::after{ display:none; }
.nav-cta:hover{ background: var(--taupe); color: var(--night) !important; border-color: var(--taupe); }
.nav-social{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border:1px solid currentColor; border-radius:50%; flex:none; opacity:.7 !important; padding:0 !important; }
.nav-social::after{ display:none; }
.nav-social svg{ width:15px; height:15px; }
.nav-social:hover{ opacity:1 !important; color: var(--taupe-700); }
.on-dark .nav-social:hover, .site-footer .nav-social:hover{ color: var(--taupe); }
.nav-toggle{ display:none; color: currentColor; font-size:22px; z-index:70; width:46px; height:46px; border-radius: 50%; }
@media (max-width: 1080px){
  .nav-links{
    position:fixed; inset:0; height:100vh; height:100dvh; padding: calc(var(--nav-h) + 32px) var(--gutter) 40px;
    background: var(--mist); color: var(--ink); flex-direction:column; align-items:flex-start; gap: 22px; overflow-y:auto;
    transform: translateX(100%); transition: transform .5s var(--ease); visibility: hidden;
  }
  .nav-links.is-open{ transform: translateX(0); visibility: visible; }
  .nav-links a{ font-size: 28px; font-family: var(--font-display); font-weight: 400; opacity: 1; }
  .nav-links a::after{ left: -16px; bottom: 50%; margin: 0 0 -2.5px; }
  .nav-cta{ font-family: var(--font-body) !important; font-size: 16px !important; margin-top: 8px; }
  .nav-toggle{ display:block; }
  body.menu-open .nav{ color: var(--ink); background: var(--mist); }
}

/* ---------- canvases: fade in after first frame ---------- */
.hero-stage, .page-hero-stage, .process-stage, .contact-stage{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.hero-stage canvas, .page-hero-stage canvas, .process-stage canvas, .contact-stage canvas{
  position:absolute; inset:0; width:100%; height:100%; display:block; opacity:0; transition: opacity 1.6s var(--ease);
}
canvas.is-live{ opacity:1; }

/* ---------- home hero ---------- */
.hero{
  position: relative; min-height: 100vh; min-height: 100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding: calc(var(--nav-h) + 48px) var(--gutter) 44px; overflow:hidden;
  background:
    radial-gradient(34vw 34vw at 76.5% 47vh, rgba(214,198,174,.26), rgba(58,91,82,.32) 45%, transparent 75%),
    var(--night);
}
.hero-fallback{ position:absolute; right: 6vw; top: 50%; width: min(38vw, 520px); transform: translateY(-58%); opacity:.9; transition: opacity 1.4s var(--ease); }
.hero-fallback img{ width:100%; height:auto; filter: drop-shadow(0 30px 60px rgba(0,0,0,.45)); background: radial-gradient(closest-side, rgba(243,241,234,.5), rgba(243,241,234,0)); border-radius: 50%; padding: 12%; }
.hero-stage:has(canvas.is-live) .hero-fallback{ opacity:0; }
.hero-veil{
  position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(14,31,27,.94) 0%, rgba(14,31,27,.78) 34%, rgba(14,31,27,.12) 62%, rgba(14,31,27,0) 76%),
    linear-gradient(0deg, rgba(14,31,27,.96) 0%, rgba(14,31,27,.55) 22%, rgba(14,31,27,0) 46%);
}
@media (max-width: 900px){
  .hero{ padding-top: calc(var(--nav-h) + min(210px, 50vw) + 84px); justify-content: flex-start;
    background: radial-gradient(70vw 70vw at 50% calc(var(--nav-h) + 180px), rgba(214,198,174,.24), rgba(58,91,82,.3) 45%, transparent 75%), var(--night); }
  .hero-fallback{ width: min(250px, 62vw); right: auto; left: 50%; top: calc(var(--nav-h) + 20px); transform: translateX(-50%); }
  .hero-veil{ background: linear-gradient(180deg, rgba(14,31,27,0) 0, rgba(14,31,27,0) calc(var(--nav-h) + min(210px, 50vw) + 60px), rgba(14,31,27,.7) calc(var(--nav-h) + min(210px, 50vw) + 150px), rgba(14,31,27,.92) 100%); }
}
.hero-inner{ position:relative; z-index:2; width: 100%; }
.hero h1{ color: var(--cream); font-size: clamp(44px, 7.4vw, 112px); line-height: 1.0; max-width: 11ch; }
.hero-title .ln{ display:block; overflow:hidden; padding-bottom:.1em; margin-bottom: -.06em; }
.hero-title .ln > span{ display:inline-block; transform: translateY(108%); animation: lineUp 1.2s var(--ease) forwards; }
.hero-title .ln:nth-child(1) > span{ animation-delay:.15s; }
.hero-title .ln:nth-child(2) > span{ animation-delay:.3s; }
@keyframes lineUp{ to{ transform:none; } }
.hero h1 .accent{ color: var(--taupe); font-style: normal; }
@keyframes heroFade{ from{ opacity:0; transform: translateY(12px); } to{ opacity:1; transform:none; } }
.hero-lede{ margin-top: 28px; max-width: 46ch; font-size: clamp(16.5px,1.4vw,19.5px); line-height: 1.62; color: rgba(243,241,234,.88); opacity:0; animation: heroFade 1s var(--ease) .5s forwards; }
.hero .hero-actions{ margin-top:36px; opacity:0; animation: heroFade 1s var(--ease) .65s forwards; }
.hero .stat-strip{ opacity:0; animation: heroFade 1s var(--ease) .8s forwards; }
.hero .hero-fineprint{ opacity:0; animation: heroFade 1s var(--ease) .95s forwards; }

.stat-strip{ position:relative; z-index:2; margin-top: clamp(48px,7vw,84px); display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top:1px solid var(--rule); }
.stat-strip > div{ padding: 20px 22px 4px 0; min-width:0; position: relative; }
.stat-strip > div + div{ padding-left: 22px; border-left: 1px solid var(--rule); }
.stat-strip > div::before{ content:""; position:absolute; top:-4px; left:0; width:7px; height:7px; border-radius:50%; background: var(--taupe); }
.stat-strip > div + div::before{ left: -4px; }
.stat-strip .n{ font-family: var(--font-display); font-size: clamp(24px,2.4vw,34px); color: var(--cream); line-height:1.15; }
.stat-strip .l{ font-size: 14px; line-height: 1.5; color: rgba(243,241,234,.84); margin-top:8px; overflow-wrap:anywhere; }
@media (max-width: 760px){
  .stat-strip{ grid-template-columns: repeat(2,minmax(0,1fr)); row-gap: 18px; }
  .stat-strip > div:nth-child(3){ padding-left:0; border-left:none; }
  .stat-strip > div:nth-child(3)::before{ left:0; }
  .stat-strip > div:nth-child(n+3){ border-top: 1px solid var(--rule); }
}
.hero-fineprint{
  position:relative; z-index:2; margin-top: clamp(32px,4vw,52px);
  display:flex; align-items:flex-start; gap:12px;
  font-size: 13.5px; line-height:1.65; color: var(--fg-soft, var(--ink-soft));
  max-width: 820px;
}
.hero-fineprint svg{ flex:none; margin-top:3px; color: var(--taupe); }
.hero-fineprint a{ text-decoration: underline; text-underline-offset: 3px; color: var(--fg, inherit); }
.on-light .hero-fineprint svg{ color: var(--taupe-700); }

/* ---------- inner page hero (dark, with sculpture) ---------- */
.page-hero{
  min-height: 66vh; display:flex; flex-direction:column; justify-content:flex-end;
  padding: calc(var(--nav-h) + 72px) var(--gutter) clamp(56px,7vw,96px); position:relative; overflow:hidden;
  background: radial-gradient(55% 75% at 80% 40%, rgba(58,91,82,.5), transparent 70%), var(--night);
}
.page-hero .inner{ width:100%; }
.page-hero.has-stage::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(14,31,27,.92) 0%, rgba(14,31,27,.66) 36%, rgba(14,31,27,0) 66%),
    linear-gradient(0deg, rgba(14,31,27,.9) 0%, rgba(14,31,27,0) 32%);
}
@media (max-width: 900px){ .page-hero.has-stage::after{ background: rgba(14,31,27,.66); } }
.page-hero h1{ color: var(--fg-head); font-size: clamp(38px,6vw,76px); max-width: 16ch; line-height:1.03; margin-top:20px; }
.page-hero .lede{ margin-top:22px; max-width:54ch; }
.crumb{ font-size: 14px; font-weight: 500; color: var(--fg-faint, var(--ink-faint)); }
.crumb a{ color: var(--accent, var(--taupe-700)); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; transition: text-decoration-color .25s; }
.crumb a:hover{ text-decoration-color: currentColor; }
.on-light .crumb, .risk .crumb, .contact .crumb{ color: var(--ink-faint); }
.on-light .crumb a, .risk .crumb a, .contact .crumb a{ color: var(--taupe-700); }

/* ============================================================
   Boxes — on hover every box turns Navira green
============================================================ */
.adv-item, .teaser-card, .thesis-card, .gov-card, .term-cell, .ppm-card, .team-card, .process-callout{
  transition: background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease), transform .45s var(--ease), box-shadow .45s var(--ease);
}
.adv-item *, .teaser-card *, .thesis-card *, .gov-card *, .term-cell *, .ppm-card *, .team-card *{ transition: color .45s var(--ease), border-color .45s var(--ease), background-color .45s var(--ease); }
.adv-item:hover, .teaser-card:hover, .thesis-card:hover, .gov-card:hover, .term-cell:hover, .ppm-card:hover, .team-card:hover,
.adv-item:focus-within, .teaser-card:focus-visible, .gov-card:focus-within, .term-cell:focus-within{
  background-color: var(--pine); border-color: var(--pine); color: var(--cream);
  --fg: var(--cream); --fg-head: var(--cream); --fg-soft: rgba(243,241,234,.86); --fg-faint: rgba(243,241,234,.72);
  --accent: var(--taupe); --rule: rgba(192,172,147,.3);
}
.teaser-card:hover, .thesis-card:hover, .team-card:hover, .ppm-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-3); }
.on-dark .process-callout:hover{ background: rgba(192,172,147,.12); border-color: rgba(192,172,147,.5); }

/* ---------- home: advantage ---------- */
.advantage{ padding-block: clamp(76px, 9vw, 120px); }
.advantage .kicker-block{ margin-bottom: 48px; }
.adv-grid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; background: var(--rule); border:1px solid var(--rule); border-radius: var(--r-l); overflow: hidden; }
.adv-item{ background: var(--surface); padding: clamp(28px,3vw,40px) clamp(22px,2.4vw,30px); display:flex; flex-direction:column; gap:16px; min-width:0; }
.adv-icon{ width:52px; height:52px; color: var(--accent); }
.adv-item h3{ font-size: 23px; color: var(--fg-head); line-height:1.2; }
.adv-item p{ font-size: 15.5px; color: var(--fg-soft); }
@media (max-width: 960px){ .adv-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px){ .adv-grid{ grid-template-columns: 1fr; } }

/* ---------- home: chapter cards ---------- */
.teaser-grid{ display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
@media (max-width: 1040px){ .teaser-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 560px){ .teaser-grid{ grid-template-columns: 1fr; } }
.teaser-card{
  background: var(--surface); border:1px solid var(--rule); border-radius: var(--r-m);
  padding: 30px 26px 26px; display:flex; flex-direction:column; gap:14px; min-height:270px;
}
.teaser-card .tnum{ font-size: 14px; font-weight: 600; color: var(--accent); font-variant-numeric: tabular-nums; }
.teaser-card h3{ color: var(--fg-head); font-size: 25px; line-height: 1.15; }
.teaser-card p{ color: var(--fg-soft); font-size: 15.5px; flex:1; }
.teaser-card .go{ font-size: 15px; font-weight: 600; color: var(--fg-head); display:flex; align-items:center; gap:10px; padding-top: 14px; border-top: 1px solid var(--rule); }
.teaser-card .go svg{ transition: transform .35s var(--ease); }
.teaser-card:hover .go svg{ transform: translateX(5px); }

/* ---------- approach ---------- */
.thesis-grid{ display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.thesis-card{ background: var(--surface); border:1px solid var(--rule); border-radius: var(--r-m); padding: clamp(28px,3vw,42px) clamp(22px,2.6vw,34px); display:flex; flex-direction:column; gap:16px; min-height: 290px; }
.thesis-card h3{ color: var(--fg-head); font-size: clamp(23px,2.2vw,28px); }
.thesis-card p{ color: var(--fg-soft); font-size:15.5px; }
.thesis-card .node{ width:44px; height:52px; border-radius: var(--arch); background: var(--pine); color: var(--cream); display:flex; align-items:flex-end; justify-content:center; padding-bottom: 9px; font-size:14px; font-weight:600; font-variant-numeric: tabular-nums; }
.thesis-card:hover .node{ background: var(--taupe); color: var(--night); }
@media (max-width:880px){ .thesis-grid{ grid-template-columns: 1fr; } .thesis-card{ min-height:0; } }

.portfolio-wrap{ display:grid; grid-template-columns: 380px minmax(0,1fr); gap: clamp(36px,6vw,100px); align-items:center; }
@media (max-width: 900px){ .portfolio-wrap{ grid-template-columns: 1fr; } }
.donut-holder{ display:flex; justify-content:center; position: relative; }
.donut-holder svg{ width:100%; max-width:340px; filter: drop-shadow(0 24px 30px rgba(14,31,27,.14)); }
@keyframes growUnlisted{ to{ stroke-dasharray: 275.6 540.4; } }
@keyframes growListed{ to{ stroke-dasharray: 264.75 540.4; stroke-dashoffset: -275.6; } }
#donutUnlisted{ animation: growUnlisted 1.2s var(--ease) .6s forwards; stroke: var(--pine); }
#donutListed{ animation: growListed 1.2s var(--ease) .6s forwards; stroke: #B49B7C; }
.alloc-row{ display:grid; grid-template-columns: 22px minmax(0,1fr) auto; gap:18px; align-items:flex-start; padding: 22px 0; border-top: 1px solid var(--rule); }
.alloc-row:first-child{ border-top:none; }
.alloc-dot{ width:12px;height:12px;border-radius:50%; margin-top:8px; }
.alloc-row h4{ font-size:18px; font-weight:600; font-family:var(--font-body); color: var(--fg-head); }
.alloc-row p{ color:var(--fg-soft); font-size:15.5px; margin-top:4px; max-width:50ch; }
.alloc-row .pct{ font-family:var(--font-display); font-size:24px; color: var(--accent); font-variant-numeric: tabular-nums; }
.note-line{ margin-top:24px; padding:18px 20px; background: var(--surface); border:1px solid var(--rule); border-left: 3px solid var(--taupe); border-radius: var(--r-s); font-size:14.5px; color: var(--fg-soft); }

.process{ overflow:hidden; background: var(--night); }
.process-stage{ opacity:.9; }
.process::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background: linear-gradient(180deg, rgba(14,31,27,.92) 0%, rgba(14,31,27,.45) 50%, rgba(14,31,27,.86) 100%); }
.process-track{ position:relative; padding-top: 30px; }
.process-line{ position:absolute; left:22px; right:0; top: 56px; height:1px; background: var(--rule); }
@keyframes growFill{ to{ width:100%; } }
.process-line-fill{ position:absolute; left:0; top:0; height:100%; width:0%; background: linear-gradient(90deg, var(--taupe), var(--taupe-300)); animation: growFill 1.4s var(--ease) .7s forwards; }
.process-grid{ display:grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 24px; position:relative; }
.process-step{ display:flex; flex-direction:column; gap:14px; }
.process-dot{ width:44px; height:52px; border-radius: var(--arch); background: var(--night-2); border:1px solid var(--taupe); display:flex; align-items:flex-end; justify-content:center; padding-bottom:9px; color: var(--taupe); font-size:15px; font-weight:600; position:relative; z-index:2; transition: background .35s, color .35s; }
.process-step:hover .process-dot{ background: var(--taupe); color: var(--night); }
.process-step h4{ color:var(--fg-head); font-size:21px; }
.process-step p{ color: var(--fg-soft); font-size:15px; }
@media (max-width: 900px){ .process-grid{ grid-template-columns:1fr; gap:30px; } .process-line{ display:none; } }
.process-callout{ margin-top: 56px; padding: 24px 28px; border:1px solid var(--rule); border-radius: var(--r-m); background: var(--surface); }
.process-callout p{ color: var(--fg-soft); font-size:15.5px; max-width: 80ch; }
.process-callout strong{ color: var(--taupe); font-weight: 600; }

/* ---------- team ---------- */
.team-grid{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
@media (max-width: 820px){ .team-grid{ grid-template-columns: 1fr; } }
.team-card{ background: var(--surface); border:1px solid var(--rule); border-radius: var(--r-l); padding: clamp(26px,3.2vw,44px); }
.team-top{ display:flex; align-items:flex-end; gap:20px; margin-bottom:22px; }
.monogram{ width:68px; height:82px; border-radius: var(--arch); flex:none; display:flex; align-items:flex-end; justify-content:center; padding-bottom: 14px; font-family:var(--font-display); font-size:24px; color: var(--cream); background: var(--pine); box-shadow: inset 0 0 0 1px rgba(192,172,147,.5); }
.team-card:hover .monogram{ background: var(--taupe); color: var(--night); }
.team-top h3{ font-size: 28px; color: var(--fg-head); }
.team-top .role{ font-size:14px; font-weight:600; color: var(--accent); margin-top:4px; }
.team-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.team-tags span{ font-size:13.5px; font-weight:500; padding:6px 13px; border-radius:999px; border:1px solid var(--rule); color: var(--fg-soft); }
.team-card ul{ display:flex; flex-direction:column; gap:12px; }
.team-card li{ display:flex; gap:12px; font-size:15.5px; color: var(--fg-soft); }
.team-card li::before{ content:""; flex:none; width:7px; height:7px; margin-top:10px; border-radius:50%; background: var(--taupe); }

.gov-grid{ display:grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; background: var(--rule); border:1px solid var(--rule); border-radius: var(--r-l); overflow:hidden; margin-bottom: 32px; }
@media (max-width: 1100px){ .gov-grid{ grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 720px){ .gov-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 480px){ .gov-grid{ grid-template-columns: 1fr; } }
.gov-card{ background: var(--surface); padding: 28px 22px; display:flex; flex-direction:column; gap:12px; min-width:0; cursor: default; }
.gov-card .role{ font-size:13.5px; font-weight:600; color: var(--accent); display:flex; align-items:center; gap:8px; }
.gov-card .role::before{ content:""; width:7px; height:7px; border-radius:50%; background: var(--taupe); flex:none; }
.gov-card h4{ font-size:21px; line-height:1.25; color: var(--fg-head); }
.gov-card p{ font-size:14.5px; color: var(--fg-soft); }
.gov-statement{ font-size:16px; color: var(--fg-soft); max-width:70ch; margin-bottom:24px; }
.trust-list{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 44px; }
@media (max-width: 720px){ .trust-list{ grid-template-columns: 1fr; } }
.trust-list li{ display:flex; gap:14px; font-size:15.5px; padding: 16px 0; border-top:1px solid var(--rule); color: var(--fg-soft); }
.trust-list li::before{ content:""; width:7px; height:7px; border-radius:50%; background: var(--taupe); flex:none; margin-top: 10px; }
.trust-list strong{ color: var(--fg-head); font-weight:600; }
.trust-list a{ text-decoration: underline; text-underline-offset: 3px; }

/* ---------- fund terms ---------- */
.terms-grid{ display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: var(--r-l); overflow:hidden; }
@media (max-width: 900px){ .terms-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 560px){ .terms-grid{ grid-template-columns: 1fr; } }
.term-cell{ background: var(--surface); padding: 28px 24px; display:flex; flex-direction:column; gap:10px; min-width:0; }
.term-cell .k{ font-size:13.5px; font-weight:600; color: var(--accent); }
.term-cell .v{ font-family:var(--font-display); font-size:25px; color: var(--fg-head); line-height:1.2; }
.term-cell .d{ font-size:14.5px; color: var(--fg-soft); }
.ppm-grid{ margin-top: 44px; display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
@media (max-width: 760px){ .ppm-grid{ grid-template-columns: 1fr; } }
.ppm-card{ padding: 30px 28px; border:1px solid var(--rule); border-radius: var(--r-m); background: var(--surface); display:flex; flex-direction:column; gap:14px; }
.ppm-card p{ font-size:15.5px; color: var(--fg-soft); max-width:58ch; }

/* ---------- risk (deliberately static) ---------- */
.risk{ background: var(--mist); --fg-soft: var(--ink-soft); --rule: var(--line); }
.risk .inner{ max-width: 1080px; }
.risk-flag{ display:inline-flex; align-items:center; gap:10px; padding:9px 16px; border-radius:999px; background: var(--pine); color: var(--taupe-200); font-size:14px; font-weight:500; margin-bottom: 22px; }
.risk-flag::before{ content:""; width:7px; height:7px; border-radius:50%; background: var(--taupe); }
.risk h1{ color: var(--pine); line-height: 1.08; }
.risk .lede{ color: var(--ink-soft); }
.risk-h2{ font-size: clamp(26px, 2.8vw, 34px); color: var(--pine); margin-top: 52px; }
.risk-columns{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 48px; margin-top: 20px; }
@media (max-width: 900px){ .risk-columns{ grid-template-columns:1fr; } }
.risk-item{ padding: 18px 0; border-top:1px solid var(--line); }
.risk-item strong{ display:block; font-size:16.5px; font-weight:600; margin-bottom:4px; color: var(--pine); }
.risk-item span{ font-size:15.5px; color: var(--ink-soft); }
.notice-block{ margin-top: 56px; padding: clamp(24px,3.4vw,44px); background: var(--paper); border:1px solid var(--line); border-radius: var(--r-l); scroll-margin-top: calc(var(--nav-h) + 20px); }
.notice-block h2{ font-size: clamp(24px, 2.6vw, 32px); color: var(--pine); margin-bottom: 20px; }
.notice-list{ display:flex; flex-direction:column; gap:14px; counter-reset: n; list-style:none; margin:0; padding:0; }
.notice-list li{ position:relative; padding-left: 40px; font-size:15.5px; line-height:1.7; color: var(--ink-soft); max-width: 82ch; counter-increment: n; }
.notice-list li::before{ content: counter(n); position:absolute; left:0; top:1px; width:26px; height:30px; border-radius: var(--arch); background: var(--mist-2); color: var(--pine); font-size:12.5px; font-weight:600; display:flex; align-items:flex-end; justify-content:center; padding-bottom:5px; }
.risk-banner{ margin-top: 34px; padding: 20px 22px; background: var(--taupe-200); border-left: 3px solid var(--taupe-700); border-radius: var(--r-s); font-size:15px; color: var(--ink); }

/* ---------- contact ---------- */
.contact{ overflow:hidden; min-height: 100vh; background: radial-gradient(50% 60% at 85% 30%, rgba(192,172,147,.22), transparent 70%), var(--mist); }
.contact-stage{ opacity:1; }
.contact::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background: linear-gradient(90deg, rgba(238,240,236,.97) 0%, rgba(238,240,236,.8) 42%, rgba(238,240,236,.1) 100%); }
@media (max-width: 900px){ .contact-stage{ opacity:.4; } }
.contact-wrap{ display:grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: clamp(30px,5vw,84px); }
@media (max-width: 900px){ .contact-wrap{ grid-template-columns:1fr; } }
.contact-h{ font-size: clamp(40px,5.6vw,72px); color: var(--pine); max-width:13ch; line-height:1.03; }
.contact-lede{ margin-top:22px; color: var(--ink-soft); max-width:48ch; font-size:17.5px; }
.contact-card{ background: rgba(248,249,246,.94); border:1px solid var(--line); border-radius: var(--r-l); padding: clamp(24px,3vw,38px); display:flex; flex-direction:column; gap:20px; box-shadow: var(--shadow-3); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); align-self:start; }
.contact-row{ display:flex; flex-direction:column; gap:5px; padding-bottom:18px; border-bottom:1px solid var(--line); min-width:0; }
.contact-row:last-child{ border-bottom:none; padding-bottom:0; }
.contact-row .k{ font-size:13.5px; font-weight:600; color: var(--taupe-700); }
.contact-row .v{ color: var(--pine); font-size:17px; overflow-wrap:anywhere; }
.contact-row .person{ display:flex; justify-content:space-between; gap:4px 12px; flex-wrap:wrap; font-size:15.5px; color: var(--ink-soft); margin-top:4px; }
.contact-row .person b{ font-weight:600; color: var(--pine); }
.contact-row a:hover{ color: var(--taupe-700); text-decoration: underline; text-underline-offset: 3px; }
.social-inline{ display:flex; align-items:center; gap:10px; }
.contact .eyebrow{ --accent: var(--taupe-700); --dot: var(--taupe); }
.ppm-access{ margin-top:40px; padding-top:30px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:12px; scroll-margin-top: calc(var(--nav-h) + 24px); }
.ppm-access h2{ color: var(--pine); font-size: clamp(26px, 2.8vw, 36px); }
.ppm-access p{ color: var(--ink-soft); font-size:16px; max-width:54ch; }
.ppm-access p.fine{ font-size:14px; color: var(--ink-faint); }
.contact .hero-fineprint{ color: var(--ink-soft); padding-top: 20px; border-top: 1px solid var(--line); }
.contact .hero-fineprint a{ color: var(--pine); }
.sel{ color: var(--fg-head, var(--pine)); font-weight: 600; font-size:.98em; user-select:all; -webkit-user-select:all; overflow-wrap: anywhere; }

/* ---------- static document pages ---------- */
.doc .inner{ max-width: 880px; }
.doc h1{ color: var(--pine); }
.doc-body{ margin-top: 34px; display:flex; flex-direction:column; gap:16px; }
.doc-body h2{ font-size: 26px; margin-top: 18px; color: var(--pine); }
.doc-body p{ font-size:16.5px; line-height:1.72; color: var(--ink-soft); max-width: 70ch; }
.doc-body a{ color: var(--taupe-700); text-decoration: underline; text-underline-offset: 3px; }
.doc-facts{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1px; background: var(--line); border:1px solid var(--line); border-radius: var(--r-m); overflow:hidden; }
@media (max-width: 760px){ .doc-facts{ grid-template-columns: 1fr; } }
.doc-facts > div{ background: var(--paper); padding: 20px 22px; font-size:15.5px; color: var(--pine); display:flex; flex-direction:column; gap:6px; overflow-wrap:anywhere; }
.doc-facts .k{ font-size:13.5px; font-weight:600; color: var(--taupe-700); }

/* ---------- footer ---------- */
.site-footer{ padding: 76px var(--gutter) 40px; background: var(--night); position: relative; }
.site-footer::before{ content:""; position:absolute; left:0; right:0; top:0; height:1px; background: linear-gradient(90deg, transparent, rgba(192,172,147,.5), transparent); }
.footer-top{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.5fr); gap: 44px; padding-bottom:38px; border-bottom:1px solid var(--rule); max-width:var(--max); margin:0 auto; }
@media (max-width: 900px){ .footer-top{ grid-template-columns: 1fr; } }
.footer-brand{ display:flex; flex-direction:column; gap:22px; }
.footer-logo{ display:flex; align-items:center; gap:16px; }
.footer-logo .disc{ width:56px; height:56px; border-radius:50%; background: var(--paper); display:flex; align-items:center; justify-content:center; flex:none; }
.footer-logo .disc img{ width:32px; height:auto; }
.footer-logo .word{ font-family: var(--font-display); font-size: 23px; letter-spacing:.36em; color: var(--cream); }
.footer-id{ display:flex; flex-direction:column; gap:4px; font-size:14.5px; color: var(--fg-soft); }
.footer-id strong{ color: var(--fg); font-family: var(--font-display); font-weight:400; font-size:21px; }
.footer-id .mono{ font-size:13.5px; font-weight:500; color: var(--taupe); margin-top:6px; font-variant-numeric: tabular-nums; }
.footer-cols{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 30px; }
@media (max-width: 640px){ .footer-cols{ grid-template-columns: 1fr 1fr; } .footer-contact{ grid-column: 1 / -1; } }
.footer-cols h5{ margin:0 0 16px; font-family: var(--font-body); font-weight:600; font-size:14px; color: var(--taupe); }
.footer-cols ul{ display:flex; flex-direction:column; gap:11px; }
.footer-cols a, .footer-cols button{ font-size:15px; color: var(--fg-soft); text-align:left; padding:0; transition: color .25s; }
.footer-cols a:hover, .footer-cols button:hover{ color: var(--cream); }
.footer-contact p{ font-size:14.5px; color: var(--fg-soft); margin-bottom:12px; overflow-wrap:anywhere; }
.footer-contact p:first-of-type{ color: var(--fg); }
.footer-contact .k{ display:block; font-size:13px; font-weight:600; color: var(--fg-faint); margin-bottom:2px; }
.footer-contact .social-inline{ margin-top:8px; }
.footer-contact .sel{ color: var(--cream); }
.footer-legal{ max-width:var(--max); margin: 28px auto 0; font-size:13.5px; line-height:1.72; color: var(--fg-faint); }
.footer-legal p + p{ margin-top:10px; }
.footer-legal strong{ color: var(--fg-soft); }
.footer-legal a{ color: var(--taupe); text-decoration: underline; text-underline-offset: 3px; }
.footer-bottom{ max-width:var(--max); margin: 24px auto 0; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px; color: var(--fg-faint); }

/* ---------- Request PPM dialog ---------- */
.modal{ position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center; padding: 16px; }
.modal[hidden]{ display:none; }
.modal-scrim{ position:absolute; inset:0; background: rgba(14,31,27,.6); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); animation: fadeIn .3s var(--ease); }
.modal-panel{
  position:relative; width: min(580px, 100%); max-height: calc(100dvh - 32px); overflow-y:auto;
  background: var(--paper); color: var(--ink); border-radius: var(--r-l); border:1px solid var(--line);
  box-shadow: 0 40px 90px -30px rgba(14,31,27,.6); padding: clamp(24px,4vw,40px);
  animation: rise .45s var(--ease);
}
@keyframes fadeIn{ from{ opacity:0; } }
@keyframes rise{ from{ opacity:0; transform: translateY(18px) scale(.985); } }
.modal-close{ position:absolute; top:14px; right:14px; width:42px; height:42px; border-radius:50%; color: var(--ink-soft); font-size:24px; line-height:1; }
.modal-close:hover{ background: var(--mist); color: var(--pine); }
.modal .eyebrow{ --accent: var(--taupe-700); --dot: var(--taupe); color: var(--taupe-700) !important; }
.modal h2{ font-size: 32px; color: var(--pine); margin-top: 10px; }
.modal .intro{ margin-top: 10px; font-size:15.5px; color: var(--ink-soft); }
.form{ margin-top: 24px; display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.form .full{ grid-column: 1 / -1; }
@media (max-width: 520px){ .form{ grid-template-columns: 1fr; } }
.field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.field label{ font-size:13.5px; font-weight:600; color: var(--pine); }
.field input, .field select{
  font: inherit; font-size:16px; padding: 12px 14px; min-height:48px; border-radius: 10px;
  border:1px solid var(--line); background: #fff; color: var(--ink); width:100%;
}
.field input:focus, .field select:focus{ outline: 2px solid var(--taupe); outline-offset: 0; border-color: var(--taupe); }
.check{ display:flex; gap:10px; align-items:flex-start; font-size:14px; color: var(--ink-soft); line-height:1.55; }
.check input{ width:18px; height:18px; margin-top:2px; flex:none; accent-color: var(--pine); }
.form-error{ font-size:14px; color: #9A3B2E; min-height: 1em; }
.modal-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top: 6px; }
.btn-wa{ background: var(--pine); color: var(--cream); }
.btn-wa:hover{ background: var(--night); transform: translateY(-2px); }
.btn-wa svg{ width:18px; height:18px; }
.modal .alt-contact{ margin-top: 20px; padding-top: 18px; border-top:1px solid var(--line); font-size:14.5px; color: var(--ink-soft); display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; }
.copy-btn{ font-size:13.5px; font-weight:600; color: var(--pine); border:1px solid var(--line); border-radius:999px; padding:7px 14px; }
.copy-btn:hover{ border-color: var(--taupe); background: var(--mist); }
.modal .fine{ margin-top: 14px; font-size:13px; line-height:1.6; color: var(--ink-faint); }

/* ---------- chat assistant ---------- */
.wa-launch{
  position:fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index:80;
  display:flex; align-items:center; gap:10px; padding: 0 22px 0 16px; height:56px; border-radius:999px;
  background: var(--pine); color: var(--cream); box-shadow: 0 18px 40px -16px rgba(14,31,27,.7);
  border:1px solid rgba(192,172,147,.55); font-size:15px; font-weight:600;
  transition: transform .3s var(--ease), background .3s;
}
.wa-launch:hover{ transform: translateY(-2px); background: var(--night); }
.wa-launch svg{ width:24px; height:24px; color: var(--taupe); }
.wa-launch.is-open{ background: var(--night); }
@media (max-width: 560px){ .wa-launch .lbl{ display:none; } .wa-launch{ padding:0; width:58px; justify-content:center; } }
.wa-panel{
  position:fixed; right: max(18px, env(safe-area-inset-right)); bottom: calc(max(18px, env(safe-area-inset-bottom)) + 68px); z-index:81;
  width: min(390px, calc(100vw - 32px)); max-height: min(640px, calc(100dvh - 112px));
  display:flex; flex-direction:column; background: var(--paper); color: var(--ink); border-radius: var(--r-l); overflow:hidden;
  border:1px solid var(--line); box-shadow: 0 30px 70px -24px rgba(14,31,27,.55); animation: rise .35s var(--ease);
}
.wa-panel[hidden]{ display:none; }
.wa-head{ background: var(--pine); color: var(--cream); padding: 16px 18px; display:flex; align-items:center; gap:12px; }
.wa-head .av{ width:42px; height:42px; border-radius:50%; background: var(--paper); display:flex; align-items:center; justify-content:center; flex:none; }
.wa-head .av img{ width:24px; height:auto; }
.wa-head strong{ display:block; font-weight:600; font-size:15.5px; }
.wa-head span{ font-size:13px; color: rgba(243,241,234,.78); }
.wa-head button{ margin-left:auto; width:38px; height:38px; border-radius:50%; font-size:22px; color: var(--cream); flex:none; }
.wa-head button:hover{ background: rgba(255,255,255,.1); }
.wa-body{ flex:1; overflow-y:auto; padding: 16px; display:flex; flex-direction:column; gap:10px; background: var(--mist); }
.msg{ max-width: 88%; padding: 11px 14px; border-radius: 16px; font-size:14.5px; line-height:1.55; animation: rise .3s var(--ease); }
.msg.bot{ background: #fff; color: var(--ink); border:1px solid var(--line); border-top-left-radius: 4px; align-self:flex-start; }
.msg.me{ background: var(--pine); color: var(--cream); border-top-right-radius: 4px; align-self:flex-end; }
.msg a{ color: var(--taupe-700); text-decoration: underline; text-underline-offset: 2px; }
.msg .btn{ margin-top:10px; min-height:42px; padding: 9px 18px; font-size:14px; text-decoration:none; color: var(--cream); background: var(--pine); }
.msg .btn:hover{ background: var(--night); }
.msg .btn svg{ width:18px; height:18px; }
.typing{ display:inline-flex; gap:4px; padding: 4px 0; }
.typing i{ width:6px; height:6px; border-radius:50%; background: var(--taupe-700); opacity:.35; animation: blink 1s infinite; }
.typing i:nth-child(2){ animation-delay:.15s; } .typing i:nth-child(3){ animation-delay:.3s; }
@keyframes blink{ 50%{ opacity:1; } }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ font-size:13.5px; padding: 8px 14px; border-radius:999px; border:1px solid var(--taupe); color: var(--pine); background: var(--paper); transition: background .25s, color .25s, border-color .25s; }
.chip:hover{ background: var(--pine); color: var(--cream); border-color: var(--pine); }
.wa-foot{ border-top:1px solid var(--line); padding: 12px; display:flex; gap:8px; background: var(--paper); margin:0; }
.wa-foot input{ flex:1; min-width:0; font: inherit; font-size:16px; padding: 10px 16px; border-radius: 999px; border:1px solid var(--line); background:#fff; color: var(--ink); }
.wa-foot input:focus{ outline: 2px solid var(--taupe); outline-offset: 0; }
.wa-foot button{ width:46px; height:46px; flex:none; border-radius:50%; background: var(--pine); color: var(--cream); display:flex; align-items:center; justify-content:center; transition: background .25s; }
.wa-foot button:hover{ background: var(--night); }
.wa-foot button svg{ width:18px; height:18px; }
.wa-note{ font-size:12px; color: var(--ink-faint); padding: 0 14px 12px; background: var(--paper); margin:0; }

/* ---------- reveal (CSS fallback guarantees visibility without JS) ---------- */
@keyframes revealFallback{ to{ opacity:1; translate: 0 0; } }
.reveal{ opacity:0; translate: 0 18px; animation: revealFallback .9s var(--ease) 2s forwards; }
.js .reveal{ animation: none; transition: opacity .9s var(--ease) var(--rd,0ms), translate .9s var(--ease) var(--rd,0ms), background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease), transform .45s var(--ease), box-shadow .45s var(--ease); }
.js .reveal.is-in{ opacity:1; translate: 0 0; }

/* ============================================================
   Typography — original Navira font families and sizes, restored
============================================================ */
body{ font-family: var(--font-body); font-size: 16px; line-height: 1.6; }
h1,h2,h3,h4,h5{ font-family: var(--font-display); font-weight: 500; letter-spacing: -.01em; }
.eyebrow{ font-family: var(--font-mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
.kicker-block h1, .kicker-block h2{ font-size: clamp(30px, 4.2vw, 50px); line-height: 1.08; }
.lede{ font-size: clamp(16px, 1.5vw, 19px); }
.btn{ font-size:14px; letter-spacing:.02em; font-weight:600; }
.nav-brand .word{ font-family: var(--font-display); font-size: 18px; letter-spacing: .32em; font-weight:500; }
.nav-links a{ font-size: 13.5px; letter-spacing:.02em; }
.nav-cta{ font-size:13px !important; font-weight:600; }
.nav-toggle{ font-size:22px; }
@media (max-width: 1080px){
  .nav-links a{ font-size: 24px; font-family: var(--font-display); }
  .nav-cta{ font-family: var(--font-body) !important; font-size: 15px !important; }
}
.page-hero h1{ font-size: clamp(36px,5.6vw,64px); line-height:1.05; }
.crumb{ font-family: var(--font-mono); font-size:12px; letter-spacing:.05em; }
.hero h1{ font-size: clamp(40px, 7vw, 100px); line-height: 1.02; font-weight:500; letter-spacing:-.02em; }
.hero h1 .accent{ font-style: italic; font-weight:400; }
.hero-lede{ font-size: clamp(16px,1.45vw,19px); }
.hero-fineprint{ font-size:12.5px; line-height:1.6; }
.stat-strip .n{ font-family: var(--font-display); font-size: clamp(22px,2.3vw,30px); line-height:1.15; }
.stat-strip .l{ font-size:12.5px; }
.adv-item h3{ font-size: 21px; line-height:1.2; }
.adv-item p{ font-size: 14.5px; }
.teaser-card .tnum{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.06em; }
.teaser-card h3{ font-size: 22px; }
.teaser-card p{ font-size:14.5px; }
.teaser-card .go{ font-family:var(--font-mono); font-size:12px; letter-spacing:.05em; }
.thesis-card h3{ font-size: clamp(21px,2.1vw,25px); }
.thesis-card p{ font-size:15px; }
.thesis-card .node{ font-family: var(--font-mono); font-size:13px; }
.alloc-row h4{ font-size:17px; font-weight:700; font-family:var(--font-body); letter-spacing:0; }
.alloc-row p{ font-size:14.5px; }
.alloc-row .pct{ font-family:var(--font-mono); font-size:18px; }
.note-line{ font-size:13.5px; }
.process-dot{ font-family:var(--font-mono); font-size:14px; }
.process-step h4{ font-size:18px; }
.process-step p{ font-size:14px; }
.process-callout p{ font-size:14.5px; }
.monogram{ font-family:var(--font-display); font-size:22px; }
.team-top h3{ font-size: 23px; }
.team-top .role{ font-family: var(--font-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; }
.team-tags span{ font-size:12px; font-family: var(--font-mono); }
.team-card li{ font-size:14.5px; }
.gov-card .role{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; }
.gov-card h4{ font-size:18px; }
.gov-card p{ font-size:13.5px; }
.gov-statement{ font-size:15px; }
.trust-list li{ font-size:15px; }
.term-cell .k{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.term-cell .v{ font-family:var(--font-display); font-size:21px; line-height:1.2; }
.term-cell .d{ font-size:13.5px; }
.ppm-card p{ font-size:15px; }
.risk-flag{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em; }
.risk-h2{ font-size: clamp(24px, 2.6vw, 30px); }
.risk-item strong{ font-size:15.5px; }
.risk-item span{ font-size:14.5px; }
.notice-block h2{ font-size: clamp(22px, 2.4vw, 28px); }
.notice-list li{ font-size:14.5px; line-height:1.7; }
.notice-list li::before{ font-family: var(--font-mono); font-size:11.5px; }
.risk-banner{ font-size:14px; }
.contact-h{ font-size: clamp(36px,5vw,60px); line-height:1.05; }
.contact-lede{ font-size:16.5px; }
.contact-row .k{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.contact-row .v{ font-size:16px; }
.contact-row .person{ font-size:15px; }
.contact-row .person b{ font-weight:600; }
.ppm-access h2{ font-size: clamp(24px, 2.6vw, 32px); }
.ppm-access p{ font-size:15px; }
.ppm-access p.fine{ font-size:13px; }
.sel{ font-family: var(--font-mono); font-size:.95em; }
.doc-body h2{ font-size: 22px; }
.doc-body p{ font-size:15.5px; line-height:1.7; }
.doc-facts > div{ font-size:14.5px; }
.doc-facts .k{ font-family: var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.footer-logo .word{ font-family: var(--font-display); font-size: 22px; letter-spacing:.34em; }
.footer-id{ font-size:13.5px; }
.footer-id strong{ font-family: var(--font-display); font-weight:500; font-size:18px; }
.footer-id .mono{ font-family: var(--font-mono); font-size:12px; letter-spacing:.03em; }
.footer-cols h5{ font-family: var(--font-mono); font-weight:500; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.footer-cols a, .footer-cols button{ font-size:14px; }
.footer-contact p{ font-size:14px; }
.footer-contact .k{ font-family: var(--font-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; }
.footer-legal{ font-size:12.5px; line-height:1.7; }
.footer-bottom{ font-size:12px; font-family:var(--font-mono); }
.modal-close{ font-size:22px; line-height:1; }
.modal h2{ font-size: 28px; }
.modal .intro{ font-size:14.5px; }
.field label{ font-size:12.5px; font-weight:600; }
.field input, .field select{ font-size:15px; }
.check{ font-size:13px; line-height:1.55; }
.form-error{ font-size:13px; }
.modal .alt-contact{ font-size:13.5px; }
.copy-btn{ font-size:12.5px; font-weight:600; }
.modal .fine{ font-size:12px; line-height:1.6; }
.wa-launch{ font-size:14px; font-weight:600; }
.wa-head strong{ font-weight:600; font-size:15px; }
.wa-head span{ font-size:12px; }
.wa-head button{ font-size:20px; }
.msg{ font-size:14px; line-height:1.5; }
.msg .btn{ font-size:13px; }
.chip{ font-size:13px; }
.wa-foot input{ font-size:14px; }
.wa-note{ font-size:11px; }
.eyebrow::before{ width:7px; height:7px; }
.wa-launch .lbl, .chip, .msg{ font-family: var(--font-body); }
.thesis-card .node, .process-dot{ font-family: var(--font-mono); }

/* ============================================================
   Phone layout — classic, compact, calm
============================================================ */
@media (max-width: 600px){
  :root{ --nav-h: 66px; --gutter: 20px; }
  .nav-brand{ gap: 10px; }
  .nav-brand img{ width: 38px; height: 38px; padding: 7px 6px; }
  .nav-brand .word{ font-size: 16px; letter-spacing: .28em; }

  /* home hero: small mark on top, then a tidy text block */
  .hero{ min-height: 0; padding-top: calc(var(--nav-h) + 200px); padding-bottom: 40px; }
  .hero-fallback{ width: 150px; top: calc(var(--nav-h) + 22px); }
  .hero-veil{ background: linear-gradient(180deg, rgba(14,31,27,0) 0, rgba(14,31,27,0) calc(var(--nav-h) + 190px), rgba(14,31,27,.8) calc(var(--nav-h) + 250px), rgba(14,31,27,.94) 100%); }
  .hero h1{ font-size: 38px; line-height: 1.06; max-width: none; }
  .hero-lede{ margin-top: 18px; font-size: 15.5px; line-height: 1.65; }
  .hero .hero-actions, .section .hero-actions, .ppm-access .hero-actions{ display: grid; grid-template-columns: 1fr; gap: 10px; }
  .hero-actions .btn{ width: 100%; }
  .hero .hero-actions{ margin-top: 26px; }

  .stat-strip{ margin-top: 36px; grid-template-columns: 1fr 1fr; row-gap: 0; border-top: 1px solid var(--rule); }
  .stat-strip > div, .stat-strip > div + div{ padding: 16px 12px 16px 0; border-left: none; border-top: none; border-bottom: 1px solid var(--rule); }
  .stat-strip > div:nth-child(2n){ padding-left: 14px; border-left: 1px solid var(--rule); }
  .stat-strip > div::before, .stat-strip > div + div::before{ display: none; }
  .stat-strip .n{ font-size: 20px; }
  .stat-strip .l{ font-size: 12px; margin-top: 4px; }
  .hero-fineprint{ margin-top: 26px; font-size: 12px; }

  /* inner page heroes: no empty band above the title */
  .page-hero{ min-height: 0; padding: calc(var(--nav-h) + 44px) var(--gutter) 48px; justify-content: flex-start; }
  .page-hero.has-stage::after{ background: rgba(14,31,27,.78); }
  .page-hero h1{ font-size: 34px; margin-top: 14px; }
  .page-hero .lede{ margin-top: 14px; font-size: 15.5px; }

  /* sections and headings */
  .section{ padding-block: 56px; }
  .advantage{ padding-block: 56px; }
  .kicker-block{ gap: 12px; margin-bottom: 30px; }
  .kicker-block h1, .kicker-block h2{ font-size: 28px; }
  .lede{ font-size: 15.5px; }

  /* boxes: compact and evenly padded */
  .adv-item{ padding: 22px 20px; gap: 10px; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .adv-item .adv-icon{ width: 40px; height: 40px; }
  .adv-item h3{ font-size: 19px; flex: 1; min-width: 0; }
  .adv-item p{ flex-basis: 100%; }
  .teaser-card{ min-height: 0; padding: 22px 20px; gap: 10px; }
  .teaser-card .go{ padding-top: 12px; }
  .thesis-card{ padding: 22px 20px; gap: 12px; }
  .gov-card, .term-cell{ padding: 20px; }
  .team-card{ padding: 22px 20px; }
  .team-top{ gap: 14px; margin-bottom: 16px; }
  .monogram{ width: 54px; height: 64px; font-size: 19px; padding-bottom: 10px; }
  .team-top h3{ font-size: 21px; }
  .team-tags span{ font-size: 11px; padding: 5px 10px; }
  .ppm-card{ padding: 22px 20px; }
  .alloc-row{ grid-template-columns: 16px minmax(0,1fr) auto; gap: 12px; padding: 16px 0; }
  .alloc-row .pct{ font-size: 16px; }
  .donut-holder svg{ max-width: 230px; }
  .process-callout{ margin-top: 36px; padding: 18px; }
  .notice-block{ padding: 20px; }
  .notice-list li{ padding-left: 34px; }

  /* risk / contact / grievance top spacing */
  .risk, .contact{ padding-top: calc(var(--nav-h) + 32px) !important; }
  .risk h1, .doc h1{ font-size: 30px !important; }
  .contact{ min-height: 0; }
  .contact-h{ font-size: 34px; }
  .contact-lede{ font-size: 15.5px; }
  .contact-card{ padding: 20px; }

  /* footer */
  .site-footer{ padding: 52px var(--gutter) 96px; }
  .footer-top{ gap: 30px; }
  .footer-cols{ gap: 24px 18px; }
  .footer-bottom{ flex-direction: column; gap: 6px; }

  /* chat button: smaller and clear of content */
  .wa-launch{ width: 52px; height: 52px; }
  .wa-launch svg{ width: 22px; height: 22px; }
  .wa-panel{ right: 12px; left: 12px; width: auto; bottom: calc(max(18px, env(safe-area-inset-bottom)) + 62px); max-height: calc(100dvh - 100px); }
}
.hero h1{ max-width: none; }
.hero-title .ln{ white-space: nowrap; }
@media (max-width: 360px){ .hero h1{ font-size: 33px; } }

/* ============================================================
   Logo: light mark on dark backgrounds, original colours on light
============================================================ */
.nav-brand img{ width: auto; height: 36px; padding: 0; border-radius: 0; background: none; box-shadow: none; object-fit: contain; }
.nav-brand .logo-on-light{ display: none; }
.hero-light .nav .logo-on-dark, .nav.is-solid .logo-on-dark, body.menu-open .nav .logo-on-dark{ display: none; }
.hero-light .nav .logo-on-light, .nav.is-solid .logo-on-light, body.menu-open .nav .logo-on-light{ display: block; }
.footer-mark{ width: 48px; height: auto; flex: none; }
@media (max-width: 600px){ .nav-brand img{ height: 30px; } }

/* ============================================================
   Home hero without 3D: text left, fund figures panel right
============================================================ */
.hero{ background: radial-gradient(60% 80% at 85% 45%, rgba(44,74,66,.55), transparent 70%), var(--night); }
.hero-inner{ max-width: var(--max); margin: 0 auto; }
@media (min-width: 1000px){
  .hero-inner{ display: grid; grid-template-columns: minmax(0,1fr) 320px; column-gap: clamp(40px,5vw,88px); align-items: center; }
  .hero-inner > *{ grid-column: 1; }
  .hero h1{ font-size: clamp(40px, 6.2vw, 92px); }
  .hero .stat-strip{ grid-column: 2; grid-row: 1 / span 3; margin-top: 0; grid-template-columns: 1fr; border: 1px solid var(--rule); border-radius: var(--r-l); background: rgba(255,255,255,.035); padding: 8px 28px; }
  .hero .stat-strip > div, .hero .stat-strip > div + div{ padding: 22px 0; border-left: none; border-top: 1px solid var(--rule); }
  .hero .stat-strip > div:first-child{ border-top: none; }
  .hero .stat-strip > div::before{ display: none; }
  .hero-fineprint{ grid-column: 1 / -1; }
}
@media (max-width: 999px){ .hero{ padding-top: calc(var(--nav-h) + 56px); } .hero h1{ font-size: clamp(36px, 8vw, 72px); } }
@media (max-width: 600px){ .hero{ padding-top: calc(var(--nav-h) + 40px); } .hero h1{ font-size: 38px; } }

/* ---------- team intro ---------- */
.team-intro h2 em{ font-style: italic; font-weight: 400; color: var(--pine); }
.team-intro{ margin-bottom: clamp(32px,4vw,52px); }

/* ============================================================
   Official Navira logo (mark + wordmark) on its cream plate
============================================================ */
.logo-plate{ display:inline-flex; align-items:center; background: #F7F2E7; border-radius: 10px; padding: 8px 14px; box-shadow: 0 0 0 1px rgba(192,172,147,.45); }
.logo-plate img{ height: 34px; width: auto; display:block; }
.nav-brand .logo-plate img{ height: 34px; padding: 0; background: none; border-radius: 0; box-shadow: none; }
.nav.is-solid .logo-plate, .hero-light .nav .logo-plate, body.menu-open .nav .logo-plate{ box-shadow: none; background: transparent; padding-inline: 0; }
.footer-logo .logo-plate img{ height: 40px; }
@media (max-width: 600px){ .logo-plate{ padding: 6px 10px; } .nav-brand .logo-plate img{ height: 28px; } }

/* ============================================================
   Fund figures back in a row below the hero text
============================================================ */
@media (min-width: 1000px){
  .hero-inner{ display: block; }
  .hero .stat-strip{ margin-top: clamp(48px,6vw,72px); grid-template-columns: repeat(4,minmax(0,1fr)); border: none; border-top: 1px solid var(--rule); border-radius: 0; background: none; padding: 0; }
  .hero .stat-strip > div{ padding: 20px 22px 4px 0; border-top: none; }
  .hero .stat-strip > div + div{ padding-left: 22px; border-left: 1px solid var(--rule); border-top: none; }
  .hero .stat-strip > div::before{ display: block; }
  .hero .stat-strip > div + div::before{ left: -4px; }
  .hero h1{ font-size: clamp(40px, 7vw, 100px); }
}

/* ---------- email addresses: regular weight everywhere ---------- */
.sel{ font-weight: inherit; }

/* ---------- home: banner, then key facts as their own section ---------- */
.hero{ min-height: 82vh; min-height: 82svh; }
.key-facts{ background: var(--paper); padding-block: clamp(44px,5vw,64px); border-bottom: 1px solid var(--line); }
.key-facts .stat-strip{ margin-top: 0; opacity: 1; animation: none; }
.key-facts .stat-strip .n{ color: var(--pine); }
.key-facts .stat-strip .l{ color: var(--ink-soft); }
.key-facts .hero-fineprint{ opacity: 1; animation: none; color: var(--ink-soft); margin-top: clamp(28px,3.5vw,40px); }
.key-facts .hero-fineprint a{ color: var(--pine); }
@media (max-width: 600px){ .hero{ min-height: 0; padding-bottom: 56px; } }

/* ============================================================
   Admin (visible only to Owner / Editors inside the Claude viewer)
============================================================ */
.admin-bar{ position: fixed; left: max(16px, env(safe-area-inset-left)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 85;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; max-width: calc(100vw - 110px);
  padding: 8px 10px; border-radius: 14px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow-2); font-family: var(--font-body); font-size: 13.5px; }
.admin-bar-label{ font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--taupe-700); padding: 0 4px; }
.admin-bar button, .admin-bar a{ padding: 7px 12px; border-radius: 999px; border: 1px solid var(--line); font-weight: 600; font-size: 13px; color: var(--pine); background: #fff; }
.admin-bar .ab-edit, .admin-bar .ab-save{ background: var(--pine); color: var(--cream); border-color: var(--pine); }
.admin-bar button:hover, .admin-bar a:hover{ border-color: var(--taupe); }
.admin-bar button:disabled{ opacity: .6; }
.ab-status{ color: var(--ink-soft); font-size: 12.5px; padding: 0 4px; }
.ab-status:empty{ display: none; }
body.is-editing #main [contenteditable]{ outline: 1px dashed rgba(192,172,147,.9); outline-offset: 3px; border-radius: 3px; cursor: text; }
body.is-editing #main [contenteditable]:hover{ outline-style: solid; }
body.is-editing #main [contenteditable]:focus{ outline: 2px solid var(--taupe); background: rgba(192,172,147,.12); }
body.is-editing .reveal{ opacity: 1 !important; translate: none !important; }

.admin-panel{ position: fixed; inset: 0; z-index: 95; background: var(--mist); color: var(--ink); overflow-y: auto; padding: max(20px, env(safe-area-inset-top)) var(--gutter) 60px; font-family: var(--font-body); }
.admin-panel[hidden]{ display: none; }
.ap-head{ max-width: 1040px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.ap-head h2{ font-size: clamp(28px,3.4vw,40px); color: var(--pine); margin-top: 8px; }
.ap-close{ width: 44px; height: 44px; border-radius: 50%; font-size: 26px; color: var(--ink-soft); border: 1px solid var(--line); background: var(--paper); }
.ap-tabs{ max-width: 1040px; margin: 18px auto 0; display: flex; gap: 6px; }
.ap-tabs button{ padding: 10px 18px; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--ink-soft); border: 1px solid transparent; }
.ap-tabs button[aria-selected="true"]{ background: var(--pine); color: var(--cream); }
.ap-count{ display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 999px; background: var(--taupe); color: var(--night); font-size: 12px; line-height: 20px; text-align: center; }
.ap-count:empty{ display: none; }
.ap-body{ max-width: 1040px; margin: 22px auto 0; }
.ap-tools{ display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.ap-filters{ display: flex; flex-wrap: wrap; gap: 6px; }
.ap-filters button{ padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.ap-filters button.is-on{ border-color: var(--pine); color: var(--pine); box-shadow: inset 0 0 0 1px var(--pine); }
.ap-export{ min-height: 40px; padding: 8px 18px; font-size: 13px; }
.ap-list{ display: grid; gap: 12px; }
.ap-item{ background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-m); padding: 18px 20px; display: grid; gap: 12px; }
.ap-item.is-done{ opacity: .65; }
.ap-item-head{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.ap-pill{ font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.ap-pill.ap-ppm{ background: var(--pine); color: var(--cream); }
.ap-pill.ap-chat{ background: var(--taupe-200); color: var(--taupe-700); }
.ap-meta{ font-size: 13px; color: var(--ink-faint); }
.ap-item dl{ margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 10px 20px; }
.ap-item dt{ font-size: 12px; color: var(--ink-faint); }
.ap-item dd{ margin: 2px 0 0; font-size: 15px; color: var(--ink); overflow-wrap: anywhere; }
.ap-msg{ font-size: 15px; color: var(--ink); white-space: pre-wrap; overflow-wrap: anywhere; }
.ap-actions{ display: flex; gap: 8px; flex-wrap: wrap; }
.ap-actions button, .ap-edit button{ padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); font-size: 13px; font-weight: 600; color: var(--pine); background: #fff; }
.ap-actions .ap-del{ color: #9A3B2E; }
.ap-empty{ padding: 40px 20px; text-align: center; color: var(--ink-soft); background: var(--paper); border: 1px dashed var(--line); border-radius: var(--r-m); }
.ap-help{ color: var(--ink-soft); margin-bottom: 18px; max-width: 70ch; }
.ap-pages{ display: grid; gap: 12px; }
.ap-page{ background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-m); padding: 16px 20px; display: grid; gap: 10px; }
.ap-page-head{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.ap-page-head h3{ font-size: 20px; color: var(--pine); }
.ap-page-head .btn{ margin-left: auto; min-height: 38px; padding: 7px 16px; font-size: 13px; }
.ap-edit{ display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; gap: 12px; align-items: start; padding-top: 10px; border-top: 1px solid var(--line); font-size: 14px; }
.ap-edit span{ display: block; font-size: 11.5px; color: var(--ink-faint); margin-bottom: 2px; }
.ap-from{ color: var(--ink-faint); text-decoration: line-through; overflow-wrap: anywhere; }
.ap-to{ color: var(--ink); overflow-wrap: anywhere; }
@media (max-width: 600px){
  .ap-edit{ grid-template-columns: 1fr; }
  .admin-bar{ bottom: calc(max(16px, env(safe-area-inset-bottom)) + 64px); max-width: calc(100vw - 32px); }
}

/* ---------- home hero 3D (desktop only) ---------- */
.hero .hero-stage{ z-index: 0; }
.hero .hero-inner{ position: relative; z-index: 2; }
@media (max-width: 999px){ .hero .hero-stage{ display: none; } }

/* ---------- home banner: 3D Navira logo render ---------- */
.hero-visual{ position: absolute; z-index: 1; right: max(2vw, calc((100vw - var(--max)) / 2 - 40px)); top: 52%; width: min(31vw, 470px);
  transform: translate(calc(var(--mx, 0) * -14px), calc(-50% + var(--my, 0) * -10px)); transition: transform .6s var(--ease); pointer-events: none; }
.hero-visual .hv-bg{ display: block; }
.hero-visual .hv-bg img{ width: 100%; height: auto; display: block;
  -webkit-mask-image: radial-gradient(closest-side, #000 62%, rgba(0,0,0,.6) 80%, transparent 100%);
          mask-image: radial-gradient(closest-side, #000 62%, rgba(0,0,0,.6) 80%, transparent 100%);
  opacity: 0; animation: visualIn 1.4s var(--ease) .35s forwards; }
/* 3D logo: stacked layers give it depth, the stack turns continuously in place */
.hero-visual .hv-stage{ position: absolute; inset: 0; perspective: 1400px; opacity: 0;
  animation: visualIn 1.4s var(--ease) .35s forwards, floatY 7s ease-in-out 1.8s infinite; }
.hero-visual .hv-spin{ position: absolute; inset: 0; transform-style: preserve-3d; transform-origin: 45.2% 50%;
  animation: logoSpin 14s linear infinite; will-change: transform; }
.hero-visual .hv-spin img{ position: absolute; inset: 0; width: 100%; height: auto; display: block;
  transform: translateZ(var(--z, 0)); filter: drop-shadow(0 14px 22px rgba(0,0,0,.28)); }
.hero-visual .hv-spin img:not(:first-child):not(:last-child){ filter: none; }
@keyframes logoSpin{ from{ transform: rotateY(0deg); } to{ transform: rotateY(360deg); } }
@keyframes visualIn{ from{ opacity: 0; transform: scale(.94); } to{ opacity: 1; transform: none; } }
@keyframes floatY{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-10px); } }
@media (min-width: 1000px){ .hero h1{ font-size: clamp(40px, 5.6vw, 88px); } .hero-lede{ max-width: 44ch; } }
@media (max-width: 999px){
  .hero-visual{ position: relative; right: auto; top: auto; transform: none; width: min(300px, 70vw); margin: 0 auto 8px; }
}
@media (max-width: 600px){ .hero-visual{ width: 220px; margin-bottom: 0; } }
@media (prefers-reduced-motion: reduce){ .hero-visual .hv-bg img, .hero-visual .hv-stage{ opacity: 1; animation: none; } .hero-visual .hv-spin{ animation: none; } }
