.project-main{max-width:1120px;padding-top:32px;padding-bottom:50px}
.project-breadcrumb{display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:12px;color:var(--muted);margin:0 0 53px}
.preview-note{font:9px/1.5 ui-monospace,monospace;letter-spacing:.9px;color:var(--green);background:#e9eee3;padding:5px 9px;border-radius:3px}
.project-intro{max-width:850px;margin-bottom:35px}
.project-intro .eyebrow{flex-wrap:wrap;letter-spacing:1px;font-size:10px;gap:12px}
.project-intro h1{font-size:clamp(38px,4.5vw,62px);line-height:1.13;letter-spacing:-1.8px;margin:22px 0 15px;text-wrap:balance}
.project-full-title{font-size:14px;color:var(--muted);max-width:760px;line-height:1.6;margin:0 0 23px}
.project-overview{font:normal 23px/1.5 var(--serif);color:var(--green);max-width:720px;margin:20px 0 24px;text-wrap:pretty}
.project-resources{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.project-authors{font-size:11px;color:var(--muted);margin-left:8px;max-width:100%}
.project-authors summary{cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.project-authors[open]{flex-basis:100%;margin:4px 0 0}
.project-authors p{max-width:770px;margin:10px 0 0;line-height:1.8}
.project-authors summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.project-figure{margin:0 0 40px;padding:20px 26px;background:#eef1e7;border:1px solid #dce2d4;border-radius:4px}
.figure-label{display:flex;justify-content:space-between;gap:15px;font:9px/1.6 ui-monospace,monospace;letter-spacing:1px;color:var(--green);padding-bottom:12px}
.figure-label>span{color:var(--muted);font-size:8px}
.figure-flow{--figure-height:160px;--figure-gap:36px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:var(--figure-height) auto auto;column-gap:var(--figure-gap);margin:10px 0 20px}
.figure-step{position:relative;min-width:0;display:grid;grid-row:span 3;grid-template-rows:subgrid;align-items:start}
.figure-step+.figure-step:before{content:'→';position:absolute;left:calc(var(--figure-gap) / -2);top:calc(var(--figure-height) / 2);transform:translate(-50%,-50%);color:#6c8d77;font:20px/1 system-ui}
.figure-step svg{width:100%;height:var(--figure-height);display:block;overflow:hidden}
.figure-step h3{font-size:13px;font-weight:550;line-height:1.5;margin:8px 0 5px;color:var(--green)}
.figure-step p{font-size:11px;line-height:1.7;color:var(--muted);margin:0;max-width:250px}
.project-figure figcaption{border-top:1px solid #d5decd;padding-top:13px;color:var(--muted);font-size:11px;line-height:1.7;margin:0}
.project-section{display:grid;grid-template-columns:180px 1fr;gap:35px;border-top:1px solid var(--line);padding:26px 0 28px}
.project-section-label{display:flex;align-items:baseline;gap:15px}
.project-section h2{font-size:25px;letter-spacing:-.5px;margin:0}
.project-section>p{font-size:15px;color:#526057;line-height:1.9;margin:0;max-width:680px;text-wrap:pretty}
.project-takeaway{margin:4px 0 35px;padding:22px 28px;border-left:2px solid #7c9d80;background:#f0f2e9}
.project-takeaway .eyebrow{font-size:9px;margin:0 0 10px}
.project-takeaway>p:last-child{font:normal 23px/1.5 var(--serif);color:var(--green);margin:0;max-width:740px}
.project-footer-nav{display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--green);border-top:1px solid var(--line);padding-top:22px}
.project-index-link{display:grid;grid-template-columns:40px 1fr 25px;gap:20px;padding:27px 0;border-top:1px solid var(--line);align-items:baseline}
.project-index-link h2{font-size:29px;margin:0 0 8px}
.project-index-link p{color:var(--muted);font-size:14px;margin:0;max-width:640px}
.project-index-arrow{color:var(--green);font-size:20px}
.project-index-link:hover h2{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.project-page>footer{border-top:1px solid var(--line)}
@media(max-width:900px){
.project-section{grid-template-columns:150px 1fr;gap:22px}.project-figure{padding:18px}
.figure-flow{--figure-gap:36px;grid-template-columns:1fr;grid-template-rows:none;gap:var(--figure-gap)}
.figure-step{grid-row:auto;grid-template-columns:220px 1fr;grid-template-rows:1fr 1fr;column-gap:25px;align-items:center}
.figure-step svg{grid-row:1/3;width:220px;height:140px}
.figure-step h3{align-self:end}.figure-step p{align-self:start;max-width:none}
.figure-step+.figure-step:before{content:'↓';left:110px;top:calc(var(--figure-gap) / -2);transform:translate(-50%,-50%)}
}
@media(max-width:620px){
.project-main{padding-top:22px}.project-breadcrumb{flex-wrap:wrap;margin-bottom:32px;gap:12px}.project-intro h1{font-size:clamp(32px,8vw,39px);letter-spacing:-1px;overflow-wrap:normal;hyphens:manual}.project-overview{font-size:21px}.project-full-title{font-size:12px}
.figure-label{flex-wrap:wrap;gap:4px}.figure-label>*{width:100%}
.figure-flow{--figure-gap:42px;grid-template-columns:1fr;grid-template-rows:none;gap:var(--figure-gap);margin:14px 0 22px}
.figure-step{display:block;grid-row:auto;text-align:center}
.figure-step svg{width:100%;max-width:260px;height:auto;aspect-ratio:220/140;margin:0 auto}
.figure-step h3{margin:8px 0 5px;font-size:14px}.figure-step p{max-width:270px;margin:0 auto;font-size:12px}
.figure-step+.figure-step:before{content:'↓';left:50%;top:calc(var(--figure-gap) / -2);transform:translate(-50%,-50%)}
.project-section{grid-template-columns:1fr;gap:12px;padding:22px 0}.project-section h2{font-size:26px}.project-section>p{font-size:14px}.project-takeaway{padding:20px}.project-takeaway>p:last-child{font-size:21px}.project-footer-nav{font-size:11px;flex-wrap:wrap;gap:12px}.project-index-link{grid-template-columns:22px 1fr 18px;gap:12px}.project-index-link h2{font-size:25px}.project-index-link p{font-size:13px}}
@media(max-width:360px){.project-figure{padding:14px}}

.figure-label h2{font:inherit;letter-spacing:inherit;color:inherit;margin:0}

@media(max-width:360px){.project-page .header nav{gap:12px;font-size:11px}.project-page .header nav a{white-space:nowrap}}