/* ===== RESET ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:'Space Mono','Noto Serif SC',monospace;color:var(--text);background:var(--bg);overflow-x:hidden;line-height:1.7}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
.hidden{display:none!important}

/* ===== TOKENS ===== */
:root{
  --bg:#0a0f0d;
  --bg-2:#0f1714;
  --bg-3:#141e1a;
  --surface:#1a2622;
  --text:#d8e0db;
  --text-soft:#8a958f;
  --text-faint:#545d57;
  --accent:#d4a056;
  --accent-glow:rgba(212,160,86,.18);
  --accent-2:#3a7a6a;
  --teal:#2d5f56;
  --rust:#c4673f;
  --line:rgba(216,224,219,.08);
  --line-2:rgba(216,224,219,.14);
  --serif:'Cormorant Garamond','Noto Serif SC',serif;
  --mono:'Space Mono',monospace;
}

/* ===== GRAIN OVERLAY ===== */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ===== NAV ===== */
#nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .4s,backdrop-filter .4s}
#nav.scrolled{background:rgba(10,15,13,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-inner{max-width:1400px;margin:0 auto;padding:1.2rem 2rem;display:flex;align-items:center;justify-content:space-between}
.nav-logo{display:flex;flex-direction:column;line-height:1.1}
.logo-mark{font-family:var(--serif);font-size:1.4rem;font-weight:500;letter-spacing:.02em;color:var(--accent)}
.logo-sub{font-family:var(--mono);font-size:.55rem;letter-spacing:.3em;color:var(--text-soft);margin-top:2px}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text-soft);transition:color .3s;position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:1px;background:var(--accent);transition:width .3s}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{width:100%}
#nav-toggle{display:none;font-size:1.4rem;color:var(--text)}

/* ===== HERO ===== */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 30%;filter:brightness(.5) contrast(1.1) saturate(.85)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,15,13,.4) 0%,rgba(10,15,13,.55) 40%,rgba(10,15,13,.92) 100%)}
.hero-grain{position:absolute;inset:0;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero-content{position:relative;z-index:2;max-width:1400px;margin:0 auto;padding:8rem 2rem 4rem;width:100%}
.hero-meta{margin-bottom:1.5rem;opacity:0;animation:fadeUp 1s .2s forwards}
.hero-tag{font-family:var(--mono);font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:var(--accent);padding:.4rem 0;border-left:2px solid var(--accent);padding-left:1rem}
.hero-title{font-family:var(--serif);font-size:clamp(3rem,8vw,6.5rem);font-weight:300;line-height:1.05;margin-bottom:1.5rem;letter-spacing:-.01em}
.hero-title .line{display:block;opacity:0;transform:translateY(30px);animation:fadeUp .9s forwards}
.hero-title .line:nth-child(1){animation-delay:.3s}
.hero-title .line:nth-child(2){animation-delay:.45s}
.hero-title .line:nth-child(3){animation-delay:.6s}
.hero-title .italic{font-style:italic;color:var(--accent);font-weight:300}
.hero-sub{max-width:560px;font-size:.95rem;color:var(--text-soft);margin-bottom:2.5rem;line-height:1.8;opacity:0;animation:fadeUp 1s .8s forwards}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:3rem;opacity:0;animation:fadeUp 1s 1s forwards}
.hero-news{display:flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.7rem;color:var(--text-soft);letter-spacing:.05em;opacity:0;animation:fadeUp 1s 1.2s forwards}
.news-dot{width:8px;height:8px;border-radius:50%;background:var(--rust);box-shadow:0 0 12px var(--rust);animation:pulse 2s infinite}
.hero-scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;color:var(--text-faint);text-transform:uppercase}
.hero-scroll i{animation:bounce 2s infinite}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.6rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;transition:all .3s;cursor:pointer;border:1px solid transparent}
.btn-primary{background:var(--accent);color:var(--bg);font-weight:700}
.btn-primary:hover{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn-small{padding:.55rem 1.1rem;font-size:.65rem}
.btn-sold-out{background:transparent;color:var(--text-faint);border-color:var(--line);cursor:default;opacity:.6}

/* ===== SECTION SHARED ===== */
section{padding:6rem 2rem;position:relative}
.section-header{max-width:1400px;margin:0 auto 4rem;text-align:center}
.section-label{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem}
.section-title{font-family:var(--serif);font-size:clamp(2rem,5vw,3.5rem);font-weight:400;line-height:1.15;margin-bottom:1rem}
.section-desc{max-width:520px;margin:0 auto;color:var(--text-soft);font-size:.9rem;line-height:1.8}

/* ===== ABOUT ===== */
.about{background:var(--bg-2)}
.about-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1fr 1.3fr;gap:4rem;align-items:start}
.about-image{position:relative}
.about-image img{width:100%;aspect-ratio:3/4;object-fit:cover;filter:contrast(1.05) saturate(.9)}
.about-image-caption{display:flex;justify-content:space-between;margin-top:.8rem;font-family:var(--mono);font-size:.65rem;letter-spacing:.1em;color:var(--text-faint);text-transform:uppercase}
.about-text .section-label{text-align:left}
.about-text .section-title{text-align:left;font-size:clamp(1.8rem,4vw,2.8rem)}
.section-lead{font-family:var(--serif);font-size:1.3rem;font-weight:300;line-height:1.6;color:var(--text);margin-bottom:1.5rem;font-style:italic}
.about-body p{margin-bottom:1.2rem;color:var(--text-soft);font-size:.9rem;line-height:1.9}
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:2.5rem;padding-top:2.5rem;border-top:1px solid var(--line)}
.stat{display:flex;flex-direction:column;align-items:flex-start}
.stat-num{font-family:var(--serif);font-size:2.5rem;font-weight:300;color:var(--accent);line-height:1}
.stat-label{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-faint);margin-top:.4rem}

