html,body{width:100%;height:100%;overflow:hidden;background:#080b0d}body.mysterium-threshold{margin:0;color:#e8e2d7}.threshold-world{position:relative;width:100%;height:100%;font-family:'Manrope',sans-serif;background:#080b0d}.threshold-scene,.vestibule-scene{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}.threshold-scene{isolation:isolate;background:#090d10}.threshold-scene:before{content:"";position:absolute;inset:-4%;z-index:-3;background:url('mysterium-temple-v1.png') center/cover no-repeat;filter:saturate(.72) brightness(.58);transform:scale(1.04);animation:threshold-breathe 15s ease-in-out infinite alternate}.threshold-scene:after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 47%,transparent 0 12%,#080b0d52 38%,#080b0ded 88%),linear-gradient(0deg,#080b0ddd 0%,transparent 40%,#080b0d70 100%)}.threshold-atmosphere{position:absolute;inset:0;pointer-events:none;z-index:-1}.threshold-light{position:absolute;width:28vw;height:60vh;left:50%;top:47%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#a7a2c728 0%,#77759b10 45%,transparent 72%);filter:blur(18px);animation:light-pulse 8s ease-in-out infinite}.threshold-grain{position:absolute;inset:0;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.82' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.threshold-inscription{text-align:center;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-shadow:0 3px 30px #000}.threshold-kicker{margin:0 0 24px;font:italic 500 clamp(15px,1.5vw,21px) 'Cormorant Garamond',serif;color:#cec6b9;letter-spacing:.04em;opacity:.82}.threshold-inscription h1{font:500 clamp(58px,9vw,132px)/.76 'Cormorant Garamond',serif;letter-spacing:.16em;margin:0 0 20px .16em}.threshold-subtitle{font:500 clamp(15px,1.4vw,20px) 'Cormorant Garamond',serif;letter-spacing:.32em;text-transform:uppercase;margin:0;color:#b79c87}.threshold-sigil{width:92px;height:92px;margin:38px 0 27px;border:1px solid #ba805e70;border-radius:50%;display:grid;place-items:center;position:relative;box-shadow:0 0 45px #7e6e9622}.threshold-sigil:before,.threshold-sigil:after{content:"";position:absolute;inset:11px;border:1px solid #ba805e42;border-radius:50%;transform:rotate(38deg) scaleY(1.35)}.threshold-sigil:after{transform:rotate(-38deg) scaleX(1.35)}.threshold-sigil span{font:38px 'Cormorant Garamond',serif;z-index:1}.threshold-triad{font:500 10px 'DM Mono',monospace;letter-spacing:.28em;color:#c09a7f;margin:0 0 34px}.threshold-triad i{font-style:normal;color:#81766f;margin:0 7px}.threshold-enter{position:relative;border:0;background:transparent;color:#eee9df;font:500 11px 'DM Mono',monospace;letter-spacing:.38em;padding:19px 30px 18px 34px;cursor:pointer}.threshold-enter:before,.threshold-enter:after{content:"";position:absolute;left:0;right:0;height:1px;background:#ba805e75;transition:.6s}.threshold-enter:before{top:0}.threshold-enter:after{bottom:0}.threshold-enter:hover:before,.threshold-enter:hover:after{left:18%;right:18%;background:#ddd0c3}.threshold-enter span{display:block;transition:.5s}.threshold-enter:hover span{letter-spacing:.48em}.threshold-whisper{position:absolute;bottom:4vh;left:50%;transform:translateX(-50%);font:8px 'DM Mono',monospace;letter-spacing:.25em;text-transform:uppercase;opacity:.32}.threshold-transition{position:fixed;inset:0;z-index:20;pointer-events:none;display:grid;place-items:center;opacity:0}.threshold-transition:before,.threshold-transition:after{content:"";position:absolute;top:0;bottom:0;width:51%;background:#020304}.threshold-transition:before{left:0;--side:-1;transform:translateX(-101%)}.threshold-transition:after{right:0;--side:1;transform:translateX(101%)}.threshold-transition span{width:1px;height:0;background:#c5a083;z-index:1;box-shadow:0 0 28px #c5a083;opacity:0}.is-crossing .threshold-transition{opacity:1}.is-crossing .threshold-transition:before,.is-crossing .threshold-transition:after{animation:doors-close 1.5s cubic-bezier(.76,0,.24,1) forwards}.is-crossing .threshold-transition span{animation:seam 1.5s ease forwards}.is-crossing .threshold-scene{animation:approach 1.5s ease-in forwards}.vestibule-scene{visibility:hidden;opacity:0;background:#05080a url('mysterium-temple-v1.png') center 32%/cover no-repeat;transform:scale(1.08)}.vestibule-scene:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,#0b11156b,#05080af2 78%)}.vestibule-copy{z-index:2;text-align:center;opacity:0}.vestibule-copy p{font:9px 'DM Mono',monospace;letter-spacing:.3em;text-transform:uppercase;color:#ba805e}.vestibule-copy h2{font:500 clamp(52px,7vw,102px)/.86 'Cormorant Garamond',serif;letter-spacing:-.03em;margin:25px 0}.vestibule-copy span{display:block;color:#a8aaa7;font:italic 18px 'Cormorant Garamond',serif}.threshold-return{margin-top:45px;border:0;border-bottom:1px solid #ba805e80;background:none;color:#b9b2a8;padding:12px 3px;font:9px 'DM Mono',monospace;letter-spacing:.19em;cursor:pointer}.has-crossed .threshold-scene{visibility:hidden}.has-crossed .vestibule-scene{visibility:visible;animation:reveal-space 2s ease forwards}.has-crossed .vestibule-copy{animation:reveal-copy 1.4s .7s ease forwards}.is-returning .threshold-transition:before,.is-returning .threshold-transition:after{animation:doors-close 1.2s cubic-bezier(.76,0,.24,1) forwards}.is-returning .threshold-transition{opacity:1}@keyframes threshold-breathe{to{transform:scale(1.085)}}@keyframes light-pulse{50%{opacity:.55;transform:translate(-50%,-50%) scale(.9)}}@keyframes doors-close{0%{transform:translateX(calc(var(--side)*101%))}55%,100%{transform:translateX(0)}}@keyframes seam{35%{height:0;opacity:0}70%{height:72vh;opacity:1}100%{height:100vh;opacity:0}}@keyframes approach{to{transform:scale(1.18);filter:blur(5px);opacity:.35}}@keyframes reveal-space{0%{opacity:0;transform:scale(1.08);filter:blur(8px)}100%{opacity:1;transform:scale(1);filter:none}}@keyframes reveal-copy{to{opacity:1}}@media(max-width:600px){.threshold-scene:before{background-position:52% center}.threshold-inscription h1{font-size:58px;letter-spacing:.1em;margin-left:.1em}.threshold-kicker{font-size:16px}.threshold-subtitle{font-size:13px}.threshold-sigil{width:76px;height:76px;margin:30px 0 24px}.threshold-whisper{display:none}.vestibule-copy{padding:24px}.vestibule-copy h2{font-size:54px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-delay:0ms!important;scroll-behavior:auto!important}}
