:root{--bg:#020711;--panel:#071321;--panel-2:#0a192b;--line:#123b60;--blue:#009dff;--cyan:#40caff;--white:#f4f8ff;--muted:#adbed1;--header-h:78px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,Helvetica,sans-serif;line-height:1.6;overflow-x:hidden}img{max-width:100%;display:block}a{color:inherit}button{font:inherit}h1,h2,h3,p{margin-top:0}h2{font-size:clamp(2rem,3.4vw,3.4rem);line-height:1.13;letter-spacing:-.035em}h2 span,.hero h2 span{color:var(--blue)}.shell{width:min(1450px,90%);margin-inline:auto}.skip-link{position:absolute;left:1rem;top:-4rem;background:#fff;color:#000;padding:.7rem;z-index:99}.skip-link:focus{top:1rem}.site-header{position:sticky;top:0;z-index:30;background:rgba(1,6,14,.96);border-bottom:1px solid rgba(0,157,255,.23);backdrop-filter:blur(14px)}.nav{min-height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;flex-shrink:0;text-decoration:none}.brand img{width:190px;height:53px;object-fit:contain;object-position:left center}.brand-fallback{font-size:1.5rem;font-weight:900;letter-spacing:.1em}.brand-fallback span{color:var(--blue)}.nav-links{display:flex;gap:clamp(10px,1.5vw,25px);list-style:none;align-items:center;padding:0;margin:0}.nav-links a{text-decoration:none;font-size:.84rem;font-weight:600;white-space:nowrap;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:var(--cyan)}.button{display:inline-flex;justify-content:center;align-items:center;gap:12px;padding:13px 21px;border-radius:7px;font-size:.88rem;font-weight:700;text-decoration:none;transition:transform .2s,background .2s,box-shadow .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:#008cff;box-shadow:0 0 23px rgba(0,140,255,.4);color:white}.button-primary:hover{background:#20a6ff}.button-outline,.button-glass{border:1px solid var(--blue);color:#d8f2ff;background:rgba(0,0,0,.3)}.button-outline:hover,.button-glass:hover{background:rgba(0,157,255,.15)}.nav-cta{white-space:nowrap}.menu-toggle{display:none}.hero{min-height:min(730px,calc(100svh - var(--header-h)));background:linear-gradient(90deg,rgba(0,3,9,.95) 0%,rgba(0,3,9,.83) 24%,rgba(0,3,9,.35) 51%,rgba(0,3,9,.08) 78%),none center center/cover no-repeat;display:flex;align-items:center;position:relative}.hero:after{content:'';position:absolute;inset:auto 0 0;height:110px;background:linear-gradient(transparent,var(--bg));pointer-events:none}.hero-inner{position:relative;z-index:1}.hero-copy{max-width:630px;padding:70px 0 95px}.eyebrow{color:var(--cyan);font-size:.77rem;letter-spacing:.17em;font-weight:800;margin-bottom:18px}.hero h1{font-size:clamp(4rem,7vw,7.3rem);letter-spacing:.055em;line-height:1;margin-bottom:25px;font-weight:900}.hero h2{font-size:clamp(1.65rem,2.5vw,2.85rem);max-width:650px;margin-bottom:20px}.hero-description{color:#d7e4f2;max-width:520px;font-size:1rem}.button-row{display:flex;flex-wrap:wrap;gap:13px;margin-top:26px}.launch-note{font-size:.76rem;color:#8ca9bf;margin:22px 0 0}.section{padding:90px 0}.section-heading{max-width:770px;margin-bottom:35px}.section-heading p:not(.eyebrow){color:var(--muted)}.centered{text-align:center;margin-inline:auto}.services-section{background:#030b16}.services-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.service-card{background:linear-gradient(150deg,#08192a,#030b15);border:1px solid #16456e;border-radius:10px;padding:26px 15px;min-width:0;transition:transform .25s,border-color .25s,box-shadow .25s}.service-card:hover{transform:translateY(-7px);border-color:var(--cyan);box-shadow:0 12px 30px rgba(0,139,255,.12)}.service-card img{width:62px;height:62px;object-fit:contain;margin:0 0 18px}.service-card h3{font-size:1rem;line-height:1.3;margin-bottom:12px}.service-card p{font-size:.84rem;color:var(--muted);margin:0}.split-section{padding:0;display:grid;grid-template-columns:1fr 1fr;min-height:440px;background:#06101d}.split-image img{width:100%;height:100%;min-height:440px;object-fit:cover}.split-copy{padding:70px clamp(25px,5vw,90px);align-self:center;max-width:780px}.split-copy p:not(.eyebrow){color:var(--muted)}.text-link{display:inline-flex;gap:12px;color:var(--cyan);text-decoration:none;font-weight:700;margin-top:12px}.feature-section{background:#040b16}.feature-grid,.innovation-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center}.feature-copy p:not(.eyebrow),.innovation-copy p:not(.eyebrow){color:var(--muted);max-width:610px}.small-muted{font-size:.85rem}.feature-art img,.innovation-art img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 50px rgba(0,0,0,.3)}.projects-section{background:#06101c}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.project-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--panel);transition:transform .25s,border-color .25s}.project-card:hover{transform:translateY(-5px);border-color:var(--blue)}.project-card img{width:100%;height:210px;object-fit:cover}.project-body{padding:23px}.project-body h3{margin:9px 0}.project-body p{color:var(--muted);font-size:.9rem;margin:0}.project-tag{color:var(--cyan);font-size:.7rem;letter-spacing:.12em;font-weight:800}.innovation-section{background:linear-gradient(135deg,#04111e,#061c32)}.innovation-grid{grid-template-columns:1fr 1fr}.innovation-tags{display:flex;flex-wrap:wrap;gap:9px;margin:25px 0}.innovation-tags span{border:1px solid #1a527b;border-radius:999px;padding:6px 13px;color:#a9dfff;font-size:.78rem}.contact-section{position:relative;text-align:center;background:linear-gradient(rgba(0,8,21,.84),rgba(0,8,21,.9)),url('assets/images/contact-globe.png') center center/cover no-repeat}.contact-inner{max-width:790px}.contact-inner p:not(.eyebrow){color:#c1d3e7}.contact-inner .button{margin-top:16px}.site-footer{background:#01050a;border-top:1px solid #102b42;padding:26px 0}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-inner strong{letter-spacing:.16em}.footer-inner p{margin:0;color:#8197ad;font-size:.82rem}.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}a:focus-visible,button:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}@media(max-width:1300px){.nav-links{gap:11px}.nav-links a{font-size:.76rem}.brand img{width:160px}.services-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.service-card{padding:25px}.hero{background-position:57% center}}@media(max-width:950px){.nav-cta{display:none}.menu-toggle{display:flex;flex-direction:column;gap:5px;background:none;border:1px solid #215b83;padding:11px;border-radius:6px;cursor:pointer}.menu-toggle span{display:block;width:23px;height:2px;background:#d4edff}.nav-links{display:none;position:absolute;left:0;right:0;top:100%;padding:20px 5%;background:#020914;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex}.nav-links li a{display:block;padding:11px 0;font-size:1rem}.hero{min-height:670px;background-position:61% center}.hero-copy{max-width:570px}.split-section{grid-template-columns:1fr}.split-image img{height:330px;min-height:0}.split-copy{padding:55px 5%}.feature-grid,.innovation-grid{grid-template-columns:1fr;gap:30px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.shell{width:90%}.section{padding:65px 0}.brand img{width:165px}.hero{min-height:690px;background-image:linear-gradient(90deg,rgba(0,3,9,.94),rgba(0,3,9,.65)),none;background-position:67% center}.hero-copy{padding:65px 0 95px}.hero h1{font-size:clamp(3.3rem,15vw,5rem)}.hero h2{font-size:clamp(1.6rem,7vw,2.2rem)}.services-grid,.project-grid{grid-template-columns:1fr}.service-card{display:grid;grid-template-columns:65px 1fr;column-gap:17px;align-items:start}.service-card img{grid-row:span 2;margin:0}.service-card h3{margin:0 0 7px}.project-card img{height:195px}.footer-inner{flex-direction:column;align-items:flex-start}.button-row .button{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* SAGOVA brand refinements */
.brand img{width:210px;max-height:66px;object-fit:contain;object-position:left center}
.hero h1{font-size:clamp(3.4rem,6.8vw,6.8rem);letter-spacing:.045em;margin-bottom:18px}
.hero h1 small{display:block;font-size:clamp(.78rem,1.3vw,1.15rem);letter-spacing:.45em;font-weight:600;margin-top:12px;color:#e6f6ff}
.hero .eyebrow{letter-spacing:.18em}
@media(max-width:650px){.brand img{width:160px}.hero h1{font-size:clamp(3.1rem,14vw,4.5rem)}.hero h1 small{font-size:.7rem;letter-spacing:.25em}}


/* SAGOVA approved artwork: separate robot/globe from real, selectable page text. */
.hero{background:radial-gradient(circle at 68% 45%,rgba(0,83,158,.27),transparent 48%),linear-gradient(115deg,#01050d 18%,#041322 65%,#020711);overflow:hidden;min-height:680px}
.hero-inner{min-height:680px;display:flex;align-items:center;isolation:isolate}
.hero-art{position:absolute;z-index:-1;right:-6%;top:3%;bottom:0;width:72%;pointer-events:none;display:flex;align-items:center;justify-content:flex-end;overflow:hidden}
.hero-art img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.12)}
.hero-art::before{content:'';position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,#01050d 0%,rgba(1,5,13,.91) 10%,rgba(1,5,13,.33) 36%,transparent 60%),linear-gradient(0deg,#020711 0%,transparent 20%);pointer-events:none}
.hero-copy{position:relative;z-index:2;max-width:560px}
.hero h1{background:linear-gradient(100deg,#fff 10%,#d6e3f0 57%,#00b7ff 92%);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(3.4rem,6vw,6.2rem)}
.hero h1 small{color:#e6f6ff;-webkit-text-fill-color:#e6f6ff}
.hero .launch-note{max-width:430px}
@media(max-width:1100px){.hero-art{right:-17%;width:83%;opacity:.83}.hero-copy{max-width:520px}}
@media(max-width:700px){.hero{min-height:740px}.hero-inner{min-height:740px;align-items:flex-end}.hero-art{right:-35%;top:0;bottom:24%;width:145%;opacity:.68}.hero-art::before{background:linear-gradient(0deg,#01050d 0%,rgba(1,5,13,.3) 45%,transparent 75%),linear-gradient(90deg,rgba(1,5,13,.55),transparent)}.hero-copy{padding:280px 0 70px}.hero h1{font-size:clamp(3rem,13vw,4.6rem)}.hero h1 small{font-size:.75rem}.hero h2{font-size:clamp(1.45rem,6vw,2.1rem)}}


/* V3.0: cinematic, lightweight motion inspired by the connected digital-wave identity.
   All decorative layers are non-interactive; no external libraries or downloads. */
body{--motion-speed:1}
.boot-screen{position:fixed;inset:0;z-index:200;background:#01060e;display:grid;place-items:center;pointer-events:none;animation:boot-exit .8s ease 1.15s forwards}
.boot-mark{text-align:center;width:min(330px,70vw)}
.boot-mark img{width:100px;height:100px;object-fit:contain;margin:0 auto 14px;filter:drop-shadow(0 0 22px #009dff)}
.boot-mark span{display:block;color:#a6dcff;letter-spacing:.27em;font:600 .62rem Arial,sans-serif;margin-bottom:22px}
.boot-progress{height:2px;background:linear-gradient(90deg,#004b90,#35caff,#d3f7ff);transform-origin:left;animation:boot-bar 1.05s ease forwards}
@keyframes boot-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes boot-exit{to{opacity:0;visibility:hidden}}
.scroll-progress{position:fixed;top:0;left:0;width:0;height:2px;z-index:100;background:#36d8ff;box-shadow:0 0 13px #00b7ff;pointer-events:none}
.hero{isolation:isolate}
.hero-network{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.64}
.hero-grid{position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.17;background-image:linear-gradient(#2c9cf722 1px,transparent 1px),linear-gradient(90deg,#2c9cf722 1px,transparent 1px);background-size:65px 65px;mask-image:linear-gradient(to bottom,transparent,#000 45%,transparent);animation:grid-drift 22s linear infinite}
@keyframes grid-drift{to{background-position:65px 65px}}
.hero-inner{z-index:1}
.hero-art{z-index:-1;transform:translate3d(var(--parallax-x,0px),var(--parallax-y,0px),0);transition:transform .5s ease-out}
.hero-art img{animation:robot-breathe 7s ease-in-out infinite}
@keyframes robot-breathe{50%{filter:saturate(1.25) brightness(1.15)}}
.hero-copy h1{filter:drop-shadow(0 0 13px #008fff30)}
.hero .eyebrow{animation:soft-glow 3.5s ease-in-out infinite}
@keyframes soft-glow{50%{text-shadow:0 0 16px #00aaffaa}}
.signal-status{display:flex;align-items:center;gap:10px;color:#89d8ff;font-size:.68rem;letter-spacing:.14em;font-weight:700;margin-bottom:24px}
.signal-code{color:#547f9f}.signal-dot{height:7px;width:7px;border-radius:50%;background:#38edff;box-shadow:0 0 0 0 #38edff66;animation:signal-pulse 2.4s infinite}
@keyframes signal-pulse{70%{box-shadow:0 0 0 10px #38edff00}}
.hero-side-label{position:absolute;right:0;bottom:45px;font-size:.62rem;letter-spacing:.18em;color:#87bbd9;opacity:.7}
.hero-side-label span{color:#05bfff;padding:0 4px}
.digital-ribbon{background:#020d1b;border-top:1px solid #124365;border-bottom:1px solid #124365}
.ribbon-inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:14px 0}
.ribbon-inner span{color:#b9e3ff;font-size:.72rem;letter-spacing:.12em;font-weight:700;white-space:nowrap}
.ribbon-inner i{display:inline-block;width:7px;height:7px;margin-right:9px;border-radius:50%;background:#06caff;box-shadow:0 0 10px #05bfff}
.button-primary{position:relative;overflow:hidden}
.button-primary:after{content:'';position:absolute;inset:-100% auto -100% -75%;width:40%;transform:rotate(20deg);background:linear-gradient(90deg,transparent,#ffffff66,transparent);transition:left .6s ease}
.button-primary:hover:after{left:140%}
.service-card,.project-card{transform-style:preserve-3d;will-change:transform;--card-glow-x:50%;--card-glow-y:50%}
.service-card:before,.project-card:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(220px circle at var(--card-glow-x) var(--card-glow-y),#00aaff20,transparent 80%);z-index:0}
.service-card:hover:before,.project-card:hover:before{opacity:1}
.service-card,.project-card{position:relative}
.split-image,.feature-art,.innovation-art{overflow:hidden}
.split-image img,.feature-art img,.innovation-art img{transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.split-image:hover img,.feature-art:hover img,.innovation-art:hover img{transform:scale(1.035)}
.nav-links a{position:relative}
.nav-links a:after{content:'';position:absolute;bottom:-7px;left:0;width:100%;height:2px;background:#0dbaff;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.nav-links a:hover:after,.nav-links a.active:after{transform:scaleX(1)}
.motion-toggle{position:fixed;right:18px;bottom:18px;z-index:70;background:#051526ed;border:1px solid #1d88c1;border-radius:999px;padding:9px 14px;color:#d4f3ff;box-shadow:0 0 16px #00baff25;cursor:pointer;font-size:12px}
.motion-toggle span{margin-left:5px}
.motion-paused .hero-grid,.motion-paused .hero-art img,.motion-paused .signal-dot,.motion-paused .hero .eyebrow{animation-play-state:paused}
.motion-paused .hero-art{transform:none}
@media(max-width:950px){.hero-network{opacity:.38}.hero-side-label{display:none}.ribbon-inner{justify-content:center}}
@media(max-width:650px){.boot-mark img{width:75px;height:75px}.signal-status{font-size:.54rem}.digital-ribbon{display:none}.motion-toggle span{display:none}.hero-network{opacity:.3}}
@media(prefers-reduced-motion:reduce){.boot-screen{display:none}.hero-network,.hero-grid{display:none}.hero-art{transform:none!important}.motion-toggle{display:none}}

/* V3.1 — cinematic Option B intro. The underlying V3 network continues after it. */
.cinematic-intro[hidden]{display:none!important}
.cinematic-intro{position:fixed;inset:0;z-index:300;overflow:hidden;background:radial-gradient(ellipse at 55% 55%,#08264a 0%,#020915 58%,#01040b 100%);color:#e9f8ff;isolation:isolate}
.cinematic-intro::before{content:"";position:absolute;inset:-25%;background:repeating-radial-gradient(circle at 52% 52%,transparent 0 68px,rgba(44,170,255,.09) 70px 71px,transparent 73px 130px);animation:intro-orbit 18s linear infinite}
.intro-stars{position:absolute;inset:0;background-image:radial-gradient(#8ddaff 1px,transparent 1px),radial-gradient(#30aaff 1px,transparent 1px);background-size:67px 71px,103px 107px;opacity:.27;animation:intro-stars 11s linear infinite}
.intro-robot{position:absolute;inset:0;display:grid;place-items:center;opacity:0;animation:intro-robot 9s ease both}
.intro-robot img{width:100%;height:100%;object-fit:cover;object-position:65% center;filter:saturate(1.28) contrast(1.08) brightness(.83);transform:scale(1.14);animation:intro-zoom 9s ease-out both}
.intro-robot::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#01050d 0%,transparent 35%,rgba(0,0,0,.18) 100%),linear-gradient(90deg,rgba(0,5,18,.52),transparent 70%)}
.intro-energy{position:absolute;left:55%;top:53%;width:24vw;height:24vw;min-width:180px;min-height:180px;transform:translate(-50%,-50%);pointer-events:none;animation:intro-energy-fade 9s ease both}
.intro-energy span{position:absolute;inset:0;border:1px solid rgba(45,206,255,.65);border-radius:50%;box-shadow:0 0 24px #00aaff99,inset 0 0 28px #009dff55;animation:intro-pulse 2.5s ease-out infinite}
.intro-energy span:nth-child(2){animation-delay:.7s}.intro-energy span:nth-child(3){animation-delay:1.4s}
.intro-brand{position:absolute;left:50%;top:52%;width:min(90vw,650px);text-align:center;transform:translate(-50%,-50%);opacity:0;animation:intro-brand 9s ease both;text-shadow:0 0 26px #00aaffaa}
.intro-brand img{width:clamp(92px,14vw,160px);filter:drop-shadow(0 0 22px #11baff);margin:0 auto 15px}
.intro-brand h2{font-size:clamp(2.6rem,8vw,5.7rem);font-weight:800;letter-spacing:.13em;margin:0;line-height:1.05}
.intro-brand h2 span{display:block;font-size:.3em;letter-spacing:.47em;margin-top:13px;color:#93d9ff}
.intro-brand p{font-size:clamp(.65rem,1.6vw,.95rem);letter-spacing:.28em;margin-top:32px;color:#d2f0ff}
.intro-skip{position:absolute;right:clamp(18px,4vw,55px);top:clamp(18px,4vw,45px);z-index:2;border:1px solid #52c7ff88;border-radius:100px;background:#071e35bb;color:#e5f8ff;padding:11px 20px;cursor:pointer;font:600 .85rem Arial,sans-serif;letter-spacing:.07em}
.intro-skip:hover,.intro-skip:focus-visible{background:#134268;outline:2px solid #68cfff;outline-offset:3px}
.intro-meter{position:absolute;bottom:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#1261b9,#4cdeff,#e5faff);transform-origin:left;animation:intro-meter 9s linear both}
.cinematic-intro.intro-out{animation:intro-dismiss .65s ease forwards;pointer-events:none}
@keyframes intro-robot{0%{opacity:0}10%,53%{opacity:1}73%,100%{opacity:0}}
@keyframes intro-zoom{0%{transform:scale(1.16)}70%,100%{transform:scale(1)}}
@keyframes intro-energy-fade{0%,15%{opacity:0}30%,56%{opacity:1}73%,100%{opacity:0}}
@keyframes intro-pulse{0%{transform:scale(.3);opacity:0}25%{opacity:.9}100%{transform:scale(1.8);opacity:0}}
@keyframes intro-brand{0%,58%{opacity:0;transform:translate(-50%,-47%) scale(.9)}74%,100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes intro-meter{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes intro-stars{to{background-position:67px 71px,-103px 107px}}
@keyframes intro-orbit{to{transform:rotate(360deg)}}
@keyframes intro-dismiss{to{opacity:0;visibility:hidden}}
@media(max-width:700px){.intro-robot img{object-position:67% center}.intro-energy{left:58%;top:44%}.intro-brand h2{letter-spacing:.06em}.intro-brand h2 span{letter-spacing:.25em}.intro-brand p{letter-spacing:.11em}}
@media(prefers-reduced-motion:reduce){.cinematic-intro{display:none!important}}

/* V3.2 controls: audio opt-in, return greeting and intro replay. */
.intro-sound{position:absolute;z-index:4;top:clamp(18px,4vw,45px);left:clamp(18px,4vw,55px);padding:11px 18px;border:1px solid #52c7ff88;border-radius:100px;background:#071e35cc;color:#e5f8ff;font:600 .85rem Arial,sans-serif;cursor:pointer}
.intro-sound:hover,.intro-sound:focus-visible{background:#134268;outline:2px solid #68cfff;outline-offset:3px}
.intro-replay{position:fixed;bottom:20px;left:20px;z-index:60;border:1px solid #55c9ff77;border-radius:30px;background:#061b31ed;color:#cbefff;padding:9px 15px;cursor:pointer;font:600 .8rem Arial,sans-serif;box-shadow:0 0 20px #008bff33}
.intro-replay:hover,.intro-replay:focus-visible{background:#174468;outline:2px solid #68cfff}
.return-banner[hidden]{display:none!important}
.return-banner{position:fixed;right:20px;top:90px;z-index:80;display:flex;align-items:center;gap:16px;background:#071c34f2;color:#d8f6ff;border:1px solid #38bdf8a6;border-radius:12px;padding:14px 16px;box-shadow:0 8px 32px #0009;font:600 .9rem Arial,sans-serif}
.return-banner button{border:0;background:none;color:inherit;font-size:1.3rem;cursor:pointer}
@media(max-width:600px){.intro-sound{top:auto;bottom:42px;left:14px;font-size:.75rem}.intro-skip{right:14px;top:14px}.intro-replay{left:10px;bottom:10px}.return-banner{top:75px;left:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.intro-replay{display:none}}

/* V3.6: layered, stylised robotic assembly built from SAGOVA's existing robot artwork.
   This is a 2.5D cinematic effect, not a fully rigged 3D robot. */
.intro-assembly{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:1;animation:assembly-exit 15s both}
.assembly-core,.assembly-piece{position:absolute;inset:0;overflow:hidden}
.assembly-core img,.assembly-piece img{width:100%;height:100%;object-fit:cover;object-position:65% center;filter:saturate(1.25) contrast(1.13) brightness(.84)}
.assembly-core{opacity:0;filter:brightness(.25) contrast(1.8) saturate(.3);animation:core-on 15s both}
.assembly-piece{opacity:0;filter:drop-shadow(0 0 15px #22baff);will-change:transform,opacity}
.piece-left{clip-path:polygon(0 0,42% 0,42% 100%,0 100%);animation:lock-left 15s cubic-bezier(.18,.85,.28,1) both}
.piece-right{clip-path:polygon(64% 0,100% 0,100% 100%,64% 100%);animation:lock-right 15s cubic-bezier(.18,.85,.28,1) both}
.piece-top{clip-path:polygon(42% 0,64% 0,64% 36%,42% 36%);animation:lock-top 15s cubic-bezier(.18,.85,.28,1) both}
.piece-center{clip-path:polygon(42% 36%,64% 36%,64% 69%,42% 69%);animation:lock-center 15s cubic-bezier(.18,.85,.28,1) both}
.piece-bottom{clip-path:polygon(42% 69%,64% 69%,64% 100%,42% 100%);animation:lock-bottom 15s cubic-bezier(.18,.85,.28,1) both}
.assembly-scanner{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,transparent 46%,rgba(59,203,255,.09) 49%,rgba(117,229,255,.45) 50%,rgba(59,203,255,.08) 51%,transparent 54%);mix-blend-mode:screen;animation:scan-robot 8s linear both}
.assembly-flash{position:absolute;inset:0;background:radial-gradient(circle at 57% 40%,#a9eeff8c,transparent 43%);opacity:0;animation:assembly-sparks 15s both}
.assembly-status{position:absolute;left:clamp(20px,5vw,80px);bottom:clamp(85px,13vh,170px);z-index:1;display:flex;flex-direction:column;gap:8px;font:600 .72rem Arial,sans-serif;letter-spacing:.18em;text-shadow:0 0 16px #005bba;animation:status-exit 15s both}
.assembly-status-label{color:#68cfff}.assembly-status strong{font-size:clamp(.85rem,1.8vw,1.25rem);color:#e4f8ff}.assembly-status-bars{display:flex;gap:5px;margin-top:8px}.assembly-status-bars i{width:32px;height:3px;background:#37bdff;box-shadow:0 0 8px #3bbfff;animation:bar-light 1.1s infinite alternate}.assembly-status-bars i:nth-child(2){animation-delay:.15s}.assembly-status-bars i:nth-child(3){animation-delay:.3s}.assembly-status-bars i:nth-child(4){animation-delay:.45s}.assembly-status-bars i:nth-child(5){animation-delay:.6s}
@keyframes bar-light{from{opacity:.2}to{opacity:1}}
@keyframes core-on{0%,3%{opacity:0}6%,32%{opacity:.38}43%,69%{opacity:.1}76%,100%{opacity:0}}
@keyframes lock-left{0%,9%{opacity:0;transform:translate(-75%,22%) rotate(-7deg) scale(1.13)}18%{opacity:1}27%,69%{opacity:1;transform:none}77%,100%{opacity:0;transform:none}}
@keyframes lock-right{0%,14%{opacity:0;transform:translate(75%,-18%) rotate(8deg) scale(1.13)}22%{opacity:1}32%,69%{opacity:1;transform:none}77%,100%{opacity:0;transform:none}}
@keyframes lock-top{0%,22%{opacity:0;transform:translate(0,-110%) scale(1.16)}31%{opacity:1}38%,69%{opacity:1;transform:none}77%,100%{opacity:0;transform:none}}
@keyframes lock-center{0%,29%{opacity:0;transform:translate(0,80%) scale(.75)}38%{opacity:1}45%,69%{opacity:1;transform:none}77%,100%{opacity:0;transform:none}}
@keyframes lock-bottom{0%,34%{opacity:0;transform:translate(0,110%) scale(.9)}44%{opacity:1}50%,69%{opacity:1;transform:none}77%,100%{opacity:0;transform:none}}
@keyframes scan-robot{0%{opacity:0;transform:translateY(-95%)}8%,52%{opacity:1}62%{opacity:0;transform:translateY(95%)}100%{opacity:0}}
@keyframes assembly-sparks{0%,25%,31%,36%,42%,48%,52%,69%,100%{opacity:0}28%,34%,39%,45%,50%,54%{opacity:.55}}
@keyframes assembly-exit{0%,68%{opacity:1}80%,100%{opacity:0}}
@keyframes status-exit{0%,56%{opacity:1}66%,100%{opacity:0}}
/* Globe materialises after the last armour plate locks; branding follows. */
.intro-energy{animation:intro-energy-v36 15s both}
.intro-brand{animation:intro-brand-v36 15s ease both}
.intro-meter{animation:intro-meter 15s linear both}
@keyframes intro-energy-v36{0%,40%{opacity:0;transform:translate(-50%,-50%) scale(.2)}53%,66%{opacity:1;transform:translate(-50%,-50%) scale(1)}78%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.3)}}
@keyframes intro-brand-v36{0%,68%{opacity:0;transform:translate(-50%,-44%) scale(.87)}79%,100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:700px){.assembly-core img,.assembly-piece img{object-position:67% center}.assembly-status{bottom:100px;left:18px}.assembly-status-label{font-size:.6rem}}
@media(prefers-reduced-motion:reduce){.intro-assembly,.intro-energy,.intro-brand,.intro-meter{animation:none!important}}

/* V3.7: 12 separately animated armour sections, staged mechanical locks. */
.assembly-piece{clip-path:var(--panel-clip);opacity:0;transform-origin:55% 50%;animation:panel-assemble 15s linear both!important;animation-delay:0s!important;filter:drop-shadow(0 0 12px #27baff) brightness(1.2)}
.assembly-piece img{width:100%;height:100%;object-fit:cover}
@keyframes panel-assemble{
  0%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.2);filter:brightness(2.2) drop-shadow(0 0 30px #2cc9ff)}
  7%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.2)}
  19%{opacity:1}
  47%,70%{opacity:1;transform:translate(0,0) rotate(0) scale(1);filter:brightness(1) drop-shadow(0 0 4px #2cc9ff)}
  80%,100%{opacity:0;transform:none}
}
/* Each panel begins on its own staggered clock, reaching the locked state by 8 seconds. */
@keyframes lock-0{0%,6.67%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}12.0%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-shoulder-left{animation:lock-0 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-1{0%,9.47%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}14.8%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-shoulder-right{animation:lock-1 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-2{0%,12.27%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}17.6%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-arm-left{animation:lock-2 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-3{0%,15.07%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}20.4%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-arm-right{animation:lock-3 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-4{0%,17.87%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}23.2%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-torso-left{animation:lock-4 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-5{0%,20.67%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}26.0%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-torso-right{animation:lock-5 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-6{0%,23.47%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}28.8%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-head-left{animation:lock-6 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-7{0%,26.27%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}31.6%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-head-right{animation:lock-7 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-8{0%,29.07%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}34.4%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-hip-left{animation:lock-8 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-9{0%,31.87%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}37.2%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-hip-right{animation:lock-9 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-10{0%,34.67%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}40.0%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-leg-left{animation:lock-10 15s cubic-bezier(.2,.8,.22,1) both!important}
@keyframes lock-11{0%,37.47%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(1.12);filter:brightness(2)}42.8%,69%{opacity:1;transform:none;filter:brightness(1)}79%,100%{opacity:0;transform:none}}
.panel-leg-right{animation:lock-11 15s cubic-bezier(.2,.8,.22,1) both!important}
.assembly-reticle{position:absolute;inset:13% 18% 10% 18%;border:1px solid #42c9ff33;border-radius:50%;box-shadow:inset 0 0 45px #008eff15,0 0 60px #007eff12;animation:reticle-v37 15s both;pointer-events:none}
.assembly-reticle span{position:absolute;inset:8%;border:1px dashed #39caff44;border-radius:50%;animation:intro-orbit 12s linear infinite}
.assembly-reticle span:nth-child(2){inset:23%;animation-direction:reverse;animation-duration:8s}
.assembly-reticle span:nth-child(3){inset:38%;animation-duration:5s}
@keyframes reticle-v37{0%,6%{opacity:0;transform:scale(.7)}15%,62%{opacity:.7;transform:scale(1)}74%,100%{opacity:0;transform:scale(1.2)}}
@media(prefers-reduced-motion:reduce){.assembly-piece,.assembly-reticle{animation:none!important}}