:root{--sheet:#fbfaf7;--paper:#edeae3;--ink:#232220;--rule:#494640;--oxide:#c9603f;--slate:#263b45;--mineral:#718994;--moss:#58634a;--on-slate:#fbfaf7;--closing-ink:#232220;--footer:#232220;--footer-ink:#fbfaf7;--display:"Archivo",Arial,sans-serif;--body:"EB Garamond",Georgia,serif;--mono:"Courier Prime","Courier New",monospace;--pad:clamp(1rem,2.8vw,3.5rem)}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sheet);color:var(--ink);font-family:var(--body);font-size:clamp(1.08rem,1.2vw,1.35rem);line-height:1.45}
img{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-color:var(--oxide)}
:focus-visible{outline:3px solid var(--oxide);outline-offset:5px}
.skip-link{position:fixed;z-index:100;top:1rem;left:1rem;padding:.65rem 1rem;background:var(--sheet);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.site-header{position:absolute;z-index:10;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:1.1rem var(--pad);font:600 .78rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.identity{display:flex;gap:.7rem;align-items:center;text-decoration:none}
.identity img{width:2.25rem;height:2.25rem}
.identity span{font-family:var(--display);font-size:1.15rem;letter-spacing:.02em}
.site-header nav{display:flex;gap:clamp(1rem,3vw,3rem)}
.site-header nav a{text-decoration:none;border-bottom:1px solid transparent;padding:.75rem .1rem}
.site-header nav a:hover,.site-header nav a[aria-current]{border-color:currentColor}

.hero{position:relative;height:clamp(42rem,90svh,62rem);min-height:640px;overflow:hidden;background:var(--paper)}
.hero-art,.hero-art img{position:absolute;inset:0;width:100%;height:100%}
.hero-art img{object-fit:cover;object-position:center center}
.hero-copy{position:absolute;z-index:2;top:10.5%;left:35%;width:38%;text-align:center}
.eyebrow,.index,.site-footer,.about-system figcaption{font:400 .7rem/1.35 var(--mono);letter-spacing:.09em;text-transform:uppercase}
.hero-copy h1{margin:.65rem 0 0;font:600 clamp(3rem,4.3vw,5.3rem)/.9 var(--display);letter-spacing:-.05em}
.hero-copy h1 span{display:block;white-space:nowrap}

.surface{padding:clamp(3.75rem,6.2vw,6.5rem) var(--pad)}
.definition{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;background:var(--sheet)}
.definition>.index{grid-column:1/3}
.definition h2{grid-column:3/11;margin:0;font:600 clamp(2.35rem,3.95vw,4.8rem)/1 var(--display);letter-spacing:-.042em}
.definition-side{grid-column:8/12;margin-top:2.25rem;max-width:31rem;border-top:1px solid var(--rule);padding-top:1.1rem}
.definition-side p:first-child{margin-top:0}

.strands{position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem 1.5rem;background:var(--paper)}
.strands>.index{grid-column:1/4}
.strand{position:relative;display:grid;grid-template-columns:2.5rem repeat(7,minmax(0,1fr));column-gap:1rem;align-items:start;border-top:1px solid var(--rule);padding-top:.9rem;min-height:14rem;overflow:hidden}
.strand span{font:400 .7rem var(--mono);color:var(--oxide)}
.strand h3{grid-column:2/6;margin:0;font:600 clamp(3rem,5.1vw,6rem)/.82 var(--display);letter-spacing:-.05em}
.strand p{grid-column:2/6;max-width:30rem;margin:.7rem 0 0}
.strand img{position:absolute;z-index:0;object-fit:cover}
.strand>*:not(img){position:relative;z-index:1}
.strand-one{grid-column:1/10}
.strand-one img{right:0;bottom:0;width:38%;height:76%;clip-path:polygon(8% 0,100% 0,100% 100%,0 88%)}
.strand-two{grid-column:4/13}
.strand-two h3,.strand-two p{grid-column:4/9}
.strand-two>span{grid-column:3}
.strand-two img{left:0;bottom:0;width:26%;height:92%;object-position:center 68%;clip-path:polygon(0 5%,88% 0,100% 92%,12% 100%)}
.strand-three{grid-column:2/11}
.strand-three img{right:0;bottom:0;width:42%;height:74%;clip-path:polygon(10% 5%,100% 0,94% 100%,0 88%)}

.place{display:grid;grid-template-columns:repeat(12,1fr);gap:2rem 1.5rem;background:var(--slate);color:var(--sheet);padding-bottom:3rem}
.place-heading{grid-column:1/6}
.place-heading h2{margin:.4rem 0 0;font:600 clamp(3.5rem,6.2vw,7.5rem)/.88 var(--display);letter-spacing:-.055em}
.place-copy{grid-column:7/13;max-width:38rem;align-self:end}
.place-copy .lede{margin-top:0;font-size:clamp(1.35rem,2vw,2.2rem);line-height:1.2}
.place-copy p+p{margin-top:.9rem}

/* Node 01. The copy sets the section height; .node-visual is the only place
   imagery belongs and it disappears entirely when no image is present. */
.node{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;padding-bottom:clamp(2.5rem,4vw,4rem)}
.node-copy{grid-column:2/10;width:min(49rem,100%)}
.node-visual{grid-column:1/13;height:clamp(11rem,24vw,24rem);margin:clamp(2rem,3.4vw,3.4rem) calc(var(--pad)*-1) 0;overflow:hidden}
.node-visual img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.node-visual:empty{display:none}
.node-copy h2{margin:.2rem 0;font:600 clamp(4.8rem,11vw,12rem)/.8 var(--display);letter-spacing:-.065em}
.node-copy .lede{font-size:clamp(1.5rem,2.2vw,2.5rem)}
.node-copy>p:not(.index){max-width:34rem}
.text-link{display:inline-block;margin-top:1rem;font-family:var(--display);font-weight:600}

.closing{display:grid;grid-template-columns:repeat(12,1fr);align-content:space-between;background:var(--oxide);padding-top:clamp(4.5rem,8vw,8rem);padding-bottom:clamp(4rem,7vw,7rem)}
.closing>.index{grid-column:1/4}
.closing h2{grid-column:1/11;margin:clamp(3rem,6vh,5rem) 0;font:600 clamp(4.5rem,11.5vw,13rem)/.78 var(--display);letter-spacing:-.065em}
.closing-links{grid-column:8/13;display:flex;flex-direction:column;gap:1rem;border-top:1px solid var(--ink);padding-top:1rem;font-family:var(--display);font-weight:600}
.site-footer{display:flex;justify-content:space-between;gap:2rem;padding:1.2rem var(--pad);background:var(--ink);color:var(--sheet)}

.about-page{background:var(--sheet)}
.light-header{position:relative;border-bottom:1px solid rgba(73,70,64,.35)}
.about-main{padding:0 var(--pad)}
.about-intro{padding:clamp(3.5rem,4.5vw,4.5rem) 0 clamp(2.5rem,3.2vw,3.25rem);display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;align-items:end}
.about-intro .index{grid-column:1/3}
.about-intro h1{grid-column:1/9;margin:clamp(1.5rem,3vw,3rem) 0 0;font:600 clamp(3.8rem,7.2vw,8.5rem)/.86 var(--display);letter-spacing:-.06em}
.about-intro .lede{grid-column:9/13;font-size:clamp(1.4rem,2.1vw,2.35rem);margin:0 0 .5rem}
.about-system{position:relative;margin:0 calc(var(--pad)*-1);height:clamp(16rem,26vw,28rem);overflow:hidden;background:var(--paper)}
.about-system img{width:100%;height:100%;object-fit:cover;object-position:center 72%}
.about-system:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(251,250,247,.28),transparent 40%)}
.about-system figcaption{position:absolute;z-index:1;left:var(--pad);bottom:1rem;background:rgba(35,34,32,.72);color:var(--sheet);padding:.45rem .7rem}
.about-body,.about-practice,.about-node{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem;padding:clamp(3.25rem,4.5vw,4.75rem) 0;border-top:1px solid var(--rule)}
.about-body h2,.about-practice h2,.about-node h2{grid-column:1/7;margin:0;font:600 clamp(2.35rem,4.05vw,4.75rem)/.95 var(--display);letter-spacing:-.042em}
.about-body>div,.practice-copy,.about-node>div{grid-column:8/12;max-width:40rem}
.about-practice>.index,.about-node>.index{grid-column:1/13}
.practice-copy strong{font-family:var(--display)}
.about-node{background:var(--paper);margin:0 calc(var(--pad)*-1);padding-left:var(--pad);padding-right:var(--pad)}
.about-node h2{font-size:clamp(3.8rem,7vw,7rem)}
.about-close{padding:clamp(3.75rem,6vw,6.5rem) 0;width:min(75rem,100%)}
.about-close h2{margin:0;font:600 clamp(3rem,5.5vw,6.4rem)/.92 var(--display);letter-spacing:-.048em}
.about-close p{max-width:38rem}

@media(max-width:800px){.site-header{padding-top:.75rem}
.hero{height:100svh;min-height:680px}
.hero-art img{object-position:41% center}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(251,250,247,.9),transparent 36%,transparent 75%,rgba(251,250,247,.45))}
.hero-copy{top:9%;left:12%;width:76%;z-index:3}
.hero-copy h1{font-size:clamp(3rem,12.5vw,5rem)}
.definition>.index,.definition h2,.definition-side{grid-column:1/13}
.definition-side{margin-top:1.5rem;margin-left:20%}
.strands>.index,.closing>.index,.about-intro .index{grid-column:1/13}
.strand-one,.strand-two,.strand-three{grid-column:1/13;margin:0}
.strand{min-height:17rem;grid-template-columns:2rem repeat(7,minmax(0,1fr))}
.strand h3{font-size:clamp(3rem,12vw,5.4rem)}
.strand-one img,.strand-three img{width:48%;height:58%}
.strand-two h3,.strand-two p{grid-column:3/9}
.strand-two>span{grid-column:2}
.strand-two img{width:30%;height:76%}
.place-heading,.place-copy{grid-column:1/13}
.place-copy{align-self:start}
.node-copy{grid-column:1/13;width:100%}
.node-visual{height:clamp(10rem,30vw,18rem)}
.closing h2{grid-column:1/13}
.closing-links{grid-column:3/13}
.about-intro h1{grid-column:1/13}
.about-intro .lede{grid-column:3/13;margin-top:1.5rem}
.about-system{height:20rem}
.about-system img{object-position:61% 72%}
.about-body h2,.about-practice h2,.about-node h2{grid-column:1/13}
.about-body>div,.practice-copy,.about-node>div{grid-column:3/13}
.site-footer{flex-direction:column;gap:.2rem}
}

