*{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#09090b;--surface:#111114;--text:#f5f5f2;--muted:#9d9da5;--line:rgba(255,255,255,.1);--accent:#d9ff3f;--max:1180px}
html{scroll-behavior:smooth}
body{background:radial-gradient(circle at 75% 12%,rgba(217,255,63,.08),transparent 27rem),radial-gradient(circle at 15% 55%,rgba(255,255,255,.035),transparent 25rem),var(--bg);color:var(--text);font-family:"DM Sans",sans-serif;line-height:1.6;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to bottom,black,transparent 85%);z-index:-2}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:20;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 type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.nav,.footer,.hero,.statement,.pillars,.join,.community{width:min(calc(100% - 40px),var(--max));margin:auto}
.nav{height:88px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:1.2rem;letter-spacing:-.05em}
.logo>span:last-child>span{color:var(--accent)}
.logo-mark{width:35px;height:35px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:.7rem}
.nav-link{border:1px solid var(--line);padding:9px 15px;border-radius:999px;font-size:.82rem;color:#ddd}
.nav-link span{color:var(--accent)}
.hero{min-height:700px;display:grid;grid-template-columns:1.04fr .96fr;gap:55px;align-items:center;padding:70px 0 110px}
.eyebrow,.label{font-size:.7rem;font-weight:700;letter-spacing:.18em;color:var(--accent)}
.eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:23px}
.eyebrow span{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px var(--accent);animation:pulse 1.8s infinite}
@keyframes pulse{50%{transform:scale(1.6);opacity:.5}}
h1,h2,h3{font-family:"Space Grotesk",sans-serif;line-height:1.02;letter-spacing:-.06em}
h1{font-size:clamp(3.5rem,7.2vw,6.5rem);max-width:760px}
h1 em{display:block;color:var(--accent);font-style:normal}
.hero-lead{font-size:1.12rem;color:#c5c5ca;max-width:650px;margin:28px 0 13px;line-height:1.75}
.hero-lead strong{color:var(--text)}
.hero-detail{font-size:.95rem;color:var(--muted);max-width:625px;line-height:1.8}
.actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:49px;padding:0 20px;border-radius:12px;font-size:.88rem;font-weight:700;transition:.25s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--accent);color:#0a0b08}
.btn-primary:hover{background:#e7ff76}
.btn-secondary{border:1px solid var(--line);color:#ddd}
.motto{display:flex;align-items:center;gap:12px;color:#66666d;font-size:.61rem;font-weight:700;letter-spacing:.15em;margin-top:45px}
.motto i{width:3px;height:3px;background:#505057;border-radius:50%}
.visual{position:relative;min-height:520px;display:grid;place-items:center}
.glow{position:absolute;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,rgba(217,255,63,.2),transparent 68%);animation:float 6s ease-in-out infinite}
.ring{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.ring-a{width:480px;height:240px;transform:rotate(-25deg)}
.ring-b{width:340px;height:500px;transform:rotate(62deg)}
.music-card{position:relative;z-index:2;width:min(420px,82%);min-height:325px;padding:28px;border:1px solid rgba(255,255,255,.14);border-radius:25px;background:linear-gradient(145deg,rgba(29,29,33,.9),rgba(12,12,14,.78));backdrop-filter:blur(22px);box-shadow:0 30px 100px rgba(0,0,0,.45);animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-9px)}}
.card-header{display:flex;justify-content:space-between;font-size:.63rem;font-weight:700;letter-spacing:.15em;color:#77777e}
.card-header b{color:var(--accent)}
.wave{height:105px;display:flex;align-items:center;gap:4px;margin:43px 0 28px}
.wave i{flex:1;max-width:7px;height:35%;background:var(--accent);border-radius:99px;opacity:.7;animation:wave 1.1s ease-in-out infinite alternate}
.wave i:nth-child(2n){height:65%;animation-delay:.1s}.wave i:nth-child(3n){height:43%;animation-delay:.25s}.wave i:nth-child(4n){height:82%;animation-delay:.35s}.wave i:nth-child(5n){height:55%;animation-delay:.45s}
@keyframes wave{to{transform:scaleY(.5);opacity:.4}}
.card-title{font-family:"Space Grotesk";font-size:1.7rem;line-height:1.05;letter-spacing:-.05em}
.card-title strong{color:var(--accent)}
.card-tags{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px;margin-top:25px;color:#707078;font-size:.62rem}
.floating{position:absolute;z-index:3;display:flex;align-items:center;gap:11px;padding:12px 15px;background:rgba(18,18,21,.9);border:1px solid var(--line);border-radius:15px;backdrop-filter:blur(15px);box-shadow:0 18px 50px rgba(0,0,0,.3)}
.floating small,.floating strong{display:block}.floating small{font-size:.59rem;color:#707078}.floating strong{font-size:.75rem}
.float-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(217,255,63,.1);color:var(--accent);font-weight:700}
.artist-card{top:17%;right:-2%}.fan-card{bottom:13%;left:-1%}
.statement{padding:120px 0 60px;border-top:1px solid var(--line)}
.statement h2,.join h2,.community h2{font-size:clamp(2.5rem,5vw,4.8rem);margin:18px 0}
.statement h2 span,.community h2 span,.join h2 span{color:var(--accent)}
.statement>p:last-child{max-width:650px;color:var(--muted);font-size:1.04rem}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:35px;margin-bottom:150px}
.pillars article{background:var(--bg);padding:30px;min-height:285px}
.num{font-size:.67rem;color:#68686f;letter-spacing:.13em}
.pillars h3{font-size:1.3rem;margin:58px 0 14px}
.pillars p{font-size:.88rem;color:var(--muted)}
.join{display:grid;grid-template-columns:.9fr 1.1fr;gap:75px;align-items:center;padding:80px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.join-copy{color:var(--muted);max-width:490px}
form label{display:block;color:#ccc;font-size:.75rem;font-weight:700;margin-bottom:9px}
.form-row{display:flex;gap:8px}
.form-row input{flex:1;min-width:0;height:56px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:0 16px;color:var(--text);outline:none}
.form-row input:focus{border-color:rgba(217,255,63,.55);box-shadow:0 0 0 4px rgba(217,255,63,.06)}
.form-row button{border:0;border-radius:12px;background:var(--accent);color:#090a07;padding:0 20px;font-weight:800;cursor:pointer;white-space:nowrap}
form>small{display:block;color:#5f5f66;font-size:.66rem;margin-top:9px}
.status{min-height:22px;color:var(--accent);font-size:.76rem;margin-top:9px}
.community{display:flex;justify-content:space-between;align-items:center;gap:35px;padding:125px 0}
.community h2{font-size:clamp(2.1rem,4vw,3.7rem)}
.footer{min-height:100px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#626269;font-size:.72rem}
.footer .logo{color:var(--text)}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:25px}.visual{min-height:480px}.pillars{grid-template-columns:repeat(2,1fr)}.join{grid-template-columns:1fr;gap:35px}}
@media(max-width:600px){.nav,.footer,.hero,.statement,.pillars,.join,.community{width:calc(100% - 28px)}.nav{height:72px}.nav-link{font-size:.72rem}.hero{padding:50px 0 70px}h1{font-size:clamp(3rem,15vw,4.7rem)}.hero-lead{font-size:1rem}.visual{min-height:410px}.music-card{min-height:295px;padding:22px}.artist-card{top:8%;right:-2%}.fan-card{bottom:6%;left:-2%}.statement{padding:80px 0 50px}.pillars{grid-template-columns:1fr;margin-bottom:90px}.pillars article{min-height:225px}.pillars h3{margin-top:42px}.join{padding:65px 0}.form-row{flex-direction:column}.form-row input,.form-row button{width:100%;height:54px}.community{flex-direction:column;align-items:flex-start;padding:90px 0}.footer{flex-direction:column;align-items:flex-start;padding:30px 0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
