/* Supplied artwork remains untouched. Brand values come from brand.json. */
.brand{width:300px;display:block;flex-shrink:0}
.brand-logo{display:block;width:100%;height:auto}
.hero-mark{aspect-ratio:1;transform:none;animation-name:brand-arrive}
@keyframes brand-arrive{from{transform:translateY(18px)}to{transform:translateY(0)}}
.hero-mark svg,.approach-mark svg,.player-mark{width:100%;height:100%}
.graphic-placeholder>svg{transform:none}
.text-brand,.scene-accent{color:var(--brand-text)}
.page-hero .text-brand{color:var(--brand)}
.purpose .text-brand,.motion-work .scene-accent{color:var(--ink);text-decoration:underline;text-decoration-color:var(--brand);text-decoration-thickness:.065em;text-underline-offset:.12em}
.motion-approach .scene-accent,.contact-band .text-brand{color:var(--brand)}
.button.brand-fill{background:var(--brand);color:var(--ink)}
.button.brand-fill:hover{background:var(--brand-hover);color:var(--ink)}
.filter-row button[aria-pressed=true]{color:var(--ink)}
::selection{background:var(--brand);color:var(--ink)}
@media(max-width:1100px){.brand{width:250px}}
@media(max-width:800px){.brand{width:245px}}
@media(max-width:520px){.brand{width:min(240px,65vw)}}
@media(prefers-reduced-motion:reduce){.hero-mark{animation:none}}

/* Frames from the supplied film show the range of work without a logo mask. */
.about-intro{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,4.6vw,76px)}
.about-mosaic{height:560px;display:grid;grid-template-columns:1.45fr .86fr;grid-template-rows:1fr 1fr;gap:12px;position:relative;min-width:0}
.about-mosaic:after{content:"";position:absolute;left:0;bottom:-13px;width:220px;height:5px;background:var(--brand)}
.mosaic-primary,.mosaic-secondary{min-width:0;min-height:0;position:relative;overflow:hidden;background:var(--sand)}
.mosaic-primary{grid-row:1/3}
.about-mosaic img{width:100%;height:100%;object-fit:cover}
.mosaic-primary img{object-position:52% center}
.mosaic-primary:after{content:"";position:absolute;inset:52% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.68));pointer-events:none}
.mosaic-caption{position:absolute;left:26px;bottom:26px;z-index:1;color:#fff;font-size:12px;line-height:1.35;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.mosaic-eyebrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:600}
.mosaic-eyebrow span{width:22px;height:2px;background:var(--brand)}
.contact-band{position:relative;overflow:hidden;isolation:isolate}
.contact-band>*:not(.footer-watermark){position:relative;z-index:1}
.footer-watermark{position:absolute;pointer-events:none;width:clamp(480px,62vw,1120px);aspect-ratio:1;right:-15%;top:-35%;opacity:.075;z-index:0}
.motion-approach .approach-heading{position:relative}
.motion-approach .approach-mark{aspect-ratio:1}
@media(max-width:800px){.about-intro{grid-template-columns:1fr;gap:40px}.about-mosaic{height:410px}.footer-watermark{right:-37%;top:-4%;width:650px}}
@media(max-width:520px){.about-mosaic{height:345px;gap:8px}.about-mosaic:after{width:32%}.mosaic-caption{left:14px;bottom:15px;font-size:10px;letter-spacing:.08em;max-width:85%}.footer-watermark{width:460px;right:-57%;top:1%}}
@media(prefers-reduced-motion:reduce){.ambient-film{display:none}}
