:root{--black:#050608;--graphite:#111318;--titanium:#b9bec8;--white:#f2f3f5;--blue:#28b8ff;--line-dark:rgba(242,243,245,.14);--line-light:rgba(17,19,24,.14);--display:"Instrument Sans",sans-serif;--body:"DM Sans",sans-serif;--mono:"DM Mono",monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--black)}body{margin:0;overflow-x:hidden;color:var(--white);background:var(--black);font-family:var(--body)}a{color:inherit;text-decoration:none}button{font:inherit}.skip-link{position:fixed;z-index:100;top:8px;left:8px;padding:10px 14px;color:var(--black);background:var(--white);transform:translateY(-150%)}.skip-link:focus{transform:none}.nav{position:fixed;z-index:50;top:18px;right:clamp(18px,4vw,64px);left:clamp(18px,4vw,64px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:10px 12px 10px 18px;border:1px solid rgba(242,243,245,.12);border-radius:14px;background:rgba(5,6,8,.68);backdrop-filter:blur(20px);transition:background .3s,border-color .3s}.nav.is-scrolled{border-color:rgba(242,243,245,.18);background:rgba(5,6,8,.9)}.logo{display:flex;align-items:center;gap:10px;width:max-content;font:600 12px var(--display);letter-spacing:.06em}.logo i{width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 18px rgba(40,184,255,.8)}.nav nav{display:flex;gap:4px}.nav nav a,.nav-cta{padding:10px 14px;border-radius:8px;color:rgba(242,243,245,.68);font:500 10px var(--mono);transition:color .2s,background .2s}.nav nav a:hover,.nav nav a:focus-visible{color:#fff;background:rgba(255,255,255,.07)}.nav-cta{justify-self:end;color:var(--black);background:var(--white)}.nav-cta span{margin-left:8px}.dark{color:var(--white);background:var(--black)}.light{color:var(--graphite);background:var(--white)}.hero{position:relative;min-height:100svh;overflow:hidden}.hero-media,.hero-shade{position:absolute;inset:0}.hero-media{background:#020305 url("./images/tech2u-hero-poster.jpg") 70% center/cover no-repeat}.hero-media video{width:100%;height:100%;object-fit:cover;object-position:70% center;filter:saturate(.82) contrast(1.05) brightness(.78)}.hero-shade{background:linear-gradient(90deg,rgba(5,6,8,.98) 0%,rgba(5,6,8,.86) 27%,rgba(5,6,8,.25) 54%,rgba(5,6,8,.06) 78%),linear-gradient(180deg,rgba(5,6,8,.2),transparent 64%,rgba(5,6,8,.64));pointer-events:none}.hero-copy{position:relative;z-index:3;width:min(700px,48vw);padding:clamp(180px,24vh,240px) 0 130px clamp(24px,9vw,150px);opacity:0;transform:translateY(24px);animation:hero-in 1.1s cubic-bezier(.16,1,.3,1) 1.2s forwards}@keyframes hero-in{to{opacity:1;transform:none}}.kicker{margin:0 0 22px;color:var(--blue);font:500 10px var(--mono);letter-spacing:.14em}.hero h1,.section-intro h2,.about h2,.product h2,.contact h2{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-.065em}.hero h1{font-size:clamp(58px,7.2vw,116px);line-height:.84}.hero h1 span,.section-intro h2 span,.about h2 span,.product h2 span,.contact h2 span{color:var(--titanium)}.lead{max-width:580px;margin:30px 0 0;color:inherit;font-size:clamp(16px,1.25vw,20px);line-height:1.65}.dark .lead{color:rgba(242,243,245,.68)}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:38px}.btn{display:inline-flex;min-height:52px;align-items:center;padding:0 22px;border-radius:10px;font:600 11px var(--mono);transition:transform .2s,background .2s}.btn:hover{transform:translateY(-2px)}.btn.light{color:var(--black);background:var(--white)}.link{padding:10px 0;border-bottom:1px solid rgba(242,243,245,.28);color:rgba(242,243,245,.72);font:500 10px var(--mono)}.loop{position:absolute;z-index:4;right:clamp(22px,4vw,64px);bottom:40px;display:flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid var(--line-dark);border-radius:9px;color:rgba(242,243,245,.62);background:rgba(5,6,8,.54);backdrop-filter:blur(12px);font:500 9px var(--mono);cursor:pointer}.loop[aria-pressed=true]{color:var(--blue);border-color:rgba(40,184,255,.5)}.loop[aria-pressed=true] i{animation:spin 2.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loop i{font-style:normal}.hero-note{position:absolute;z-index:3;bottom:38px;left:clamp(24px,9vw,150px);margin:0;color:rgba(242,243,245,.38);font:9px var(--mono)}.hero-note i{margin-left:10px;color:var(--blue);font-style:normal}.social,.about,.showreel,.work,.product,.contact{padding:clamp(100px,12vw,180px) clamp(22px,7vw,120px)}.social{background:linear-gradient(145deg,#050608,#0a0d12)}.section-intro{max-width:920px}.section-intro h2,.about h2,.product h2,.contact h2{font-size:clamp(48px,6vw,96px);line-height:.92}.section-intro>p:last-child{max-width:620px;margin:28px 0 0;color:rgba(242,243,245,.62);font-size:17px;line-height:1.7}.channel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:80px;background:var(--line-dark);border:1px solid var(--line-dark)}.channel{position:relative;display:grid;grid-template-columns:40px 54px minmax(0,1fr) auto;gap:22px;align-items:center;min-height:190px;padding:32px;background:#080a0e;transition:background .25s}.channel:hover{background:#0e1218}.channel-no{align-self:start;color:rgba(242,243,245,.3);font:9px var(--mono)}.channel img{width:34px;height:34px}.channel div{display:grid;gap:8px;min-width:0}.channel small{color:var(--blue);font:9px var(--mono)}.channel strong{font:600 clamp(21px,2vw,30px) var(--display);letter-spacing:-.035em}.channel p{margin:0;color:rgba(242,243,245,.5);font-size:13px}.channel>b{align-self:start;color:rgba(242,243,245,.42);font:400 16px var(--mono)}.about{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(420px,1.15fr);gap:clamp(60px,10vw,170px);align-items:center}.about .lead{color:rgba(17,19,24,.66)}.profile{display:flex;min-height:570px;flex-direction:column;justify-content:space-between;padding:clamp(28px,4vw,56px);border:1px solid var(--line-light);border-radius:16px;background:linear-gradient(145deg,#eef0f3,#dfe3e8);box-shadow:0 30px 80px rgba(17,19,24,.09)}.profile-top{display:flex;justify-content:space-between;color:rgba(17,19,24,.46);font:9px var(--mono)}.profile-top i{color:#147b63;font-style:normal}.profile>strong{font:600 clamp(68px,7.5vw,126px)/.73 var(--display);letter-spacing:-.085em}.profile>strong span{color:var(--blue)}.profile-tags{display:flex;flex-wrap:wrap;gap:8px}.profile-tags span{padding:9px 12px;border:1px solid var(--line-light);border-radius:8px;color:rgba(17,19,24,.58);font:8px var(--mono)}.brands{padding:42px clamp(22px,7vw,120px) 60px;border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light)}.brands .kicker{color:rgba(17,19,24,.42)}.brands>div{display:grid;grid-template-columns:repeat(8,minmax(max-content,1fr));gap:30px;align-items:center;margin-top:28px}.brands span{color:rgba(17,19,24,.72);font:600 clamp(17px,1.6vw,25px) var(--display);letter-spacing:-.04em;white-space:nowrap}.showreel{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(50px,8vw,120px);align-items:center}.showreel .kicker,.work .kicker{color:#167cad}.video-frame{overflow:hidden;border-radius:14px;background:var(--graphite);box-shadow:0 30px 80px rgba(17,19,24,.14)}.video-frame video{display:block;width:100%;aspect-ratio:16/9}.work{border-top:1px solid var(--line-light)}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:70px}.project{overflow:hidden;border:1px solid var(--line-light);border-radius:14px;background:#fff}.project.large{grid-column:1/-1}.project img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.8)}.project.large img{aspect-ratio:2.35/1}.project div{padding:26px}.project small{color:#167cad;font:9px var(--mono)}.project h3{margin:10px 0 8px;font:600 clamp(25px,3vw,42px) var(--display);letter-spacing:-.05em}.project p{margin:0;color:rgba(17,19,24,.58)}.product{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(50px,8vw,120px);align-items:center}.product-art{overflow:hidden;border:1px solid var(--line-dark);border-radius:16px;background:#0b0e13}.product-art img{display:block;width:100%;height:auto}.product-copy>p:not(.kicker){max-width:510px;margin:28px 0 34px;color:rgba(242,243,245,.62);font-size:17px;line-height:1.7}.contact{text-align:center;border-top:1px solid var(--line-dark)}.contact h2{max-width:1000px;margin:auto}.contact>p:not(.kicker){color:rgba(242,243,245,.55)}.contact>a{display:inline-block;margin-top:34px;padding-bottom:8px;border-bottom:1px solid rgba(242,243,245,.3);font:500 clamp(16px,2vw,26px) var(--mono)}.contact>a b{color:var(--blue)}footer{display:flex;justify-content:space-between;align-items:center;padding:30px clamp(22px,7vw,120px);border-top:1px solid var(--line-dark);color:rgba(242,243,245,.5);font:9px var(--mono)}.reveal{opacity:0;filter:blur(8px);transform:translateY(24px);transition:opacity .8s cubic-bezier(.16,1,.3,1),filter .8s,transform .8s cubic-bezier(.16,1,.3,1)}.reveal.is-visible{opacity:1;filter:blur(0);transform:none}a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
@media(max-width:980px){.nav{grid-template-columns:1fr auto}.nav nav{position:absolute;top:62px;left:50%;max-width:calc(100vw - 36px);transform:translateX(-50%);padding:4px;border:1px solid var(--line-dark);border-radius:10px;background:rgba(5,6,8,.9)}.nav-cta{grid-column:2}.hero-copy{width:min(660px,68vw)}.about,.showreel,.product{grid-template-columns:1fr}.brands>div{grid-template-columns:repeat(4,1fr);row-gap:28px}.profile{min-height:480px}.product-art{order:2}.product-copy{order:1}}
@media(max-width:680px){.nav{top:10px;right:10px;left:10px}.nav nav a{padding:9px 8px;font-size:8px}.nav-cta{padding:9px 10px;font-size:8px}.hero{min-height:900px}.hero-media{top:36%;height:52%;background-position:72% center}.hero-media video{object-position:72% center}.hero-shade{background:linear-gradient(180deg,#050608 0 36%,rgba(5,6,8,.12) 55%,#050608 90%)}.hero-copy{width:auto;padding:138px 20px 460px}.hero h1{font-size:clamp(55px,16vw,76px)}.hero .lead{max-width:340px;font-size:14px}.hero-actions{gap:18px}.loop{right:16px;bottom:70px}.hero-note{left:20px;bottom:34px}.social,.about,.showreel,.work,.product,.contact{padding:92px 20px}.section-intro h2,.about h2,.product h2,.contact h2{font-size:clamp(46px,13vw,66px)}.channel-grid{grid-template-columns:1fr;margin-top:54px}.channel{grid-template-columns:28px 42px minmax(0,1fr) auto;gap:14px;min-height:150px;padding:22px 16px}.channel img{width:28px}.channel p{font-size:11px}.profile{min-height:420px;padding:26px}.profile>strong{font-size:74px}.brands{padding:35px 20px 44px}.brands>div{grid-template-columns:repeat(2,1fr)}.work-grid{grid-template-columns:1fr}.project.large{grid-column:auto}.project.large img{aspect-ratio:16/10}.project img{aspect-ratio:16/10}footer{flex-direction:column;align-items:flex-start;gap:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-copy,.reveal{opacity:1;filter:none;transform:none;animation:none;transition:none}.hero-media video{display:none}.loop{display:none}}

/* AI Atelier × Spatial Lab */
:root{--warm:#ffb45a;--glass:rgba(14,20,31,.52)}
.intro{position:fixed;z-index:200;inset:0;display:grid;place-content:center;justify-items:center;gap:24px;background:#030406;transition:opacity .7s cubic-bezier(.16,1,.3,1),visibility .7s}
.intro.is-done{opacity:0;visibility:hidden;pointer-events:none}.intro-word{display:flex;gap:.08em;font:600 clamp(48px,9vw,138px)/1 var(--display);letter-spacing:-.08em}.intro-word span{opacity:0;filter:blur(14px);transform:translateY(28px) scale(.92);animation:intro-letter .65s cubic-bezier(.16,1,.3,1) forwards}.intro-word span:nth-child(2){animation-delay:.08s}.intro-word span:nth-child(3){animation-delay:.16s}.intro-word span:nth-child(4){animation-delay:.24s}.intro-word span:nth-child(5){animation-delay:.32s;color:var(--blue)}.intro-word span:nth-child(6){animation-delay:.4s}.intro-line{width:min(330px,58vw);height:1px;overflow:hidden;background:rgba(255,255,255,.09)}.intro-line i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--blue),#9cdfff,var(--warm));transform:scaleX(0);transform-origin:left;animation:intro-line 1.2s cubic-bezier(.16,1,.3,1) .35s forwards}.intro small{color:rgba(242,243,245,.38);font:9px var(--mono);letter-spacing:.24em}@keyframes intro-letter{to{opacity:1;filter:blur(0);transform:none}}@keyframes intro-line{to{transform:scaleX(1)}}
.hero-copy{animation:none;opacity:1;transform:none}.hero-line{display:block}.hero-line.accent{color:var(--titanium)}.letter{display:inline-block;opacity:0;filter:blur(12px);transform:translateY(34px) scale(.94);will-change:transform,opacity,filter}.page-ready .letter{animation:letter-in .72s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(1.7s + var(--letter-index)*.028s)}@keyframes letter-in{to{opacity:1;filter:blur(0);transform:none}}.hero-copy>.kicker,.hero-copy>.lead,.hero-actions{opacity:0;filter:blur(8px);transform:translateY(16px)}.page-ready .hero-copy>.kicker,.page-ready .hero-copy>.lead,.page-ready .hero-actions{animation:copy-in .8s cubic-bezier(.16,1,.3,1) forwards}.page-ready .hero-copy>.kicker{animation-delay:1.55s}.page-ready .hero-copy>.lead{animation-delay:2.35s}.page-ready .hero-actions{animation-delay:2.55s}@keyframes copy-in{to{opacity:1;filter:blur(0);transform:none}}
.hero-media::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 76% 45%,rgba(40,184,255,.12),transparent 24%),radial-gradient(circle at 66% 76%,rgba(255,180,90,.1),transparent 20%);mix-blend-mode:screen;pointer-events:none}.spatial-ui{position:absolute;z-index:2;inset:0;pointer-events:none;perspective:1200px}.spatial-ring{position:absolute;right:7%;top:19%;width:min(43vw,680px);aspect-ratio:1;border:1px solid rgba(130,203,255,.12);border-radius:50%;transform:rotateX(68deg) rotateZ(-12deg);box-shadow:inset 0 0 80px rgba(40,184,255,.025);animation:ring-spin 22s linear infinite}.ring-b{right:13%;top:27%;width:min(30vw,470px);border-color:rgba(255,180,90,.1);animation-direction:reverse;animation-duration:15s}@keyframes ring-spin{to{rotate:360deg}}.spatial-card{position:absolute;width:190px;padding:14px 15px;border:1px solid rgba(187,216,255,.18);border-radius:12px;background:linear-gradient(145deg,rgba(17,25,42,.66),rgba(5,8,15,.4));box-shadow:inset 0 1px rgba(255,255,255,.05),0 22px 50px rgba(0,0,0,.24);backdrop-filter:blur(14px);transform:perspective(800px) rotateY(-9deg)}.spatial-card small,.spatial-card span{font:7px var(--mono);color:rgba(242,243,245,.44)}.spatial-card strong{display:block;margin:8px 0 12px;font:600 12px var(--display)}.spatial-card span i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 12px var(--blue)}.card-video{right:5%;top:23%;animation:card-float 5s ease-in-out infinite alternate}.card-ai{right:36%;bottom:19%;transform:perspective(800px) rotateY(10deg);animation:card-float 6s ease-in-out -2s infinite alternate}.card-ai span i{background:var(--warm);box-shadow:0 0 12px var(--warm)}@keyframes card-float{to{translate:0 -12px}}
.ai-lab{position:relative;display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(50px,8vw,130px);align-items:center;overflow:hidden;padding:clamp(110px,13vw,190px) clamp(22px,7vw,120px);background:radial-gradient(circle at 75% 48%,rgba(40,184,255,.11),transparent 28%),radial-gradient(circle at 20% 80%,rgba(255,180,90,.08),transparent 23%),#050608}.ai-lab::before{content:"";position:absolute;inset:0;opacity:.42;background:linear-gradient(90deg,rgba(118,181,255,.055) 1px,transparent 1px),linear-gradient(rgba(118,181,255,.04) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 68% 50%,#000,transparent 68%)}.lab-copy,.lab-stage{position:relative;z-index:2}.lab-copy h2{margin:0;font:600 clamp(47px,5.6vw,88px)/.92 var(--display);letter-spacing:-.065em}.lab-copy h2 span{color:var(--titanium)}.lab-copy>p:not(.kicker){max-width:550px;margin:28px 0 0;color:rgba(242,243,245,.62);font-size:17px;line-height:1.7}.lab-steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:45px;border-top:1px solid var(--line-dark)}.lab-steps span{display:grid;gap:7px;padding:14px 4px;color:rgba(242,243,245,.5);font:8px var(--mono)}.lab-steps i{color:var(--blue);font-style:normal}.lab-stage{overflow:hidden;border:1px solid rgba(188,216,255,.17);border-radius:16px;background:#090c11;box-shadow:0 55px 120px rgba(0,0,0,.42),0 0 80px rgba(40,184,255,.06);transform:perspective(1400px) rotateY(-4deg)}.lab-stage video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.8) contrast(1.06)}.lab-hud{position:absolute;top:14px;right:14px;left:14px;display:flex;gap:16px;align-items:center;padding:10px 12px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:rgba(3,5,8,.48);backdrop-filter:blur(10px);color:rgba(242,243,245,.48);font:7px var(--mono)}.lab-hud b{margin-left:auto;color:#7ce5c7;font-weight:500}.lab-scan{position:absolute;top:0;right:0;left:0;height:1px;background:linear-gradient(90deg,transparent,var(--blue),var(--warm),transparent);box-shadow:0 0 18px var(--blue);animation:scan 4.8s ease-in-out infinite}@keyframes scan{0%,100%{top:4%;opacity:0}12%{opacity:1}78%{opacity:.8}90%{top:96%;opacity:0}}
.product{position:relative;overflow:hidden;background:radial-gradient(circle at 20% 55%,rgba(40,184,255,.12),transparent 26%),radial-gradient(circle at 82% 34%,rgba(255,180,90,.07),transparent 24%),#050608}.product-art{box-shadow:0 48px 110px rgba(0,0,0,.45),0 0 80px rgba(40,184,255,.06);transform:perspective(1400px) rotateY(5deg)}.product-signal{display:flex;align-items:center;gap:5px;height:46px;margin:0 0 30px}.product-signal i{width:5px;height:var(--h,35%);border-radius:999px;background:linear-gradient(var(--blue),#a8e9ff);animation:signal 1.2s ease-in-out infinite alternate}.product-signal i:nth-child(2n){--h:75%;animation-delay:-.3s}.product-signal i:nth-child(3n){--h:48%;animation-delay:-.6s}.product-signal i:nth-child(5n){--h:92%;animation-delay:-.9s}@keyframes signal{to{transform:scaleY(.55);opacity:.55}}
@media(max-width:980px){.spatial-card{display:none}.ai-lab{grid-template-columns:1fr}.lab-stage{transform:none}.spatial-ring{right:-18%;top:33%;width:78vw}.ring-b{right:-3%;top:39%;width:56vw}}
@media(max-width:680px){.intro-word{font-size:58px}.spatial-ring{top:47%;right:-30%;width:110vw}.ring-b{top:53%;right:-5%;width:76vw}.ai-lab{padding:100px 20px}.lab-copy h2{font-size:clamp(46px,13vw,65px)}.lab-copy>p:not(.kicker){font-size:14px}.lab-steps{grid-template-columns:repeat(2,1fr)}.lab-stage{border-radius:12px}.page-ready .letter{animation-delay:calc(1.55s + var(--letter-index)*.022s)}}
@media(prefers-reduced-motion:reduce){.intro{display:none}.letter,.hero-copy>.kicker,.hero-copy>.lead,.hero-actions{opacity:1;filter:none;transform:none}.spatial-ring,.spatial-card,.lab-scan,.product-signal i{animation:none}.lab-stage,.product-art{transform:none}}

/* Layered motion system */
.page-progress{position:fixed;z-index:180;top:0;right:0;left:0;height:2px;background:linear-gradient(90deg,var(--blue),#a9e8ff 60%,var(--warm));box-shadow:0 0 18px rgba(40,184,255,.65);transform:scaleX(var(--page-progress,0));transform-origin:left;pointer-events:none}.cursor-aura{position:fixed;z-index:90;top:0;left:0;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.075),rgba(40,184,255,.025) 34%,transparent 68%);opacity:0;transform:translate(calc(var(--cursor-x,0px) - 50%),calc(var(--cursor-y,0px) - 50%));pointer-events:none;mix-blend-mode:screen;transition:opacity .35s}.cursor-aura.is-active{opacity:1}.hero-media video{transform:translate3d(var(--hero-media-x,0),var(--hero-media-y,0),0) scale(1.025);transition:transform .5s cubic-bezier(.2,.8,.2,1)}.spatial-ui{transform:translate3d(var(--hero-ui-x,0),var(--hero-ui-y,0),0);transition:transform .5s cubic-bezier(.2,.8,.2,1)}.channel,.project{isolation:isolate}.channel::before,.project::before{content:"";position:absolute;z-index:0;top:var(--my,50%);left:var(--mx,50%);width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.12),transparent 66%);opacity:0;transform:translate(-50%,-50%);pointer-events:none;transition:opacity .3s}.channel:hover::before,.project:hover::before{opacity:1}.channel>*{position:relative;z-index:1}.channel img{transition:transform .45s cubic-bezier(.16,1,.3,1),filter .45s}.channel:hover img{transform:translateY(-8px) rotate(-5deg) scale(1.08);filter:drop-shadow(0 0 18px rgba(40,184,255,.35))}.channel>b{transition:transform .35s,color .35s}.channel:hover>b{color:var(--blue);transform:translate(4px,-4px)}.project{position:relative;transform:translateY(var(--parallax,0));transition:transform .18s linear,box-shadow .4s}.project:hover{box-shadow:0 35px 80px rgba(17,19,24,.15)}.project img{transform:scale(1.04) translateY(var(--parallax,0));transition:transform .8s cubic-bezier(.16,1,.3,1),filter .5s}.project:hover img{transform:scale(1.085) translateY(var(--parallax,0));filter:saturate(1)}.lab-stage{translate:0 var(--parallax,0);transition:translate .18s linear,transform .5s cubic-bezier(.16,1,.3,1)}.lab-stage:hover{transform:perspective(1400px) rotateY(-1deg) rotateX(1deg) scale(1.012)}.product-art{translate:0 var(--parallax,0);transition:translate .18s linear,transform .55s cubic-bezier(.16,1,.3,1)}.product-art:hover{transform:perspective(1400px) rotateY(1deg) scale(1.018)}.reveal:nth-child(2){transition-delay:.07s}.reveal:nth-child(3){transition-delay:.14s}.reveal:nth-child(4){transition-delay:.21s}.section-intro.reveal h2,.lab-copy.reveal h2,.product-copy.reveal h2{clip-path:inset(0 0 100% 0);transform:translateY(20px);transition:clip-path 1s cubic-bezier(.16,1,.3,1) .12s,transform 1s cubic-bezier(.16,1,.3,1) .12s}.section-intro.reveal.is-visible h2,.lab-copy.reveal.is-visible h2,.product-copy.reveal.is-visible h2{clip-path:inset(0);transform:none}.brands{overflow:hidden}.brands>div{display:flex;width:max-content;gap:clamp(42px,6vw,100px);animation:brand-marquee 26s linear infinite}.brands>div span{min-width:max-content}.brands:hover>div{animation-play-state:paused}@keyframes brand-marquee{to{transform:translateX(-50%)}}.video-frame{position:relative}.video-frame::after{content:"";position:absolute;inset:0;border:1px solid transparent;border-radius:inherit;background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,.55),transparent 75%) border-box;mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);mask-composite:exclude;transform:translateX(-120%);animation:frame-glint 6s ease-in-out infinite}@keyframes frame-glint{45%,100%{transform:translateX(120%)}}.profile{transform-style:preserve-3d;transition:transform .6s cubic-bezier(.16,1,.3,1),box-shadow .6s}.profile:hover{transform:perspective(1000px) rotateX(2deg) rotateY(-3deg) translateY(-6px);box-shadow:0 45px 100px rgba(17,19,24,.15)}.profile>strong{transition:transform .65s cubic-bezier(.16,1,.3,1)}.profile:hover>strong{transform:translateZ(30px) translateX(8px)}
@media(max-width:680px),(pointer:coarse){.cursor-aura{display:none}.hero-media video,.spatial-ui{transform:none}.project,.project img,.lab-stage,.product-art{translate:none;transform:none}.channel::before,.project::before{display:none}.brands>div{animation-duration:20s}.profile:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.page-progress,.cursor-aura{display:none}.brands>div,.video-frame::after{animation:none}.channel img,.project,.project img,.lab-stage,.product-art,.profile,.profile>strong{transition:none;transform:none;translate:none}}

/* Patch-inspired scroll-directed scenes and strict light/dark rhythm */
.scroll-hero{height:155svh;min-height:0}.hero-sticky{position:sticky;top:0;height:100svh;overflow:hidden;background:#050608}.scroll-hero .hero-copy{transform:translate3d(0,var(--hero-copy-y,0),0);opacity:var(--hero-copy-opacity,1);transition:transform .08s linear,opacity .08s linear}.scroll-hero .hero-media video{scale:var(--hero-video-scale,1);transition:transform .5s cubic-bezier(.2,.8,.2,1),scale .08s linear}.scroll-hero .hero-shade{opacity:var(--hero-shade-opacity,1);transition:opacity .08s linear}.scroll-hero .spatial-ui{opacity:calc(1 - var(--scene-progress,0));transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .08s linear}.scroll-hero::after{content:"";position:absolute;z-index:8;right:0;bottom:0;left:0;height:18vh;background:linear-gradient(transparent,#f2f3f5);opacity:var(--scene-progress,0);pointer-events:none}
.social.light{color:var(--graphite);background:linear-gradient(145deg,#f2f3f5,#e9edf1)}.social.light .kicker{color:#167cad}.social.light .section-intro h2 span{color:#68717d}.social.light .section-intro>p:last-child{color:rgba(17,19,24,.62)}.social.light .channel-grid{border-color:var(--line-light);background:var(--line-light)}.social.light .channel{color:var(--graphite);background:#f7f8fa}.social.light .channel:hover{background:#fff}.social.light .channel-no,.social.light .channel p,.social.light .channel>b{color:rgba(17,19,24,.46)}.social.light .channel img{filter:invert(1)}.social.light .channel:hover img{filter:invert(1) drop-shadow(0 0 15px rgba(40,184,255,.28))}
.about.dark{color:var(--white);background:radial-gradient(circle at 72% 38%,rgba(40,184,255,.1),transparent 28%),#06070a}.about.dark .kicker{color:var(--blue)}.about.dark .lead{color:rgba(242,243,245,.62)}.about.dark .profile{color:var(--graphite)}.about.dark::after{content:"";position:absolute;right:0;bottom:0;left:0;height:1px;background:rgba(255,255,255,.1)}
.scroll-scene{position:relative;height:180svh;min-height:0;padding:0!important}.scene-sticky{position:sticky;top:0;display:grid;min-height:100svh;align-items:center;overflow:hidden;padding:clamp(100px,10vw,150px) clamp(22px,7vw,120px)}.showreel .scene-sticky{grid-template-columns:.72fr 1.28fr;gap:clamp(50px,8vw,120px)}.ai-lab .scene-sticky{grid-template-columns:.78fr 1.22fr;gap:clamp(50px,8vw,130px)}.product .scene-sticky{grid-template-columns:1.1fr .9fr;gap:clamp(50px,8vw,120px)}.scroll-scene .section-intro,.scroll-scene .lab-copy,.scroll-scene .product-copy{transform:translateX(var(--scene-copy-x,0));opacity:var(--scene-copy-opacity,1);transition:transform .08s linear,opacity .08s linear}.showreel .video-frame{clip-path:inset(var(--scene-clip,11%) round 18px);transform:scale(var(--scene-scale,.84));transform-origin:center;transition:clip-path .08s linear,transform .08s linear}.ai-lab .lab-stage{translate:var(--scene-shift,90px) 0;transform:perspective(1400px) rotateY(var(--scene-rotate,5deg)) scale(var(--scene-scale,.84));transition:translate .08s linear,transform .08s linear}.product .product-art{translate:calc(var(--scene-shift,90px) * -1) 0;transform:perspective(1400px) rotateY(var(--scene-rotate,5deg)) scale(var(--scene-scale,.84));transition:translate .08s linear,transform .08s linear}.scroll-scene::after{content:"SCROLL / EXPLORE";position:absolute;z-index:4;right:18px;top:50%;color:rgba(128,140,154,.42);font:7px var(--mono);letter-spacing:.18em;writing-mode:vertical-rl;transform:translateY(-50%)}
.showreel.scroll-scene::before,.work::before,.brands::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 70% 35%,rgba(40,184,255,.055),transparent 24%)}.showreel.scroll-scene{background:#f2f3f5}.showreel.scroll-scene::after{color:rgba(17,19,24,.35)}.ai-lab.scroll-scene{background:radial-gradient(circle at 75% 48%,rgba(40,184,255,.11),transparent 28%),radial-gradient(circle at 20% 80%,rgba(255,180,90,.08),transparent 23%),#050608}.product.scroll-scene{background:radial-gradient(circle at 20% 55%,rgba(40,184,255,.12),transparent 26%),radial-gradient(circle at 82% 34%,rgba(255,180,90,.07),transparent 24%),#050608}
@media(max-width:980px){.showreel .scene-sticky,.ai-lab .scene-sticky,.product .scene-sticky{grid-template-columns:1fr}.product .product-art{order:2}.product .product-copy{order:1}}
@media(max-width:680px),(pointer:coarse){.scroll-hero{height:auto;min-height:900px}.hero-sticky{position:relative;height:900px}.scroll-hero .hero-copy,.scroll-hero .hero-media video,.scroll-hero .hero-shade,.scroll-hero .spatial-ui{opacity:1;transform:none;scale:1}.scroll-hero::after{display:none}.scroll-scene{height:auto;min-height:0}.scene-sticky{position:relative;min-height:0;padding:92px 20px}.showreel .scene-sticky,.ai-lab .scene-sticky,.product .scene-sticky{grid-template-columns:1fr}.scroll-scene .section-intro,.scroll-scene .lab-copy,.scroll-scene .product-copy{opacity:1;transform:none}.showreel .video-frame{clip-path:none;transform:none}.ai-lab .lab-stage,.product .product-art{translate:none;transform:none}.scroll-scene::after{display:none}}
@media(prefers-reduced-motion:reduce){.scroll-hero{height:auto}.hero-sticky,.scene-sticky{position:relative}.scroll-scene{height:auto}.scroll-hero .hero-copy,.scroll-hero .hero-media video,.scroll-hero .hero-shade,.scroll-hero .spatial-ui,.scroll-scene .section-intro,.scroll-scene .lab-copy,.scroll-scene .product-copy{opacity:1;transform:none;scale:1}.showreel .video-frame{clip-path:none;transform:none}.ai-lab .lab-stage,.product .product-art{translate:none;transform:none}}
.product .product-art{translate:var(--scene-shift-neg,-90px) 0}
@media(max-width:680px),(pointer:coarse){.product .product-art{translate:none}}
@media(prefers-reduced-motion:reduce){.product .product-art{translate:none}}

/* Restored signature social composition */
.social-layout-v3{display:grid;grid-template-columns:minmax(260px,.78fr) minmax(420px,1.2fr) minmax(300px,.82fr);gap:clamp(24px,3vw,52px);align-items:center;max-width:1500px;margin:auto}.social-copy-v3 h2{margin:0;font:600 clamp(48px,4.8vw,82px)/.9 var(--display);letter-spacing:-.065em}.social-copy-v3 h2 span{color:#68717d}.social-copy-v3>p:not(.kicker){max-width:390px;margin:26px 0 34px;color:rgba(17,19,24,.62);font-size:16px;line-height:1.7}.dark-btn{color:var(--white);background:var(--graphite)}.social-scene{position:relative;min-height:650px;perspective:1300px;transform:translate3d(var(--scene-x,0),var(--scene-y,0),0) rotateX(var(--scene-rx,0)) rotateY(var(--scene-ry,0));transition:transform .45s cubic-bezier(.2,.8,.2,1)}.social-scene::before{content:"";position:absolute;inset:13% 7%;border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.15),transparent 64%);filter:blur(14px)}.social-scene>img{position:absolute;z-index:3;top:50%;left:50%;width:160%;max-width:none;transform:translate(-50%,-50%);filter:drop-shadow(0 35px 45px rgba(17,19,24,.18)) saturate(.82)}.scene-orbit{position:absolute;z-index:2;inset:13%;border:1px solid rgba(17,19,24,.15);border-radius:50%;transform:rotateX(68deg) rotateZ(-14deg);animation:social-orbit 18s linear infinite}.scene-orbit::before{content:"";position:absolute;top:11%;left:14%;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 18px var(--blue)}.scene-orbit.orbit-two{inset:26%;border-color:rgba(255,180,90,.22);animation-direction:reverse;animation-duration:13s}.scene-orbit.orbit-two::before{background:var(--warm);box-shadow:0 0 18px var(--warm)}@keyframes social-orbit{to{rotate:360deg}}.scene-chip{position:absolute;z-index:5;padding:10px 12px;border:1px solid rgba(17,19,24,.14);border-radius:9px;color:rgba(17,19,24,.66);background:rgba(247,249,251,.78);box-shadow:0 18px 35px rgba(17,19,24,.1);backdrop-filter:blur(14px);font:8px var(--mono);animation:chip-float 4.6s ease-in-out infinite alternate}.chip-review{top:12%;left:2%}.chip-video{right:0;bottom:19%;animation-delay:-1.5s}.chip-ai{bottom:8%;left:9%;animation-delay:-3s}@keyframes chip-float{to{translate:0 -13px;rotate:2deg}}.social-stack{display:grid;gap:11px}.social-card{position:relative;isolation:isolate;display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:15px;align-items:center;min-height:120px;overflow:hidden;padding:15px 17px;border:1px solid rgba(17,19,24,.12);border-radius:12px;background:rgba(255,255,255,.64);transition:transform .3s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}.social-card::before{content:"";position:absolute;z-index:-1;top:var(--my,50%);left:var(--mx,50%);width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.18),transparent 67%);opacity:0;transform:translate(-50%,-50%);transition:opacity .3s}.social-card:hover{z-index:2;border-color:rgba(40,184,255,.35);box-shadow:0 22px 52px rgba(17,19,24,.12);transform:translateX(-8px)}.social-card:hover::before{opacity:1}.social-card>img{width:28px;height:28px;justify-self:center}.social-card>span{display:grid;gap:5px;min-width:0}.social-card small{color:#167cad;font:8px var(--mono)}.social-card strong{font:600 17px var(--display)}.social-card em{color:rgba(17,19,24,.5);font-size:11px;font-style:normal}.social-card>b{align-self:start;color:rgba(17,19,24,.42);font:14px var(--mono)}

/* Knowledge-rich 3D creator map */
.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:46px;background:rgba(242,243,245,.12);border:1px solid rgba(242,243,245,.12)}.about-stats>div{display:grid;gap:7px;padding:22px 14px;background:#080a0e}.about-stats strong{font:600 clamp(27px,3vw,44px) var(--display);letter-spacing:-.06em}.about-stats span{color:rgba(242,243,245,.45);font:8px var(--mono);line-height:1.4}.knowledge-map{position:relative;min-height:650px;overflow:hidden;border:1px solid rgba(186,211,255,.16);border-radius:18px;background:radial-gradient(circle at 50% 50%,rgba(40,184,255,.13),transparent 24%),linear-gradient(145deg,#0d121b,#07090e);box-shadow:inset 0 1px rgba(255,255,255,.05),0 40px 100px rgba(0,0,0,.3);transform:translate3d(var(--map-x,0),var(--map-y,0),0);transition:transform .5s cubic-bezier(.2,.8,.2,1)}.knowledge-map::before{content:"";position:absolute;inset:0;opacity:.4;background:linear-gradient(90deg,rgba(116,183,255,.07) 1px,transparent 1px),linear-gradient(rgba(116,183,255,.055) 1px,transparent 1px);background-size:52px 52px;mask-image:radial-gradient(circle,#000,transparent 76%)}.knowledge-map svg{position:absolute;z-index:1;inset:0;width:100%;height:100%}.knowledge-map path{fill:none;stroke:rgba(111,194,255,.24);stroke-width:1.5;stroke-dasharray:6 8;animation:knowledge-flow 18s linear infinite}@keyframes knowledge-flow{to{stroke-dashoffset:-280}}.knowledge-core{position:absolute;z-index:3;top:50%;left:50%;display:grid;width:170px;aspect-ratio:1;place-content:center;justify-items:center;border:1px solid rgba(127,205,255,.34);border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.23),rgba(8,12,18,.92) 66%);box-shadow:0 0 70px rgba(40,184,255,.13);transform:translate(-50%,-50%);animation:core-breathe 4s ease-in-out infinite}.knowledge-core i{width:9px;height:9px;margin-bottom:15px;border-radius:50%;background:var(--blue);box-shadow:0 0 22px var(--blue)}.knowledge-core strong{font:600 23px var(--display)}.knowledge-core span{margin-top:6px;color:rgba(242,243,245,.42);font:7px var(--mono)}@keyframes core-breathe{50%{scale:1.05;box-shadow:0 0 90px rgba(40,184,255,.2)}}.knowledge-node{position:absolute;z-index:4;width:210px;padding:17px;border:1px solid rgba(186,211,255,.15);border-radius:12px;background:rgba(10,15,23,.76);backdrop-filter:blur(16px);transition:transform .4s,border-color .4s,background .4s}.knowledge-node:hover{z-index:6;border-color:rgba(40,184,255,.45);background:rgba(13,22,34,.92);transform:translateY(-8px) scale(1.025)}.knowledge-node small{color:var(--blue);font:8px var(--mono)}.knowledge-node strong{display:block;margin:7px 0;font:600 17px var(--display)}.knowledge-node p{margin:0;color:rgba(242,243,245,.48);font-size:11px;line-height:1.5}.node-video{top:8%;left:5%}.node-review{top:7%;right:4%}.node-edit{bottom:8%;left:5%}.node-tools{right:4%;bottom:7%}

/* Monochrome logo cloud with a real blurred edge mask */
.brands{position:relative;overflow:hidden}.brands::after,.brands::before{content:"";position:absolute;z-index:3;top:0;bottom:0;width:15%;pointer-events:none;backdrop-filter:blur(8px)}.brands::before{left:0;background:linear-gradient(90deg,#f2f3f5 20%,rgba(242,243,245,.82),transparent)}.brands::after{right:0;background:linear-gradient(270deg,#f2f3f5 20%,rgba(242,243,245,.82),transparent)}.brands .logo-cloud{display:flex;width:max-content;gap:clamp(70px,9vw,150px);align-items:center;padding:12px 8vw;animation:logo-cloud-move 28s linear infinite;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}.logo-cloud img{width:auto;height:clamp(24px,2.3vw,38px);max-width:145px;object-fit:contain;opacity:.62;filter:grayscale(1);transition:opacity .3s,transform .3s,filter .3s}.logo-cloud img:hover{opacity:1;filter:grayscale(1);transform:scale(1.08)}@keyframes logo-cloud-move{to{transform:translateX(-50%)}}.brands:hover .logo-cloud{animation-play-state:paused}
@media(max-width:1120px){.social-layout-v3{grid-template-columns:minmax(250px,.8fr) minmax(420px,1.2fr)}.social-stack{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}.social-scene{min-height:540px}.knowledge-node{width:180px}}
@media(max-width:680px){.social-layout-v3{grid-template-columns:1fr}.social-scene{min-height:390px}.social-scene>img{width:135%}.social-stack{grid-template-columns:1fr}.scene-chip{font-size:7px}.about-stats{grid-template-columns:1fr}.knowledge-map{min-height:auto;padding:24px}.knowledge-map svg,.knowledge-core{display:none}.knowledge-node{position:relative;inset:auto!important;width:auto;margin-bottom:10px}.knowledge-node:last-child{margin-bottom:0}.brands::before,.brands::after{width:21%;backdrop-filter:blur(6px)}.brands .logo-cloud{gap:70px}.logo-cloud img{height:25px}}
@media(prefers-reduced-motion:reduce){.scene-orbit,.scene-chip,.knowledge-map path,.knowledge-core,.brands .logo-cloud{animation:none}.social-scene,.knowledge-map{transform:none}}

/* Stability pass: content remains visible without JS and scroll scenes do not create dead space. */
.reveal{opacity:1;filter:none;transform:none}
.reveal.is-pending{opacity:0;filter:blur(8px);transform:translateY(24px)}
.reveal.is-visible{opacity:1;filter:none;transform:none}
.scroll-hero{height:125svh}
.scroll-hero,.scroll-scene{overflow:visible!important}
.scroll-scene{height:125svh}
.scroll-scene{display:block!important;width:100%}
.scene-sticky{overflow:hidden}
.logo-cloud .wordmark{display:inline-flex;align-items:center;min-width:max-content;color:rgba(17,19,24,.68);font:600 clamp(20px,2vw,32px) var(--display);letter-spacing:-.055em}.logo-cloud .wordmark.canon{font-family:Georgia,serif;font-style:italic}
[id]{scroll-margin-top:84px}
.lab-toggle{display:grid;width:25px;aspect-ratio:1;place-items:center;margin-left:-7px;padding:0;border:1px solid rgba(242,243,245,.16);border-radius:6px;color:rgba(242,243,245,.72);background:rgba(255,255,255,.04);font:8px var(--mono);cursor:pointer}.lab-toggle:hover,.lab-toggle:focus-visible{color:#fff;border-color:rgba(40,184,255,.5)}.lab-toggle[aria-pressed=true]{color:var(--blue)}
@media(max-width:680px),(pointer:coarse){.scroll-hero,.scroll-scene{height:auto}}
@media(prefers-reduced-motion:reduce){.scroll-hero,.scroll-scene{height:auto}}

/* Final audit: mobile geometry and a product story instead of a decorative app icon. */
html{overflow-x:clip}
.social{overflow:hidden}
.product-system{position:relative;min-height:clamp(430px,52vw,690px);padding:0;overflow:hidden;background:radial-gradient(circle at 58% 38%,rgba(40,184,255,.13),transparent 30%),linear-gradient(145deg,#0b1018,#05070b)}
.product-system::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(108,183,255,.045) 1px,transparent 1px),linear-gradient(rgba(108,183,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(#000,transparent 92%)}
.product-system-head{position:absolute;z-index:5;top:0;right:0;left:0;display:flex;align-items:center;gap:16px;height:46px;padding:0 17px;border-bottom:1px solid rgba(242,243,245,.1);background:rgba(4,7,11,.72);backdrop-filter:blur(14px);font:7px var(--mono)}
.product-system-head>span{display:flex;gap:6px}.product-system-head i{display:block;width:7px;height:7px;border-radius:50%;background:#ff6259}.product-system-head i:nth-child(2){background:#ffbe39}.product-system-head i:nth-child(3){background:#2dcc53}.product-system-head small{color:rgba(242,243,245,.48);letter-spacing:.12em}.product-system-head>b{margin-left:auto;color:#7ce5c7;font-weight:500}
.product-fcp{position:absolute;z-index:1;top:12%;left:2%;width:96%!important;filter:saturate(.7) brightness(.72);transform:perspective(1200px) rotateX(2deg) rotateY(-4deg) scale(.98);transform-origin:center;opacity:.92}
.product-app-card{position:absolute;z-index:4;right:5%;bottom:21%;display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:13px;align-items:center;width:min(390px,66%);padding:14px;border:1px solid rgba(121,205,255,.28);border-radius:13px;background:rgba(8,13,21,.8);box-shadow:0 26px 70px rgba(0,0,0,.5),0 0 50px rgba(40,184,255,.1);backdrop-filter:blur(18px)}
.product-app-card img{width:54px!important;border-radius:12px}.product-app-card span{display:grid;gap:5px}.product-app-card small{color:var(--blue);font:7px var(--mono);letter-spacing:.1em}.product-app-card strong{font:600 clamp(13px,1.3vw,18px) var(--display)}.product-app-card>b{display:grid;width:28px;aspect-ratio:1;place-items:center;border-radius:50%;color:#06110d;background:#7ce5c7;font-size:14px}
.product-timeline{position:absolute;z-index:3;right:4%;bottom:5%;width:92%!important;border:1px solid rgba(127,205,255,.22);border-radius:9px;background:#080c12;box-shadow:0 18px 45px rgba(0,0,0,.42);filter:saturate(.78)}

@media(max-width:680px){
  .nav{grid-template-columns:1fr auto;padding:9px 10px 9px 14px}.nav nav{display:none}.nav-cta{grid-column:auto}
  .hero-copy{padding-top:112px}
  .social-scene{overflow:hidden;border-radius:18px}.social-scene>img{width:128%}
  .about-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:1px}.about-stats>div{min-width:0;padding:18px 9px}.about-stats strong{font-size:25px}.about-stats span{font-size:6px}
  .product-system{min-height:450px}.product-fcp{top:16%;left:-19%;width:138%!important}.product-app-card{right:10px;bottom:83px;width:calc(100% - 20px);grid-template-columns:43px minmax(0,1fr) auto}.product-app-card img{width:43px!important}.product-timeline{right:10px;bottom:18px;width:calc(100% - 20px)!important}
}

.product-system:has(.product-demo){min-height:0;aspect-ratio:16/9;background:#050608}
.product-demo{display:block;width:100%;height:100%;object-fit:cover}
.product-toggle{position:absolute;z-index:5;right:14px;bottom:14px;display:grid;width:36px;aspect-ratio:1;place-items:center;padding:0;border:1px solid rgba(242,243,245,.2);border-radius:9px;color:rgba(242,243,245,.78);background:rgba(3,5,8,.7);backdrop-filter:blur(12px);font:9px var(--mono);cursor:pointer}.product-toggle:hover,.product-toggle:focus-visible{color:#fff;border-color:rgba(40,184,255,.55)}.product-toggle[aria-pressed=true]{color:var(--blue)}
@media(min-width:981px){.scene-sticky{align-items:start;padding-top:clamp(150px,17vh,180px)}}
@media(max-width:680px){.product-system:has(.product-demo){min-height:0;aspect-ratio:4/3}.product-demo{object-fit:cover}}

/* Editorial motion pass */
.social-scene .social-base{position:absolute;z-index:3;top:52%;left:50%;width:112%;max-width:none;transform:translate(-50%,-50%);filter:drop-shadow(0 34px 44px rgba(17,19,24,.16)) saturate(.88)}
.scene-prop{position:absolute;z-index:4;display:block;height:auto;pointer-events:none;will-change:transform;filter:drop-shadow(0 22px 26px rgba(17,19,24,.2))}
.prop-drone{top:19%;left:-7%;width:41%;animation:drone-flight 7.5s cubic-bezier(.45,.05,.55,.95) infinite}
.prop-headphones{bottom:12%;left:-4%;width:28%;animation:headphones-float 4.8s ease-in-out -1.4s infinite}
.prop-camera{top:25%;right:-5%;width:28%;animation:camera-float 5.4s ease-in-out -2.2s infinite}
.prop-phone{right:1%;bottom:9%;width:17%;animation:phone-float 4.2s ease-in-out -.8s infinite}
.social-scene>img.scene-prop{max-width:none;transform:none}
.social-scene>img.prop-drone{top:19%;right:auto;bottom:auto;left:-7%;width:41%}
.social-scene>img.prop-headphones{top:auto;right:auto;bottom:12%;left:-4%;width:28%}
.social-scene>img.prop-camera{top:25%;right:-5%;bottom:auto;left:auto;width:28%}
.social-scene>img.prop-phone{top:auto;right:1%;bottom:9%;left:auto;width:17%}
@keyframes drone-flight{0%,100%{transform:translate3d(-8px,5px,0) rotate(-3deg)}28%{transform:translate3d(20px,-15px,0) rotate(2deg)}62%{transform:translate3d(35px,3px,0) rotate(-1deg)}}
@keyframes headphones-float{0%,100%{transform:translate3d(0,5px,0) rotate(-4deg)}50%{transform:translate3d(9px,-14px,0) rotate(3deg)}}
@keyframes camera-float{0%,100%{transform:translate3d(0,7px,0) rotate(3deg)}50%{transform:translate3d(-12px,-12px,0) rotate(-2deg)}}
@keyframes phone-float{0%,100%{transform:translate3d(0,10px,0) rotate(5deg)}50%{transform:translate3d(-8px,-13px,0) rotate(-5deg)}}

.knowledge-core{width:190px;background:radial-gradient(circle,rgba(40,184,255,.2),rgba(8,12,18,.96) 69%);isolation:isolate}
.knowledge-core>img{position:relative;z-index:3;width:174px;height:174px;border:1px solid rgba(127,205,255,.34);border-radius:50%;object-fit:cover;object-position:50% 18%;filter:saturate(.78) contrast(1.04);mask-image:linear-gradient(#000 64%,transparent 96%)}
.knowledge-core>strong{position:absolute;z-index:5;bottom:30px;font-size:17px;letter-spacing:.01em;text-shadow:0 2px 18px #050608}
.knowledge-core>span:last-child{position:absolute;z-index:5;bottom:17px;margin:0;color:rgba(242,243,245,.54);font:6px var(--mono);letter-spacing:.08em}
.knowledge-pulse{position:absolute!important;z-index:1!important;inset:-1px;margin:0!important;border:1px solid rgba(40,184,255,.32);border-radius:50%;animation:portrait-pulse 3.8s ease-out infinite}
.knowledge-pulse.pulse-b{animation-delay:-1.9s}
@keyframes portrait-pulse{0%{scale:.78;opacity:0}22%{opacity:.65}100%{scale:1.55;opacity:0}}

.brands{padding-top:88px}
.brands .kicker{position:relative;z-index:6}
.brands::before,.brands::after{top:112px;backdrop-filter:blur(6px)}

.showreel.scroll-scene{height:auto!important}
.showreel .scene-sticky{position:relative;min-height:0;align-items:center;padding-top:clamp(95px,9vw,135px);padding-bottom:clamp(95px,9vw,135px)}
.showreel.scroll-scene::after{display:none}

.contact{padding-top:clamp(90px,9vw,140px)}
.contact-board{max-width:1320px;margin:0 auto;padding:22px 24px 0;overflow:hidden;border:1px solid rgba(187,216,255,.16);border-radius:18px;background:radial-gradient(circle at 50% 60%,rgba(40,184,255,.12),transparent 34%),linear-gradient(145deg,#0b1018,#06080c);box-shadow:inset 0 1px rgba(255,255,255,.05),0 40px 100px rgba(0,0,0,.3)}
.contact-board-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:rgba(242,243,245,.42);font:7px var(--mono);letter-spacing:.11em}.contact-board-top i{color:#7ce5c7;font-style:normal}.contact-board-top b{justify-self:end;font-weight:400}
.falling-word{display:flex;justify-content:center;margin:clamp(42px,6vw,86px) 0 clamp(32px,4vw,60px);font:600 clamp(64px,11.5vw,182px)/.76 var(--display);letter-spacing:-.09em}
.fall-char{display:inline-block;opacity:0;transform:translateY(-130px) rotate(var(--fall-rotate));transform-origin:50% 100%}
.contact-board.is-visible .fall-char{animation:fall-letter 1s cubic-bezier(.15,.86,.28,1.18) forwards;animation-delay:calc(var(--fall-index)*.055s)}
@keyframes fall-letter{0%{opacity:0;transform:translateY(-130px) rotate(var(--fall-rotate)) scale(.82)}68%{opacity:1;transform:translateY(8px) rotate(0deg) scale(1.02)}100%{opacity:1;transform:none}}
.contact-board-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(242,243,245,.12)}.contact-board-grid span{display:flex;gap:12px;padding:21px 12px;border-right:1px solid rgba(242,243,245,.12);color:rgba(242,243,245,.72);font:8px var(--mono);letter-spacing:.12em}.contact-board-grid span:last-child{border-right:0}.contact-board-grid small{color:var(--blue);font:inherit}
.contact-copy{max-width:1100px;margin:clamp(90px,10vw,150px) auto 0;text-align:center}.contact-copy>p:not(.kicker){color:rgba(242,243,245,.55)}.contact-copy>a{display:inline-block;margin-top:34px;padding-bottom:8px;border-bottom:1px solid rgba(242,243,245,.3);font:500 clamp(16px,2vw,26px) var(--mono)}.contact-copy>a b{color:var(--blue)}

@media(max-width:680px){
  .social-scene{min-height:440px}.social-scene .social-base{top:52%;width:105%}.social-scene>img.prop-drone{top:18%;left:-10%;width:45%}.social-scene>img.prop-headphones{bottom:15%;left:-7%;width:31%}.social-scene>img.prop-camera{top:27%;right:-8%;width:31%}.social-scene>img.prop-phone{right:0;bottom:12%;width:19%}
  .knowledge-map svg{display:none}.knowledge-core{position:relative;top:auto;left:auto;display:grid;margin:6px auto 32px;transform:none}.knowledge-node{position:relative;inset:auto!important}
  .brands{padding-top:78px}.brands::before,.brands::after{top:102px}
  .showreel .scene-sticky{padding-top:92px;padding-bottom:92px}
  .contact-board{padding:18px 14px 0}.contact-board-top{grid-template-columns:1fr auto}.contact-board-top i{display:none}.falling-word{margin:52px 0 42px;font-size:clamp(42px,13.2vw,58px)}.contact-board-grid{grid-template-columns:repeat(2,1fr)}.contact-board-grid span:nth-child(2){border-right:0}.contact-board-grid span:nth-child(-n+2){border-bottom:1px solid rgba(242,243,245,.12)}.contact-copy{margin-top:90px}
}
@media(prefers-reduced-motion:reduce){.scene-prop,.knowledge-pulse,.contact-board.is-visible .fall-char{animation:none}.fall-char{opacity:1;transform:none}}

/* 21st.dev-inspired 3D text roll and Tech2u system beams */
.text-roll-ready{perspective:900px}
.text-roll-ready .roll-word,.text-roll-ready .roll-char{color:inherit!important}
.roll-word{display:inline-block;white-space:nowrap}
.roll-char{display:inline-block;opacity:0;filter:blur(5px);transform:perspective(600px) translateY(.3em) rotateX(-92deg);transform-origin:50% 100%;will-change:transform,opacity,filter}
.reveal.is-visible .text-roll-ready .roll-char{animation:text-roll-in .64s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(.08s + var(--roll-index)*.026s)}
@keyframes text-roll-in{0%{opacity:0;filter:blur(5px);transform:perspective(600px) translateY(.3em) rotateX(-92deg)}62%{opacity:1;filter:blur(0);transform:perspective(600px) translateY(-.035em) rotateX(8deg)}100%{opacity:1;filter:blur(0);transform:none}}

.knowledge-map .beam-track{fill:none;stroke:rgba(111,194,255,.2);stroke-width:1.4;stroke-dasharray:6 8;animation:none}
.knowledge-map .beam-flow{fill:none;stroke:#28b8ff;stroke-width:3.2;stroke-linecap:round;stroke-dasharray:.085 .915;stroke-dashoffset:1;opacity:.96;filter:drop-shadow(0 0 7px rgba(40,184,255,.95));animation:tech-beam 2.9s linear infinite}
.knowledge-map .beam-2{animation-delay:-1.45s;animation-direction:reverse}.knowledge-map .beam-3{animation-delay:-2.1s}.knowledge-map .beam-4{animation-delay:-.72s;animation-direction:reverse}
@keyframes tech-beam{to{stroke-dashoffset:-1}}
.knowledge-node::after{content:"";position:absolute;top:17px;right:17px;width:5px;height:5px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 0 rgba(40,184,255,.45);animation:node-signal 2.9s ease-out infinite}.knowledge-node:nth-of-type(3)::after{animation-delay:-1.45s}.knowledge-node:nth-of-type(4)::after{animation-delay:-2.1s}.knowledge-node:nth-of-type(5)::after{animation-delay:-.72s}
@keyframes node-signal{0%,55%{opacity:.35;box-shadow:0 0 0 0 rgba(40,184,255,.38)}72%{opacity:1;box-shadow:0 0 0 9px rgba(40,184,255,0)}100%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.roll-char{opacity:1;filter:none;transform:none}.reveal.is-visible .text-roll-ready .roll-char,.knowledge-map .beam-flow,.knowledge-node::after{animation:none}.knowledge-map .beam-flow{display:none}}

/* Hero: 9-second intro followed by a bright, living idle state. */
.hero-media video{position:absolute;inset:0;transition:opacity .16s linear,transform .5s cubic-bezier(.2,.8,.2,1),scale .08s linear}
.hero-media #heroVideo{opacity:1}.hero-media .hero-idle{opacity:0}
.hero-media.is-idle #heroVideo{opacity:0}.hero-media.is-idle .hero-idle{opacity:1}
@media(prefers-reduced-motion:reduce){.hero-media #heroVideo,.hero-media .hero-idle{display:none}}

/* Premium motion + bilingual navigation */
body{overflow-x:clip}
.nav-actions{justify-self:end;display:flex;align-items:center;gap:7px}
.language-toggle{display:flex;align-items:center;gap:7px;height:37px;padding:0 11px;border:1px solid rgba(242,243,245,.14);border-radius:9px;color:rgba(242,243,245,.42);background:rgba(255,255,255,.025);font:500 8px var(--mono);cursor:pointer;transition:border-color .25s,color .25s,background .25s}
.language-toggle i{position:relative;width:22px;height:12px;border-radius:99px;background:rgba(242,243,245,.12);transition:background .25s}
.language-toggle i::after{content:"";position:absolute;top:2px;left:2px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 11px rgba(255,255,255,.35);transition:transform .35s cubic-bezier(.16,1,.3,1)}
html[lang="pl"] .language-toggle span:first-child,html[lang="en"] .language-toggle span:last-child{color:#fff}
html[lang="en"] .language-toggle i{background:rgba(40,184,255,.32)}
html[lang="en"] .language-toggle i::after{transform:translateX(10px);background:#9fe5ff}
.language-toggle:hover,.language-toggle:focus-visible{color:#fff;border-color:rgba(40,184,255,.42);background:rgba(40,184,255,.07)}
.nav-actions .nav-cta{display:flex;align-items:center;gap:8px}.nav-actions .nav-cta b{font-weight:400}

/* Intentional service cards: the robot is a reward for interaction, not decoration. */
.capabilities{position:relative;overflow:hidden;padding:clamp(110px,12vw,180px) clamp(22px,7vw,120px);background:radial-gradient(circle at 78% 18%,rgba(40,184,255,.11),transparent 24%),radial-gradient(circle at 12% 78%,rgba(255,180,90,.065),transparent 20%),#050608}
.capabilities::before{content:"";position:absolute;inset:0;opacity:.3;background:linear-gradient(90deg,rgba(118,181,255,.055) 1px,transparent 1px),linear-gradient(rgba(118,181,255,.04) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent)}
.capabilities-head,.capability-grid{position:relative;z-index:2}
.capabilities-head{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(320px,.62fr);gap:20px 9vw;align-items:end;max-width:1420px;margin:0 auto 72px}
.capabilities-head .kicker{grid-column:1/-1;margin-bottom:0}
.capabilities-head h2{margin:0;font:600 clamp(50px,6vw,94px)/.9 var(--display);letter-spacing:-.065em}
.capabilities-head h2 span{color:var(--titanium)}
.capabilities-head>p:last-child{max-width:490px;margin:0 0 6px;color:rgba(242,243,245,.55);font-size:16px;line-height:1.7}
.capability-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:1420px;margin:auto;border:1px solid rgba(188,216,255,.15);border-radius:18px;background:rgba(9,13,20,.76);box-shadow:0 50px 120px rgba(0,0,0,.3);perspective:1400px}
.capability-card{--card-rx:0deg;--card-ry:0deg;position:relative;isolation:isolate;min-height:410px;overflow:hidden;padding:28px 26px;border-right:1px solid rgba(188,216,255,.13);background:linear-gradient(155deg,rgba(255,255,255,.025),transparent 48%);transform:perspective(1000px) rotateX(var(--card-rx)) rotateY(var(--card-ry));transform-style:preserve-3d;transition:transform .32s cubic-bezier(.2,.8,.2,1),background .35s,border-color .35s}
.capability-card:first-child{border-radius:17px 0 0 17px}.capability-card:last-child{border-right:0;border-radius:0 17px 17px 0}
.capability-card::before{content:"";position:absolute;z-index:-1;top:var(--my,55%);left:var(--mx,55%);width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(40,184,255,.17),rgba(40,184,255,.04) 36%,transparent 70%);opacity:0;transform:translate(-50%,-50%);transition:opacity .35s}
.capability-card:hover{z-index:4;border-color:rgba(40,184,255,.3);background:linear-gradient(155deg,rgba(40,184,255,.075),rgba(255,255,255,.012) 50%)}
.capability-card:hover::before{opacity:1}
.capability-card small{display:block;color:rgba(242,243,245,.35);font:7px var(--mono);letter-spacing:.12em}
.capability-icon{display:grid;width:48px;aspect-ratio:1;place-items:center;margin:26px 0 70px;border:1px solid rgba(255,205,126,.25);border-radius:12px;color:#ffd995;background:rgba(255,180,90,.06);font:18px var(--mono);transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .3s}
.capability-card h3{position:relative;z-index:3;margin:0 0 13px;font:600 clamp(21px,1.7vw,29px)/1.05 var(--display);letter-spacing:-.04em;transform:translateZ(22px)}
.capability-card p{position:relative;z-index:3;max-width:270px;margin:0;color:rgba(242,243,245,.52);font-size:13px;line-height:1.65;transform:translateZ(18px)}
.capability-robot{position:absolute;z-index:2;right:-20%;bottom:-17%;width:78%;height:auto;opacity:0;filter:drop-shadow(0 30px 32px rgba(0,0,0,.55)) saturate(.72);transform:translate3d(52px,22px,42px) rotate(7deg) scale(.86);transform-origin:70% 80%;transition:opacity .45s,filter .55s,transform .68s cubic-bezier(.16,1,.3,1)}
.capability-card:first-child .capability-robot{right:-14%;bottom:0;width:88%}
.capability-card:hover .capability-robot,.capability-card:focus-within .capability-robot{opacity:.95;filter:drop-shadow(0 30px 38px rgba(0,0,0,.55)) saturate(.92);transform:translate3d(0,0,42px) rotate(0) scale(1)}
.capability-card:hover .capability-icon{border-color:rgba(40,184,255,.4);transform:translateY(-5px) rotate(-5deg)}

/* A short scroll journey: centered, continuously interpolated and immediately playable. */
.showreel.scroll-scene{height:150svh!important;min-height:0}
.showreel .scene-sticky{position:sticky;top:0;grid-template-columns:minmax(280px,.72fr) minmax(540px,1.28fr);gap:clamp(40px,7vw,110px);min-height:100svh;align-items:center!important;place-content:center;padding:clamp(110px,13vh,145px) clamp(22px,7vw,120px)!important}
.showreel .scene-sticky>*{min-width:0}
.showreel .video-frame{translate:0 var(--showreel-lift,34px);clip-path:inset(var(--scene-clip,5%) round 18px);transform:scale(var(--scene-scale,.76));transform-origin:center;box-shadow:0 calc(24px + 28px * var(--showreel-glow,0)) calc(70px + 45px * var(--showreel-glow,0)) rgba(17,19,24,calc(.12 + .1 * var(--showreel-glow,0))),0 0 calc(80px * var(--showreel-glow,0)) rgba(40,184,255,.1);transition:none;will-change:transform,clip-path,translate}
.showreel .video-frame::after{pointer-events:none}
.showreel .video-frame video{position:relative;z-index:1}
.lab-steps b{font:inherit}

/* Contact sentence enters as chosen words, preserving the quieter falling-letter board. */
.word-rise-ready{perspective:900px}
.rise-word{display:inline-block;opacity:0;filter:blur(9px);transform:translateY(.7em) rotateX(-65deg);transform-origin:50% 100%;will-change:transform,opacity,filter}
.contact-copy.is-visible .rise-word{animation:word-rise-in .78s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(.08s + var(--word-index)*.085s)}
.contact-board-grid b{font:inherit}
@keyframes word-rise-in{0%{opacity:0;filter:blur(9px);transform:translateY(.7em) rotateX(-65deg)}68%{opacity:1;filter:blur(0);transform:translateY(-.035em) rotateX(5deg)}100%{opacity:1;filter:blur(0);transform:none}}

@media(max-width:1120px){
  .capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .capability-card{border-bottom:1px solid rgba(188,216,255,.13)}.capability-card:nth-child(2){border-right:0}.capability-card:nth-child(n+3){border-bottom:0}
  .capability-card:first-child{border-radius:17px 0 0 0}.capability-card:nth-child(2){border-radius:0 17px 0 0}.capability-card:nth-child(3){border-radius:0 0 0 17px}.capability-card:last-child{border-radius:0 0 17px 0}
}
@media(max-width:980px){
  .showreel .scene-sticky{grid-template-columns:minmax(0,.72fr) minmax(460px,1.28fr);gap:34px;padding-right:32px!important;padding-left:32px!important}
}
@media(max-width:680px),(pointer:coarse){
  .nav-actions{gap:5px}.language-toggle{height:34px;padding:0 8px}.language-toggle span{font-size:7px}.nav-actions .nav-cta{padding:9px 10px}
  .capabilities{padding:96px 20px}.capabilities-head{grid-template-columns:1fr;margin-bottom:48px}.capabilities-head .kicker{grid-column:auto}.capabilities-head h2{font-size:clamp(46px,13vw,66px)}.capabilities-head>p:last-child{font-size:14px}
  .capability-grid{grid-template-columns:1fr}.capability-card{min-height:310px;border-right:0;border-bottom:1px solid rgba(188,216,255,.13)!important;border-radius:0!important;transform:none}.capability-card:first-child{border-radius:17px 17px 0 0!important}.capability-card:last-child{border-bottom:0!important;border-radius:0 0 17px 17px!important}
  .capability-icon{margin-bottom:54px}.capability-robot{right:-7%;bottom:-20%;width:58%;opacity:.3;transform:rotate(-3deg)}.capability-card:first-child .capability-robot{right:-6%;bottom:-11%;width:66%;opacity:.3}.capability-card:hover .capability-robot{opacity:.4;transform:rotate(-3deg)}
  .showreel.scroll-scene{height:auto!important}.showreel .scene-sticky{position:relative;grid-template-columns:1fr;min-height:0;padding:92px 20px!important}.showreel .video-frame{translate:none;clip-path:none;transform:none;box-shadow:0 24px 65px rgba(17,19,24,.14)}
}
@media(prefers-reduced-motion:reduce){
  .showreel.scroll-scene{height:auto!important}.showreel .scene-sticky{position:relative;min-height:0}.showreel .video-frame{translate:none;clip-path:none;transform:none}
  .capability-card,.capability-card:hover{transform:none}.capability-robot{display:none}.rise-word{opacity:1;filter:none;transform:none}.contact-copy.is-visible .rise-word{animation:none}
}

/* Contact is now a single focused CTA; the headline keeps the letter-by-letter roll. */
.contact-copy{margin:0 auto}
.contact-copy .text-roll-ready{max-width:1050px}

/* Hero cleanup: one anchored status dock appears after the cinematic intro. */
html[lang="en"] .hero-copy{width:min(1040px,58vw)}
html[lang="en"] .hero h1{font-size:clamp(54px,5.8vw,112px)}
.hero-dock{position:absolute;z-index:5;right:clamp(118px,11vw,230px);bottom:clamp(105px,13vh,145px);width:min(390px,calc(100vw - 40px));opacity:0;pointer-events:none;transform:translateY(22px) scale(.97);transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1)}
.hero-media.is-idle~.hero-dock{opacity:var(--hero-dock-opacity,1);pointer-events:auto;transform:none;transition-delay:.18s}
.hero-dock-card{min-height:176px;padding:22px 24px;border:1px solid rgba(184,214,255,.2);border-radius:18px;background:linear-gradient(145deg,rgba(18,27,45,.82),rgba(7,10,17,.72));box-shadow:inset 0 1px rgba(255,255,255,.055),0 30px 70px rgba(0,0,0,.34);backdrop-filter:blur(22px);transition:opacity .16s,transform .16s}
.hero-dock.is-switching .hero-dock-card{opacity:0;transform:translateY(7px)}
.hero-dock-top{display:flex;align-items:center;justify-content:space-between;color:rgba(242,243,245,.43);font:8px var(--mono);letter-spacing:.08em}
.hero-dock-top span{color:rgba(242,243,245,.72);font-size:15px}
.hero-dock-card>strong{display:flex;align-items:center;gap:13px;margin-top:28px;font:600 20px var(--display);letter-spacing:-.035em}
.hero-dock-card>strong i{display:block;width:10px;height:10px;border-radius:50%;background:#ffd590;box-shadow:0 0 22px rgba(255,190,98,.45)}
.hero-dock-card>p{margin:19px 0 0;color:rgba(242,243,245,.54);font-size:13px;line-height:1.55}
.hero-dock-controls{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:14px}
.hero-dock-controls>button{display:grid;width:38px;aspect-ratio:1;place-items:center;padding:0;border:1px solid rgba(187,216,255,.2);border-radius:50%;color:rgba(242,243,245,.65);background:rgba(6,9,15,.66);backdrop-filter:blur(14px);font:600 22px var(--display);cursor:pointer;transition:border-color .25s,color .25s,transform .25s}
.hero-dock-controls>button:hover,.hero-dock-controls>button:focus-visible{color:#fff;border-color:rgba(40,184,255,.55);transform:scale(1.06)}
.hero-dock-dots{display:flex;align-items:center;gap:7px;padding:0 2px}
.hero-dock-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(242,243,245,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);cursor:pointer;transition:background .25s,transform .25s}
.hero-dock-dots button.is-active{background:#ffd590;transform:scale(1.18)}
@media(max-width:980px){
  html[lang="en"] .hero-copy{width:min(720px,72vw)}
  .hero-dock{right:38px;bottom:115px;width:350px}
}
@media(max-width:680px){
  html[lang="en"] .hero-copy{width:auto}
  html[lang="en"] .hero h1{font-size:clamp(46px,12.7vw,56px)}
  .hero-dock{right:20px;bottom:115px;width:calc(100% - 40px)}
  .hero-dock-card{min-height:142px;padding:17px 18px}.hero-dock-card>strong{margin-top:20px;font-size:17px}.hero-dock-card>p{margin-top:13px;font-size:11px}
  .hero-dock-controls{margin-top:9px}.hero-dock-controls>button{width:34px}
}
@media(prefers-reduced-motion:reduce){
  .hero-dock{opacity:1;pointer-events:auto;transform:none}.hero-dock-card{transition:none}
}

/* The status card now reads as a compact three-dimensional deck, not a flat carousel. */
.hero-dock{isolation:isolate;perspective:1200px;transform-style:preserve-3d}
.hero-dock::before,.hero-dock::after{content:"";position:absolute;z-index:0;top:13px;left:18px;right:18px;height:150px;border:1px solid rgba(184,214,255,.24);border-radius:18px;background:radial-gradient(circle at 15% 31%,rgba(255,213,144,.72) 0 5px,transparent 6px),linear-gradient(90deg,transparent 12%,rgba(224,236,255,.12) 12% 56%,transparent 56%) 0 47%/100% 2px no-repeat,linear-gradient(145deg,rgba(27,39,62,.82),rgba(7,10,17,.66));box-shadow:0 24px 58px rgba(0,0,0,.35);filter:blur(2.4px);opacity:.68;pointer-events:none;transition:transform .7s cubic-bezier(.16,1,.3,1),opacity .45s}
.hero-dock::before{transform:translate3d(-105px,13px,-90px) rotateY(13deg) scale(.9)}
.hero-dock::after{transform:translate3d(105px,13px,-90px) rotateY(-13deg) scale(.9)}
.hero-dock-card,.hero-dock-controls{position:relative;z-index:2}
.hero-media.is-idle~.hero-dock:hover::before{transform:translate3d(-118px,10px,-76px) rotateY(15deg) scale(.91);opacity:.78}
.hero-media.is-idle~.hero-dock:hover::after{transform:translate3d(118px,10px,-76px) rotateY(-15deg) scale(.91);opacity:.78}
.language-changing [data-i18n],.language-changing [data-i18n-html]{opacity:.42;transition:opacity .11s ease}

/* Native interactive project folder — the same interaction without a framework payload. */
.folder-gallery{position:relative;min-height:720px;margin-top:70px;overflow:hidden;border:1px solid rgba(157,196,240,.18);border-radius:26px;color:#f2f3f5;background:radial-gradient(circle at 50% 72%,rgba(40,184,255,.13),transparent 28%),radial-gradient(circle at 15% 12%,rgba(255,190,110,.065),transparent 23%),linear-gradient(145deg,#0b1019,#05070b 70%);box-shadow:0 38px 100px rgba(17,19,24,.17)}
.folder-gallery::before{content:"";position:absolute;inset:0;opacity:.28;background:linear-gradient(90deg,rgba(157,196,240,.055) 1px,transparent 1px),linear-gradient(rgba(157,196,240,.04) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(transparent,#000 16%,#000 88%,transparent);pointer-events:none}
.folder-stage{position:relative;z-index:1;display:flex;width:min(1280px,100%);height:660px;align-items:flex-end;justify-content:center;margin:auto;perspective:1500px}
.folder-back{position:absolute;z-index:1;bottom:80px;width:360px;height:240px;border:1px solid rgba(255,255,255,.14);border-radius:0 24px 24px;background:linear-gradient(180deg,#252b35,#0a0d12 80%);box-shadow:inset 0 0 55px rgba(0,0,0,.72),0 38px 72px rgba(0,0,0,.5)}
.folder-back::before{content:"";position:absolute;top:-42px;left:-1px;width:142px;height:43px;border:1px solid rgba(255,255,255,.14);border-bottom:0;border-radius:16px 18px 0 0;background:linear-gradient(180deg,#252b35,#171c24)}
.folder-back i{position:absolute;inset:13px;border-radius:16px;background:#030405;box-shadow:inset 0 12px 26px rgba(0,0,0,.75)}
.folder-photos{position:absolute;z-index:2;inset:0;pointer-events:none}
.folder-photo{position:absolute;z-index:var(--stack);left:50%;bottom:108px;width:220px;aspect-ratio:.78;overflow:hidden;border:1px solid rgba(255,255,255,.22);border-radius:15px;background:#0b0e13;box-shadow:0 28px 58px rgba(0,0,0,.55);transform:translate3d(calc(-50% + var(--closed-x) + var(--drag-x,0px)),var(--drag-y,0px),0) rotate(var(--photo-rotate)) scale(.96);transform-origin:50% 100%;transition:transform .72s cubic-bezier(.16,1,.3,1),filter .5s,opacity .45s;touch-action:none;user-select:none}
.folder-photo img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.folder-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 52%,rgba(3,4,7,.92));pointer-events:none}
.folder-photo>div{position:absolute;z-index:2;right:16px;bottom:15px;left:16px;display:grid;gap:5px;pointer-events:none}
.folder-photo small{color:#87d8ff;font:7px var(--mono);letter-spacing:.1em}.folder-photo strong{font:600 16px var(--display);letter-spacing:-.035em}
.folder-gallery:not(.is-open) .folder-stage:hover .folder-photo{transform:translate3d(calc(-50% + var(--hover-x)),var(--drag-y,0px),0) translateY(-52px) rotate(var(--photo-rotate))}
.folder-front{position:absolute;z-index:4;bottom:62px;width:380px;height:188px;overflow:hidden;border:1px solid rgba(255,255,255,.19);border-radius:24px;color:#f2f3f5;background:linear-gradient(180deg,#292f39,#0b0e13 88%);box-shadow:inset 0 2px 12px rgba(255,255,255,.08),0 -24px 50px rgba(0,0,0,.48),0 32px 65px rgba(0,0,0,.42);transform-origin:50% 100%;cursor:pointer;transition:transform .62s cubic-bezier(.16,1,.3,1),opacity .35s}
.folder-front:hover,.folder-front:focus-visible{transform:translateY(9px) rotateX(-17deg)}
.folder-front::before{content:"";position:absolute;top:0;right:0;left:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent)}
.folder-shine{position:absolute;inset:-40% auto -40% -35%;width:38%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);transform:skewX(-18deg);transition:left .8s cubic-bezier(.16,1,.3,1)}
.folder-front:hover .folder-shine{left:105%}
.folder-front b{position:absolute;bottom:35px;left:50%;padding:11px 18px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(0,0,0,.52);box-shadow:inset 0 1px 9px rgba(0,0,0,.75);transform:translateX(-50%);font:500 10px var(--mono);letter-spacing:.04em}
.folder-close{position:absolute;z-index:8;right:32px;bottom:27px;padding:12px 16px;border:1px solid rgba(184,214,255,.18);border-radius:999px;color:rgba(242,243,245,.65);background:rgba(6,9,15,.62);backdrop-filter:blur(14px);font:500 8px var(--mono);letter-spacing:.09em;text-transform:uppercase;opacity:0;pointer-events:none;cursor:pointer;transform:translateY(12px);transition:opacity .35s,transform .45s,color .25s,border-color .25s}
.folder-close:hover,.folder-close:focus-visible{color:#fff;border-color:rgba(40,184,255,.52)}
.folder-hint{position:absolute;z-index:5;bottom:26px;left:50%;margin:0;color:rgba(242,243,245,.42);font:8px var(--mono);letter-spacing:.08em;text-transform:uppercase;transform:translateX(-50%);transition:opacity .35s}
.folder-gallery.is-open .folder-back,.folder-gallery.is-open .folder-front{opacity:0;pointer-events:none;transform:translateY(25px) scale(.94)}
.folder-gallery.is-open .folder-photos{pointer-events:auto}
.folder-gallery.is-open .folder-photo{pointer-events:auto;cursor:grab;transform:translate3d(calc(-50% + var(--open-x) + var(--drag-x,0px)),var(--drag-y,0px),30px) rotate(0) scale(1.03)}
.folder-gallery.is-open .folder-photo:hover,.folder-gallery.is-open .folder-photo:focus-visible{z-index:20;filter:saturate(1.12) brightness(1.04);transform:translate3d(calc(-50% + var(--open-x) + var(--drag-x,0px)),calc(-13px + var(--drag-y,0px)),65px) rotate(0) scale(1.08)}
.folder-gallery.is-open .folder-photo.is-dragging{z-index:30;cursor:grabbing;transition:none;transform:translate3d(calc(-50% + var(--open-x) + var(--drag-x,0px)),var(--drag-y,0px),90px) rotate(3deg) scale(1.09)}
.folder-gallery.is-open .folder-close{opacity:1;pointer-events:auto;transform:none}.folder-gallery.is-open .folder-hint{opacity:.78}

/* Each character now enters from the physical edge it appears to hold. */
@media(min-width:681px) and (pointer:fine){
  .capability-card:nth-child(1) .capability-robot{right:-3%;bottom:-2px;width:79%;transform:translate3d(0,58px,42px) scale(.9);transform-origin:50% 100%}
  .capability-card:nth-child(2) .capability-robot{right:auto;bottom:auto;top:4%;left:-15%;width:82%;transform:translate3d(-58px,0,42px) rotate(-5deg) scale(.9);transform-origin:0 50%}
  .capability-card:nth-child(3) .capability-robot{right:-16%;bottom:auto;top:5%;width:82%;transform:translate3d(58px,0,42px) rotate(5deg) scale(.9);transform-origin:100% 50%}
  .capability-card:nth-child(4) .capability-robot{right:-3%;bottom:-2px;width:78%;transform:translate3d(0,58px,42px) scale(.9);transform-origin:50% 100%}
  .capability-card:nth-child(1):hover .capability-robot,.capability-card:nth-child(1):focus-within .capability-robot,
  .capability-card:nth-child(4):hover .capability-robot,.capability-card:nth-child(4):focus-within .capability-robot{opacity:.96;transform:translate3d(0,0,42px) scale(1)}
  .capability-card:nth-child(2):hover .capability-robot,.capability-card:nth-child(2):focus-within .capability-robot,
  .capability-card:nth-child(3):hover .capability-robot,.capability-card:nth-child(3):focus-within .capability-robot{opacity:.96;transform:translate3d(0,0,42px) rotate(0) scale(1)}
}

@media(max-width:980px){
  .folder-gallery{min-height:680px}.folder-stage{height:620px}
  .folder-photo{width:190px}
  .folder-gallery.is-open .folder-photo:nth-child(1){--open-x:-280px}.folder-gallery.is-open .folder-photo:nth-child(2){--open-x:-140px}.folder-gallery.is-open .folder-photo:nth-child(4){--open-x:140px}.folder-gallery.is-open .folder-photo:nth-child(5){--open-x:280px}
}
@media(max-width:680px){
  .hero-dock::before,.hero-dock::after{top:10px;left:14px;right:14px;height:120px;filter:blur(1.8px);opacity:.4}
  .hero-dock::before{transform:translate3d(-26px,10px,-70px) rotateY(8deg) scale(.94)}.hero-dock::after{transform:translate3d(26px,10px,-70px) rotateY(-8deg) scale(.94)}
  .folder-gallery{min-height:620px;margin-top:48px;border-radius:18px}.folder-stage{height:560px}
  .folder-back{bottom:82px;width:284px;height:200px}.folder-back::before{top:-35px;width:112px;height:36px}
  .folder-front{bottom:68px;width:300px;height:157px;border-radius:19px}.folder-front b{bottom:29px}
  .folder-photo{bottom:108px;width:150px}
  .folder-gallery.is-open .folder-photo{transform:translate3d(calc(-50% + var(--open-mobile-x,0px) + var(--drag-x,0px)),calc(-34px + var(--drag-y,0px)),30px) rotate(var(--open-mobile-rotate,0deg)) scale(1)}
  .folder-gallery.is-open .folder-photo:hover,.folder-gallery.is-open .folder-photo:focus-visible{transform:translate3d(calc(-50% + var(--open-mobile-x,0px) + var(--drag-x,0px)),calc(-42px + var(--drag-y,0px)),50px) rotate(var(--open-mobile-rotate,0deg)) scale(1.035)}
  .folder-gallery.is-open .folder-photo:nth-child(1){--open-mobile-x:-126px;--open-mobile-rotate:-5deg}.folder-gallery.is-open .folder-photo:nth-child(2){--open-mobile-x:-64px;--open-mobile-rotate:-2deg}.folder-gallery.is-open .folder-photo:nth-child(4){--open-mobile-x:64px;--open-mobile-rotate:2deg}.folder-gallery.is-open .folder-photo:nth-child(5){--open-mobile-x:126px;--open-mobile-rotate:5deg}
  .folder-close{right:18px;bottom:18px}.folder-hint{bottom:20px;width:70%;text-align:center;line-height:1.6}
}
@media(prefers-reduced-motion:reduce){
  .hero-dock::before,.hero-dock::after,.folder-photo,.folder-front,.folder-close{transition:none}
  .folder-gallery:not(.is-open) .folder-stage:hover .folder-photo{transform:translate3d(calc(-50% + var(--closed-x)),0,0) rotate(var(--photo-rotate))}
}