/* The entrance is a mechanism: turn the wheel, retract the bolts, open the doors. */
#intro.intro-v2{--wheel-size:clamp(210px,31svh,285px);background:#120d0a;perspective:1800px;isolation:isolate}
#intro.intro-v2::after{left:calc(50% - 1px);width:2px;z-index:2;opacity:.7;background:#ffb6c9;box-shadow:0 0 13px 2px #e4778d80,0 0 75px 8px #df668634;transition:none}
#intro .intro-door{z-index:1;inset:0 auto 0 0;width:50%;border:0;background:repeating-linear-gradient(0deg,#ffffff02 0 1px,transparent 1px 3px),linear-gradient(112deg,#221c15 0%,#4b3c2c 18%,#30261d 35%,#594332 70%,#34231c 98%,#926c4f 99%,#1a100d 100%);box-shadow:inset 0 0 110px #0d080acc;transform-origin:0% 50%;transition:transform 1.75s cubic-bezier(.68,.02,.15,1) 1s;will-change:transform}
#intro .door-right{left:50%;transform-origin:100% 50%;background:repeating-linear-gradient(0deg,#ffffff02 0 1px,transparent 1px 3px),linear-gradient(248deg,#221c15 0%,#4b3c2c 18%,#30261d 35%,#594332 70%,#34231c 98%,#926c4f 99%,#1a100d 100%)}
#intro .door-inset{position:absolute;inset:22px 26px 22px 22px;border:1px solid #b68c5144;border-radius:15px 4px 4px 15px;box-shadow:inset 0 0 0 5px #211b1470,inset 0 0 0 6px #c69c6850,inset 0 0 0 8px #100b0870,inset 0 0 55px 12px #100c0970,0 1px 0 #c0a1762e;background:linear-gradient(126deg,#7c5d3c0a,#110b0810)}
#intro .door-inset::before{content:'';position:absolute;inset:21px;border:1px solid #b79d6624;border-radius:9px 0 0 9px;box-shadow:0 1px 0 #0005;clip-path:polygon(0 0,100% 0,100% 21%,85% 21%,85% 79%,100% 79%,100% 100%,0 100%)}
#intro .door-right .door-inset{inset:22px 22px 22px 26px;border-radius:4px 15px 15px 4px}
#intro .door-right .door-inset::before{transform:scaleX(-1)}
#intro .door-stamp{position:absolute;bottom:73px;left:50px;color:#b39a7055;font:9px/1.8 Mono,monospace;letter-spacing:2px;text-shadow:0 1px #0008;transform:rotate(-90deg);transform-origin:left bottom;white-space:nowrap}
#intro .door-stamp small{font-size:5px;letter-spacing:1.6px}
#intro .door-right .door-stamp{left:auto;right:50px;transform:rotate(90deg);transform-origin:right bottom}
#intro .door-hinges{position:absolute;inset:0 auto 0 0;width:28px}
#intro .door-right .door-hinges{left:auto;right:0}
#intro .door-hinges i{position:absolute;left:0;width:28px;height:64px;border:1px solid #866a4566;border-radius:4px;background:linear-gradient(90deg,#14100d,#a08a5b 32%,#4b3a29 51%,#211a13 80%);box-shadow:5px 5px 14px #0008,inset 0 4px #8c775338,inset 0 -4px #15100c}
#intro .door-hinges i:nth-child(1){top:17%}#intro .door-hinges i:nth-child(2){top:calc(50% - 32px)}#intro .door-hinges i:nth-child(3){bottom:17%}
#intro .door-right .door-hinges i{transform:scaleX(-1)}
#intro .vault-bolts{position:absolute;inset:0 -26px 0 auto;width:76px;z-index:2}
#intro .vault-bolts i{position:absolute;right:0;width:76px;height:18px;border-radius:3px 6px 6px 3px;border:1px solid #baa77e70;background:linear-gradient(#9e8359 0%,#d1b68b 16%,#77603d 32%,#392b1d 72%,#a1875b 94%,#21160e 100%);box-shadow:0 6px 8px #0008;transition:transform .55s cubic-bezier(.67,0,.22,1) .45s}
#intro .vault-bolts i::before{content:'';position:absolute;left:-12px;top:-6px;width:23px;height:28px;border:2px solid #291c13;border-right:4px solid #8e6c45;border-radius:3px;background:#493523;box-shadow:2px 2px 6px #0008}
#intro .vault-bolts i:nth-child(1){top:14%}#intro .vault-bolts i:nth-child(2){top:50%}#intro .vault-bolts i:nth-child(3){top:87%}
#intro .door-right .vault-bolts{left:-26px;right:auto;transform:scaleX(-1)}
#intro .door-right .vault-bolts i:nth-child(1){top:17%}#intro .door-right .vault-bolts i:nth-child(2){top:53%}#intro .door-right .vault-bolts i:nth-child(3){top:90%}
#intro .door-rivet{position:absolute;left:54px;width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,#9f875f 42%,#3a2919 43% 56%,#9f875f 57%);border:1px solid #1d140d;box-shadow:1px 2px 3px #0009}
#intro .door-right .door-rivet{left:auto;right:54px}#intro .rivet-top{top:54px}#intro .rivet-bottom{bottom:54px}
#intro .intro-frame{position:absolute;inset:0;z-index:3;pointer-events:none;border:12px solid #120f0c;box-shadow:inset 0 0 0 2px #86725244,inset 0 0 0 5px #0c0907,inset 0 0 28px 7px #0009;transition:opacity .4s 2.1s}
#intro .intro-frame i{position:absolute;width:65px;height:65px;border:1px solid #b5945c22;clip-path:polygon(0 0,100% 0,100% 5%,5% 5%,5% 100%,0 100%)}
#intro .intro-frame i:nth-child(1){top:5px;left:5px}#intro .intro-frame i:nth-child(2){top:5px;right:5px;transform:rotate(90deg)}#intro .intro-frame i:nth-child(3){bottom:5px;right:5px;transform:rotate(180deg)}#intro .intro-frame i:nth-child(4){bottom:5px;left:5px;transform:rotate(270deg)}
#intro .intro-light-spill{position:absolute;inset:-10%;z-index:0;opacity:0;background:radial-gradient(ellipse at center,#ffe0e8cc 0%,#ec8aa9a0 15%,#79385250 36%,transparent 64%);transform:scaleX(.03);pointer-events:none}
#intro .intro-top{left:48px;top:35px;z-index:5;gap:25px;transition:opacity .35s}
#intro .intro-top img{width:98px;height:auto;filter:drop-shadow(0 2px #0a0706)}
#intro .intro-top span{font-size:7px;letter-spacing:1.25px;color:#c3a27b}
#intro .intro-skip{right:43px;top:37px;z-index:5;font-size:8px;letter-spacing:1px;transition:opacity .35s}
#intro .intro-content{inset:113px 25px 84px;z-index:4;justify-content:center;opacity:1;transform:none;transition:none;pointer-events:none}
#intro .intro-eyebrow{font-size:8px;letter-spacing:2px;color:#c4ad8c;gap:10px;transition:opacity .35s,translate .55s}
#intro .intro-eyebrow .status-dot{width:4px;height:4px;background:#ffb8ce}
#intro h1{font:clamp(38px,5.3vw,80px)/1 Anton,sans-serif;letter-spacing:-.8px;margin:17px 0 26px;text-shadow:0 2px 3px #0008;transition:opacity .4s,translate .55s}
#intro h1 em{font:inherit;color:#efb3bc}
#intro .vault-lock{width:var(--wheel-size);height:var(--wheel-size);background:none;border:0;border-radius:50%;box-shadow:none;margin:0 0 39px;flex:none;color:#d9b682;pointer-events:auto;transform:none;transition:transform 1.75s cubic-bezier(.68,.02,.15,1) 1s,opacity .25s 2.25s;perspective:900px}
#intro .vault-lock:hover{box-shadow:none;transform:none}
#intro .vault-lock:focus-visible{outline:1px solid #e9c494;outline-offset:12px}
#intro .lock-chassis{display:block;position:absolute;inset:0;border:1px solid #af9062;border-radius:50%;background:conic-gradient(from 20deg,#302216,#8a6a45 12%,#d4b586 18%,#39291b 29%,#826744 48%,#ddbe8b 61%,#3c2c1d 76%,#aa8b60 91%,#302216);box-shadow:0 0 0 5px #120d09,0 0 0 7px #61462f,0 0 0 8px #c8a37455,0 15px 35px 12px #0008,inset 0 0 0 6px #312419,inset 0 0 0 7px #b39060,inset 0 0 0 12px #39291b,inset 0 0 0 13px #0c0806}
#intro .chassis-fastenings{position:absolute;inset:3%}
#intro .chassis-fastenings i{position:absolute;width:6px;height:6px;border-radius:50%;border:1px solid #332216;background:linear-gradient(135deg,#ceb080 40%,#46311c 41% 57%,#bd9d6d 58%);box-shadow:1px 1px 2px #0008}
#intro .chassis-fastenings i:nth-child(1){top:13%;left:13%}#intro .chassis-fastenings i:nth-child(2){top:13%;right:13%}#intro .chassis-fastenings i:nth-child(3){bottom:13%;left:13%}#intro .chassis-fastenings i:nth-child(4){bottom:13%;right:13%}
#intro .lock-outer{inset:9%;border:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,#d1b888 0deg 1deg,transparent 1deg 6deg);mask:radial-gradient(transparent 64%,#000 65% 70%,transparent 71%);opacity:.75;transform:rotate(0deg);transition:transform .95s cubic-bezier(.25,.1,.1,1)}
#intro .lock-numbers{position:absolute;inset:15%;border:1px solid #aa85532e;border-radius:50%;font:7px Mono,monospace;color:#bea174}
#intro .lock-numbers i{position:absolute;font-style:normal;line-height:1}
#intro .lock-numbers i:nth-child(1){top:2%;left:50%;translate:-50% 0}#intro .lock-numbers i:nth-child(2){right:2%;top:50%;translate:0 -50%;rotate:90deg}#intro .lock-numbers i:nth-child(3){bottom:2%;left:50%;translate:-50% 0;rotate:180deg}#intro .lock-numbers i:nth-child(4){left:2%;top:50%;translate:0 -50%;rotate:270deg}
#intro .wheel-rotor{position:absolute;inset:21%;display:block;transform:rotate(-15deg);transition:transform .95s cubic-bezier(.25,.1,.1,1);filter:drop-shadow(3px 7px 4px #0008)}
#intro .lock-inner{inset:0;border:9px solid #ac8857;box-shadow:inset 1px 1px 2px #ffe7ae99,inset -2px -3px 1px #402b19,0 -1px 1px #ead0a0,2px 4px 0 #291c10;border-radius:50%;background:none}
#intro .wheel-spokes{position:absolute;inset:10%;display:block}
#intro .wheel-spokes i{position:absolute;left:calc(50% - 5px);top:0;height:50%;width:10px;transform-origin:50% 100%;background:linear-gradient(90deg,#4c351e,#d0af76 28%,#ab8554 50%,#564026 90%);box-shadow:1px 0 1px #e0bd82;border-radius:3px}
#intro .wheel-spokes i:nth-child(2){transform:rotate(60deg)}#intro .wheel-spokes i:nth-child(3){transform:rotate(120deg)}#intro .wheel-spokes i:nth-child(4){transform:rotate(180deg)}#intro .wheel-spokes i:nth-child(5){transform:rotate(240deg)}#intro .wheel-spokes i:nth-child(6){transform:rotate(300deg)}
#intro .lock-core{position:absolute;inset:31%;display:grid;place-items:center;font:clamp(22px,3.6svh,32px)/1 Bricolage,sans-serif;font-weight:800;text-shadow:0 1px #f6d699,0 -1px #392515;background:linear-gradient(135deg,#ad8754,#e0bd86 35%,#98703f 65%,#5f4023);color:#5d3a20;border-radius:50%;border:1px solid #b39160;box-shadow:inset 0 0 0 3px #ac8350,inset 0 0 0 4px #5a3c22,0 3px 2px #1a100b;transition:transform .95s cubic-bezier(.25,.1,.1,1)}
#intro .lock-marker{position:absolute;top:3%;left:calc(50% - 3px);width:6px;height:8px;background:#f1c8ac;clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 0 2px #f1b9be)}
#intro .vault-lock:hover .wheel-rotor{transform:rotate(0deg)}
#intro .vault-lock:hover .lock-outer{transform:rotate(-12deg)}
#intro .lock-label{top:calc(100% + 22px);left:50%;font:8px/1.6 Mono,monospace;letter-spacing:1.8px;transform:translateX(-50%);color:#edcfab;transition:opacity .2s}
#intro .lock-label span{margin-left:13px;color:#f6b4c3;font:14px DM,sans-serif}
#intro .intro-caption{position:relative;font:7px/1.5 Mono,monospace;letter-spacing:1.5px;color:#a88c68;margin-top:22px;min-height:12px;transition:opacity .25s 1.1s}
#intro .lock-state-open{position:absolute;inset:0;opacity:0;color:#f6c5cf;white-space:nowrap}
#intro .intro-bottom{left:49px;right:49px;bottom:35px;z-index:5;color:#a68c69;font-size:7px;letter-spacing:1.2px;transition:opacity .35s}
.is-entering #intro.intro-v2{background:transparent;pointer-events:none}
.is-entering #intro .intro-content{opacity:1;transform:none}
.is-entering #intro .intro-top,.is-entering #intro .intro-bottom,.is-entering #intro .intro-skip{opacity:0}
.is-entering #intro .intro-eyebrow,.is-entering #intro h1{opacity:0;translate:0 -12px}
.is-entering #intro .wheel-rotor{transform:rotate(145deg)}
.is-entering #intro .lock-outer{transform:rotate(-70deg)}
.is-entering #intro .lock-core{transform:rotate(-160deg)}
.is-entering #intro .vault-bolts i{transform:translateX(-65px)}
.is-entering #intro .lock-label,.is-entering #intro .lock-state-closed{opacity:0}
.is-entering #intro .lock-state-open{opacity:1;transition:opacity .2s .6s}
.is-entering #intro .intro-caption{opacity:0}
.is-entering #intro .door-left{transform:translateX(-105%) rotateY(18deg)}
.is-entering #intro .door-right{transform:translateX(105%) rotateY(-18deg)}
.is-entering #intro .vault-lock{transform:translateX(-58vw) rotateY(18deg);opacity:0}
.is-entering #intro .intro-frame{opacity:0}
.is-entering #intro .intro-light-spill{animation:vault-light-v2 2.8s cubic-bezier(.2,.7,.2,1) forwards}
.is-entering #intro.intro-v2::after{animation:vault-seam-v2 2.8s ease forwards}
@keyframes vault-light-v2{0%,18%{opacity:0;transform:scaleX(.01)}30%{opacity:.5;transform:scaleX(.04)}50%{opacity:.75;transform:scaleX(.4)}72%{opacity:.4;transform:scaleX(1.1)}100%{opacity:0;transform:scaleX(1.4)}}
@keyframes vault-seam-v2{0%,20%{opacity:.7;box-shadow:0 0 13px 2px #e4778d80}35%{opacity:1;box-shadow:0 0 28px 8px #ffccdeaa,0 0 80px 20px #f296b680}45%{opacity:.9;transform:scaleX(2)}60%,100%{opacity:0;transform:scaleX(10)}}
@media(max-width:700px){
  #intro.intro-v2{--wheel-size:clamp(195px,29svh,250px)}
  #intro .intro-top{top:33px;left:32px}#intro .intro-top img{width:84px}#intro .intro-top span{display:none}#intro .intro-skip{right:24px;top:32px;font-size:7px}
  #intro .intro-content{inset:118px 20px 90px}#intro .intro-eyebrow{font-size:6px;letter-spacing:1.1px}
  #intro h1{font-size:clamp(41px,11vw,67px);max-width:360px;line-height:1.04;margin:19px 0 35px}#intro h1 em{display:block}
  #intro .door-inset{inset:19px 15px 19px 19px;border-radius:8px 2px 2px 8px}#intro .door-right .door-inset{inset:19px 19px 19px 15px;border-radius:2px 8px 8px 2px}#intro .door-inset::before{inset:16px 10px}
  #intro .door-stamp{display:none}#intro .door-hinges{width:21px}#intro .door-hinges i{width:21px;height:50px}#intro .door-hinges i:nth-child(2){top:calc(50% - 25px)}#intro .door-rivet{left:36px;width:7px;height:7px}#intro .door-right .door-rivet{right:36px}#intro .rivet-top{top:35px}#intro .rivet-bottom{bottom:35px}
  #intro .intro-frame{border-width:9px}#intro .intro-frame i{width:40px;height:40px}
  #intro .vault-bolts{width:52px;right:-15px}#intro .door-right .vault-bolts{left:-15px}#intro .vault-bolts i{width:52px;height:13px}#intro .vault-bolts i::before{height:23px;width:18px;top:-6px}
  #intro .intro-bottom{bottom:32px;left:32px;right:32px;font-size:6px;letter-spacing:.6px}#intro .intro-bottom>span:last-child{display:none}
  #intro .intro-caption{font-size:6px;letter-spacing:1px;margin-top:24px}#intro .lock-label{font-size:7px}
  .is-entering #intro .vault-bolts i{transform:translateX(-43px)}
  .is-entering #intro .vault-lock{transform:translateX(-100vw) rotateY(18deg)}
}
@media(max-height:650px){
  #intro.intro-v2{--wheel-size:165px}#intro .intro-content{inset:90px 20px 60px}#intro h1{font-size:45px;margin:14px 0 22px}#intro h1 em{display:inline}#intro .intro-eyebrow{font-size:6px;letter-spacing:1px}#intro .intro-caption{margin-top:15px;font-size:6px}#intro .vault-lock{margin-bottom:33px}#intro .lock-label{top:calc(100% + 17px);font-size:7px}#intro .intro-top{top:26px}#intro .intro-skip{top:25px}#intro .intro-bottom{bottom:25px}#intro .intro-top img{width:78px}#intro .lock-core{font-size:24px}
}
@media(max-width:360px){
  #intro .intro-top{left:27px}#intro .intro-skip{right:21px}#intro .intro-content{inset:105px 15px 77px}#intro .intro-eyebrow{font-size:5.5px;letter-spacing:.8px}#intro h1{font-size:40px}#intro .intro-bottom{left:27px;right:27px;font-size:5px}#intro .intro-caption{font-size:5.5px;letter-spacing:.7px}
}
@media(max-height:480px){
  #intro.intro-v2{--wheel-size:135px}#intro .intro-content{inset:73px 20px 40px}#intro h1{font-size:31px;margin:9px 0 16px}#intro .intro-eyebrow{display:none}#intro .intro-caption{display:none}#intro .intro-top{top:21px}#intro .intro-skip{top:20px}#intro .intro-bottom{bottom:22px;font-size:5px}#intro .lock-label{font-size:6px;top:calc(100% + 15px)}#intro .vault-lock{margin-bottom:26px}#intro .lock-inner{border-width:6px}#intro .wheel-spokes i{width:6px;left:calc(50% - 3px)}#intro .lock-numbers{font-size:5px}#intro .lock-core{font-size:20px}
}
@media(prefers-reduced-motion:reduce){
  #intro.intro-v2 *,#intro.intro-v2::after{animation:none!important;transition:none!important}#intro .vault-lock:hover .wheel-rotor{transform:rotate(-15deg)}#intro .vault-lock:hover .lock-outer{transform:none}
}
