/* 01. Design tokens */
:root {
  --midnight-teal: #23383A; --dialect-plum: #74596C; --seismic-ochre: #A97848;
  --microbial-fern: #637C68; --survey-blue: #607C8C; --field-clay: #9A6D59;
  --quiet-brass: #AE915F; --cool-slate: #758184; --plum-mist: #EAE2E8;
  --ochre-wash: #F0E4D8; --fern-wash: #E3EAE3; --survey-mist: #E1E9EC;
  --brass-wash: #F0E9D9; --field-paper: #F8F4EB; --cool-paper: #EEF1F0;
  --graphite: #374043; --muted-graphite: #747E80; --white: #FFFFFF;
  --font-editorial: Georgia, Cambria, "Times New Roman", Times, serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --text-xs: .72rem; --text-sm: .88rem; --text-base: 1rem; --text-lg: clamp(1.08rem, 1.5vw, 1.28rem);
  --text-h3: clamp(1.35rem, 2vw, 1.8rem); --text-h2: clamp(2rem, 4vw, 3.65rem); --text-h1: clamp(2.65rem, 5.7vw, 5.5rem);
  --space-1: .4rem; --space-2: .75rem; --space-3: 1.1rem; --space-4: 1.6rem; --space-5: 2.4rem; --space-6: 3.5rem; --space-7: clamp(5rem, 10vw, 9rem);
  --container: 1200px; --border: 1px solid rgba(35,56,58,.22); --radius: 4px; --radius-lg: 12px;
  --shadow: 0 18px 45px rgba(35,56,58,.08); --transition: 220ms ease;
}

/* 02. Reset */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: auto; }
body, h1, h2, h3, p, ul { margin: 0; }
ul { padding: 0; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
a { color: inherit; }

/* 03. Base */
body { min-width: 320px; overflow-x: hidden; background: var(--field-paper); color: var(--graphite); font-family: var(--font-sans); line-height: 1.65; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section { padding-block: var(--space-7); }
.section:nth-of-type(even) { background: var(--cool-paper); }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: .75rem 1.25rem; border: 1px solid var(--midnight-teal); border-radius: var(--radius); text-decoration: none; font-size: var(--text-sm); font-weight: 700; transition: color var(--transition), background var(--transition), transform var(--transition); }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--midnight-teal); color: var(--white); }
.button-primary:hover { background: var(--survey-blue); }
.button-secondary { background: transparent; color: var(--midnight-teal); }
.button-secondary:hover { background: var(--white); }
.button-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: var(--space-5); }

