:root {
  --ink: #0c1715;
  --muted: #5f6b67;
  --paper: #f4f1e9;
  --paper-2: #ebe7dc;
  --panel: #e5e1d6;
  --forest: #0d302b;
  --forest-2: #17483f;
  --mint: #8db29b;
  --acid: #c8f052;
  --blue: #8dbbd0;
  --coral: #df8b77;
  --lavender: #b4a9c8;
  --white: #ffffff;
  --line: rgba(12, 23, 21, .16);
  --line-dark: rgba(255,255,255,.18);
  --radius: 28px;
  --max: 1220px;
  --sans: "Instrument Sans", "Aptos", "Segoe UI", Arial, sans-serif;
  --serif: "Newsreader", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
  overflow-x: hidden;
}
body.locked { overflow: hidden; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
button, input, select { font: inherit; }
button { color: inherit; }
::selection { background: var(--acid); color: var(--ink); }

.skip-link {
  position: absolute; left: 10px; top: -70px; z-index: 9999;
  background: var(--acid); color: var(--ink); padding: 10px 14px; border-radius: 8px;
}
.skip-link:focus { top: 10px; }

.site-header {
  position: sticky; top: 0; z-index: 1000;
  backdrop-filter: blur(18px);
  background: color-mix(in srgb, var(--paper) 86%, transparent);
  border-bottom: 1px solid transparent;
  transition: border-color .25s ease, background .25s ease;
}
.site-header.scrolled { border-bottom-color: var(--line); }
.nav-wrap {
  max-width: var(--max); margin: 0 auto; padding: 14px 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; min-width: 0; }
.brand-mark { width: 40px; height: 40px; flex: 0 0 40px; }
.brand-copy { display: grid; line-height: 1.05; }
.brand-copy strong { font-size: 15px; letter-spacing: .08em; text-transform: uppercase; }
.brand-copy span { font-size: 11px; color: var(--muted); letter-spacing: .06em; margin-top: 4px; }
.nav-links { display: flex; align-items: center; gap: 22px; }
.nav-links a { text-decoration: none; font-size: 14px; color: #26332f; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--forest-2); }
.nav-links .cv-link { border: 1px solid var(--line); border-radius: 999px; padding: 9px 14px; }
.menu-button { display: none; border: 0; background: transparent; padding: 10px; border-radius: 50%; }
.menu-button svg { width: 24px; height: 24px; }

.container { max-width: var(--max); margin: 0 auto; padding: 0 28px; }
.section { padding: 110px 0; }
.section.compact { padding: 72px 0; }
.eyebrow { text-transform: uppercase; font-size: 12px; letter-spacing: .18em; color: var(--forest-2); font-weight: 700; }
.kicker { font-size: 14px; color: var(--muted); }
h1, h2, h3, h4 { line-height: 1.05; margin: 0; letter-spacing: -.035em; }
h1 { font-size: clamp(4rem, 9vw, 8.3rem); font-weight: 520; }
h2 { font-size: clamp(2.5rem, 5.4vw, 5.5rem); font-weight: 520; }
h3 { font-size: clamp(1.5rem, 2.4vw, 2.35rem); font-weight: 540; }
p { margin: 0; }
.serif { font-family: var(--serif); font-weight: 450; }
.lede { font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.4; max-width: 830px; color: #283430; }
.muted { color: var(--muted); }
.rule { border-top: 1px solid var(--line); }

.hero {
  min-height: 760px;
  display: grid; align-items: center;
  position: relative; overflow: hidden;
  background:
    radial-gradient(circle at 75% 30%, rgba(200,240,82,.17), transparent 24%),
    radial-gradient(circle at 83% 67%, rgba(141,178,155,.12), transparent 30%),
    var(--paper);
}
.hero-inner { max-width: var(--max); width: 100%; margin: 0 auto; padding: 94px 28px 88px; position: relative; z-index: 2; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr); align-items: center; gap: 42px; }
.hero-copy h1 span { display: block; }
.hero-copy .first { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: .44em; letter-spacing: -.02em; margin-bottom: 12px; }
.hero-copy .roles { margin-top: 30px; display: grid; gap: 3px; color: var(--muted); font-size: 15px; }
.hero-copy .tagline { margin-top: 36px; font-size: clamp(1.25rem, 2.15vw, 1.9rem); max-width: 740px; line-height: 1.35; }
.hero-copy .discipline-line { margin-top: 30px; display: flex; gap: 10px; flex-wrap: wrap; }
.pill { border: 1px solid var(--line); padding: 9px 12px; border-radius: 999px; font-size: 12px; letter-spacing: .04em; background: rgba(255,255,255,.28); }
.hero-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; text-decoration: none; border-radius: 999px; padding: 13px 18px; border: 1px solid var(--line); font-size: 14px; transition: transform .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn.primary { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn.primary:hover { background: var(--forest-2); }
.btn.acid { background: var(--acid); border-color: var(--acid); color: var(--ink); }

.hero-system { position: relative; min-height: 560px; }
.hero-system svg { width: 100%; height: 100%; min-height: 560px; overflow: visible; }
.network-line { stroke: rgba(13,48,43,.28); stroke-width: 1.3; }
.network-node { fill: var(--forest); cursor: pointer; transition: r .2s ease, fill .2s ease, opacity .2s ease; }
.network-node.soft { fill: var(--mint); }
.network-node.acid { fill: var(--acid); }
.network-node:hover, .network-node.active { r: 13; fill: var(--acid); }
.network-label { font-family: var(--sans); font-size: 12px; fill: var(--ink); pointer-events: none; }
.hero-system .orbit { fill: none; stroke: rgba(13,48,43,.14); stroke-width: 1; }
.system-tooltip {
  position: absolute; min-width: 190px; max-width: 250px; padding: 12px 14px; border-radius: 14px;
  background: rgba(12,23,21,.93); color: var(--paper); font-size: 12px; line-height: 1.45;
  opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity .15s ease, transform .15s ease;
}
.system-tooltip.visible { opacity: 1; transform: translateY(0); }

.logo-stage { position: absolute; right: 22px; top: 22px; width: 110px; opacity: .18; }
.logo-stage .logo-edge, .logo-stage .logo-arc { stroke-dasharray: 140; stroke-dashoffset: 140; animation: drawLogo .75s ease forwards; }
.logo-stage .logo-node { transform-box: fill-box; transform-origin: center; transform: scale(0); animation: popLogo .34s ease forwards; }
.logo-stage .n1 { animation-delay: .08s; }.logo-stage .n2 { animation-delay: .15s; }.logo-stage .n3 { animation-delay: .22s; }.logo-stage .n4 { animation-delay: .29s; }.logo-stage .n5 { animation-delay: .36s; }.logo-stage .n6 { animation-delay: .43s; }
.logo-stage .e1 { animation-delay: .28s; }.logo-stage .e2 { animation-delay: .34s; }.logo-stage .e3 { animation-delay: .40s; }.logo-stage .e4 { animation-delay: .46s; }.logo-stage .e5 { animation-delay: .52s; }.logo-stage .logo-arc { animation-delay: .60s; }
@keyframes popLogo { to { transform: scale(1); } }
@keyframes drawLogo { to { stroke-dashoffset: 0; } }

.statement-band { background: var(--forest); color: var(--paper); position: relative; overflow: hidden; }
.statement-band .container { padding-top: 120px; padding-bottom: 120px; }
.statement-band .eyebrow { color: var(--acid); }
.statement-band h2 { max-width: 1050px; }
.statement-band p { color: rgba(244,241,233,.72); max-width: 760px; margin-top: 30px; }
.statement-band::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 90% 10%, rgba(200,240,82,.14), transparent 28%); pointer-events: none; }

.research-flow { margin-top: 70px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 52px; align-items: stretch; }
.research-list { display: grid; gap: 12px; }
.research-tab { text-align: left; border: 1px solid var(--line); background: transparent; border-radius: 18px; padding: 20px 22px; cursor: pointer; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.research-tab strong { display: block; font-size: 20px; }
.research-tab span { display: block; color: var(--muted); font-size: 13px; margin-top: 3px; }
.research-tab:hover { transform: translateX(4px); }
.research-tab.active { background: var(--forest); color: var(--paper); border-color: var(--forest); }
.research-tab.active span { color: rgba(244,241,233,.65); }
.research-canvas { min-height: 440px; border-radius: var(--radius); background: var(--paper-2); position: relative; overflow: hidden; border: 1px solid var(--line); }
.research-canvas svg { width: 100%; height: 100%; min-height: 440px; }
.research-detail { position: absolute; left: 28px; right: 28px; bottom: 26px; background: color-mix(in srgb, var(--paper) 90%, transparent); border: 1px solid rgba(12,23,21,.1); border-radius: 18px; padding: 18px; backdrop-filter: blur(10px); }
.research-detail h3 { font-size: 22px; }
.research-detail p { margin-top: 7px; color: var(--muted); font-size: 14px; max-width: 600px; }

.project-stack { display: grid; gap: 18px; margin-top: 54px; }
.project-card { position: relative; overflow: hidden; border-radius: var(--radius); min-height: 440px; padding: 40px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: end; border: 1px solid var(--line); text-decoration: none; background: var(--paper-2); transition: transform .25s ease; }
.project-card:hover { transform: translateY(-3px); }
.project-card.dark { background: var(--forest); color: var(--paper); border-color: transparent; }
.project-card.dark .muted { color: rgba(244,241,233,.66); }
.project-number { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.dark .project-number { color: var(--acid); }
.project-card h3 { font-size: clamp(2.3rem, 4.5vw, 4.8rem); margin-top: 16px; }
.project-card .project-copy { max-width: 650px; }
.project-card .project-copy p { margin-top: 20px; font-size: 17px; max-width: 590px; }
.project-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 26px; }
.project-meta span { border: 1px solid currentColor; opacity: .7; border-radius: 999px; padding: 7px 10px; font-size: 11px; }
.project-visual { min-height: 280px; display: grid; place-items: center; position: relative; }
.project-visual svg { width: min(100%, 420px); }

.methods { background: #111c1a; color: var(--paper); }
.methods .eyebrow { color: var(--acid); }
.methods .lede { color: rgba(244,241,233,.75); }
.method-shell { margin-top: 54px; border: 1px solid var(--line-dark); border-radius: var(--radius); overflow: hidden; display: grid; grid-template-columns: 270px 1fr; min-height: 520px; }
.method-nav { padding: 16px; border-right: 1px solid var(--line-dark); background: rgba(255,255,255,.02); }
.method-tab { width: 100%; border: 0; background: transparent; color: rgba(244,241,233,.72); text-align: left; padding: 18px 16px; border-radius: 14px; cursor: pointer; }
.method-tab strong { display: block; font-size: 15px; }.method-tab span { display: block; margin-top: 3px; font-size: 12px; opacity: .6; }
.method-tab.active { background: rgba(200,240,82,.11); color: var(--paper); }
.method-workspace { padding: 32px; display: grid; grid-template-rows: auto 1fr auto; min-width: 0; }
.method-workspace h3 { font-size: 34px; }
.method-workspace .desc { color: rgba(244,241,233,.62); max-width: 720px; margin-top: 10px; font-size: 14px; }
.method-viz { min-height: 290px; position: relative; margin-top: 22px; display: grid; place-items: center; }
.method-controls { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; border-top: 1px solid var(--line-dark); padding-top: 20px; }
.method-controls button { background: transparent; border: 1px solid var(--line-dark); color: var(--paper); border-radius: 999px; padding: 10px 14px; cursor: pointer; }
.method-controls button:hover { border-color: var(--acid); }
.method-controls input[type="range"] { accent-color: var(--acid); width: min(280px, 45vw); }

.team-preview { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: start; }
.team-preview .portrait-placeholder { min-height: 560px; border-radius: var(--radius); background: var(--forest); color: var(--paper); display: grid; place-items: center; overflow: hidden; position: relative; }
.portrait-placeholder .initials { font-family: var(--serif); font-style: italic; font-size: 11rem; opacity: .9; }
.portrait-placeholder svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .5; }
.team-preview h2 { margin-top: 18px; }
.team-preview .lede { margin-top: 26px; }
.team-preview .role-list { margin-top: 32px; display: grid; gap: 12px; }
.role-row { padding: 16px 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 160px 1fr; gap: 18px; font-size: 14px; }
.role-row span:first-child { color: var(--muted); }

.nest-band { background: var(--paper-2); }
.nest-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.nest-mark { aspect-ratio: 1; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; position: relative; max-width: 440px; margin: auto; }
.nest-mark::before, .nest-mark::after { content:""; position:absolute; border:1px solid rgba(13,48,43,.2); border-radius:50%; transform: rotate(24deg); }
.nest-mark::before { inset: 18%; }.nest-mark::after { inset: 32%; transform: rotate(-21deg); }
.nest-mark span { font-size: clamp(4rem, 8vw, 7rem); font-family: var(--serif); font-style: italic; }
.nest-grid p { margin-top: 24px; color: var(--muted); }

.pub-grid { margin-top: 52px; display: grid; gap: 0; }
.pub-item { display: grid; grid-template-columns: 90px 1fr 150px; gap: 24px; padding: 24px 0; border-top: 1px solid var(--line); text-decoration: none; transition: padding-left .2s ease; }
.pub-item:hover { padding-left: 8px; }
.pub-year { color: var(--muted); font-size: 13px; padding-top: 4px; }
.pub-title { font-size: 20px; line-height: 1.3; }
.pub-journal { text-align: right; color: var(--muted); font-size: 13px; padding-top: 5px; }

.contact-band { background: var(--ink); color: var(--paper); }
.contact-band .container { padding-top: 100px; padding-bottom: 100px; }
.contact-band h2 { max-width: 940px; }
.contact-band .contact-grid { margin-top: 62px; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; }
.contact-band a { text-decoration-color: rgba(200,240,82,.55); text-underline-offset: 4px; }
.contact-band .muted { color: rgba(244,241,233,.58); }

.site-footer { background: var(--ink); color: rgba(244,241,233,.68); border-top: 1px solid var(--line-dark); }
.footer-inner { max-width: var(--max); margin: 0 auto; padding: 28px; display: flex; justify-content: space-between; align-items: center; gap: 20px; font-size: 12px; }
.footer-mark { width: 32px; }

.page-hero { padding: 100px 0 86px; border-bottom: 1px solid var(--line); }
.page-hero h1 { font-size: clamp(3.8rem, 8vw, 7.6rem); }
.page-hero .lede { margin-top: 28px; }
.page-content { padding: 86px 0 120px; }
.two-col { display: grid; grid-template-columns: .75fr 1.25fr; gap: 78px; }
.sticky-label { position: sticky; top: 100px; align-self: start; }
.prose { display: grid; gap: 26px; }
.prose h2 { font-size: clamp(2.1rem, 3.8vw, 4rem); }
.prose h3 { font-size: 30px; margin-top: 30px; }
.prose p { color: #35423e; max-width: 780px; }
.prose ul { margin: 0; padding-left: 20px; color: #35423e; }
.prose li + li { margin-top: 8px; }

.project-index { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.project-index article { min-height: 350px; border-radius: 24px; padding: 28px; border: 1px solid var(--line); background: var(--paper-2); display: flex; flex-direction: column; justify-content: space-between; }
.project-index article:nth-child(3n+1) { background: var(--forest); color: var(--paper); border-color: transparent; }
.project-index article:nth-child(3n+1) p { color: rgba(244,241,233,.68); }
.project-index h3 { font-size: 34px; }
.project-index p { margin-top: 14px; color: var(--muted); }
.project-index .meta { font-size: 11px; text-transform: uppercase; letter-spacing: .14em; }

.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.person-card { border-top: 1px solid var(--line); padding-top: 20px; min-height: 220px; }
.person-card .avatar { width: 100%; aspect-ratio: 4/3; border-radius: 20px; background: var(--paper-2); display: grid; place-items: center; font-family: var(--serif); font-size: 72px; font-style: italic; margin-bottom: 20px; position: relative; overflow: hidden; }
.person-card h3 { font-size: 24px; }.person-card p { color: var(--muted); margin-top: 7px; font-size: 14px; }
.open-roles { margin-top: 70px; background: var(--forest); color: var(--paper); border-radius: var(--radius); padding: 42px; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.open-roles p { color: rgba(244,241,233,.7); }

.pub-tools { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin: 36px 0 24px; }
.pub-tools input { flex: 1 1 280px; min-width: 0; background: transparent; border: 1px solid var(--line); border-radius: 999px; padding: 13px 17px; color: var(--ink); }
.filter-group { display: flex; gap: 8px; flex-wrap: wrap; }
.filter-btn { border: 1px solid var(--line); background: transparent; border-radius: 999px; padding: 9px 12px; cursor: pointer; font-size: 12px; }
.filter-btn.active { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.publication-list { display: grid; }
.publication-row { padding: 24px 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 72px 1fr 160px; gap: 24px; }
.publication-row[hidden] { display: none; }
.publication-row .title { font-size: 19px; line-height: 1.35; }
.publication-row .authors { margin-top: 8px; color: var(--muted); font-size: 13px; }
.publication-row .journal { text-align: right; font-size: 12px; color: var(--muted); }
.publication-row .title a { text-decoration-thickness: 1px; text-underline-offset: 4px; }

.timeline { display: grid; margin-top: 40px; }
.timeline-row { display: grid; grid-template-columns: 160px 1fr; gap: 24px; padding: 20px 0; border-top: 1px solid var(--line); }
.timeline-row .date { color: var(--muted); font-size: 13px; }
.timeline-row strong { display: block; }.timeline-row span { color: var(--muted); font-size: 14px; }

.logo-board { display: grid; grid-template-columns: 1.1fr .9fr; gap: 22px; margin-top: 48px; }
.logo-panel { border-radius: var(--radius); min-height: 360px; padding: 34px; display: grid; place-items: center; border: 1px solid var(--line); background: var(--paper-2); }
.logo-panel.dark { background: var(--forest); color: var(--paper); }
.logo-panel svg { width: min(100%, 420px); }

.fade-up { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.fade-up.in { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
  .nav-links { display: none; position: absolute; left: 18px; right: 18px; top: 70px; background: var(--paper); border: 1px solid var(--line); border-radius: 20px; padding: 14px; flex-direction: column; align-items: stretch; gap: 2px; box-shadow: 0 18px 50px rgba(12,23,21,.12); }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 10px; }
  .menu-button { display: inline-flex; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-system { min-height: 420px; margin-top: -20px; }
  .hero-system svg { min-height: 420px; }
  .research-flow, .team-preview, .nest-grid, .two-col, .logo-board { grid-template-columns: 1fr; }
  .project-card { grid-template-columns: 1fr; }
  .project-visual { margin-top: 26px; }
  .method-shell { grid-template-columns: 1fr; }
  .method-nav { border-right: 0; border-bottom: 1px solid var(--line-dark); display: flex; overflow-x: auto; gap: 4px; }
  .method-tab { min-width: 190px; }
  .pub-item, .publication-row { grid-template-columns: 72px 1fr; }
  .pub-journal, .publication-row .journal { text-align: left; grid-column: 2; }
  .contact-band .contact-grid, .open-roles { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 650px) {
  body { font-size: 16px; }
  .container, .nav-wrap { padding-left: 18px; padding-right: 18px; }
  .section { padding: 78px 0; }
  .hero { min-height: 0; }
  .hero-inner { padding: 64px 18px 60px; }
  .hero-grid { gap: 12px; }
  .hero-system { min-height: 330px; }
  .hero-system svg { min-height: 330px; }
  .hero-copy .roles { font-size: 13px; }
  .hero-copy .discipline-line { gap: 6px; }
  .pill { font-size: 10px; padding: 7px 9px; }
  .research-flow { gap: 28px; }
  .research-canvas { min-height: 380px; }.research-canvas svg { min-height: 380px; }
  .project-card { padding: 26px; min-height: 0; }
  .method-workspace { padding: 22px; }
  .method-viz { min-height: 250px; }
  .team-preview .portrait-placeholder { min-height: 390px; }
  .role-row { grid-template-columns: 1fr; gap: 4px; }
  .pub-item, .publication-row { grid-template-columns: 50px 1fr; gap: 14px; }
  .project-index, .team-grid { grid-template-columns: 1fr; }
  .timeline-row { grid-template-columns: 1fr; gap: 6px; }
  .footer-inner { align-items: flex-start; flex-direction: column; }
  .brand-copy span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .fade-up { opacity: 1; transform: none; }
}

/* ===== Revision 2: identity, content depth, production polish ===== */
.sr-only { position: absolute!important; width: 1px!important; height: 1px!important; padding: 0!important; margin: -1px!important; overflow: hidden!important; clip: rect(0,0,0,0)!important; white-space: nowrap!important; border: 0!important; }
.section-title { margin-top: 16px; max-width: 980px; }
.section-actions { margin-top: 28px; }
.text-link { display: inline-block; margin-top: 24px; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.eyebrow.light { color: var(--acid); }
.lede.small { font-size: clamp(1.1rem, 1.6vw, 1.35rem); }

/* Cleaner brand mark at navigation scale */
.brand-mark { color: var(--forest); }

/* Hero: the mark is now the focal visual; network is contextual rather than competing. */
.hero-grid { grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); }
.hero-system { min-height: 600px; border: 1px solid var(--line); border-radius: 34px; background: rgba(235,231,220,.65); overflow: hidden; }
.hero-system::after { content:""; position:absolute; inset:0; pointer-events:none; background: radial-gradient(circle at 70% 18%, rgba(200,240,82,.20), transparent 25%), linear-gradient(180deg, rgba(255,255,255,.16), transparent 45%); }
.hero-system #hero-network { position:absolute; inset:105px -34px -44px 20px; width: calc(100% + 25px); height: calc(100% - 70px); min-height:0; opacity:.72; z-index:1; }
.mark-stage { position: relative; z-index: 3; display:flex; align-items:center; gap:14px; padding:32px 34px 0; pointer-events:none; }
.logo-stage { position: relative; inset:auto; width: 126px!important; height:126px!important; min-height:0!important; opacity:1; flex:0 0 126px; }
.logo-stage .logo-edge, .logo-stage .logo-arc { stroke-dasharray: 185; stroke-dashoffset: 185; }
.logo-stage .logo-arc.acid { animation-delay:.72s; }
.mark-caption { display:flex; align-items:baseline; gap:8px; letter-spacing:.08em; color:var(--ink); }
.mark-caption span:first-child { font-size:21px; font-weight:760; }
.mark-caption span:last-child { font-size:21px; font-weight:360; letter-spacing:.16em; }
.system-tooltip { z-index: 5; }
.network-node:focus { outline:none; stroke:var(--acid); stroke-width:5; }

.signal-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.18); }
.signal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.signal-grid > div { min-height:106px; padding:25px 26px; border-right:1px solid var(--line); display:grid; align-content:center; gap:5px; }
.signal-grid > div:first-child { padding-left:0; }
.signal-grid > div:last-child { border-right:0; }
.signal-grid strong { font-size:15px; line-height:1.3; font-weight:570; }
.signal-year { font-size:11px; text-transform:uppercase; letter-spacing:.16em; color:var(--forest-2); font-weight:700; }

/* Research flow */
.flow-line { fill:none; stroke:rgba(13,48,43,.22); stroke-width:3; }
.area-node { fill:var(--forest); }
.area-node.sage { fill:var(--mint); }
.area-node.acid { fill:var(--acid); stroke:var(--forest); stroke-width:2; }
#research-map text { fill:var(--paper); font:600 13px var(--sans); pointer-events:none; }
#research-map g[data-area="implementation"] text, #research-map g[data-area="community"] text { fill:var(--ink); }
.research-list > .btn { justify-self:start; margin-top:8px; }

/* Project storytelling */
.project-card { align-items:center; }
.project-card > div:first-child { position:relative; z-index:2; }
.project-meta { display:block; margin:0; font-size:11px; text-transform:uppercase; letter-spacing:.15em; color:var(--forest-2); font-weight:700; }
.project-card h3 { margin-top:14px; }
.project-card p { margin-top:18px; max-width:620px; color:#35423e; }
.tag-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.tag-row span { padding:7px 10px; border:1px solid var(--line); border-radius:999px; font-size:11px; }
.project-visual { min-height:260px; }
.visual-network span { width:19px; height:19px; border-radius:50%; background:var(--forest); position:absolute; z-index:2; }
.visual-network span:nth-child(1){left:18%;top:50%}.visual-network span:nth-child(2){left:40%;top:26%;background:var(--mint)}.visual-network span:nth-child(3){left:43%;top:66%}.visual-network span:nth-child(4){left:68%;top:40%;background:var(--acid);border:2px solid var(--forest)}.visual-network span:nth-child(5){left:78%;top:69%}
.visual-network i { position:absolute; height:2px; background:rgba(13,48,43,.3); transform-origin:left center; }
.visual-network i:nth-of-type(1){width:31%;left:20%;top:52%;transform:rotate(-30deg)}.visual-network i:nth-of-type(2){width:27%;left:20%;top:53%;transform:rotate(25deg)}.visual-network i:nth-of-type(3){width:31%;left:42%;top:30%;transform:rotate(18deg)}.visual-network i:nth-of-type(4){width:34%;left:45%;top:68%;transform:rotate(-42deg)}
.visual-rings span { position:absolute; border:2px solid rgba(13,48,43,.25); border-radius:50%; }
.visual-rings span:nth-child(1){width:210px;height:210px}.visual-rings span:nth-child(2){width:135px;height:135px;border-color:var(--mint)}.visual-rings span:nth-child(3){width:54px;height:54px;background:var(--acid);border-color:var(--forest)}
.visual-diffusion { grid-template-columns:repeat(3,54px); gap:20px; align-content:center; justify-content:center; }
.visual-diffusion b { width:54px;height:54px;border-radius:50%;background:rgba(13,48,43,.16);position:relative; }
.visual-diffusion b:nth-child(1),.visual-diffusion b:nth-child(4){background:var(--forest)}.visual-diffusion b:nth-child(2),.visual-diffusion b:nth-child(5){background:var(--mint)}.visual-diffusion b:nth-child(3){background:var(--acid);border:2px solid var(--forest)}

/* Methods */
.methods-lede { margin-top:22px; }
.method-workspace #method-desc { color:rgba(244,241,233,.62); max-width:720px; margin-top:10px; font-size:14px; }
.method-tab { font-weight:600; }
.method-tab span { font-weight:400; }
.method-controls button:disabled { opacity:.38; cursor:not-allowed; border-color:var(--line-dark); }

/* Lab preview */
.portrait-placeholder { align-content:center; justify-items:center; padding:44px; }
.portrait-placeholder .monogram { font-family:var(--serif); font-style:italic; font-size:clamp(7rem,13vw,12rem); line-height:.8; }
.portrait-copy { position:absolute; left:30px; bottom:28px; display:grid; }
.portrait-copy strong { text-transform:uppercase; letter-spacing:.12em; }
.portrait-copy span { color:rgba(244,241,233,.6); font-size:12px; margin-top:4px; }
.lab-title { margin-top:18px; }
.lab-home .role-list { margin-top:32px; }
.nest-title { margin-top:14px; }
.nest-band .text-link { font-size:14px; }

/* Scholarship and contact */
.scholarship-home .pub-preview { margin-top:48px; display:grid; }
.pub-preview .pub-item { grid-template-columns:72px 1fr; }
.pub-preview .pub-item a { font-size:20px; line-height:1.32; text-decoration:none; }
.pub-preview .pub-item a:hover { text-decoration:underline; text-underline-offset:4px; }
.pub-preview .pub-item small { display:block; margin-top:7px; color:var(--muted); }
.scholarship-home > .container > .btn { margin-top:28px; }
.contact-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:72px; align-items:end; }
.contact-band h2 { font-size:clamp(3.4rem,6vw,6.6rem); }
.contact-band .contact-email { display:inline-block; font-size:clamp(1.5rem,2.6vw,2.4rem); margin-top:20px; }
.contact-address { margin-top:28px; color:rgba(244,241,233,.55); font-size:14px; }

/* Page layouts */
.page-title { margin-top:14px; }
.sticky-label > .muted { margin-top:16px; }
.question-block { margin-top:30px; background:var(--paper-2); border:1px solid var(--line); border-radius:24px; padding:28px; }
.question-block ul { margin-top:18px; }
.systems-mark-section { padding-top:0; }
.logo-panel img { width:min(100%,360px); }
.logo-panel > div { max-width:390px; }
.logo-panel h3 { margin-top:18px; font-size:28px; }
.logo-panel p { margin-top:12px; }

.project-index { gap:22px; }
.project-index article { min-height:430px; padding:32px; justify-content:flex-start; }
.project-index article:nth-child(3n+1) { background:var(--paper-2); color:var(--ink); border-color:var(--line); }
.project-index article:nth-child(3n+1) p { color:var(--muted); }
.project-page-card h2 { font-size:clamp(2rem,3.3vw,3.4rem); margin-top:16px; }
.project-page-card p { margin-top:17px; color:var(--muted); }
.project-page-card dl { margin:auto 0 0; padding-top:28px; display:grid; gap:13px; }
.project-page-card dl div { border-top:1px solid var(--line); padding-top:12px; display:grid; grid-template-columns:90px 1fr; gap:12px; }
.project-page-card dt { color:var(--muted); font-size:12px; }
.project-page-card dd { margin:0; font-size:13px; }
.project-status { display:inline-flex; align-self:flex-start; font-size:11px; text-transform:uppercase; letter-spacing:.14em; font-weight:700; color:var(--forest-2); }
.project-status.current::before,.project-status.foundational::before { content:""; width:7px;height:7px;border-radius:50%;background:var(--acid);margin:5px 8px 0 0;border:1px solid var(--forest); }
.project-status.foundational::before { background:var(--mint); }
.portfolio-principle { background:var(--forest); color:var(--paper); }
.portfolio-principle .eyebrow { color:var(--acid); }
.portfolio-principle .lede { color:rgba(244,241,233,.72); margin-top:26px; }
.principle-title { margin-top:16px; max-width:980px; }

/* Team */
.person-card { min-height:330px; border:1px solid var(--line); border-radius:24px; padding:26px; background:var(--paper-2); }
.person-card.featured { background:var(--forest); color:var(--paper); border-color:transparent; }
.person-card.featured p { color:rgba(244,241,233,.7); }
.person-card h2 { font-size:28px; margin-top:20px; }
.person-card p { color:var(--muted); margin-top:10px; font-size:14px; }
.person-role { text-transform:uppercase; letter-spacing:.13em; font-size:11px!important; font-weight:700; color:var(--acid)!important; }
.person-monogram { width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:var(--acid);color:var(--ink);font-family:var(--serif);font-style:italic;font-size:34px; }
.person-monogram.muted-block { width:100%;height:92px;border-radius:16px;background:rgba(13,48,43,.08);font-family:var(--sans);font-style:normal;font-size:12px;letter-spacing:.16em;color:var(--forest-2); }
.person-card.featured .text-link { color:var(--paper); }
.mentoring-section { background:var(--paper-2); }
.metric-grid { margin-top:45px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.metric-grid > div { padding:34px 30px; border-right:1px solid var(--line); display:grid; gap:10px; }
.metric-grid > div:first-child { padding-left:0; }
.metric-grid > div:last-child { border-right:0; }
.metric-grid strong { font-family:var(--serif); font-size:clamp(3.8rem,6vw,6.3rem); font-weight:450; line-height:.8; }
.metric-grid span { color:var(--muted); font-size:14px; max-width:260px; }
.metric-note { margin-top:20px; font-size:12px; }
.work-title { margin-top:15px; }
.work-with-us .open-roles { margin:28px 0; background:transparent; color:var(--ink); border-radius:0; padding:0; display:grid; grid-template-columns:1fr; gap:0; }
.work-with-us .open-roles > div { padding:18px 0; border-top:1px solid var(--line); display:grid; gap:5px; }
.work-with-us .open-roles span { color:var(--muted); font-size:13px; }

/* Publications */
.publication-intro { display:flex; align-items:baseline; gap:14px; margin-bottom:20px; }
.publication-intro strong { font-family:var(--serif); font-size:48px; font-weight:450; }
.publication-intro span { color:var(--muted); font-size:13px; }
.search-wrap { flex:1 1 300px; }
.search-wrap input { width:100%; }
.pub-count { margin:-8px 0 18px; color:var(--muted); font-size:12px; }
.publication-row { align-items:start; }
.publication-row .title a { color:inherit; }
.under-review { margin-top:65px; padding:32px; border:1px solid var(--line); border-radius:24px; background:var(--paper-2); }
.under-review h2 { margin-top:14px; font-size:clamp(1.7rem,3vw,2.8rem); line-height:1.15; }
.under-review p { margin-top:13px; color:var(--muted); }

/* About */
.appointment-stack { margin-top:18px; display:grid; gap:20px; }
.appointment-stack > div { display:grid; gap:4px; padding-top:16px; border-top:1px solid var(--line); }
.appointment-stack span { color:var(--muted); font-size:13px; }
.about-grid-section { background:var(--paper-2); }
.about-panels { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; }
.recognition-list { margin-top:38px; display:grid; }
.recognition-list > div { display:grid; grid-template-columns:70px 1fr; gap:15px; padding:18px 0; border-top:1px solid var(--line); }
.recognition-list strong { font-family:var(--serif); font-size:24px; font-weight:450; }
.recognition-list span { color:#35423e; }
.service-label { margin-top:52px; }
.service-label + p { margin-top:18px; }
.cv-section { background:var(--forest); color:var(--paper); }
.cv-section .eyebrow { color:var(--acid); }
.cv-section .lede { color:rgba(244,241,233,.7); margin-bottom:24px; }
.cv-section .btn.primary { background:var(--acid); color:var(--ink); border-color:var(--acid); }
.cv-title { margin-top:14px; }
.media-list { margin-top:42px; display:grid; }
.media-list a { display:grid; grid-template-columns:170px 1fr; gap:24px; padding:22px 0; border-top:1px solid var(--line); text-decoration:none; }
.media-list a:hover strong { text-decoration:underline; text-underline-offset:5px; }
.media-list span { color:var(--muted); font-size:12px; }
.media-list strong { font-size:20px; font-weight:540; }

@media (max-width: 980px) {
  .hero-system { min-height:500px; }
  .hero-system #hero-network { inset:95px -25px -35px 0; }
  .signal-grid { grid-template-columns:1fr; }
  .signal-grid > div { border-right:0; border-bottom:1px solid var(--line); padding-left:0; }
  .signal-grid > div:last-child { border-bottom:0; }
  .about-panels { grid-template-columns:1fr; gap:60px; }
  .metric-grid { grid-template-columns:1fr; }
  .metric-grid > div { border-right:0; border-bottom:1px solid var(--line); padding-left:0; }
  .metric-grid > div:last-child { border-bottom:0; }
  .contact-grid { grid-template-columns:1fr; }
}

@media (max-width: 650px) {
  .hero-system { min-height:430px; margin-top:20px; border-radius:24px; }
  .hero-system #hero-network { inset:100px -80px -20px -80px; width:calc(100% + 150px); opacity:.62; }
  .mark-stage { padding:22px 22px 0; }
  .logo-stage { width:98px!important; height:98px!important; flex-basis:98px; }
  .mark-caption span:first-child,.mark-caption span:last-child { font-size:16px; }
  .signal-grid > div { min-height:84px; }
  .project-card { padding:28px; }
  .project-visual { min-height:220px; margin-top:25px; }
  .contact-band .container { padding-top:74px; padding-bottom:74px; }
  .media-list a { grid-template-columns:1fr; gap:5px; }
  .publication-intro { align-items:flex-start; }
  .publication-intro strong { font-size:42px; }
  .project-page-card dl div { grid-template-columns:1fr; gap:3px; }
}
/* V3: preserve the systems identity; strengthen legibility and small-screen flow. */
:root { --radius: 12px; }
[hidden] { display:none!important; }
.fade-up { opacity:1; transform:none; }
.hero-system { border-radius:12px; }
.hero-system::after { display:none; }
.hero-copy h1 .credentials { display:block; font:500 1.1rem var(--sans); letter-spacing:.06em; margin-top:18px; }
.hero-copy .roles { color:var(--forest); font-size:1rem; }
.hero-system #hero-network { inset:155px 0 auto; width:100%; height:calc(100% - 195px); opacity:1; }
.system-tooltip { position:absolute; left:16px!important; top:auto!important; bottom:14px; width:calc(100% - 32px); max-width:none; font-size:14px; z-index:5; }
.mark-stage { padding:24px; }
.logo-stage { width:142px!important; height:142px!important; flex-basis:142px; }
.logo-stage .logo-arc { stroke-dasharray:240; stroke-dashoffset:240; }
.brand-copy span { font-size:12px; }
.pill,.research-tab span,.project-meta,.tag-row span,.filter-btn,.project-status,.project-page-card dt,.project-page-card dd,.person-role,.pub-count,.publication-row .authors,.publication-row .journal { font-size:14px!important; }
.research-tab,.filter-btn,.method-tab,.menu-button { min-height:44px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible { outline:3px solid #477b9a; outline-offset:4px; }
.method-workspace { min-width:0; }
.method-controls label,.method-controls span { font-size:14px!important; color:#d6ddd3!important; }
.method-viz svg { overflow:visible; }
.agent-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:6px; width:min(100%,340px); }
.agent-grid span { aspect-ratio:1; border-radius:50%; }
.demo-status { display:block; flex-basis:100%; line-height:1.5; }
.method-controls button:disabled { opacity:.6; }
.year-select { display:flex; align-items:center; gap:10px; font-size:14px; }
.year-select select { padding:12px; border:1px solid var(--line); background:var(--paper); border-radius:4px; color:var(--ink); }
.pub-tools { flex-wrap:wrap; }
.pub-tags { color:var(--forest-2); font-size:12px; margin-top:10px; text-transform:capitalize; }
.doi-link { display:inline-block; font-size:12px; margin-top:8px; overflow-wrap:anywhere; }
.portfolio-group { grid-column:1/-1; font-size:clamp(1.6rem,3vw,2.4rem); margin:24px 0 4px; }
.official-title { font-size:14px; margin-top:22px; }
.team-grid { grid-template-columns:minmax(0,1fr); max-width:760px; }
.person-card { border-radius:12px; }
@media(max-width:980px) {
 .hero-grid { grid-template-columns:minmax(0,1fr); }
 .hero-system { min-height:530px; max-width:660px; width:100%; }
 .hero-system #hero-network { inset:150px 0 auto; width:100%; height:330px; }
 .method-nav { display:grid; grid-template-columns:1fr 1fr; overflow:visible; }
 .method-tab { min-width:0; }
}
@media(max-width:650px) {
 .hero-system { min-height:440px; }
 .hero-system #hero-network { inset:135px 0 auto; width:100%; height:280px; }
 .logo-stage { width:100px!important; height:100px!important; flex-basis:100px; }
 .hero-copy .roles { font-size:14px; }
 .hero-copy .discipline-line { gap:7px; }
 .pill { border:0; border-radius:0; padding:3px 8px 3px 0; background:none; }
 .method-workspace { padding:20px 14px; }
 .method-tab { padding:14px 10px; font-size:14px; }
 .method-tab span { font-size:12px; }
 .method-viz { min-height:210px; }
 .publication-row { min-width:0; }
 .project-card { border-radius:12px; }
 .nav-links.open { max-height:calc(100dvh - 90px); overflow-y:auto; }
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
 .logo-stage .logo-edge,.logo-stage .logo-arc { stroke-dashoffset:0; }
 .logo-stage .logo-node { transform:none; }
}
.system-story { margin-top:40px; }
.system-steps { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.system-steps button { background:transparent; border:1px solid var(--line); border-radius:4px; padding:12px 16px; cursor:pointer; font-size:15px; }
.system-steps button[aria-pressed="true"] { background:var(--forest); color:var(--paper); }
.feedback-caption { border-bottom:2px solid var(--mint); border-left:2px solid var(--mint); border-radius:0 0 0 14px; padding:18px; font-size:14px; margin-top:16px; }
#system-story-detail { min-height:78px; max-width:780px; margin-top:24px; font-size:18px; }
