:root{--ink:#111310;--paper:#f4f3ee;--green:#c9f478;--line:#d3d4ca}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Montserrat,Arial,sans-serif}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #739e39;outline-offset:6px}header{position:absolute;z-index:20;top:0;width:100%;padding:28px 4%;display:flex;align-items:center;justify-content:space-between;color:white}header img{width:208px}nav{display:flex;gap:32px;font-size:12px}.contact-pill{background:white;color:#121410;padding:14px 22px;border-radius:28px;font-size:12px;font-weight:600}.menu{display:none}.hero-track{height:155vh;background:#172019}.hero{height:100vh;min-height:730px;position:sticky;top:0;overflow:hidden;color:white;padding:125px 4% 40px;background:radial-gradient(ellipse at 70% 45%,#4b6040 0,#202e22 45%,#111a15 85%)}.hero-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.7px;position:relative;z-index:2}.hero h1{font-size:clamp(65px,7.8vw,132px);font-weight:500;line-height:.97;letter-spacing:-.075em;margin:45px 0;position:relative;z-index:3;pointer-events:none}.hero h1 span{color:var(--green)}.hero-art{position:absolute;inset:0;transform:translateY(calc(var(--p,0)*-90px))}.halo{width:65vw;height:65vw;position:absolute;right:-8%;top:0;border:1px solid #c9f47830;border-radius:50%;box-shadow:0 0 0 80px #c9f47805,0 0 0 160px #c9f47803}.art{position:absolute;object-fit:cover;box-shadow:0 30px 80px #0006;border:1px solid #fff2;will-change:transform}.art-a{width:25%;height:52%;right:25%;top:29%;transform:translate(calc(var(--p,0)*-100px),calc(var(--p,0)*35px)) rotate(calc(-12deg - var(--p,0)*8deg))}.art-b{width:24%;height:50%;right:2%;top:12%;transform:translateY(calc(var(--p,0)*-70px)) rotate(calc(10deg + var(--p,0)*12deg))}.art-c{width:18%;height:39%;right:6%;top:65%;transform:translateY(calc(var(--p,0)*-120px)) rotate(-8deg)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0c160c65,transparent 70%);pointer-events:none}.hero-bottom{position:absolute;bottom:38px;left:4%;right:4%;display:flex;align-items:end;justify-content:space-between;z-index:4}.hero-bottom p{font-size:12px;line-height:1.7}.round-link{display:flex;gap:24px;align-items:center;font-size:12px}.round-link b{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--green);color:#111;font-size:24px}.scroll-label{font-size:8px;line-height:1.7;letter-spacing:1px}.scroll-label i{display:block;margin-top:15px;width:100%;height:1px;background:#fff7}.progress{height:3px;background:var(--green);width:calc(var(--p,0)*100%);position:absolute;bottom:0;left:0;z-index:5}.intro,.work,.solutions{padding:100px 5%}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:600}.intro h2{font-size:clamp(38px,5.2vw,80px);letter-spacing:-.055em;line-height:1.1;font-weight:500;margin:40px 0}.intro h2 span{color:#83877b}.intro-bottom{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:60px;align-items:end}.asterisk{font-size:90px;line-height:1}.intro-bottom p{font-size:15px;line-height:1.8;max-width:430px;margin:0}.line-link{font-size:12px;border-bottom:1px solid;padding-bottom:10px;justify-self:end}.work{background:#111310;color:var(--paper)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px}.section-heading h2{font-weight:500;font-size:clamp(35px,4.2vw,66px);line-height:1.08;letter-spacing:-.055em;margin:22px 0 0}.section-heading>p{font-size:12px;line-height:1.8}.green{color:var(--green)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:45px 0 30px}.filters button{border:1px solid #ffffff40;background:none;color:#ddd;border-radius:30px;padding:12px 20px;font-size:11px}.filters button.active{color:#141a12;background:var(--green);border-color:var(--green)}sup{margin-left:7px;font-size:8px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px}.project{padding:0;background:none;border:0;color:inherit;text-align:left;width:100%;display:block}.project figure{margin:0;overflow:hidden;position:relative;aspect-ratio:4/5;background:#252721;border-radius:4px}.project img{width:100%;height:100%;object-fit:cover;transition:transform .6s}.project:hover img{transform:scale(1.035)}.project .open-project{position:absolute;right:20px;bottom:20px;border-radius:50%;background:white;color:black;width:48px;height:48px;display:grid;place-items:center;font-size:25px}.project-caption{display:flex;justify-content:space-between;gap:15px;padding-top:18px;align-items:center}.project-caption h3{font-size:19px;margin:0;font-weight:500}.project-caption p{font-size:10px;color:#abb0a6;margin:7px 0 0}.project-caption>span{font-size:9px;letter-spacing:1px}.outline{display:block;margin:55px auto 0;border:1px solid #888;background:none;color:inherit;padding:17px 25px;border-radius:40px;font-size:12px}.outline span{margin-left:50px}.solutions{padding-top:115px;padding-bottom:115px}.solutions .section-heading{margin-bottom:65px}details{border-top:1px solid #bfc2b6}details:last-child{border-bottom:1px solid #bfc2b6}summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:60px 1.4fr 1fr 35px;gap:20px;align-items:center;padding:30px 0}summary::-webkit-details-marker{display:none}.num{font-size:10px;color:#666}summary h3{font-size:clamp(24px,3.3vw,48px);font-weight:500;letter-spacing:-.05em;margin:0}summary>span:not(.num){font-size:12px}summary b{font-size:30px;font-weight:400;transition:transform .3s}details[open] summary b{transform:rotate(90deg)}.service-body{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;padding:0 55px 40px 80px}.service-body>p{font-size:26px;max-width:350px;line-height:1.3}.service-body div{font-size:13px;line-height:1.8}.service-body ul{list-style:none;padding:0;color:#707569}.service-body a{display:inline-block;margin-top:10px;border-bottom:1px solid}.about{display:grid;grid-template-columns:1fr 1fr;background:#e8ebdf}.about-visual{position:relative;min-height:650px;overflow:hidden}.about-visual img{width:100%;height:100%;object-fit:cover;position:absolute;filter:brightness(.65)}.about-visual>span{position:absolute;left:10%;bottom:10%;color:white;font-size:clamp(30px,4vw,60px);line-height:1.1;font-weight:600;letter-spacing:-.05em}.about-copy{padding:80px 12%}.about h2{font-size:clamp(35px,4.2vw,62px);font-weight:500;line-height:1.1;letter-spacing:-.05em}em{font-style:normal;color:#71815c}.about p{font-size:13px;line-height:1.9}.values{display:flex;flex-wrap:wrap;gap:8px;margin-top:35px}.values span{font-size:9px;padding:9px 12px;border:1px solid #aeb5a0;border-radius:20px}.contact{background:var(--green);padding:95px 5% 65px}.contact h2{font-size:clamp(46px,8.5vw,130px);font-weight:500;letter-spacing:-.065em;line-height:1.03;margin:45px 0}.contact h2 em{color:#647e3f}.contact h2>span{display:inline-block;margin-left:4%}.contact-bottom{display:flex;justify-content:space-between;align-items:center}.contact-bottom p{font-size:13px;line-height:1.7}.black-button{border:0;background:var(--ink);color:white;border-radius:30px;padding:19px 26px;font-size:12px}footer{background:#111310;color:#eee;padding:55px 5% 25px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:35px;align-items:center}footer div,footer a{font-size:11px;line-height:1.8}footer small{flex-basis:100%;border-top:1px solid #ffffff20;padding-top:22px;font-size:9px;color:#8c9487}dialog{border:0;background:var(--paper);color:var(--ink);width:min(1100px,94vw);max-height:92vh;padding:55px;border-radius:10px}dialog::backdrop{background:#080e08d9;backdrop-filter:blur(8px)}.close{position:sticky;top:0;float:right;z-index:10;background:var(--ink);color:white;border:0;width:40px;height:40px;border-radius:50%}dialog h2{font-size:clamp(30px,5vw,64px);font-weight:500;letter-spacing:-.05em;margin:20px 0}.draft{font-size:10px;padding:9px 12px;background:#e1e7d6;display:inline-block}.case-intro{font-size:18px;line-height:1.7;max-width:700px}.case-gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}.case-gallery img{width:100%;height:auto;display:block}.case-gallery img:first-child{grid-column:1/-1;max-height:650px;object-fit:contain;background:#e4e4dc}#brief-dialog{max-width:650px}#brief-dialog h2{font-size:38px}#brief-dialog>p{font-size:12px;line-height:1.7;color:#65695f}form{display:grid;gap:18px;margin-top:30px}label{font-size:11px;display:grid;gap:8px}input,select,textarea{width:100%;border:1px solid #bdc3b2;border-radius:5px;background:transparent;padding:13px;font-size:13px}#brief-status{font-size:12px}
@media(min-width:1600px){.hero h1{font-size:125px}.hero{padding-top:145px}}@media(max-width:760px){header{padding:22px 6%}header img{width:150px}nav{display:none;position:absolute;top:76px;left:0;right:0;background:#172019;padding:25px;flex-direction:column}nav.visible{display:flex}.menu{display:block;background:none;border:0;color:white;font-size:22px}.contact-pill{margin-left:auto;margin-right:15px;padding:10px 13px;font-size:9px}.hero{min-height:680px;padding:110px 6% 30px}.hero-track{height:135vh}.hero-top span:last-child{display:none}.hero h1{font-size:clamp(52px,12vw,90px);margin-top:55px;line-height:1.04}.hero-art{opacity:.65}.art-a{width:45%;right:0;top:39%;height:37%}.art-b{width:36%;right:-9%;top:16%;height:30%}.art-c{width:33%;right:12%;top:74%;height:28%}.hero-bottom{left:6%;right:6%;bottom:30px}.hero-bottom p{font-size:10px}.scroll-label{display:none}.round-link{font-size:9px;gap:10px}.round-link b{width:40px;height:40px}.intro,.work,.solutions{padding:65px 6%}.intro-bottom{grid-template-columns:1fr 3fr;gap:25px}.asterisk{font-size:65px}.intro-bottom p{font-size:12px}.line-link{grid-column:2;justify-self:start}.section-heading{align-items:start;flex-direction:column;gap:10px}.section-heading>p{font-size:11px}.project-grid{gap:35px 15px}.project-caption{align-items:start;flex-direction:column;gap:8px}.project-caption h3{font-size:15px}.project-caption>span{font-size:8px}.project-caption p{font-size:9px}.project .open-project{width:32px;height:32px;right:10px;bottom:10px;font-size:19px}.filters{margin-top:25px}.filters button{padding:10px 12px;font-size:9px}summary{grid-template-columns:24px 1fr 22px;gap:8px;padding:25px 0}summary>span:not(.num){grid-column:2;grid-row:2;font-size:10px}summary b{grid-column:3;grid-row:1}.service-body{grid-template-columns:1fr;gap:0;padding:0 10px 25px 32px}.service-body>p{font-size:20px}.about{grid-template-columns:1fr}.about-visual{min-height:400px}.about-copy{padding:55px 8%}.contact{padding:60px 6% 40px}.contact-bottom{align-items:start;flex-direction:column;gap:15px}.contact h2>span{display:none}footer img{width:200px}dialog{padding:25px}.case-gallery{gap:10px}.case-intro{font-size:14px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-track{height:auto}.hero{position:relative}.art,.hero-art{transform:none!important}.project img{transition:none}}
[hidden]{display:none!important}

.case-tags{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 30px}.case-tags span{font-size:10px;border:1px solid #bdc3b2;border-radius:20px;padding:8px 12px}.case-headline{font-size:clamp(24px,3vw,38px);line-height:1.25;font-weight:500;letter-spacing:-.04em;max-width:850px}.supplied-gallery{align-items:start;gap:18px}.supplied-gallery img{height:auto;object-fit:contain;border-radius:0}.supplied-gallery img.wide{grid-column:1/-1}.supplied-gallery img:first-child{max-height:none;background:none}.supplied-gallery img:first-child:not(.wide){grid-column:auto}.case-story{display:grid;grid-template-columns:2fr 1fr;gap:50px;margin:45px 0}.case-story p{font-size:14px;line-height:1.9;margin:0 0 20px}.case-story aside{border-left:1px solid #bdc3b2;padding-left:25px}.case-story h4{font-size:14px;margin-top:0}.case-story ul{padding-left:15px;font-size:12px;line-height:1.9}.case-story li{margin-bottom:12px}@media(max-width:760px){.case-story{grid-template-columns:1fr;gap:25px}.case-story p{font-size:13px}.supplied-gallery{grid-template-columns:1fr}.supplied-gallery img{grid-column:1/-1!important}.case-tags span{font-size:9px}}

.case-video{margin:40px 0;display:flex;flex-direction:column;align-items:center;gap:12px}.case-video video{display:block;width:100%;height:auto;max-height:75vh;object-fit:contain;background:#111310}.case-video.vertical video{width:min(100%,380px);aspect-ratio:9/16}.case-video figcaption{font-size:11px;color:#65695f}

.case-media-pair{display:grid;grid-template-columns:45fr 64fr;align-items:start;gap:18px;margin:40px 0}.case-media-pair .case-video{margin:0}.case-media-pair .case-video video{width:100%;max-height:none}.case-media-pair .video-companion{display:block;width:100%;height:auto}@media(max-width:760px){.case-media-pair{grid-template-columns:1fr;gap:20px}.case-media-pair .case-video.vertical video{width:min(100%,380px)}}

.case-media-pair.equal-columns{grid-template-columns:1fr 1fr}@media(max-width:760px){.case-media-pair.equal-columns{grid-template-columns:1fr}}

.project-caption{align-items:flex-start;flex-direction:column;gap:10px}@media(max-width:1000px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.project-grid{grid-template-columns:minmax(0,1fr)}}

.supplied-gallery .gallery-video{display:block;width:100%;height:auto;object-fit:contain;background:#111310}.supplied-gallery .gallery-video.wide{grid-column:1/-1}

.project[data-name="New Kids"] figure img{object-fit:cover;object-position:50% 50%}

/* Human Sense — a single continuous, reversible scroll film. */
.hero-track{height:560vh;height:560svh;background:#111710;--opening:1;--shade:1}
.hero-film{height:100vh;height:100svh;min-height:0;background:#111710;padding-top:125px;isolation:isolate}
.film-stage{position:absolute;inset:0;z-index:-2;display:flex;align-items:center;justify-content:center}
.film-stage video{display:block;width:100%;height:100%;object-fit:contain}
.hero-film:after{z-index:-1;background:linear-gradient(90deg,rgba(8,19,12,.82),rgba(8,19,12,.48) 36%,transparent 75%);opacity:var(--shade);transition:none}
.hero-film:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#101810b3,transparent 22%,transparent 80%,#101810a6)}
.hero-film .hero-top{font-size:9px;text-shadow:0 1px 12px #0008}
.hero-opening{position:relative;z-index:3;opacity:var(--opening);transform:translateY(calc(var(--p,0)*-100px));pointer-events:none}
.hero-film h1{font-size:clamp(50px,6.3vw,102px);margin:35px 0 20px;line-height:1.01}
.hero-opening>p{font-size:11px;line-height:1.8}
.film-signature{position:absolute;right:4%;bottom:116px;text-align:right;z-index:3;text-shadow:0 2px 10px #000}
.film-signature span{display:block;font-size:11px;letter-spacing:2px;font-weight:600}
.film-signature small{display:block;font-size:10px;margin-top:8px}
.hero-film .scroll-label{display:block}
.hero-film .hero-bottom{align-items:center}
.hero-film .round-link{font-size:11px;text-shadow:0 1px 10px #000}
.film-status{position:absolute;left:4%;bottom:105px;font-size:10px;z-index:4;color:#fff;max-width:70%;text-shadow:0 1px 10px #000}
.film-status:empty{display:none}
.film-unavailable,.hero-track.film-manual{height:auto}
.film-unavailable .hero,.film-manual .hero{position:relative}
.film-unavailable .hero-opening{opacity:1;transform:none}
.film-manual .hero-opening,.film-manual .hero-top,.film-manual .film-signature,.film-manual .scroll-label{display:none}
.film-manual .film-stage{inset:100px 4% 140px;z-index:1}
.film-manual .hero:after{display:none}
.film-manual .film-status{bottom:104px}
.film-manual .hero-bottom{justify-content:flex-end}
@media(max-width:760px){
 .hero-track{height:460vh;height:460svh}
 .hero-film{height:100vh;height:100svh;min-height:600px;padding:106px 6% 28px}
 .film-stage{inset:0;align-items:center}
 .film-stage video{height:auto;aspect-ratio:16/9;object-fit:contain}
 .hero-film:after{background:linear-gradient(90deg,#0e1a12a6,transparent)}
 .hero-film h1{font-size:clamp(44px,10.8vw,76px);margin:28px 0 16px;line-height:1.04}
 .hero-opening>p{font-size:10px}
 .film-signature{right:6%;bottom:124px}
 .film-signature span{font-size:10px}
 .film-signature small{font-size:9px}
 .hero-film .hero-bottom{bottom:30px;gap:16px}
 .hero-film .round-link{font-size:9px}
 .hero-film .scroll-label{font-size:7px}
 .film-status{left:6%;bottom:90px;max-width:85%}
 .film-manual .film-stage{inset:100px 0 150px}
 .film-manual .hero-film,.film-unavailable .hero-film{min-height:600px}
 .hero-track.film-manual,.hero-track.film-unavailable{height:auto}
}
@media(prefers-reduced-motion:reduce){.hero-track{height:auto}.hero-film{position:relative}.hero-opening{transform:none!important}}

/* Viewport sizing and responsive typography. */
.hero-film{height:100svh;min-height:0;overflow:hidden}
.film-stage video{max-width:100%;object-fit:contain}
.hero-film .hero-opening{max-width:48rem}
@media(max-width:760px) and (orientation:portrait){
 .hero-film{min-height:0;padding-top:100px}
 .hero-film h1{font-size:clamp(32px,8vw,48px);margin:12px 0;line-height:1.02}
 .hero-opening>p{font-size:9px;margin-top:12px}
 .film-stage{inset:0}
 .film-stage video{height:100%;aspect-ratio:auto;object-fit:contain}
 .film-signature{bottom:100px}
 .hero-film .hero-bottom{bottom:max(22px,env(safe-area-inset-bottom));left:6%;right:6%}
 .hero-film .round-link{max-width:58%;gap:8px}
 .film-status{bottom:78px}
 .film-manual .hero-film,.film-unavailable .hero-film{min-height:0;height:100svh}
}
@media(max-height:550px) and (orientation:landscape){
 header{padding:14px 4%}header img{width:130px}
 .hero-film{height:100svh;min-height:0;padding:75px 4% 20px}
 .hero-film .hero-top{display:none}
 .hero-film h1{font-size:clamp(30px,7vh,46px);margin:0 0 8px}
 .hero-opening>p{display:none}
 .film-signature{bottom:78px;right:4%}
 .hero-film .hero-bottom{bottom:18px;left:4%;right:4%}
 .film-status{bottom:65px}
 .film-manual .hero-film,.film-unavailable .hero-film{min-height:0}
}

/* Responsive scroll sequence, with a visible poster before the first frame. */
.film-stage{z-index:0}
.hero-film:before,.hero-film:after{z-index:1}
.film-stage canvas,.film-stage .film-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.film-stage canvas{opacity:0}
.film-stage canvas.has-frame{opacity:1}
.film-stage canvas[hidden]{display:none}
.hero-track.film-still{height:100svh}
.film-still .hero-film{position:relative}
.film-still .scroll-label{display:none}

/* Full-bleed hero: the stage follows the site viewport on every screen. */
.hero-track{width:100%;max-width:100%}
.film-stage{inset:0;overflow:hidden}
@media(max-width:760px) and (orientation:portrait){
 .hero-film:after{background:linear-gradient(180deg,#0e1a12c9,transparent 72%)}
 .hero-film:before{background:linear-gradient(180deg,#10181099,transparent 24%,transparent 68%,#101810b3)}
 .hero-film .hero-opening{max-width:95%}
 .hero-film .film-signature{right:6%;bottom:112px}
 .film-stage canvas,.film-stage .film-poster{object-position:50% 50%}
}

.mobile-heading,.mobile-contact{display:none}
.hero h1 .desktop-heading{color:inherit}
@media(max-width:760px){
 html{scroll-padding-top:96px}
 header{position:fixed;inset:0 0 auto;z-index:30;min-height:72px;padding:calc(10px + env(safe-area-inset-top)) 6% 10px;background:#111710f5;border-bottom:1px solid #ffffff16}
 header>a:first-child{display:flex;align-items:center;min-height:44px}
 header img{width:140px;max-height:44px}
 header>.contact-pill{display:none}
 .menu{width:44px;height:44px;display:grid;place-items:center;margin-left:auto;border:1px solid #ffffff35;border-radius:50%;font-size:22px}
 header nav{top:100%;max-height:calc(100svh - 90px);overflow:auto;background:#111710;padding:18px 6% 28px;gap:8px;border-bottom:1px solid #ffffff35}
 header nav a{display:flex;align-items:center;min-height:48px;font-size:16px;padding:8px 0}
 header nav .mobile-contact{display:flex;color:var(--green)}
 .hero-track{height:400svh}
 .hero-film{padding-top:calc(100px + env(safe-area-inset-top))}
 .hero-top,.hero-opening>p,.desktop-heading{display:none}
 .hero h1 .mobile-heading{display:block;color:var(--paper);max-width:9ch;font-size:clamp(34px,9vw,54px);line-height:1.02;letter-spacing:-.05em}
 .hero-film .hero-bottom{bottom:max(22px,env(safe-area-inset-bottom));align-items:center}
 .hero-film .round-link{min-height:44px}
 .hero-film .film-signature{opacity:var(--ending,0);bottom:100px}
 .hero-film .scroll-label{font-size:7px;max-width:90px}
 .hero-track.film-still,.hero-track.film-unavailable{height:100svh}
}

/* Vector icons keep their designed shape instead of becoming phone emoji. */
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0;pointer-events:none}
.round-link b .ui-icon{width:1.25em;height:1.25em}
.open-project .ui-icon{width:1em;height:1em}
.asterisk .ui-icon{width:1em;height:1em;stroke-width:3.4;vertical-align:middle}
.menu .ui-icon,.close .ui-icon{width:22px;height:22px;vertical-align:middle}
