@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

:root{--ink:#171719;--paper:#f5f5f7;--white:#fff;--dim:#74747a;--line:#dcdce0;--blue:#276de7}
:root{--blue:#ae470e}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}
button{cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
img{display:block}
.progress{position:fixed;top:0;left:0;width:0;height:2px;background:var(--blue);z-index:50}
header{height:72px;padding:0 clamp(24px,5vw,92px);display:flex;align-items:center;justify-content:space-between;position:absolute;inset:0 0 auto;z-index:30;color:#fff;border-bottom:1px solid #ffffff38;transition:background .4s,box-shadow .4s,color .4s}
header.scrolled{position:fixed;background:#f5f5f7e8;color:var(--ink);border-bottom:1px solid #00000012;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 8px 35px #0000000a}
.brand{font-size:18px;font-weight:700;letter-spacing:-.075em;line-height:.85;white-space:nowrap}
.brand span{display:block;font-size:8px;letter-spacing:.45em;margin-top:6px}
nav{display:flex;gap:clamp(22px,3vw,48px);font-size:13px;font-weight:500}
nav a,.contact-link{transition:opacity .2s}nav a:hover,.contact-link:hover{opacity:.6}
.contact-link{font-size:13px;font-weight:600;white-space:nowrap}.contact-link span{margin-left:9px;font-size:17px;font-weight:400}
.hero{height:100svh;min-height:690px;position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#08090c}
.hero-shade{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:brightness(.87)}
.hero-shade{z-index:-1;background:linear-gradient(90deg,#03040aaa 0%,#03040a55 60%,#03040a24),linear-gradient(0deg,#03040bc9 0%,transparent 42%,#0005 100%)}
.hero-content{position:absolute;bottom:clamp(42px,6vh,95px);left:clamp(24px,7vw,130px);right:clamp(24px,7vw,130px);max-width:1500px;margin:auto}
.eyebrow{font-size:11px;letter-spacing:.15em;line-height:1.5;font-weight:700;text-transform:uppercase;margin:0 0 28px}
.hero .eyebrow{color:#ffffffc8;animation:rise-in .8s .25s both}
h1,h2,h3,p{overflow-wrap:break-word}
h1{font-size:clamp(66px,9.7vw,164px);letter-spacing:-.085em;line-height:.98;font-weight:600;margin:0 0 42px}
h1 span,h1 em{display:inline-block;animation:hero-text-in 1.15s cubic-bezier(.22,1,.36,1) both}
h1 span{animation-delay:.18s}h1 em{font-style:normal;animation-delay:.42s}
.hero h1 em{color:#ffb37b}
.hero .eyebrow{color:#ffb37b}
.reel .play{border-color:#ffb37b;color:#ffb37b}
.hero-bottom{display:flex;align-items:end;gap:clamp(24px,5vw,85px)}
.hero-bottom>p,.hero-bottom .reel,.hero-bottom .scroll{animation:hero-text-in 1.15s cubic-bezier(.22,1,.36,1) both}
.hero-bottom>p{animation-delay:.68s}.hero-bottom .reel{animation-delay:.94s}.hero-bottom .scroll{animation-delay:1.12s}
.hero-bottom>p{font-size:clamp(16px,1.45vw,21px);line-height:1.5;max-width:380px;margin:0;color:#f2f2f6}
.reel{display:flex;gap:14px;align-items:center;font-size:14px;font-weight:600;white-space:nowrap}
.reel small{display:block;color:#c6c6ce;font-size:12px;font-weight:400;margin-top:4px}
.play{width:56px;height:56px;display:grid;place-items:center;border:1px solid #ffffff9c;border-radius:50%;font-size:13px;transition:background .25s,color .25s,transform .25s}
.reel:hover .play{background:#fff;color:#171719;transform:scale(1.08)}
.scroll{margin-left:auto;align-self:end;font-size:13px;font-weight:500;white-space:nowrap}.scroll span{display:inline-block;margin-left:10px;animation:nudge-down 2s ease-in-out infinite}
.hero-index{position:absolute;bottom:25px;right:clamp(24px,5vw,92px);font-size:10px;letter-spacing:.13em;color:#ffffff94}
.section{padding:clamp(90px,11vw,170px) clamp(24px,7vw,130px)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin:0 0 40px}
.section-heading>p{font-size:16px;line-height:1.65;color:var(--dim);margin:0 0 8px;max-width:370px}
h2{font-size:clamp(50px,6.4vw,102px);font-weight:600;line-height:1.04;letter-spacing:-.075em;margin:0}
.muted{color:#aaaab0}
.projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:70px 28px}
.project{min-width:0;display:block}.project.wide{grid-column:1/-1}
.photo{overflow:hidden;background:#e7e7ea;aspect-ratio:1.35;position:relative;border-radius:8px}
.wide .photo{aspect-ratio:2.15;background:#151516}
.photo img{width:100%;height:100%;object-fit:cover;transition:filter .6s;filter:saturate(.9)}
.wide .photo img{object-fit:contain}
.project:hover .photo img{filter:saturate(.9)}
.view{position:absolute;right:24px;bottom:24px;background:#fff;color:#111;border-radius:100px;font-size:11px;font-weight:700;letter-spacing:.06em;padding:14px 18px;opacity:0;transform:translateY(12px);transition:.3s}
.project:hover .view,.project:focus-visible .view{opacity:1;transform:none}
.project-label{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding-top:20px}
.project-label h3{font-size:clamp(20px,2vw,29px);font-weight:600;letter-spacing:-.05em;margin:0}
.project-label span{font-size:10px;font-weight:700;color:#777780;letter-spacing:.08em;text-align:right;line-height:1.5}
.archive-heading{border-top:1px solid var(--line);margin-top:35px;padding-top:25px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.archive-heading h3{font-size:clamp(23px,2.7vw,38px);font-weight:600;letter-spacing:-.055em;margin:0}
.text-button{border:0;background:none;color:var(--blue);font-size:13px;font-weight:600;padding:16px 0}.text-button:hover{text-decoration:underline}
.strip,.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:25px}.gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:20px}
.strip .image-button{aspect-ratio:1.5;border-radius:8px}
.strip .image-button:first-child,.strip .image-button:nth-child(8),.strip .image-button:nth-child(15){grid-column:1/-1;aspect-ratio:2.25}
.strip .image-button:first-child img{object-position:center 65%}
.recent-heading{margin:clamp(110px,12vw,175px) 0 48px}.recent-heading .eyebrow{color:#777780}.recent-heading h2{font-size:clamp(45px,5vw,80px)}
.image-button{padding:0;border:0;aspect-ratio:1.35;overflow:hidden;border-radius:5px;background:#ddd}
.image-button img{width:100%;height:100%;object-fit:cover;transition:transform .6s}.image-button:hover img{transform:scale(1.06)}
.clients{--gutter:clamp(24px,7vw,130px);padding:clamp(100px,10vw,160px) 0 110px;background:radial-gradient(ellipse at 50% 0%,#30323c 0%,#171719 55%,#101114 100%);color:#fff;overflow:hidden}
.clients-head{padding:0 var(--gutter);margin-bottom:55px}.clients .eyebrow{color:#b6b6be}.clients h2{font-size:clamp(50px,6vw,96px)}
.logo-window{display:grid;gap:18px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logo-row{overflow:hidden}.logo-track{display:flex;width:max-content;animation:logo-flow 34s linear infinite}.logo-row.reverse .logo-track{animation-direction:reverse;animation-duration:40s}
.logo-set{display:flex;gap:18px;padding-right:18px}.logo-card{flex:0 0 clamp(230px,24vw,350px);width:clamp(230px,24vw,350px);height:155px;display:grid;place-items:center;padding:25px 30px;border:1px solid #ffffff25;border-radius:16px;background:#ffffff0a;backdrop-filter:blur(12px)}
.logo-card img{width:100%;height:100%;object-fit:contain;opacity:1}
.studio{background:#101114;color:#f5f5f7;display:grid;grid-template-columns:1fr 3fr;gap:45px;padding-top:clamp(110px,12vw,185px);padding-bottom:clamp(110px,12vw,185px)}
.studio>.eyebrow{color:#aaaab0}
.studio-copy h2{font-size:clamp(50px,6.5vw,104px)}
.studio .muted{color:#76767c}
.about-columns{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);max-width:1000px;margin:65px 0 75px}
.about-columns p{font-size:clamp(17px,1.4vw,20px);line-height:1.65;color:#c5c5ca;margin:0}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;border-top:1px solid #ffffff29;padding-top:32px}
.stats>div{min-width:0}
.stats strong{display:block;font-size:clamp(47px,4.5vw,75px);font-weight:500;letter-spacing:-.075em;white-space:nowrap;font-variant-numeric:tabular-nums}
.stats strong span{color:#85858d}
.stats strong span{color:#ffad6c}
.stats small{display:block;margin-top:8px;color:#aaaab0;font-size:11px;font-weight:600;letter-spacing:.1em}
.visual-break{height:min(85svh,850px);min-height:520px;position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;padding:clamp(24px,7vw,130px);color:white;background:#141316}
.visual-break img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.visual-break:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#000b 0%,#0004 55%,#0002)}
.visual-break>div{max-width:900px}.visual-break p{font-size:clamp(54px,7vw,112px);line-height:1.04;letter-spacing:-.07em;font-weight:600;margin:15px 0 36px}
.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:100px;border:1px solid #ffffffa3;background:#ffffff17;color:#fff;padding:16px 27px;font-size:12px;font-weight:700;letter-spacing:.04em;transition:background .25s,color .25s,transform .25s;backdrop-filter:blur(8px)}
.pill:hover{background:#fff;color:#111;transform:translateY(-2px)}
.expertise{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(50px,8vw,140px);background:#fff}
.expertise-intro{font-size:18px;color:var(--dim);line-height:1.6;margin-top:35px}
.services details{border-top:1px solid var(--line);padding:25px 0}.services details:last-child{border-bottom:1px solid var(--line)}
.services summary{display:flex;align-items:center;gap:20px;list-style:none;font-size:clamp(20px,1.8vw,27px);font-weight:600;letter-spacing:-.045em;cursor:pointer}.services summary::-webkit-details-marker{display:none}
.services summary span{font-size:12px;font-weight:600;color:#9b9ba2;letter-spacing:0}
.services b{margin-left:auto;color:#909097;font-weight:400;font-size:25px;transition:transform .25s}.services details[open] b{transform:rotate(45deg)}
.services details p{font-size:16px;color:#66666e;line-height:1.7;max-width:540px;margin:20px 20px 0 42px}
.theatre{--gutter:clamp(24px,7vw,130px);background:#fff;padding:clamp(100px,10vw,160px) 0 115px;overflow:hidden}
.theatre-head{padding:0 var(--gutter);display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:50px}.theatre-head .eyebrow{color:#777780}.theatre-head h2{font-size:clamp(48px,6vw,95px)}
.theatre-total{font-size:12px;font-weight:700;letter-spacing:.14em;color:#94949c;white-space:nowrap;margin-bottom:9px}
.theatre-wall{display:grid;gap:14px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.theatre-row{overflow:hidden}.theatre-track{display:flex;width:max-content;animation:logo-flow 38s linear infinite}.theatre-row-2 .theatre-track,.theatre-row-4 .theatre-track{animation-direction:reverse;animation-duration:44s}.theatre-row-3 .theatre-track{animation-duration:41s}.theatre-row-5 .theatre-track{animation-duration:46s}
.theatre-set{display:flex;gap:14px;padding-right:14px}.theatre-card{flex:0 0 clamp(175px,18vw,270px);width:clamp(175px,18vw,270px);height:155px;display:grid;place-items:center;border:1px solid #e6e6ea;border-radius:13px;background:radial-gradient(circle at 80% 5%,#ececf3,#f9f9fb 58%);overflow:hidden}.theatre-card:nth-child(3n+2){background:radial-gradient(circle at 15% 90%,#e8edf5,#f9f9fb 60%)}.theatre-card:nth-child(3n+3){background:radial-gradient(circle at 85% 90%,#f1ecf5,#faf9fb 60%)}
.theatre-card img{width:100%;height:100%;object-fit:contain;padding:20px 12px}.theatre-card.light-mark img{filter:brightness(0)}
.contact{background:#e9e9ed;padding-top:clamp(95px,10vw,150px);padding-bottom:clamp(85px,9vw,130px)}
.contact>.eyebrow{color:#777780}
.contact-title{font-size:clamp(63px,11vw,176px);line-height:.96;letter-spacing:-.085em;font-weight:600;max-width:1200px;margin:0}
.contact-title em{font-style:normal;color:#9e9ea7}
.contact-title em{color:#cf5213}
.contact-intro{font-size:clamp(18px,2vw,25px);line-height:1.4;margin:40px 0 32px}
.contact-options{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:16px}
.contact-option{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-width:0;min-height:245px;padding:clamp(26px,3vw,42px);border-radius:16px;transition:transform .25s,box-shadow .25s}
.contact-option:hover{transform:translateY(-4px);box-shadow:0 14px 30px #1112}
.contact-email{background:#fff;color:#171719}
.contact-whatsapp{background:#151719;color:#fff}
.contact-option-label{font-size:12px;font-weight:700;letter-spacing:.13em}
.contact-option-main{display:flex;align-items:end;justify-content:space-between;gap:15px;width:100%;font-size:clamp(24px,2.55vw,39px);font-weight:600;line-height:1.13;letter-spacing:-.055em}
.contact-option-main>.contact-arrow{flex:none;font-weight:400;font-size:30px;line-height:1}
.contact-email .contact-option-main{word-break:normal;overflow-wrap:normal}
.contact-email .contact-option-main:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.copy-email{border:0;background:none;padding:0;color:var(--blue);font-size:14px;font-weight:600}
.copy-email:hover{text-decoration:underline}
.contact-whatsapp .contact-option-main{font-size:clamp(40px,5vw,76px)}
.contact-option-hint{font-size:15px;color:#d0d0d5}
.section-heading .eyebrow,.recent-heading .eyebrow,.theatre-head .eyebrow,.contact>.eyebrow,.expertise .eyebrow{color:#ae470e}
.clients .eyebrow,.studio>.eyebrow{color:#ffb37b}
.services summary span,.theatre-total{color:#ae470e}
.contact-email{border-top:4px solid #f47729}
.contact-whatsapp .contact-option-label,.contact-whatsapp .contact-arrow{color:#ffb37b}
footer{padding:45px clamp(24px,7vw,130px);display:flex;justify-content:space-between;align-items:start;gap:25px;background:#101114;color:#f5f5f7}
footer p,footer>a:last-child{font-size:12px;line-height:1.6;color:#a3a3ab;margin:0}
dialog{border:0;border-radius:12px;padding:18px;background:#141416;color:#fff;max-width:95vw;max-height:95svh;box-shadow:0 30px 100px #0008}
dialog::backdrop{background:#000d;backdrop-filter:blur(10px)}
dialog img{max-width:85vw;max-height:75svh;object-fit:contain}dialog p{font-size:14px;max-width:800px}
dialog button{position:absolute;right:22px;top:22px;width:44px;height:44px;border:0;border-radius:50%;color:#fff;background:#000a}
.reveal{transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1)}.reveal.waiting{opacity:0;transform:translateY(35px)}
@keyframes rise-in{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-text-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes nudge-down{50%{transform:translateY(5px)}}
@keyframes logo-flow{to{transform:translateX(calc(0px - var(--loop-distance)))}}
@media(max-width:1000px){.hero-bottom{gap:25px}.studio{grid-template-columns:1fr;gap:30px}.expertise{grid-template-columns:1fr;gap:45px}.section-heading{align-items:start}.theatre-logos{grid-template-columns:repeat(4,1fr)}}
@media(max-width:700px){header{height:64px;padding:0 22px}.brand{font-size:15px}.brand span{font-size:7px;letter-spacing:.37em}nav{gap:15px;font-size:12px}nav a:last-child{display:none}.contact-link{font-size:12px}.contact-link span{margin-left:2px}.hero{min-height:650px;height:92svh}.hero-video{object-position:58% center}.hero-content{left:24px;right:24px;bottom:83px}h1{font-size:clamp(55px,13vw,96px);margin-bottom:30px}.hero-bottom{display:grid;grid-template-columns:1fr auto;gap:24px}.hero-bottom>p{grid-column:1/-1;max-width:370px;font-size:16px}.scroll{display:none}.hero-index{bottom:22px;right:24px;font-size:9px}.eyebrow{font-size:10px;margin-bottom:20px}.section{padding:75px 24px}.section-heading{display:block;margin-bottom:38px}.section-heading>p{margin-top:25px}.projects{grid-template-columns:1fr;gap:45px}.project.wide{grid-column:auto}.photo,.wide .photo{aspect-ratio:1.25}.project-label{display:block}.project-label span{display:block;text-align:left;margin-top:8px}.view{opacity:1;transform:none;font-size:10px;bottom:14px;right:14px}.archive-heading{margin-top:65px}.strip,.gallery{grid-template-columns:repeat(2,1fr);gap:9px}.logos{grid-template-columns:repeat(2,1fr)}.logos img{height:95px}.clients{padding-top:70px;padding-bottom:70px}.about-columns{grid-template-columns:1fr;gap:18px;margin:32px 0 50px}.stats{gap:10px}.stats strong{font-size:44px}.stats small{font-size:9px;line-height:1.5;letter-spacing:0}.visual-break{height:620px;min-height:0;align-items:end;padding:60px 24px}.visual-break p{font-size:clamp(49px,11vw,78px)}.theatre-logos{grid-template-columns:repeat(3,1fr)}.theatre-logo{height:85px;padding:7px}.contact-title{font-size:clamp(52px,12vw,90px)}.contact-bottom{display:block;margin:35px 0}.contact-bottom p{font-size:17px;margin-bottom:24px}form{grid-template-columns:1fr;gap:26px}.full{grid-column:auto}footer{padding:35px 24px;display:grid;grid-template-columns:1fr 1fr}footer .brand{grid-column:1/-1}}
@media(max-width:390px){nav{gap:11px}nav a{font-size:11px}.contact-link{font-size:11px}.hero-bottom>p{font-size:15px}.reel{font-size:12px}.play{width:48px;height:48px}h1{font-size:13.2vw}.stats strong{font-size:37px}}
@media(max-width:700px){.hero-content{bottom:38px}.strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.strip .image-button{aspect-ratio:1.15}.strip .image-button:last-child:nth-child(odd){grid-column:span 2;aspect-ratio:2.4}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.archive-heading{margin-top:24px}.recent-heading{margin:100px 0 32px}.stats{display:block;padding-top:0}.stats>div{display:grid;grid-template-columns:145px minmax(0,1fr);gap:12px;align-items:center;min-height:92px;border-bottom:1px solid #ffffff24}.stats>div:last-child{border-bottom:0}.stats strong{font-size:clamp(39px,10vw,49px)}.stats small{margin:0;font-size:11px;line-height:1.35;letter-spacing:.045em}.theatre-logo{background:#fff}}
@media(max-width:700px){.clients{padding:80px 0 85px}.clients-head{margin-bottom:36px}.logo-window{gap:12px;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.logo-set{gap:12px;padding-right:12px}.logo-card{flex-basis:210px;width:210px;height:125px;padding:18px 22px;border-radius:14px}.theatre{padding:90px 0 85px}.theatre-head{display:block;margin-bottom:32px}.theatre-head h2{font-size:clamp(43px,10vw,70px)}.theatre-controls{margin-top:28px}.theatre-controls span{margin-right:auto}.theatre-controls button{width:48px;height:48px}.theatre-logos{gap:12px}.theatre-card{flex-basis:min(76vw,330px);height:255px}.theatre-card img{padding:38px 15px 10px}.theatre-number{top:21px;left:21px}}
@media(max-width:700px){.theatre-total{display:block;margin:22px 0 0}.theatre-wall{gap:10px}.theatre-set{gap:10px;padding-right:10px}.theatre-card{flex-basis:145px;width:145px;height:115px;border-radius:10px}.theatre-card img{padding:12px 8px}}
@media(max-width:700px){.theatre-wall{gap:8px}.theatre-card{height:102px}}
@media(max-width:700px){.strip .image-button:first-child{grid-column:1/-1;aspect-ratio:1.45}.strip .image-button:last-child:nth-child(odd){grid-column:auto;aspect-ratio:1.15}}
@media(max-width:700px){.strip .image-button:nth-child(8),.strip .image-button:nth-child(15){grid-column:auto;aspect-ratio:1.15}.strip .image-button:nth-child(3n+1),.strip .image-button:last-child:nth-child(3n+1){grid-column:1/-1;aspect-ratio:1.45}}
@media(max-width:700px){.contact-intro{margin:28px 0}.contact-options{grid-template-columns:1fr;gap:12px}.contact-option{min-height:205px;padding:26px}.contact-email .contact-option-main{display:block;font-size:clamp(20px,5.5vw,29px)}.contact-email .contact-arrow{display:none}.contact-whatsapp .contact-option-main{font-size:clamp(42px,11vw,60px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal.waiting{opacity:1;transform:none}.hero-video{display:none}}
@media(prefers-reduced-motion:reduce){.logo-window{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.logo-row{overflow:visible}.logo-track{animation:none!important}}
@media(prefers-reduced-motion:reduce){.theatre-wall{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.theatre-row{overflow:visible}.theatre-track{animation:none!important}}

.work-categories{margin:20px 0 0;color:#ae470e;font-size:12px;font-weight:700;letter-spacing:.15em;line-height:1.5}

/* Keep the complete portfolio visible at useful image sizes. */
.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:25px}
.gallery .image-button{aspect-ratio:16/9}
@media(max-width:700px){.strip,.gallery{grid-template-columns:minmax(0,1fr);gap:16px}.gallery .image-button,#work .strip .image-button{grid-column:auto;aspect-ratio:16/9}.archive-heading{margin-top:48px}}

.portfolio-more{background:#f4f4f6}.portfolio-more .section-heading{margin-bottom:35px}.portfolio-more .section-heading .eyebrow{color:#ae470e}

/* Let the work set the pace: one panoramic image, then two paired rows. */
.gallery{gap:clamp(14px,1.7vw,26px)}
.gallery .image-button{position:relative;aspect-ratio:16/9;border-radius:8px;background:#171719;box-shadow:0 14px 34px #17171912;transition:box-shadow .4s ease,transform .4s ease}
.gallery .image-button:nth-child(5n+1){grid-column:1/-1;aspect-ratio:2.25}
.gallery .image-button img{transition:transform .8s cubic-bezier(.22,1,.36,1),filter .6s;filter:saturate(.93)}
.gallery .image-button:hover,.gallery .image-button:focus-visible{box-shadow:0 18px 46px #b64e1829;transform:translateY(-2px)}
.gallery .image-button:hover img,.gallery .image-button:focus-visible img{filter:saturate(1.07)}

/* A final, clear invitation with small warm highlights. */
.contact{position:relative;isolation:isolate;overflow:hidden;color:#f7f7f8;background:#111214;padding-top:clamp(105px,11vw,180px);padding-bottom:clamp(105px,11vw,165px)}
.contact:before{content:'';position:absolute;z-index:-1;right:-14%;top:-28%;width:min(75vw,900px);height:min(75vw,900px);border-radius:50%;background:radial-gradient(circle,#ee6c2526 0%,#ee6c250d 35%,transparent 68%);pointer-events:none}
.contact:after{content:'';display:block;width:100%;height:1px;background:linear-gradient(90deg,#ef7437,transparent 72%);margin-top:clamp(62px,8vw,115px);opacity:.65}
.contact>.eyebrow{color:#ffad79;margin-bottom:clamp(35px,4vw,65px)}
.contact-title{max-width:1400px;font-size:clamp(67px,11.5vw,188px)}
.contact-title em{color:#fb8d4c;text-shadow:0 0 75px #fb7b2e30}
.contact-intro{color:#c7c5c5;max-width:650px;margin:clamp(32px,4vw,60px) 0 32px}
.contact-options{gap:clamp(14px,1.5vw,24px)}
.contact-option{min-height:clamp(245px,25vw,340px);border-radius:10px;transition:transform .3s,box-shadow .3s,border-color .3s}
.contact-option:hover{box-shadow:0 24px 55px #0006,0 0 35px #ef743725}
.contact-email{border:1px solid #f49a66;border-top:4px solid #f47729;background:#f5f4f2}
.contact-email .contact-option-main{font-size:clamp(25px,2.65vw,43px)}
.contact-email .contact-arrow{color:#ba4d18}
.contact-whatsapp{border:1px solid #ffffff2a;background:#242426}
.contact-whatsapp:hover{border-color:#f49a66}
.contact-option-label{font-size:13px}
.contact-whatsapp .contact-option-label,.contact-whatsapp .contact-arrow{color:#ffa66e}
.contact-option-hint{color:#bdbdc3}
.work-categories{color:#ae470e}
.reel:hover .play{border-color:#ffb37b;background:#ffb37b;color:#171719}
@media(max-width:700px){
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .gallery .image-button{grid-column:auto;aspect-ratio:1.12}
  .gallery .image-button:nth-child(5n+1){grid-column:1/-1;aspect-ratio:1.6}
  .contact{padding-top:95px;padding-bottom:72px}
  .contact-title{font-size:clamp(58px,11.5vw,88px)}
  .contact:after{margin-top:66px}
  .contact-option{min-height:205px}
  .contact-email .contact-option-main{font-size:clamp(20px,5.5vw,29px)}
}
@media(max-width:390px){.gallery .image-button:nth-child(5n+1){aspect-ratio:1.4}}
@media(prefers-reduced-motion:reduce){.gallery .image-button:hover,.gallery .image-button:focus-visible{transform:none}}

/* The theatre wall shares the clients section's dark stage-like backdrop. */
.theatre{background:radial-gradient(ellipse at 50% 0%,#30323c 0%,#171719 55%,#101114 100%);color:#fff}
.theatre-head .eyebrow{color:#ffb37b}
.theatre-total{color:#c5c4cb}
.theatre-card,.theatre-card:nth-child(3n+2),.theatre-card:nth-child(3n+3){border-color:#ffffff25;background:#ffffff0a;backdrop-filter:blur(12px)}
.theatre-card.light-mark img{filter:none}
.theatre-row-1 .theatre-card:nth-child(4) img,.theatre-row-5 .theatre-card:nth-child(2) img,.theatre-row-5 .theatre-card:nth-child(4) img{filter:brightness(1.45)}

/* The same measured logo group repeats beyond the viewport before looping. */
.logo-track,.theatre-track{animation-play-state:paused}
.logo-track.loop-ready,.theatre-track.loop-ready{animation-play-state:running}

/* A hairline highlight replaces hover zoom on all work photographs. */
.gallery .image-button{box-shadow:none;transform:none}
.gallery .image-button:after,.project .photo:after{content:'';position:absolute;inset:0;border:1px solid transparent;border-radius:inherit;pointer-events:none;transition:border-color .3s ease}
.gallery .image-button:hover,.gallery .image-button:focus-visible{box-shadow:none;transform:none}
.gallery .image-button:hover:after,.gallery .image-button:focus-visible:after,.project:hover .photo:after,.project:focus-visible .photo:after{border-color:#ee864c}
.gallery .image-button img,.gallery .image-button:hover img,.gallery .image-button:focus-visible img{transform:none;filter:saturate(.93)}

/* Let each loaded photograph glide gently into its place once. */
.gallery .image-button{background:#e7e7ea}
.gallery .image-button,.project .photo{--entry-distance:40px}
.gallery .image-button.photo-awaiting,.project .photo.photo-awaiting{opacity:0;transform:translate3d(0,var(--entry-distance),0)}
.gallery .image-button.photo-entering,.project .photo.photo-entering{animation:photo-glide 1.75s cubic-bezier(.35,0,.25,1) both;will-change:transform,opacity}
@keyframes photo-glide{from{opacity:0;transform:translate3d(0,var(--entry-distance),0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(max-width:700px){.gallery .image-button,.project .photo{--entry-distance:26px}}

.gallery-fallback{display:block;grid-column:1/-1;padding:38px;border:1px solid var(--line);border-radius:8px;font-size:18px;font-weight:600}
.gallery-fallback:hover{border-color:#ae470e;color:#ae470e}
@media(max-width:700px){html{scroll-padding-top:76px}header,header.scrolled{height:64px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;gap:6px}header .brand,header nav,header .contact-link{grid-column:auto;grid-row:auto;flex:0 0 auto}header .brand{font-size:13px}header .brand span{font-size:6px;margin-top:5px}header nav{gap:9px;justify-content:flex-start}header nav a{font-size:11px;white-space:nowrap}header nav a:last-child{display:inline}header .contact-link{font-size:10px}header .contact-link span{display:none}}
@media(max-width:390px){header,header.scrolled{padding:0 10px;gap:4px}header .brand{font-size:12px}header nav{gap:6px}header nav a{font-size:11px}header .contact-link{font-size:10px}}
@media(max-width:340px){header,header.scrolled{padding:0 8px;gap:3px}header .brand{font-size:11px}header nav{gap:5px}header nav a{font-size:10px}header .contact-link{font-size:9px}}
