:root{--bg:#f8f6f1;--black:#111;--gold:#b8963e;--gray:#888;--serif:'Cormorant Garamond',serif;--sans:'Inter',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:var(--black);overflow-x:hidden}
a{text-decoration:none;color:inherit}img{display:block;max-width:100%}
::selection{background:var(--black);color:var(--bg)}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:24px 40px;display:flex;align-items:center;justify-content:space-between;transition:all .5s}
nav.scrolled{background:rgba(248,246,241,.92);backdrop-filter:blur(20px);padding:16px 40px;border-bottom:1px solid rgba(0,0,0,.04)}
nav .name{font-family:var(--serif);font-size:20px;font-weight:600;letter-spacing:2px;color:#fff;transition:color .4s}
nav .links{display:flex;gap:32px}
nav .links a{font-size:11px;font-weight:500;letter-spacing:2px;color:#fff;transition:color .3s}
nav .links a:hover{color:#fff}
nav.scrolled .name{color:var(--black)}
nav.scrolled .links a{color:var(--gray)}
nav.scrolled .links a:hover{color:var(--black)}
nav.scrolled .ham span{background:var(--black)}
nav .ham{display:none;width:28px;height:20px;flex-direction:column;justify-content:space-between;cursor:pointer}
nav .ham span{display:block;width:100%;height:1.5px;background:#fff;transition:all .3s}
nav .ham.open span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}
nav .ham.open span:nth-child(2){opacity:0}
nav .ham.open span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}

/* MOBILE MENU */
.mob{position:fixed;inset:0;z-index:99;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;opacity:0;pointer-events:none;transition:opacity .4s}
.mob.open{opacity:1;pointer-events:all}
.mob a{font-family:var(--serif);font-size:36px;font-weight:400;color:#000 !important;opacity:1;transition:opacity .3s}
.mob a:hover{opacity:.6}

/* HERO */
.hero{height:100vh;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.hero-img{position:absolute;inset:0}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:top center;position:absolute;inset:0;opacity:0;transition:opacity 1.8s ease}
.hero-img img.active{opacity:1}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.25) 40%,rgba(0,0,0,.2) 60%,var(--bg) 96%)}
.hero-center{position:relative;z-index:2;text-align:center}
.hero-center h1{font-family:var(--serif);font-size:clamp(48px,10vw,140px);font-weight:300;letter-spacing:clamp(8px,2vw,24px);line-height:1;color:#fff;text-shadow:0 2px 40px rgba(0,0,0,.15)}
.hero-center .sub{font-size:12px;letter-spacing:6px;color:#fff;margin-top:16px;font-weight:500}

/* HERO SVG ANIMATIONS */
.hero-svgs{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.hero-note{position:absolute;color:rgba(255,255,255,.35)}
.hero-note.n1{top:38%;left:10%;width:28px;animation:noteFloat1 8s ease-in-out infinite}
.hero-note.n2{top:48%;left:18%;width:18px;animation:noteFloat2 10s ease-in-out infinite 1s}
.hero-note.n3{top:55%;left:12%;width:22px;animation:noteFloat3 9s ease-in-out infinite .5s}
.hero-note.n4{top:42%;left:25%;width:16px;animation:noteFloat1 11s ease-in-out infinite 2s}
.hero-note.n5{top:52%;left:6%;width:20px;animation:noteFloat2 7s ease-in-out infinite 3s}
.hero-note.n6{top:38%;right:10%;width:26px;animation:noteFloat3 9s ease-in-out infinite .8s}
.hero-note.n7{top:50%;right:18%;width:16px;animation:noteFloat1 8.5s ease-in-out infinite 1.5s}
.hero-note.n8{top:56%;right:14%;width:24px;animation:noteFloat2 10.5s ease-in-out infinite 2.5s}
.hero-note.n9{top:44%;right:24%;width:14px;animation:noteFloat3 7.5s ease-in-out infinite .3s}
.hero-note.n10{top:60%;right:8%;width:18px;animation:noteFloat1 9.5s ease-in-out infinite 1.8s}

@keyframes noteFloat1{
  0%,100%{transform:translateY(0) rotate(0deg);opacity:.3}
  25%{transform:translateY(-25px) rotate(8deg);opacity:.5}
  50%{transform:translateY(-10px) rotate(-5deg);opacity:.2}
  75%{transform:translateY(-35px) rotate(12deg);opacity:.45}
}
@keyframes noteFloat2{
  0%,100%{transform:translateY(0) rotate(0) scale(1);opacity:.25}
  30%{transform:translateY(-40px) rotate(-10deg) scale(1.1);opacity:.5}
  60%{transform:translateY(-15px) rotate(5deg) scale(.95);opacity:.15}
}
@keyframes noteFloat3{
  0%,100%{transform:translate(0,0) rotate(0);opacity:.25}
  40%{transform:translate(8px,-30px) rotate(15deg);opacity:.5}
  70%{transform:translate(-6px,-12px) rotate(-8deg);opacity:.2}
}

.hero-wave{position:absolute;bottom:15%;color:rgba(255,255,255,.3);width:80px}
.hero-wave.wave-l{left:4%}
.hero-wave.wave-r{right:4%}
.hero-wave .bar{transform-origin:center center}
.hero-wave .b1{animation:eqBar 1.2s ease-in-out infinite}
.hero-wave .b2{animation:eqBar 0.8s ease-in-out infinite .1s}
.hero-wave .b3{animation:eqBar 1.5s ease-in-out infinite .3s}
.hero-wave .b4{animation:eqBar 0.7s ease-in-out infinite .2s}
.hero-wave .b5{animation:eqBar 1.1s ease-in-out infinite .4s}
.hero-wave .b6{animation:eqBar 1.4s ease-in-out infinite .15s}
@keyframes eqBar{0%,100%{transform:scaleY(1);opacity:.25}50%{transform:scaleY(.3);opacity:.4}}

.hero-vinyl{position:absolute;bottom:20%;left:12%;width:120px;color:rgba(255,255,255,.2);animation:vinylSpin 12s linear infinite}
@keyframes vinylSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

.hero-mic{position:absolute;top:20%;right:12%;width:40px;color:rgba(255,255,255,.3);animation:micPulse 4s ease-in-out infinite}
@keyframes micPulse{0%,100%{transform:translateY(0);opacity:.25}50%{transform:translateY(-8px);opacity:.45}}

.hero-spark{position:absolute;color:rgba(255,255,255,.5)}
.hero-spark.s1{top:25%;left:20%;width:16px;animation:sparkle 3s ease-in-out infinite}
.hero-spark.s2{top:70%;right:18%;width:14px;animation:sparkle 4s ease-in-out infinite 1.5s}
.hero-spark.s3{top:12%;left:45%;width:10px;animation:sparkle 5s ease-in-out infinite .8s}
@keyframes sparkle{0%,100%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1) rotate(90deg);opacity:.5}}

.hero-scroll{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:2}
.hero-scroll .arr{width:1px;height:40px;background:#fff;opacity:.3;animation:scrollP 2s ease infinite}
@keyframes scrollP{0%,100%{transform:scaleY(.4);opacity:.1}50%{transform:scaleY(1);opacity:.3}}

/* SECTIONS */
section{padding:120px 40px}
.sec-inner{max-width:900px;margin:0 auto}
.sec-wide{max-width:1400px;margin:0 auto}
.sec-label{font-size:12px;letter-spacing:4px;color:var(--gray);font-weight:400;margin-bottom:10px}
.sec-title{font-family:var(--serif);font-size:clamp(32px,5vw,56px);font-weight:300;line-height:1.15;letter-spacing:1px}
.sec-title em{font-style:italic}
.sec-divider{width:40px;height:1px;background:var(--black);opacity:.1;margin:24px 0}

/* REVEAL */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.rv.vis{opacity:1;transform:translateY(0)}
.img-reveal{clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.22,1,.36,1)}
.img-reveal.vis{clip-path:inset(0 0 0 0)}

/* BIO */
.bio-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:48px;align-items:start}
.bio-photo{overflow:hidden}
.bio-photo img{width:100%;filter:grayscale(.1)}
.bio-text{font-size:14px;color:var(--gray);line-height:2;font-weight:300}
.bio-text p+p{margin-top:20px}
.bio-text strong{color:var(--black);font-weight:500}
.bio-quote{font-family:var(--serif);font-size:28px;font-weight:300;font-style:italic;color:var(--black);margin-top:40px;line-height:1.4}
.bio-stats{display:flex;gap:48px;margin-top:48px;padding-top:32px;border-top:1px solid rgba(0,0,0,.06)}
.bio-stat .n{font-family:var(--serif);font-size:48px;font-weight:300;color:var(--black);line-height:1}
.bio-stat .k{font-size:9px;letter-spacing:3px;color:var(--gray);margin-top:4px}

