/* Seamless Motions — Flow identity, October 24, 2026.
   Master identity only. Client artwork, layout and reveal behavior stay in their own layers. */
@font-face{font-family:'Plus Jakarta Sans';src:url('assets/fonts/PlusJakartaSans-variable.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('assets/fonts/SpaceGrotesk-variable.woff2') format('woff2');font-style:normal;font-weight:300 700;font-display:swap}
:root{--sans:'Space Grotesk',Arial,sans-serif;--display:'Plus Jakarta Sans',Arial,sans-serif;--serif:var(--display);--ink:#07121c;--dark:#07121c;--muted:#596976;--paper:#f7f9fc;--line:#d9e2ec;--accent:#0758f9;--blue:#0758f9}
body,button,input,select,textarea{font-family:var(--sans)}
body{color:var(--ink);font-size:17px;background-color:var(--paper);background-image:radial-gradient(ellipse at 65% 0%,#e6eefb70,transparent 38%),linear-gradient(#426aa908 1px,transparent 1px),linear-gradient(90deg,#426aa908 1px,transparent 1px);background-size:auto,72px 72px,72px 72px}
h1,h2,h3,h4{font-family:var(--display);color:var(--ink);font-weight:800;letter-spacing:-.035em}
.header .wordmark{display:flex;flex:0 1 auto;min-width:0;line-height:1}
.header .identity-wordmark{display:block;width:244px;height:auto;max-width:100%;mix-blend-mode:normal}
.footer-name .identity-wordmark{display:block;width:244px;height:auto;mix-blend-mode:normal}
.agency-hero h1{font-size:clamp(46px,6.5vw,92px);font-weight:800;letter-spacing:-.04em;line-height:1.08;color:var(--ink)}
.agency-hero h1 em,.proof-heading h2 em,.closing h2 em{font-family:var(--display);font-style:normal;font-weight:800;letter-spacing:inherit;color:var(--ink)}
.agency-hero h1 em{font-size:1em;line-height:inherit}.agency-hero h1 .content-accent{color:var(--accent)}
.hero-deck{font-size:clamp(18px,2vw,23px);font-weight:400;letter-spacing:-.015em;line-height:1.55}
.proof-heading h2{font-weight:800;letter-spacing:-.045em;line-height:1.1}
.project-heading h3,.closing h2{font-weight:800;letter-spacing:-.045em;line-height:1.12}
.project-heading h3 em,.edit-payoff h4 em{font-family:var(--display);font-style:normal;font-weight:800;letter-spacing:inherit;color:var(--ink)}
.eyebrow,.micro-label,.system-bar,.system-steps button,.medium-tabs button,.hero-path,.button,.plain-button,.quiet-link{font-family:var(--sans);font-weight:500}
.eyebrow{color:#52657a;letter-spacing:.12em}
.button{font-size:14px;letter-spacing:0}.button.accent{background:var(--accent);color:white}.button.dark,.header .button{background:var(--ink);color:white}.button:hover{background:#1b43be;color:#fff}
.hero-path{font-size:13px;color:var(--muted)}.hero-path i{background:#b9c8db}
.scene-caption>strong,.phone-bridge strong{font-family:var(--display);font-weight:700;letter-spacing:-.035em;color:var(--ink)}
.scene-caption>strong{font-size:clamp(21px,2.2vw,29px)}
.transcript-intro h4,.edit-payoff h4{line-height:1.2;font-weight:700}
.sheet-top,.transcript-time,.timeline-ruler,.system-steps,.source-name,.source-name small,.medium-tabs,.stage-outcome,.case-notes,.project-footer{font-family:var(--sans);font-variant-numeric:tabular-nums}
.case-notes summary{font-family:var(--sans);font-size:17px;font-weight:500;letter-spacing:-.02em}
.case-notes p,.project-heading>p,.proof-heading>p,.intake-content p{line-height:1.6}
.closing{background:linear-gradient(150deg,#edf2fb,#f7f9fc 75%)}
.intake-content input,.intake-content textarea,.intake-content select{font-size:17px}
/* Preserve the existing film slot while the film chat receives the new identity. */
.brand-reel{margin:60px 0 15px}.reel-intro{display:flex;align-items:baseline;justify-content:space-between;gap:30px;margin-bottom:22px}.reel-intro h3{font-size:clamp(22px,2.4vw,34px);margin:0}.reel-intro p{font-size:16px;color:var(--muted);margin:0}.brand-reel video{width:100%;aspect-ratio:16/9;display:block;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 70px #123e7912}
/* Embedded client experiences keep their own identity. */
.lc-platform h1,.lc-platform h2,.lc-platform h3,.lc-platform h4,.lc-identity h4,.lc-paper h4,.lc-poster h4{font-family:'LC Plex',sans-serif;color:inherit}.ccc-intro h3{color:inherit}
@media(max-width:720px){.header.wrap{gap:12px}.header .identity-wordmark{width:190px}.header .button{font-size:12px;padding:10px 14px;white-space:nowrap}.agency-hero h1{font-size:clamp(30px,8.2vw,59px);letter-spacing:-.035em;line-height:1.12}.agency-hero h1 em{font-size:1em}.hero-deck{font-size:19px}.hero-path{font-size:11px}.footer-name .identity-wordmark{width:224px}.reel-intro{display:block}.reel-intro p{margin-top:9px}.brand-reel{margin:38px 0 15px}.case-notes summary{font-size:16px}}
@media(max-width:380px){.header.wrap{padding-left:12px;padding-right:12px}.header .identity-wordmark{width:154px}.header .button{padding:9px 11px;font-size:11px}}

/* Feedback edition: bring the approach and the proof into the opening. */
.agency-hero{padding:clamp(32px,4.4vw,58px) 0 16px}
.agency-hero h1{margin:20px auto 18px}
.hero-actions-inline{margin:22px 0 25px}
.agency-process{margin:20px auto 0;padding:20px 0 22px;gap:14px 24px}
.studio-film .brand-reel{margin:26px 0 0}
.studio-film .reel-intro{margin-bottom:14px}
#video.proof-section{padding-top:clamp(32px,4.3vw,60px)}
@media(max-width:720px){.agency-hero{padding:28px 0 12px}.hero-actions-inline{margin:18px 0 22px}.agency-process{margin-top:14px;padding:16px 0;gap:10px}.agency-process>div{gap:12px}.agency-process h3{font-size:20px}.studio-film .brand-reel{margin:20px 0 0}}