@media(max-width:430px){body{font-size:1.06rem}
.identity img{width:2rem;height:2rem}
.site-header nav{gap:.65rem}
.hero-copy{top:8.5%;left:8%;width:84%}
.hero-copy h1{font-size:12.2vw}
.surface{padding-top:3.5rem;padding-bottom:3.5rem}
.definition h2{font-size:2.25rem}
.definition-side{margin-left:10%}
.strand{min-height:17rem;grid-template-columns:1.7rem repeat(7,minmax(0,1fr))}
.strand h3{font-size:13vw}
.strand p{font-size:1rem}
.strand-one img,.strand-three img{width:52%;height:50%}
.strand-two img{width:34%;height:68%}
.closing h2{font-size:21vw}
.about-intro{padding-top:3.25rem}
.about-intro h1{font-size:13vw}
.about-system{height:17rem}
.about-system figcaption{max-width:15rem}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* V9: responsive picture wrappers and retained light editorial surfaces. */

.strand>picture{position:absolute;z-index:0;right:0;bottom:0;width:42%;height:74%;clip-path:polygon(10% 5%,100% 0,94% 100%,0 88%)}
.strand>picture img{position:static;width:100%;height:100%;object-fit:cover}
.strand>*:not(img):not(picture){position:relative;z-index:1}

.place{color:var(--on-slate);padding-bottom:clamp(4rem,6vw,6rem)}
.place-copy{border-top:1px solid rgba(251,250,247,.3);padding-top:1rem}

.node-visual picture,.node-visual img{display:block;width:100%;height:100%}
.node-visual picture img{object-fit:cover;object-position:center 55%}

.closing{color:var(--closing-ink)}
.closing-links{border-color:var(--closing-ink)}
.site-footer{background:var(--footer);color:var(--footer-ink)}

.about-node-visual{grid-column:1/13;margin:clamp(1rem,2vw,2rem) calc(var(--pad)*-1) calc(-1 * clamp(3.25rem,4.5vw,4.75rem));height:clamp(15rem,34vw,34rem);position:relative;overflow:hidden}
.about-node-visual picture,.about-node-visual img{display:block;width:100%;height:100%}
.about-node-visual img{object-fit:cover;object-position:center 54%}
.about-node-visual figcaption{position:absolute;left:var(--pad);bottom:1rem;padding:.45rem .7rem;background:rgba(35,34,32,.76);color:#fbfaf7;font:400 .7rem/1.35 var(--mono);letter-spacing:.09em;text-transform:uppercase}

@media(max-width:800px){
.strand-three>picture{width:48%;height:58%}
}

@media(max-width:430px){
.strand-three>picture{width:52%;height:50%}
.about-node-visual{height:18rem}
.about-node-visual img{object-position:53% center}
}
