:root{
  --bg:#06111e;--bg2:#0a1929;--bg3:#10243a;--text:#f4f6f8;--muted:#aeb9c4;--line:rgba(223,231,238,.16);--silver:#dce3e9;--silver2:#91a0ad;--gold:#c79a58;--ease:cubic-bezier(.22,.7,.14,1);--header:78px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;overflow-x:hidden}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}img{display:block;width:100%;height:100%;object-fit:cover}figure{margin:0}::selection{background:var(--silver);color:var(--bg)}
.shell{padding-inline:20px}.section{position:relative;z-index:1}.section-kicker{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#95a2af}.section-kicker span{color:var(--gold)}.mega{margin:18px 0 0;font:400 clamp(2.55rem,10vw,5.4rem)/.98 Georgia,serif;letter-spacing:-.045em}.mega em{font-style:italic;color:var(--gold)}.body-copy{max-width:62ch;font-size:14px;line-height:1.85;color:var(--muted)}
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}.ambient{position:fixed;z-index:0;pointer-events:none;border-radius:50%;filter:blur(100px);opacity:.15;animation:ambientMove 12s ease-in-out infinite alternate}.ambient--a{width:50vw;height:50vw;background:#2d648f;left:-25vw;top:8vh}.ambient--b{width:46vw;height:46vw;background:#9e6d35;right:-28vw;top:55vh;animation-delay:-5s}@keyframes ambientMove{to{transform:translate3d(8vw,7vh,0) scale(1.15);opacity:.24}}.scroll-progress{position:fixed;left:0;right:0;top:0;height:2px;background:rgba(255,255,255,.05);z-index:190}.scroll-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--silver2),#fff,var(--gold));box-shadow:0 0 14px rgba(255,255,255,.7)}
.loader{position:fixed;inset:0;background:#02070d;z-index:999;display:grid;place-content:center;padding:28px;transition:opacity .85s var(--ease),visibility .85s}.loader.is-out{opacity:0;visibility:hidden}.loader__orbit{width:130px;aspect-ratio:1;margin:auto;position:relative;display:grid;place-items:center}.loader__orbit i{position:absolute;inset:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;animation:spin 3.8s linear infinite}.loader__orbit i:nth-child(2){inset:13%;border-style:dashed;animation-duration:2.8s;animation-direction:reverse}.loader__orbit i:nth-child(3){inset:28%;border-color:rgba(199,154,88,.5);animation-duration:1.8s}.loader__orbit b{width:62px;height:62px;border-radius:18px;border:1px solid #9eabb6;background:linear-gradient(145deg,#16314c,#06111d);display:grid;place-items:center;font-size:38px;box-shadow:0 18px 45px rgba(0,0,0,.55),inset 0 0 0 2px rgba(255,255,255,.06)}.loader__name{text-align:center;margin-top:20px;font-size:11px;letter-spacing:.26em;color:#d0d7dd}.loader__bar{width:min(76vw,360px);height:2px;background:#223141;margin-top:20px;overflow:hidden}.loader__bar i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--silver2),#fff,var(--gold))}.loader__meta{display:flex;justify-content:space-between;margin-top:10px;color:#85919e;font-size:9px;letter-spacing:.2em}.loader__meta strong{font-size:12px;color:#fff}@keyframes spin{to{transform:rotate(360deg)}}
.header{position:fixed;top:0;left:0;right:0;height:var(--header);z-index:170;padding:13px 15px;display:flex;align-items:center;gap:10px;transition:background .4s,border-color .4s,transform .55s var(--ease)}.header.is-scrolled{background:rgba(5,13,23,.74);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}.header.is-hidden{transform:translateY(-110%)}.brand{display:flex;align-items:center;gap:10px;min-width:0;margin-right:auto}.brand img{width:44px;height:44px;border-radius:12px;flex:none;box-shadow:0 10px 28px rgba(0,0,0,.42)}.brand span{display:flex;flex-direction:column;min-width:0}.brand b{font-size:9px;letter-spacing:.15em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand small{font-size:7px;color:#83909e;letter-spacing:.24em}.header-quote{height:40px;padding:0 14px;display:grid;place-items:center;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);font-size:12px;white-space:nowrap}.menu-toggle{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.04);display:grid;place-content:center;gap:6px}.menu-toggle i{display:block;width:16px;height:1px;background:#fff;transition:.35s var(--ease)}.menu-toggle.is-open i:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle.is-open i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:160;background:linear-gradient(180deg,#06111e,#0b1b2e 48%,#07121f);padding:105px 24px 34px;display:flex;flex-direction:column;transform:translateY(-102%);transition:transform .75s var(--ease);overflow:hidden}.menu.is-open{transform:none}.menu:before,.menu:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.05)}.menu:before{width:78vw;height:78vw;right:-30vw;top:-15vw;animation:spin 20s linear infinite}.menu:after{width:46vw;height:46vw;left:-20vw;bottom:10vh;border-style:dashed;animation:spin 14s linear infinite reverse}.menu nav{position:relative;z-index:1;display:flex;flex-direction:column}.menu nav a{font:400 clamp(2.8rem,13vw,5rem)/1.03 Georgia,serif;border-bottom:1px solid rgba(255,255,255,.08);padding:10px 0;display:flex;gap:12px}.menu nav a span{font:600 9px/1.8 Inter,sans-serif;color:var(--gold);letter-spacing:.17em}.menu footer{margin-top:auto;position:relative;z-index:1;display:grid;gap:10px;font-size:13px;color:#aab6c1}
.hero{height:100svh;min-height:720px;position:relative;overflow:hidden;background:#02070e}.hero-media,.hero-layer,.hero-shade{position:absolute;inset:0}.hero-layer{opacity:0;transform:scale(1.08);clip-path:inset(0 0 0 100%);transition:opacity .9s ease,transform 1.2s var(--ease),clip-path 1.05s var(--ease)}.hero-layer.is-active{opacity:1;transform:scale(1);clip-path:inset(0)}.hero-layer img{animation:heroDrift 8.4s ease-in-out infinite alternate;filter:saturate(.88) contrast(1.04)}@keyframes heroDrift{to{transform:scale(1.11) translate3d(-1.5%,1%,0)}}.hero-shade{background:linear-gradient(180deg,rgba(3,9,16,.34),rgba(3,9,16,.16) 25%,rgba(3,9,16,.62) 63%,#06111e 100%),linear-gradient(90deg,rgba(3,11,20,.86),rgba(3,11,20,.28) 70%,rgba(3,11,20,.1))}.hero-orbit{position:absolute;width:76vw;aspect-ratio:1;border-radius:50%;right:-38vw;top:15vh;opacity:.22}.hero-orbit i{position:absolute;inset:0;border:1px solid rgba(255,255,255,.22);border-radius:50%;animation:spin 25s linear infinite}.hero-orbit i:nth-child(2){inset:12%;border-style:dashed;animation-duration:16s;animation-direction:reverse}.hero-orbit i:nth-child(3){inset:27%;border-color:rgba(199,154,88,.42);animation-duration:10s}.hero-orbit i:nth-child(4){inset:39%;border-style:dotted;animation-duration:6s;animation-direction:reverse}.hero-content{position:relative;z-index:3;padding-top:calc(var(--header) + 9svh);padding-bottom:18svh}.eyebrow{margin:0;color:#c5ced6;font-size:10px;letter-spacing:.24em;text-transform:uppercase}.eyebrow:before{content:"";display:inline-block;width:34px;height:1px;background:var(--gold);vertical-align:middle;margin-right:10px}.hero-title{font-size:clamp(3.5rem,15vw,7.7rem);line-height:.89;letter-spacing:-.06em;margin:18px 0 0}.hero-title span{display:block;overflow:hidden;padding-bottom:.1em}.hero-title b{display:block;transform:translateY(115%);animation:titleUp 1.05s var(--ease) forwards}.hero-title span:nth-child(2) b{animation-delay:.13s}.hero-title span:nth-child(3) b{animation-delay:.26s}.hero-title .serif{font-family:Georgia,serif;font-style:italic;font-weight:400;color:#dce3e9}@keyframes titleUp{to{transform:none}}.hero-copy{max-width:42rem;font-size:14px;line-height:1.8;color:#c0cad4;margin:18px 0 0}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.btn{min-height:52px;padding:0 20px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:12px;font-size:12px;font-weight:800}.btn i{font-style:normal;font-size:17px}.btn--light{background:#eef2f5;color:#06111e;position:relative;overflow:hidden}.btn--light:before{content:"";position:absolute;left:-30%;top:-180%;width:28%;height:360%;transform:rotate(25deg);background:linear-gradient(90deg,transparent,#fff,transparent);animation:shine 3.7s ease-in-out infinite}.btn--glass{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.055);backdrop-filter:blur(12px)}@keyframes shine{55%,100%{left:120%}}.hero-status{margin-top:24px;border:1px solid rgba(255,255,255,.13);border-radius:24px;padding:17px;background:linear-gradient(145deg,rgba(7,17,29,.73),rgba(12,28,45,.33));backdrop-filter:blur(17px)}.hero-status small{font-size:9px;letter-spacing:.2em;color:var(--gold)}.hero-status h2{margin:8px 0 6px;font:400 28px/1 Georgia,serif}.hero-status p{margin:0;color:#aeb9c4;font-size:13px;line-height:1.65}.hero-progress-dots{display:flex;gap:7px;margin-top:14px}.hero-dot{flex:1;height:3px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}.hero-dot i{display:block;width:0;height:100%;background:linear-gradient(90deg,#fff,var(--gold))}.hero-dot.is-active i{animation:dotProgress 5.4s linear forwards}@keyframes dotProgress{to{width:100%}}.scroll-cue{position:absolute;left:20px;bottom:24px;z-index:3;display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:.22em;color:#97a4b0}.scroll-cue i{width:55px;height:1px;background:rgba(255,255,255,.22);position:relative;overflow:hidden}.scroll-cue i:after{content:"";position:absolute;inset:0;background:#fff;transform:translateX(-100%);animation:scan 2.4s ease-in-out infinite}@keyframes scan{50%,100%{transform:translateX(100%)}}
.ticker{height:60px;border-block:1px solid var(--line);overflow:hidden;display:flex;align-items:center;background:#081421;position:relative;z-index:1}.ticker-track{display:flex;align-items:center;gap:21px;width:max-content;animation:tickerMove 29s linear infinite}.ticker span{white-space:nowrap;font-size:10px;letter-spacing:.22em;color:#d2dbe3}.ticker i{font-style:normal;color:var(--gold)}@keyframes tickerMove{to{transform:translateX(-50%)}}
.manifesto{padding-top:100px;padding-bottom:115px}.manifesto .body-copy{margin-top:22px}.manifesto-strip{margin-top:34px;border:1px solid var(--line);border-radius:999px;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;position:relative}.manifesto-strip:before{content:"";position:absolute;left:-35%;top:0;bottom:0;width:35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);animation:stripGlow 3.8s ease-in-out infinite}.manifesto-strip span{text-align:center;padding:15px 4px;font-size:8px;letter-spacing:.14em;border-right:1px solid var(--line)}.manifesto-strip span:last-child{border-right:0}@keyframes stripGlow{50%{transform:translateX(285%)}100%{transform:none}}
.services{padding-bottom:130px}.services-head{padding-bottom:28px}.service-stack{display:grid;gap:20px;padding-inline:10px}.service-scene{height:76svh;min-height:540px;position:sticky;top:86px;border:1px solid rgba(255,255,255,.13);border-radius:30px;overflow:hidden;box-shadow:0 30px 74px rgba(0,0,0,.45)}.service-scene img{animation:sceneBreath 7.2s ease-in-out infinite alternate;filter:saturate(.88)}.service-scene:nth-child(even) img{animation-delay:-3s}@keyframes sceneBreath{to{transform:scale(1.075)}}.scene-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,10,18,.1),rgba(4,10,18,.18) 38%,rgba(4,10,18,.94) 100%),linear-gradient(90deg,rgba(4,11,19,.78),rgba(4,11,19,.15) 70%,transparent)}.scene-content{position:absolute;z-index:2;left:0;right:0;bottom:22px}.scene-content small{font-size:10px;letter-spacing:.2em;color:var(--gold)}.scene-content h3{margin:10px 0;font:400 clamp(2.45rem,10vw,4.8rem)/.94 Georgia,serif;letter-spacing:-.045em}.scene-content h3 em{font-style:italic;color:#dbe3e9}.scene-content p{margin:0;max-width:36rem;color:#c1ccd6;font-size:14px;line-height:1.7}.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.chips span{height:34px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18);display:inline-flex;align-items:center;background:rgba(255,255,255,.04);font-size:9px;letter-spacing:.16em;text-transform:uppercase}
.transform{height:315svh;position:relative;background:#02070d}.transform-sticky{position:sticky;top:0;height:100svh;overflow:hidden}.transform-media{position:absolute;inset:0}.transform-before,.transform-after{position:absolute;inset:0}.transform-after{overflow:hidden;clip-path:inset(0 100% 0 0);will-change:clip-path}.transform-media img{filter:saturate(.84)}.transform-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,9,16,.1),rgba(3,9,16,.36) 42%,rgba(3,9,16,.92) 100%)}.transform-line{position:absolute;z-index:3;left:0;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 18px rgba(255,255,255,.9);transform:translateX(0);will-change:transform}.transform-line i{position:absolute;left:50%;top:50%;width:42px;height:42px;border-radius:50%;border:1px solid #fff;transform:translate(-50%,-50%);background:rgba(4,10,18,.55);backdrop-filter:blur(12px)}.transform-line i:before,.transform-line i:after{content:"";position:absolute;top:50%;width:8px;height:8px;border-top:1px solid #fff;border-left:1px solid #fff}.transform-line i:before{left:10px;transform:translateY(-50%) rotate(-45deg)}.transform-line i:after{right:10px;transform:translateY(-50%) rotate(135deg)}.transform-copy{position:absolute;left:0;right:0;bottom:6svh;z-index:4}.transform-copy h2{font:400 clamp(2.6rem,10vw,5rem)/.98 Georgia,serif;letter-spacing:-.045em;margin:14px 0}.transform-copy h2 em{font-style:italic;color:var(--gold)}.transform-copy h2 strong{font-weight:400;color:#fff}.transform-copy p{max-width:34rem;color:#bdc8d2;font-size:13px;line-height:1.75;min-height:48px}.transform-meter{height:2px;background:rgba(255,255,255,.12);margin-top:20px}.transform-meter i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--silver2),#fff,var(--gold))}.transform-spacer{height:215svh}
.horizontal{height:410svh;position:relative;background:linear-gradient(#06111e,#081421)}.horizontal-sticky{position:sticky;top:0;height:100svh;overflow:hidden;padding-top:calc(var(--header) + 18px)}.horizontal-head{position:relative;z-index:3}.horizontal-head h2{font:400 clamp(2.4rem,9vw,4.4rem)/.98 Georgia,serif;letter-spacing:-.04em;margin:12px 0}.horizontal-head h2 em{font-style:italic;color:var(--gold)}.horizontal-viewport{position:absolute;left:0;right:0;top:35svh;bottom:9svh;overflow:hidden}.horizontal-track{height:100%;display:flex;gap:14px;padding-left:20px;padding-right:20px;will-change:transform}.project-card{width:82vw;max-width:520px;height:100%;flex:none;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.12);position:relative;background:#0c1825;box-shadow:0 24px 60px rgba(0,0,0,.38)}.project-card img{filter:saturate(.84);transform:scale(1.03)}.project-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,9,16,.02),rgba(3,9,16,.18) 42%,rgba(3,9,16,.92) 100%)}.project-card>div{position:absolute;z-index:2;left:18px;right:18px;bottom:18px}.project-card small{font-size:9px;letter-spacing:.18em;color:var(--gold)}.project-card h3{font:400 30px/1 Georgia,serif;margin:9px 0}.project-card p{margin:0;color:#aeb9c4;font-size:12px;line-height:1.65}.horizontal-progress{position:absolute;left:0;right:0;bottom:24px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;font-size:9px;letter-spacing:.17em;color:#94a1ad}.horizontal-progress>i{height:2px;background:rgba(255,255,255,.1);overflow:hidden}.horizontal-progress>i b{display:block;width:0;height:100%;background:linear-gradient(90deg,#fff,var(--gold))}.horizontal-spacer{height:310svh}
.auto-reel{padding-top:110px;padding-bottom:120px;overflow:hidden;background:#040b12}.auto-reel .mega{margin-bottom:35px}.auto-reel-track{display:flex;gap:12px;width:max-content;margin-top:12px}.auto-reel-track--one{animation:autoLeft 25s linear infinite}.auto-reel-track--two{animation:autoRight 29s linear infinite}.auto-reel-track figure{width:66vw;max-width:420px;height:280px;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.1);flex:none}.auto-reel-track img{filter:saturate(.82)}@keyframes autoLeft{to{transform:translateX(-50%)}}@keyframes autoRight{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.why{padding-top:105px;padding-bottom:115px}.why-grid{display:grid;gap:12px;margin-top:32px}.why-card{border:1px solid var(--line);border-radius:24px;padding:22px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012));position:relative;overflow:hidden}.why-card:before{content:"";position:absolute;width:25%;height:260%;left:-35%;top:-80%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);transform:rotate(25deg);animation:whyShine 5.2s ease-in-out infinite}.why-card:nth-child(2):before{animation-delay:1s}.why-card:nth-child(3):before{animation-delay:2s}.why-card:nth-child(4):before{animation-delay:3s}@keyframes whyShine{55%,100%{left:130%}}.why-card strong{font-size:10px;letter-spacing:.18em;color:var(--gold)}.why-card h3{font:400 30px/1 Georgia,serif;margin:20px 0 8px}.why-card p{margin:0;color:#9faab5;font-size:13px;line-height:1.7}
.real-work{padding-bottom:120px;background:#040b12}.real-work-head{padding-bottom:28px}.real-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-inline:8px}.real-grid figure{min-height:190px;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.real-grid img{filter:saturate(.76)}
.contact{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden}.contact-bg,.contact-shade{position:absolute;inset:0}.contact-bg img{animation:contactZoom 10s ease-in-out infinite alternate;filter:saturate(.8)}@keyframes contactZoom{to{transform:scale(1.1) translate3d(-1.5%,0,0)}}.contact-shade{background:linear-gradient(180deg,rgba(3,9,16,.12),rgba(3,9,16,.42) 38%,rgba(3,9,16,.96) 100%),linear-gradient(90deg,rgba(3,9,16,.82),rgba(3,9,16,.22) 70%,transparent)}.contact-inner{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:70px}.contact-cards{display:grid;gap:10px;margin-top:26px}.contact-card{min-height:78px;border-radius:22px;border:1px solid rgba(255,255,255,.15);background:rgba(7,18,31,.68);backdrop-filter:blur(16px);display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:4px;padding:16px 18px}.contact-card small{font-size:9px;letter-spacing:.18em;color:#8f9baa}.contact-card b{font-size:15px;line-height:1.4}.contact-card i{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;color:var(--gold);font-size:20px}.contact-cta{height:84px;border-radius:24px;background:#eef2f5;color:#06111e;display:flex;align-items:center;justify-content:space-between;padding:0 22px;margin-top:14px;font-size:11px;font-weight:900;letter-spacing:.1em;position:relative;overflow:hidden}.contact-cta:before{content:"";position:absolute;left:-28%;top:-180%;width:24%;height:360%;background:linear-gradient(90deg,transparent,#fff,transparent);transform:rotate(25deg);animation:shine 3.6s ease-in-out infinite}.contact-cta i{font-style:normal;font-size:28px}.site-footer{padding-top:32px;padding-bottom:44px;background:#030a11;border-top:1px solid rgba(255,255,255,.08);display:grid;gap:14px}.site-footer img{width:220px;height:auto}.site-footer p{margin:0;color:#8e9ba7;font-size:12px;line-height:1.7}.site-footer div{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:9px;letter-spacing:.13em;color:#778492}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .85s var(--ease),transform .95s var(--ease)}.reveal.is-visible{opacity:1;transform:none}
@media(min-width:760px){:root{--header:86px}.shell{padding-inline:6.5vw}.header{padding-inline:3.8vw}.header-quote{padding-inline:20px}.hero-content{padding-top:calc(var(--header) + 9svh);max-width:1180px}.hero-status{max-width:720px}.service-scene{height:78svh}.scene-content{bottom:5vw}.horizontal-track{padding-left:6.5vw;padding-right:6.5vw}.horizontal-viewport{top:31svh}.project-card{width:56vw}.why-grid{grid-template-columns:repeat(2,1fr)}.real-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding-inline:10px}.contact-cards{grid-template-columns:repeat(3,1fr)}.menu footer{grid-auto-flow:column;justify-content:start;gap:28px}}
@media(min-width:1100px){.service-stack{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;padding-inline:2vw}.service-scene{position:relative;top:auto;height:720px;min-height:720px}.service-scene:nth-child(even){transform:translateY(90px)}.services{padding-bottom:220px}.horizontal-viewport{top:28svh}.project-card{width:40vw}.why-grid{grid-template-columns:repeat(4,1fr)}.auto-reel-track figure{width:34vw}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.reveal{opacity:1!important;transform:none!important}}

/* FIX 1 — keep the V4 design, only prevent the hero status/scroll cue from clipping. */
.hero{
  height:auto;
  min-height:100svh;
}
.hero-content{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-bottom:110px;
}
.hero-status{
  flex:none;
  position:relative;
  z-index:4;
  margin-bottom:0;
}
.scroll-cue{
  left:auto;
  right:20px;
  bottom:28px;
  max-width:calc(100% - 40px);
  white-space:nowrap;
}
@media(min-width:760px){
  .hero-content{padding-bottom:120px}
  .scroll-cue{right:6.5vw;left:auto}
}
@media(max-width:520px){
  .hero-content{justify-content:flex-start;padding-bottom:96px}
  .scroll-cue{right:20px;bottom:22px}
  .scroll-cue span{font-size:8px}
  .scroll-cue i{width:42px}
}

/* ===== Mobile compositor / flicker fix =====
   Keeps the V4 visual design while avoiding expensive overlapping GPU effects
   seen on some Android / Samsung / Chrome devices during fast scrolling. */
.transform-after{
  clip-path:none!important;
  right:auto!important;
  width:0;
  overflow:hidden;
  will-change:width;
  contain:paint;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.transform-after img{
  position:absolute;
  left:0;top:0;
  width:100vw;
  max-width:none;
  height:100%;
  object-fit:cover;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.transform-sticky,.transform-media,.transform-before,.transform-line{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.transform-line{will-change:transform;transform:translate3d(0,0,0)}
.horizontal-track{
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  contain:layout style paint;
}
.project-card,.service-scene{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:translateZ(0);
}

@media(max-width:899px){
  /* Fixed blurred animated blobs are a common mobile compositor flicker trigger. */
  .ambient{display:none!important}

  /* Keep the glass look using translucent fills, but remove live background sampling. */
  .header.is-scrolled,.btn--glass,.hero-status,.contact-card{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .header.is-scrolled{background:rgba(5,13,23,.94)}
  .btn--glass{background:rgba(12,24,38,.74)}
  .hero-status{background:linear-gradient(145deg,rgba(7,17,29,.92),rgba(12,28,45,.82))}
  .contact-card{background:rgba(7,18,31,.92)}

  /* Filters on full-screen animated bitmaps force frequent re-rasterization on some GPUs. */
  .hero-layer img,.service-scene img,.transform-media img,.project-card img,.auto-reel-track img,.real-grid img,.contact-bg img{
    filter:none!important;
  }

  /* Sticky + JS transform caused layer promotion/demotion flashes. Sticky behavior stays. */
  .service-scene{
    will-change:auto!important;
    contain:paint;
  }

  /* The horizontal film now moves as one isolated layer. */
  .horizontal-sticky,.horizontal-viewport{contain:paint}
  .project-card{will-change:auto!important;opacity:1!important}

  /* Avoid costly shadows on the moving before/after divider. */
  .transform-line{box-shadow:0 0 8px rgba(255,255,255,.45)}
  .transform-line i{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(4,10,18,.9)}
}


/* ===== Flicker fix 2: mobile before/after =====
   On mobile the after layer is no longer resized on every scroll frame.
   It stays full-size and is moved only with a compositor transform. */
@media(max-width:899px){
  .transform-sticky,.transform-media{
    isolation:isolate;
    contain:paint;
    background:#02070d;
  }
  .transform-before,.transform-after{
    width:100%!important;
    right:0!important;
    overflow:hidden;
    contain:paint;
    transform:translate3d(0,0,0);
    transform-origin:left center;
    will-change:transform;
  }
  .transform-after{
    opacity:0;
    transition:opacity .08s linear;
  }
  .transform-after img{
    position:absolute!important;
    inset:0!important;
    width:100vw!important;
    max-width:none!important;
    height:100%!important;
    transform:none!important;
    will-change:auto!important;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .transform-media:after{
    transform:translateZ(0);
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .transform-line{
    box-shadow:none!important;
    will-change:transform;
    contain:layout paint;
  }
  .transform-line i{
    box-shadow:0 0 0 1px rgba(255,255,255,.28);
  }
  .transform-meter i{will-change:transform;transform-origin:left center}
}

/* ===== Flicker fix 3: project film image/layout reliability =====
   Mobile project cards now use an image-friendly cinematic ratio instead of
   stretching to the full viewport height. This prevents 16:9 artwork from
   appearing cropped/half-visible and keeps the first/last card fully reachable. */
@media(max-width:899px){
  .horizontal{
    height:390svh;
    background:linear-gradient(#06111e,#081421);
  }
  .horizontal-sticky{
    height:100svh;
    padding-top:calc(var(--header) + 14px);
    overflow:hidden;
    contain:layout paint;
  }
  .horizontal-head{
    position:relative;
    z-index:4;
  }
  .horizontal-head h2{
    margin-top:10px;
    font-size:clamp(2.15rem,9vw,3.4rem);
    line-height:.98;
  }
  .horizontal-viewport{
    top:31svh;
    bottom:auto;
    height:min(52svh,470px);
    overflow:hidden;
    display:flex;
    align-items:center;
    contain:layout paint;
  }
  .horizontal-track{
    height:auto!important;
    min-height:0;
    display:flex;
    align-items:center;
    gap:14px;
    padding:0 20px;
    will-change:transform;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .project-card{
    width:min(86vw,500px);
    max-width:none;
    height:auto!important;
    aspect-ratio:16 / 10;
    flex:0 0 auto;
    border-radius:24px;
    overflow:hidden;
    position:relative;
    contain:paint;
    background:#0b1725;
    box-shadow:0 18px 42px rgba(0,0,0,.32);
    transform:translateZ(0)!important;
  }
  .project-card img{
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    max-width:none;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .project-card:after{
    background:linear-gradient(180deg,rgba(3,9,16,.02),rgba(3,9,16,.12) 43%,rgba(3,9,16,.9) 100%);
  }
  .project-card>div{
    left:16px;
    right:16px;
    bottom:16px;
  }
  .project-card h3{
    font-size:clamp(24px,7vw,31px);
    margin:7px 0 5px;
  }
  .project-card p{
    font-size:11px;
    line-height:1.55;
    max-width:92%;
  }
  .horizontal-progress{
    bottom:22px;
    z-index:5;
  }
}

@media(max-width:420px) and (max-height:760px){
  .horizontal-viewport{top:32svh;height:min(48svh,390px)}
  .project-card{width:84vw;aspect-ratio:16 / 10}
  .project-card p{display:none}
}