/* 04. Accessibility */
.skip-link { position: fixed; z-index: 1000; top: .5rem; left: .5rem; padding: .8rem 1rem; background: var(--white); color: var(--midnight-teal); transform: translateY(-150%); }
.skip-link:focus { transform: none; }
:focus-visible { outline: 3px solid var(--quiet-brass); outline-offset: 4px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

/* 05. Typography */
h1, h2, h3 { color: var(--midnight-teal); font-family: var(--font-editorial); font-weight: 400; line-height: 1.08; }
h1 { max-width: 12ch; font-size: var(--text-h1); letter-spacing: -.045em; }
h1 em { color: var(--dialect-plum); font-style: italic; }
h2 { max-width: 19ch; font-size: var(--text-h2); letter-spacing: -.035em; }
h3 { font-size: var(--text-h3); }
.lead { max-width: 60ch; font-size: var(--text-lg); }
.eyebrow, .category, .field, .orcid, .micro-label, .window-label, .scale-rule { color: var(--survey-blue); font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.section-heading { display: grid; grid-template-columns: minmax(200px, .65fr) 1.7fr; gap: var(--space-5); align-items: start; margin-bottom: var(--space-6); border-top: var(--border); padding-top: var(--space-3); }
.section-heading > p:not(.eyebrow), .reference-intro { max-width: 65ch; }

/* 06. Layout */
.hero-grid, .about-grid, .final-grid { display: grid; grid-template-columns: minmax(0, 47fr) minmax(0, 53fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }

/* 07. Header */
.site-header { position: sticky; z-index: 100; top: 0; border-bottom: 1px solid rgba(255,255,255,.12); background: var(--midnight-teal); color: var(--white); }
.header-inner { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { flex: 0 0 250px; }
.brand img { width: 250px; filter: brightness(0) invert(1); }
#primary-navigation { display: flex; align-items: center; gap: clamp(.6rem, 1.15vw, 1rem); }
#primary-navigation a { text-decoration: none; font-size: .72rem; white-space: nowrap; }
#primary-navigation a:hover { color: var(--brass-wash); }
.nav-cta { padding: .55rem .75rem; border: 1px solid var(--quiet-brass); }
.menu-toggle { display: none; width: 46px; height: 42px; border: 1px solid rgba(255,255,255,.4); background: transparent; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 5px auto; background: var(--white); }

/* 08. Hero */
.hero { min-height: calc(100vh - 76px); padding-block: clamp(4rem, 8vw, 8rem); background: var(--field-paper); }
.hero-copy .eyebrow { margin-bottom: var(--space-4); }
.hero-copy .lead { margin-top: var(--space-5); }
.micro-label { margin-top: var(--space-4); padding-top: var(--space-2); border-top: var(--border); }
.hero-windows { position: relative; min-height: 650px; }
.window-caption { position: absolute; right: 0; bottom: 0; max-width: 51ch; color: var(--muted-graphite); font-size: var(--text-sm); }

/* 09. Context Windows */
.context-window { position: absolute; border: 2px solid currentColor; background: rgba(255,255,255,.62); box-shadow: var(--shadow); color: var(--survey-blue); }
.context-window .inner-frame { position: absolute; border: 1px solid currentColor; }
.context-window i { position: absolute; display: block; width: 7px; height: 7px; background: currentColor; }
.window-label { position: absolute; top: -27px; left: 0; color: currentColor; }
.scale-rule { position: absolute; padding-top: 5px; border-top: 1px solid currentColor; color: currentColor; }
.window-copy { position: absolute; padding-left: .8rem; border-left: 1px solid currentColor; font-size: .7rem; line-height: 1.55; }
.window-copy b { display: inline; font-family: var(--font-mono); font-size: .65rem; text-transform: uppercase; }
.language-window { top: 25px; left: 0; width: 65%; height: 230px; color: var(--dialect-plum); }
.language-window .inner-frame { inset: 27px -18px 53px 34px; }.language-window i:nth-of-type(1){top:45px;left:54px}.language-window i:nth-of-type(2){top:74px;right:30px}.language-window i:nth-of-type(3){bottom:67px;left:36%}.language-window .scale-rule{bottom:18px;left:20px;width:70px}.language-window .window-copy{top:60px;right:-50%;width:45%}
.seismic-window { top: 290px; right: 0; width: 76%; height: 190px; color: var(--seismic-ochre); }.seismic-window .inner-frame{inset:-17px 36px 29px 20px}.seismic-window i{width:34px;height:2px}.seismic-window i:nth-of-type(1){top:48px;left:38px}.seismic-window i:nth-of-type(2){top:69px;left:64px}.seismic-window i:nth-of-type(3){top:91px;left:28px}.seismic-window i:nth-of-type(4){top:114px;left:80px}.seismic-window .scale-rule{right:14px;bottom:15px;width:60px}.seismic-window .window-copy{right:14px;top:30px;width:43%}
.microbial-window { left: 10%; bottom: 61px; width: 51%; height: 145px; color: var(--microbial-fern); }.microbial-window .inner-frame{inset:18px 23px -16px -15px}.microbial-window i{border-radius:50%}.microbial-window i:nth-of-type(1){top:34px;left:27px}.microbial-window i:nth-of-type(2){top:66px;left:50%}.microbial-window i:nth-of-type(3){top:42px;right:29px}.microbial-window .scale-rule{left:15px;bottom:12px;width:54px}.microbial-window .window-copy{left:105%;top:18px;width:95%}

/* 10. Context Pins */
.context-pin { position: relative; display: inline-block; width: 34px; height: 12px; margin-right: .7rem; vertical-align: middle; }
.context-pin::before { position: absolute; top: 1px; left: 0; width: 8px; height: 8px; border: 1px solid currentColor; border-radius: 50%; content: ""; }
.context-pin::after { position: absolute; top: 5px; left: 10px; width: 13px; height: 1px; background: currentColor; box-shadow: 17px 3px 0 2px var(--field-paper); content: ""; }

/* 11. Context Band */
.context-band { padding-block: var(--space-6); background: var(--midnight-teal); color: var(--white); }
.context-band .eyebrow { color: var(--quiet-brass); }
.band-lead { max-width: 870px; margin-top: var(--space-3); font-family: var(--font-editorial); font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.2; }
.band-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: var(--space-5); border-top: 1px solid rgba(255,255,255,.25); }
.band-grid p { padding: var(--space-3) var(--space-3) 0 0; font-family: var(--font-mono); font-size: .76rem; letter-spacing: .05em; }

/* 12. Research Landscapes */
.landscape-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: var(--border); border-bottom: var(--border); }
.landscape { min-height: 430px; padding: var(--space-4); border-right: var(--border); }
.landscape:last-child { border-right: 0; }.landscape .index { font-family: var(--font-mono); font-size: .75rem; }.landscape h3 { margin: 5rem 0 1.3rem; }.landscape ul { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.4rem; list-style: none; }.landscape li { padding: .2rem .45rem; border: 1px solid currentColor; font-family: var(--font-mono); font-size: .66rem; }.language .index,.language .category{color:var(--dialect-plum)}.seismic .index,.seismic .category{color:var(--seismic-ochre)}.microbial .index,.microbial .category{color:var(--microbial-fern)}

/* 13. Context Studies */
.studies { background: var(--cool-paper); }
.study { display: grid; grid-template-columns: minmax(250px, .8fr) 1.4fr; min-height: 460px; margin-bottom: var(--space-6); border: var(--border); background: var(--field-paper); }
.study-visual { position: relative; overflow: hidden; padding: var(--space-4); background: var(--plum-mist); color: var(--dialect-plum); font-family: var(--font-mono); font-size: var(--text-xs); }
.study-seismic .study-visual { background: var(--ochre-wash); color: var(--seismic-ochre); }.study-microbial .study-visual { background: var(--fern-wash); color: var(--microbial-fern); }
.study-frame { position: absolute; inset: 22% 13% 15% 19%; border: 2px solid currentColor; }.study-frame::before { position:absolute; inset:18px -22px -18px 28px; border:1px solid currentColor; content:""; }.study-frame i { position:absolute; width:8px;height:8px;background:currentColor }.study-frame i:nth-child(1){top:20%;left:17%}.study-frame i:nth-child(2){top:50%;right:20%}.study-frame i:nth-child(3){bottom:15%;left:48%}.study-seismic .study-frame i{width:40%;height:2px}.study-microbial .study-frame i{border-radius:50%}
.study-content { padding: clamp(2rem, 5vw, 4rem); }.study-content h3 { max-width: 24ch; margin: var(--space-3) 0 var(--space-5); font-size: clamp(1.7rem, 3vw, 2.8rem); }.study-columns { display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4) }.study-columns b,.limit b { display:block;margin-bottom:.4rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase }.limit { margin-top:var(--space-5);padding:var(--space-3);border-left:3px solid var(--survey-blue);background:var(--survey-mist) }

/* 14. Context Method */
.method-grid { display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-3) }.method-item { min-height:240px;padding:var(--space-4);border-top:2px solid var(--quiet-brass);background:var(--white) }.method-item:nth-child(1),.method-item:nth-child(4),.method-item:nth-child(7){grid-column:span 4}.method-item:nth-child(2),.method-item:nth-child(3),.method-item:nth-child(5),.method-item:nth-child(6){grid-column:span 3}.method-item span { color:var(--quiet-brass);font-family:var(--font-mono) }.method-item h3 { margin:3.5rem 0 1rem;font-size:1.35rem;text-transform:capitalize }

