/* 01. Design tokens */
:root{--ink:#26212C;--teal:#39767A;--ember:#B45E49;--olive:#9B9D52;--violet:#786B80;--slate:#61727D;--sand:#C59A68;--pale-teal:#DDE9E7;--soft-violet:#E9E3EC;--ember-wash:#F1E2DD;--olive-wash:#ECEBD8;--paper:#F7F3EB;--cool:#EDF0F1;--graphite:#373C40;--muted:#777D81;--white:#FFF;--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;--step--1:clamp(.78rem,.74rem + .14vw,.88rem);--step-0:clamp(.95rem,.9rem + .2vw,1.08rem);--step-1:clamp(1.18rem,1.08rem + .4vw,1.42rem);--step-2:clamp(1.5rem,1.3rem + .8vw,2rem);--step-3:clamp(2rem,1.55rem + 1.8vw,3.2rem);--step-4:clamp(2.7rem,1.85rem + 3.2vw,5.2rem);--space-xs:.5rem;--space-sm:.85rem;--space-md:1.35rem;--space-lg:2.2rem;--space-xl:clamp(3.5rem,7vw,7.5rem);--container:1200px;--line:1px solid rgba(38,33,44,.18);--radius:3px;--shadow:0 16px 35px rgba(38,33,44,.08);--transition:220ms ease}
/* 02. Reset */
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body,h1,h2,h3,p,ul,dl,dd{margin:0}ul{padding:0}img{max-width:100%;display:block}button,input{font:inherit}a{color:inherit}
/* 03. Base */
body{background:var(--paper);color:var(--graphite);font-family:var(--font-sans);font-size:var(--step-0);line-height:1.65;overflow-x:hidden}section{scroll-margin-top:6rem}.container{width:min(calc(100% - 2.5rem),var(--container));margin-inline:auto}.section{padding:var(--space-xl) 0}.section-lede{max-width:790px;font-size:var(--step-1);color:var(--slate)}
/* 04. Accessibility */
.skip-link{position:fixed;z-index:1000;top:.75rem;left:.75rem;padding:.65rem 1rem;background:var(--white);color:var(--ink);transform:translateY(-180%)}.skip-link:focus{transform:none}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--olive);outline-offset:4px}
/* 05. Typography */
h1,h2,h3{font-family:var(--font-editorial);color:var(--ink);font-weight:500;line-height:1.08}h1{font-size:var(--step-4);letter-spacing:-.035em}h1 em{color:var(--teal);font-style:italic}h2{font-size:var(--step-3);max-width:850px;margin-bottom:var(--space-lg)}h3{font-size:var(--step-2)}.eyebrow,.category,.orcid,.micro-label,.reference-label{font-family:var(--font-mono);font-size:var(--step--1);font-weight:700;letter-spacing:.12em;text-transform:uppercase}.eyebrow{color:var(--teal);margin-bottom:var(--space-md)}
/* 06. Layout */
.button-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:var(--space-lg)}.button{display:inline-flex;align-items:center;justify-content:center;min-height:3.1rem;padding:.75rem 1.2rem;border:1px solid var(--ink);text-decoration:none;font-weight:700;font-size:.92rem;transition:background var(--transition),color var(--transition),transform var(--transition)}.button:hover{transform:translateY(-2px)}.primary{background:var(--ink);color:var(--white)}.secondary{background:transparent}.tags{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none}.tags li{padding:.2rem .55rem;border:var(--line);font-family:var(--font-mono);font-size:.72rem}
/* 07. Header */
.site-header{position:sticky;z-index:100;top:0;background:rgba(247,243,235,.96);border-bottom:var(--line)}.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{width:275px}.brand img{width:100%}#primary-navigation{display:flex;align-items:center;gap:clamp(.6rem,1.15vw,1.15rem);font-size:.75rem;font-weight:700}#primary-navigation a{text-decoration:none;white-space:nowrap}#primary-navigation a:hover{color:var(--teal)}.nav-cta{padding:.65rem .8rem;border:1px solid var(--ink)}.menu-toggle{display:none;background:none;border:0;padding:.5rem}.menu-toggle span{display:block;width:25px;height:2px;margin:5px;background:var(--ink)}
/* 08. Hero */
.hero{padding:clamp(4rem,8vw,8rem) 0;background:linear-gradient(90deg,transparent 0 50%,rgba(221,233,231,.4) 50%)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,6vw,6rem);align-items:center}.hero-lede{margin-top:var(--space-lg);max-width:680px;font-size:var(--step-1)}.micro-label{margin-top:2.2rem;color:var(--muted)}.micro-label span{display:inline-block;width:28px;height:2px;margin-right:.45rem;background:var(--olive);vertical-align:middle}
/* 09. State Board */
.state-board{background:var(--white);border:1px solid var(--ink);box-shadow:var(--shadow);padding:clamp(1rem,2.5vw,2rem)}.board-heading{display:flex;justify-content:space-between;border-bottom:var(--line);padding-bottom:.85rem;margin-bottom:1.2rem;font:700 .7rem var(--font-mono);letter-spacing:.11em;text-transform:uppercase}.board-note{padding-top:1rem;border-top:var(--line);font-size:.78rem;color:var(--muted)}
/* 10. State Slices */
.state-slice{--accent:var(--teal);padding:.8rem 0 1.2rem}.state-slice.climate{--accent:var(--ember)}.state-slice.dynamics{--accent:var(--violet)}.slice-head{display:flex;justify-content:space-between;gap:1rem;font:700 .68rem var(--font-mono);letter-spacing:.09em;text-transform:uppercase}.slice-head span{color:var(--accent)}.slice-track{height:11px;margin:.65rem 0;background:color-mix(in srgb,var(--accent) 25%,white);position:relative}.slice-track i{position:absolute;left:58%;top:-5px;width:3px;height:21px;background:var(--olive)}.state-slice:nth-of-type(3) .slice-track i{left:42%}.state-slice:nth-of-type(4) .slice-track i{left:68%}.slice-track .point{position:absolute;right:8%;top:3px;width:5px;height:5px;border-radius:50%;background:var(--ink)}.state-slice dl{display:grid;grid-template-columns:.75fr 1.25fr 1.3fr;gap:.5rem}.state-slice dt{font:700 .6rem var(--font-mono);text-transform:uppercase;color:var(--muted)}.state-slice dd{font-size:.69rem;line-height:1.35}
/* 11. Transition Strip */
.transition-strip{padding:3rem 0;background:var(--ink);color:var(--white)}.transition-strip .container{display:grid;grid-template-columns:1.1fr 1.9fr;gap:4rem}.transition-strip .eyebrow{color:var(--olive)}.strip-intro>p:last-child{font-family:var(--font-editorial);font-size:var(--step-1)}.strip-points{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:end}.strip-points p{padding-top:1.1rem;border-top:1px solid var(--olive);font-weight:600}
/* 12. Change Domains */
.domain-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:var(--line);border-left:var(--line)}.domain{--accent:var(--teal);min-height:450px;padding:1.5rem;border-right:var(--line);border-bottom:var(--line);display:flex;flex-direction:column}.domain.futures{--accent:var(--slate)}.domain.climate{--accent:var(--ember)}.domain.dynamics{--accent:var(--violet)}.domain>span{font:700 .8rem var(--font-mono);color:var(--accent)}.domain h3{margin:2.4rem 0 1.3rem}.domain p{font-size:.9rem}.domain .tags{margin-top:auto;padding-top:1.5rem}.domain .tags li{border-color:var(--accent);color:var(--accent)}
/* 13. Comparative Views */
.comparative{background:var(--cool)}.view{--accent:var(--teal);display:grid;grid-template-columns:1.25fr 1fr 1fr 1.1fr;margin-top:1.3rem;border-top:4px solid var(--accent);background:var(--white)}.view.climate{--accent:var(--ember)}.view.dynamics{--accent:var(--violet)}.view>div,.view>aside{padding:1.5rem;border-right:var(--line)}.view span,.view b{font:700 .72rem var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.view h3{margin:.8rem 0}.view p{font-size:.86rem;margin-top:.7rem}.view aside{background:color-mix(in srgb,var(--accent) 9%,white)}
/* 14. State Method */
.method-list{border-top:1px solid var(--ink)}.method-step{display:grid;grid-template-columns:70px minmax(220px,.7fr) 1.3fr;gap:1.5rem;align-items:start;padding:1.4rem;border-bottom:var(--line);position:relative}.method-step::after{content:"";position:absolute;left:var(--marker,63%);top:0;width:3px;height:18px;background:var(--olive)}.method-step:nth-child(2){--marker:48%}.method-step:nth-child(3){--marker:72%}.method-step:nth-child(4){--marker:39%}.method-step:nth-child(5){--marker:58%}.method-step:nth-child(6){--marker:78%}.method-step:nth-child(7){--marker:44%}.method-step>span{font:700 .78rem var(--font-mono);color:var(--olive)}.method-step h3{font-size:var(--step-1);text-transform:uppercase}.method-step p{max-width:630px}
/* 15. Change Checklist */
.checklist{margin-top:var(--space-xl);padding:clamp(1.5rem,4vw,3.5rem);background:var(--olive-wash);display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;border-left:6px solid var(--olive)}.checklist ul{columns:2;column-gap:2.5rem;list-style:none}.checklist li{break-inside:avoid;padding:.5rem 0 .5rem 1.3rem;border-bottom:1px solid rgba(38,33,44,.12);position:relative}.checklist li::before{content:"□";position:absolute;left:0;color:var(--olive)}
/* 16. Academic References */
.references{background:var(--white)}.platform-note{margin:2rem 0;padding:1.2rem 1.5rem;background:var(--olive-wash);display:flex;gap:1.5rem}.profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.profile{--accent:var(--teal);display:flex;flex-direction:column;padding:1.5rem;border:var(--line);border-top:5px solid var(--accent);background:var(--paper)}.profile.climate{--accent:var(--ember)}.profile.dynamics{--accent:var(--violet)}.profile-top{display:flex;justify-content:space-between;align-items:center}.avatar{width:48px;height:48px;display:grid;place-items:center;background:var(--accent);color:var(--white);font:700 1rem var(--font-mono)}.category{color:var(--accent)}.profile h3{margin:1.4rem 0 .4rem}.profile p{font-size:.82rem;margin:.5rem 0}.profile .role{font-weight:700;color:var(--accent)}.profile .institution{min-height:5.5rem}.profile .tags{margin:1rem 0}.orcid{color:var(--muted)}.mini-slice{height:10px;background:color-mix(in srgb,var(--accent) 25%,white);margin:1rem 0;position:relative}.mini-slice i{position:absolute;left:35%;top:-4px;width:3px;height:18px;background:var(--olive)}.offset-two i{left:55%}.offset-three i{left:72%}.offset-four i{left:43%}.offset-five i{left:64%}.offset-six i{left:27%}.contact{margin-top:auto;padding-top:1rem;border-top:var(--line);display:grid;gap:.4rem}.contact span,.reference-label{font:700 .7rem var(--font-mono);color:var(--accent);text-transform:uppercase}.contact a{font-size:.78rem;overflow-wrap:anywhere}.copy-email{justify-self:start;border:1px solid var(--accent);padding:.4rem .65rem;background:transparent;color:var(--accent);cursor:pointer}.reference-label{margin-top:auto!important;padding-top:1rem;border-top:var(--line)}
/* 17. Independence Note */
.independence{padding:4rem 0;background:var(--soft-violet)}.independence .container{display:grid;grid-template-columns:80px .9fr 1.4fr;gap:2.5rem;align-items:start}.independence img{width:70px}.independence h2{font-size:var(--step-2)}.independence p+p{margin-top:1rem}
/* 18. Research Notes */
.notes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.research-note{background:var(--white);border:var(--line)}.research-note[hidden]{display:none}.research-note details{padding:1.3rem}.research-note summary{cursor:pointer;list-style:none;padding-right:2rem;position:relative}.research-note summary::-webkit-details-marker{display:none}.research-note summary::after{content:"+";position:absolute;right:0;top:0;font:400 1.6rem var(--font-mono);color:var(--olive)}.research-note details[open] summary::after{content:"−"}.research-note summary span{font:700 .7rem var(--font-mono);color:var(--teal);text-transform:uppercase;letter-spacing:.09em}.research-note h3{margin:.7rem 0;font-size:var(--step-1)}.research-note p{font-size:.88rem}.research-note details>p{margin-top:1.4rem;padding-top:1.2rem;border-top:var(--line)}.research-note .tags{margin-top:1rem}.no-results{padding:3rem;text-align:center;border:var(--line);background:var(--white)}
/* 19. Search */
.search-panel{display:grid;grid-template-columns:180px 1fr auto;gap:1rem;align-items:center;margin:2.5rem 0;padding:1rem;border-block:1px solid var(--ink)}.search-panel label{font-weight:700}.search-panel>div{display:flex}.search-panel input{width:100%;padding:.8rem;border:1px solid var(--muted);background:var(--white)}.search-panel button{border:1px solid var(--ink);background:var(--ink);color:var(--white);padding:.7rem 1rem;cursor:pointer}.search-panel p{font-family:var(--font-mono);white-space:nowrap}
/* 20. About */
.about{background:var(--ember-wash)}.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:3rem}.about-copy p+p{margin-top:1rem}.principles{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ember)}.principles article{padding:1.5rem;border-right:1px solid rgba(180,94,73,.35)}.principles span{font:700 .75rem var(--font-mono);color:var(--ember)}.principles h3{font-size:var(--step-1);margin:1rem 0}
/* 21. Final CTA */
.final-cta{padding:var(--space-xl) 0;background:var(--teal);color:var(--white)}.final-cta h2,.final-cta .eyebrow{color:var(--white)}.final-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.light{background:var(--white);border-color:var(--white);color:var(--ink)}.outline{border-color:var(--white);color:var(--white)}.diagonal{min-height:340px;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;position:relative;transform:rotate(-5deg);border-block:1px solid rgba(255,255,255,.45)}.diagonal b{text-align:center;font:700 .74rem var(--font-mono);letter-spacing:.1em;text-transform:uppercase}.diagonal i{width:36px;height:36px;display:grid;place-items:center;background:var(--olive);font:normal 1rem var(--font-mono)}.diagonal span{position:absolute;font:700 .7rem var(--font-mono);text-transform:uppercase;letter-spacing:.13em}.uncertainty{top:2rem;left:36%}.scale{right:12%;bottom:2rem}
/* 22. Footer */
footer{padding:4rem 0 1.5rem;background:var(--ink);color:var(--white)}.footer-grid{display:grid;grid-template-columns:1.2fr 1fr auto;gap:3rem}.footer-grid img{width:54px;margin-bottom:1rem}.footer-grid h2{color:var(--white);font-size:var(--step-2);margin-bottom:.5rem}.footer-grid nav{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.footer-grid a{text-decoration:none}.back-top{align-self:start}.copyright{margin-top:3rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.2);font-size:.8rem;color:rgba(255,255,255,.65)}
/* 23. Reveal */
.js-enabled .reveal{opacity:0;transform:translateY(20px);transition:opacity 650ms ease,transform 650ms ease}.js-enabled .reveal.is-visible{opacity:1;transform:none}
/* 24. Responsive */
@media (max-width:1100px){.brand{width:230px}#primary-navigation{position:absolute;right:1.25rem;top:68px;width:min(350px,calc(100vw - 2.5rem));padding:1rem;background:var(--paper);border:1px solid var(--ink);box-shadow:var(--shadow);align-items:stretch;flex-direction:column}.js-enabled #primary-navigation{display:none}.js-enabled #primary-navigation.is-open{display:flex}.js-enabled .menu-toggle{display:block}.domain-grid{grid-template-columns:repeat(2,1fr)}.profile-grid{grid-template-columns:repeat(2,1fr)}.view{grid-template-columns:1fr 1fr}.view>aside{grid-column:span 2}.hero-grid{grid-template-columns:1fr}.hero{background:none}.state-board{max-width:760px}.strip-points{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.container{width:min(calc(100% - 1.5rem),var(--container))}.brand{width:205px}.header-inner{min-height:68px}.hero{padding:3.5rem 0}.state-slice dl{grid-template-columns:1fr}.state-slice dl div{display:grid;grid-template-columns:115px 1fr}.transition-strip .container,.about-grid,.final-grid,.independence .container{grid-template-columns:1fr;gap:2rem}.strip-points,.domain-grid,.profile-grid,.notes-grid,.principles{grid-template-columns:1fr}.domain{min-height:auto}.view{grid-template-columns:1fr}.view>aside{grid-column:auto}.method-step{grid-template-columns:40px 1fr}.method-step>div{grid-column:2}.checklist{grid-template-columns:1fr}.checklist ul{columns:1}.platform-note{display:block}.platform-note b{display:block;margin-bottom:.5rem}.search-panel{grid-template-columns:1fr}.search-panel>div{flex-wrap:wrap}.search-panel button{width:100%}.footer-grid{grid-template-columns:1fr}.profile .institution{min-height:auto}.diagonal{min-height:270px;transform:none;grid-template-columns:1fr;gap:.5rem;padding:3rem 0}.diagonal i{margin:auto;transform:rotate(90deg)}.uncertainty{top:.7rem;left:0}.scale{right:0;bottom:.7rem}}
@media (max-width:380px){h1{font-size:2.45rem}.button{width:100%}.state-board{padding:.8rem}.slice-head{display:grid}.state-slice dl div{grid-template-columns:90px 1fr}.footer-grid nav{grid-template-columns:1fr}}
/* 25. Reduced Motion */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js-enabled .reveal{opacity:1;transform:none}}