@font-face{font-family:'Kaushan Script';src:url('../fonts/Kaushan-Script.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{--bg:#0c0c0e;--panel:#141416;--ink:#eceae4;--dim:#9b978c;--gold:#d8b25c;--line:rgba(236,234,228,.13)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Futura','Century Gothic','Avenir Next',Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6}
.caps{letter-spacing:.3em;text-transform:uppercase}
.hand{font-family:'Kaushan Script','Snell Roundhand',cursive;letter-spacing:.04em}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
a{color:inherit;text-decoration:none}
header{position:fixed;top:0;left:0;right:0;z-index:30;padding:18px 0;background:linear-gradient(rgba(12,12,14,.94),rgba(12,12,14,.55) 70%,transparent)}
nav{display:flex;justify-content:space-between;align-items:center}
.brand{display:flex;align-items:center;gap:13px;font-size:12px;font-weight:300;letter-spacing:.3em;text-transform:uppercase}
.brand img{width:24px;height:24px}
nav ul{display:flex;gap:28px;list-style:none}
nav a{font-size:11px;color:var(--dim);font-weight:300;transition:.2s;letter-spacing:.22em;text-transform:uppercase}
nav a:hover{color:var(--gold)}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.mosaic{position:absolute;inset:-2%;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;filter:brightness(.32) saturate(.75)}
.mosaic img{width:100%;height:100%;object-fit:cover;min-height:0}
.hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(12,12,14,.25) 0%,rgba(12,12,14,.88) 78%)}
.hero-in{position:relative;z-index:2;padding:80px 20px}
.hero .star{width:120px;margin:0 auto 32px;animation:spin 90s linear infinite;display:block;filter:drop-shadow(0 0 18px rgba(216,178,92,.35))}
@keyframes spin{to{transform:rotate(360deg)}}
.hero h1{font-size:clamp(30px,5.6vw,58px);font-weight:300;letter-spacing:.3em;text-transform:uppercase}
.hero .tag{margin-top:16px;font-size:12px;color:var(--gold);letter-spacing:.42em;text-transform:uppercase;font-weight:300}
.hero p{max-width:520px;margin:26px auto 0;color:#c9c5ba;font-size:15.5px;font-weight:300}
.hero .cta-row{margin-top:34px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
section{padding:92px 0}
.eyebrow{font-size:10px;color:var(--gold);margin-bottom:14px;font-weight:400;letter-spacing:.3em;text-transform:uppercase}
h2{font-size:clamp(22px,3.4vw,34px);font-weight:400;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}
.lede{color:var(--dim);font-weight:300;max-width:600px;margin-bottom:48px;font-size:15.5px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{position:relative;overflow:hidden;aspect-ratio:1/1;background:var(--panel);display:block}
.card img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.82);transition:.6s}
.card:hover img{transform:scale(1.06);filter:saturate(1.05) brightness(.95)}
.card .veil{position:absolute;inset:0;background:linear-gradient(185deg,transparent 46%,rgba(12,12,14,.92));display:flex;flex-direction:column;justify-content:flex-end;padding:20px}
.card h3{font-size:15px;font-weight:400;letter-spacing:.07em;text-transform:uppercase}
.card .note{font-family:'Kaushan Script','Snell Roundhand',cursive;color:var(--gold);font-size:15px;letter-spacing:.04em;font-weight:400;margin-top:7px;line-height:1.3}
.card .mini{width:13px;height:13px;object-fit:contain;margin-bottom:10px;opacity:.9}
.tracks{background:var(--panel);border:1px solid var(--line);max-width:760px;margin:0 auto}
.track{display:flex;align-items:center;gap:20px;padding:16px 26px;border-bottom:1px solid var(--line)}
.track:last-child{border-bottom:none}
.track:hover{background:rgba(236,234,228,.04)}
.track .thumb{width:52px;height:52px;object-fit:cover;flex-shrink:0;border:1px solid var(--line)}
.pbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--gold);background:none;color:var(--gold);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px;cursor:pointer;transition:.2s}
.pbtn:hover{background:var(--gold);color:var(--bg)}
.pbtn.playing{background:var(--gold);color:var(--bg)}
.track .t-name{flex:1;font-weight:300;letter-spacing:.05em}
.track .t-name b{font-weight:400}
.track .t-name span{display:block;font-size:10.5px;color:var(--dim);letter-spacing:.22em;text-transform:uppercase;margin-top:4px}
.track a.t-name:hover b{color:var(--gold)}
.len{color:var(--dim);font-size:12px;font-weight:300}
.about{max-width:720px;margin:0 auto;text-align:center}
.about .star{width:56px;margin:0 auto 30px;display:block;animation:spin 90s linear infinite}
.about p{color:var(--dim);font-weight:300;font-size:16px;margin-bottom:18px}
.about p b{color:var(--ink);font-weight:400}
.about .motto{font-family:'Kaushan Script','Snell Roundhand',cursive;letter-spacing:.04em;color:var(--gold);font-size:25px;margin:26px 0 4px}
.about .est{font-size:10px;color:var(--gold);letter-spacing:.34em;text-transform:uppercase}
.cta{display:inline-block;padding:15px 40px;border:1px solid var(--gold);color:var(--gold);font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:300;transition:.25s}
.cta:hover{background:var(--gold);color:var(--bg)}
.cta.solid{background:var(--gold);color:var(--bg)}
.cta.solid:hover{background:#fff}
.contact{text-align:center;border-top:1px solid var(--line)}
.contact .cta{margin-top:34px}
.contact p{color:var(--dim);max-width:440px;margin:0 auto;font-weight:300}
footer{border-top:1px solid var(--line);padding:30px 0;text-align:center;color:var(--dim);font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:300}
footer .hand{display:block;font-size:20px;color:var(--gold);letter-spacing:0;text-transform:none;margin-bottom:8px}
/* artist page */
.artist-wrap{padding:130px 0 40px}
.artist{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:56px;align-items:start}
.artist .cover{width:100%;aspect-ratio:1;object-fit:cover;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.artist h1{font-size:clamp(30px,5vw,52px);font-weight:300;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.artist .meta{color:var(--gold);font-size:11px;letter-spacing:.24em;text-transform:uppercase;margin-bottom:28px}
.artist .bio p{color:var(--dim);font-weight:300;font-size:15.5px;margin-bottom:16px;max-width:60ch}
.player{display:flex;align-items:center;gap:18px;background:var(--panel);border:1px solid var(--line);padding:16px 22px;margin:0 0 30px;max-width:460px}
.player .t-name{flex:1;font-weight:300}
.player .t-name b{font-weight:400}
.player .t-name span{display:block;font-size:10px;color:var(--dim);letter-spacing:.24em;text-transform:uppercase;margin-top:3px}
.back{display:inline-block;margin-top:8px;color:var(--dim);font-size:11px;letter-spacing:.2em;text-transform:uppercase;transition:.2s}
.back:hover{color:var(--gold)}
.no-audio{color:var(--dim);font-size:12px;letter-spacing:.14em;font-style:italic;margin-bottom:30px}
/* submit */
.form-wrap{max-width:560px;margin:0 auto}
.form-wrap label{display:block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:20px 0 8px}
.form-wrap input,.form-wrap textarea{width:100%;background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:13px 15px;font-family:inherit;font-size:14px}
.form-wrap textarea{min-height:120px;resize:vertical}
@media(max-width:860px){.grid{grid-template-columns:repeat(2,1fr)}.mosaic{grid-template-columns:repeat(3,1fr)}nav ul{gap:14px}.artist{grid-template-columns:1fr;gap:30px}}

/* ---- hero v2: cinematic entrance ---- */
.hero{background:#0a0a0c}
.mosaic{inset:-6%;animation:mosaicDrift 80s ease-in-out infinite alternate}
@keyframes mosaicDrift{from{transform:scale(1.08) translate(-1.2%,-1%)}to{transform:scale(1.16) translate(1.2%,1.4%)}}
.mosaic img{opacity:0;animation:tileIn 1.2s ease forwards;transition:filter .55s ease}
@keyframes tileIn{to{opacity:1}}
.mosaic img.glint{filter:brightness(2.2) saturate(1.15)}
.hero .halo{position:absolute;left:50%;top:36%;width:min(640px,90vw);height:min(640px,90vw);transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(216,178,92,.17),transparent 62%);pointer-events:none;z-index:1;animation:haloPulse 6s ease-in-out infinite alternate}
@keyframes haloPulse{from{opacity:.45}to{opacity:1}}
.hero .star{width:150px;filter:drop-shadow(0 0 34px rgba(216,178,92,.55));animation:spin 90s linear infinite,starIn 1.6s cubic-bezier(.2,.8,.3,1) .35s both}
@keyframes starIn{from{opacity:0;scale:.55}to{opacity:1;scale:1}}
.hero h1{font-size:clamp(34px,6.4vw,74px);text-shadow:0 2px 40px rgba(0,0,0,.6);animation:trackIn 1.5s ease .75s both}
@keyframes trackIn{from{opacity:0;letter-spacing:.55em}to{opacity:1;letter-spacing:.3em}}
.hero .tag{animation:fadeUp 1s ease 1.5s both}
.hero p{animation:fadeUp 1s ease 1.8s both}
.hero .cta-row{animation:fadeUp 1s ease 2.1s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;color:var(--dim);font-size:10px;letter-spacing:.34em;text-transform:uppercase;font-weight:300;animation:cueIn 1.2s ease 2.6s both}
.scroll-cue::after{content:'';display:block;width:1px;height:34px;background:linear-gradient(var(--gold),transparent);margin:10px auto 0;animation:cuePulse 2.2s ease infinite}
@keyframes cuePulse{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.mosaic,.mosaic img,.hero .star,.hero h1,.hero .tag,.hero p,.hero .cta-row,.scroll-cue,.hero .halo{animation:none!important;opacity:1!important}}
.mosaic img:nth-child(1){animation-delay:0.05s}
.mosaic img:nth-child(2){animation-delay:0.10s}
.mosaic img:nth-child(3){animation-delay:0.15s}
.mosaic img:nth-child(4){animation-delay:0.20s}
.mosaic img:nth-child(5){animation-delay:0.25s}
.mosaic img:nth-child(6){animation-delay:0.30s}
.mosaic img:nth-child(7){animation-delay:0.35s}
.mosaic img:nth-child(8){animation-delay:0.40s}
.mosaic img:nth-child(9){animation-delay:0.45s}
.mosaic img:nth-child(10){animation-delay:0.50s}
.mosaic img:nth-child(11){animation-delay:0.55s}
.mosaic img:nth-child(12){animation-delay:0.60s}
.mosaic img:nth-child(13){animation-delay:0.65s}
.mosaic img:nth-child(14){animation-delay:0.70s}
.mosaic img:nth-child(15){animation-delay:0.75s}
.mosaic img:nth-child(16){animation-delay:0.80s}
.mosaic img:nth-child(17){animation-delay:0.85s}
.mosaic img:nth-child(18){animation-delay:0.90s}
.mosaic img:nth-child(19){animation-delay:0.95s}
.mosaic img:nth-child(20){animation-delay:1.00s}

@keyframes cueIn{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}

/* hero v3: blur, wordmark image, star companions */
.mosaic{filter:brightness(.32) saturate(.75) blur(5px)}
.hero .wordmark{width:min(760px,88vw);height:auto;display:block;margin:0 auto;filter:drop-shadow(0 2px 30px rgba(0,0,0,.55));animation:wordIn 1.5s ease .75s both}
@keyframes wordIn{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.starwrap{position:relative;width:150px;margin:0 auto 32px}
.starwrap .star{margin:0}
.star-mini{position:absolute;width:22px;height:22px;opacity:0;animation:twinkle1 5s ease-in-out 1.2s infinite}
.star-mini.m1{top:-6px;right:-30px}
.star-mini.m2{bottom:2px;left:-34px;width:15px;height:15px;animation:twinkle2 6.4s ease-in-out 2s infinite}
@keyframes twinkle1{0%,100%{opacity:0;transform:scale(.5) rotate(0)}45%{opacity:.95;transform:scale(1) rotate(40deg)}70%{opacity:.2}}
@keyframes twinkle2{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.8;transform:scale(1) rotate(-30deg)}}

/* hero v4: starfield + more companions */
.sky-star{position:absolute;z-index:1;opacity:0;pointer-events:none;animation-name:skyTw;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
@keyframes skyTw{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:.85;transform:scale(1) rotate(25deg)}}
.star-mini.m3{top:34px;right:-52px;width:11px;height:11px;animation:twinkle2 7.2s ease-in-out .6s infinite}
.star-mini.m4{top:-26px;left:-24px;width:13px;height:13px;animation:twinkle1 5.8s ease-in-out 3.1s infinite}
.star-mini.m5{bottom:-18px;right:6px;width:9px;height:9px;animation:twinkle2 4.6s ease-in-out 1.4s infinite}
@media (prefers-reduced-motion:reduce){.sky-star{animation:none!important;opacity:.5!important}}

/* two-column transmissions player */
.tracks{display:grid;grid-template-columns:1fr 1fr;gap:0 44px;max-width:1080px;padding:8px 30px}
.track{padding:13px 0}
.track:last-child,.track:nth-last-child(2){border-bottom:none}
@media(max-width:820px){.tracks{grid-template-columns:1fr;max-width:560px}.track:nth-last-child(2){border-bottom:1px solid var(--line)}}

/* label pages: news, licensing, press, privacy, 404, nav burger */
.pagehead{padding:150px 0 10px;text-align:center}
.news{max-width:720px;margin:36px auto 80px;padding:0 28px}
.post{border-bottom:1px solid var(--line);padding:30px 0}
.post:last-child{border-bottom:none}
.post .date{color:var(--gold);font-size:10px;letter-spacing:.3em;text-transform:uppercase;margin-bottom:10px}
.post h3{font-size:19px;font-weight:400;letter-spacing:.04em;line-height:1.45;margin-bottom:10px}
.post h3 a:hover{color:var(--gold)}
.post p{color:var(--dim);font-weight:300;font-size:14.5px}
.prose{max-width:680px;margin:30px auto 80px;padding:0 28px}
.prose p{color:var(--dim);font-weight:300;font-size:16px;margin-bottom:18px;line-height:1.75}
.prose p b{color:var(--ink);font-weight:400}
.factrow{display:flex;gap:14px 40px;flex-wrap:wrap;margin:30px 0}
.fact{font-size:15px;color:var(--ink);font-weight:300}
.fact b{display:block;color:var(--gold);font-size:10px;letter-spacing:.26em;text-transform:uppercase;font-weight:400;margin-bottom:4px}
.dlhead{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:400;margin:34px 0 12px}
.dl a{color:var(--ink);border-bottom:1px solid var(--line)}
.dl a:hover{color:var(--gold);border-color:var(--gold)}
footer .f-links{margin-bottom:12px;font-size:11px;letter-spacing:.14em}
footer .f-links a:hover{color:var(--gold)}
/* newsletter */
.newsletter{border-top:1px solid var(--line);padding:70px 0;text-align:center}
.newsletter h2{margin-bottom:10px}
.newsletter p{color:var(--dim);font-weight:300;max-width:440px;margin:0 auto 26px}
.nl-form{display:flex;gap:12px;justify-content:center;max-width:440px;margin:0 auto;flex-wrap:wrap}
.nl-form input{flex:1;min-width:220px;background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:14px 16px;font-family:inherit;font-size:14px}
.nl-form button{background:var(--gold);color:var(--bg);border:none;padding:14px 30px;font-family:inherit;font-size:11px;letter-spacing:.26em;text-transform:uppercase;cursor:pointer}
.nl-form button:hover{background:#fff}
/* burger */
.burger{display:none;background:none;border:none;color:var(--ink);font-size:24px;cursor:pointer}
@media(max-width:760px){
  .burger{display:block}
  nav ul{display:none;position:absolute;top:100%;right:16px;background:var(--panel);border:1px solid var(--line);flex-direction:column;gap:0;padding:6px 0;min-width:200px;z-index:50}
  nav ul.open{display:flex}
  nav ul li a{display:block;padding:12px 22px}
  nav{position:relative}
}

/* dormant track (no audio yet) */
.pbtn.soon{border-style:dashed;color:var(--dim);border-color:var(--dim);cursor:default}
.pbtn.soon:hover{background:none;color:var(--dim)}
.track.soon .t-name b{color:var(--dim)}

.tag.script{font-family:'Kaushan Script','Snell Roundhand',cursive;font-size:28px;letter-spacing:.04em;text-transform:none;font-weight:400;margin-top:12px}
@media(max-width:600px){.tag.script{font-size:22px}}