/* PUBLI V2 — black / off-white / electric green, independent editorial direction. */
:root{--bg:#090a09;--ink:#f3f3ed;--paper:#e9e9e2;--muted:#a3a6a0;--green:#9bf76a;--rule:rgba(245,245,235,.20);--ink-dark:#111310;--max:1660px;--edge:clamp(20px,4.25vw,88px);--radius:2px;--sans:Arial,Helvetica,sans-serif;--display:'Arial Narrow','Helvetica Neue',Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:105px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%}::selection{background:var(--green);color:#0a0c08}
:focus-visible{outline:2px solid var(--green);outline-offset:5px}
.site-wrap{width:100%;max-width:var(--max);padding-inline:var(--edge);margin-inline:auto}
.mono,.eyebrow,.top-meta,.section-index,.section-note,.chip,.card-kicker,.case-stat dt,.case-stat dd,.project-index,.footer-note,.overline,.ticker-inner,.fig-id,.meta-line,.nav-number{font-family:'Courier New',monospace;text-transform:uppercase;letter-spacing:.07em;font-size:clamp(10px,.79vw,13px);font-weight:600;line-height:1.55}
.eyebrow{color:var(--green)}.subtle{color:var(--muted)}
.skip-link{position:absolute;z-index:99;left:20px;top:-90px;padding:12px 18px;background:var(--green);color:var(--ink-dark)}.skip-link:focus{top:12px}
.topbar{position:relative;z-index:30;background:rgba(9,10,9,.97);border-bottom:1px solid var(--rule)}
.nav-row{height:86px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:baseline;font-size:clamp(31px,3.25vw,52px);font-weight:900;line-height:1;letter-spacing:-.115em;padding-right:.12em}.brand b{color:var(--green);font-weight:900}.brand small{font-size:10px;letter-spacing:.1em;margin-left:14px;color:var(--muted);font-family:'Courier New',monospace;font-weight:500}
.navigation{display:flex;gap:clamp(20px,3.2vw,56px);align-items:center;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}.navigation a{transition:color .2s}.navigation a:hover{color:var(--green)}.navigation .nav-contact{border:1px solid var(--green);padding:13px 20px;color:var(--green)}.navigation .nav-contact:hover{color:var(--bg);background:var(--green)}.menu-button{display:none}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--rule)}
.hero-grid{min-height:min(800px,78vh);display:grid;grid-template-columns:1fr minmax(240px,.38fr);align-items:end;padding-top:clamp(72px,7vw,145px);padding-bottom:clamp(42px,5vw,100px);gap:20px;position:relative;z-index:1}
.hero-decor{position:absolute;inset:0;pointer-events:none;opacity:.82;background:radial-gradient(ellipse at 96% 53%,rgba(134,255,93,.09),transparent 32%),linear-gradient(90deg,transparent 75%,rgba(255,255,255,.017) 75.05%,transparent 75.1%)}
.hero-decor::after{content:'P';position:absolute;right:-4vw;top:-16vw;font-size:clamp(450px,58vw,1080px);font-weight:900;letter-spacing:-.18em;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(155,247,106,.16);font-family:Arial,sans-serif;transform:rotate(-12deg)}
.hero-header{position:absolute;top:44px;left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;gap:18px}
.hero h1{font-family:var(--display);font-size:clamp(72px,11.25vw,212px);line-height:.78;letter-spacing:-.095em;margin:0;font-weight:900;text-transform:uppercase;max-width:1320px}
.hero h1 span{display:block;white-space:nowrap}.hero h1 .tone{color:var(--green)}
.hero-sidebar{padding-bottom:4px;max-width:300px;justify-self:end;position:relative;z-index:2}
.hero-sidebar .side-rule{height:2px;width:55px;background:var(--green);margin-bottom:22px}
.hero-sidebar p{font-size:clamp(15px,1.3vw,21px);line-height:1.5;letter-spacing:-.03em;margin:0 0 34px;color:#e7e8e1}
.text-link{font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.08em;display:inline-flex;align-items:center;gap:18px;border-bottom:1px solid var(--green);padding-bottom:12px;transition:gap .2s}.text-link:hover{gap:28px}.text-link span{color:var(--green);font-size:24px;line-height:.6}
.ticker{background:var(--green);color:var(--ink-dark);border-bottom:1px solid #091009}.ticker-inner{min-height:39px;display:flex;justify-content:space-between;align-items:center;gap:20px;white-space:nowrap;overflow:hidden}
.section{padding-top:clamp(72px,8vw,140px);padding-bottom:clamp(72px,9vw,160px)}
.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;margin-bottom:44px}
.section-head h2{font-size:clamp(50px,7.5vw,125px);font-weight:900;line-height:.86;letter-spacing:-.075em;margin:18px 0 0;text-transform:uppercase}
.section-head .section-note{color:var(--muted);margin-top:8px;text-align:right}
.reel-frame{position:relative;aspect-ratio:16/8.15;background:#161a14;overflow:hidden;border:1px solid var(--rule);isolation:isolate;display:flex;align-items:center;justify-content:center}
.reel-frame::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 34% 18%,rgba(164,245,138,.21),transparent 30%),radial-gradient(ellipse at 79% 88%,rgba(255,255,255,.10),transparent 27%),linear-gradient(160deg,#1d251f 10%,#0b110e 62%,#1b2118);z-index:-1}
.reel-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:9.2% 16%;mask-image:linear-gradient(to right,transparent 8%,black 80%);opacity:.42}
.reel-ring{position:absolute;border:1px solid rgba(170,255,140,.42);width:45vw;max-width:720px;aspect-ratio:1;border-radius:50%;transform:rotateX(64deg) rotate(-29deg);box-shadow:0 0 100px rgba(155,247,106,.12)}.reel-ring::before,.reel-ring::after{content:'';position:absolute;inset:18%;border:1px solid rgba(155,247,106,.35);border-radius:50%}.reel-ring::after{inset:35%}
.reel-title{position:relative;font-size:clamp(48px,9.2vw,175px);font-weight:900;letter-spacing:-.09em;line-height:.84;text-align:center;text-shadow:0 18px 45px rgba(0,0,0,.65);text-transform:uppercase;pointer-events:none}.reel-title span{display:block}.reel-title em{font-style:normal;color:var(--green)}
.frame-top,.frame-bottom{position:absolute;z-index:3;left:clamp(16px,2vw,32px);right:clamp(16px,2vw,32px);display:flex;justify-content:space-between;align-items:center;gap:16px}.frame-top{top:22px}.frame-bottom{bottom:24px}.frame-bottom .placeholder-note{background:rgba(8,10,8,.82);padding:9px 12px;color:var(--muted)}
.video-play{position:absolute;inset:0;z-index:5;width:100%;background:rgba(0,0,0,.22);color:var(--ink);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:17px;font:700 12px var(--sans);letter-spacing:.14em}.play-circle{width:82px;height:82px;background:var(--green);color:var(--bg);border-radius:50%;display:grid;place-items:center;font-size:25px;transition:transform .2s}.video-play:hover .play-circle{transform:scale(1.12)}.video-embed{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:10}
.poster-img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;display:none;z-index:1}.has-poster .poster-img{display:block}.work-art.has-poster .art-title,.case-video.has-poster .art-title{opacity:0}.has-poster .art-ornament,.has-poster .reel-ring,.has-poster .reel-title,.has-poster .reel-grid{opacity:0}.has-poster::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent 35%,rgba(0,0,0,.5))}.has-poster .frame-top,.has-poster .frame-bottom,.has-poster .art-overlay{z-index:3}
.reel-under{display:flex;justify-content:space-between;gap:20px;padding-top:14px}.reel-under span{color:var(--muted)}
.work{background:var(--paper);color:var(--ink-dark)}.work .section-head .eyebrow{color:#356d24}.work .section-head .section-note{color:#595e55}
.work-list{border-top:1px solid #a8aba2}.work-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(30px,5vw,100px);padding:clamp(28px,4.5vw,70px) 0;border-bottom:1px solid #b9bdb2;align-items:center}.work-item:nth-child(even) .work-art{order:-1}.work-item:nth-child(even){grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.work-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.work-copy .project-index{color:#427d2f;margin-bottom:clamp(28px,4vw,80px)}.work-copy h3{font-size:clamp(40px,5.6vw,100px);line-height:.93;letter-spacing:-.076em;text-transform:uppercase;font-weight:900;margin:0 0 28px;max-width:680px}.work-copy p{font-size:clamp(14px,1.15vw,18px);line-height:1.5;max-width:370px;color:#555950;margin:0 0 30px}.work-copy .work-link{border-bottom:1px solid #222;padding-bottom:10px;letter-spacing:.09em;font-size:12px;font-weight:800}.work-copy .work-link:hover{color:#257e40}
.work-art{position:relative;display:block;width:100%;overflow:hidden;min-height:300px;aspect-ratio:16/10;background:#14191a;color:white;border:1px solid rgba(17,19,16,.05)}.work-art .art-overlay{position:absolute;inset:0;z-index:2;padding:clamp(18px,2vw,35px);display:flex;flex-direction:column;justify-content:space-between}.work-art .art-top{display:flex;justify-content:space-between;gap:10px}.work-art .art-title{font-size:clamp(48px,7.5vw,132px);line-height:.82;font-weight:900;letter-spacing:-.085em;text-transform:uppercase;align-self:flex-start;max-width:80%;overflow-wrap:anywhere}.work-art .art-bottom{display:flex;justify-content:space-between;align-items:end}.work-art .art-bottom strong{font-size:13px;letter-spacing:.09em}.work-art .art-bottom .arrow{font-size:34px;color:var(--green)}.work-art .art-ornament{position:absolute;z-index:1;pointer-events:none}.art-continuity{background:linear-gradient(145deg,#405044 0%,#1c2721 38%,#0b0d0b 96%)}.art-continuity .art-ornament{width:74%;aspect-ratio:1;border:1px solid rgba(242,249,224,.42);border-radius:50%;left:36%;top:-40%;box-shadow:0 0 0 48px rgba(255,255,255,.035),0 0 0 110px rgba(255,255,255,.022)}
.art-product{background:linear-gradient(135deg,#202923,#303f31 54%,#11140f)}.art-product .art-ornament{width:70%;height:52%;border:2px solid rgba(157,250,104,.6);right:-12%;top:20%;transform:rotate(-28deg);border-radius:60% 18% 65% 14%;box-shadow:-23px 24px 90px rgba(0,0,0,.45),0 0 0 34px rgba(255,255,255,.045)}
.art-social{background:linear-gradient(120deg,#3b4933 0%,#12231a 46%,#060b07)}.art-social .art-ornament{width:32%;height:120%;left:55%;top:-15%;transform:rotate(25deg);background:linear-gradient(90deg,rgba(175,255,129,.34),rgba(220,240,214,.03));filter:blur(2px)}
.work-item .work-art:hover .art-ornament{transform:scale(1.05) rotate(2deg);transition:transform .6s ease}.work-item .art-product:hover .art-ornament{transform:scale(1.05) rotate(-24deg)}
.impact{background:var(--bg);color:var(--ink);padding-top:clamp(85px,10vw,175px);padding-bottom:clamp(85px,10vw,175px)}.impact-intro{display:flex;justify-content:space-between;gap:20px;padding-bottom:50px;border-bottom:1px solid var(--rule)}.impact h2{max-width:1450px;font-size:clamp(50px,8.5vw,152px);line-height:.95;letter-spacing:-.075em;font-weight:900;text-transform:uppercase;margin:65px 0}.impact h2 i{color:var(--green);font-family:Georgia,serif;letter-spacing:-.08em;font-weight:400;text-transform:none}.impact-details{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,140px);max-width:1100px;margin-left:auto}.impact-details p{font-size:clamp(17px,1.55vw,24px);line-height:1.48;color:#d2d6cb;margin:0}
.services{border-top:1px solid var(--rule);padding:0 0 clamp(90px,10vw,180px)}.services .services-header{display:flex;justify-content:space-between;padding:30px 0 60px;gap:20px}.services h2{font-size:clamp(50px,6vw,105px);line-height:.95;letter-spacing:-.08em;margin:0;text-transform:uppercase}.services-list{border-top:1px solid var(--rule)}.service{display:grid;grid-template-columns:90px 1fr minmax(160px,.4fr);gap:24px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--rule)}.service h3{font-size:clamp(26px,3vw,54px);line-height:1;letter-spacing:-.05em;margin:0;font-weight:800}.service p{margin:0;color:var(--muted);line-height:1.5;font-size:14px}.service .num{color:var(--green)}
.contact{background:var(--green);color:var(--ink-dark);padding:clamp(75px,10vw,180px) 0 clamp(45px,5vw,95px)}.contact .eyebrow{color:#24491b}.contact h2{font-size:clamp(65px,12.4vw,214px);letter-spacing:-.09em;text-transform:uppercase;line-height:.78;margin:45px 0 65px;font-weight:900}.contact h2 span{display:block}.contact-foot{border-top:1px solid rgba(16,20,12,.38);display:flex;justify-content:space-between;align-items:end;gap:28px;padding-top:25px}.contact-foot p{margin:0;font-size:16px;line-height:1.5}.contact-cta{display:inline-flex;gap:22px;align-items:center;font-weight:900;font-size:clamp(16px,2vw,32px);letter-spacing:-.05em;border-bottom:2px solid #0d160b;padding-bottom:10px}.contact-cta:hover{gap:36px;transition:gap .2s}
.footer{background:var(--bg);padding:40px 0}.footer-row{display:flex;justify-content:space-between;align-items:center;gap:24px}.footer .brand{font-size:36px}.footer-note{color:var(--muted);max-width:620px}.footer a:hover{color:var(--green)}
/* Individual project */
.case-hero{padding-top:clamp(70px,7vw,120px);padding-bottom:clamp(65px,8vw,130px)}.back-link{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--green);padding-bottom:10px}.case-hero .overline{color:var(--green);display:block;margin:clamp(50px,7vw,100px) 0 25px}.case-hero h1{font-size:clamp(62px,10vw,180px);font-weight:900;line-height:.86;letter-spacing:-.085em;text-transform:uppercase;margin:0 0 45px;max-width:1200px}.case-lead{font-size:clamp(20px,2vw,32px);line-height:1.3;max-width:770px;margin:0;color:#d3d6cd;letter-spacing:-.03em}.case-video{width:100%;min-height:250px;aspect-ratio:16/8.7}.case-video .art-title{position:relative;font-size:clamp(60px,13vw,220px);font-weight:900;letter-spacing:-.1em;text-align:center;line-height:.9;text-transform:uppercase;z-index:2;pointer-events:none}
.case-details{padding-top:clamp(70px,7vw,120px);padding-bottom:clamp(80px,8vw,155px);display:grid;grid-template-columns:minmax(180px,.52fr) minmax(0,1fr);gap:clamp(38px,10vw,180px)}.case-stats{display:flex;flex-direction:column;gap:28px}.case-stat{border-top:1px solid var(--rule);padding-top:15px}.case-stat dt{color:var(--green);margin-bottom:6px}.case-stat dd{margin:0;font-size:16px;line-height:1.5}.case-copy h2{font-size:clamp(40px,4.7vw,80px);text-transform:uppercase;letter-spacing:-.07em;line-height:1;margin:0 0 24px}.case-copy h3{font-size:21px;margin:40px 0 14px}.case-copy p,.case-copy li{font-size:clamp(16px,1.15vw,20px);line-height:1.6;color:#c6ccc1}.case-copy ul{padding-left:20px}.case-notice{border-left:3px solid var(--green);padding:15px 22px;background:#171c15;color:#d9e2d1;margin-top:40px;line-height:1.6;font-size:14px}.case-next{border-top:1px solid var(--rule);padding-top:35px;padding-bottom:110px;display:flex;justify-content:space-between;gap:24px;align-items:center}.case-next strong{display:block;font-size:clamp(30px,4vw,68px);line-height:1.05;letter-spacing:-.06em;margin-top:12px}.case-next a{white-space:nowrap}
[data-reveal]{opacity:1;transform:none}[data-reveal].is-visible{opacity:1;transform:none}
@media(max-width:1050px){.hero-grid{grid-template-columns:1fr;min-height:720px}.hero-sidebar{max-width:450px;justify-self:start;margin-top:40px}.hero h1{font-size:clamp(74px,13vw,147px)}.work-item,.work-item:nth-child(even){grid-template-columns:1fr 1fr;gap:30px}.work-copy h3{font-size:clamp(38px,5vw,75px)}.work-copy .project-index{margin-bottom:22px}.service{grid-template-columns:60px 1fr}.service p{grid-column:2}.contact h2{font-size:clamp(66px,12vw,150px)}}
@media(max-width:900px){.menu-button{display:block;background:transparent;color:var(--ink);border:1px solid var(--rule);padding:10px 13px;font:700 11px var(--sans);letter-spacing:.12em}.navigation{display:none;position:absolute;top:100%;left:0;right:0;background:#0c0d0b;border-bottom:1px solid var(--rule);padding:25px var(--edge) 30px;flex-direction:column;align-items:stretch;gap:26px}.navigation.is-open{display:flex}.navigation a{display:block}.navigation .nav-contact{width:fit-content}}
@media(max-width:700px){:root{--edge:20px}.nav-row{height:72px}.brand{font-size:35px}.brand small{font-size:8px;margin-left:9px}.hero-grid{min-height:660px;align-items:end;padding-top:125px;padding-bottom:55px}.hero-header{top:34px}.hero-header .top-meta:last-child{display:none}.hero h1{font-size:clamp(60px,13.4vw,95px);letter-spacing:-.09em}.hero h1 span{white-space:normal}.hero-sidebar{margin-top:30px}.hero-sidebar p{font-size:16px;margin-bottom:20px}.hero-decor::after{top:40%;right:-25%;font-size:130vw}.ticker-inner span:last-child{display:none}.section-head{flex-direction:column;gap:14px;margin-bottom:30px}.section-head h2{font-size:clamp(46px,11vw,90px)}.section-head .section-note{text-align:left}.section{padding-top:75px;padding-bottom:85px}.reel-frame{aspect-ratio:4/3}.reel-title{font-size:clamp(46px,12vw,85px)}.reel-ring{width:115vw}.frame-bottom .placeholder-note{font-size:9px}.reel-under{flex-direction:column;gap:5px}.work-item,.work-item:nth-child(even){grid-template-columns:1fr;gap:25px}.work-item:nth-child(even) .work-art{order:initial}.work-copy .project-index{margin-bottom:16px}.work-copy h3{font-size:clamp(47px,10vw,82px);margin-bottom:15px}.work-copy{order:2}.work-item .work-art{order:1;min-height:200px}.work-art{aspect-ratio:1.35}.art-title{font-size:clamp(47px,12vw,95px)}.impact{padding-block:90px}.impact-intro{flex-direction:column}.impact h2{font-size:clamp(52px,10vw,83px);margin:40px 0}.impact-details{grid-template-columns:1fr;gap:25px}.services .services-header{flex-direction:column}.service{grid-template-columns:30px 1fr;gap:15px}.service h3{font-size:clamp(28px,7vw,50px)}.service p{font-size:13px}.contact{padding-top:100px}.contact h2{font-size:clamp(66px,13vw,110px);margin:35px 0 55px}.contact-foot{flex-direction:column;align-items:start}.contact-cta{font-size:20px}.footer-row{align-items:start;flex-direction:column}.case-hero{padding-top:65px;padding-bottom:65px}.case-hero h1{font-size:clamp(48px,11vw,92px)}.case-video{aspect-ratio:4/3}.case-details{grid-template-columns:1fr;gap:55px}.case-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.case-copy{min-width:0}.case-copy h2,.case-copy h3,.case-stat dd{overflow-wrap:anywhere}.case-next{flex-direction:column;align-items:start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}[data-reveal]{opacity:1;transform:none}}