@font-face { font-family:Manrope; src:url('assets/fonts/Manrope-variable.woff2') format('woff2'); font-style:normal; font-weight:400 800; font-display:swap; }
:root {
  --paper:#fff; --ink:#101b27; --muted:#52616d; --line:#d5e1e8;
  --cyan:#00aeef; --blue:#0090d6; --action:#0074ad; --mist:#e8f6fc;
  --type:Manrope,Arial,Helvetica,sans-serif; --gutter:clamp(22px,5.4vw,88px);
  --max:1600px; --header:92px; --ease:cubic-bezier(.22,1,.36,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--header) + 20px); }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--type); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; color:inherit; }
button,a,summary { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button,summary { cursor:pointer; }
img,svg { display:block; max-width:100%; }
[hidden] { display:none!important; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid var(--action); outline-offset:5px; }
::selection { background:#b4e8fc; color:var(--ink); }
h1,h2,h3,p { margin:0; }
ul,ol { margin:0; padding:0; }
.section-shell { width:min(100%,var(--max)); margin-inline:auto; padding-inline:var(--gutter); }
.section-space { padding-block:clamp(80px,9vw,144px); }
.skip-link { position:fixed; z-index:100; top:14px; left:14px; padding:14px 20px; background:var(--ink); color:#fff; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:30; min-height:var(--header); padding:12px var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:30px; background:#fff; border-bottom:1px solid var(--line); }
.site-header.is-scrolled { border-bottom-color:#bed3df; }
.brand { display:block; flex-shrink:0; }
.brand-logo { width:210px; height:auto; }
.main-nav { display:flex; align-items:center; gap:clamp(18px,2.3vw,38px); font-size:12px; font-weight:650; }
.main-nav>a { position:relative; padding-block:12px; }
.main-nav>a:not(.nav-contact):after { content:''; position:absolute; bottom:4px; left:0; width:100%; height:2px; background:var(--action); transform:scaleX(0); transform-origin:left; transition:transform 180ms var(--ease); }
.main-nav>a:hover:after,.main-nav>a[aria-current='location']:after { transform:scaleX(1); }
.main-nav .nav-contact { display:flex; align-items:center; gap:25px; padding:6px 6px 6px 20px; border-radius:10px; color:#fff; background:var(--ink); transition:background 180ms; }
.main-nav .nav-contact:hover { background:var(--action); }
.main-nav .nav-contact .action-icon { width:36px; height:36px; color:var(--ink); background:var(--cyan); }
.menu-toggle { display:none; }
.eyebrow { font-size:12px; line-height:1.6; font-weight:700; letter-spacing:.025em; }
.hero { padding-top:32px; }
.hero-top { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.hero-disciplinary { font-size:12px; line-height:1.6; font-weight:500; color:var(--muted); }
.hero-type-offset { margin-block:40px 35px; }
.hero h1 { font-size:clamp(78px,10.8vw,170px); line-height:1.08; letter-spacing:-.045em; font-weight:500; }
.hero-real { position:relative; display:block; width:max-content; max-width:100%; padding:.08em .45em .29em .19em; border:5px solid var(--cyan); border-radius:18px; white-space:nowrap; }
.hero-word-window { display:block; position:relative; isolation:isolate; max-width:100%; width:83%; margin-left:17%; margin-top:-.19em; overflow:hidden; border-radius:16px; }
.hero-aperture { display:none; }
.hero-media,.hero-solutions { display:block; width:100%; background:var(--ink); color:#fff; padding:.07em .19em .18em; }
.motion-ready .hero-word-window { height:1.33em; }
.motion-ready .hero-aperture { display:block; position:absolute; inset:0; border-radius:16px; z-index:-1; background:var(--ink); transform-origin:left center; }
.motion-ready .hero-media,.motion-ready .hero-solutions { position:absolute; inset:0 auto auto 0; background:none; white-space:nowrap; }
.motion-ready .hero-media { color:var(--ink); }
.hero-support { display:flex; justify-content:space-between; align-items:center; gap:40px; padding-top:3px; }
.hero-description { font-size:clamp(17px,1.6vw,23px); line-height:1.65; max-width:560px; letter-spacing:-.015em; }
.hero-actions { display:flex; align-items:center; gap:25px; flex-shrink:0; }
.action-icon { display:inline-grid; place-items:center; position:relative; overflow:hidden; width:32px; height:32px; flex:none; border-radius:6px; color:inherit; }
.action-icon svg { position:absolute; width:20px; height:20px; fill:currentColor; }
.action-icon .icon-echo { opacity:0; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; min-height:60px; padding:7px 8px 7px 24px; font-size:12px; line-height:1.4; font-weight:700; white-space:nowrap; border:1px solid transparent; border-radius:11px; transition:background 180ms,color 180ms; }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:var(--action); }
.button .action-icon { width:44px; height:44px; background:var(--cyan); color:var(--ink); border-radius:7px; }
.button .action-icon svg { width:23px; height:23px; }
.text-link { display:inline-flex; align-items:center; gap:18px; min-height:44px; font-size:12px; line-height:1.5; font-weight:700; padding-block:6px; }
.text-link .action-icon { border:1px solid #b9d0dc; transition:background 180ms,color 180ms,border-color 180ms; }
.text-link .action-icon svg { width:17px; height:17px; }
.text-link:hover { color:var(--action); }
.text-link:hover .action-icon { background:var(--cyan); color:var(--ink); border-color:var(--cyan); }
.hero-bottom { display:flex; justify-content:space-between; align-items:center; margin-top:30px; padding-block:10px 22px; font-size:11px; font-weight:600; }
.scroll-link,.replay-intro { display:inline-flex; gap:13px; align-items:center; min-height:44px; }
.scroll-link .action-icon,.replay-intro .action-icon { width:28px; height:28px; }
.scroll-link .action-icon svg,.replay-intro .action-icon svg { width:17px; height:17px; }
.replay-intro { border:0; background:none; padding:0; font-size:11px; }
.replay-intro:hover { color:var(--action); }
.display-heading { font-size:clamp(42px,4.6vw,72px); line-height:1.12; letter-spacing:-.035em; font-weight:500; }
.line-mask { display:block; overflow:clip; padding-bottom:.09em; margin-bottom:-.09em; }
.line-content { display:block; }
.accent-line { color:var(--action); }
.about>.eyebrow { margin-bottom:32px; }
.about-layout { display:grid; grid-template-columns:1.15fr 1fr; gap:12%; }
.about-body { padding-top:4px; }
.about-body p { font-size:16px; line-height:1.85; letter-spacing:-.015em; }
.about-body .lead { font-size:21px; line-height:1.65; margin-bottom:23px; }
.about-body .text-link { margin-top:26px; }
.services { padding-top:25px; }
.section-intro { display:flex; align-items:start; justify-content:space-between; gap:30px; margin-bottom:55px; }
.section-intro .eyebrow { padding-top:10px; }
.section-intro .display-heading { width:55%; }
.service { position:relative; border-top:1px solid var(--line); transition:background 220ms,color 220ms; }
.service[open] { background:var(--ink); color:#fff; border-radius:14px; border-top-color:transparent; margin-block:10px; }
.service:has(+ .service[open]) { border-bottom:0; }
.service-symbol { width:48px; height:48px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; color:var(--action); }
.service[open] .service-symbol { color:var(--cyan); }
.service:last-child { border-bottom:1px solid var(--line); }
.service summary { list-style:none; display:grid; grid-template-columns:88px 1fr auto; align-items:center; gap:25px; padding:30px 26px; }
.service summary::-webkit-details-marker { display:none; }
.service summary::marker { content:''; }
.service h3 { font-size:clamp(32px,3.3vw,52px); line-height:1.15; letter-spacing:-.03em; font-weight:500; }
.service-control { display:grid; place-items:center; width:45px; height:45px; color:var(--ink); background:var(--cyan); border-radius:8px; }
.service-toggle { width:26px; height:26px; padding:0; flex:none; transform-origin:center; }
.service-toggle path { fill:none; stroke:currentColor; stroke-width:3; }
.service[open] .service-toggle { transform:rotate(45deg); }
.service summary:hover .service-control { background:#7bdcff; }
.service summary:hover .service-symbol { color:var(--cyan); }
.service[open] .text-link:hover { color:var(--cyan); }
.service[open] .text-link .action-icon { border-color:#506574; }
.service[open] :focus-visible { outline-color:var(--cyan); }
.service-content { box-sizing:border-box; }
.service-content-inner { display:grid; grid-template-columns:1fr auto; align-items:end; gap:50px; padding:0 26px 35px 139px; }
.service-content p { font-size:18px; line-height:1.75; max-width:50ch; }
.service-content .text-link { white-space:nowrap; }
.creative { color:#fff; background:var(--ink); }
.creative-sticky { padding-block:clamp(64px,7vw,110px); }
.creative-heading .eyebrow { color:#89dcfc; margin-bottom:28px; }
.creative-heading .display-heading span { color:var(--cyan); }
.creative-intro { font-size:18px; line-height:1.7; margin-top:25px; max-width:30ch; }
.creative-aperture-frame { position:relative; margin-top:40px; padding:18px 0 0 18px; }
.creative-aperture-frame:before { content:''; position:absolute; inset:0 24px 24px 0; border:6px solid var(--cyan); border-radius:14px; pointer-events:none; }
.creative-window { margin-top:0; position:relative; display:grid; gap:2px; }
.creative-step { padding:36px; background:var(--cyan); color:var(--ink); }
.stage-symbol { width:56px; height:56px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; margin-bottom:28px; }
.creative-step h3 { font-size:clamp(44px,5.5vw,86px); line-height:1.04; letter-spacing:-.035em; font-weight:500; }
.creative-step p { font-size:17px; line-height:1.7; max-width:45ch; margin-top:25px; }
.creative-footer { display:flex; justify-content:space-between; align-items:center; gap:30px; margin-top:38px; }
.creative-footer .text-link:hover { color:var(--cyan); }
.creative-footer .action-icon { border-color:#527080; }
.creative a:focus-visible { outline-color:var(--cyan); }
.creative-motion { height:240svh; position:relative; }
.creative-motion .creative-sticky { position:sticky; top:var(--header); min-height:calc(100svh - var(--header)); display:grid; grid-template-columns:.85fr 1.15fr; grid-template-rows:1fr auto; align-items:center; gap:30px 7%; padding-block:45px; }
.creative-motion .creative-heading .display-heading { font-size:clamp(41px,4.1vw,65px); }
.creative-motion .creative-aperture-frame { margin:0; min-width:0; }
.creative-motion .creative-window { margin:0; height:min(490px,66svh); position:relative; overflow:hidden; background:var(--cyan); border-radius:14px; display:block; }
.creative-motion .creative-step { position:absolute; inset:36px; padding:0; display:flex; flex-direction:column; justify-content:center; background:none; }
.creative-motion .creative-step h3 { font-size:clamp(48px,5.1vw,80px); }
.creative-motion .creative-footer { grid-column:1/-1; margin:0; }
.journey-heading { display:flex; align-items:start; justify-content:space-between; gap:30px; margin-bottom:65px; }
.journey-heading .eyebrow { padding-top:10px; }
.journey-heading h2 { width:55%; }
.timeline { list-style:none; }
.timeline li { border-top:1px solid var(--line); display:grid; grid-template-columns:38% 1fr; gap:30px; padding-block:31px 38px; }
.timeline-year { font-size:clamp(38px,4.2vw,64px); line-height:1.1; letter-spacing:-.025em; font-weight:500; }
.timeline p { font-size:18px; line-height:1.75; max-width:52ch; }
.timeline-now { position:relative; background:var(--mist); border-radius:14px; padding-inline:30px; margin-inline:-30px; }
.timeline-now .timeline-year { color:var(--action); font-size:clamp(52px,6vw,90px); }
.timeline-now h3 { font-size:30px; line-height:1.25; letter-spacing:-.04em; margin-bottom:17px; }
.timeline-now .text-link { margin-top:20px; }
.rtc-scale { margin-top:70px; padding-top:45px; border-top:1px solid var(--line); display:grid; grid-template-columns:1.2fr 1fr 1.1fr; gap:35px; align-items:center; }
.rtc-scale h3 { font-size:24px; line-height:1.5; letter-spacing:-.035em; font-weight:550; }
.rtc-scale strong { font-size:clamp(55px,6vw,90px); line-height:1.1; letter-spacing:-.06em; font-weight:550; display:block; }
.rtc-scale div>span { font-size:10px; font-weight:700; letter-spacing:.12em; display:block; margin-top:14px; }
.contact { background:var(--mist); border-radius:24px 24px 0 0; }
.contact-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:10%; align-items:start; }
.contact-copy .eyebrow { margin-bottom:30px; }
.contact .display-heading { font-size:clamp(64px,7.5vw,116px); }
.contact-intro { font-size:19px; line-height:1.7; letter-spacing:-.02em; margin-top:28px; max-width:25ch; }
.contact-copy>.text-link { margin-top:25px; }
.brief-form { padding:36px; border:1px solid #cfdee7; border-radius:16px; background:#fff; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.brief-form label { display:block; font-size:12px; line-height:1.7; font-weight:700; margin-bottom:25px; }
input,select,textarea { border:1px solid #b4c9d6; border-radius:7px; background:#fff; width:100%; min-width:0; font-size:16px; line-height:1.6; font-weight:400; padding:12px; margin-top:9px; }
input,select { min-height:50px; }
textarea { resize:vertical; }
textarea::placeholder { color:#657b8a; opacity:1; }
.brief-note { font-size:11px; line-height:1.8; color:var(--muted); }
.brief-form>.button { margin-top:24px; }
.brief-result { border-top:1px solid var(--line); margin-top:28px; padding-top:25px; }
.result-title { font-size:21px; font-weight:650; margin-bottom:20px; letter-spacing:-.03em; }
.brief-result textarea { scroll-margin-top:calc(var(--header) + 24px); font-size:13px; line-height:1.8; background:#f6fbfd; }
.result-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin-block:20px 14px; }
.copy-brief { min-height:44px; padding:8px 0; border:0; border-bottom:1px solid var(--line); background:none; font-size:12px; font-weight:700; }
.copy-brief:hover { color:var(--action); border-color:var(--action); }
.form-status { font-size:12px; line-height:1.8; margin-top:18px; }
.form-status:empty { margin:0; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:26px; padding-block:40px; }
.footer-brand { display:block; flex-shrink:0; }
.footer-brand img { width:180px; height:auto; }
.site-footer>p { font-size:10px; line-height:1.8; color:var(--muted); }
.back-top { display:flex; align-items:center; gap:30px; font-size:11px; font-weight:700; min-height:44px; }
.back-top .action-icon { background:var(--mist); }
@media(min-width:1600px) { .site-header { padding-inline:max(var(--gutter),calc((100vw - var(--max))/2 + var(--gutter))); } }
@media(max-width:1180px) {
  .main-nav { gap:18px; font-size:11px; } .brand-logo { width:195px; }
  .hero-actions { gap:22px; } .hero-description { max-width:440px; }
  .service-content-inner { grid-template-columns:1fr; gap:14px; padding-left:139px; } .service-content .text-link { justify-self:start; }
  .form-row { grid-template-columns:1fr; gap:0; } .brief-form { padding:28px; }
}
@media(max-width:980px) {
  :root { --header:84px; }
  .site-header { flex-wrap:wrap; gap:0 18px; padding-block:8px; } .brand-logo { width:190px; }
  .main-nav { width:100%; padding-block:12px; gap:18px; justify-content:space-between; font-size:12px; }
  .js .menu-toggle { display:flex; align-items:center; gap:14px; margin-left:auto; border:0; background:none; padding:10px 0; font-size:12px; font-weight:700; min-height:44px; }
  .menu-lines { position:relative; width:23px; height:14px; border-block:2px solid var(--ink); }
  .menu-lines:after { content:''; position:absolute; top:5px; left:0; right:0; height:2px; background:var(--ink); }
  .menu-toggle[aria-expanded='true'] .menu-lines { border:0; }
  .menu-toggle[aria-expanded='true'] .menu-lines:before,.menu-toggle[aria-expanded='true'] .menu-lines:after { content:''; position:absolute; inset:6px 0 auto; height:2px; background:var(--ink); transform:rotate(45deg); }
  .menu-toggle[aria-expanded='true'] .menu-lines:after { transform:rotate(-45deg); }
  .js .main-nav { display:none; } .js .main-nav.is-open { display:flex; }
  .hero { padding-top:30px; } .hero-support { align-items:start; gap:28px; } .hero-description { max-width:390px; }
  .hero-actions { flex-direction:column; align-items:start; gap:8px; }
  .about-layout { gap:7%; } .about-body .lead { font-size:19px; }
  .creative-motion .creative-sticky { gap:25px 5%; } .creative-motion .creative-step { inset:28px; }
  .creative-motion .stage-symbol { width:42px; height:42px; margin-bottom:20px; }
  .creative-step p { font-size:15px; } .creative-intro { font-size:16px; }
  .timeline li { grid-template-columns:30% 1fr; }
  .contact-layout { gap:6%; grid-template-columns:.7fr 1.3fr; } .contact-intro { font-size:17px; }
}
@media(max-width:760px) {
  :root { --gutter:26px; --header:82px; }
  .section-space { padding-block:76px; }
  .brand-logo { width:178px; }
  .main-nav { flex-direction:column; align-items:stretch; padding-top:18px; gap:2px; }
  .main-nav>a { min-height:44px; } .main-nav .nav-contact { margin-top:8px; }
  .hero { padding-top:24px; } .hero-top { display:block; }
  .hero .eyebrow { font-size:11px; } .hero-disciplinary { font-size:11px; margin-top:8px; }
  .hero-type-offset { margin-block:32px 26px; }
  .hero h1 { font-size:clamp(56px,10.7vw,86px); line-height:1.08; letter-spacing:-.035em; }
  .hero-real { border-width:3px; border-radius:11px; padding:.1em .4em .3em .17em; }
  .hero-word-window { width:92%; margin-left:8%; border-radius:10px; }
  .motion-ready .hero-aperture { border-radius:10px; }
  .hero-support { display:block; padding-top:0; }
  .hero-description { font-size:18px; max-width:36ch; }
  .hero-actions { flex-direction:row; align-items:center; gap:27px; margin-top:28px; }
  .button { gap:24px; padding:6px 7px 6px 18px; min-height:55px; }
  .button .action-icon { width:40px; height:40px; }
  .hero-bottom { margin-top:28px; padding-block:10px 20px; }
  .scroll-link,.replay-intro { gap:16px; font-size:10px; }
  .display-heading { font-size:clamp(37px,7.8vw,56px); }
  .about>.eyebrow { margin-bottom:25px; } .about-layout { grid-template-columns:1fr; gap:29px; }
  .about .display-heading { max-width:15ch; } .about-body .lead { font-size:21px; } .about-body p { font-size:16px; }
  .services { padding-top:0; } .section-intro { display:block; margin-bottom:36px; }
  .section-intro .eyebrow { margin-bottom:24px; padding:0; } .section-intro .display-heading { width:auto; }
  .service summary { padding:25px 18px; grid-template-columns:40px 1fr auto; gap:16px; }
  .service-symbol { width:32px; height:32px; } .service h3 { font-size:clamp(25px,4.8vw,39px); }
  .service-control { width:37px; height:37px; }
  .service-toggle { width:23px; height:23px; }
  .service-content-inner { padding:0 22px 27px; gap:17px; } .service-content p { font-size:16px; }
  .creative-sticky { padding-block:65px; } .creative-heading .eyebrow { margin-bottom:24px; }
  .creative-heading .display-heading { font-size:clamp(37px,8vw,57px); }
  .creative-intro { font-size:18px; max-width:32ch; }
  .creative-aperture-frame { margin-top:32px; padding:12px 0 0 12px; }
  .creative-aperture-frame:before { border-width:4px; inset:0 18px 18px 0; border-radius:12px; }
  .creative-window { gap:1px; margin-top:0; border-radius:10px; overflow:hidden; }
  .creative-step { padding:30px; }
  .stage-symbol { width:44px; height:44px; margin-bottom:24px; } .creative-step h3 { font-size:clamp(42px,9.3vw,68px); }
  .creative-step p { font-size:16px; line-height:1.75; margin-top:20px; }
  .creative-footer { gap:20px; flex-wrap:wrap; margin-top:27px; } .creative-footer .text-link { font-size:11px; gap:18px; }
  .journey-heading { display:block; margin-bottom:38px; } .journey-heading .eyebrow { padding:0; margin-bottom:24px; } .journey-heading h2 { width:auto; }
  .timeline li { grid-template-columns:80px 1fr; gap:20px; padding-block:25px 30px; }
  .timeline-year { font-size:34px; } .timeline p { font-size:15px; }
  .timeline-now { padding-inline:18px; margin-inline:-18px; } .timeline-now .timeline-year { font-size:36px; }
  .timeline-now h3 { font-size:24px; } .timeline-now .text-link { font-size:11px; gap:15px; }
  .rtc-scale { grid-template-columns:1fr 1fr; gap:30px; margin-top:43px; padding-top:32px; }
  .rtc-scale h3 { grid-column:1/-1; font-size:24px; } .rtc-scale strong { font-size:clamp(49px,11vw,74px); }
  .rtc-scale div>span { font-size:9px; margin-top:10px; }
  .contact-layout { grid-template-columns:1fr; gap:40px; } .contact .display-heading { font-size:80px; }
  .contact-copy .eyebrow { margin-bottom:24px; } .contact-intro { font-size:18px; max-width:30ch; }
  .brief-form { padding:26px; } .form-row { grid-template-columns:1fr; gap:0; }
  .site-footer { display:grid; grid-template-columns:1fr auto; gap:24px; padding-block:30px; }
  .footer-brand img { width:155px; } .site-footer>p { grid-row:2; font-size:9px; }
  .back-top { grid-column:2; grid-row:1/3; gap:16px; font-size:10px; }
}
@media(max-width:400px) {
  :root { --gutter:21px; --header:78px; }
  .brand-logo { width:160px; }
  .hero h1 { font-size:clamp(44px,13.3vw,54px); }
  .hero-word-window { width:94%; margin-left:6%; }
  .hero-description { font-size:17px; } .hero-actions { gap:14px; }
  .hero-actions .button { gap:20px; padding-left:16px; }
  .creative-step h3 { font-size:41px; }
  .hero-actions .text-link { font-size:11px; gap:10px; }
  .display-heading { font-size:36px; } .about-body .lead { font-size:19px; }
  .service h3 { font-size:24px; }
  .service summary { padding:22px 18px; gap:14px; grid-template-columns:1fr auto; }
  .service summary .service-symbol { grid-column:1; grid-row:1; }
  .service summary h3 { grid-column:1; grid-row:2; }
  .service summary .service-control { grid-column:2; grid-row:1/3; }
  .service-symbol { width:28px; height:28px; }
  .service-control { width:32px; height:32px; }
  .service-toggle { width:21px; height:21px; }
  .service-content-inner { padding-inline:18px; } .creative-step { padding:25px; }
  .timeline li { grid-template-columns:61px 1fr; gap:17px; } .timeline-year { font-size:29px; }
  .timeline-now .timeline-year { font-size:30px; } .timeline-now h3 { font-size:22px; }
  .timeline-now .text-link { gap:10px; font-size:10px; }
  .brief-form { padding:21px 17px; } .brief-form label { font-size:11px; }
  .result-actions { gap:17px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation:none!important; transition:none!important; }
}