/* 01. Design tokens */
:root{--midnight:#202A35;--indigo:#5967B2;--eucalyptus:#477B6B;--coral:#C36B58;--saffron:#D0A449;--chalk:#FAF8F1;--frost:#E8EFF1;--lilac:#ECEAF4;--green-mist:#E5EEE9;--ink:#303840;--muted:#778087;--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;--fs-sm:clamp(.74rem,.7rem + .15vw,.82rem);--fs-body:clamp(.98rem,.92rem + .2vw,1.08rem);--fs-h3:clamp(1.25rem,1.05rem + .7vw,1.65rem);--fs-h2:clamp(2rem,1.45rem + 2.4vw,3.6rem);--fs-h1:clamp(2.75rem,1.8rem + 3.7vw,5.25rem);--space:clamp(4.5rem,9vw,8.5rem);--container:1200px;--border:1px solid rgba(32,42,53,.18);--radius:14px;--shadow:0 18px 50px rgba(32,42,53,.09);--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,svg{display:block;max-width:100%}button,input{font:inherit}a{color:inherit}button{cursor:pointer}
/* 03. Base */
body{background:var(--chalk);color:var(--ink);font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.65;overflow-x:hidden}main:focus{outline:none}[hidden]{display:none!important}::selection{background:var(--saffron);color:var(--midnight)}
/* 04. Accessibility */
.skip-link{position:fixed;z-index:1000;top:1rem;left:1rem;padding:.75rem 1rem;background:var(--white);color:var(--midnight);transform:translateY(-180%);transition:transform var(--transition)}.skip-link:focus{transform:none}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--saffron);outline-offset:4px}
/* 05. Typography */
h1,h2,h3{color:var(--midnight);font-family:var(--font-editorial);font-weight:500;line-height:1.08}h1{font-size:var(--fs-h1);letter-spacing:-.045em}h2{font-size:var(--fs-h2);letter-spacing:-.035em}h3{font-size:var(--fs-h3)}h1 em{color:var(--indigo);font-style:italic}.eyebrow,.index,.status,.orcid,.canvas-title,.zone-note strong,.rule-label,.transform-copy>span{font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:700;letter-spacing:.12em}.eyebrow{color:var(--indigo);margin-bottom:1.2rem}.lede{font-size:clamp(1.08rem,1rem + .4vw,1.3rem);max-width:42rem}
/* 06. Global layout */
.container{width:min(calc(100% - 2.5rem),var(--container));margin-inline:auto}.section{padding-block:var(--space)}.section-head{max-width:820px;margin-bottom:clamp(2.5rem,5vw,5rem)}.section-head>p:last-child{max-width:680px;margin-top:1.4rem}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;margin-top:2rem}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.7rem 1.25rem;text-decoration:none;font-weight:700;font-size:.92rem;border:1px solid transparent}.primary{background:var(--midnight);color:var(--white)}.primary:hover{background:var(--indigo)}.text-button{border-bottom-color:var(--midnight);padding-inline:.25rem}.text-button span{margin-left:.5rem}.micro{margin-top:2rem;color:var(--muted);font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em}
/* 07. Header */
.site-header{position:sticky;z-index:100;top:0;background:rgba(250,248,241,.96);border-bottom:var(--border)}.header-inner{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{width:clamp(220px,25vw,320px)}.brand img{width:100%}.site-header nav{display:flex;align-items:center;gap:clamp(.8rem,1.35vw,1.5rem)}.site-header nav a{text-decoration:none;font-size:.78rem;font-weight:650;white-space:nowrap}.site-header nav a:hover{color:var(--indigo)}.nav-cta{padding:.6rem .8rem;border:1px solid var(--midnight)}.menu-toggle{display:none;background:none;border:0;padding:.5rem}.menu-toggle span{display:block;width:25px;height:2px;margin:5px;background:var(--midnight)}
/* 08. Hero */
.hero{padding:clamp(4rem,8vw,8rem) 0 clamp(4rem,7vw,6.5rem)}.hero-grid{display:grid;grid-template-columns:48fr 52fr;gap:clamp(2.5rem,5vw,6rem);align-items:center}.hero-copy{position:relative}.hero-copy::before{content:"NEIGHBOR";position:absolute;top:-3rem;right:0;color:rgba(89,103,178,.12);font:700 .7rem var(--font-mono);letter-spacing:.2em}.hero-copy .lede{margin-top:1.7rem}
/* 09. Local-view canvas */
.local-canvas{position:relative;min-height:570px;background:var(--frost);border:var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.local-canvas::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(32,42,53,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(32,42,53,.04) 1px,transparent 1px);background-size:32px 32px}.canvas-title{position:absolute;z-index:2;top:1.4rem;left:1.5rem;color:var(--midnight)}.canvas-lines{position:absolute;inset:0;width:100%;height:100%;color:rgba(32,42,53,.25)}.net-nodes{fill:var(--indigo);stroke:none}.lattice{stroke:var(--coral);fill:none}.lattice circle{fill:var(--coral);stroke:none}.zone-note{position:absolute;z-index:3;display:grid;gap:.25rem;width:150px;font-size:.72rem;line-height:1.35}.zone-note strong{color:var(--indigo)}.zone-note span{color:var(--muted)}.note-network{left:6%;top:38%}.note-vision{right:5%;top:10%}.note-material{right:5%;bottom:7%}.vision-shapes{position:absolute;right:12%;top:19%;width:155px;height:115px}.vision-shapes span{position:absolute;background:var(--eucalyptus);opacity:.75}.vision-shapes span:nth-child(1){inset:2px 83px 57px 3px}.vision-shapes span:nth-child(2){inset:15px 32px 41px 78px}.vision-shapes span:nth-child(3){inset:64px 94px 2px 17px}.vision-shapes span:nth-child(4){inset:69px 42px 8px 68px}.vision-shapes span:nth-child(5){inset:47px 4px 13px 118px}.rule-core{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;gap:.4rem}.rule-core img{width:52px}.rule-core span{padding:.35rem .55rem;background:var(--midnight);color:var(--white);font:700 .64rem var(--font-mono);letter-spacing:.12em}.canvas-foot{position:absolute;left:1.5rem;bottom:1.25rem;color:var(--muted);font:600 .68rem var(--font-mono);letter-spacing:.09em}
/* 10. Focus brackets */
.focus{position:absolute;z-index:3;width:120px;height:100px}.focus i{position:absolute;width:18px;height:18px}.focus i:nth-child(1){top:0;left:0;border-top:2px solid var(--saffron);border-left:2px solid var(--saffron)}.focus i:nth-child(2){top:0;right:0;border-top:2px solid var(--saffron);border-right:2px solid var(--saffron)}.focus i:nth-child(3){bottom:0;right:0;border-right:2px solid var(--saffron);border-bottom:2px solid var(--saffron)}.focus i:nth-child(4){bottom:0;left:0;border-bottom:2px solid var(--saffron);border-left:2px solid var(--saffron)}.focus b{position:absolute;bottom:-1.5rem;color:var(--saffron);font:700 .63rem var(--font-mono);letter-spacing:.1em}.focus-net{left:19%;top:15%}.focus-vision{right:15%;top:17%;width:105px;height:90px}.focus-cell{right:19%;bottom:17%;width:110px;height:100px}
/* 11. Local-to-global strip */
.global-strip{padding:3.4rem 0;background:var(--midnight);color:var(--white)}.global-strip h2{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.5rem);color:var(--white)}.global-strip .eyebrow{color:var(--saffron)}.strip-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;align-items:end}.strip-grid ul{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 2rem;list-style:none;font-size:.9rem}.strip-grid li::before{content:"+";color:var(--saffron);margin-right:.7rem}
/* 12. Neighborhoods */
.perspective-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:var(--border);border-left:var(--border)}.perspective{min-width:0;padding:2rem 1.35rem;border-right:var(--border);border-bottom:var(--border)}.perspective:nth-child(1){background:var(--frost)}.perspective:nth-child(2){background:var(--lilac)}.perspective:nth-child(3){background:var(--white)}.perspective:nth-child(4){background:var(--green-mist)}.perspective .index{display:block;color:var(--indigo);margin-bottom:3.5rem}.perspective p{margin:1.2rem 0 1.5rem;font-size:.9rem}.perspective ul{list-style:none;font:600 .72rem/1.8 var(--font-mono);color:var(--muted)}
/* 13. Transformations */
.transformations{background:var(--white)}.transformation{display:grid;grid-template-columns:180px 90px 1fr;min-height:210px;align-items:center;border-top:var(--border)}.transformation:last-child{border-bottom:var(--border)}.mini-structure{position:relative;width:120px;height:100px}.mini-structure i{position:absolute;width:17px;height:17px;background:var(--indigo);border-radius:50%}.mini-structure i:nth-child(1){left:8px;top:46px}.mini-structure i:nth-child(2){left:57px;top:15px}.mini-structure i:nth-child(3){right:8px;bottom:10px}.mini-structure::before,.mini-structure::after{content:"";position:absolute;width:62px;height:1px;background:var(--coral);transform-origin:left}.mini-structure::before{left:20px;top:49px;transform:rotate(-31deg)}.mini-structure::after{left:65px;top:28px;transform:rotate(51deg)}.regions i{border-radius:0;background:var(--eucalyptus)}.bonds i{background:var(--coral)}.rule-label{color:var(--saffron);position:relative}.rule-label::before,.rule-label::after{content:"";position:absolute;top:50%;height:1px;background:rgba(32,42,53,.2)}.rule-label::before{width:38px;right:calc(100% + 8px)}.rule-label::after{width:38px;left:calc(100% + 8px)}.transform-copy{padding:2rem 0 2rem 2rem}.transform-copy>span{color:var(--indigo)}.transform-copy h3{max-width:750px;margin:.65rem 0}.transform-copy p{color:var(--muted);font:600 .72rem var(--font-mono)}
/* 14. Rule method */
.method-section{background:var(--green-mist)}.method-grid{display:grid;grid-template-columns:1fr 1fr;max-width:850px}.method-grid article{position:relative;padding:2rem;min-height:180px;border:var(--border);margin:-1px 0 0 -1px}.method-grid article:nth-child(3){grid-row:2;grid-column:1}.method-grid article:nth-child(4){grid-row:2;grid-column:2}.method-grid article:nth-child(5){grid-row:3;grid-column:2}.method-grid b{color:var(--saffron);font:700 1rem var(--font-mono)}.method-grid h3{margin:.8rem 0}.method-grid p{font-size:.9rem}.checklist{display:grid;grid-template-columns:.8fr 1.2fr;gap:4rem;margin-top:5rem;padding:clamp(2rem,5vw,4rem);background:var(--midnight);color:var(--white)}.checklist h3{color:var(--white);font-size:clamp(1.5rem,1.1rem + 1.4vw,2.4rem)}.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(255,255,255,.12);font-size:.84rem}.checklist li::before{content:"□";margin-left:-1.3rem;margin-right:.5rem;color:var(--saffron)}
/* 15. Researchers */
.references{background:var(--lilac)}.contact-note{margin-top:2rem;padding:1.2rem;border-left:3px solid var(--saffron);background:rgba(255,255,255,.5);font-size:.85rem}.contact-note p{margin-top:.25rem!important}.profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}.profile{display:flex;flex-direction:column;padding:1.6rem;background:rgba(255,255,255,.68);border-top:4px solid var(--indigo);box-shadow:0 6px 18px rgba(32,42,53,.04)}.profile.reference{border-top-color:var(--eucalyptus);margin-top:1.5rem}.profile-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font:600 .68rem var(--font-mono)}.avatar{display:grid;place-items:center;width:50px;height:50px;background:var(--midnight);color:var(--white);font-weight:800}.avatar.round{border-radius:50%}.avatar.cut{clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%)}.status{color:var(--indigo);margin:1.5rem 0 .45rem}.profile.reference .status{color:var(--eucalyptus)}.profile h3{margin-bottom:.8rem}.profile>p:not(.status,.institution,.role,.tags,.orcid){font-size:.84rem}.institution{font-weight:700;font-size:.82rem}.role{margin:.45rem 0 1rem;color:var(--muted);font-size:.78rem}.tags{margin-top:1.2rem;color:var(--indigo);font:600 .68rem/1.6 var(--font-mono)}.orcid{margin:.75rem 0 1.3rem;color:var(--muted);font-size:.62rem}.email{margin-top:auto;padding-top:1rem;border-top:var(--border)}.email a{display:block;overflow-wrap:anywhere;font-size:.74rem}.copy-email{margin-top:.75rem;padding:.45rem .7rem;border:1px solid var(--midnight);background:transparent;color:var(--midnight);font-size:.72rem;font-weight:700}.copy-email:hover{background:var(--midnight);color:var(--white)}
/* 16. Independence note */
.independence{padding:clamp(3rem,6vw,5rem) 0;background:var(--coral);color:var(--white)}.independence-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem}.independence h2,.independence .eyebrow{color:var(--white)}.independence-grid>div:last-child{display:grid;gap:1rem;font-size:.93rem}
/* 17. Field cases */
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.case{background:var(--white);border:var(--border)}.case[hidden]{display:none}.case summary{position:relative;min-height:245px;padding:1.6rem 3rem 1.6rem 1.6rem;list-style:none;cursor:pointer}.case summary::-webkit-details-marker{display:none}.case summary::after{content:"+";position:absolute;right:1.6rem;top:1.35rem;font-size:1.5rem;color:var(--indigo)}.case details[open] summary::after{content:"−"}.case summary span{color:var(--indigo);font:700 .7rem var(--font-mono);letter-spacing:.09em}.case summary h3{margin:2rem 0 1rem;max-width:470px}.case summary p{font-size:.88rem;color:var(--muted)}.case-body{padding:1.6rem;border-top:var(--border);background:var(--frost);font-size:.9rem}.case-body .tags{margin-top:1.2rem}.no-results{padding:4rem;text-align:center;border:var(--border);font-family:var(--font-editorial);font-size:1.4rem}
/* 18. Search */
.search-panel{margin-bottom:2rem;padding:1.5rem;background:var(--midnight);color:var(--white)}.search-panel label{display:block;margin-bottom:.7rem;font:700 .75rem var(--font-mono);letter-spacing:.1em}.search-row{display:grid;grid-template-columns:1fr auto auto;gap:.75rem;align-items:center}.search-row input{width:100%;min-height:50px;padding:.75rem 1rem;border:2px solid transparent;border-radius:0}.search-row button{min-height:50px;padding:.5rem 1rem;border:1px solid var(--white);background:transparent;color:var(--white)}.search-row output{min-width:78px;text-align:right;font:700 .78rem var(--font-mono)}
/* 19. About */
.about{background:var(--frost)}.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(3rem,8vw,8rem)}.about-copy{display:grid;gap:1.2rem}.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:5rem;border-top:var(--border)}.principle-grid article{padding:2rem 2rem 0 0}.principle-grid article+article{padding-left:2rem;border-left:var(--border)}.principle-grid b{color:var(--saffron);font:700 1rem var(--font-mono)}.principle-grid h3{margin:1.5rem 0 .8rem}.principle-grid p{font-size:.88rem}
/* 20. Final CTA */
.final-cta{padding:clamp(4rem,9vw,8rem) 0;background:var(--indigo);color:var(--white)}.cta-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:5rem;align-items:center}.cta-number{font:500 clamp(4rem,11vw,9rem)/1 var(--font-editorial);white-space:nowrap;color:rgba(255,255,255,.85)}.cta-number span{color:var(--saffron)}.final-cta h2,.final-cta .eyebrow{color:var(--white)}.final-cta h2{max-width:750px}.final-cta p:not(.eyebrow){max-width:670px;margin-top:1.4rem}.light{background:var(--white);color:var(--midnight)}.text-light{color:var(--white);border-bottom-color:var(--white);padding-inline:.25rem}
/* 21. Footer */
footer{padding:4rem 0 2rem;background:var(--midnight);color:var(--white)}.footer-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:3rem}.footer-brand{display:flex;gap:1rem;align-items:center}.footer-brand img{width:64px}.footer-brand div{display:grid}.footer-brand strong{font:500 1.5rem var(--font-editorial)}.footer-brand span{font-size:.78rem}.footer-brand small{margin-top:.35rem;color:#b6bec5}.footer-grid nav{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.footer-grid nav a{text-decoration:none;font-size:.8rem}.footer-grid>p{grid-column:1/-1;padding-top:2rem;border-top:1px solid rgba(255,255,255,.12);color:#b6bec5;font-size:.75rem}.back-to-top{position:fixed;z-index:50;right:1rem;bottom:1rem;padding:.65rem .8rem;background:var(--saffron);color:var(--midnight);font-size:.72rem;font-weight:800;text-decoration:none;opacity:0;pointer-events:none;transform:translateY(15px);transition:var(--transition)}.back-to-top.is-visible{opacity:1;pointer-events:auto;transform:none}
/* 22. Reveal states */
.reveal{opacity:1;transform:none}.js-enabled .reveal{opacity:0;transform:translateY(24px);transition:opacity 600ms ease,transform 600ms ease}.js-enabled .reveal.is-visible{opacity:1;transform:none}
/* 23. Responsive */
@media(max-width:1050px){.brand{width:220px}.site-header nav{gap:.7rem}.site-header nav a{font-size:.7rem}.nav-cta{display:none}.hero-grid{grid-template-columns:1fr}.hero-copy{max-width:800px}.local-canvas{max-width:720px;width:100%;margin-inline:auto}.perspective-grid{grid-template-columns:1fr 1fr}.profile-grid{grid-template-columns:1fr 1fr}.profile.reference{margin-top:0}.about-grid{gap:3rem}}
@media(max-width:780px){.container{width:min(calc(100% - 2rem),var(--container))}.menu-toggle{display:block}.site-header nav{position:absolute;left:0;right:0;top:78px;display:none;flex-direction:column;align-items:stretch;padding:1rem;background:var(--chalk);border-bottom:var(--border);box-shadow:var(--shadow)}.site-header nav.is-open{display:flex}.site-header nav a{padding:.75rem;font-size:.85rem}.site-header .nav-cta{display:block;text-align:center;background:var(--midnight);color:var(--white)}.strip-grid,.independence-grid,.about-grid,.cta-grid{grid-template-columns:1fr;gap:2.5rem}.strip-grid ul{grid-template-columns:1fr}.transformation{grid-template-columns:110px 60px 1fr}.mini-structure{transform:scale(.7);transform-origin:left}.checklist{grid-template-columns:1fr;gap:2rem}.checklist ul{columns:1}.profile-grid,.case-grid{grid-template-columns:1fr}.principle-grid{grid-template-columns:1fr}.principle-grid article+article{padding-left:0;border-left:0}.principle-grid article{border-bottom:var(--border);padding-bottom:2rem}.footer-grid{grid-template-columns:1fr}.footer-grid>p{grid-column:auto}.cta-number{font-size:5rem}}
@media(max-width:520px){.brand{width:190px}.hero{padding-top:3.5rem}.hero-grid{gap:3rem}.local-canvas{min-height:540px}.canvas-lines{transform:scale(1.22);transform-origin:center}.note-network{top:36%;left:4%}.note-vision{right:3%;top:10%;width:120px}.note-material{right:3%;bottom:7%;width:125px}.vision-shapes{right:5%;top:20%;transform:scale(.8)}.focus-net{left:10%}.focus-vision{right:7%;transform:scale(.8)}.focus-cell{right:8%;bottom:20%;transform:scale(.82)}.rule-core{top:52%}.perspective-grid{grid-template-columns:1fr}.perspective .index{margin-bottom:2rem}.transformation{grid-template-columns:1fr;gap:.5rem;padding:2rem 0}.mini-structure{height:80px}.rule-label::before,.rule-label::after{display:none}.transform-copy{padding:0}.method-grid{grid-template-columns:1fr}.method-grid article:nth-child(n){grid-column:1;grid-row:auto}.search-row{grid-template-columns:1fr auto}.search-row input{grid-column:1/-1}.search-row output{grid-row:2;grid-column:2}.case summary{min-height:0}.footer-grid nav{grid-template-columns:1fr}.footer-brand{align-items:flex-start}.cta-number{font-size:4rem}}
/* 24. Reduced motion */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.js-enabled .reveal{opacity:1;transform:none}}
