@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#0c0812;--pink:#efa9d9;--purple:#ad80ee;--muted:#b4a8c0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#f7f0fa;font-family:Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #ffd0ee;outline-offset:5px}header{position:absolute;z-index:20;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:28px 5%}.brand{font-size:28px;font-weight:800;letter-spacing:-1.4px}.brand span{display:block;font-size:8px;letter-spacing:2.7px;margin-top:2px;font-weight:500}nav{display:flex;align-items:center;gap:30px;font-size:12px}nav .nav-cta{border:1px solid #ffffff32;padding:13px 20px;border-radius:30px;background:#ffffff08}.hero{height:min(1000px,100svh);min-height:760px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 45% 75%,#382044 0,transparent 58%),#0c0812}.intro{position:absolute;top:19%;left:7%;z-index:5;pointer-events:none}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.5px;color:var(--purple)}h1{font-size:clamp(36px,4.8vw,76px);line-height:1.08;font-weight:500;letter-spacing:-3px;margin:22px 0}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--pink)}.intro p{font-size:13px;line-height:1.9;color:var(--muted)}.world{position:absolute;inset:0;perspective:1200px;touch-action:pan-y}.halo{position:absolute;left:20%;top:19%;width:50%;height:70%;background:radial-gradient(ellipse,#8346ad28,transparent 65%);filter:blur(24px)}.floor{position:absolute;bottom:5%;left:15%;width:65%;height:15%;border-radius:50%;background:radial-gradient(ellipse,#a6599d30,transparent 65%);transform:rotate(-6deg)}#model{position:absolute;left:28%;bottom:2%;width:43%;height:80%;pointer-events:none}#model canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#fallback{width:100%;height:100%;object-fit:contain;transition:opacity .4s}.orbit{position:absolute;inset:0;transform-style:preserve-3d}.orbit-card{position:absolute;left:0;top:0;width:214px;height:146px;text-align:left;border:1px solid #bea2d336;background:linear-gradient(130deg,#3b2a46ee,#1c1325ee);border-radius:18px;padding:20px;box-shadow:0 12px 30px #0005;transform-origin:center;will-change:transform;backdrop-filter:blur(14px);display:flex;flex-direction:column;justify-content:space-between}.orbit-card[aria-current=true]{border-color:#d3a5ec;background:linear-gradient(125deg,#583570f2,#2c1b3ff5);box-shadow:0 0 35px #b06be52a,0 20px 45px #0007}.card-top{display:flex;justify-content:space-between;align-items:center;color:#d6b3f1;font-size:10px;letter-spacing:1.5px}.card-symbol{font-size:25px;letter-spacing:0}.orbit-card strong{font-size:19px;letter-spacing:-.5px;font-weight:500}.card-bottom{display:flex;justify-content:space-between;font-size:10px;color:#c9b8d4}.scene-controls{position:absolute;bottom:6%;right:8%;z-index:10;text-align:center}.arrows{display:flex;align-items:center;justify-content:center;gap:25px;margin:18px 0 12px}.arrows button{width:46px;height:46px;border:1px solid #ffffff30;border-radius:50%;background:#ffffff08;font-size:21px}.arrows button:hover{background:#9862c04a}#counter{font-size:10px;letter-spacing:3px;color:#d4c5df}.hint{font-size:10px;color:var(--muted)}.explore{position:absolute;bottom:6%;left:7%;font-size:11px;color:var(--muted);z-index:10}dialog{border:1px solid #bd9adb55;border-radius:24px;background:#20152bf5;color:#f7efff;max-width:520px;width:calc(100% - 32px);padding:45px;box-shadow:0 30px 100px #000b}dialog::backdrop{background:#08050cbf;backdrop-filter:blur(8px)}dialog h2{font-size:34px;font-weight:500;letter-spacing:-1px;margin:22px 0}dialog p{font-size:14px;line-height:1.9;color:#cabcd4;margin-bottom:30px}.close{position:absolute;right:15px;top:10px;background:none;border:0;font-size:28px}.button{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:14px 22px;border-radius:30px;background:#c499ed;color:#160c20;font-size:12px;font-weight:700}.button:hover{background:#dab5fb}.button.secondary{background:transparent;border:1px solid #b98fd660;color:#eadbf3}.formats{padding:100px 7%;background:linear-gradient(#100b17,#0c0812);border-top:1px solid #ffffff09}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px}.section-head h2,.closing h2{font-size:36px;letter-spacing:-1.4px;font-weight:500;margin:17px 0}.section-head p,.closing p{font-size:13px;line-height:1.8;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.course{padding:30px;border:1px solid #ffffff18;border-radius:20px;position:relative;background:#ffffff03}.course.featured{background:#7d44951a;border-color:#a477cc55}.number{font-size:9px;letter-spacing:1.8px;color:#bd9ad8}.course h3{font-size:25px;font-weight:500;letter-spacing:-.8px;min-height:64px;margin:24px 0 16px}.course p{font-size:12px;line-height:1.9;color:var(--muted);min-height:94px}.price{font-size:32px;margin-top:28px}.price small{font-size:12px;color:#b5a3c2}.price.custom-price{font-size:20px;padding-top:12px}.detail{font-size:10px;color:#a99ab5;margin:12px 0 25px}.pill{position:absolute;right:20px;top:25px;background:#b985d525;font-size:8px;padding:6px 10px;border-radius:20px;color:#d8b6ed}.course .button{width:100%}.closing{text-align:center;padding:40px 7% 100px}.closing .button{margin-top:20px}footer{border-top:1px solid #ffffff12;padding:35px 7%;display:flex;justify-content:space-between;gap:30px;align-items:center;font-size:11px;color:var(--muted)}footer p{font-size:9px;line-height:1.7}.business-details{max-width:460px}footer .brand{color:#e9def0}
@media(min-width:1400px){.intro{left:10%}.scene-controls{right:14%}}
@media(max-width:760px){header{padding:22px 6%}.brand{font-size:24px}nav>a:first-child{display:none}nav .nav-cta{font-size:10px;padding:11px 15px}.hero{height:900px;height:100svh;min-height:780px;max-height:1000px}.intro{top:14%;left:7%}h1{font-size:43px;letter-spacing:-2px;margin:14px 0}.intro p{font-size:11px}.intro .eyebrow{font-size:8px;letter-spacing:2px}#model{left:13%;width:74%;height:58%;bottom:12%}.halo{left:0;width:100%;top:20%}.floor{left:10%;width:80%;bottom:11%}.orbit-card{width:170px;height:119px;padding:15px;border-radius:14px}.orbit-card strong{font-size:16px}.card-top{font-size:8px}.card-symbol{font-size:20px}.card-bottom{font-size:9px}.scene-controls{bottom:3%;left:0;right:0}.scene-controls>.eyebrow{font-size:7px}.arrows{margin:12px 0 8px}.arrows button{height:40px;width:40px}.explore{display:none}.hint{font-size:9px}.formats{padding:65px 6%}.section-head{display:block}.section-head h2,.closing h2{font-size:30px}.section-head p{display:none}.cards{grid-template-columns:1fr;gap:16px}.course h3{min-height:0}.course p{min-height:0}.course{padding:27px}.closing{padding:30px 6% 65px}footer{flex-direction:column;align-items:start;padding:30px 6%;gap:20px}dialog{padding:38px 26px}dialog h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Spatial glass tiles: front, back and four visible edges. */
.world{perspective:1400px;perspective-origin:50% 48%}.orbit{transform-style:preserve-3d;pointer-events:none}.orbit-card,.orbit-card[aria-current=true]{width:300px;height:280px;padding:0;border:0;border-radius:22px;background:none;box-shadow:none;backdrop-filter:none;display:block;transform-style:preserve-3d;overflow:visible;pointer-events:auto}.tile-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;text-align:left;padding:24px;border:1px solid #e6caff77;border-radius:22px;transform:translateZ(6px);background:linear-gradient(135deg,#ccb0f018,#6f3eb932 50%,#ec8cc520);box-shadow:inset 1px 1px 2px #fff4,inset -1px -1px 2px #dc98ee30,0 15px 50px #0003;overflow:hidden;backface-visibility:hidden}.tile-back{position:absolute;inset:0;border:1px solid #c6a0f05c;border-radius:22px;transform:translateZ(-6px);background:linear-gradient(130deg,#4d268326,#b573cc16)}.tile-edge{position:absolute;display:block;background:linear-gradient(90deg,#e4c6ff55,#8f58be35,#ffd2ef60);border:1px solid #e4bcff44;backface-visibility:visible}.edge-right{right:-6px;top:22px;width:12px;height:calc(100% - 44px);transform:rotateY(90deg)}.edge-left{left:-6px;top:22px;width:12px;height:calc(100% - 44px);transform:rotateY(90deg)}.edge-top{left:22px;top:-6px;height:12px;width:calc(100% - 44px);transform:rotateX(90deg)}.edge-bottom{left:22px;bottom:-6px;height:12px;width:calc(100% - 44px);transform:rotateX(90deg)}.orbit-card[aria-current=true] .tile-face{border-color:#f3ccffae;box-shadow:inset 1px 1px 3px #fff5,inset 0 0 40px #cb85e714,0 0 35px #a369d519,0 20px 70px #0003}.tile-pattern{position:absolute;inset:-45%;pointer-events:none;background:repeating-conic-gradient(from 20deg at 50% 50%,transparent 0deg 24deg,#d491fa1c 25deg 27deg,transparent 28deg 42deg),radial-gradient(ellipse at 25% 30%,#d49de860,transparent 35%),radial-gradient(ellipse at 75% 60%,#764ac955,transparent 40%);animation:glassFlow 16s ease-in-out infinite alternate;animation-delay:var(--delay)}.tile-grain{position:absolute;inset:0;background-image:radial-gradient(#f2d4ff4d .65px,transparent .9px);background-size:7px 7px;opacity:.13;mask-image:radial-gradient(ellipse,black,transparent 75%);pointer-events:none}.tile-face:after{content:"";position:absolute;inset:-100%;background:linear-gradient(110deg,transparent 44%,#f4d4ff0d 48%,#fff2 50%,#f7c4ff0a 52%,transparent 56%);transform:translateX(-35%);animation:glassShine 9s ease-in-out infinite;animation-delay:var(--delay);pointer-events:none}.card-top{position:relative;color:#e0cfed;font-size:9px;letter-spacing:2px;display:block;z-index:1}.icon-core{position:relative;display:block;width:92px;height:92px;margin:10px auto 7px;color:#efd3ff;filter:drop-shadow(0 0 9px #d79affaa) drop-shadow(0 0 25px #945bda99);animation:iconGlow 5s ease-in-out infinite;animation-delay:var(--delay)}.icon-core svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.orbit-card strong{position:relative;font-size:28px;font-weight:500;letter-spacing:-1px;color:#fff4ff;text-shadow:0 2px 14px #150621;z-index:1}.card-bottom{position:relative;color:#e0cfe9;font-size:11px;margin-top:13px;z-index:1}.intro{top:16%;left:6%}.intro h1{font-size:clamp(32px,3.3vw,54px)}.intro p{font-size:12px}#model{left:28%;width:44%;height:85%;bottom:3%}.scene-controls{bottom:4%;right:0;left:0}.explore{bottom:6%}.hero .halo{left:18%;width:64%;background:radial-gradient(ellipse,#9a51b530,transparent 68%)}
@keyframes glassFlow{0%{transform:rotate(-12deg) scale(.9);opacity:.5}100%{transform:rotate(24deg) scale(1.15);opacity:.9}}@keyframes glassShine{0%,30%{transform:translateX(-38%)}75%,100%{transform:translateX(38%)}}@keyframes iconGlow{0%,100%{opacity:.8;filter:drop-shadow(0 0 5px #d79aff90) drop-shadow(0 0 17px #945bda70)}50%{opacity:1;filter:drop-shadow(0 0 13px #efa9eec0) drop-shadow(0 0 33px #a776deaa)}}
@media(max-width:760px){.hero{min-height:800px}.intro{top:13%;left:7%}.intro .eyebrow{font-size:7px}.intro h1{font-size:32px;line-height:1.06;margin:12px 0}.intro p{font-size:10px;line-height:1.6}.orbit-card,.orbit-card[aria-current=true]{width:250px;height:245px;border-radius:19px}.tile-face,.tile-back{border-radius:19px}.tile-face{padding:21px}.orbit-card strong{font-size:24px}.icon-core{width:77px;height:77px}.card-top{font-size:8px;letter-spacing:1.3px}.card-bottom{font-size:10px}#model{left:3%;width:94%;height:67%;bottom:10%}.scene-controls{bottom:3%}.hero .halo{left:0;width:100%}}
@media(prefers-reduced-motion:reduce){.tile-pattern,.tile-face:after,.icon-core{animation:none!important}}

#model canvas{opacity:0;transition:opacity .45s ease}#model canvas.model-ready{opacity:1}#fallback[hidden],#model-loading[hidden]{display:none!important}#model-loading{position:absolute;top:22%;left:0;width:100%;display:flex;gap:9px;justify-content:center;align-items:center;color:#c9acd9;font-size:10px;letter-spacing:.5px}.loading-dot{width:6px;height:6px;border-radius:50%;background:#dbb3f5;box-shadow:0 0 12px #ce8fed;animation:loadingPulse 1.5s ease-in-out infinite}@keyframes loadingPulse{50%{opacity:.3}}@media(prefers-reduced-motion:reduce){.loading-dot{animation:none}#model canvas{transition:none}}

/* Reveal the composed scene atomically, only after its first 3D frame. */
body.scene-loading{overflow:hidden}
body.scene-loading header,body.scene-loading main,body.scene-loading footer{opacity:0;visibility:hidden;pointer-events:none}
body.scene-ready header,body.scene-ready main,body.scene-ready footer{animation:sceneEntrance .8s ease both}
#site-loading{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:radial-gradient(ellipse at center,#2b153e 0,#0c0812 64%);transition:opacity .75s ease,visibility .75s}
#site-loading[hidden]{display:none}
.scene-ready #site-loading{opacity:0;visibility:hidden;pointer-events:none}
#site-loading strong{font-size:34px;letter-spacing:-1.5px}
.load-caption{font-size:11px;letter-spacing:1.2px;color:#c9acd9}
.load-orbit{position:relative;width:110px;height:110px;display:grid;place-items:center;margin-bottom:12px;perspective:400px}
.load-orbit span{font-size:42px;font-weight:700;color:#efd0f6;text-shadow:0 0 24px #bd7cde}
.load-orbit i{position:absolute;inset:0;border:1px solid #cd91ed77;border-radius:25px;box-shadow:inset 0 0 22px #bb68de22,0 0 20px #b669d922;animation:loaderTurn 2.8s linear infinite}
.load-orbit i:nth-child(2){inset:10px;animation-delay:-.9s;border-color:#efa9d977}
.load-orbit i:nth-child(3){inset:20px;animation-delay:-1.8s}
.load-track{width:110px;height:2px;background:#d9a3f022;overflow:hidden;margin-top:10px}
.load-track:after{content:'';display:block;width:45%;height:100%;background:#eac2ff;animation:loadSweep 1.7s ease-in-out infinite}
@keyframes loaderTurn{from{transform:rotateZ(-25deg) rotateY(0)}to{transform:rotateZ(-25deg) rotateY(360deg)}}
@keyframes loadSweep{0%{transform:translateX(-110%)}100%{transform:translateX(330%)}}
@keyframes sceneEntrance{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.load-orbit i,.load-track:after,body.scene-ready header,body.scene-ready main,body.scene-ready footer{animation:none}#site-loading{transition:none}}

/* Two depth layers let the far half of the ring pass behind the character. */
.world>.rear-orbit{z-index:1;transform-style:flat}
.world>#model{z-index:2}
.world>#orbit{z-index:3;transform-style:flat}
.world>.halo,.world>.floor{z-index:0}

/* Approved studio background, shared character/prop canvas and discreet credits. */
.hero{background-image:linear-gradient(180deg,#0c081226,transparent 38%,#0c08120a 80%,#100b17),url('./studio.webp');background-size:100% 100%,auto 100%;background-repeat:no-repeat;background-position:center;background-color:#0c0812}
.world>#model{inset:0;width:100%;height:100%;bottom:auto;left:0}
.hero .halo{opacity:.3}.hero .floor{opacity:.2}
.asset-credits{padding:0 7% 28px;color:#a99ab5;font-size:10px;line-height:1.8;background:#0c0812}
.asset-credits details{max-width:850px}.asset-credits summary{cursor:pointer;width:fit-content;padding:8px 0}.asset-credits a{text-decoration:underline;text-underline-offset:3px}
body.scene-loading .asset-credits{visibility:hidden}
@media(max-width:760px){.hero{background-size:100% 100%,100% 100%}}
