:root{--accent-deep:#751b32;--gold:#c6a46c;--fg:#f5f1eb;--muted:#aaa4a0}.intro{position:fixed;inset:0;z-index:100;background:radial-gradient(ellipse at 50% 44%,#28141a,#0a0908 58%);display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}.intro-top{display:flex;justify-content:space-between;align-items:center;padding:28px 5%;font-size:10px;letter-spacing:.15em;color:#c6a46c}.intro button:not(.intro-record){color:#f5f1eb;background:none;border:0;padding:12px;letter-spacing:.12em;font-size:10px}.intro-stage{display:grid;place-items:center;position:relative;min-height:0;perspective:900px}.vinyl{border-radius:50%;background:radial-gradient(circle at 50% 50%,transparent 0 21%,#151316 21.5% 25%,transparent 26%),repeating-radial-gradient(circle,#181719 0 1px,#292629 2px,#111013 3px,#1a181a 4px);box-shadow:0 25px 90px #000c,inset 0 0 12px #8885;position:relative;display:grid;place-items:center}.vinyl:before{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 15deg,transparent 0deg,#fff1 35deg,transparent 75deg,transparent 160deg,#fff2 205deg,transparent 245deg)}.intro-record{width:min(55vh,65vw,510px);aspect-ratio:1;border:1px solid #444;animation:vinyl-spin 1.8s linear infinite}.vinyl-label{width:34%;aspect-ratio:1;background:radial-gradient(circle,#942d43,#751b32 65%,#4d1423);border-radius:50%;border:1px solid #c6a46c77;display:grid;place-items:center;position:relative;box-shadow:inset 0 0 20px #0006}.vinyl-label img{width:70%;opacity:.9}.spindle{position:absolute;width:7%;aspect-ratio:1;border-radius:50%;background:#090809;box-shadow:0 0 0 3px #a99b83}.intro-arm,.deck-arm{position:absolute;z-index:2;right:17%;top:9%;width:5px;height:35%;background:linear-gradient(90deg,#4c4540,#e3d9c1,#4a433e);transform-origin:50% 8%;transform:rotate(-25deg);transition:transform 1.1s ease;box-shadow:2px 3px 8px #0009}.intro-arm:before,.deck-arm:before{content:'';position:absolute;width:25px;height:25px;border-radius:50%;top:-10px;left:-10px;background:radial-gradient(circle,#a9a095,#282421)}.intro-arm i,.deck-arm i{position:absolute;bottom:-12px;left:-4px;width:13px;height:30px;background:#b6aa98;transform:rotate(16deg);border-radius:2px}.intro.active .intro-arm{transform:rotate(17deg)}.intro-copy{text-align:center;padding:12px 20px 40px}.intro-copy>span{font-size:12px;letter-spacing:.25em;color:#c6a46c}.intro-copy h2{font-size:clamp(20px,4vw,40px);letter-spacing:.02em;margin:8px 0}.intro-copy button{margin-top:8px;border-bottom:1px solid #c6a46c!important}.intro-tunnel{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0}.intro-tunnel i{position:absolute;border:1px solid #c6a46c55;border-radius:50%;width:8%;aspect-ratio:1}.intro.zoom .intro-record{animation:plunge 1.8s cubic-bezier(.5,0,.8,1) forwards}.intro.zoom .intro-tunnel{opacity:1}.intro.zoom .intro-tunnel i{animation:tunnel 1.8s ease-in forwards}.intro.zoom .intro-tunnel i:nth-child(2){animation-delay:.15s}.intro.zoom .intro-tunnel i:nth-child(3){animation-delay:.3s}.intro.zoom .intro-tunnel i:nth-child(4){animation-delay:.45s}.intro.zoom .intro-copy,.intro.zoom .intro-top,.intro.zoom .intro-arm{opacity:0;transition:opacity .4s}.intro.leaving{opacity:0;transition:opacity .35s}.experience-section{padding:70px 0;border-bottom:1px solid #ffffff1a}.experience-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:35px}.experience-head h2{margin:14px 0 0}.experience-head>p{max-width:360px;font-size:13px}.deck{display:grid;grid-template-columns:1.1fr 1fr;background:#141110;border:1px solid #ffffff18;min-height:470px}.deck-body{background:linear-gradient(135deg,#2b2624,#151210 60%,#24201e);position:relative;min-height:430px;display:grid;place-items:center;overflow:hidden}.deck-platter{width:min(74%,430px);aspect-ratio:1;border-radius:50%;padding:3%;background:linear-gradient(120deg,#888078,#1e1b1a 30%,#777067 55%,#1e1b1a);box-shadow:0 20px 50px #0008}.deck-record{width:100%;height:100%;animation:vinyl-spin 1.8s linear infinite;animation-play-state:paused}.deck.playing .deck-record{animation-play-state:running}.deck-arm{height:50%;top:10%;right:13%;transform:rotate(-18deg)}.deck.engaged .deck-arm{transform:rotate(20deg)}.deck-mark{position:absolute;bottom:20px;left:24px;color:#c6a46c;font-size:10px;letter-spacing:.17em}.deck-info{padding:clamp(25px,5vw,65px);align-self:center}.deck-info h3{font-size:35px;margin:15px 0}.deck-info p{font-size:13px}.deck-info canvas{width:100%;height:60px;display:block;margin:25px 0 10px}.demo-seek{display:flex;gap:15px;align-items:center;margin-bottom:22px}.demo-seek input{flex:1}.module-grid,.membership-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff1c;border:1px solid #ffffff1c}.module-grid article,.membership-cards article{background:#141110;padding:30px;min-height:200px;transition:background .2s,transform .2s}.module-grid article:hover,.membership-cards article:hover{background:#211719}.module-grid span,.membership-cards span{font-size:10px;color:#c6a46c;letter-spacing:.12em}.module-grid h3,.membership-cards h3{margin:25px 0 12px}.module-grid p,.membership-cards p{font-size:12px;min-height:40px}.module-grid a,.membership-cards a{color:#c6a46c;font-size:11px}.membership-cards article:nth-child(2){background:#29141b}.membership-cards article:nth-child(3){box-shadow:inset 0 2px #c6a46c}.replay-intro{display:block;margin:25px auto;background:none;border:0;color:#c6a46c;font-size:11px;padding:12px}@keyframes vinyl-spin{to{transform:rotate(360deg)}}@keyframes plunge{0%{transform:scale(1) rotate(0)}100%{transform:scale(38) rotate(55deg)}}@keyframes tunnel{0%{transform:scale(.1);opacity:0}25%{opacity:.75}100%{transform:scale(25);opacity:0}}@media(max-width:800px){.deck{grid-template-columns:1fr}.deck-body{min-height:350px}.experience-head{display:block}.experience-head>p{margin-top:20px}.module-grid,.membership-cards{grid-template-columns:1fr 1fr}.intro-arm{right:10%}}@media(max-width:500px){.module-grid,.membership-cards{grid-template-columns:1fr}.deck-body{min-height:300px}.experience-section{padding:50px 0}.intro-record{width:min(70vw,48vh)}.intro-copy{padding-bottom:25px}}@media(prefers-reduced-motion:reduce){.intro-record,.deck-record{animation:none}.intro.zoom .intro-record,.intro.zoom .intro-tunnel i{animation:none}.intro-arm,.deck-arm{transition:none}}
/* Keep the tonearm anchored to the record, regardless of viewport aspect ratio. */
.intro-stage{--record-size:min(55vh,65vw,510px)}
.intro-record{width:var(--record-size)}
.intro-arm{right:auto;left:calc(50% + var(--record-size)*.53);top:calc(50% - var(--record-size)*.48);height:calc(var(--record-size)*.53);width:6px;transform-origin:50% 3%;transform:rotate(-5deg);border-radius:4px;background:linear-gradient(90deg,#433c39,#ded4c4 42%,#6d625d);transition:transform 1s cubic-bezier(.25,.1,.25,1),opacity .4s;box-shadow:2px 5px 8px #000a}
.intro-arm:before{width:26px;height:26px;top:-10px;left:-10px;background:radial-gradient(circle at 40% 35%,#d1c8bb,#726a62 38%,#302b28 70%);box-shadow:0 2px 8px #0009}
.intro-arm i{height:27px;width:14px;left:-4px;bottom:-14px;transform:rotate(17deg);background:linear-gradient(90deg,#77716b,#e2d6c3,#625c55);border-radius:2px;box-shadow:1px 3px 4px #0008}
.intro.active .intro-arm{transform:rotate(31deg)}
@media(max-width:500px){.intro-stage{--record-size:min(70vw,48vh)}.intro-arm{left:calc(50% + var(--record-size)*.51)}}
/* Animate the vector-like CSS artwork at its rendered size instead of enlarging a rasterized layer. */
.intro.zoom .intro-record{animation:plunge-clean 1.8s cubic-bezier(.5,0,.8,1) forwards;max-width:none;flex:none}
@keyframes plunge-clean{from{width:var(--record-size)}to{width:calc(var(--record-size) * 38)}}
@media(prefers-reduced-motion:reduce){.intro.zoom .intro-record{animation:none}}
/* Keep the spindle at the center while the record grows. */
.intro.zoom .intro-record{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0}
