:root{
  --bg:#08080c;--surface:#111116;--gold:#ffd569;--pink:#ff72bd;--blue:#67d8ff;
  --text:#fff;--muted:#b9b1c0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif}
a{color:inherit}
img{max-width:100%}
nav{position:fixed;inset:0 0 auto 0;height:82px;display:flex;align-items:center;gap:26px;padding:0 4vw;background:rgba(5,5,8,.91);backdrop-filter:blur(14px);z-index:50;border-bottom:1px solid rgba(255,213,105,.14)}
.brand-logo{display:flex;align-items:center;width:190px;height:76px;margin-right:auto}
.brand-logo img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 12px rgba(255,114,189,.20))}
nav>a,.dropbtn{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;text-decoration:none;color:#eee;background:none;border:0;cursor:pointer}
nav>a:hover,.dropbtn:hover{color:var(--blue)}
.book{background:linear-gradient(90deg,var(--gold),#fff0a4)!important;color:#080808!important;font-weight:900!important;padding:16px 28px;border-radius:4px;box-shadow:0 0 20px rgba(255,213,105,.20)}
.navdrop{position:relative}
.dropdown{position:absolute;top:42px;left:-18px;min-width:230px;background:#0c0c12;border:1px solid rgba(103,216,255,.22);padding:9px;opacity:0;visibility:hidden;transform:translateY(-7px);transition:.22s}
.dropdown.open,.navdrop:hover .dropdown{opacity:1;visibility:visible;transform:none}
.dropdown a{display:block;padding:12px;color:#ddd;text-decoration:none;font-size:13px}
.dropdown a:hover{background:rgba(103,216,255,.08);color:var(--blue)}
.hamb{display:none;background:none;border:0;color:#fff;font-size:31px;cursor:pointer}
.mobilemenu{display:none}
.wa-float{position:fixed;right:20px;top:96px;z-index:60;width:54px;height:54px;border-radius:14px;overflow:hidden;filter:drop-shadow(0 8px 18px rgba(0,0,0,.45))}
.wa-float img{width:100%;height:100%;object-fit:cover}
.hero{min-height:820px;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:#050509}
.heroimg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center center;filter:contrast(1.04) saturate(.93);background:#050509}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.38) 55%,rgba(0,0,0,.12)),linear-gradient(0deg,#08080c,transparent 60%);z-index:1}
.spot{position:absolute;top:-220px;left:9%;width:540px;height:850px;background:linear-gradient(180deg,rgba(255,236,150,.66),rgba(255,214,85,.20) 42%,transparent 88%);clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);filter:blur(18px);opacity:.76;z-index:2;mix-blend-mode:screen}
.herotxt{position:relative;z-index:3;padding:0 7vw 95px;max-width:930px}
.kicker,.eyebrow{color:var(--blue);font-size:12px;letter-spacing:4px;text-transform:uppercase;font-weight:900}
h1,h2{margin:0;text-transform:uppercase;line-height:.86;letter-spacing:-4px}
h1{font-size:clamp(70px,10vw,148px);color:var(--pink);text-shadow:0 0 12px rgba(255,114,189,.16),0 0 30px rgba(255,213,105,.14)}
h2{font-size:clamp(48px,6vw,88px);color:var(--pink)}
.gold{color:var(--gold);text-shadow:0 0 15px rgba(255,213,105,.18)}
.hero p{font-size:20px;line-height:1.6;color:#ece9ee;max-width:700px}
.cta{display:inline-block;padding:17px 30px;margin:8px 8px 0 0;background:var(--gold);color:#090909;text-decoration:none;font-weight:900;letter-spacing:1.6px;text-transform:uppercase}
.cta.alt{background:transparent;color:var(--blue);border:1px solid rgba(103,216,255,.55)}
section{padding:105px 7vw}
.dark2{background:var(--surface)}
.redband{background:linear-gradient(125deg,#110a10,#291020 55%,#09090d)}
.sectionhead{display:flex;justify-content:space-between;gap:35px;align-items:flex-end;margin-bottom:52px}
.sectionhead p{max-width:500px;color:var(--muted);line-height:1.7}
.about-lead{font-size:18px}
.about-intro{max-width:1080px;font-size:20px;line-height:1.75;color:#d9d5dc;margin-bottom:44px}
.about-highlight-grid,.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.about-highlight-grid{grid-template-columns:1fr 1fr}
.profile-card,.card{padding:30px;border:1px solid rgba(103,216,255,.16);background:linear-gradient(145deg,rgba(255,114,189,.035),rgba(103,216,255,.025))}
.profile-card h3,.card h3{font-size:27px;margin:10px 0 15px}
.profile-card p,.card p{color:#aaa5ad;line-height:1.7}
.artist-name{color:var(--pink);font-weight:800}
.hl-blue{color:var(--blue);font-weight:700}
.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.tag-list span{border:1px solid rgba(255,114,189,.26);padding:8px 10px;border-radius:999px;color:#e8dce4;font-size:13px}
.about-more{max-height:0;opacity:0;overflow:hidden;transform:translateY(-8px);transition:max-height .75s ease,opacity .45s ease,transform .45s ease,margin .45s ease}
.about-more.open{max-height:3500px;opacity:1;transform:none;margin-top:22px}
.read-more-btn{margin-top:28px;background:none;border:0;color:var(--blue);font-weight:900;letter-spacing:2px;text-transform:uppercase;cursor:pointer}
.repertoire-poster-wrap{max-width:1280px;margin:auto;border:1px solid rgba(255,213,105,.25);box-shadow:0 22px 80px rgba(0,0,0,.5),0 0 45px rgba(103,216,255,.05)}
.repertoire-poster{display:block;width:100%}
.media{display:grid;grid-template-columns:1.55fr .85fr;gap:18px}
.media img{display:block;width:100%;height:100%;object-fit:cover}
.media .main{min-height:620px}
.media .side{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.showreel-card{display:flex;align-items:center;justify-content:center;padding:34px;background:#151019}
.showreel-card h3{font-size:34px;text-transform:uppercase}
.workshop-card{scroll-margin-top:110px}
.formwrap{display:grid;grid-template-columns:1fr 1fr;gap:55px}
form{display:grid;gap:14px}
input,textarea{width:100%;background:#111116;border:1px solid #39323a;color:#fff;padding:16px;font-size:15px}
textarea{min-height:150px}
button.submit{background:linear-gradient(90deg,var(--gold),#ffeaa1);color:#080808;border:0;padding:17px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer}
.contact-links{margin-top:24px;line-height:2}
.contact-links a{color:var(--blue);text-decoration:none}
.form-message{margin-top:14px;padding:12px;border:1px solid rgba(103,216,255,.2);display:none}
.form-message.show{display:block}
footer{display:flex;justify-content:space-between;gap:20px;padding:40px 7vw;border-top:1px solid rgba(255,213,105,.13);color:#8d8890;font-size:13px}
@media(max-width:950px){
  nav{height:74px}
  nav>a:not(.brand-logo),nav .navdrop,nav .book{display:none}
  .brand-logo{width:138px;height:62px}
  .hamb{display:block}
  .mobilemenu{position:fixed;top:74px;left:0;right:0;z-index:49;background:#09090e;border-bottom:1px solid rgba(103,216,255,.18);padding:12px 5vw 18px}
  .mobilemenu.open{display:block}
  .mobilemenu a,.mobilemenu button{display:block;width:100%;text-align:left;padding:13px 0;color:#fff;text-decoration:none;background:none;border:0;font-size:15px}
  .mobile-submenu{display:none;padding-left:18px}
  .mobile-submenu.open{display:block}
  .hero{display:block;min-height:0;padding-top:74px;background:#050509}
  .heroimg{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1404/768;object-fit:contain;object-position:center center;background:#050509}
  .hero::after{top:74px;height:auto;aspect-ratio:1404/768;bottom:auto;background:linear-gradient(0deg,rgba(5,5,9,.68),rgba(5,5,9,.08) 56%,rgba(5,5,9,.02))}
  .spot{display:none}
  .herotxt{padding:28px 7vw 64px;margin-top:-14px;background:linear-gradient(180deg,#050509 0%,#08080c 100%)}
  .grid,.about-highlight-grid,.formwrap{grid-template-columns:1fr}
  .gallery-slide{flex-basis:84vw;height:430px}
  .gallery-track{gap:12px}
  .gallery-arrow{width:46px;height:46px;font-size:29px}
  .gallery-arrow.prev{left:5px}.gallery-arrow.next{right:5px}
  .showreel-row{grid-template-columns:1fr}
  .showreel-row img{height:auto;max-height:520px}
  .sectionhead{display:block}
  .sectionhead p{margin-top:22px}
  .wa-float{top:86px;right:12px;width:48px;height:48px}
}


/* About section: Music Therapy always fully visible; only Collaborations expands */
.about-more{max-height:none!important;opacity:1!important;overflow:visible!important;transform:none!important;margin-top:22px!important}
.collaboration-card{
  position:relative;
  overflow:hidden;
}
.collaboration-content{
  max-height:255px;
  overflow:hidden;
  position:relative;
  transition:max-height .7s ease;
}
.collaboration-content::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:78px;
  background:linear-gradient(to bottom,rgba(17,17,22,0),rgba(17,17,22,.96));
  pointer-events:none;
  transition:opacity .25s ease;
}
.collaboration-card.expanded .collaboration-content{
  max-height:2200px;
}
.collaboration-card.expanded .collaboration-content::after{
  opacity:0;
}
.collab-read-more{
  margin-top:18px;
  background:none;
  border:0;
  padding:0;
  color:var(--blue);
  font-weight:900;
  letter-spacing:2px;
  text-transform:uppercase;
  cursor:pointer;
}


/* ===== V3 HERO + SWIPE GALLERY OVERRIDES ===== */
@media(min-width:951px){
  .hero{min-height:820px;background:#050509}
  .heroimg{object-fit:contain!important;object-position:center center!important;background:#050509}
}
@media(max-width:950px){
  .hero{display:block!important;min-height:0!important;padding-top:74px!important;background:#050509}
  .heroimg{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;aspect-ratio:1404/768!important;object-fit:contain!important;object-position:center center!important;background:#050509}
  .hero::after{top:74px!important;bottom:auto!important;height:auto!important;aspect-ratio:1404/768!important}
  .spot{display:none!important}
  .herotxt{position:relative!important;padding:28px 7vw 64px!important;margin-top:-10px!important;background:linear-gradient(180deg,#050509,#08080c)!important}
}


/* ===== V4 GALLERY: ALWAYS ONE HORIZONTAL ROW ===== */
.gallery-viewport{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.gallery-track{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:10px!important;
  width:100%!important;
  min-width:100%!important;
  align-items:stretch;
}
.gallery-slide{
  margin:0!important;
  flex:0 0 calc((100% - 40px)/5)!important;
  min-width:0!important;
  height:240px!important;
  scroll-snap-align:center;
}
.gallery-slide img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
@media(max-width:1100px){
  .gallery-slide{flex-basis:calc((100% - 20px)/3)!important;height:300px!important}
}
@media(max-width:700px){
  .gallery-slide{flex-basis:82vw!important;height:430px!important}
  .gallery-slide img{object-fit:contain!important;background:#08090e}
}

/* ===== V4 REPERTOIRE: TEXT-BASED, SAME FOUR-COLUMN ARRANGEMENT ===== */
.repertoire-section{
  background:
    radial-gradient(circle at 50% 4%,rgba(255,213,105,.08),transparent 25%),
    linear-gradient(180deg,#060711,#080911 70%,#090910);
}
.repertoire-board{
  max-width:1280px;
  margin:0 auto;
  padding:18px;
  border:1px solid rgba(255,213,105,.24);
  border-radius:12px;
  background:
    linear-gradient(180deg,rgba(10,13,29,.96),rgba(5,7,18,.98)),
    radial-gradient(circle at 20% 10%,rgba(255,114,189,.06),transparent 20%),
    radial-gradient(circle at 80% 12%,rgba(103,216,255,.06),transparent 22%);
  box-shadow:0 24px 80px rgba(0,0,0,.45),inset 0 0 60px rgba(103,216,255,.03);
}
.repertoire-board-title{
  width:min(440px,90%);
  margin:0 auto 24px;
  padding:12px 22px;
  border-radius:8px;
  border:1px solid rgba(255,213,105,.65);
  background:linear-gradient(180deg,#694818,#4a3415);
  color:#f6ddb0;
  text-align:center;
  font-weight:950;
  letter-spacing:1.5px;
  font-size:28px;
  text-transform:uppercase;
  box-shadow:0 0 18px rgba(255,213,105,.08);
}
.repertoire-columns{
  display:grid;
  grid-template-columns:1fr 1.2fr 1fr 1.1fr;
  gap:18px;
  align-items:start;
}
.rep-column{
  min-width:0;
}
.rep-box-title{
  min-height:86px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:14px 10px;
  border-radius:8px;
  background:#111321;
  margin-bottom:12px;
  line-height:1.25;
  letter-spacing:.6px;
}
.rep-box-title strong{
  font-size:17px;
}
.rep-box-title span{
  margin-top:4px;
  font-size:15px;
}
.rep-column-1 .rep-box-title,.rep-column-1 ul{border:1px solid rgba(196,94,255,.48)}
.rep-column-2 .rep-box-title,.rep-column-2 ul{border:1px solid rgba(89,212,115,.48)}
.rep-column-3 .rep-box-title,.rep-column-3 ul{border:1px solid rgba(255,142,91,.52)}
.rep-column-4 .rep-box-title,.rep-column-4 .mini-title,.rep-column-4 ul{border:1px solid rgba(92,174,255,.50)}
.rep-column ul{
  list-style:none;
  margin:0;
  padding:14px 14px 16px 31px;
  border-radius:8px;
  color:#efe9e2;
  background:rgba(10,12,22,.56);
  line-height:1.65;
  min-height:455px;
}
.rep-column li{
  position:relative;
  font-size:14px;
}
.rep-column li::before{
  content:"•";
  position:absolute;
  left:-17px;
  color:var(--blue);
  font-weight:900;
}
.rep-column-1 li::before{color:#c666ff}
.rep-column-2 li::before{color:#62d971}
.rep-column-3 li::before{color:#ff925e}
.lounge-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.mini-title{
  padding:10px 8px;
  border-radius:8px;
  text-align:center;
  font-size:13px;
  color:#e9edf7;
  margin-bottom:10px;
  background:#111827;
  font-weight:800;
}
.rep-column-4 ul{
  min-height:0;
  padding:13px 12px 13px 28px;
}
@media(max-width:1050px){
  .repertoire-columns{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .repertoire-board{padding:12px}
  .repertoire-board-title{font-size:21px}
  .repertoire-columns{grid-template-columns:1fr}
  .rep-column ul{min-height:0}
}