/* ===== MUSIC ===== */
.music{background:var(--bg)}
.music-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
.album-card{background:var(--surface);border:1px solid var(--line);overflow:hidden;transition:transform .4s,border-color .4s;display:flex;flex-direction:column}
.album-card:hover{transform:translateY(-6px);border-color:var(--accent-glow)}
.album-cover{position:relative;aspect-ratio:1;overflow:hidden}
.album-cover img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.album-card:hover .album-cover img{transform:scale(1.05)}
.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);width:64px;height:64px;border-radius:50%;background:rgba(212,160,86,.9);color:var(--bg);font-size:1.5rem;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .4s}
.album-card:hover .play-btn{opacity:1;transform:translate(-50%,-50%) scale(1)}
.play-btn:hover{background:var(--accent);transform:translate(-50%,-50%) scale(1.1)!important}
.album-info{padding:1.8rem;flex:1;display:flex;flex-direction:column}
.album-meta{display:flex;gap:1rem;font-family:var(--mono);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-faint);margin-bottom:.5rem}
.album-title{font-family:var(--serif);font-size:1.8rem;font-weight:400;margin-bottom:.6rem}
.album-desc{font-size:.85rem;color:var(--text-soft);line-height:1.7;margin-bottom:1.5rem;flex:1}

/* Audio Player */
.audio-player{background:var(--bg-2);border:1px solid var(--line);padding:1rem;margin-top:auto}
.player-track{margin-bottom:.8rem}
.track-name{display:flex;align-items:center;gap:.8rem;font-family:var(--mono);font-size:.7rem;margin-bottom:.6rem}
.track-num{color:var(--accent);font-weight:700}
.track-title{color:var(--text);flex:1}
.track-duration{color:var(--text-faint)}
.progress-bar{height:3px;background:var(--line-2);overflow:hidden;cursor:pointer;border-radius:2px}
.progress-fill{height:100%;width:0%;background:var(--accent);transition:width .1s linear}
.progress-bar.playing .progress-fill{background:var(--accent)}
.player-controls{display:flex;align-items:center;gap:1rem}
.ctrl-btn{width:36px;height:36px;border-radius:50%;background:var(--accent);color:var(--bg);display:flex;align-items:center;justify-content:center;font-size:1rem;transition:transform .2s;flex-shrink:0}
.ctrl-btn:hover{transform:scale(1.1)}
.volume-wrap{display:flex;align-items:center;gap:.5rem;flex:1}
.volume-wrap i{color:var(--text-faint);font-size:.85rem}
.volume-bar{flex:1;max-width:80px;height:2px;background:var(--line-2);border-radius:1px;overflow:hidden}
.volume-fill{height:100%;width:70%;background:var(--text-soft)}
.time-current{font-family:var(--mono);font-size:.65rem;color:var(--text-faint);letter-spacing:.05em}

/* Music streaming */
.music-streaming{max-width:1400px;margin:4rem auto 0;text-align:center}
.stream-label{display:block;font-family:var(--mono);font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--text-faint);margin-bottom:1.2rem}
.stream-links{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}
.stream-link{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;color:var(--text-soft);padding:.5rem 1rem;border:1px solid var(--line);transition:all .3s}
.stream-link:hover{color:var(--accent);border-color:var(--accent)}
.stream-link i{font-size:1.1rem}

/* ===== TOUR ===== */
.tour{background:var(--bg-2)}
.tour-list{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:0}
.tour-item{display:grid;grid-template-columns:100px 1fr auto;gap:2.5rem;align-items:center;padding:2rem 0;border-bottom:1px solid var(--line);transition:padding-left .3s,background .3s}
.tour-item:hover{padding-left:1rem;background:rgba(212,160,86,.03)}
.tour-item-featured{padding:2.5rem 2rem;background:rgba(212,160,86,.04);border:1px solid var(--accent-glow);border-radius:2px;margin-bottom:1rem}
.tour-item-featured:hover{padding-left:2.5rem}
.tour-date{display:flex;flex-direction:column;align-items:center;border-right:1px solid var(--line);padding-right:1.5rem}
.date-day{font-family:var(--serif);font-size:3rem;font-weight:300;color:var(--accent);line-height:1}
.date-month{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;color:var(--text-faint);margin-top:.3rem}
.tour-city{font-family:var(--serif);font-size:1.6rem;font-weight:400;margin-bottom:.4rem}
.tour-venue{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--accent);text-transform:uppercase;margin-left:.6rem}
.tour-detail{font-size:.85rem;color:var(--text-soft);margin-bottom:.6rem}
.tour-tags{display:flex;gap:.6rem;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;padding:.3rem .7rem;border:1px solid var(--line-2);color:var(--text-faint)}
.tag-hot{color:var(--rust);border-color:rgba(196,103,63,.4);background:rgba(196,103,63,.08)}
.tag-soon{color:var(--accent);border-color:rgba(212,160,86,.4);background:rgba(212,160,86,.08)}

