*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --orange:#FF4500;--orange-2:#FF6A33;--amber:#FF8C42;
  --bg:#050508;--text:#E4E4F0;--muted:#72728C;--white:#FFFFFF;
  --border:rgba(255,255,255,0.065);--green:#25D366;
}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:110px}
body{font-family:'Heebo',system-ui,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;-webkit-font-smoothing:antialiased}

/* SCROLL BAR */
#scroll-bar{position:fixed;top:0;left:0;z-index:1000;height:3px;width:0%;background:linear-gradient(90deg,var(--orange),var(--amber));transition:width .04s linear;pointer-events:none}

/* TICKER */
.ticker-wrap{position:relative;z-index:100;background:rgba(255,69,0,.07);border-bottom:1px solid rgba(255,69,0,.15);height:36px;overflow:hidden}
.ticker-track{display:flex;animation:ticker 34s linear infinite;white-space:nowrap;height:100%;align-items:center}
.ticker-item{display:inline-flex;align-items:center;gap:12px;padding:0 28px;font-size:12px;font-weight:400;letter-spacing:.07em;color:rgba(255,100,50,.8)}
.t-dot{color:var(--orange);font-size:8px;opacity:.6}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* NAV */
nav#main-nav{position:fixed;top:36px;left:0;right:0;z-index:90;height:64px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;backdrop-filter:blur(24px) saturate(160%);background:rgba(5,5,8,.85);border-bottom:1px solid var(--border);transition:top .3s}
nav#main-nav.scrolled{top:0}
.nav-logo{font-size:20px;font-weight:900;color:#fff;text-decoration:none;letter-spacing:-.01em}
.nav-logo span{color:var(--orange)}
.nav-center{display:flex;align-items:center;gap:8px}
.pill{padding:6px 14px;border-radius:100px;font-size:11px;letter-spacing:.09em;font-weight:500;border:1px solid;display:flex;align-items:center;gap:6px;text-decoration:none}
.pill-orange{border-color:rgba(255,69,0,.25);color:rgba(255,100,50,.85);background:rgba(255,69,0,.07)}
.pill-white{border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.45);background:rgba(255,255,255,.04)}
.nav-wa{padding:8px 18px;border-radius:100px;background:#25D366;color:#fff;font-size:12px;font-weight:700;text-decoration:none;transition:opacity .2s}
.nav-wa:hover{opacity:.85}

/* SECTION WRAP */
.section-wrap{max-width:1100px;margin:0 auto;padding:80px 32px}
.section-title{font-size:clamp(26px,4vw,42px);font-weight:900;color:#fff;margin-bottom:10px;text-align:center}
.section-title span{color:var(--orange)}
.section-sub{text-align:center;color:var(--muted);font-size:15px;margin-bottom:48px}

/* ARTIST CARD */
.artist-card{display:flex;flex-direction:column;background:#0c0c12;border:1px solid rgba(255,69,0,.12);border-radius:18px;overflow:hidden;text-decoration:none;transition:transform .3s,box-shadow .3s,border-color .3s}
.artist-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(255,69,0,.2);border-color:rgba(255,69,0,.35)}
.artist-card-img{height:220px;overflow:hidden;position:relative;flex-shrink:0}
.artist-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.artist-card:hover .artist-card-img img{transform:scale(1.07)}
.artist-card-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,12,18,.9) 0%,transparent 55%)}
.artist-card-body{padding:20px 18px 22px;flex:1;display:flex;flex-direction:column}
.artist-card-name{font-size:18px;font-weight:900;color:#fff;margin-bottom:6px}
.artist-card-meta{font-size:12px;color:var(--muted);margin-bottom:14px}
.artist-card-cta{margin-top:auto;padding:10px 16px;background:var(--orange);color:#fff;border-radius:8px;font-size:13px;font-weight:700;text-align:center;text-decoration:none;display:block;transition:opacity .2s}
.artist-card-cta:hover{opacity:.85}

/* ARTISTS GRID */
.artists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}

/* HERO (artist page) */
.artist-hero{position:relative;height:420px;overflow:hidden;margin-top:100px}
.artist-hero img{width:100%;height:100%;object-fit:cover}
.artist-hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(5,5,8,1) 0%,rgba(5,5,8,.5) 50%,transparent 100%)}
.artist-hero-content{position:absolute;bottom:40px;right:0;left:0;padding:0 32px;max-width:1100px;margin:0 auto}

/* REVEAL ANIMATIONS */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}
.reveal-scale{opacity:0;transform:scale(.94);transition:opacity .5s ease,transform .5s ease}
.reveal-scale.visible{opacity:1;transform:scale(1)}

/* RESPONSIVE */
@media(max-width:768px){
  nav#main-nav{padding:0 20px}
  .section-wrap{padding:60px 20px}
  .artists-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .artist-card-img{height:170px}
}
@media(max-width:480px){
  .artists-grid{grid-template-columns:1fr 1fr}
  .nav-center{display:none}
}