/* EB brochure: artwork-led, spacious, with the agency's original black and teal. */
:root{--ink-dim:#b4b4b4;--font-body:Mulish,"Avenir Next",sans-serif;--maxw:1480px}
body.page{font-size:16px}
a:focus-visible,button:focus-visible{outline:2px solid var(--eb-accent);outline-offset:6px}
.nav{padding-inline:clamp(20px,4vw,72px);min-height:84px;background:linear-gradient(#000 30%,#000d 75%,transparent)}
.nav__logo{display:flex;align-items:center;min-width:58px;min-height:48px}
.nav__logo .eb-logo{width:58px;height:44px;object-fit:contain}
.nav__links a{font-size:14px;letter-spacing:.13em;min-height:48px;display:inline-flex;align-items:center}
.page-hero,.case-head{padding:clamp(132px,15vh,190px) clamp(22px,5vw,86px) 64px;max-width:1480px}
.page-hero__title{font-size:clamp(64px,10vw,156px);letter-spacing:-.035em;font-weight:400;line-height:1.04;margin-top:24px}
.page-hero__sub{font-size:clamp(17px,1.45vw,22px);line-height:1.65;max-width:44ch;margin-top:28px}
.kicker{font-size:14px!important;letter-spacing:.16em}
.work-grid{max-width:1480px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:68px 32px;padding:0 clamp(22px,5vw,86px) 120px}
.portfolio-piece{display:block;color:inherit;text-decoration:none;min-width:0}
.portfolio-piece:nth-child(5n+1){grid-column:1/-1}
.portfolio-piece__visual{position:relative;overflow:hidden;margin:0;aspect-ratio:4/3;background:#151515}
.portfolio-piece:nth-child(5n+1) .portfolio-piece__visual{aspect-ratio:16/9}
.portfolio-piece__visual img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .7s var(--ease)}
.portfolio-piece:hover img{transform:scale(1.025)}
.portfolio-piece__open{position:absolute;right:20px;bottom:20px;width:48px;height:48px;display:grid;place-items:center;background:#000;color:white;font-size:24px;border-radius:50%;transition:background .2s,color .2s}
.portfolio-piece:hover .portfolio-piece__open{background:var(--eb-accent);color:#000}
.portfolio-piece__caption{display:flex;gap:24px;padding-top:22px;align-items:baseline;border-top:1px solid #ffffff22;margin-top:16px}
.portfolio-piece__number{font-family:var(--font-serif);font-size:21px;color:var(--eb-accent)}
.portfolio-piece h2{font:400 clamp(27px,2.5vw,40px)/1.2 var(--font-label);margin:0;letter-spacing:.005em}
.portfolio-piece p{font-size:14px;line-height:1.5;color:var(--ink-dim);margin:10px 0 0}
.case-head__name{font-size:clamp(58px,8.5vw,130px);font-weight:400;letter-spacing:-.025em;max-width:18ch}
.case-head__line{font-family:var(--font-serif);font-size:clamp(26px,3vw,42px);font-style:italic;max-width:30ch;color:#cacaca}
.case-intro{padding:20px clamp(22px,5vw,86px) 70px;grid-template-columns:2fr 1fr;gap:9vw}
.case-intro__lede{font-size:clamp(20px,2.1vw,30px);line-height:1.55}
.case-facts h4,.case-fact{font-size:14px;letter-spacing:.1em}
.stack-card{width:min(80vw,1180px);height:min(72svh,52vw);aspect-ratio:auto;border:0;border-radius:0;box-shadow:none;background:#111}
.stack-card img,.stack-card video{width:100%;height:100%;object-fit:cover;object-position:var(--crop,center);display:block}.stack-card::after{display:none}
.stack-counter{left:3vw}.stack-dots{right:2vw;gap:0}.stack-dot{width:44px;height:44px!important;background:radial-gradient(circle,#777 3px,transparent 4px)}
.stack-dot.is-active{background:radial-gradient(circle,var(--eb-accent) 5px,transparent 6px)}
.stack-dot:hover{background:radial-gradient(circle,#fff 5px,transparent 6px)}
.case-story{max-width:1050px;text-align:left;padding:75px clamp(22px,5vw,86px) 100px}.case-story__text{font-size:clamp(19px,1.7vw,25px)}
.prose,.approach,.personality{max-width:1480px;padding-inline:clamp(22px,5vw,86px)}
.prose{display:grid;grid-template-columns:1fr 1fr;gap:6vw;padding-top:0}.prose p{font-size:clamp(18px,1.65vw,24px);line-height:1.7;margin:0}
.studio-artwork{margin:80px 0;position:relative}.studio-artwork img{width:100%;height:70vh;object-fit:cover;display:block;filter:brightness(.65)}
.studio-artwork p{position:absolute;bottom:6vw;left:6vw;margin:0;font:400 clamp(36px,5vw,78px)/1.15 var(--font-label)}
.studio-artwork em{font-family:var(--font-serif);font-weight:400}
.approach__body,.personality__line{font-size:clamp(20px,2vw,28px);line-height:1.6}
.contact-grid{max-width:1480px;margin:0 auto;padding:24px clamp(22px,5vw,86px) 120px;gap:10vw}.contact-form label{font-size:14px}.contact-form input,.contact-form textarea{font:400 18px/1.6 var(--font-body);border-radius:0;min-height:52px}.contact-form__note{font-size:14px;line-height:1.6}
.cta{min-height:48px;font-size:14px}.footer__col h4{font-size:14px}.footer__col a,.footer__sub{font-size:16px;line-height:1.6}.footer__base{font-size:12px}
@media(max-width:760px){.nav__links{gap:20px}.nav__links a{font-size:13px}.nav__logo .eb-logo{width:45px}.page-hero,.case-head{padding-top:124px;padding-bottom:45px}.work-grid{grid-template-columns:1fr;gap:42px;padding-bottom:72px}.portfolio-piece:nth-child(n){grid-column:auto}.portfolio-piece:nth-child(n) .portfolio-piece__visual{aspect-ratio:4/3}.portfolio-piece__caption{gap:16px}.case-intro,.prose{grid-template-columns:1fr;gap:32px}.studio-artwork img{height:58svh}.studio-artwork p{left:22px;bottom:30px;right:22px}.is-editorial{height:auto!important;padding:0 22px}.is-editorial .stack-stage{height:auto;position:static;overflow:visible;perspective:none;display:grid;gap:22px}.is-editorial .stack-card{position:static;width:100%;height:auto;aspect-ratio:auto;transform:none!important;opacity:1!important}.is-editorial .stack-card img{height:auto}.is-editorial .stack-counter,.is-editorial .stack-dots,.is-editorial .stack-hint{display:none}.contact-grid{grid-template-columns:1fr;gap:54px}.contact-line a{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.portfolio-piece__visual img{transition:none}.is-editorial{height:auto!important;padding:0 5vw}.is-editorial .stack-stage{position:static;height:auto;display:grid;gap:30px;perspective:none}.is-editorial .stack-card{position:static;width:100%;height:auto;transform:none!important;opacity:1!important}.is-editorial .stack-card img{height:auto}.is-editorial .stack-counter,.is-editorial .stack-dots,.is-editorial .stack-hint{display:none}}
@view-transition{navigation:auto}
::view-transition-old(root){animation:fade-out .18s ease both}::view-transition-new(root){animation:fade-in .25s ease both}
@keyframes fade-out{to{opacity:0}}@keyframes fade-in{from{opacity:0}}
@media(prefers-reduced-motion:reduce){::view-transition-group(*){animation:none!important}}

.project-feature{margin:0 auto 80px;max-width:1480px;padding:0 clamp(22px,5vw,86px)}.project-feature img,.project-feature video{display:block;width:100%;height:auto;background:#141414}.project-feature figcaption{font-size:14px;line-height:1.5;color:#aaa;border-top:1px solid #ffffff22;margin-top:18px;padding-top:18px}.project-feature:first-of-type{padding-inline:0;max-width:none}.project-feature:first-of-type figcaption{margin-inline:5vw}.project-feature video{max-height:88svh;object-fit:contain}

/* All case-study media belongs to the original rotating sequence. */
.stack-card{margin:0}.stack-caption{position:absolute;left:20px;bottom:18px;right:20px;color:white;font:500 14px/1.5 var(--font-body);text-shadow:0 1px 8px #000;background:#0009;padding:9px 12px;width:fit-content;max-width:calc(100% - 40px);pointer-events:none}
.stack-card:has(video) .stack-caption{bottom:65px}
@media(max-width:760px){.stack-card{width:88vw;height:min(58svh,74vw)}.stack-caption{font-size:13px;left:12px;right:12px;bottom:12px;padding:7px 9px}.stack-hint{bottom:10svh}.stack-hint__label{font-size:13px}.stack-stage{height:100svh}.is-editorial .stack-card video{height:auto}.is-editorial .stack-caption{position:static;max-width:none;margin:0;width:auto;background:#161616;text-shadow:none}}
@media(prefers-reduced-motion:reduce){.is-editorial .stack-card video{height:auto}.is-editorial .stack-caption{position:static;max-width:none;margin:0;width:auto;background:#161616;text-shadow:none}}

/* Client films keep their full frame, including the square court film. */
.case-film { margin: 0 var(--pad, 5vw) clamp(3rem,7vw,7rem); text-align:center; }
.case-film__video { display:block; width:100%; height:auto; max-height:78svh; aspect-ratio:var(--film-ratio,16/10); object-fit:contain; margin:0 auto; background:#080c0c; }
.case-film figcaption { margin:1rem 0 0; color:var(--muted,#a2aaa7); font-size:.875rem; line-height:1.5; }
.case-film__video:focus-visible { outline:2px solid var(--eb,#b9dc50); outline-offset:5px; }
@media(max-width:760px) { .case-film {margin:0 0 3rem;} .case-film figcaption {padding:0 1.25rem;} .case-film__video {aspect-ratio:9/16;height:auto;max-height:none;object-fit:cover;object-position:center;} }

/* Transparent can piles continue the page surface and crop at its edges. */
body.page[data-page="studio"]{--studio-bg:#090d0e}
.footer-pile{position:relative;z-index:1;width:100%;aspect-ratio:2.05/1;margin:32px 0 0;overflow:hidden;pointer-events:none;line-height:0;background:transparent}
.footer-pile img{display:block;position:relative;left:var(--pile-left,-9%);width:118%;max-width:none;height:auto;background:transparent}
.footer-pile--1{--pile-left:-13%}
.footer-pile--2{--pile-left:-5%}
.footer-pile--3{--pile-left:-11%}
.footer-pile + .site-footer{position:relative;border-top:0;background:var(--studio-bg)}
@media(max-width:600px){.footer-pile{margin-top:24px;aspect-ratio:1.8/1}.footer-pile img{width:132%;left:-16%}.footer-pile--1 img{left:-20%}.footer-pile--2 img{left:-12%}}