/* MUSIC */
.mus-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:40px;max-width:900px;margin-left:auto;margin-right:auto}
.mus-grid iframe{width:100%;height:352px;border:none;border-radius:12px}

/* DISCO */
.disco-row{display:flex;gap:32px;margin-top:40px;overflow-x:auto;padding-bottom:8px}
.disco-row::-webkit-scrollbar{height:1px}
.disco-row::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1)}
.disco-item{min-width:160px;flex-shrink:0;cursor:pointer}
.disco-item img{width:160px;height:160px;object-fit:cover;filter:grayscale(.2);transition:all .5s}
.disco-item:hover img{filter:grayscale(0);transform:translateY(-4px)}
.disco-item .yr{font-family:var(--serif);font-size:14px;font-style:italic;color:var(--gray);margin-top:10px}
.disco-item .nm{font-size:11px;font-weight:400;margin-top:2px;letter-spacing:.5px}

/* GALLERY */
.gal-mosaic{column-count:5;column-gap:5px;margin-top:40px;max-width:1100px;margin-left:auto;margin-right:auto}
.gal-mosaic .gal-item{break-inside:avoid;margin-bottom:5px;overflow:hidden;cursor:pointer;position:relative}
.gal-mosaic .gal-item img{width:100%;display:block;filter:grayscale(.2);transition:all .5s cubic-bezier(.22,1,.36,1)}
.gal-mosaic .gal-item:hover img{filter:grayscale(0);transform:scale(1.03)}
.gal-mosaic .gal-item::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,0);transition:background .4s}
.gal-mosaic .gal-item:hover::after{background:rgba(0,0,0,.08)}

