/* The FI identity stays consistent; interaction stays out of the way. */
.brand svg{width:25px;height:38px}
.hero-caption>span:first-child{width:205px}
.hero-copy>.eyebrow{letter-spacing:.17em}
.hero-film{transition:opacity .6s linear}
.process li{display:block}
.service-body{padding-left:0}
.service-list summary{gap:0}
.paper-label{letter-spacing:.12em}
html.scrolled header{backdrop-filter:none;background:var(--bg)}

.moment-backdrop img,.manifesto-art{transform:none;will-change:auto}
.manifesto-art{filter:none;opacity:.62}
.manifesto-mark{transform:rotate(-12deg)}
.creative-frames img{transition:transform .45s ease}
.stage-tabs i,.paper .paper-arrow{transition:transform .25s ease}
.service-list details[open]{background:color-mix(in srgb,var(--bg) 25%,transparent)}
#paid-media .service-statement{background-image:url('assets/fine-intent-branded.webp')}
#landing-conversion .service-statement{background-image:none}
.signal-dot{animation-play-state:paused}
.system-visual.is-in-view .signal-dot{animation-play-state:running}
html.paused .signal-dot{animation:none}
@media(hover:hover) and (pointer:fine){
 .creative-art:hover .creative-frames img:first-child{transform:translateY(-6px) rotate(-9deg)}
 .creative-art:hover .creative-frames img:nth-child(2){transform:translateY(-14px) rotate(0)}
 .creative-art:hover .creative-frames img:nth-child(3){transform:translateY(-6px) rotate(6deg)}
 .stage-tabs button:hover i,.paper:hover .paper-arrow{transform:translate(3px,-3px)}
}
html.paused .creative-frames img,html.paused .stage-tabs i,html.paused .paper-arrow{transition:none!important}

@media(max-width:700px){
 .brand svg{width:22px;height:33px}
 .hero-caption>span:first-child{width:150px}
 .hero-art img{object-position:65% center}
 .hero-film{object-position:var(--film-focus,65%) center}
 .process li{padding-left:0}
 .paper h3,.paper+.paper h3,.paper p,.paper+.paper p{left:0}
 .paper-label{width:100%;font-size:7px}
 .paper h3,.paper+.paper h3{top:45px}
 .paper,.paper+.paper,html.paused .paper{height:175px}
 .paper p,.paper+.paper p{bottom:21px}
 .hero-caption>span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){.signal-dot{animation:none!important}}

.business-stage{padding-top:35px;padding-bottom:55px}
.stage-heading{margin-top:35px}
.brand-interlude{position:relative;isolation:isolate;height:330px;overflow:hidden;background:#171715;color:#fff5e8;display:flex;align-items:center;padding:45px 5%}
.brand-interlude img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%;z-index:-2}
.brand-interlude:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#000a,#0002);z-index:-1}
.brand-interlude p{font-size:clamp(45px,5.5vw,80px);line-height:1.02;letter-spacing:-.05em;margin:0}
.questions{padding-bottom:50px}
.faq-grid h2{font-size:clamp(32px,4vw,52px)}
@media(max-width:700px){.business-stage{padding-top:30px;padding-bottom:40px}.stage-heading{margin-top:15px}.brand-interlude{height:280px;padding:35px 22px}.brand-interlude img{object-position:73% center}.brand-interlude p{font-size:44px}.questions{padding-bottom:35px}}
