/* The visual stage keeps the original demo's full-screen editorial grammar, without its framed portal. */
.experience{perspective:1600px;isolation:isolate}
.backgrounds{overflow:hidden;transform-style:preserve-3d}
.background{background-position:center;will-change:transform,opacity,filter;transform:scale(1.05);transition:none}
.background.is-visible{transform:scale(1.05)}
.background.is-departing{z-index:3;animation:camera-depart 1.12s cubic-bezier(.65,0,.35,1) both}
.background.is-incoming{z-index:2;animation:camera-arrive 1.12s cubic-bezier(.65,0,.35,1) both}
@keyframes camera-depart{0%{opacity:1;filter:blur(0);transform:perspective(1600px) scale(1.05) rotateY(0) translateX(0)}48%{opacity:1;filter:blur(1px);transform:perspective(1600px) scale(1.22) rotateY(-3deg) translateX(-2%)}100%{opacity:0;filter:blur(12px);transform:perspective(1600px) scale(1.55) rotateY(-7deg) translateX(-8%)}}
@keyframes camera-arrive{0%{opacity:0;filter:blur(14px);transform:perspective(1600px) scale(.78) rotateY(8deg) translateX(7%)}47%{opacity:0;filter:blur(9px);transform:perspective(1600px) scale(.88) rotateY(4deg) translateX(3%)}100%{opacity:1;filter:blur(0);transform:perspective(1600px) scale(1.05) rotateY(0) translateX(0)}}
.camera-flash{position:absolute;inset:0;z-index:4;background:linear-gradient(90deg,transparent 17%,#ffffff30 50%,transparent 83%);opacity:0;pointer-events:none;mix-blend-mode:screen}
.experience.is-switching .camera-flash{animation:camera-flash 1.12s ease both}
@keyframes camera-flash{0%,30%,74%,100%{opacity:0}51%{opacity:.42}}
.scene-shade{z-index:4;background:linear-gradient(180deg,#0008 0,transparent 22%,transparent 43%,#0009 78%,#000 100%),linear-gradient(90deg,#0007 0,transparent 42%,#0003 100%)}
.scene-grain{z-index:4}
.scene-list{z-index:7;gap:10px}
.scene-list span{display:flex;align-items:center;gap:10px;min-height:22px;color:#e8e8e5a0;font-size:15px;transition:color .35s,transform .7s}
.scene-list span:before{content:'';width:12px;height:12px;flex:none}
.scene-list span.active{color:#fff;font-size:17px;font-weight:700;transform:translateX(3px)}
.scene-list span.active:before{border-radius:50%;background:#fff}
.brain-stage{left:50%;top:43%;width:min(640px,46vw);height:min(540px,60vh);transform:translate(-50%,-50%);z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.brain-stage-label,.brain-stage-bottom{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.18em;font-weight:700;text-shadow:0 2px 12px #000}
.brain-stage-label{top:5px}.brain-stage-bottom{bottom:0}.brain-stage-bottom span:last-child{font-size:12px}
.brain-stage:before{content:'';position:absolute;inset:5% -4%;background:radial-gradient(ellipse,#0008 0,#0004 32%,transparent 67%);pointer-events:none}
.hero-brain{position:relative;width:100%;height:100%;filter:drop-shadow(0 10px 35px #000a);animation:brain-entrance 1.9s cubic-bezier(.16,1,.3,1) both}
.hero-brain .brain-svg{transform:scale(1.1)}
.hero-brain .hemisphere{transition:transform 1.05s cubic-bezier(.65,0,.35,1),opacity .8s ease;will-change:transform,opacity}
.experience.is-switching .hero-brain .left{transform:translateX(-46vw);opacity:0}
.experience.is-switching .hero-brain .right{transform:translateX(46vw);opacity:0}
.brain-stage-bottom{display:none}
.experience.is-switching .scene-content{opacity:0;filter:blur(9px);transform:translateY(35px)}
.scene-content{z-index:7;transition:opacity .5s ease,filter .5s ease,transform .65s cubic-bezier(.22,1,.36,1)}
.scene-content h1{font-family:'SF Pro Display','Helvetica Neue',Arial,sans-serif;font-weight:600;letter-spacing:-.09em;text-shadow:0 7px 24px #0005}
.scene-content .scene-summary{max-width:560px}
.scene-meta,.scene-progress,.scroll-cue{z-index:7}
.experience.is-ready .background[data-background="intelligence"]{animation:opening-camera 2.4s cubic-bezier(.16,1,.3,1) both}
@keyframes opening-camera{from{transform:scale(1.35) translateY(4%);filter:blur(9px)}to{transform:scale(1.05) translateY(0);filter:blur(0)}}
@keyframes brain-entrance{from{opacity:0;filter:blur(15px);transform:scale(.7)}to{opacity:1;filter:blur(0);transform:scale(1)}}
.preloader-brain{width:250px;height:250px;filter:drop-shadow(0 0 24px #ffffff25)}
.preloader-image{filter:brightness(.47);transform:scale(1.22);animation:preload-camera 2.5s cubic-bezier(.16,1,.3,1) both}
@keyframes preload-camera{to{transform:scale(1.05)}}
.preloader-center span{font-size:11px}
.custom-cursor.is-enter .cursor-label{opacity:1}
.principles{background:#181917;color:#eaeae6}
.principles-intro{display:grid;grid-template-columns:1fr 340px;gap:5vw;align-items:end;padding:80px 0 70px}
.principles-intro .eyebrow{grid-column:1/-1;margin:0}
.principles-intro h2{margin:0}
.principles-intro>p:last-child{font-size:15px;color:#aaa;max-width:340px}
.principles-rows{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #ffffff65}
.principles-rows article{min-height:280px;padding:25px 20px 20px 0;border-right:1px solid #ffffff40}
.principles-rows article+article{padding-left:20px}
.principles-rows article:last-child{border-right:0}
.principles-rows span{font-size:11px;letter-spacing:.15em;color:#aaa}
.principles-rows h3{font-size:clamp(25px,2.5vw,39px);font-weight:500;line-height:1.1;letter-spacing:-.065em;margin:45px 0 18px}
.principles-rows p{font-size:13px;color:#aaa;line-height:1.65}
@media(max-width:900px){.brain-stage{width:54vw;height:48vh;top:43%}.principles-intro{grid-template-columns:1fr}.principles-intro .eyebrow{grid-column:auto}.principles-rows{grid-template-columns:1fr 1fr}.principles-rows article:nth-child(2){border-right:0}.principles-rows article:nth-child(n+3){border-top:1px solid #ffffff40}}
@media(max-width:760px){.brain-stage{top:35%;width:min(350px,78vw);height:39vh}.brain-stage-label,.brain-stage-bottom{font-size:8px}.brain-stage-bottom span:last-child{font-size:10px}.hero-brain .brain-svg{transform:scale(1.16)}.scene-content{bottom:55px}.scene-content h1{font-size:clamp(90px,24vw,155px)}.scene-content .scene-summary{max-width:100%}.scene-list{display:none}.preloader-brain{width:175px;height:175px}.principles-rows{grid-template-columns:1fr}.principles-rows article,.principles-rows article+article{padding:22px 0;border-right:0;border-top:1px solid #ffffff40;min-height:0}.principles-rows h3{margin:20px 0 10px}.principles-rows p{max-width:550px}.principles-intro{padding:70px 0 45px}}
@media(max-width:420px){.brain-stage{top:32%;height:36vh}.scene-content h1{font-size:23vw}.scene-content .scene-summary{font-size:11px}}
@media(max-width:760px){.experience[data-scene="infrastructure"] .scene-content h1{font-size:clamp(58px,17vw,112px)}}
@media(prefers-reduced-motion:reduce){.background.is-departing,.background.is-incoming,.experience.is-ready .background,.hero-brain,.preloader-image{animation:none!important}.experience.is-switching .hero-brain .left,.experience.is-switching .hero-brain .right{transform:none;opacity:1}.experience.is-switching .scene-content{opacity:1;filter:none;transform:none}}
