/* Shared interaction and motion layer. All content remains visible without JS. */
.site-header nav a{position:relative;padding-block:8px}
.site-header nav a::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,#a77af0,#5583ed);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.site-header nav a:hover::after,.site-header nav a[aria-current=page]::after{transform:scaleX(1)}
.button,.contact-top,.copy-email{transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease}
.button:hover{box-shadow:0 9px 34px #8b61d342;transform:translateY(-3px)}
.button>span:last-child,.text-link>span:last-child,.hero-more>span:last-child,.email-link>span,.community-links a>span:last-child{display:inline-block;transition:transform .25s ease}
.button:hover>span:last-child,.text-link:hover>span:last-child,.hero-more:hover>span:last-child,.email-link:hover>span{transform:translate(3px,-3px)}
.hero-actions .button:hover>span:last-child{transform:none}
.screenshot-button{overflow:hidden}.screenshot-button img{transition:transform .55s ease}.screenshot-button:hover img{transform:scale(1.025)}
.gallery-thumbs button{transition:border-color .25s,box-shadow .25s}.gallery-thumbs button:hover{border-color:#a081d8;box-shadow:0 0 22px #8f60b125}
.social-links a{transition:color .2s,transform .2s}.social-links a:hover{transform:translateY(-2px)}
.contact-preview{max-width:570px;color:#bfb1d1;font-size:14px;line-height:1.9;margin:-12px 0 26px}.contact-section .button{margin-bottom:10px}
.reveal-ready{transition:opacity .7s ease,translate .7s cubic-bezier(.22,.68,0,1);transition-delay:var(--reveal-delay,0ms)}
.reveal-ready.is-pending{opacity:0;translate:0 24px}
.hero-copy>.eyebrow{animation:entrance .7s both}.hero-copy>h1{animation:entrance .85s .1s both}.hero-intro{animation:entrance .85s .2s both}.hero-actions{animation:entrance .85s .3s both}.hero-bottom{animation:entrance .9s .4s both}
.hero::before{animation:ambient-light 10s ease-in-out infinite alternate}
.scroll-link>span:last-child{animation:scroll-cue 2.6s ease-in-out infinite}
.studio-symbol::before{animation:frame-drift 14s ease-in-out infinite alternate}.studio-symbol::after{animation:frame-drift-back 17s ease-in-out infinite alternate}
.studio-symbol img{animation:cube-float 7s ease-in-out infinite}
.media-dialog[open]{animation:dialog-in .25s ease-out}
@keyframes entrance{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
@keyframes ambient-light{from{opacity:.45}to{opacity:1}}
@keyframes scroll-cue{0%,65%,100%{transform:translateY(0)}78%{transform:translateY(6px)}90%{transform:translateY(2px)}}
@keyframes frame-drift{from{transform:rotate(-8deg)}to{transform:rotate(-2deg)}}
@keyframes frame-drift-back{from{transform:rotate(8deg)}to{transform:rotate(3deg)}}
@keyframes cube-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes dialog-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
/* Dedicated contact page. */
.contact-body .site-header{border-bottom:1px solid #272135}
.contact-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:55px;align-items:center;padding-top:76px;padding-bottom:75px}
.contact-hero-copy{min-width:0}.contact-hero h1{font-size:clamp(47px,5.1vw,74px);line-height:1.07;margin:26px 0;max-width:730px}
.contact-lead{font-size:14px;line-height:1.9;max-width:510px;color:#bab0c9}
.direct-contact{padding-top:29px;margin-top:28px;border-top:1px solid #393047;display:flex;flex-direction:column;align-items:flex-start;gap:17px}
.direct-contact .email-link{font-size:clamp(17px,2.2vw,28px)}.direct-contact .small-label{font-size:8px;letter-spacing:.15em}.direct-contact .copy-email{font-size:9px;padding:9px 12px}
.contact-art{position:relative;isolation:isolate;aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(ellipse at center,#28223e,transparent 68%);min-width:0}
.contact-art::before{content:'';position:absolute;inset:20%;border-radius:50%;background:#8254cc1a;filter:blur(30px);animation:ambient-light 6s ease-in-out infinite alternate;z-index:-1}
.contact-cube{position:relative;width:52%;image-rendering:pixelated;animation:cube-float 6.5s ease-in-out infinite;filter:drop-shadow(0 18px 24px #0005)}
.contact-orbit{position:absolute;inset:12%;border:1px solid #584574;transform:rotate(-12deg)}.orbit-one{animation:orbit-drift 20s ease-in-out infinite alternate}.orbit-two{inset:23%;border-color:#344b79;transform:rotate(20deg);animation:orbit-return 16s ease-in-out infinite alternate}
.contact-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible;stroke-width:1}.route-base{stroke:#393246}.route-flow{stroke:#aa82e7;stroke-dasharray:6 20;animation:route-flow 16s linear infinite}.route-node{fill:#a786e1;stroke:none;transform-box:fill-box;transform-origin:center;animation:node-pulse 4s ease-in-out infinite}.node-two{animation-delay:1.3s;fill:#5e85d7}.node-three{animation-delay:2.6s}
.contact-art-label{position:absolute;left:8%;bottom:0;font:8px/1.8 var(--mono);letter-spacing:.08em;color:#a99abb}.contact-art-plus{position:absolute;right:10%;top:0;color:#9f87c0;font:28px var(--mono)}
@keyframes orbit-drift{from{transform:rotate(-12deg)}to{transform:rotate(2deg)}}
@keyframes orbit-return{from{transform:rotate(20deg)}to{transform:rotate(9deg)}}
@keyframes route-flow{to{stroke-dashoffset:-260}}
@keyframes node-pulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.3);opacity:1}}
.contact-topics{padding-block:30px 80px}.contact-topics h2{font-size:clamp(31px,3.3vw,46px);border-top:1px solid var(--line);padding-top:28px;margin-bottom:30px}
.contact-topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.contact-topic{border:1px solid #342b43;background:linear-gradient(135deg,#1c1529,#11101b);padding:27px 24px;display:flex;flex-direction:column;transition:border-color .3s,transform .3s,box-shadow .3s}.contact-topic:hover{border-color:#83699f;transform:translateY(-5px);box-shadow:0 14px 38px #0002}
.topic-index{font:9px var(--mono);letter-spacing:.1em;color:#aa8bcc}.contact-topic h3{font-size:25px;line-height:1.15;margin:25px 0 18px}.contact-topic p{font-size:12px;line-height:1.9;color:#b7abc6;margin-bottom:24px}.contact-topic .text-link{margin-top:auto;font-size:11px;gap:12px}
.contact-community{padding:65px 0;background:radial-gradient(ellipse at 80% 60%,#27203f,transparent 65%),#14101f;border-block:1px solid #33283e}.community-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:16%;align-items:center}.contact-community h2{font-size:clamp(40px,4.8vw,65px);margin:24px 0}.contact-community p:not(.eyebrow){color:#b8aac5;font-size:13px;line-height:1.9;max-width:390px}.community-links{display:flex;flex-direction:column}.community-links a{padding:14px 0;border-bottom:1px solid #4b3b5b;display:flex;justify-content:space-between;align-items:center;font-size:14px;transition:color .25s,padding .25s}.community-links a:first-child{border-top:1px solid #4b3b5b}.community-links a>span:last-child{color:#b495dd}.community-links a:hover{color:#c3a3f7;padding-inline:8px}.community-links a:hover>span:last-child{transform:translate(3px,-3px)}
@media(max-width:1100px){.site-header nav{gap:20px}.contact-hero{gap:25px}.contact-hero h1{font-size:53px}.contact-topic{padding:24px 19px}.contact-topic-grid{gap:15px}.contact-topic h3{font-size:23px}}
@media(max-width:760px){.contact-hero{grid-template-columns:1fr;gap:20px;padding-top:42px;padding-bottom:45px}.contact-hero h1{font-size:clamp(43px,10.8vw,63px)}.contact-lead{font-size:13px}.direct-contact .email-link{font-size:clamp(17px,4.9vw,26px)}.contact-art{width:min(390px,100%);margin:10px auto 0}.contact-art-label{font-size:7px}.contact-topics{padding-bottom:50px}.contact-topics h2{font-size:35px}.contact-topic-grid{grid-template-columns:1fr;gap:15px}.contact-topic{padding:26px}.contact-topic h3{margin:19px 0 15px;font-size:27px}.contact-topic p{font-size:13px}.contact-topic .text-link{font-size:12px}.contact-community{padding:45px 0}.community-grid{grid-template-columns:1fr;gap:30px}.contact-community h2{font-size:47px}.community-links a{font-size:14px}.site-header{flex-wrap:wrap;min-height:106px;height:auto!important;row-gap:11px;column-gap:16px;padding-block:14px}.site-header .brand{order:0}.site-header .header-end{order:1;margin-left:auto}.site-header nav{order:2;width:100%;justify-content:space-between;gap:10px;font-size:10px}.site-header nav a:nth-child(2){display:block}.site-header nav a{padding:5px 0}.hero{margin-top:-106px}.hero-content{padding-top:155px}.contact-preview{font-size:13px;margin-top:0}.contact-body .site-header,.press-body .site-header{border-bottom:1px solid #30263d}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal-ready.is-pending{opacity:1;translate:none}}

/* Quiet atmosphere: the illustration moves, the reading surface stays still. */
.hero::before{background:radial-gradient(ellipse at 37% 48%,#48316a5c,transparent 60%);animation:atmosphere-drift 18s ease-in-out infinite alternate}
.hero-art{translate:0 var(--scene-scroll,0px)}
.hero-art .portrait{translate:var(--scene-x,0px) var(--scene-y,0px);animation:scene-breathe 24s ease-in-out infinite alternate;transform-origin:68% 58%}
.hero .accent-line{background:linear-gradient(90deg,#ba92f9,#557fdf,#ba92f9);background-size:200% 100%;animation:route-glimmer 7s ease-in-out infinite}
.feature-index::after{background:linear-gradient(90deg,#6f61b6,#c5a7ff,#5275d7,#6f61b6);background-size:220% 100%;animation:route-glimmer 7s ease-in-out infinite}
.reading-progress{position:fixed;z-index:90;inset:0 0 auto;height:2px;background:linear-gradient(90deg,#8268da,#84a8ff);transform-origin:left;transform:scaleX(var(--reading,0));pointer-events:none;opacity:.8}
.light-panel{position:relative;isolation:isolate}
.light-panel::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(330px circle at var(--pointer-x,50%) var(--pointer-y,50%),#c4a3ff19,transparent 68%);opacity:0;transition:opacity .45s ease}
.light-panel.pointer-active::after{opacity:1}.light-panel:focus-within::after{opacity:.55}
.mechanic-tabs.has-step-indicator{position:relative}
.mechanic-tabs.has-step-indicator::before{content:'';position:absolute;bottom:-1px;left:0;height:2px;width:var(--step-width,0px);transform:translateX(var(--step-left,0px));background:linear-gradient(90deg,#bd8bfa,#5b8cf4);box-shadow:0 0 11px #996df04d;transition:transform .4s cubic-bezier(.22,.68,0,1),width .4s ease}
.mechanic-tabs.has-step-indicator button[aria-pressed=true]::after{display:none}
.mechanic-tabs button{transition:color .25s ease}.mechanic-tabs button:hover{color:#e1cefc}
.gallery-strip.has-arrived .gallery-thumbs button{animation:gallery-arrive .65s both}.gallery-strip.has-arrived .gallery-thumbs button:nth-child(2){animation-delay:65ms}.gallery-strip.has-arrived .gallery-thumbs button:nth-child(3){animation-delay:130ms}.gallery-strip.has-arrived .gallery-thumbs button:nth-child(4){animation-delay:195ms}
.contact-topic.reveal-ready:nth-child(2){transition-delay:70ms}.contact-topic.reveal-ready:nth-child(3){transition-delay:140ms}
@keyframes scene-breathe{from{scale:1}to{scale:1.018}}
@keyframes atmosphere-drift{from{opacity:.55;translate:-12px 5px}to{opacity:.95;translate:14px -8px}}
@keyframes route-glimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes gallery-arrive{from{opacity:.35;translate:0 9px}to{opacity:1;translate:0 0}}
/* Decorative animation sleeps when it cannot be seen. Entrance transitions remain intact. */
.hero:not(.scene-visible)::before,.hero:not(.scene-visible) .portrait,.hero:not(.scene-visible) .accent-line,.hero:not(.scene-visible) .feature-index::after,.hero:not(.scene-visible) .scroll-link>span:last-child,.studio-symbol:not(.scene-visible)::before,.studio-symbol:not(.scene-visible)::after,.studio-symbol:not(.scene-visible) img,.contact-art:not(.scene-visible) *,.contact-art:not(.scene-visible)::before{animation-play-state:paused}
.motion-background *,.motion-background *::before,.motion-background *::after{animation-play-state:paused!important}
@media(max-width:760px),(hover:none){.hero-art{translate:none}.hero-art .portrait{translate:none;animation-duration:30s}.light-panel::after{display:none}}
@media(prefers-reduced-motion:reduce){.hero-art,.hero-art .portrait{translate:none;scale:none}.hero::before{translate:none}.reading-progress,.light-panel::after{display:none}}