/* Native scrolling drives a single dimensional scene. No wheel interception. */
.blue-world{position:relative}
.services,.about{overflow:clip}
.scroll-story{position:relative}
.story-pin{position:relative;min-height:780px;background:var(--blue);color:var(--cream);isolation:isolate;overflow:clip}
.story-copy{position:relative;z-index:10;max-width:650px;margin:0 56px;padding:70px 0}
.story-copy h1{font-size:clamp(64px,6.7vw,100px);font-weight:600;letter-spacing:-.055em;line-height:.98;margin:23px 0 25px}
.story-copy .playful{margin:5px 0 8px;padding:1px 12px 7px}
.story-copy h2{font-size:clamp(60px,6.7vw,96px);line-height:.98;letter-spacing:-.05em;margin:25px 0}
.story-copy h2 em{color:var(--pink)}
.story-copy>p{font-size:17px;line-height:1.55;letter-spacing:-.015em;max-width:345px}
.story-copy .eyebrow{font-size:10px;letter-spacing:.11em}
.story-work-link{display:inline-flex;gap:32px;align-items:center;font-size:12px;border-bottom:1px solid #fff7e966;padding-bottom:5px;margin-top:24px}
.story-work-link span{font-size:22px}
.story-copy .pill{margin-top:25px}
.creative-universe{position:relative;width:600px;height:440px;margin:30px auto 90px;perspective:1600px;pointer-events:none;z-index:5;transform:scale(.9)}
.universe-axis{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(var(--camera-x,8deg)) rotateY(var(--camera-y,-15deg)) rotateZ(var(--camera-z,-6deg));will-change:transform}
.main-screen{position:absolute;left:50%;top:50%;width:510px;height:366px;transform:translate(-50%,-50%) translateZ(20px);border:9px solid #24231f;border-radius:14px;background:var(--cream);color:var(--ink);box-shadow:2px 4px 0 #555047,6px 9px 0 #1a1922,12px 17px 0 #191725,20px 35px 75px #11102566;overflow:hidden}
.screen-top{height:29px;background:#f4eedf;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid #24231f33;font-size:8px;letter-spacing:.08em;font-weight:600}
.screen-dots{font-size:8px;letter-spacing:2px;color:#24231f66}
.screen-top>span:last-child{font-size:17px;color:var(--blue)}
.screen-content{position:relative;height:263px;overflow:hidden}
.screen-face{position:absolute;inset:0;padding:23px 28px;overflow:hidden;opacity:0}
.screen-face[data-face="0"]{opacity:1}
.screen-face .micro{position:relative;z-index:3;font-size:8px}
.screen-face strong{position:relative;display:block;font-family:var(--font);font-size:74px;letter-spacing:-.055em;line-height:.85;font-weight:700;margin-top:17px;z-index:2}
.screen-face strong em{font-family:Georgia,serif;font-weight:400}
.face-intro{background:var(--cream);color:var(--blue)}
.face-intro strong{font-size:81px}
.face-intro strong em{font-family:var(--font);font-style:normal}
.face-footer{position:absolute;bottom:19px;left:28px;font-size:7px;letter-spacing:.12em;z-index:3}
.intro-disc{position:absolute;width:180px;height:180px;border-radius:50%;background:var(--pink);right:-30px;top:8px;box-shadow:0 0 0 15px #ffc2dc55,0 0 0 30px #ffc2dc22;display:grid;place-items:center}
.intro-disc span{font-size:90px;transform:rotate(-15deg);line-height:1}
.face-strategy{background:var(--yellow);color:var(--ink)}
.face-strategy strong{font-size:61px;margin-top:20px}
.face-strategy strong em{font-size:77px;color:var(--blue)}
.idea-notes{position:absolute;right:27px;top:40px;width:130px;display:grid;gap:12px;z-index:3}
.idea-notes span{display:block;font-size:10px;font-weight:600;letter-spacing:.06em;padding:14px 12px;background:var(--cream);border:1px solid var(--ink);box-shadow:3px 3px 0 #24231f33;transform:rotate(7deg)}
.idea-notes span:nth-child(2){background:var(--pink);transform:rotate(-6deg)}
.idea-notes span:nth-child(3){background:var(--blue);color:var(--cream);transform:rotate(5deg)}
.strategy-flower{position:absolute;font-size:130px;color:var(--orange);bottom:-30px;right:125px;line-height:1}
.face-motion{background:#252559;color:var(--cream)}
.face-motion strong{font-size:69px;margin-top:30px}
.face-motion strong em{color:var(--pink)}
.motion-orb{position:absolute;right:0;top:-37px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle at 35% 23%,#fff7e9,#ffc2dc 22%,#a096dc 45%,#34346e 68%,#252559 77%)}
.film-line{display:flex;gap:8px;position:absolute;bottom:14px;left:28px;right:28px}
.film-line span{flex:1;border:1px solid #fff7e966;border-radius:3px;padding:6px 8px;font-size:8px;color:#fff7e9aa;background:#fff7e90b}
.face-impact{background:var(--pink);color:var(--ink)}
.face-impact strong{font-size:87px;margin-top:23px}
.face-impact strong em{color:var(--blue)}
.impact-smile{position:absolute;width:110px;height:110px;border:3px solid var(--ink);border-radius:50%;right:20px;bottom:35px;transform:rotate(12deg)}
.impact-smile:before,.impact-smile:after{content:'';position:absolute;width:7px;height:16px;background:var(--ink);border-radius:50%;top:25px;left:31px}
.impact-smile:after{left:67px}
.impact-smile span{position:absolute;font-family:Arial,sans-serif;font-size:92px;line-height:1;top:12px;left:18px}
.screen-timeline{height:56px;background:#282634;padding:7px 13px;position:relative;border-top:1px solid #24231f}
.time-ruler{display:flex;justify-content:space-between;border-bottom:1px solid #fff7e933;height:9px}
.time-ruler i{height:5px;width:1px;background:#fff7e955}
.timeline-clips{display:flex;gap:5px;margin-top:7px}
.timeline-clips i{height:13px;border-radius:2px;background:var(--pink);flex:1}
.timeline-clips i:nth-child(2){background:#aebdff;flex:1.8}
.timeline-clips i:nth-child(3){background:var(--yellow);flex:.7}
.timeline-clips i:nth-child(4){background:#ddadf3;flex:1.3}
.screen-playhead{position:absolute;top:3px;bottom:4px;width:2px;background:var(--cream);left:var(--playhead,12%);box-shadow:0 0 7px #fff7e966}
.screen-playhead:before{content:'';position:absolute;left:-3px;top:0;width:8px;height:6px;background:var(--cream);clip-path:polygon(0 0,100% 0,50% 100%)}
.floating-card{position:absolute;border:2px solid var(--ink);border-radius:6px;padding:17px;box-shadow:5px 8px 0 #151526;display:flex;flex-direction:column;justify-content:space-between;transform-style:preserve-3d}
.orbit-reel{width:155px;height:235px;background:var(--pink);color:var(--ink);left:-9px;top:55px;transform:translate3d(var(--reel-x,-30px),var(--reel-y,0px),75px) rotateY(-8deg) rotateZ(var(--reel-rotate,-15deg));z-index:3}
.orbit-reel strong{font-family:var(--font);font-size:46px;line-height:.82;letter-spacing:-.05em;font-weight:700}
.orbit-reel strong em{font-family:Georgia,serif;color:var(--blue);font-weight:400}
.reel-time{font-family:monospace;font-size:8px;margin-top:auto;padding-top:20px}
.tiny-timeline{height:3px;background:#24231f44;position:relative;margin-top:7px}
.tiny-timeline i{display:block;width:var(--mini-progress,35%);height:100%;background:var(--blue)}
.orbit-script{width:165px;height:196px;background:var(--cream);color:var(--ink);left:460px;top:120px;transform:translate3d(var(--script-x,0px),var(--script-y,0px),90px) rotateY(8deg) rotateZ(var(--script-rotate,13deg));z-index:4}
.orbit-script strong{font-family:var(--font);font-size:28px;font-weight:600;line-height:.95;letter-spacing:-.04em;margin-top:10px}
.orbit-script strong em{font-family:Georgia,serif;color:var(--blue)}
.orbit-script .micro{font-size:6px}
.script-lines{margin-top:12px;display:grid;gap:5px}
.script-lines i{height:2px;width:78%;background:#24231f44}
.script-lines i:nth-child(2){width:90%}.script-lines i:nth-child(3){width:52%}
.script-arrow{position:absolute;right:15px;bottom:16px;font-size:25px;line-height:1}
.scene-sticker{position:absolute;width:109px;height:109px;right:12px;top:-6px;transform:translate3d(var(--sticker-x,0px),var(--sticker-y,0px),130px) rotate(var(--sticker-rotate,12deg));background:var(--yellow);color:var(--ink);clip-path:polygon(50% 0,58% 13%,70% 4%,74% 19%,89% 15%,88% 31%,100% 37%,89% 49%,100% 61%,85% 67%,88% 83%,72% 82%,67% 97%,54% 88%,43% 100%,37% 85%,21% 91%,22% 75%,6% 74%,13% 59%,0 50%,13% 41%,5% 25%,22% 26%,25% 10%,41% 15%);display:grid;place-items:center;z-index:7}
.scene-sticker span{text-align:center;font-size:11px;font-weight:800;line-height:1.05}
.floating-label{position:absolute;bottom:10px;left:107px;border:1px solid var(--ink);background:var(--cream);color:var(--ink);border-radius:999px;padding:10px 18px;font-size:8px;font-weight:700;letter-spacing:.06em;transform:translate3d(0,var(--label-y,0px),110px) rotate(-3deg);z-index:8;white-space:nowrap}
.floating-label span{color:var(--blue);padding:0 5px}
.scene-orb{position:absolute;width:78px;height:78px;left:35px;bottom:5px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff7e9,#ffc2dc 23%,#b69de4 45%,#584cb7 68%,#292363 80%);box-shadow:12px 20px 25px #12133833;transform:translate3d(var(--orb-x,0px),var(--orb-y,0px),150px);z-index:9}
.scene-ring{position:absolute;width:650px;height:245px;left:-20px;top:100px;border:1px solid #fff7e94d;border-radius:50%;transform:translateZ(-100px) rotateX(38deg) rotateZ(var(--ring-rotate,-25deg)) scale(var(--ring-scale,1));pointer-events:none}
.ring-two{width:580px;height:420px;top:20px;left:25px;border-color:#ffc2dc33;transform:translateZ(-130px) rotateY(45deg) rotateZ(var(--ring-rotate,-25deg))}
.story-grid,.scene-halo,.scene-watermark{display:none}
.story-bottom{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0 28px}
.scroll-invitation{display:none;font-size:10px;gap:12px;align-items:center}
.scroll-invitation>i{width:17px;height:28px;border:1px solid #fff7e988;border-radius:12px;position:relative}
.scroll-invitation>i:after{content:'';position:absolute;height:6px;width:2px;background:var(--cream);top:var(--scroll-dot,6px);left:6px;border-radius:2px}
.story-caption{font-size:8px;letter-spacing:.13em;opacity:.75}
.story-chapters{display:none;align-items:center;gap:12px}
.story-chapters button{border:0;background:none;color:var(--cream);display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;font-family:monospace;font-size:9px}
.story-chapters button>span{opacity:.55}
.story-chapters button>i{display:block;width:34px;height:2px;background:#fff7e944;position:relative}
.story-chapters button>i:after{content:'';display:block;height:100%;width:var(--chapter-fill,0%);background:var(--pink)}
.story-chapters button[aria-pressed="true"]>span{opacity:1}
.scroll-enabled .site-header{position:sticky;top:0;z-index:50;height:100px;margin-bottom:-100px;padding-top:0;padding-bottom:0;background:none;isolation:isolate}
.scroll-enabled .site-header:before{content:'';position:absolute;inset:0;left:calc((100% - 100vw)/2);right:calc((100% - 100vw)/2);background:color-mix(in srgb,var(--scene-bg,var(--blue)) 90%,transparent);backdrop-filter:blur(14px);z-index:-1}
.scroll-enabled .scroll-story{height:440svh;min-height:2400px}
.scroll-enabled .story-pin{position:sticky;top:0;height:100svh;min-height:600px;contain:layout paint;background:var(--scene-bg,var(--blue))}
.scroll-enabled .story-copy{position:absolute;top:50%;left:max(56px,calc((100vw - 1288px)/2));width:43%;max-width:560px;padding:0;margin:0;transform:translateY(-50%);will-change:opacity,transform}
.scroll-enabled .story-copy:not(.story-intro){opacity:0;pointer-events:none}
.scroll-enabled .creative-universe{position:absolute;left:68%;top:53%;margin:0;transform:translate(-50%,-50%) scale(var(--scene-scale,.85));will-change:transform}
.scroll-enabled .story-bottom{position:absolute;bottom:0;left:50%;transform:translateX(-50%);padding:0 0 24px}
.scroll-enabled .story-chapters,.scroll-enabled .scroll-invitation{display:flex}
.scroll-enabled .story-grid{display:block;position:absolute;inset:0;opacity:.18;background-image:linear-gradient(#fff7e922 1px,transparent 1px),linear-gradient(90deg,#fff7e922 1px,transparent 1px);background-size:90px 90px;mask-image:linear-gradient(to right,transparent 35%,#000);transform:translateY(var(--grid-y,0px));pointer-events:none}
.scroll-enabled .scene-halo{display:block;position:absolute;width:70vw;height:70vw;right:-10vw;top:-5vw;border-radius:50%;background:radial-gradient(circle,#e9bfff28,transparent 64%);transform:translate(var(--halo-x,0px),var(--halo-y,0px));pointer-events:none}
.scroll-enabled .scene-watermark{display:block;position:absolute;font-family:var(--font);font-size:clamp(150px,28vw,410px);letter-spacing:-.06em;font-weight:700;white-space:nowrap;bottom:25px;left:30%;line-height:1;color:#fff7e907;transform:translateX(var(--watermark-x,0px));pointer-events:none}
.scroll-enabled .ticker>div{transform:translateX(var(--ticker-x,0px));will-change:transform}
@media(min-width:1500px){.scroll-enabled .story-copy{left:max(70px,calc((100vw - 1288px)/2));width:45%}.story-copy h1,.story-copy h2{font-size:100px}.scroll-enabled .creative-universe{left:66%}}
@media(max-width:1100px){.scroll-enabled .story-copy{left:36px;width:43%}.story-copy h1,.story-copy h2{font-size:clamp(56px,6.6vw,82px)}.story-copy>p{font-size:15px;max-width:290px}.scroll-enabled .creative-universe{left:69%}.story-copy .eyebrow{font-size:9px}.story-caption{display:none}.story-bottom{width:calc(100% - 72px)}}
@media(max-width:780px){.scroll-enabled .site-header{height:91px;margin-bottom:-91px}.scroll-enabled .story-copy{left:23px;width:43%}.story-copy h1,.story-copy h2{font-size:clamp(48px,7.0vw,63px);margin:20px 0}.story-copy>p{font-size:13px;line-height:1.6;max-width:255px}.story-copy .eyebrow{font-size:8px;letter-spacing:.07em}.story-work-link{font-size:11px;gap:25px;margin-top:20px}.scroll-enabled .creative-universe{left:72%;top:55%}.story-copy .pill{font-size:11px;padding:14px 18px;gap:20px}.story-bottom{width:calc(100% - 46px)}}
@media(max-width:600px){
 .story-pin{min-height:0}.story-copy{margin:0 20px;padding:45px 0}.story-copy h1,.story-copy h2{font-size:52px}.creative-universe{margin:-20px 0 -40px;left:50%;transform:translateX(-50%) scale(.46)}
 .scroll-enabled .site-header{height:80px;margin-bottom:-80px}
 .scroll-enabled .scroll-story{height:400svh;min-height:2100px}
 .scroll-enabled .story-pin{height:100svh;min-height:620px}
 .scroll-enabled .story-copy{left:20px;top:15.5%;width:calc(100% - 40px);max-width:none;transform:none}
 .story-copy h1{font-size:clamp(43px,10.5vw,60px);line-height:.96;margin:17px 0 16px;letter-spacing:-.045em}
 .story-copy h1 br:first-of-type{display:none}
 .story-copy .playful{padding:0 8px 5px;margin:3px 0 7px}
 .story-copy h2{font-size:clamp(46px,11.3vw,65px);line-height:.98;margin:17px 0 19px}
 .story-copy>p{font-size:13px;line-height:1.55;max-width:300px}
 .story-copy .eyebrow{font-size:8px;letter-spacing:.07em}
 .story-work-link{font-size:10px;margin-top:12px;gap:25px;padding-bottom:2px}
 .story-work-link span{font-size:17px}
 .scroll-enabled .creative-universe{left:50%;top:69%;transform:translate(-50%,-50%) scale(var(--scene-scale,.44))}
 .scroll-enabled .story-bottom{width:calc(100% - 40px);padding-bottom:15px;gap:16px;align-items:center}
 .scroll-invitation{font-size:8px;gap:8px;max-width:104px;line-height:1.4}
 .scroll-invitation>i{flex-shrink:0;width:14px;height:24px}
 .scroll-invitation>i:after{left:5px}
 .story-chapters{gap:8px}
 .story-chapters button{gap:5px;font-size:8px}
 .story-chapters button>i{width:20px}
 .story-copy .pill{margin-top:16px;font-size:11px;padding:12px 18px}
 .scroll-enabled .story-grid{background-size:65px 65px;mask-image:linear-gradient(to bottom,transparent 25%,#000 60%)}
 .scroll-enabled .scene-watermark{font-size:190px;left:0;bottom:50px}
 .scroll-enabled .scene-halo{width:160vw;height:160vw;right:-35vw;top:35%}
}
@media(max-width:360px){.story-copy h1{font-size:43px}.story-copy h2{font-size:47px}.scroll-enabled .story-copy{top:15%}.story-copy>p{font-size:12px;max-width:270px}.scroll-enabled .creative-universe{top:70%}.story-chapters{gap:6px}.story-chapters button>i{width:15px}.story-work-link{margin-top:9px}.scroll-invitation{max-width:95px}}
@media(max-width:600px) and (max-height:700px){.scroll-enabled .creative-universe{top:76%}.story-copy h1{font-size:clamp(39px,9.8vw,51px)}.story-copy h2{font-size:45px}.story-copy>p{font-size:12px;max-width:280px}.story-copy .pill{margin-top:13px}.scroll-enabled .story-bottom{padding-bottom:10px}}
@media(max-height:650px) and (min-width:601px){.scroll-enabled .story-pin{min-height:540px}.story-copy h1,.story-copy h2{font-size:58px}.story-copy h1{margin:17px 0}.story-copy>p{font-size:13px}.story-work-link{margin-top:13px}.scroll-enabled .creative-universe{top:54%}.scroll-enabled .story-copy{top:52%}.scroll-enabled .story-bottom{padding-bottom:12px}}
@media(prefers-reduced-motion:reduce){.universe-axis{transform:rotate(-4deg)}.story-copy:not(.story-intro){padding-top:20px;padding-bottom:30px}.story-copy h1{font-size:clamp(48px,7vw,85px)}.scroll-invitation{display:none}}