/* 15. Context Checklist */
.checklist { display:grid;grid-template-columns:.7fr 1.3fr;gap:var(--space-6);margin-top:var(--space-6);padding:clamp(2rem,5vw,4rem);background:var(--midnight-teal);color:var(--white) }.checklist h2 { color:var(--white) }.checklist .eyebrow { color:var(--quiet-brass);margin-bottom:1rem }.checklist ul { columns:2;column-gap:2rem;list-style:none }.checklist li { position:relative;break-inside:avoid;padding:.45rem 0 .45rem 1.4rem;border-bottom:1px solid rgba(255,255,255,.12);font-size:.9rem }.checklist li::before { position:absolute;left:0;top:.85rem;width:7px;height:7px;border:1px solid var(--quiet-brass);border-radius:50%;content:"" }

/* 16. Academic References */
.references { background: var(--field-paper); }.reference-intro { grid-column:2;display:grid;gap:1rem;margin-top:1rem;color:var(--muted-graphite);font-size:.9rem }.profile-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4) }.profile { position:relative;padding:var(--space-4);border:var(--border);background:var(--white);box-shadow:var(--shadow) }.profile::after { position:absolute;right:18px;bottom:18px;width:52px;height:38px;border:1px solid currentColor;opacity:.22;content:"" }.profile-top { display:flex;align-items:flex-start;justify-content:space-between;min-height:80px }.avatar { display:grid;width:64px;height:64px;place-items:center;border:1px solid currentColor;font-family:var(--font-editorial);font-size:1.35rem }.profile.language{border-top:3px solid var(--dialect-plum)}.profile.seismic{border-top:3px solid var(--seismic-ochre)}.profile.microbial{border-top:3px solid var(--microbial-fern)}.profile.alternate .profile-top{flex-direction:row-reverse}.profile h3{margin:.7rem 0}.profile p{margin-top:.75rem;font-size:.88rem}.profile .role{color:var(--midnight-teal);font-weight:700}.minor-role{color:var(--muted-graphite)}.profile ul{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:1rem;list-style:none}.profile li{padding:.15rem .35rem;background:var(--cool-paper);font-family:var(--font-mono);font-size:.62rem}.orcid{letter-spacing:.04em!important}.contact{position:relative;z-index:2;display:grid;gap:.5rem;margin-top:1.2rem;padding-top:1rem;border-top:var(--border);font-size:.78rem}.contact a{overflow-wrap:anywhere}.copy-email{justify-self:start;padding:.45rem .7rem;border:1px solid var(--midnight-teal);background:transparent;color:var(--midnight-teal);cursor:pointer}.status{font-family:var(--font-mono);font-size:.72rem!important;font-weight:700;text-transform:uppercase}

