.mobile-reel-slot{display:none}
@media(max-width:900px){
/* Compact pill menu and feathered header, matching the reference hierarchy. */
body>header .mobile-menu-toggle{min-width:84px;justify-content:center;padding:0 18px;border-radius:40px;background:#fff;color:#0b0b0e;font-size:13px;font-weight:600}
body>header.light-header .mobile-menu-toggle,body>header.site-header:not(.is-dark) .mobile-menu-toggle{background:#0b0b0e;color:#fff}
body>header .mobile-menu-toggle svg{display:none}
.hero{min-height:760px!important;min-height:100svh!important;padding:112px 20px 70px}
.hero .hero-copy h1{font-size:clamp(42px,11.8vw,80px)!important;line-height:1;letter-spacing:-.065em}
.hero .hero-diamond{height:clamp(270px,72vw,410px)!important;margin:10px 0 5px}
.hero .hero-copy p{font-size:16px!important;line-height:1.45}.hero .hero-copy .hero-note-right{font-size:clamp(12px,3.4vw,17px)!important}
.hero-scroll-cue{bottom:12px}
.mobile-reel-slot{display:block;padding:0 20px 35px;background:linear-gradient(#0b0b0e 0 25%,#fff 25%);position:relative}
.mobile-reel-slot .showreel{position:relative!important;inset:auto!important;display:grid!important;transform:none!important;width:100%!important;height:auto!important;aspect-ratio:1.65;border-radius:20px;border:0;opacity:1!important;pointer-events:auto!important;z-index:1}
.mobile-reel-slot .reel-play{top:50%;left:50%;transform:translate(-50%,-50%);width:auto;height:auto;padding:18px 24px;font-size:12px;border-radius:40px;white-space:nowrap}
.mobile-reel-slot .reel-play::after{display:none}
.intro{padding:70px 20px 45px}.intro h2{font-size:clamp(44px,11.4vw,72px);line-height:1.02}.about{padding:35px 20px 60px}.about>p{font-size:clamp(28px,7.5vw,40px);font-weight:600;line-height:1.08}.explore-links{margin-top:35px}.clients{padding:20px 20px 65px}
/* The mobile work reel follows vertical scrolling, without trapping touch gestures. */
.work-section{height:calc(100svh + 240vw)!important;padding:40px 0 0!important}
.work-sticky{position:sticky;top:90px;height:calc(100svh - 90px);overflow:hidden;padding:0 20px!important}
.work-sticky h2{margin:0 0 26px;font-size:42px;line-height:1.05}
.work-track{overflow:visible;scroll-snap-type:none;padding:0;gap:18px;transform:translate3d(var(--work-x,0px),0,0)!important}
.work-card.showcase-card{flex:0 0 calc(100vw - 40px);height:calc(100svh - 220px)!important;max-height:680px;min-height:440px;display:flex;border-radius:20px}
.showcase-card .showcase-visual{order:0;flex:1 1 52%;height:52%;min-height:0}
.showcase-card .showcase-copy{order:1;flex:0 0 auto;min-height:0;padding:22px;gap:12px}
.showcase-copy h3{font-size:30px!important}.showcase-copy .showcase-brand{font-size:14px}.showcase-copy .showcase-category{font-size:11px}
/* Angled method cards: one focal card with neighboring cards visible. */
.partnerships{height:calc(100svh + 250vw)!important;padding:40px 0 0!important;background:#0b0b0e}
.partners-sticky{position:sticky;top:90px;height:calc(100svh - 90px);overflow:hidden;padding:0 20px!important}
.partners-sticky h2{font-size:38px;line-height:1.03;margin:0;color:#fff}
.partners-sticky>.section-description{margin:25px 0 0;max-width:100%;font-size:21px;line-height:1.15;font-weight:600;color:#fff}
.partner-stage{position:absolute;left:0;right:0;bottom:26px;height:clamp(280px,43svh,400px);display:block;overflow:visible;padding:0;margin:0;transform:none!important}
.partner-card{position:absolute;left:50%;top:0;width:76vw;height:100%;max-width:480px;min-height:0;transform:translate(calc(-50% + var(--fan-x,0px)),var(--fan-y,0px)) rotate(var(--fan-angle,0deg))!important;transform-origin:50% 140%;border-radius:18px!important}
.partner-card strong{left:20px;right:20px;bottom:22px;font-size:29px}.partner-card strong small{font-size:14px;line-height:1.3;margin-top:10px}
/* Compact sticky service stack, like the reference's layered cards. */
.solutions{padding:55px 20px 70px}.solutions>h2{font-size:46px;line-height:1}.solutions>.section-description{font-size:22px;line-height:1.15;font-weight:600;margin:24px 0 35px}
.stack{width:90%;margin:0 auto}.solutions .stack-slot{position:sticky;top:110px!important;height:auto;padding:0 0 45px;margin:0}
.solutions .stack-slot:nth-child(2){top:118px!important}.solutions .stack-slot:nth-child(3){top:126px!important}.solutions .stack-slot:nth-child(4){top:134px!important}.solutions .stack-slot:nth-child(5){top:142px!important}.solutions .stack-slot:nth-child(6){top:150px!important}
.solutions .solution{padding:28px 24px 58px;min-height:420px;border-radius:20px;filter:var(--stack-depth,none)!important}.solutions .solution h3{font-size:36px;line-height:1.05;margin-top:24px}.solutions .solution p{font-size:16px;line-height:1.4;margin-top:28px}.solution .number{font-size:28px;font-weight:600}
.closing{padding:20px 20px 65px}.closing>a{min-height:340px}.closing>a strong{font-size:44px}
footer{padding:45px 20px 30px}.footer-heading{flex-wrap:wrap}.bye{font-size:54px;line-height:1}.footer-grid{gap:22px}.footer-main{gap:8px}.footer-bottom{padding-bottom:40px}
}
@media(max-width:900px) and (max-height:700px){.partners-sticky>.section-description{font-size:18px;margin-top:16px}.partner-stage{height:35svh;bottom:20px}.partner-card strong{font-size:24px}.partner-card strong small{font-size:12px}.work-card.showcase-card{min-height:360px}.showcase-copy h3{font-size:25px!important}.solutions .stack-slot{position:static}.solutions .solution{min-height:0}}
@media(max-width:900px) and (prefers-reduced-motion:reduce){.work-section,.partnerships{height:auto!important}.work-sticky,.partners-sticky{position:static;height:auto}.work-track{overflow:auto;transform:none!important}.partner-stage{position:relative;height:350px;display:flex;overflow:auto;gap:16px;margin-top:30px}.partner-card{position:relative;left:auto;flex:0 0 76vw;transform:none!important}.solutions .stack-slot{position:static}}
@media(max-width:900px){.clients .client-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;padding:0;margin:0;justify-items:stretch}.clients .client-grid>div{width:100%;max-width:none;min-width:0;height:135px;aspect-ratio:auto;display:grid;place-items:center}.clients .client-grid>div>span{width:100%;height:100%}.clients .client-grid img{width:auto;max-width:65%;height:auto;max-height:60%;object-fit:contain}}

/* Transparent glass menu, modest type, no automatic focus frame on the logo. */
.mobile-menu{background:rgba(12,16,13,.62);backdrop-filter:blur(32px) saturate(135%);-webkit-backdrop-filter:blur(32px) saturate(135%)}
.mobile-menu::backdrop{background:rgba(5,8,6,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mobile-menu nav a{font-size:30px;line-height:1.15;padding:11px 0;font-weight:600}
.mobile-menu-top>a{border:0;box-shadow:none}.mobile-menu-top>a:focus:not(:focus-visible){outline:none}
.mobile-menu-crystal{opacity:.12}
.mobile-menu-categories{background:rgba(255,255,255,.05);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}

@media(max-width:900px){.work-sticky{position:sticky!important;top:90px!important;overflow:hidden!important}.partner-stage{top:220px;bottom:auto;height:clamp(280px,48svh,420px)}.partners-sticky{height:calc(100svh - 90px)}}
@media(prefers-reduced-motion:no-preference){.hero .hero-diamond{transform:perspective(1100px) rotateX(var(--pointer-x,0deg)) rotateY(var(--pointer-y,0deg));transition:transform 360ms cubic-bezier(.22,1,.36,1)}}
/* Vertical gestures drive the horizontal project reel on mobile. */
@media(max-width:900px) and (prefers-reduced-motion:no-preference){
.work-showcase .work-track{transform:translate3d(var(--work-x,0px),0,0)!important;overflow:visible;scroll-snap-type:none;touch-action:pan-y;will-change:transform;padding:0;gap:18px}
.work-showcase .work-sticky{position:sticky!important;top:90px!important;overflow:hidden!important}
}
.mobile-menu nav .mobile-menu-ink{color:#fff}
.mobile-menu[open] nav .mobile-menu-ink{background-image:linear-gradient(90deg,#fff 0%,#fff 40%,#c9f73c 50%,transparent 60%,transparent 100%)}
.mobile-menu{background:rgba(8,11,9,.86)}
.mobile-menu::backdrop{background:rgba(5,8,6,.32)}
/* Agency references: preserve the artwork and consistent logo proportions. */
.references .logo-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.references .logo-wall>div{height:180px;min-width:0;aspect-ratio:auto;padding:28px;border-radius:18px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#f5f5f5}
.references .logo-wall img,.references .logo-wall>div:hover img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);mix-blend-mode:multiply;transform:none}
@media(max-width:900px){.references .logo-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.references .logo-wall>div{height:130px;padding:22px}}
.references .logo-wall{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:stretch;width:100%}
.references .logo-wall>div{width:100%;height:220px;min-height:220px;margin:0;padding:38px;box-sizing:border-box}
@media(max-width:900px){.references{padding:40px 20px 60px}.references .logo-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.references .logo-wall>div{height:160px;min-height:160px;padding:24px}}
