@font-face{font-family:Geist;src:url('/assets/geist-300.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}
/* Homepage hero elements share a centred 1360px content area. */
:is(.studio-home,.portfolio-home) .hero-content{left:max(24px,calc((100% - 1360px)/2));width:calc(100% - 48px);max-width:1360px;bottom:64px}
@media(min-width:810px){
 :is(.studio-home,.portfolio-home) .site-navigation{max-width:1400px;top:6px;min-height:48px;padding-block:8px}
 :is(.studio-home,.portfolio-home) .notifications{right:max(40px,calc((100vw - 1360px)/2))}
}
:is(.studio-home,.portfolio-home) .notifications{display:flex}
@media(max-width:809px){:is(.studio-home,.portfolio-home) .notifications{display:none}}
:is(.studio-home,.portfolio-home) .hero-content{gap:12px;align-items:flex-start}
:is(.studio-home,.portfolio-home) .hero-support{max-width:510px;margin:-12px 0 0;font-weight:300;color:#ffffffe6;text-wrap:pretty}
:is(.studio-home,.portfolio-home) .hero-actions{margin-top:20px;align-items:center;gap:12px;flex-wrap:wrap}
.hero-expert{display:inline-flex;align-items:center;gap:8px;min-height:24px;color:#fff}.hero-expert:hover{opacity:.8}.hero-expert svg{flex:none}
:is(.studio-home,.portfolio-home) .hero-media video{cursor:default;pointer-events:none}
:is(.studio-home,.portfolio-home) .shade{background:linear-gradient(180deg,#0005,transparent 35%),linear-gradient(90deg,#0009,transparent 85%),linear-gradient(0deg,#000a,transparent 70%)}
.hero-motion-toggle{position:absolute;right:max(24px,calc((100% - 1360px)/2));bottom:64px;border:0;background:transparent;color:#fff;width:44px;height:44px;padding:10px;cursor:pointer;display:grid;place-items:center}.hero-motion-toggle[hidden]{display:none}
@media(max-width:809px){:is(.studio-home,.portfolio-home) .hero-content{gap:12px;bottom:64px}:is(.studio-home,.portfolio-home) .hero-actions{gap:12px}:is(.studio-home,.portfolio-home) .hero-support{max-width:440px}.hero-motion-toggle{bottom:12px}:is(.studio-home,.portfolio-home) .hero-media video{object-position:center}}

.hero-motion-toggle svg{grid-area:1/1}.hero-motion-toggle[data-paused="true"] .hero-pause-icon,.hero-motion-toggle[data-paused="false"] .hero-play-icon{display:none}.hero-motion-toggle:hover{opacity:.7}.hero-motion-toggle:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}

:is(.studio-home,.portfolio-home) .hero-support[hidden]{display:none}
:is(.studio-home,.portfolio-home) .hero-expert{padding:0;background:transparent;border-radius:0}
:is(.studio-home,.portfolio-home) .hero-actions .glass-button{background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(32px) saturate(1.35);backdrop-filter:blur(32px) saturate(1.35)}
:is(.studio-home,.portfolio-home) .hero-actions .glass-button:hover{background:rgba(255,255,255,.16)}
:is(.studio-home,.portfolio-home) .hero-actions .hero-secondary{-webkit-backdrop-filter:none;backdrop-filter:none;background:transparent;border:1px solid #ffffff24;gap:16px}

/* Keep the glass backdrop connected to the video rather than an animated opacity layer. */
:is(.studio-home,.portfolio-home) .hero-content{animation:none;opacity:1;transform:none}

:is(.studio-home,.portfolio-home) .hero-expert[hidden]{display:none}
:is(.studio-home,.portfolio-home) .hero-media video{transform:translate(2%,-1%) scale(1.06);transform-origin:center}
@media(max-width:809px){:is(.studio-home,.portfolio-home) .hero-media video{transform:translate(1%,-1%) scale(1.04)}}
/* Mobile keeps the film full-bleed, with a focused crop of the tablet. */
@media(max-width:809px){
 :is(.studio-home,.portfolio-home) .mobile-booking{display:none}
 :is(.studio-home,.portfolio-home) .hero{height:100svh;min-height:600px;background:#241d16}
 :is(.studio-home,.portfolio-home) .hero-media{background:#241d16}
 :is(.studio-home,.portfolio-home) .hero-media video{position:absolute;inset:0;width:100%;max-width:none;height:100%;aspect-ratio:auto;object-fit:cover;object-position:48% center;transform:none;-webkit-mask-image:none;mask-image:none}
 :is(.studio-home,.portfolio-home) .hero-content{left:24px;width:calc(100% - 48px);max-width:none;bottom:48px}
 :is(.studio-home,.portfolio-home) .hero-actions{width:100%;gap:12px;align-items:stretch}
 :is(.studio-home,.portfolio-home) .hero-actions .glass-button{height:48px;min-height:48px;padding:12px 16px;border-radius:var(--radius-control);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
 :is(.studio-home,.portfolio-home) .hero-actions .glass-button:not(.hero-secondary){padding-inline:20px;gap:0}
 :is(.studio-home,.portfolio-home) .hero-actions .cta-hover-icon{display:none}
 :is(.studio-home,.portfolio-home) .hero-motion-toggle{display:none}
}
@media(max-width:374px){:is(.studio-home,.portfolio-home) .hero-content{left:20px;width:calc(100% - 40px)}}