/* 17. Independence Note */
.independence { max-width:960px;margin:var(--space-6) auto 0;padding:var(--space-5);border-left:4px solid var(--survey-blue);background:var(--survey-mist) }.independence h2{margin:1rem 0;font-size:clamp(1.8rem,3vw,2.8rem)}.independence p+p{margin-top:.75rem}

/* 18. Field Notes */
.notes { background:var(--cool-paper) }.notes-grid { display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3) }.field-note details { height:100%;border:var(--border);background:var(--white) }.field-note summary { min-height:250px;padding:var(--space-4);cursor:pointer;list-style:none }.field-note summary::-webkit-details-marker{display:none}.field-note summary>span{font-family:var(--font-mono);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.field-note summary h3{margin:3rem 0 1rem}.field-note summary::after{display:block;margin-top:1.5rem;color:var(--survey-blue);font-family:var(--font-mono);font-size:.72rem;content:"OPEN NOTE +"}.field-note details[open] summary::after{content:"CLOSE NOTE −"}.field-note.language details{border-left:3px solid var(--dialect-plum)}.field-note.seismic details{border-left:3px solid var(--seismic-ochre)}.field-note.microbial details{border-left:3px solid var(--microbial-fern)}.field-note.comparative details{border-left:3px solid var(--survey-blue)}.note-body{padding:0 var(--space-4) var(--space-4);border-top:var(--border)}.note-body>p{padding-top:var(--space-3)}.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}.tags span{padding:.2rem .45rem;background:var(--cool-paper);font-family:var(--font-mono);font-size:.65rem}

/* 19. Search */
.search-panel { display:grid;grid-template-columns:1fr auto;gap:.5rem 1rem;align-items:end;margin-bottom:var(--space-5);padding:var(--space-4);border:var(--border);background:var(--field-paper) }.search-panel label{grid-column:1/-1;font-family:var(--font-mono);font-size:.8rem;font-weight:700;text-transform:uppercase}.search-row{display:flex}.search-row input{width:100%;min-height:52px;padding:0 1rem;border:1px solid var(--cool-slate);border-radius:0;background:var(--white)}.search-row button{border:0;border-left:1px solid var(--cool-slate);background:var(--midnight-teal);color:var(--white);cursor:pointer;white-space:nowrap}.search-panel>p{padding-bottom:.8rem;font-family:var(--font-mono);font-size:.8rem}.no-results{padding:4rem;text-align:center;font-family:var(--editorial);font-size:1.5rem}

/* 20. About */
.about-grid{align-items:start}.about-copy h2{margin:1rem 0 2rem}.about-copy p+p{margin-top:1rem}.principles{display:grid;grid-template-columns:1fr 1fr;border-top:var(--border);border-left:var(--border)}.principles article{min-height:260px;padding:var(--space-4);border-right:var(--border);border-bottom:var(--border)}.principles span{font-family:var(--font-mono);font-size:.75rem}.principles h3{margin:3rem 0 1rem;font-size:1.45rem}

