/* Fonts are served locally; licenses are included in assets/fonts/. */
@font-face { font-family: "Cormorant Garamond"; src: url("assets/fonts/cormorant-garamond-medium.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("assets/fonts/cormorant-garamond-medium-italic.ttf") format("truetype"); font-style: italic; font-weight: 500; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("assets/fonts/source-sans-3-regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("assets/fonts/source-sans-3-semibold.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("assets/fonts/ibm-plex-mono-medium.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  --ink: #0a1628;
  --ink-soft: #394352;
  --paper: #f5f0e6;
  --field: #ede4ce;
  --gold: #956516;
  --gold-bright: #f5c54a;
  --muted: #62666a;
  --rule: rgb(10 22 40 / 20%);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Source Sans 3", "Helvetica Neue", sans-serif;
  --mono: "IBM Plex Mono", monospace;
  --gutter: 2.5rem;
  --header-offset: 7rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-offset); scrollbar-gutter: stable; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font: 1rem/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ul, dl, dd { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 500; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 5px; }
::selection { background: var(--gold-bright); color: var(--ink); }
.container { width: 100%; max-width: 110rem; margin-inline: auto; padding-inline: var(--gutter); }
.eyebrow { color: var(--muted); font: 500 .75rem/1.6 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 100; padding: .75rem 1rem; background: var(--ink); color: var(--paper); transform: translateY(-200%); }
.skip-link:focus { transform: none; }

/* Navigation remains readable with or without JavaScript. */
.site-header { position: sticky; top: 0; z-index: 20; background: rgb(245 240 230 / 96%); border-bottom: 1px solid rgb(10 22 40 / 12%); backdrop-filter: blur(10px); }
.navigation { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 5.5rem; padding-block: 1.25rem; }
.brand { flex-shrink: 0; }
.brand img { width: 13.3rem; height: auto; }
.navigation-links { display: flex; align-items: center; gap: 2rem; padding: 0; list-style: none; }
.navigation-links a { display: inline-flex; align-items: center; min-height: 2.75rem; font-size: .875rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.navigation-links a:hover { text-decoration: underline; text-underline-offset: .3em; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 2.875rem; padding: .7rem 1.125rem; border: 1px solid transparent; border-radius: 2px; font-size: .875rem; font-weight: 600; letter-spacing: .055em; text-transform: uppercase; text-decoration: none; transition: background .2s, border-color .2s, transform .2s; }
.button-primary { color: var(--paper); background: var(--ink); }
.button-primary:hover { background: #1d2a40; transform: translateY(-1px); }
.button-outline { border-color: var(--rule); }
.button-outline:hover { border-color: var(--ink); background: rgb(10 22 40 / 3%); }
.menu-toggle { display: none; }

/* Hero: original typography and power-line artwork. */
.hero { position: relative; isolation: isolate; min-height: calc(100svh - 5.5rem); padding-top: 7rem; padding-bottom: 10rem; background: radial-gradient(ellipse at 15% 8%, rgb(200 147 42 / 4%), transparent 70%); }
.hero-content { position: relative; z-index: 1; }
.hero h1 { margin-top: 2.25rem; font-size: clamp(2.5rem, 6.6vw, 6rem); letter-spacing: -.015em; line-height: 1.02; }
.hero h1 > span { display: block; }
.power { color: #a77319; font-style: normal; text-shadow: 0 0 2.5rem rgb(245 197 74 / 25%); }
.hero-description { max-width: 38.75rem; margin-top: 2.625rem; font-size: 1.1875rem; line-height: 1.55; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.625rem; }
.hero-art { position: absolute; z-index: 0; width: clamp(32.5rem, calc(62% - 3.1rem), 61.25rem); right: 0; bottom: 2.5rem; opacity: .82; mix-blend-mode: multiply; pointer-events: none; }

/* Graph-paper field and the three-part investment strategy. */
.approach { padding-block: 7.5rem 11.25rem; background-color: var(--field); background-image: linear-gradient(rgb(10 22 40 / 4%) 1px, transparent 1px), linear-gradient(90deg, rgb(10 22 40 / 4%) 1px, transparent 1px); background-size: 2.5rem 2.5rem; }
.approach-introduction { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 2.5rem; margin-bottom: 7.5rem; }
.bolt { width: clamp(2.5rem, 4vw, 4rem); fill: #c8932a; }
.approach-introduction p { max-width: 90rem; font: 500 clamp(2.25rem, 4.2vw, 4rem)/1.05 var(--serif); letter-spacing: -.012em; }
.challenges { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-block: 1px solid var(--ink); }
.challenge { padding: 3rem 2rem; }
.challenge + .challenge { border-left: 1px solid var(--rule); }
.accent-label { color: var(--gold); }
.accent-label::before { content: ""; display: inline-block; width: .375rem; height: .375rem; margin-right: .625rem; vertical-align: .12em; border-radius: 50%; background: currentColor; }
.challenge h3 { margin-block: 1.125rem .875rem; font-size: clamp(1.5rem, 2.5vw, 2.125rem); line-height: 1.12; letter-spacing: -.008em; }
.challenge > p:last-child { color: var(--ink-soft); }
.strategy { display: grid; grid-template-columns: minmax(17.5rem, 26.25rem) minmax(0, 1fr); align-items: start; gap: 6.25rem; margin-top: 10rem; }
.strategy-overview { position: sticky; top: calc(var(--header-offset) + 1rem); }
.strategy-overview h2 { max-width: 22.5rem; margin-top: 1.25rem; font-size: clamp(1.875rem, 3.4vw, 2.75rem); font-style: italic; line-height: 1.08; letter-spacing: -.01em; }
.circuit { display: block; width: 100%; max-width: 22.5rem; margin-top: 2.25rem; }
.circuit-wires { fill: none; stroke: rgb(149 101 22 / 45%); stroke-width: 1.5; stroke-dasharray: 3 3; }
.circuit-nodes { fill: var(--field); stroke: var(--ink); stroke-width: 1.5; }
.circuit-nodes circle { transition: fill .3s, stroke .3s; }
.circuit-nodes .is-active { fill: var(--gold-bright); stroke: var(--gold); }
.circuit-labels { fill: var(--muted); font: 500 12px var(--mono); text-transform: uppercase; }
.claim { display: flex; flex-direction: column; justify-content: center; min-height: 55vh; margin-bottom: 11.25rem; }
.claim:last-child { min-height: auto; margin-bottom: 0; }
.claim h3 { max-width: 48.75rem; margin-block: 1.75rem; font-size: clamp(2rem, 4.2vw, 4rem); line-height: 1.05; letter-spacing: -.012em; }
.claim > p:last-child { max-width: 40rem; color: var(--ink-soft); font-size: 1.125rem; }

/* Investment criteria. */
.criteria { color: var(--paper); background: var(--ink); }
.criteria-banner { position: relative; isolation: isolate; display: flex; justify-content: center; align-items: end; min-height: 35rem; padding: 5rem var(--gutter) 4.5rem; text-align: center; }
.criteria-banner > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 65%; opacity: .9; }
.criteria-banner::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(transparent 0%, rgb(10 22 40 / 10%) 35%, rgb(10 22 40 / 58%) 65%, rgb(10 22 40 / 95%) 90%, var(--ink)); }
.criteria-heading .eyebrow { color: var(--gold-bright); margin-bottom: 1.25rem; }
.criteria-heading h2 { font-size: clamp(2.375rem, 5vw, 4.75rem); line-height: 1.02; letter-spacing: -.012em; text-shadow: 0 2px 1.5rem rgb(10 22 40 / 60%); }
.investment-size { padding-top: 8.75rem; padding-bottom: 5rem; text-align: center; }
.investment-size .eyebrow { color: #b9bbc0; margin-bottom: 1.375rem; }
.investment-value { color: var(--gold-bright); font: 500 clamp(2.25rem, 5.5vw, 5.5rem)/1.1 var(--serif); letter-spacing: -.02em; text-shadow: 0 0 3rem rgb(245 197 74 / 20%); }
.investment-description { max-width: 36.25rem; margin: 1.75rem auto 0; color: #c5c4c1; }
.investment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5rem; max-width: calc(68.75rem + 2 * var(--gutter)); padding-top: 3.75rem; padding-bottom: 5rem; }
.investment-grid .eyebrow { color: var(--gold-bright); margin-bottom: 1.125rem; }
.criterion-value { margin-bottom: .875rem; font: 500 clamp(1.625rem, 2.8vw, 2.25rem)/1.1 var(--serif); letter-spacing: -.01em; }
.investment-grid dd > p:last-child { color: #c5c4c1; }

/* Contact and footer. */
.contact { padding-top: 5.5rem; padding-bottom: 4rem; text-align: center; }
.contact-mark { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: 1.75rem; }
.contact-mark::before, .contact-mark::after { content: ""; width: 6.25rem; height: 1px; background: rgb(200 147 42 / 45%); }
.contact-mark svg { width: 2.5rem; height: 3.75rem; fill: #c8932a; }
.contact h2 { font-size: clamp(3rem, 6.8vw, 6.5rem); line-height: 1.02; letter-spacing: -.015em; }
.contact h2 em { color: var(--gold); }
.contact-email { display: inline-block; max-width: 100%; overflow-wrap: anywhere; margin-top: 2.5rem; padding-bottom: .25rem; border-bottom: 1px solid var(--rule); font-size: 1.375rem; text-decoration: none; }
.contact-email:hover { border-color: var(--ink); }
.site-footer { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; margin-top: 2.5rem; padding-block: 1.375rem; border-top: 1px solid rgb(10 22 40 / 12%); color: var(--muted); font: 500 .75rem/1.6 var(--mono); letter-spacing: .08em; text-transform: uppercase; }

@media (max-width: 68.75rem) {
  .strategy { grid-template-columns: minmax(15rem, 30%) minmax(0, 1fr); gap: 3.5rem; }
  .challenge { padding-inline: 1.5rem; }
  .approach-introduction { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 5rem; }
  .bolt { width: 2.5rem; height: 5rem; }
}
@media (max-width: 56.25rem) {
  :root { --gutter: 1.5rem; --header-offset: 6rem; }
  .navigation { gap: 1rem; flex-wrap: wrap; min-height: 5rem; padding-block: 1rem; }
  .brand img { width: 10rem; }
  .navigation-links { width: 100%; justify-content: flex-start; flex-wrap: wrap; gap: .75rem 1.5rem; }
  .navigation.is-enhanced .navigation-links { display: none; }
  .navigation.is-enhanced .navigation-links.is-open { display: flex; }
  .menu-toggle { display: inline-flex; align-items: center; gap: .625rem; min-height: 2.75rem; padding: .5rem .75rem; color: var(--ink); background: transparent; border: 1px solid var(--rule); border-radius: 2px; font-size: .875rem; font-weight: 600; }
  .menu-icon { display: block; width: 1rem; height: .625rem; border-block: 1px solid currentColor; }
  .menu-toggle[aria-expanded="true"] .menu-icon { height: 0; border-bottom: 0; }
  .hero { min-height: auto; padding-top: 5rem; padding-bottom: 6.25rem; }
  .hero h1 { font-size: clamp(2.375rem, 10vw, 4.5rem); }
  .hero-art { display: none; }
  .approach { padding-block: 6.875rem; }
  .challenges { grid-template-columns: 1fr; }
  .challenge { padding: 2.5rem 0; }
  .challenge + .challenge { border-left: 0; border-top: 1px solid var(--rule); }
  .challenge h3 { font-size: 2rem; }
  .strategy { grid-template-columns: 1fr; gap: 3.5rem; margin-top: 6rem; }
  .strategy-overview { position: static; }
  .strategy-overview h2 { max-width: 30rem; font-size: 2.75rem; }
  .circuit { display: none; }
  .claim { min-height: auto; margin-bottom: 5rem; }
  .claim h3 { font-size: clamp(2.25rem, 6vw, 3.5rem); }
  .criteria-banner { min-height: 22.5rem; padding-block: 3.75rem; }
  .investment-size { padding-block: 5rem 3.75rem; }
  .investment-grid { gap: 3rem; padding-block: 2.5rem 3rem; }
  .contact { padding-block: 4rem 3rem; }
  .site-footer { flex-wrap: wrap; }
}
@media (max-width: 37.5rem) {
  .navigation-links { align-items: stretch; flex-direction: column; gap: .25rem; padding-block: .5rem; }
  .navigation-links .button { margin-top: .5rem; }
  .hero .eyebrow { max-width: 25rem; }
  .hero h1 > span { display: inline; }
  .hero h1 > span + span::before { content: " "; }
  .hero-actions { gap: .75rem; }
  .hero-actions .button { width: 100%; }
  .approach-introduction p { font-size: 2.25rem; line-height: 1.1; }
  .investment-grid { grid-template-columns: 1fr; }
  .investment-value { font-size: clamp(2rem, 8.6vw, 3.25rem); }
  .contact h2 { font-size: clamp(2.6rem, 10vw, 3.75rem); }
  .contact h2 em { display: block; }
  .site-footer { flex-direction: column; align-items: flex-start; gap: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media print {
  .site-header { position: static; }
  .menu-toggle, .hero-actions, .circuit, .hero-art, .skip-link { display: none !important; }
  .hero, .approach, .contact { min-height: 0; padding-block: 2rem; }
  .strategy { display: block; margin-top: 2rem; }
  .strategy-overview { position: static; }
  .claim { min-height: 0; margin-block: 2rem; break-inside: avoid; }
  .criteria, .investment-grid dd > p:last-child, .investment-description { color: var(--ink); background: white; }
  .criteria-banner { min-height: 0; padding-block: 2rem; }
  .criteria-banner > img, .criteria-banner::after { display: none; }
  .criteria-heading h2 { text-shadow: none; }
  .investment-size, .investment-grid { padding-block: 2rem; }
}

/* Team and Careers share the original site palette and typography. */
.navigation-links a[aria-current="page"] { color: var(--gold); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .45em; }
.inner-page { display: flex; flex-direction: column; min-height: 100svh; }
.inner-page main { flex: 1; }
.page-introduction, .team-members, .career-opportunities { max-width: 82.5rem; }
.page-introduction { padding-top: 6rem; padding-bottom: 4.5rem; }
.page-introduction h1 { margin-top: 1.5rem; font-size: clamp(3.5rem, 7vw, 6rem); letter-spacing: -.015em; line-height: 1.05; }
.page-introduction h1 em { color: var(--gold); font-weight: 500; }
.page-description { max-width: 40rem; margin-top: 1.75rem; color: var(--ink-soft); font-size: 1.25rem; line-height: 1.55; }
.team-member { display: grid; grid-template-columns: minmax(14rem, 30%) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); padding-block: 3.75rem; border-top: 1px solid var(--rule); }
.member-number { margin-bottom: 1rem; color: var(--gold); }
.member-identity h2 { font-size: clamp(2.25rem, 3.5vw, 3.25rem); line-height: 1.1; letter-spacing: -.015em; }
.member-role { margin-top: .75rem; color: var(--gold); font-size: .875rem; font-weight: 600; letter-spacing: .065em; text-transform: uppercase; }
.member-biography { max-width: 45rem; }
.member-introduction { font-size: 1.1875rem; line-height: 1.65; }
.full-biography { margin-top: 1.25rem; }
.full-biography summary { display: flex; align-items: center; gap: 1.25rem; width: fit-content; min-height: 2.75rem; padding-block: .5rem; color: var(--ink); font-size: .875rem; font-weight: 600; letter-spacing: .045em; text-transform: uppercase; list-style: none; cursor: pointer; }
.full-biography summary::-webkit-details-marker { display: none; }
.full-biography summary:hover { color: var(--gold); }
.bio-toggle-icon::before { content: "+"; font-size: 1.25rem; line-height: 1; }
.full-biography[open] .bio-toggle-icon::before { content: "−"; }
.bio-open-label, .full-biography[open] .bio-closed-label { display: none; }
.full-biography[open] .bio-open-label { display: inline; }
.biography-body { padding-top: 1.25rem; color: var(--ink-soft); font-size: 1.0625rem; line-height: 1.75; }
.biography-body p + p { margin-top: 1.25rem; }
.career-opportunities { padding-bottom: 2rem; }
.careers-status { padding: clamp(2rem, 5vw, 4.5rem); border-top: 3px solid var(--gold-bright); color: var(--paper); background: var(--ink); }
.careers-status .eyebrow { color: var(--gold-bright); }
.careers-status h2 { margin-top: 1.25rem; max-width: 45rem; font-size: clamp(2.25rem, 4.5vw, 4rem); line-height: 1.08; letter-spacing: -.012em; }
.careers-status > p:last-child { margin-top: 1.5rem; color: #c5c4c1; font-size: 1.125rem; }
.inner-page .site-footer { margin-top: 3rem; }

@media (min-width: 56.251rem) and (max-width: 68.75rem) {
  .navigation-links { gap: 1.125rem; }
  .brand img { width: 11.5rem; }
}
@media (max-width: 56.25rem) {
  .page-introduction { padding-top: 4rem; padding-bottom: 3rem; }
  .team-member { grid-template-columns: 1fr; gap: 1.75rem; padding-block: 2.75rem; }
  .member-identity h2 { font-size: 2.75rem; }
  .member-biography { max-width: none; }
  .member-number { margin-bottom: .75rem; }
}
@media (max-width: 37.5rem) {
  .page-introduction h1 { font-size: clamp(3rem, 12vw, 4rem); }
  .page-description { font-size: 1.125rem; }
  .member-introduction { font-size: 1.125rem; }
  .careers-status { padding: 2rem 1.5rem; }
}
@media print {
  .page-introduction, .team-member { padding-block: 1.5rem; }
  .team-member { display: block; }
  .member-biography { max-width: none; margin-top: 1rem; }
  .careers-status { color: var(--ink); background: white; border: 1px solid var(--rule); }
  .careers-status > p:last-child { color: var(--ink); }
}