:root{--bg:#0d0a0b;--wine:#3a0e18;--wine2:#5c1424;--gold:#d6a84f;--gold2:#f3d48f;--ink:#f4ece1;--mute:#b9a99a}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:400 18px/1.65 Inter,system-ui,sans-serif}
h1,h2,h3,.logo{font-family:"Playfair Display",Georgia,serif}a{color:var(--gold2)}
.wrap{max-width:1140px;margin:auto;padding:0 24px}.center{text-align:center}
.nav{position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;background:linear-gradient(#0d0a0bee,#0d0a0b00)}
.logo{font-size:26px;font-weight:800;color:var(--ink);text-decoration:none}.logo span{color:var(--gold);font-style:italic}
.nav nav{display:flex;gap:26px;align-items:center}.nav nav a{color:var(--ink);text-decoration:none;font-size:15px;letter-spacing:.04em}.nav nav a:hover{color:var(--gold2)}
.pill{border:1px solid var(--gold);padding:8px 16px;border-radius:99px}.burger{display:none;background:none;border:0;color:var(--ink);font-size:28px;cursor:pointer}
.hero{min-height:100vh;position:relative;overflow:hidden;display:flex;align-items:center;padding:120px 8vw 80px;background:radial-gradient(ellipse at 75% 40%,#7a1c2e 0%,var(--wine) 35%,var(--bg) 75%)}
.hero:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#0000 0 60px,#0000001a 60px 62px);pointer-events:none}
.vinyl{position:absolute;right:-12vw;top:50%;width:min(70vw,780px);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,var(--gold) 0 9%,#1a1013 9.5% 10.5%,#0a0708 11%),repeating-radial-gradient(circle,#ffffff08 0 1px,#0000 2px 5px);background-blend-mode:screen;box-shadow:0 0 120px #d6a84f33;animation:spin 18s linear infinite}
@keyframes spin{to{transform:translateY(-50%) rotate(360deg)}}@media (prefers-reduced-motion:reduce){.vinyl{animation:none}html{scroll-behavior:auto}}
.hero-in{position:relative;z-index:2;max-width:640px}
.eyebrow{text-transform:uppercase;letter-spacing:.3em;font-size:13px;color:var(--gold);font-weight:600;margin:0 0 12px}
h1{font-size:clamp(64px,11vw,148px);line-height:.9;margin:0 0 20px}h1 em{color:var(--gold);font-weight:600}
.tag{font-size:clamp(20px,2.2vw,26px);color:var(--mute);margin:0 0 28px}
.newsingle{display:flex;flex-direction:column;gap:2px;border-left:3px solid var(--gold);padding:6px 0 6px 16px;margin-bottom:30px}.newsingle strong{font-family:"Playfair Display";font-size:26px}
.badge{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold2)}.muted{color:var(--mute);font-size:15px}
.ctas{display:flex;flex-wrap:wrap;gap:14px}
.btn{font:600 16px Inter;padding:14px 26px;border-radius:99px;border:1px solid var(--gold);background:none;color:var(--ink);cursor:pointer;text-decoration:none;transition:.2s}
.btn:hover,.btn:focus-visible{background:#d6a84f22;outline:none}.btn.gold{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#1a0d10;border:0}.btn.gold:hover{filter:brightness(1.1)}.btn.sm{padding:9px 18px;font-size:14px}
.scroll{position:absolute;bottom:24px;left:50%;color:var(--gold);font-size:32px;text-decoration:none;z-index:2}
.sec{padding:110px 0}.sec.dark{background:linear-gradient(180deg,#160b0e,var(--wine) 140%)}h2{font-size:clamp(36px,5vw,58px);line-height:1.1;margin:0 0 40px}
.timeline{list-style:none;padding:0;margin:0;position:relative}.timeline:before{content:"";position:absolute;left:110px;top:0;bottom:0;width:2px;background:linear-gradient(var(--gold),#d6a84f22)}
.timeline li{display:grid;grid-template-columns:110px 1fr;column-gap:44px;padding:0 0 38px;position:relative}
.timeline li:after{content:"";position:absolute;left:104px;top:8px;width:14px;height:14px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px #d6a84f33}
.timeline span{font:700 22px "Playfair Display";color:var(--gold)}.timeline h3{margin:0;font-size:24px;grid-column:2}.timeline p{margin:4px 0 0;color:var(--mute);grid-column:2}
.note,.sample{font-size:14px;color:var(--gold2);border:1px dashed var(--gold);padding:10px 14px;border-radius:10px;display:inline-block}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}.tabs button{font:500 15px Inter;background:none;border:1px solid #ffffff33;color:var(--ink);border-radius:99px;padding:8px 18px;cursor:pointer}.tabs button.on{background:var(--gold);color:#1a0d10;border-color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:26px}
.vid{background:#0d0a0b99;border:1px solid #d6a84f33;border-radius:16px;overflow:hidden}
.thumb{position:relative;aspect-ratio:16/9;display:block;width:100%;border:0;padding:0;cursor:pointer;background:#000 center/cover}
.thumb:after{content:"▶";position:absolute;inset:0;margin:auto;width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:#d6a84fe6;color:#1a0d10;font-size:24px;transition:.2s}.thumb:hover:after{transform:scale(1.1)}
.vid iframe{width:100%;aspect-ratio:16/9;border:0;display:block}.vid .meta{padding:14px 18px}.vid h3{margin:0;font-size:19px}.vid p{margin:2px 0 0;font-size:14px;color:var(--mute)}
.dates{list-style:none;padding:0;margin:24px 0 0}.dates li{display:grid;grid-template-columns:auto 170px 1fr auto;gap:22px;align-items:center;padding:22px 0;border-bottom:1px solid #ffffff1f}
.dates b{font-size:11px;letter-spacing:.15em;color:#1a0d10;background:var(--gold2);padding:3px 8px;border-radius:4px}.dates time{font:600 20px "Playfair Display";color:var(--gold)}.dates strong{display:block}.dates span{color:var(--mute);font-size:15px}
.two{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}
blockquote{margin:0;font:italic 600 28px/1.4 "Playfair Display";border-left:3px solid var(--gold);padding-left:28px}cite{display:block;margin-top:14px;font:500 15px Inter;color:var(--gold)}
.store{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.item h3{margin:14px 0 0}.item p{margin:0;color:var(--mute);font-size:15px}
.art{aspect-ratio:1;border-radius:16px;display:grid;place-items:center;font:800 64px "Playfair Display";color:var(--gold2)}.a1{background:radial-gradient(circle,#2a1a1d 30%,#0a0708 31%)}.a2{background:linear-gradient(135deg,var(--wine2),#14080b)}.a3{background:linear-gradient(135deg,#3b2a12,#0d0a0b)}
.pending{display:inline-block;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#1a0d10;background:var(--gold2);padding:6px 14px;border-radius:99px;margin-bottom:24px}
.lead{max-width:680px;margin:auto;font-size:21px;color:var(--mute)}
.join{background:radial-gradient(ellipse at center,var(--wine2),var(--bg) 70%)}.signup{display:flex;gap:12px;max-width:520px;margin:30px auto 0}
.signup input{flex:1;min-width:0;font:16px Inter;padding:14px 20px;border-radius:99px;border:1px solid var(--gold);background:#0d0a0bcc;color:var(--ink)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
footer{padding:50px 0;border-top:1px solid #d6a84f33;text-align:center;font-size:15px}footer p{margin:8px 0}
.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#0d0a0bd9;backdrop-filter:blur(6px);padding:20px}.modal[hidden]{display:none}
.card{position:relative;max-width:440px;width:100%;text-align:center;padding:40px 32px 32px;border-radius:22px;background:linear-gradient(160deg,var(--wine2),#14080b);border:1px solid var(--gold);box-shadow:0 30px 80px #000a;animation:pop .25s ease}
@keyframes pop{from{transform:scale(.92);opacity:0}}.card h3{font-size:30px;margin:10px 0}.card p{color:var(--mute)}
.disc{width:64px;height:64px;margin:auto;border-radius:50%;background:radial-gradient(circle,var(--gold) 0 18%,#0a0708 20%);box-shadow:0 0 30px #d6a84f55}
.x{position:absolute;top:12px;right:16px;background:none;border:0;color:var(--gold);font-size:30px;cursor:pointer}
@media (max-width:860px){.burger{display:block}.nav{padding:14px 20px;background:#0d0a0bf2}.nav nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;padding:20px;background:#0d0a0bf8;gap:18px}.nav.open nav{display:flex}
.hero{padding:110px 24px 70px;min-height:92vh}.vinyl{width:120vw;right:-60vw;opacity:.55}.sec{padding:80px 0}.two,.store{grid-template-columns:1fr}
.timeline:before{left:6px}.timeline li{grid-template-columns:1fr;padding-left:34px}.timeline li:after{left:0}.timeline h3,.timeline p{grid-column:1}
.dates li{grid-template-columns:auto 1fr;gap:8px 14px}.dates li div{grid-column:1/-1}.dates li .btn{grid-column:1/-1;justify-self:start}.grid{grid-template-columns:1fr}.signup{flex-direction:column}}
