/* Clear reading surfaces; the map remains a background identity. */
.selected-work{background:#000;color:var(--reading);padding-block:105px 120px}
.selected-work::before{display:none}
.selected-work .section-heading{margin-bottom:34px}
.selected-work .section-heading h2{font-size:clamp(36px,4vw,62px);font-weight:600;letter-spacing:-.045em}
.selected-work .films{gap:28px}
.selected-work .film:nth-child(even){margin-top:0}
.selected-work .film-cover{aspect-ratio:16/9;border:0;background:#101010;isolation:isolate;overflow:hidden}
.selected-work .film-cover img{height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.22,1,.36,1)}
.selected-work .film-cover::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0002 5%,#0006 50%,#0003 95%)}
.selected-work .film-title{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:#fff;font-size:clamp(18px,2.2vw,32px);font-weight:600;letter-spacing:-.035em;line-height:1.12;text-shadow:0 2px 24px #000a}
.selected-work .film:hover,.selected-work .film:focus-within{transform:none;box-shadow:none}
.selected-work .film-cover:hover,.selected-work .film-cover:focus-visible{transform:none}
.selected-work .film-cover:hover img,.selected-work .film-cover:focus-visible img{transform:scale(1.035)}
@media(max-width:700px){.selected-work{padding-block:65px 80px}.selected-work .films{grid-template-columns:1fr;gap:18px}.selected-work .film-title{font-size:clamp(20px,5.5vw,28px)}}
.scroll-fade-pending{opacity:0}
@media(prefers-reduced-motion:reduce){.scroll-fade-pending{opacity:1!important}}
:root{--reading:#f5f1ec;--reading-secondary:#ddd7d0}
body,header,.section,.pathways,.behind,.split,.team-grid,.about-story,.content-work,.page-cine .page-intro{color:var(--reading)}
.path-card,.path-card:nth-child(2),.team-grid article,.team-grid article:nth-child(2),.team-grid article:nth-child(3),.service,.service:nth-child(even),.agency-grid article,.content-service-list article,.film-dialog{color:var(--reading)}
.map-hero,.page-intro,.content-opening,.statement,.content-closing,.agency-options,.clients,footer#enquiry{color:var(--ink)}
.page-cine .page-intro{color:var(--reading)}
.page-cine .page-intro em,.about-story em,.reel-section h2,.enquiry-intro em{color:inherit}
.mission-trip{color:var(--reading);border-color:#d65d3b88}
.mission-status{color:var(--reading-secondary);font-size:17px;line-height:1.7}
.mission-trip h2{letter-spacing:-.025em;line-height:1.2}
nav.mission-index{color:var(--reading)}
nav.mission-index a{font-size:15px;font-weight:600;letter-spacing:0}
nav.mission-index a:hover,nav.mission-index a:focus-visible{background:var(--red);color:var(--ink)}
.mission-number,.mission-index a span{color:#f19a7d}
nav.mission-index a:hover span{color:var(--ink)}
#enquiry-form,#enquiry-form label span,#enquiry-form input,#enquiry-form textarea,#enquiry-form .form-note,#enquiry-status{color:var(--reading)}
input::placeholder,textarea::placeholder{color:#c9c3bc;opacity:1}
.project-details p,.team-grid article>p:last-child,.service p{font-size:16px;line-height:1.7}
.eyebrow,.film-watch,.frame-label,.map-meta,.map-base,.footer-bottom p,.footer-bottom>a:last-child{font-size:14px}
.film-cover{color:var(--reading)}
/* Move composited layers, not background-position on every frame. */
.map-hero,.page-intro,.content-opening,.section,.pathways{overflow:clip}
.map-hero::before,.page-intro::before,.content-opening::before,.section::before,.pathways::before,footer::before{inset:-45px;background-position:center;animation:map-glide 34s ease-in-out infinite alternate;opacity:.14;pointer-events:none}
.map-hero::before,.page-intro::before,.content-opening::before,.statement::before,.content-closing::before{opacity:.24}
@keyframes map-glide{from{transform:translate3d(-16px,-12px,0)}to{transform:translate3d(16px,12px,0)}}
@media(hover:hover) and (pointer:fine){.map-hero:hover::before,.page-intro:hover::before,.content-opening:hover::before{opacity:.24}.section:hover::before,.pathways:hover::before,footer:hover::before{opacity:.14}}
body .map-offscreen::before{animation-play-state:paused}
body.maps-paused :is(.map-hero,.page-intro,.content-opening,.section,.pathways,footer)::before{animation-play-state:paused}
a,button,.path-card,.film,.team-grid article,.service,.mission-trip{transition:transform .3s cubic-bezier(.22,1,.36,1),color .2s ease,background-color .2s ease}
/* Services lead the Branding page: large titles, focused copy and clear lists. */
.branding-intro{padding-bottom:52px}
.branding-intro h1{margin:22px 0;font-size:clamp(48px,7vw,104px)}
.branding-services{padding-top:18px;padding-bottom:45px}
.branding-service{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding:64px 0;border-bottom:1px solid #ffffff38;position:relative}
.branding-service:last-child{border-bottom:0}
.branding-service-title{display:flex;gap:24px;align-items:baseline}
.branding-service-title>span{color:#f19a7d;font-size:14px}
.branding-service h2{font-size:clamp(30px,3.6vw,54px);line-height:1.12;letter-spacing:-.035em;max-width:450px}
.branding-service-copy p{font-size:18px;line-height:1.8;max-width:590px}
.branding-service-copy ul{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-wrap:wrap;gap:12px 24px;color:var(--reading-secondary);font-size:16px}
.branding-service-copy li{border-bottom:1px solid #d65d3b88;padding-bottom:7px}
.branding-service-title{transition:transform .3s cubic-bezier(.22,1,.36,1)}
@media(hover:hover) and (pointer:fine){.branding-service:hover .branding-service-title{transform:translateY(-4px)}}
@media(max-width:800px){.branding-service{grid-template-columns:1fr;gap:24px;padding:38px 0}.branding-service-copy p{font-size:16px}.branding-service-title{gap:16px}.branding-intro{padding-bottom:35px}.mission-trip{padding-block:32px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
