:root{--ink:#202020;--muted:#737373;--well:#f0f0f0}*{box-sizing:border-box}html{scroll-behavior:smooth;background:#fff}body{width:100%;max-width:1280px;margin:0 auto;overflow-x:hidden;color:var(--ink);background:#fff;font-family:Inter,"Helvetica Neue",Arial,sans-serif;font-weight:400}img,video{display:block;max-width:100%}a{color:inherit;text-decoration:none}p,h1,h2,h3,dl,dd{margin:0}h1,h2,h3{font-weight:400}.skip-link{position:fixed;z-index:10;top:8px;left:8px;padding:10px 14px;background:#111;color:#fff;transform:translateY(-150%)}.skip-link:focus{transform:none}
.navigation{height:84px;display:flex;justify-content:space-between;padding:31px 10px 0 32px;font-size:15px;line-height:20px;position:sticky;top:0;z-index:20;background:#fff;transition:transform .28s ease;will-change:transform}.navigation.is-hidden{transform:translateY(-100%)}.navigation::after{content:"";position:absolute;left:0;right:0;top:80px;height:1px;background:#efefef}.wordmark{width:240px;font-weight:500}.navigation nav{display:grid;grid-template-columns:repeat(3,90px);gap:16px}.navigation a:hover,.live-link:hover{text-decoration:underline;text-underline-offset:4px}
.overview{position:relative;height:1317px}.overview h1{position:absolute;left:32px;top:157px;font-size:72px;line-height:75px;font-weight:500}.meta{position:absolute;top:292px;left:551px;right:32px;display:grid;grid-template-columns:210px 277px 210px;font-size:16px;line-height:24px}.meta dt{color:var(--muted);font-size:16px;line-height:24px;margin-bottom:15px}.meta dd{font-weight:400}.overview-intro{position:absolute;top:204px;left:551px;width:697px;font-size:20px;line-height:28px}.live-link{position:absolute;top:439px;left:32px;font-size:20px;line-height:28px;font-weight:500}.live-link img{display:inline-block;width:13.478px;height:13.478px;margin-left:7px;vertical-align:-1px}
.hero-well,.cli-well{position:absolute;left:32px;width:1216px;height:790px;background:var(--well);overflow:hidden}.hero-well{top:527px}.hero-well img,.hero-well video,.cli-well img{position:absolute;top:120px;left:168px;width:879px;height:550px;border-radius:8px;object-fit:cover;background:#0c1015}
.why{position:relative;height:412px;font-size:20px;line-height:28px}.why h2{position:absolute;left:31px;top:120px;font-size:22px;line-height:35px;font-weight:500}.why p{position:absolute;left:551px;width:697px;font-weight:400;color:var(--muted)}.why p:first-of-type{top:120px}.why p:last-child{top:208px}
.solution{position:relative;height:727px}.solution h2,.solution>p{position:absolute;top:120px;font-size:22px;line-height:35px}.solution h2{left:43px;font-weight:500}.solution>p{left:551px;font-size:20px;line-height:28px;font-weight:400;color:var(--muted)}.surface-grid{position:absolute;left:32px;top:272px;width:1216px;display:grid;grid-template-columns:repeat(3,379.386px);justify-content:space-between}.surface-grid img{width:379.386px;height:334.927px;object-fit:cover}
.cli-intro{position:relative;height:1350px;margin-top:45px;border-top:1px solid #efefef}.cli-intro h2{position:absolute;top:119px;left:43px;font-size:22px;line-height:35px;font-weight:500}.cli-intro>p{position:absolute;top:120px;left:551px;width:697px;font-size:18px;line-height:28px;color:var(--muted)}.cli-intro>.cli-contribution{top:264px}.cli-well{top:440px}
.cli-details{position:relative;height:1875px;border-top:1px solid #efefef}.detail{position:absolute}.detail h3,.detail-more h3{color:var(--muted);font-size:18px;line-height:28px;font-weight:500}.detail h3{margin-bottom:24px}.detail img{width:100%;height:auto}.detail-intervene{left:50px;top:120px;width:550px}.detail-progress{left:694px;top:120px;width:550px}.detail-plan{left:50px;top:600px;width:550px}.detail-state{left:693px;top:652px;width:550px}.detail-more{position:absolute;top:1238px;left:53px;width:1190px}.detail-more h3{margin-left:5px;margin-bottom:24px}.detail-more img{width:1190px;height:467px;object-fit:contain}
.beyond-cli{position:relative;height:830px}.beyond-cli h2{position:absolute;left:31px;top:120px;font-size:22px;line-height:35px;font-weight:500}.beyond-cli>p{position:absolute;left:551px;top:124px;width:697px;color:var(--muted);font-size:20px;line-height:28px}.beyond-grid{position:absolute;left:32px;right:37px;top:300px;display:grid;grid-template-columns:570px 570px;justify-content:space-between}.beyond-grid img{width:570px;height:410px;object-fit:contain}.project-footer{position:relative;height:196px;border-top:1px solid #efefef}.project-footer .next-label{position:absolute;left:1078px;top:71px;width:160px;font-family:Geist,Inter,Arial,sans-serif;font-size:17px;line-height:23px;color:#111}.project-footer .copyright{position:absolute;left:32px;top:154px;width:240px;font-size:15px;line-height:20px;font-weight:500}
@media(max-width:900px){
 .navigation{height:auto;min-height:72px;padding:22px 24px}.navigation::after{top:auto;bottom:0}.navigation nav{grid-template-columns:repeat(3,auto);gap:20px}
 .overview,.why,.solution,.cli-intro,.cli-details,.beyond-cli,.project-footer{height:auto}
 .overview{padding:80px 24px 0}.overview h1,.meta,.overview-intro,.live-link,.hero-well,.why h2,.why p,.solution h2,.solution>p,.surface-grid,.cli-intro h2,.cli-intro>p,.cli-well,.detail,.detail-more,.beyond-cli h2,.beyond-cli>p,.beyond-grid,.project-footer .next-label,.project-footer .copyright{position:static;width:auto}
 .overview h1{font-size:clamp(48px,9vw,72px);line-height:1;margin-bottom:40px}.overview-intro{font-size:20px;line-height:1.4;max-width:700px;margin-bottom:44px}
 .meta{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:42px}.meta dt{margin-bottom:8px}.live-link{display:inline-block;margin-bottom:55px}
 .hero-well,.cli-well{width:100%;height:auto;aspect-ratio:1216/790;display:grid;place-items:center}.hero-well img,.hero-well video,.cli-well img{position:static;width:72.3%;height:auto;aspect-ratio:879/550;object-fit:cover}
 .why{padding:90px 24px}.why h2{font-size:22px;margin-bottom:25px}.why p{max-width:700px;margin-left:auto;font-size:20px;line-height:1.4}.why p+p{margin-top:50px}
 .solution{padding:90px 24px}.solution h2{font-size:22px;margin-bottom:25px}.solution>p{font-size:20px;margin-bottom:65px}.surface-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.surface-grid img{width:100%;height:auto}
 .cli-intro{padding:90px 24px 0;margin-top:0}.cli-intro h2{margin-bottom:30px}.cli-intro>p{max-width:700px;margin-left:auto;font-size:18px;line-height:1.55;margin-bottom:60px}.cli-intro>p.cli-contribution{top:auto;margin-bottom:80px}
 .cli-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:45px 30px;padding:90px 24px}.detail h3{margin-bottom:15px}.detail-more{grid-column:1/-1}.detail-more img{width:100%;height:auto}
 .beyond-cli{padding:90px 24px 100px}.beyond-cli h2{margin-bottom:25px}.beyond-cli>p{max-width:700px;margin-left:auto;margin-bottom:80px}.beyond-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}.beyond-grid img{width:100%;height:auto}
 .project-footer{min-height:150px;padding:55px 24px 20px;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:40px}.project-footer .copyright{align-self:flex-start}
}
@media(max-width:620px){.navigation{flex-direction:column;gap:22px}.navigation nav{font-size:13px}.overview{padding-top:65px}.meta{grid-template-columns:1fr 1fr}.surface-grid,.cli-details,.beyond-grid{grid-template-columns:1fr}.surface-grid img{max-width:380px}.detail-more{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.navigation{transition:none}}

/* Shared portfolio navigation and full-width rules. Content remains on the 1280px canvas. */
body{overflow-x:visible}
.navigation nav{grid-template-columns:45px 72px 53px;gap:48px;margin-right:36px}
.navigation::after{left:50%;right:auto;width:100vw;transform:translateX(-50%)}
.cli-intro,.cli-details,.project-footer{border-top-color:transparent}
.cli-intro::before,.cli-details::before,.project-footer::before{content:"";position:absolute;left:50%;top:0;width:100vw;height:1px;background:#efefef;transform:translateX(-50%)}
.hero-well,.cli-well,.surface-grid img,.detail img,.detail-more img,.beyond-grid img{border-radius:8px}
.cli-well img{border-radius:12px}
@media(max-width:900px){.navigation nav{grid-template-columns:repeat(3,auto);gap:20px;margin-right:0}.navigation::after{top:auto;bottom:0}}

/* Shared project intro typography from the latest Figma frames. */
.overview-intro{font-size:24px}
.live-link{font-weight:400}
@media(max-width:900px){.overview-intro{font-size:24px}}