/* Stage 3 — structural lock: readable scale, stronger section rhythm, abstract hero. */

/* Keep the denser visual language without forcing everything into a single viewport. */
body { font-size: 16px; line-height: 1.68; }
.desktop-nav a { font-size: .9rem; }
.site-section { padding: 78px 0; }
.retained-section { padding: 82px 24px !important; }
.section-title-row { margin-bottom: 32px; }
.section-note { font-size: .94rem; line-height: 1.58; }

/* HERO — no literal face. Three connected stages, with periocular landmarks as the visual anchor. */
#lead.hero-section {
  min-height: 705px !important;
  padding: 122px 0 82px !important;
}
.hero-shell { grid-template-columns: minmax(0,.9fr) minmax(520px,1.1fr); gap: 48px; }
.hero-copy h1 { font-size: clamp(4.15rem,6.4vw,6.15rem); }
.hero-tagline { font-size: clamp(1.52rem,2.15vw,2rem); line-height: 1.3; }
.hero-role { font-size: 1rem; }
.hero-actions a { min-height: 45px; font-size: .86rem; padding: 0 17px; }
.hero-topics { font-size: .82rem; }

.hero-visual-v3 { min-height: 520px; --mx:0; --my:0; isolation:isolate; }
.hero-visual-v3 .visual-glow { inset: 4% 2% 1%; opacity:.9; }
.hero-visual-v3 .visual-microgrid {
  position:absolute; inset:6% 2% 5% 7%; opacity:.32;
  background-image:radial-gradient(circle,var(--motif-dot) .9px,transparent 1px);
  background-size:15px 15px;
  mask-image:radial-gradient(ellipse at 57% 48%,#000 0 28%,rgba(0,0,0,.55) 52%,transparent 77%);
}
.research-orbit-v3 { transition:transform .18s ease-out; transform:translate(calc(var(--mx)*7px),calc(var(--my)*5px)); }
.hero-field { opacity:.8; }
.hero-orbits { opacity:.28; stroke-width:1.05; }
.observe-field { transform:translate(calc(var(--mx)*-5px),calc(var(--my)*2px)); transform-origin:187px 245px; }
.represent-field { transform:translate(calc(var(--mx)*2px),calc(var(--my)*-2px)); transform-origin:360px 265px; }
.protect-field { transform:translate(calc(var(--mx)*5px),calc(var(--my)*2px)); transform-origin:560px 300px; }
.periocular-brow { stroke-width:2.3; opacity:.72; }
.periocular-eye { stroke-width:2.7; opacity:.95; }
.iris-ring { stroke-width:1.8; opacity:.84; }
.iris-core { stroke-width:2.2; opacity:.9; }
.partial-landmark { stroke-width:1.15; opacity:.28; stroke-dasharray:3 8; }
.landmark-links { stroke-width:.85; opacity:.22; }
.landmark-nodes { opacity:.72; }
.embedding-links { stroke-width:1.05; opacity:.36; }
.embedding-nodes { opacity:.82; }
.embedding-dust { opacity:.48; }
.transform-flow { stroke-width:1.2; stroke-dasharray:5 6; }
.protected-lattice { stroke-width:1.1; opacity:.48; }
.protected-nodes { opacity:.86; }
.shield-outline { stroke-width:2.25; opacity:.85; }
.shield-mark { stroke-width:2.25; opacity:.85; }
.flow-connectors { stroke-width:1; opacity:.28; stroke-dasharray:3 6; }
.ambient-nodes { opacity:.5; }

/* Stage labels read like annotations rather than floating UI pills. */
.visual-stage {
  position:absolute; display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:8px;
  color:var(--text); padding:0; background:transparent; border:0; box-shadow:none; backdrop-filter:none;
  font-size:.76rem; pointer-events:none; transition:transform .18s ease-out;
}
.visual-stage::before { content:""; position:absolute; left:0; right:0; bottom:-8px; height:1px; background:linear-gradient(90deg,var(--accent),transparent); opacity:.42; }
.visual-stage .stage-index { color:var(--accent); font-family:var(--serif); font-size:.7rem; }
.visual-stage > i { color:var(--accent); font-size:1rem; }
.visual-stage strong { display:block; color:var(--text-strong); font-family:var(--serif); font-size:.92rem; font-weight:600; line-height:1.1; }
.visual-stage small { display:block; color:var(--muted); margin-top:3px; font-size:.57rem; line-height:1.2; text-transform:uppercase; letter-spacing:.09em; }
.stage-observe { left:3%; top:15%; transform:translate(calc(var(--mx)*-4px),calc(var(--my)*-2px)); }
.stage-represent { left:39%; bottom:11%; transform:translate(calc(var(--mx)*1px),calc(var(--my)*3px)); }
.stage-protect { right:0; top:24%; transform:translate(calc(var(--mx)*4px),calc(var(--my)*-1px)); }
.visual-sequence { right:1%; bottom:2%; font-size:.57rem; }

/* ABOUT — retain editorial split, but make reading text comfortable. */
#about.about-section { padding:70px 0 !important; }
.about-grid { grid-template-columns:.76fr 1.42fr .82fr; gap:42px; }
.about-copy { padding-left:30px; }
.about-copy p { font-size:.97rem !important; line-height:1.74; }
.news-card li { font-size:.8rem; line-height:1.52; }

/* RESEARCH — two by two on normal desktop. The page can scroll; text should not be sacrificed. */
.research-section { padding-top:82px; }
.research-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.research-card { min-height:238px; padding:24px 24px 22px; }
.card-top { margin-bottom:20px; }
.research-card h3 { font-size:1.28rem; min-height:0; margin-bottom:10px; }
.research-card p { font-size:.88rem; line-height:1.58; max-width:88%; min-height:0; }
.topic-list { margin-top:17px; }
.topic-list span, .pill-row span { font-size:.72rem; padding:6px 9px; }

/* PUBLICATIONS — editorial 2-column rhythm with one wide feature instead of three tiny cards. */
#publications .publication-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.pub-entry { min-height:150px; padding:21px 22px !important; }
.pub-entry:first-child { grid-column:1 / -1; min-height:175px; padding:24px 34% 24px 25px !important; }
.pub-entry:first-child::after { width:35%; }
.pub-title { font-size:1.02rem; line-height:1.42; }
.pub-entry:first-child .pub-title { font-size:1.16rem; max-width:670px; }
.pub-label { font-size:.7rem; }
.pub-authors { font-size:.76rem; }
.pub-meta { font-size:.75rem !important; }

/* PROJECTS — readable descriptions, still compact enough for a 2-column layout. */
.project { min-height:235px; grid-template-columns:155px 1fr; }
.project-image { width:155px; min-height:235px; }
.project-image img { min-height:235px; }
.project-info { padding:22px !important; }
.project-info h3 { font-size:1.12rem !important; }
.project-info p { font-size:.8rem !important; line-height:1.58; }
.project-info a { font-size:.78rem; }

/* TEACHING / SUPERVISION — quiet, readable, human scale. */
.teaching-card { padding:23px 24px; }
.teaching-card h3 { font-size:1.16rem; }
.teaching-card p { font-size:.82rem; line-height:1.5; }
.teaching-card .pill-row span { font-size:.72rem; }

/* METHODS — 2x2 technical matrix, compact without shrinking the type. */
.methods-section { padding-top:78px; }
.methods-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.method-card {
  min-height:154px; padding:20px 21px; grid-template-columns:44px 1fr;
  column-gap:14px; grid-template-rows:auto auto;
}
.method-card h3 { font-size:1.06rem; }
.method-note { font-size:.73rem; line-height:1.45; }
.method-card .pill-row { margin-top:14px; gap:6px; }
.method-card .pill-row span { font-size:.72rem; padding:6px 9px; }

/* EXPERIENCE / EDUCATION — restore readable CV-scale text. */
#experience-timeline > div, .experience-card { padding:24px 27px 24px 178px; }
.experience-date { left:25px; top:26px; font-size:.75rem; }
#experience-timeline h3 { font-size:1.18rem !important; }
#experience-timeline h4 { font-size:.86rem !important; line-height:1.45; }
#experience-timeline li { font-size:.8rem; line-height:1.62; margin-bottom:8px; }
#education .education-block { padding:23px 26px; }
.education-block p { font-size:.84rem !important; line-height:1.62; }

/* A little more contrast between major sections, without making the light mode a different site. */
#research { background:linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--bg-soft) 46%,var(--bg))); }
#projects { background:linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--surface) 36%,var(--bg))) !important; }
#teaching { background:var(--bg-soft); }
#methods { background:linear-gradient(180deg,var(--bg-soft),var(--bg)); }
html.theme-dark #research { background:linear-gradient(180deg,#0b0d10,#0e1115); }
html.theme-dark #projects { background:linear-gradient(180deg,#0b0d10,#101217) !important; }
html.theme-dark #methods { background:linear-gradient(180deg,#0f1216,#0b0d10); }

@media (max-width:1160px) {
  .hero-shell { grid-template-columns:minmax(0,.92fr) minmax(455px,1.08fr); }
  .research-grid, .methods-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .hero-shell { grid-template-columns:1fr; }
  .hero-visual-v3 { min-height:460px; max-width:720px; margin:0 auto; width:100%; }
  .research-grid, .methods-grid, #publications .publication-grid { grid-template-columns:1fr; }
  .pub-entry:first-child { grid-column:auto; padding:22px !important; }
  .pub-entry:first-child::after { display:none; }
}
@media (max-width:620px) {
  .hero-visual-v3 { min-height:350px; }
  .visual-stage { transform:scale(.86) !important; transform-origin:left center; }
  .stage-observe { top:10%; }
  .stage-protect { top:20%; right:-2%; }
  .stage-represent { left:33%; bottom:8%; }
  .research-card, .method-card { min-height:0; }
}