/* 21. Final CTA */
.final-cta{background:var(--brass-wash)!important}.final-visual{position:relative;min-height:520px}.final-window{position:absolute;width:43%;height:32%;padding:1rem;border:2px solid var(--survey-blue);font-family:var(--font-mono);font-size:.68rem}.final-window i{position:absolute;inset:25px -12px -10px 18px;border:1px solid currentColor}.final-window span{position:absolute;bottom:10px;left:10px}.w-place{top:0;left:4%;color:var(--dialect-plum)}.w-depth{top:12%;right:2%;color:var(--seismic-ochre)}.w-time{bottom:5%;left:12%;color:var(--survey-blue)}.w-community{right:5%;bottom:0;color:var(--microbial-fern)}.final-center{position:absolute;z-index:2;top:44%;left:38%;padding:1rem;background:var(--midnight-teal);color:var(--white);font-family:var(--font-mono);font-weight:700;letter-spacing:.12em}.final-center small{display:block;margin-top:.3rem;color:var(--quiet-brass);font-size:.55rem}.final-visual::after{position:absolute;top:51%;left:5%;width:90%;height:1px;background:var(--quiet-brass);content:""}.final-copy h2{margin:1rem 0 1.5rem}

/* 22. Footer */
.site-footer{padding:var(--space-6) 0 var(--space-4);background:var(--midnight-teal);color:var(--white)}.footer-grid{display:grid;grid-template-columns:1.3fr 1fr auto;gap:var(--space-5);align-items:start}.footer-grid img{width:58px;filter:brightness(0) invert(1)}.footer-grid h2{margin:1rem 0 .5rem;color:var(--white);font-size:2rem}.footer-grid p{max-width:48ch;font-size:.85rem}.footer-grid nav{display:grid;gap:.35rem}.footer-grid a{text-decoration:none}.footer-grid a:hover{text-decoration:underline}.back-top{font-family:var(--font-mono);font-size:.75rem}.copyright{margin-top:var(--space-5);padding-top:var(--space-3);border-top:1px solid rgba(255,255,255,.15);font-size:.75rem}

/* 23. Reveal */
.js-enabled .reveal{opacity:0;transform:translateY(20px);transition:opacity 600ms ease,transform 600ms ease}.js-enabled .reveal.is-visible{opacity:1;transform:none}

/* 24. Responsive */
@media (max-width:1080px){.brand{flex-basis:210px}.brand img{width:210px}#primary-navigation{gap:.55rem}#primary-navigation a{font-size:.64rem}.landscape-grid{grid-template-columns:1fr 1fr}.landscape{border-bottom:var(--border)}.landscape:nth-child(2){border-right:0}.profile-grid{grid-template-columns:1fr 1fr}.method-item:nth-child(n){grid-column:span 6}}
@media (max-width:860px){.menu-toggle{display:block}.brand{flex-basis:230px}.brand img{width:230px}#primary-navigation{position:absolute;top:100%;left:0;display:none;width:100%;padding:1rem 20px 1.5rem;background:var(--midnight-teal);box-shadow:0 20px 30px rgba(0,0,0,.2)}#primary-navigation.is-open{display:grid}#primary-navigation a{padding:.5rem 0;font-size:.8rem}.hero-grid,.about-grid,.final-grid{grid-template-columns:1fr}.hero-windows{min-height:620px;margin-top:2rem}.section-heading{grid-template-columns:1fr}.reference-intro{grid-column:1}.study{grid-template-columns:1fr}.study-visual{min-height:300px}.checklist{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.back-top{grid-column:1/-1}.final-copy{grid-row:1}}
@media (max-width:640px){.container{width:min(calc(100% - 28px),var(--container))}.section{padding-block:4.5rem}.header-inner{min-height:68px}.brand{flex-basis:200px}.brand img{width:200px}.hero{padding-top:4rem}.hero-windows{display:grid;gap:3rem;min-height:0}.context-window{position:relative!important;inset:auto!important;width:calc(100% - 16px)!important;height:250px!important}.context-window .inner-frame{inset:24px -12px 42px 18px}.context-window .window-copy{right:auto;left:26px;top:74px;width:calc(100% - 48px)}.microbial-window .window-copy{top:65px}.window-caption{position:relative}.band-grid,.landscape-grid,.profile-grid,.notes-grid,.principles{grid-template-columns:1fr}.band-grid p{padding-block:1rem;border-bottom:1px solid rgba(255,255,255,.1)}.landscape{min-height:340px;border-right:0}.landscape h3{margin-top:3rem}.study-columns{grid-template-columns:1fr}.method-grid{grid-template-columns:1fr}.method-item:nth-child(n){grid-column:auto}.checklist ul{columns:1}.search-panel{grid-template-columns:1fr}.search-row{grid-column:1}.search-panel>p{padding:0}.footer-grid{grid-template-columns:1fr}.footer-grid nav{margin-top:1rem}.final-visual{min-height:450px}.final-window{width:49%;height:31%}.final-center{left:28%}}

/* 25. Reduced Motion */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js-enabled .reveal{opacity:1;transform:none}.button:hover{transform:none}}
