@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');:root{--paper:#faf9f7;--ink:#151515;--muted:#737373;--red:#e32c29;--line:#dedbd6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif}button,input{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}.shell{max-width:1440px;margin:auto;padding-left:clamp(20px,5vw,80px);padding-right:clamp(20px,5vw,80px)}.micro{font-size:10px;font-weight:800;letter-spacing:.13em}.accent{color:var(--red)}.nav{height:84px;display:flex;align-items:center;gap:35px;border-bottom:1px solid var(--line)}.logo{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.065em;font-size:24px;white-space:nowrap}.logo span{color:var(--red);font-size:15px;margin:0 3px}.nav nav{margin-left:auto;display:flex;gap:34px;font-size:12px;font-weight:700}.nav nav a:hover,.footer a:hover{color:var(--red)}.nav-cta{border:1px solid var(--ink);padding:12px 17px;font-size:10px;font-weight:800;white-space:nowrap}.nav-cta span{color:var(--red);margin-left:12px}.menu{display:none;border:0;background:transparent;font-size:24px}.hero{padding-top:42px}.hero-top,.hero-bottom{display:flex;justify-content:space-between;gap:12px}.hero-title h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(70px,13.5vw,208px);line-height:.95;letter-spacing:-.105em;margin:34px 0 14px;white-space:nowrap}.red-mark{display:inline-block;width:.095em;height:.64em;background:var(--red);transform:translate(-.14em,-.01em);vertical-align:baseline}.hero-sub{display:flex;align-items:end;justify-content:space-between;margin-bottom:30px}.hero-sub p{font-size:clamp(16px,2vw,25px);line-height:1.25;letter-spacing:-.04em;font-weight:600;margin:0}.round-arrow{border:1px solid var(--ink);border-radius:50%;height:48px;width:48px;display:grid;place-items:center;font-size:26px}.hero-stage{min-height:340px;background:#e9e7e3;display:grid;grid-template-columns:1fr 2fr .8fr;align-items:center;overflow:hidden;padding:32px;gap:10px}.stage-left{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between}.stage-left strong{font-family:'Space Grotesk',sans-serif;font-size:clamp(27px,4vw,60px);line-height:.95;letter-spacing:-.07em}.stage-cards{height:260px;position:relative;display:flex;align-items:center;justify-content:center}.mock-card{width:35%;max-width:175px;aspect-ratio:3/4;background:#151515;color:white;box-shadow:0 15px 25px #0002;padding:15px;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(-12deg);margin-right:-24px}.mock-card span{font-size:9px;letter-spacing:.1em}.mock-card b{font-family:'Space Grotesk';font-size:55px;letter-spacing:-.08em}.mock-two{background:var(--red);transform:rotate(2deg) translateY(-12px);z-index:2}.mock-three{background:#67675e;transform:rotate(12deg)}.stage-right{font-size:10px;line-height:1.6;font-weight:800;letter-spacing:.08em;align-self:end;text-align:right}.hero-bottom{font-size:10px;font-weight:800;letter-spacing:.1em;padding-top:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}.work,.services{padding-top:100px;padding-bottom:100px}.section-top{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:35px}.section-top h2,.about h2{font-family:'Space Grotesk';font-size:clamp(36px,6vw,78px);line-height:1;letter-spacing:-.075em;margin:16px 0 0}.section-top em,.about em,.contact em{font-style:normal;color:var(--red)}.section-top p{max-width:335px;font-size:13px;line-height:1.7;color:var(--muted)}.filters{display:flex;gap:8px;overflow-x:auto;padding:0 0 26px;scrollbar-width:thin}.filter{background:transparent;border:1px solid #c7c3bc;border-radius:0;padding:10px 16px;font-size:11px;font-weight:800;white-space:nowrap}.filter.active,.filter:hover{background:var(--ink);color:white;border-color:var(--ink)}.gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.reel{min-width:0;text-align:left;background:transparent;border:0;padding:0;display:block}.thumb{position:relative;aspect-ratio:9/16;background:#d9d8d4;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}.reel:hover .thumb img{transform:scale(1.05)}.thumb:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}.play{position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:#ffffffd9;color:#151515;font-size:18px}.thumb-tag{position:absolute;z-index:1;bottom:12px;left:12px;color:white;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.reel-info{padding:12px 2px 0}.reel-info strong{font-size:13px;line-height:1.35;display:block;overflow-wrap:anywhere}.reel-info span{font-size:10px;color:var(--muted);display:block;margin-top:5px}.empty,.load-error{border:1px solid var(--line);padding:40px 24px;text-align:center;color:#555}.empty p{font-size:13px}.load-error{color:#9d2727}.about{background:#1c1c1c;color:white;padding:100px 0}.about-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:50px}.about-copy{align-self:end}.about-copy p{font-size:clamp(16px,2vw,22px);line-height:1.6;color:#d4d4d4}.pill-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.pill-row span{border:1px solid #6c6c6c;padding:9px 12px;font-size:9px;letter-spacing:.08em}.service-list{border-top:1px solid var(--line)}.service-list article{display:grid;grid-template-columns:50px 1.5fr 1fr 30px;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding:26px 0}.service-list article>span{font-size:11px;color:var(--red);font-weight:800}.service-list h3{font-size:clamp(18px,2.3vw,28px);letter-spacing:-.05em;margin:0}.service-list p{font-size:12px;color:var(--muted);margin:0}.service-list b{font-size:24px;font-weight:400}.contact{background:var(--red);color:white;padding:90px 0 65px}.contact h2{font-family:'Space Grotesk';font-size:clamp(48px,9vw,125px);line-height:.95;letter-spacing:-.085em;margin:35px 0 65px}.contact em{color:#1c1c1c}.contact-bottom{border-top:1px solid #ffffff7d;padding-top:22px;display:flex;justify-content:space-between;align-items:start;gap:25px}.contact-bottom p{font-size:15px;font-weight:600;line-height:1.5;margin:0}.socials{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.socials a{font-size:11px;font-weight:800;border:1px solid #ffffff9c;padding:12px 14px}.socials a:hover{background:white;color:var(--red)}.footer{min-height:80px;display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;font-weight:800;letter-spacing:.06em}.modal[hidden],.empty[hidden],.load-error[hidden]{display:none!important}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center}.modal-backdrop{position:absolute;inset:0;background:#000e}.modal-content{position:relative;z-index:1;max-height:100dvh;width:min(550px,100%);display:flex;flex-direction:column;align-items:center;padding:12px}.modal-header,.modal-controls{color:white;width:min(100%,390px);display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0}.modal-header strong{display:block;font-size:13px;margin-top:5px;max-width:300px}.modal-header button,.modal-controls button{border:1px solid #777;background:#242424;color:white;padding:9px 12px}.modal-controls a{font-size:10px;font-weight:800;color:white}.framebox{aspect-ratio:9/16;width:min(390px,calc((100dvh - 150px)*9/16),100%);max-height:calc(100dvh - 150px);background:black}.framebox iframe{width:100%;height:100%;border:0}.framebox:fullscreen{width:100vw;height:100dvh;max-height:none;display:grid;place-items:center;background:black}.framebox:fullscreen iframe{height:100%;width:min(100%,calc(100dvh*9/16))}@media(max-width:1050px){.gallery{grid-template-columns:repeat(4,minmax(0,1fr))}.hero-stage{grid-template-columns:1fr 1.5fr}.stage-right{display:none}}@media(max-width:760px){.nav{height:70px}.nav nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);z-index:10;padding:20px;flex-direction:column;box-shadow:0 8px 20px #0001}.nav nav.open{display:flex}.nav-cta{margin-left:auto}.menu{display:block}.hero-title h1{font-size:clamp(52px,13vw,110px)}.hero-stage{min-height:260px;padding:20px}.stage-cards{height:210px}.mock-card{padding:10px}.mock-card b{font-size:35px}.section-top{display:block}.section-top p{margin-top:18px}.gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.about-grid{grid-template-columns:1fr}.service-list article{grid-template-columns:25px 1fr 25px}.service-list p{grid-column:2;grid-row:2}.service-list b{grid-column:3;grid-row:1}.contact-bottom{flex-direction:column}.socials{justify-content:flex-start}}@media(max-width:520px){.hero{padding-top:28px}.hero-top .micro{font-size:8px}.hero-title h1{font-size:clamp(43px,12.8vw,68px);margin:35px 0 25px}.hero-stage{grid-template-columns:1fr;min-height:330px}.stage-left{display:flex;flex-direction:row;align-items:start}.stage-left strong{font-size:27px}.stage-cards{height:200px}.mock-card{width:32%;max-width:130px}.hero-sub p{font-size:16px}.work,.services,.about{padding-top:65px;padding-bottom:65px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.play{width:40px;height:40px}.reel-info strong{font-size:12px}.section-top h2,.about h2{font-size:40px}.contact{padding:65px 0}.contact h2{font-size:clamp(42px,10vw,70px)}.footer{flex-wrap:wrap;padding-top:20px;padding-bottom:20px}.nav-cta{font-size:9px;padding:10px}.logo{font-size:21px}}
/* Motion + live 9:16 reel wall */
@keyframes floatIn{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes drift{0%,100%{transform:translateY(0) rotate(-10deg)}50%{transform:translateY(-13px) rotate(-8deg)}}
@keyframes drift2{0%,100%{transform:translateY(-12px) rotate(2deg)}50%{transform:translateY(3px) rotate(4deg)}}
.hero-title{animation:floatIn .85s both}.hero-stage{animation:floatIn 1s .15s both}.mock-one{animation:drift 5s ease-in-out infinite}.mock-two{animation:drift2 4.5s ease-in-out infinite}.mock-three{animation:drift 5.5s ease-in-out infinite reverse}
.reel-live{animation:floatIn .55s both}.reel-live .thumb{isolation:isolate;background:#121212}.reel-live .thumb img{position:absolute;inset:0;z-index:0}
.reel-iframe{position:absolute;z-index:1;left:50%;top:50%;height:100%;width:177.78%;transform:translate(-50%,-50%);border:0;pointer-events:none;background:#111}
.reel-live .thumb:after{z-index:2;pointer-events:none}.reel-live .thumb-tag{z-index:3}
.sound-toggle,.expand-reel{position:absolute;z-index:4;border:1px solid #ffffff80;color:#fff;background:#111b;backdrop-filter:blur(8px);border-radius:50%;width:35px;height:35px;display:grid;place-items:center;font-size:17px;cursor:pointer}
.sound-toggle{right:9px;bottom:9px}.expand-reel{right:9px;top:9px}.reel-live.is-audible .sound-toggle{background:#e32c29}
.reel-live .thumb{transition:box-shadow .25s}.reel-live.is-audible .thumb{box-shadow:0 0 0 3px #e32c29}
.socials a{display:inline-flex;align-items:center;gap:9px;transition:transform .2s,background .2s}.socials a:hover{transform:translateY(-3px)}
@media(prefers-reduced-motion:reduce){.hero-title,.hero-stage,.mock-one,.mock-two,.mock-three,.reel-live{animation:none!important}*{scroll-behavior:auto!important}}

/* FINAL: reference-style dense vertical reels, original editorial design untouched */
@media(min-width:1101px){.gallery{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}}
@media(min-width:761px) and (max-width:1100px){.gallery{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}}
@media(max-width:760px){.gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}}
.reel-live .thumb{aspect-ratio:9/16;border-radius:7px;overflow:hidden;background:#141414}
.reel-live .reel-iframe{left:0;top:0;transform:none;width:100%;height:100%;object-fit:cover;z-index:1;pointer-events:none}
.reel-live .thumb-tag{z-index:3}
.reel-live .sound-toggle,.reel-live .expand-reel{z-index:4}
@media(max-width:500px){.reel-live .reel-info strong{font-size:10px;line-height:1.2}.reel-live .reel-info span{font-size:8px}.reel-live .sound-toggle,.reel-live .expand-reel{width:26px;height:26px;font-size:12px}}

/* Drive reels preserve the 9:16 card and use Google's native preview controls. */
.drive-thumb{background:linear-gradient(140deg,#252525,#111 60%,#b92a2a)}
.drive-thumb:before{content:'GOOGLE DRIVE REEL';position:absolute;top:45%;left:0;width:100%;text-align:center;color:#fff;font-size:12px;letter-spacing:.1em;pointer-events:none}
.drive-thumb:has(iframe):before{display:none}