/* Atmospheric motion sits around the media; source geometry stays untouched. */
@property --halo-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
:root{--journey-progress:0;--fx-cyan:#a8fff0}
.journey-light{position:fixed;top:0;left:0;right:0;height:2px;z-index:70;pointer-events:none;transform:scaleX(var(--journey-progress));transform-origin:left;background:linear-gradient(90deg,#96c745,var(--accent),var(--fx-cyan));box-shadow:0 0 14px #dfff8199}
.hero-aurora{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;mask-image:linear-gradient(transparent,#000 12%,#000 80%,transparent)}
.hero-aurora i{position:absolute;right:4%;top:-30%;width:40%;height:150%;background:linear-gradient(100deg,transparent 25%,#94e16c12 45%,#d8ff8426 50%,#a6ffdb0b 55%,transparent 75%);filter:blur(18px);transform:rotate(28deg);animation:aurora-drift 18s ease-in-out infinite alternate;transform-origin:center}
.hero-aurora i:nth-child(2){right:20%;width:24%;background:linear-gradient(90deg,transparent,#85ffe315,transparent);animation-delay:-8s;animation-duration:24s}
.hero-aurora i:nth-child(3){right:-8%;width:22%;opacity:.5;animation-delay:-15s;animation-duration:30s}
.hero-visual #presence-field{opacity:1;z-index:0;pointer-events:none}
.hero-visual .orbit{opacity:.45}
.portal-aura{position:absolute;left:50%;top:calc(var(--portal-top) - 4px);width:calc(var(--portal-width) + 8px);height:calc(var(--portal-width)*16/9 + 8px);border-radius:164px 164px 28px 28px;transform:translateX(-50%);padding:2px;z-index:3;pointer-events:none;background:conic-gradient(from var(--halo-angle),#ddff7814 0deg,#dfff7888 50deg,#eaffbd 76deg,#9dfceb 100deg,#99ffe600 145deg,#a7fbdd00 210deg,#dfff7866 280deg,#ddff7814 360deg);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;animation:halo-circuit 9s linear infinite}
.avatar-portal{box-shadow:0 0 0 1px #e7fac740,0 0 28px #d4ff7926,0 0 90px #a3ff6818;animation:portal-breathe 7s ease-in-out infinite}
.portal-radar{position:absolute;width:calc(var(--portal-width) + 160px);height:115px;top:calc(var(--portal-top) + var(--portal-width)*16/9 - 55px);left:50%;transform:translateX(-50%);z-index:1;pointer-events:none;mask-image:linear-gradient(#000,transparent)}
.portal-radar i{position:absolute;inset:0;border:1px solid #dfff7777;border-radius:50%;box-shadow:0 0 10px #bdff6c10;animation:radar-spread 7s ease-out infinite}
.portal-radar i:nth-child(2){animation-delay:-2.33s}.portal-radar i:nth-child(3){animation-delay:-4.66s}
.hero h1 em,.platform h2 em,.experience h2 em,.infra-copy h2 em,.onboarding h2 em{color:var(--accent);background:linear-gradient(105deg,#dbff73 12%,#f4ffdf 26%,#a8fff0 40%,#dbff73 54%,#dbff73 80%);background-size:240% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:heading-light 14s linear infinite}
.header .iris-mark{box-shadow:0 0 0 5px #dcff7704;animation:mark-glow 8s ease-in-out infinite}
.section-top{position:relative}
.section-top::after{content:'';position:absolute;left:0;right:0;bottom:-17px;height:1px;pointer-events:none;background:linear-gradient(90deg,#a8c48714,#d7ff7350 35%,#c3ffeaa3 50%,#d7ff7350 65%,#a8c48714);background-size:230% 100%;background-position:100% 0;opacity:calc(.22 + var(--section-light,.2)*.65);animation:section-signal 13s linear infinite}
.detail-section .section-top::after,.comparison-section .section-top::after{background:linear-gradient(90deg,transparent,#4c742477,transparent);background-size:230% 100%}
.js.fx-ready .reveal{filter:blur(4px);transition:opacity .9s ease,transform 1s cubic-bezier(.16,1,.3,1),filter .9s ease}
.js.fx-ready .reveal.in{filter:none}
.feature-editorial,.os-bar,.state-button,.signal-system{--pointer-x:50%;--pointer-y:50%;position:relative;isolation:isolate}
.feature-editorial::before,.os-bar::before{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:8px;background:radial-gradient(230px circle at var(--pointer-x) var(--pointer-y),#ccff7b15,transparent 75%);opacity:0;transition:opacity .45s;pointer-events:none}
.feature-editorial:hover::before,.os-bar:hover::before{opacity:1}
.feature-editorial::after{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:radial-gradient(100px circle at var(--pointer-x) 0,#edffb6,transparent);opacity:0;transition:opacity .4s;pointer-events:none}
.feature-editorial:hover::after{opacity:.85}
.state-button::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#d9ff7209,transparent 85%);transform:scaleX(0);transform-origin:left;transition:transform .5s ease;pointer-events:none}
.state-button.active::after{transform:scaleX(1)}
.experience-screen{box-shadow:0 0 0 1px #dbff7333,0 16px 55px #0004}
.experience-screen::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(130deg,#e7ffad88,transparent 40%,#afffed66);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;pointer-events:none}
.experience-screen.state-changing::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,transparent 30%,#ddff821c 47%,#e6ffad70 50%,transparent 53%);background-size:100% 250%;animation:state-acquire .85s ease-out both}
.signal-system{box-shadow:0 0 65px #b7ff6410;border-color:#c3f38e44;animation:stack-breathe 9s ease-in-out infinite}
#intelligence-field{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.8}
.signal-system>:not(canvas):not(.system-grid){position:relative;z-index:1}
.system-node{animation:node-charge 9s ease-in-out infinite;background:#1c2219f2}
.system-node:nth-of-type(5){animation-delay:3s}
.system-core{box-shadow:0 0 28px #d1ff7820,0 0 70px #c2ff7820;animation:core-charge 9s ease-in-out infinite;animation-delay:4s}
.core-ring{border-style:solid;border-top-color:#e4ffa4;border-right-color:#a3ffee33;box-shadow:0 0 15px #caff6d15;animation-duration:18s}
.signal-line:after{width:2px;left:-.5px;height:22px;box-shadow:0 0 9px 1px #dbff7380;animation-duration:2.1s}
.output-labels span{animation:output-charge 9s ease-in-out infinite;animation-delay:6s}
.output-labels span:nth-child(2){animation-delay:6.3s}.output-labels span:nth-child(3){animation-delay:6.6s}
.pilot-section::before{content:'';position:absolute;left:-15%;right:-15%;top:34%;height:120%;background-image:linear-gradient(#36570f22 1px,transparent 1px),linear-gradient(90deg,#36570f22 1px,transparent 1px);background-size:64px 64px;transform:perspective(500px) rotateX(57deg);transform-origin:top;mask-image:linear-gradient(transparent,#0006 30%,transparent 90%);animation:pilot-grid 20s linear infinite;z-index:-1;pointer-events:none}
.pilot-section::after{content:'';position:absolute;top:-30%;height:170%;left:-15%;width:22%;background:linear-gradient(90deg,transparent,#f6ffcf55,transparent);transform:rotate(22deg);animation:pilot-beam 16s ease-in-out infinite;z-index:-1;pointer-events:none}
.button{--magnet-x:0px;--magnet-y:0px;position:relative;isolation:isolate;overflow:hidden;transform:translate(var(--magnet-x),var(--magnet-y));transition:background .25s,box-shadow .3s,transform .25s ease-out}
.button:hover{transform:translate(var(--magnet-x),calc(var(--magnet-y) - 2px));box-shadow:0 0 24px #dcff7724}
.button::after{content:'';position:absolute;top:-70%;bottom:-70%;width:28%;left:-45%;background:linear-gradient(90deg,transparent,#fff7,transparent);transform:rotate(24deg);pointer-events:none;opacity:0}
.button:hover::after,.button:focus-visible::after{animation:button-light 1.15s ease-out both}
.button-dark::after{background:linear-gradient(90deg,transparent,#dbff733b,transparent)}
.footer-wordmark{background:linear-gradient(110deg,#414837 20%,#6a7c49 38%,#b3d17e 47%,#414837 58%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:240% 100%;animation:heading-light 24s linear infinite}
.footer-bottom #motion-toggle{position:fixed;bottom:22px;right:24px;z-index:60;background:#171d15eb;color:#e5eddc;border:1px solid #d7ff7355;border-radius:100px;padding:10px 16px;font-size:12px;box-shadow:0 6px 26px #0003;backdrop-filter:blur(12px);display:flex;gap:10px;align-items:center}
#motion-toggle::before{content:'Ⅱ';color:var(--accent);font-size:12px;line-height:1}
#motion-toggle[aria-pressed=true]::before{content:'▶';font-size:10px}
.footer-bottom{padding-bottom:35px}
@keyframes aurora-drift{0%{transform:translateX(-10%) rotate(28deg);opacity:.5}50%{opacity:.95}100%{transform:translateX(25%) rotate(14deg);opacity:.65}}
@keyframes halo-circuit{to{--halo-angle:360deg}}
@keyframes portal-breathe{50%{box-shadow:0 0 0 1px #e7fac780,0 0 35px #d4ff7938,0 0 100px #a3ff6828}}
@keyframes radar-spread{0%{transform:scale(.45);opacity:0}20%{opacity:.6}100%{transform:scale(1.14);opacity:0}}
@keyframes heading-light{from{background-position:100% 50%}to{background-position:-140% 50%}}
@keyframes mark-glow{50%{box-shadow:0 0 0 7px #dcff7709,0 0 22px #dcff7726}}
@keyframes section-signal{to{background-position:-130% 0}}
@keyframes state-acquire{from{background-position:0 120%}to{background-position:0 -120%}}
@keyframes stack-breathe{50%{box-shadow:0 0 80px #b7ff6424;border-color:#c3f38e66}}
@keyframes node-charge{0%,55%,100%{border-color:#9aa98b33;box-shadow:0 0 0 transparent}20%,32%{border-color:#dcff7377;box-shadow:0 0 21px #dcff7322}}
@keyframes core-charge{0%,50%,100%{box-shadow:0 0 20px #cfff741a,0 0 50px #ccff7614}25%{box-shadow:0 0 35px #cfff7444,0 0 80px #ccff7633}}
@keyframes output-charge{0%,50%,100%{border-color:#9aa98b33}25%{border-color:#dcff7388}}
@keyframes pilot-grid{to{background-position:0 64px}}
@keyframes pilot-beam{0%,15%{left:-35%;opacity:0}25%{opacity:.7}70%{left:115%;opacity:.7}80%,100%{left:120%;opacity:0}}
@keyframes button-light{0%{left:-45%;opacity:0}20%{opacity:1}100%{left:130%;opacity:0}}
.motion-paused *,.motion-paused *::before,.motion-paused *::after,.fx-suspended *,.fx-suspended *::before,.fx-suspended *::after{animation-play-state:paused!important}
.motion-paused .button{transform:none!important}
.motion-paused .reveal{filter:none!important}
@media(max-width:720px){.hero-aurora i{right:-18%;width:70%}.portal-radar{width:calc(var(--portal-width) + 80px)}.portal-aura{opacity:.85}.footer-bottom #motion-toggle{right:14px;bottom:14px;padding:9px 13px;font-size:12px}.pilot-section::before{background-size:40px 40px}.hero-visual .orbit{opacity:.3}}
@media(hover:none){.button::after,.feature-editorial::before,.feature-editorial::after,.os-bar::before{display:none}}
@media(prefers-reduced-motion:reduce){.hero-aurora i,.portal-aura,.portal-radar i,.avatar-portal,.system-core,.system-node,.output-labels span,.signal-system,.hero h1 em,.platform h2 em,.experience h2 em,.infra-copy h2 em,.onboarding h2 em,.footer-wordmark,.header .iris-mark,.section-top::after,.pilot-section::before,.pilot-section::after,.button::after{animation:none!important}.js.fx-ready .reveal{filter:none!important}.button{transform:none!important}.hero-aurora{opacity:.35}.portal-radar{display:none}.experience-screen.state-changing::before{display:none}}
.signal-system .system-grid{opacity:calc(.3 + var(--section-light,.5)*.65)}
.signal-system #intelligence-field{opacity:calc(.3 + var(--section-light,.5)*.6)}

/* Original studio footage with a soft green background. */
.avatar-portal,.experience-screen,.detail-close,.detail-full,.demo-video-wrap{background:#d9e1c7}