/* ===== GALLERY ===== */
.gallery{background:var(--bg)}
.gallery-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:240px;gap:1rem}
.gallery-item{position:relative;overflow:hidden;cursor:pointer}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s,filter .6s;filter:brightness(.85)}
.gallery-item:hover img{transform:scale(1.06);filter:brightness(1)}
.gallery-item figcaption{position:absolute;bottom:0;left:0;right:0;padding:1rem;background:linear-gradient(transparent,rgba(10,15,13,.85));font-family:var(--mono);font-size:.65rem;letter-spacing:.1em;color:var(--text-soft);text-transform:uppercase;opacity:0;transition:opacity .4s}
.gallery-item:hover figcaption{opacity:1}
.gallery-tall{grid-row:span 2}
.gallery-wide{grid-column:span 2}

/* ===== CONTACT ===== */
.contact{background:var(--bg-2)}
.contact-inner{max-width:1000px;margin:0 auto;text-align:center}
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin:3rem 0}
.contact-block{text-align:left;padding:2rem;background:var(--surface);border:1px solid var(--line);transition:border-color .3s}
.contact-block:hover{border-color:var(--accent-glow)}
.contact-block i{font-size:1.8rem;color:var(--accent);margin-bottom:1rem;display:block}
.contact-block h4{font-family:var(--serif);font-size:1.2rem;font-weight:400;margin-bottom:.5rem}
.contact-block a{color:var(--text);font-family:var(--mono);font-size:.78rem;border-bottom:1px solid var(--line-2);transition:border-color .3s}
.contact-block a:hover{border-color:var(--accent)}
.contact-block p{font-size:.8rem;color:var(--text-soft);margin-top:.6rem;line-height:1.6}
.social-links{display:flex;justify-content:center;gap:1.5rem;margin:3rem 0}
.social-link{width:44px;height:44px;border:1px solid var(--line-2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--text-soft);transition:all .3s}
.social-link:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-3px)}
.newsletter{max-width:500px;margin:0 auto;padding:3rem 0 0;border-top:1px solid var(--line)}
.newsletter h4{font-family:var(--serif);font-size:1.6rem;font-weight:400;margin-bottom:.5rem}
.newsletter p{color:var(--text-soft);font-size:.85rem;margin-bottom:1.5rem}
.newsletter-form{display:flex;gap:.8rem}
.newsletter-form input{flex:1;padding:.85rem 1rem;background:var(--bg-3);border:1px solid var(--line);color:var(--text);font-family:var(--mono);font-size:.8rem;outline:none;transition:border-color .3s}
.newsletter-form input:focus{border-color:var(--accent)}
.newsletter-form input::placeholder{color:var(--text-faint)}

/* ===== FOOTER ===== */
.footer{background:var(--bg);padding:4rem 2rem 3rem;border-top:1px solid var(--line)}
.footer-inner{max-width:1000px;margin:0 auto;text-align:center}
.footer-brand{display:inline-flex;flex-direction:column;align-items:center;margin-bottom:1.5rem}
.footer-copy{font-family:var(--mono);font-size:.68rem;letter-spacing:.05em;color:var(--text-faint);line-height:1.8;margin-bottom:1.5rem}
.footer-quote{font-family:var(--serif);font-size:1.3rem;font-style:italic;font-weight:300;color:var(--text-soft)}

/* ===== ANIMATIONS ===== */
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s,transform .8s}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .nav-links{display:none}
  #nav-toggle{display:block}
  .nav-links.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:rgba(10,15,13,.97);padding:1.5rem 2rem;gap:1.2rem;backdrop-filter:blur(10px)}
  .about-grid{grid-template-columns:1fr;gap:2.5rem}
  .music-grid{grid-template-columns:1fr;gap:1.5rem}
  .tour-item{grid-template-columns:70px 1fr;gap:1.5rem}
  .tour-action{grid-column:1/-1;justify-self:start}
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}
  .gallery-wide{grid-column:span 2}
  .contact-grid{grid-template-columns:1fr}
  .hero-content{padding:7rem 1.5rem 3rem}
  section{padding:4rem 1.5rem}
}
@media(max-width:500px){
  .about-stats{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:1fr;grid-auto-rows:220px}
  .gallery-wide,.gallery-tall{grid-column:span 1;grid-row:span 1}
  .newsletter-form{flex-direction:column}
  .hero-actions .btn{width:100%;justify-content:center}
}
