/* Version 5: the original atmospheric composition, with three selected paper sections. */
:root{--lime:#B4ED02;--paper:#F3EFEC;--black:#0A0A0A;--ink:var(--paper);--dark:var(--black);--muted:color-mix(in srgb,var(--paper) 76%,var(--black));--quiet:color-mix(in srgb,var(--paper) 63%,var(--black));--border:color-mix(in srgb,var(--paper) 19%,transparent);--display:Nexa,FuturaBook,Arial,sans-serif;--body:FuturaBook,Arial,sans-serif}
body{background:var(--black)}
h1,h2,h3{font-family:var(--display)}
button,a{touch-action:manipulation}
.shell>*{min-width:0}
.v5-svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.v5-icon{width:20px;height:20px;flex:none;display:inline-block;vertical-align:middle;overflow:visible}
.v5-left{rotate:180deg}.v5-up{rotate:-90deg}.v5-down{rotate:90deg}
.gallery-item .v5-icon{width:18px;height:18px;color:var(--lime)}
.chat-ticks .v5-icon{width:24px;height:14px}
.journey-replay{display:flex;align-items:center;gap:7px}
.journey-replay .v5-icon{width:17px;height:17px}
/* Exact brand accents, with tinted, translucent depth rather than a flat dark skin. */
.hero{background:radial-gradient(ellipse at 76% 59%,color-mix(in srgb,var(--lime) 11%,var(--black)),transparent 65%),linear-gradient(120deg,color-mix(in srgb,var(--paper) 3%,var(--black)),var(--black))}
.hero-light{background:radial-gradient(ellipse at var(--px) var(--py),color-mix(in srgb,var(--lime) 19%,transparent),transparent 38%),radial-gradient(ellipse at 82% 11%,color-mix(in srgb,var(--paper) 7%,transparent),transparent 46%),radial-gradient(ellipse at 3% 84%,color-mix(in srgb,var(--lime) 6%,transparent),transparent 45%)}
.hero h1 em{background:none;-webkit-text-fill-color:var(--lime);color:var(--lime);padding-bottom:.16em}
.hero-copy p{color:var(--muted)}
.button{background:var(--lime);border-color:var(--lime);color:var(--black);box-shadow:inset 0 1px 1px color-mix(in srgb,var(--paper) 50%,transparent),0 7px 25px color-mix(in srgb,var(--lime) 10%,transparent)}
.button:hover{box-shadow:0 12px 35px color-mix(in srgb,var(--lime) 23%,transparent)}
.button.secondary{background:radial-gradient(ellipse at var(--mx,24%) var(--my,0%),color-mix(in srgb,var(--paper) 14%,transparent),transparent 70%),color-mix(in srgb,var(--lime) 5%,transparent);color:var(--paper);border-color:var(--border)}
.glass{background-image:linear-gradient(135deg,color-mix(in srgb,var(--paper) 12%,transparent),color-mix(in srgb,var(--lime) 3%,transparent) 60%,color-mix(in srgb,var(--paper) 6%,transparent));border-color:var(--border)}
.nav{background-color:color-mix(in srgb,var(--black) 60%,transparent)}
nav a,.eyebrow{color:var(--paper)}
nav a:hover span,nav a:focus-visible span,nav a[aria-current="location"] span{color:var(--lime)}
nav a:after{background:var(--lime);box-shadow:none;height:2px;rotate:-3deg}
.marquee{background:var(--lime);color:var(--black);border-color:var(--lime)}
.signal,.studio-key>span{background:var(--lime);box-shadow:0 0 16px color-mix(in srgb,var(--lime) 60%,transparent)}
.clients{background:radial-gradient(ellipse at 76% 53%,color-mix(in srgb,var(--lime) 13%,var(--black)),color-mix(in srgb,var(--paper) 3%,var(--black)) 78%)}
.work{background:radial-gradient(ellipse at 17% 26%,color-mix(in srgb,var(--lime) 8%,transparent),transparent 60%),radial-gradient(ellipse at 84% 76%,color-mix(in srgb,var(--paper) 5%,transparent),transparent 63%),var(--black)}
.process{background:radial-gradient(ellipse at 65% 90%,color-mix(in srgb,var(--lime) 10%,var(--black)),color-mix(in srgb,var(--paper) 3%,var(--black)) 79%)}
.faq{background:radial-gradient(ellipse at 16% 41%,color-mix(in srgb,var(--lime) 7%,transparent),transparent 70%),var(--black)}
.brand-study{background:radial-gradient(ellipse at 70% 25%,color-mix(in srgb,var(--paper) 15%,var(--lime)),var(--lime) 65%,color-mix(in srgb,var(--lime) 75%,var(--black)));color:var(--black)}
.study-swatches i{background:var(--black)}.study-swatches i:nth-child(2){background:var(--paper)}.study-swatches i:nth-child(3){background:var(--lime)}
.studio-panel,.studio-mini,.client-core,.constellation .client-tile{background-color:color-mix(in srgb,var(--lime) 8%,var(--black))}
.studio-panel{border-color:color-mix(in srgb,var(--paper) 32%,transparent)}
.studio-panel-label,.studio-mini strong{color:var(--paper)}
.studio-mini small,.studio-key,.client-core span{color:var(--muted)}
.mini-symbol{color:var(--lime);background:color-mix(in srgb,var(--lime) 10%,transparent);border-color:color-mix(in srgb,var(--lime) 22%,transparent)}
.studio-orbits circle{fill:var(--lime);stroke:var(--paper)}
.studio-field{background:radial-gradient(ellipse at 48% 47%,color-mix(in srgb,var(--lime) 24%,transparent),transparent 62%),radial-gradient(ellipse at 84% 66%,color-mix(in srgb,var(--paper) 9%,transparent),transparent 48%)}
.client-orbit:after{background:var(--lime);box-shadow:0 0 10px var(--lime)}
.constellation .client-tile[aria-pressed=true]{background-color:color-mix(in srgb,var(--lime) 42%,var(--black));border-color:var(--lime)}
.reel-stage [data-slot="0"] .video-frame{border-color:var(--lime);box-shadow:0 0 25px color-mix(in srgb,var(--lime) 18%,transparent),0 20px 40px color-mix(in srgb,var(--black) 70%,transparent)}
[data-slot="0"] .reel-label{color:var(--lime)}
.process-steps button[aria-pressed=true]>span{background:var(--lime);color:var(--black);box-shadow:0 0 24px color-mix(in srgb,var(--lime) 24%,transparent)}
.journey-timer span{background:var(--lime)}
.chat-client{background:color-mix(in srgb,var(--paper) 9%,var(--black))}
.chat-team{background:linear-gradient(120deg,color-mix(in srgb,var(--lime) 19%,var(--black)),color-mix(in srgb,var(--lime) 10%,var(--black)))}
.chat-message p{color:var(--paper)}.chat-message strong,.chat-ticks{color:var(--lime)}
.chat-chapter>span:first-child{color:var(--lime);background:color-mix(in srgb,var(--lime) 10%,var(--black))}
.modal{background-color:color-mix(in srgb,var(--lime) 6%,var(--black))}
footer{background:var(--black);padding-bottom:88px}
/* Rising marker strokes connect the old and new typography. */
.v5-underline{position:relative;display:inline-block;isolation:isolate;white-space:nowrap}
.v5-underline:after{content:"";position:absolute;z-index:-1;left:-.015em;right:-.025em;bottom:.015em;height:.14em;background:var(--lime);clip-path:polygon(0 41%,26% 30%,51% 23%,78% 10%,100% 0,100% 85%,75% 87%,48% 92%,21% 96%,0 100%);transform:rotate(-1.7deg);transform-origin:left center}
.atmosphere .v5-underline:after{height:.065em;bottom:-.08em}
.hero .v5-hero-underline:after{height:.063em;bottom:-.035em;left:.025em;right:.02em}
.reveal:not(.pending) .v5-underline:after,.hero .v5-underline:after{animation:v5-mark-in .8s cubic-bezier(.24,.7,.22,1) .15s both}
@keyframes v5-mark-in{from{clip-path:polygon(0 41%,0 30%,0 23%,0 10%,0 0,0 85%,0 87%,0 92%,0 96%,0 100%)}to{clip-path:polygon(0 41%,26% 30%,51% 23%,78% 10%,100% 0,100% 85%,75% 87%,48% 92%,21% 96%,0 100%)}}
/* Approved paper components are namespaced to preserve every V4 interaction. */
.v5-section-pad{background:var(--paper);color:var(--black);padding-block:clamp(44px,5vw,76px) clamp(80px,9vw,132px);color-scheme:light;overflow:hidden}
.v5-section-pad p{color:var(--black)}
.v5-section-pad h2,.v5-section-pad h3{font-family:var(--display);font-weight:800;line-height:.99;letter-spacing:-.055em}
.v5-section-meta{display:flex;align-items:start;justify-content:space-between;gap:28px;font-size:clamp(10px,.9vw,13px);line-height:1.3;letter-spacing:.075em;text-transform:uppercase}
.v5-section-meta>span:last-child{text-align:right}
.v5-section-pad :focus-visible{outline-color:var(--black);outline-offset:5px}
.v5-mix-title{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-block:clamp(42px,6vw,85px) clamp(36px,5vw,64px)}
.v5-mix-title h2{font-size:clamp(56px,7.3vw,112px)}
.v5-mix-title p{max-width:31ch;font-size:clamp(17px,1.5vw,21px);line-height:1.35;padding-bottom:5px}
.v5-mix{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.02fr);gap:6%;align-items:start}
.v5-mix-controls{display:flex;flex-direction:column;align-self:start;min-width:0}
.v5-mix-controls button{border:0;border-top:1px solid color-mix(in srgb,var(--black) 28%,transparent);display:flex;align-items:center;text-align:left;gap:19px;padding:24px 14px 24px 0;min-height:83px;background:none;color:var(--black);font:800 clamp(22px,2.5vw,37px)/1.05 var(--display);letter-spacing:-.04em;transition:padding .3s,background .3s}
.v5-mix-controls button:last-child{border-bottom:1px solid color-mix(in srgb,var(--black) 28%,transparent)}
.v5-mix-controls button span{font:400 12px/1 var(--body);letter-spacing:0;flex:none}
.v5-mix-controls button svg{margin-left:auto;width:24px;height:24px;flex:none;opacity:0;transform:translate(-9px,9px);transition:transform .3s,opacity .3s}
.v5-mix-controls button[aria-selected=true]{background:var(--lime);padding-left:18px;border-color:transparent}
.v5-mix-controls button[aria-selected=true] svg,.v5-mix-controls button:hover svg,.v5-mix-controls button:focus-visible svg{opacity:1;transform:none}
.v5-service-panel{min-width:0}
.v5-service-art{background:var(--black);color:var(--lime);height:clamp(280px,26vw,380px);position:relative;overflow:hidden;isolation:isolate}
.v5-art-grid{position:absolute;inset:-40px;background:linear-gradient(color-mix(in srgb,var(--paper) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--paper) 7%,transparent) 1px,transparent 1px);background-size:37px 37px;animation:v5-grid-drift 15s linear infinite}
.v5-art-word{font:800 clamp(130px,13.5vw,200px)/1 var(--display);letter-spacing:-.08em;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;transition:transform .45s,color .45s;white-space:nowrap}
.v5-service-art[data-mode="3"] .v5-art-word,.v5-service-art[data-mode="4"] .v5-art-word{font-size:clamp(100px,10vw,145px);letter-spacing:-.07em}
.v5-art-orbit{position:absolute;border:2px solid var(--paper);width:250px;height:150px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-35deg);transition:width .65s,height .65s,transform .65s,border-radius .65s;animation:v5-orbit-breathe 6s ease-in-out infinite alternate}
.v5-orbit-b{transform:translate(-50%,-50%) rotate(35deg);opacity:.6;animation-direction:alternate-reverse;animation-duration:7s}
.v5-art-caption{position:absolute;bottom:17px;left:18px;right:18px;font:400 10px/1.3 var(--body);letter-spacing:.1em}
.v5-art-index{position:absolute;top:17px;right:18px;font:400 14px/1 var(--body)}
.v5-service-art[data-mode="1"] .v5-art-orbit{width:210px;height:210px;border-radius:35px;transform:translate(-70%,-50%) rotate(-12deg)}
.v5-service-art[data-mode="1"] .v5-orbit-b{transform:translate(-25%,-50%) rotate(12deg)}
.v5-service-art[data-mode="2"] .v5-art-orbit{width:280px;height:280px;transform:translate(-50%,-50%)}
.v5-service-art[data-mode="2"] .v5-orbit-b{width:200px;height:200px}
.v5-service-art[data-mode="3"] .v5-art-orbit{width:300px;height:190px;border-radius:10px;transform:translate(-50%,-50%) rotate(-8deg)}
.v5-service-art[data-mode="3"] .v5-orbit-b{transform:translate(-50%,-50%) rotate(8deg)}
.v5-service-art[data-mode="4"] .v5-art-orbit{width:290px;height:190px;border-radius:16px;transform:translate(-50%,-50%)}
.v5-service-art[data-mode="4"] .v5-orbit-b{width:80px;height:140px;transform:translate(85%,-20%);background:var(--black);opacity:1}
.v5-service-art[data-mode="5"] .v5-art-orbit{width:230px;height:230px;transform:translate(-50%,-50%) rotate(45deg);border-radius:25px}
.v5-service-art[data-mode="5"] .v5-orbit-b{width:165px;height:165px;transform:translate(-50%,-50%) rotate(-15deg)}
.v5-service-copy{padding-top:27px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
.v5-service-copy h3{font-size:clamp(27px,2.55vw,38px);line-height:1.04;letter-spacing:-.045em}
.v5-service-copy p{font-size:clamp(16px,1.45vw,19px);line-height:1.38}
.v5-service-tags{grid-column:1/-1;font-size:13px;line-height:1.5;border-top:1px solid color-mix(in srgb,var(--black) 25%,transparent);padding-top:17px}
.v5-service-copy.v5-switching{animation:v5-copy-in .38s ease both}
@keyframes v5-copy-in{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes v5-grid-drift{to{transform:translate(37px,37px)}}
@keyframes v5-orbit-breathe{to{rotate:7deg;scale:.96}}
.v5-intro{border-block:1px solid color-mix(in srgb,var(--black) 16%,transparent)}
.v5-intro-layout{display:grid;grid-template-columns:minmax(0,.3fr) minmax(0,.7fr);gap:10%;margin-top:clamp(65px,8vw,112px);align-items:center}
.v5-small-poster{background:var(--lime);aspect-ratio:.74;max-width:290px;width:100%;padding:26px;box-shadow:12px 14px 0 color-mix(in srgb,var(--black) 6%,transparent);transform:rotate(-8deg);position:relative;display:flex;flex-direction:column;justify-content:space-between;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.v5-small-poster>span:first-child{font:800 clamp(45px,5vw,78px)/.9 var(--display);letter-spacing:-.06em}
.v5-small-poster svg{width:72%;height:auto;aspect-ratio:1;position:absolute;right:-13%;top:27%;transform:rotate(18deg)}
.v5-small-print{font:400 10px/1.35 var(--body);letter-spacing:.1em}
.v5-small-poster:hover{transform:rotate(-4deg) translateY(-4px)}
.v5-intro h2{font-size:clamp(45px,5.7vw,86px);line-height:1.02;letter-spacing:-.055em}
.v5-intro-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:34px;margin-top:44px;font-size:clamp(17px,1.48vw,20px);line-height:1.4}
.v5-contact{background:var(--lime);padding-bottom:42px}
.v5-contact-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.36fr);align-items:center;gap:65px;padding-block:clamp(65px,7vw,110px) clamp(55px,6vw,90px)}
.v5-contact h2{font-size:clamp(80px,11.4vw,170px);line-height:.86;letter-spacing:-.07em}
.v5-contact h2>span{display:inline-block;transform:rotate(-7deg);background:var(--black);color:var(--paper);padding:.025em .13em .06em;margin-top:.085em;white-space:nowrap}
.v5-contact-cta{width:100%;max-width:320px;aspect-ratio:1;background:var(--paper);color:var(--black);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(8deg);box-shadow:10px 12px 0 color-mix(in srgb,var(--black) 9%,transparent);transition:transform .4s;justify-self:end}
.v5-contact-cta:hover,.v5-contact-cta:focus-visible{transform:rotate(0) scale(1.035)}
.v5-contact-cta>svg{width:clamp(44px,5vw,70px);height:clamp(44px,5vw,70px);margin-bottom:24px;flex:none}
.v5-contact-cta>span{font:800 clamp(20px,2.05vw,28px)/1.06 var(--display);letter-spacing:-.04em;text-align:center;display:block}
.v5-contact-cta>small{font:400 clamp(11px,1vw,14px)/1.3 var(--body);margin-top:18px}
.v5-contact-bottom{display:flex;justify-content:space-between;align-items:end;border-top:1px solid color-mix(in srgb,var(--black) 28%,transparent);padding-top:26px;gap:30px}
.v5-contact-bottom p{font-size:19px;line-height:1.35}
.v5-contact-bottom>span{font-size:13px}
.v5-motion-control{position:fixed;right:22px;bottom:20px;z-index:40;display:flex;align-items:center;gap:8px;border-radius:999px;min-height:40px;padding:8px 13px;font:400 12px/1.2 var(--body);color:var(--paper);background-color:color-mix(in srgb,var(--black) 88%,transparent);box-shadow:0 3px 20px color-mix(in srgb,var(--black) 20%,transparent)}
.v5-motion-control>svg{width:16px;height:16px;color:var(--lime)}
.v5-resume-icon{display:none}.v5-motion-control[aria-pressed=true] .v5-pause-icon{display:none}.v5-motion-control[aria-pressed=true] .v5-resume-icon{display:block}
.motion-paused{scroll-behavior:auto}
.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation:none!important;transition:none!important}
.motion-paused .reveal.pending{opacity:1!important;transform:none!important}
.motion-paused .chat-message,.motion-paused .gallery-item,.motion-paused nav a{opacity:1!important}
.motion-paused .ticker-track{width:100%;display:block}.motion-paused .ticker-group{justify-content:center;flex-wrap:wrap;gap:8px 14px;white-space:normal}.motion-paused .ticker-group+.ticker-group,.motion-paused .ticker-group b:last-child{display:none}
@media(max-width:1050px){
 .v5-mix{gap:5%}.v5-mix-controls button{font-size:26px;min-height:77px;gap:13px;padding-block:21px}
 .v5-service-copy{grid-template-columns:1fr;gap:16px}.v5-service-copy h3{font-size:31px}.v5-service-copy h3 br{display:none}
 .v5-intro-layout{gap:8%;grid-template-columns:minmax(0,.27fr) minmax(0,.73fr)}.v5-small-poster{padding:20px;aspect-ratio:.66}.v5-small-print{font-size:8px}
 .v5-intro h2{font-size:clamp(43px,5.8vw,60px)}.v5-intro-body{gap:25px}
 .v5-contact-main{grid-template-columns:minmax(0,1fr) 235px;gap:32px}.v5-contact-cta>span{font-size:21px}
}
@media(min-width:701px) and (max-width:850px){.v5-contact-main{grid-template-columns:minmax(0,1fr) 200px;gap:24px}.v5-contact-cta>span{font-size:18px}.v5-contact-cta>small{font-size:10px}}
@media(max-width:700px){
 .v5-section-pad{padding-block:34px 70px}.v5-section-meta{font-size:10px;gap:22px}.v5-section-meta>span:last-child{max-width:145px}
 .v5-mix-title{display:block;margin-block:45px 32px}.v5-mix-title h2{font-size:clamp(56px,14vw,85px);line-height:.99}.v5-mix-title p{font-size:17px;max-width:31ch;margin-top:27px}
 .v5-mix{display:flex;flex-direction:column;gap:26px}.v5-mix-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:7px}
 .v5-mix-controls button{border:1px solid color-mix(in srgb,var(--black) 28%,transparent);font:800 clamp(14px,3.6vw,20px)/1.18 var(--display);letter-spacing:-.025em;min-height:62px;padding:12px!important;gap:8px}
 .v5-mix-controls button span{font-size:10px}.v5-mix-controls button svg{display:none}.v5-mix-controls button[aria-selected=true]{border-color:var(--lime)}
 .v5-service-panel{width:100%}.v5-service-art{height:270px}.v5-art-word{font-size:150px}.v5-service-art[data-mode="3"] .v5-art-word,.v5-service-art[data-mode="4"] .v5-art-word{font-size:112px}
 .v5-service-copy{padding-top:23px;gap:16px}.v5-service-copy h3{font-size:32px}.v5-service-copy p{font-size:18px;line-height:1.4}.v5-service-tags{font-size:12px}
 .v5-intro-layout{grid-template-columns:1fr;gap:35px;margin-top:46px;position:relative}
 .v5-small-poster{width:119px;aspect-ratio:.78;padding:12px;margin:0 17px 0 auto;transform:rotate(9deg);box-shadow:7px 8px 0 color-mix(in srgb,var(--black) 6%,transparent)}
 .v5-small-poster>span:first-child{font-size:35px}.v5-small-poster svg{width:67%;right:-8%;top:28%}.v5-small-print{font-size:5px}
 .v5-intro h2{font-size:clamp(37px,9.5vw,64px);line-height:1.04;letter-spacing:-.055em}.v5-intro-body{grid-template-columns:1fr;gap:20px;margin-top:30px;font-size:18px;max-width:36ch}
 .v5-contact-main{grid-template-columns:minmax(0,1fr);gap:43px;padding-block:50px 38px}.v5-contact h2{font-size:clamp(54px,17.4vw,120px);line-height:.88}
 .v5-contact-cta{width:205px;justify-self:end;margin-right:8px;box-shadow:7px 8px 0 color-mix(in srgb,var(--black) 9%,transparent)}
 .v5-contact-cta>svg{width:45px;height:45px;margin-bottom:17px}.v5-contact-cta>span{font-size:20px}.v5-contact-cta>small{font-size:11px;margin-top:15px}
 .v5-contact-bottom{display:block;padding-top:23px}.v5-contact-bottom p{font-size:17px}.v5-contact-bottom>span{display:block;margin-top:23px;font-size:12px}
 .v5-motion-control{right:14px;bottom:14px;min-height:39px;padding:8px 12px;font-size:11px}
 .footer-inner>span{width:100%;order:3;font-size:13px}.footer-inner>a:last-child{font-size:13px}
 .hero h1{font-size:clamp(2.8rem,9.7vw,4.8rem)}
 .section-intro h2{font-size:clamp(2.8rem,10.8vw,4.5rem)}
}
@media(max-width:380px){.v5-mix-controls button{font-size:13px;padding-inline:9px!important;gap:6px}.v5-intro h2{font-size:9.6vw}.v5-service-art{height:250px}.v5-art-caption{font-size:9px}.v5-contact-cta{width:190px}.hero h1{font-size:9.7vw}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}
 .reveal.pending{opacity:1!important;transform:none!important}.chat-message,.gallery-item,nav a{opacity:1!important}
}