/* LIGHTBOX */
.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.95);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}
.lightbox.open{display:flex;opacity:1}
.lb-img{max-width:90vw;max-height:88vh;object-fit:contain;border-radius:2px}
.lb-close{position:absolute;top:20px;right:24px;background:none;border:none;color:#fff;font-size:36px;cursor:pointer;opacity:.6;transition:opacity .3s;z-index:2}
.lb-close:hover{opacity:1}
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:#fff;font-size:48px;cursor:pointer;opacity:.4;transition:opacity .3s;padding:20px;z-index:2}
.lb-prev{left:12px}
.lb-next{right:12px}
.lb-prev:hover,.lb-next:hover{opacity:.9}
.lb-counter{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.4);font-family:var(--sans);font-size:11px;letter-spacing:2px}

/* VIDEOS */
.vid-main{margin-top:40px;aspect-ratio:16/9;overflow:hidden}
.vid-main iframe{width:100%;height:100%;border:none}
.vid-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.vid-th{aspect-ratio:16/9;overflow:hidden;opacity:.7;transition:opacity .3s}
.vid-th:hover{opacity:1}
.vid-th iframe{width:100%;height:100%;border:none;pointer-events:none}

/* TOUR */
.tour-box{margin-top:40px;padding:56px;border:1px solid rgba(0,0,0,.06);text-align:center}
.tour-status{display:inline-block;font-size:10px;letter-spacing:4px;color:var(--gold);border:1px solid rgba(184,150,62,.2);padding:8px 20px;margin-bottom:20px}
.tour-h{font-family:var(--serif);font-size:clamp(28px,4vw,44px);font-weight:300;line-height:1.2}
.tour-h em{font-style:italic}
.tour-p{font-size:12px;color:var(--gray);line-height:1.7;margin-top:12px;max-width:440px;margin-left:auto;margin-right:auto;font-weight:300}
.tour-cities{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:28px}
.tour-city{padding:8px 18px;font-size:9px;letter-spacing:3px;border:1px solid rgba(0,0,0,.08);color:var(--gray);transition:all .3s;cursor:pointer}
.tour-city:hover{border-color:var(--black);color:var(--black)}

