/* Option B: Electric / a separate visual exploration. */
:root{--paper:#080910;--dark:#080910;--panel:#151624;--cyan:#b9a0ff;--line:#353448;--muted:#bdbdd0;--white:#f7f5ff;--ink:#f0edff}
body{background:#080910}::selection{background:#af93ff;color:#080910}
.site-header{background:#080910e8;backdrop-filter:blur(18px);border-bottom-color:#ffffff12}
.brand{letter-spacing:-.06em}.brand img{filter:drop-shadow(0 0 9px #b7a0ff40)}
.header-cta{border-radius:50px;border-color:#827091;background:#a990ff12}
.hero{padding:80px 0 0;isolation:isolate;background:#080910}
.hero:before{background:radial-gradient(ellipse at 50% 48%,#7351d522,transparent 60%)}
.hero-inner{display:flex;flex-direction:column;gap:45px;min-height:0;text-align:center}
.hero-copy{max-width:1100px;z-index:2}.hero .eyebrow{justify-content:center;color:#cbb9ff}
.hero h1{font-size:clamp(72px,8.7vw,132px);line-height:.97;letter-spacing:-.075em;max-width:1100px;margin:0 auto 30px;font-weight:600}
.hero h1 br{display:none}.hero h1 span{display:block;color:#c6b0ff;background:linear-gradient(110deg,#e8dfff 10%,#b195ff 45%,#89eaf0 85%);background-clip:text;-webkit-text-fill-color:transparent}
.hero-copy>p:not(.eyebrow){max-width:490px;margin:0 auto;color:#bebcd2;font-size:16px;line-height:1.8}
.hero-actions{justify-content:center;margin-top:28px}.btn{border-radius:50px;padding:16px 25px}.btn-primary,.btn-dark,.btn-primary:hover,.btn-dark:hover{background:#c6b0ff;color:#120d23;box-shadow:0 0 28px #a484ff20}.btn-primary:hover,.btn-dark:hover{box-shadow:0 0 35px #a484ff55}
.hero-machine{width:min(660px,100%);margin:8px auto 0;padding:25px 22px 25px;text-align:left}
.machine-window{transform:none;background:linear-gradient(135deg,#191625ee,#0c1821f5);border-color:#9d80cd66;box-shadow:0 0 0 7px #a991ff08,0 30px 100px #0009,0 -15px 90px #a887ff16;border-radius:16px}
.machine-result{background:#202039;border:1px solid #7d719a;box-shadow:0 15px 40px #0007;transform:rotate(-2deg)}
.machine-caption{color:#c7bedb}.orbit{opacity:0}.machine-label{display:none}.window-bar{background:#ffffff03}.window-bar,.mini-table td{border-color:#464058}
.hero-foot{margin-top:42px;border-color:#ffffff20;color:#bfb4d4}.hero-foot .scroll-hint{color:#c6b0ff}
.energy-field{position:absolute;inset:100px -150px 50px;z-index:-1;pointer-events:none;overflow:hidden;display:grid;place-items:center;perspective:1100px}
.energy-orbit{position:absolute;width:900px;height:900px;border:1px solid #bea0ff38;border-radius:50%;transform:rotateX(65deg) rotateZ(-25deg);box-shadow:inset 0 0 40px #a583ff06,0 0 30px #a583ff08}
.energy-orbit:before{content:'';position:absolute;inset:-2px;border-radius:50%;border:3px solid transparent;border-top-color:#bf98ff;border-right-color:#8ff0e540;filter:drop-shadow(0 0 12px #a57aff);animation:orbit-flow 18s linear infinite}
.orbit-two{width:1150px;height:1150px;transform:rotateX(68deg) rotateZ(40deg);opacity:.7}.orbit-two:before{animation-duration:24s;animation-direction:reverse;border-top-color:#8ce3f0}
.orbit-three{width:1400px;height:1400px;transform:rotateX(70deg) rotateZ(-15deg);opacity:.35}.orbit-three:before{animation-duration:32s}
.energy-core{width:600px;height:600px;border-radius:50%;background:radial-gradient(ellipse,#7750b82b,transparent 65%);filter:blur(35px)}
.energy-label{position:absolute;top:42%;left:8%;writing-mode:vertical-rl;font:9px var(--mono);letter-spacing:.25em;color:#ab91cc;opacity:.7}
.stack-strip{background:#0d0d18;border-block:1px solid #332a43}.stack-list li{color:#d9d1ed}.stack-list li:after{background:#b294f5}
.playground,.training-block,.contact,.case-note{background:#10101d}.section-top h2,.process-intro h2,.contact h2{letter-spacing:-.065em}
.demo-shell{border-radius:18px;border-color:#5e5076;background:#11121d;box-shadow:0 30px 100px #0005}
.demo-tabs,.mini-app .app-top,.resort .app-top,.knowledge .app-top,.leads .app-top{background:#201c2e;border-color:#4b405f}
.demo-tab[aria-selected=true]{background:#34284c;color:#e0ceff;border-color:#c6b0ff}.demo-input,.demo-output,.mini-app{background:#121420;border-color:#494456}
.demo-output{background:radial-gradient(ellipse at 100% 0,#7154a320,transparent),#121420}
.work-grid{gap:50px 32px}.work-card{position:relative;border:1px solid #37303f;border-radius:20px;overflow:hidden;padding:16px;background:linear-gradient(140deg,#1b1726,#0e1019);transition:border-color .3s,transform .3s,box-shadow .3s}
.work-card:hover{border-color:#a991da;transform:translateY(-6px);box-shadow:0 18px 60px #70519d20}
.work-card .work-image{border-radius:12px;background:radial-gradient(ellipse at 70% 20%,#57427e55,transparent),#171522}
.work-card .work-meta,.work-card p,.work-card .work-tags{margin-inline:12px}.work-meta h3{font-size:25px}.work-card p{color:#c0b8cd}
.finance-callout,.training-block,.case-next-box{border-color:#534262}.service-item{border-color:#383141}.service-item:hover{background:linear-gradient(90deg,#a583ff0e,transparent)}
.tag{border-color:#6c537f!important;color:#dec7f7!important}.service-num,.process-item>span{color:#c6b0ff}.process-item{border-color:#383141}
.contact{position:relative;background:radial-gradient(ellipse at 0 100%,#38265288,transparent 60%),#0e0d18}.contact:after{color:#c6b0ff0a}
.contact-box select{background:#191623;border-color:#756183;color:#f0e8fa}.contact h2{font-size:clamp(52px,6.5vw,94px)}
.site-footer{background:#080910}.footer-wordmark{color:#d3c7e8;letter-spacing:-.08em}.footer-bottom{border-color:#393042}.case-hero{background:radial-gradient(ellipse at 80% 20%,#68489930,transparent),#080910}.case-hero h1{font-weight:600}.case-hero .work-image{background:radial-gradient(ellipse,#48326f55,transparent),#14101e;border:1px solid #5c4674;border-radius:20px}.case-summary{border-color:#47374f}
.motion-toggle{position:fixed;right:18px;bottom:18px;z-index:35;border-radius:50px;border:1px solid #78638f;background:#171120ec;color:#e3d6f5;padding:9px 14px;font:10px var(--mono);box-shadow:0 4px 20px #0005;min-height:40px}
/* Entrance becomes an orbital chamber. Motion is gentle, never a strobe. */
.brand-intro::before,.brand-intro::after{background:#07070f}.intro-grid{background-image:radial-gradient(#d9beff50 1px,transparent 1px);background-size:65px 65px;opacity:.3;mask-image:radial-gradient(ellipse,#000,transparent 80%)}
.intro-universe{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;overflow:hidden;z-index:0}
.intro-universe i{position:absolute;width:min(85vw,830px);aspect-ratio:1;border-radius:50%;border:1px solid #c7a3ff44;box-shadow:0 0 80px #7d48e016,inset 0 0 80px #7d48e016;transform:rotateX(55deg) rotate(-30deg)}
.intro-universe i:before{content:'';position:absolute;inset:-1px;border-radius:50%;border:2px solid transparent;border-top-color:#ba92ff;filter:drop-shadow(0 0 12px #b38aff);animation:orbit-flow 16s linear infinite}
.intro-universe i:nth-child(2){transform:rotateX(55deg) rotate(45deg) scale(1.4)}.intro-universe i:nth-child(3){transform:rotateY(55deg) rotate(30deg) scale(1.1)}.intro-universe i:nth-child(4){transform:rotateY(55deg) rotate(-40deg) scale(1.4)}
.intro-universe i:nth-child(even):before{border-top-color:#8fe7ee;animation-direction:reverse;animation-duration:22s}
.intro-portal{opacity:.2}.intro-wordmark{font-size:clamp(76px,14vw,168px);text-shadow:0 0 65px #be99ff25}.intro-wordmark span{color:#c5a3ff}.intro-emblem>span{border-color:#c5a3ff66;box-shadow:0 0 35px #c5a3ff15}.intro-tagline{color:#c5bad5}.intro-line{background:linear-gradient(90deg,transparent,#bf9cff,transparent)}
.intro-enter{background:#2b2040;border-color:#d1b1ff80;box-shadow:0 0 60px #b289ff20}.intro-enter:hover{background:#402a5d;box-shadow:0 0 70px #b289ff45}.enter-arrow{background:#d3b4ff;color:#170e25}.intro-caption,.intro-invitation{color:#c0afcf}.is-entering .intro-universe{animation:neon-warp 1.15s ease-in both}
@keyframes orbit-flow{to{transform:rotate(360deg)}}@keyframes neon-warp{to{transform:scale(3);opacity:0;filter:blur(5px)}}
body.motion-paused .energy-orbit:before,body.motion-paused .intro-universe i:before,body.motion-paused .stack-track,body.motion-paused .live-dot{animation-play-state:paused!important}body.motion-paused .brand-intro.is-entering *,body.motion-paused .brand-intro.is-entering:before,body.motion-paused .brand-intro.is-entering:after{animation-play-state:running!important}
@media(max-width:850px){.hero{padding-top:60px}.hero h1{font-size:clamp(64px,10vw,100px)}.hero-inner{gap:28px}.energy-field{inset:220px -400px 0}.energy-label{display:none}.hero-machine{margin-top:0}.hero-foot{margin-top:18px}.work-meta h3{font-size:21px}}
@media(max-width:620px){.hero{padding-top:44px}.hero h1{font-size:clamp(52px,12.8vw,78px);line-height:1.02;letter-spacing:-.065em}.hero h1 br:first-child{display:none}.hero-copy>p:not(.eyebrow){font-size:13px;padding-inline:10px}.hero .eyebrow{font-size:8px;letter-spacing:.1em}.hero-machine{padding:20px 5px}.hero-actions{gap:10px}.hero-inner{gap:22px}.energy-field{opacity:.65}.intro-universe i{width:115vw}.intro-wordmark{font-size:88px}.work-card{padding:10px;border-radius:16px}.work-grid{gap:28px}.contact h2{font-size:56px}.motion-toggle{right:10px;bottom:10px;font-size:9px}.section-top h2{font-size:40px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.energy-orbit:before,.intro-universe i:before{transform:rotate(35deg)}.motion-toggle{display:none}}

/* Rendering fix: brand content is visible on its first frame, at any height. */
.brand-intro{height:100%;height:100dvh;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:#07070f}
.brand-intro.is-entering{background:transparent}
.intro-center{position:relative;inset:auto;min-height:100%;height:auto;padding:28px 20px 62px;justify-content:center;gap:0}
.intro-center>*{flex-shrink:0;max-width:100%}
.intro-emblem,.intro-wordmark,.intro-tagline,.intro-line,.intro-emblem>span{animation:none!important;opacity:1;filter:none;transform:none}
.intro-emblem{display:grid!important;width:clamp(42px,10dvh,72px);height:clamp(42px,10dvh,72px)}
.intro-emblem img{width:80%;height:80%;object-fit:contain}.intro-emblem>span{border-radius:20px}
.intro-wordmark{font-size:min(25vw,18dvh,144px);line-height:1.15;margin:18px 0 14px;text-shadow:none;white-space:nowrap}
.intro-tagline{font-size:clamp(12px,2.1dvh,18px);line-height:1.5;overflow-wrap:anywhere}
.intro-line{margin-top:16px}.intro-enter{margin-top:20px;min-height:52px}.intro-invitation{margin-top:12px;font-size:10px}
.intro-caption{position:relative;display:block;inset:auto;margin:-34px 12px 14px;text-align:center;font-size:8px;line-height:1.5}
.intro-universe i{width:min(90vw,720px);transform:rotate(-25deg) scaleY(.68);box-shadow:none}
.intro-universe i:nth-child(2){transform:rotate(45deg) scaleY(.68)}
.intro-universe i:nth-child(n+3),.intro-portal{display:none}
.intro-universe i:before,.energy-orbit:before{filter:none}.intro-universe i:before{animation-duration:24s}.intro-universe i:nth-child(even):before{animation-duration:30s}
.energy-core{filter:none}.energy-orbit{box-shadow:none}.energy-orbit.orbit-three{display:none}
.site-header{backdrop-filter:none;background:#080910fa}
body.intro-active .energy-orbit:before,body.intro-active .stack-track,body.intro-active .live-dot{animation-play-state:paused!important}
.energy-field.is-offscreen .energy-orbit:before{animation-play-state:paused!important}
.is-entering .intro-center{animation:clean-depart .45s ease-in both;filter:none}
.is-entering .intro-universe{animation:clean-orbit-exit .65s ease-in both}
@keyframes clean-depart{to{opacity:0;transform:translateY(-12px)}}
@keyframes clean-orbit-exit{to{opacity:0;transform:scale(1.3)}}
@media(max-width:620px){.intro-universe i{width:105vw}.energy-orbit.orbit-two:before{animation:none}.intro-wordmark{font-size:min(25vw,18dvh,88px)}}
@media(max-height:460px){.intro-center{padding-block:16px 40px}.intro-emblem{width:42px;height:42px}.intro-wordmark{margin:10px 0 8px;font-size:min(22vw,15dvh,70px)}.intro-line{margin-top:8px}.intro-enter{margin-top:12px;min-height:48px}.intro-invitation{margin-top:8px}.intro-caption{font-size:7px;margin-top:-25px}}
@media(prefers-reduced-motion:reduce){.brand-intro *,.brand-intro:before,.brand-intro:after{animation:none!important;transition:none!important}}

/* The brand sits in front of the orbits, with a softly lit, opaque medallion. */
.brand-intro .intro-grid{z-index:0}.brand-intro .intro-universe{z-index:1}
.brand-intro .intro-center{z-index:5;isolation:isolate}
.intro-emblem{isolation:isolate;z-index:2;border-radius:50%;background:#100d1c;overflow:visible}
.intro-emblem::before{content:'';position:absolute;inset:-110%;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#f0d0a633 0%,#c6a3ff40 23%,#aa77ff24 40%,#86dbf010 56%,transparent 72%)}
.intro-emblem::after{content:'';position:absolute;inset:-8px;z-index:0;pointer-events:none;border-radius:50%;border:1px solid #e9c9ff50;box-shadow:0 0 18px #c8a0ff25,inset 0 0 14px #d7b7ff15}
.intro-emblem>span{z-index:1;border-radius:50%;background:radial-gradient(circle at 40% 25%,#352542,#100d1c 75%);border:1px solid #ead3af99;box-shadow:0 0 20px #d3b0ff30}
.intro-emblem img{position:relative;z-index:2}
.intro-wordmark{position:relative;z-index:1;isolation:isolate}
.intro-wordmark::before{content:'';position:absolute;inset:-.12em -.4em;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#07070f 52%,#07070fed 65%,transparent 76%)}