/* SOCIAL STICKY */
.social-sticky{position:fixed;top:50%;right:24px;transform:translateY(-50%);z-index:90;display:flex;flex-direction:column;gap:14px;padding:14px 10px;background:rgba(0,0,0,.25);backdrop-filter:blur(10px);border-radius:40px;border:1px solid rgba(255,255,255,.12);transition:background .4s,border-color .4s}
.social-sticky a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:50%;transition:transform .3s,background .3s,color .3s}
.social-sticky a svg{width:18px;height:18px;display:block;flex-shrink:0}
.social-sticky a:hover{background:#fff;color:var(--black);transform:scale(1.1)}
body.scrolled .social-sticky{background:rgba(255,255,255,.9);border-color:rgba(0,0,0,.08);box-shadow:0 4px 24px rgba(0,0,0,.08)}
body.scrolled .social-sticky a{color:var(--black)}
body.scrolled .social-sticky a:hover{background:var(--black);color:#fff}

/* FOOTER */
footer{background:var(--black);color:rgba(255,255,255,.6);padding:0}
footer a{color:rgba(255,255,255,.6);text-decoration:none;transition:color .3s}
footer a:hover{color:#fff}
.ft-top{max-width:1200px;margin:0 auto;padding:64px 40px 48px}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;align-items:start}
.ft-brand{display:flex;flex-direction:column;gap:8px}
.ft-name{font-family:var(--serif);font-size:24px;font-weight:300;color:#fff;letter-spacing:4px}
.ft-tagline{font-size:11px;letter-spacing:2px;color:rgba(255,255,255,.35);font-weight:300}
.ft-col{display:flex;flex-direction:column;gap:10px}
.ft-col a{font-size:13px;font-weight:300}
.ft-heading{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.3);font-weight:400;margin-bottom:4px}
.ft-bottom{border-top:1px solid rgba(255,255,255,.08);max-width:1200px;margin:0 auto;padding:20px 40px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1.5px;color:rgba(255,255,255,.2);font-weight:300}

/* MOBILE */
@media(max-width:768px){
  nav{padding:16px 20px}nav .links{display:none}nav .ham{display:flex}
  .social-sticky{top:auto!important;right:auto!important;left:50%!important;bottom:16px!important;transform:translateX(-50%)!important;flex-direction:row!important;padding:10px 14px!important;gap:10px!important}
  .social-sticky a{width:32px;height:32px}
  .social-sticky a svg{width:16px;height:16px}
  section{padding:80px 20px}
  .bio-layout{grid-template-columns:1fr;gap:32px}
  .bio-stats{gap:24px;flex-wrap:wrap}
  .bio-stat .n{font-size:36px}
  .mus-grid{grid-template-columns:1fr}
  .gal-mosaic{column-count:2}
  .vid-row{grid-template-columns:1fr}
  .tour-box{padding:32px 20px}
  .ft-grid{grid-template-columns:1fr 1fr;gap:32px}
  .ft-brand{grid-column:span 2}
  .ft-bottom{flex-direction:column;gap:8px;text-align:center}
}
