:root{--bg:#050816;--panel:#0a0e20;--text:#f5f7ff;--muted:#b6bdd1;--pink:#ff2bd6;--cyan:#22e3ff;--lime:#c9ff27;--line:rgba(255,255,255,.14);--max:1240px;--accent:var(--cyan)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:radial-gradient(circle at 50% 0,rgba(34,227,255,.12),transparent 34rem),linear-gradient(#050816,#070b18);font-family:Inter,Segoe UI,Arial,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:44px 44px}.noise{position:fixed;inset:0;background:url('../images/noise.svg');opacity:.035;pointer-events:none}.skip-link{position:absolute;top:-4rem;left:1rem;background:white;color:black;padding:.7rem;z-index:50}.skip-link:focus{top:1rem}.site-header,main,footer{width:min(calc(100% - 1.2rem),var(--max));margin:auto}.site-header{min-height:86px;display:flex;align-items:center;gap:1.4rem;border-bottom:1px solid var(--line);position:relative;z-index:40}.brand{display:flex;align-items:center;text-decoration:none;flex:0 0 auto}.brand img{display:block;width:clamp(150px,17vw,220px);height:auto;filter:drop-shadow(0 0 14px rgba(34,227,255,.14))}.desktop-nav{display:flex;align-items:center;gap:1.15rem;margin-left:auto}.desktop-nav a{text-decoration:none;color:var(--muted);font-size:.84rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;padding:.7rem .15rem;border-bottom:2px solid transparent}.desktop-nav a:hover,.desktop-nav a:focus-visible{color:var(--text);border-color:var(--cyan)}.header-tag{margin-left:.6rem}.menu-toggle{display:none;margin-left:auto;width:48px;height:44px;border:1px solid rgba(34,227,255,.35);border-radius:.75rem;background:rgba(5,8,22,.88);padding:9px;cursor:pointer;box-shadow:0 0 18px rgba(34,227,255,.12)}.menu-toggle span{display:block;height:2px;margin:5px 0;background:linear-gradient(90deg,var(--pink),var(--cyan),var(--lime));border-radius:3px}.mobile-nav{position:fixed;z-index:100;top:0;right:0;width:min(88vw,390px);height:100dvh;background:linear-gradient(180deg,#080c1d,#050713);border-left:1px solid rgba(34,227,255,.32);box-shadow:-20px 0 70px rgba(0,0,0,.6);padding:1rem;transform:translateX(0)}.mobile-nav[hidden],.nav-backdrop[hidden]{display:none}.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--line)}.mobile-nav-head img{width:170px}.menu-close{width:44px;height:44px;border:1px solid rgba(255,43,214,.45);border-radius:50%;background:transparent;color:white;font-size:2rem;line-height:1;cursor:pointer}.mobile-nav nav{display:grid;margin-top:1rem}.mobile-nav nav a{text-decoration:none;padding:1rem .4rem;border-bottom:1px solid var(--line);font-weight:900;letter-spacing:.1em;text-transform:uppercase}.mobile-nav nav a:nth-child(1){color:var(--pink)}.mobile-nav nav a:nth-child(2){color:var(--cyan)}.mobile-nav nav a:nth-child(3){color:var(--lime)}.mobile-nav p{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;margin:1.3rem .4rem}.nav-backdrop{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.7);backdrop-filter:blur(4px)}body.nav-open{overflow:hidden}.header-tag,.eyebrow{font:800 .72rem/1.2 ui-monospace,monospace;letter-spacing:.22em;color:var(--cyan)}.hero{padding:2rem 0 3rem;display:grid;grid-template-columns:.82fr 1.18fr;gap:1rem;align-items:stretch}.hero-copy,.hero-trio,.signup,.about{border:1px solid var(--line);background:linear-gradient(180deg,rgba(11,15,33,.95),rgba(6,9,21,.9));border-radius:1.5rem;box-shadow:0 24px 70px rgba(0,0,0,.42)}.hero-copy{padding:clamp(1.3rem,3vw,2.4rem);display:flex;flex-direction:column;justify-content:center}.eyebrow{margin:0 0 .8rem}.hero-logo{display:block;width:min(100%,560px);height:auto;margin:.25rem 0 .45rem;filter:drop-shadow(0 0 26px rgba(34,227,255,.18))}.hero-tagline{margin:0 0 1rem;color:var(--cyan);font:800 clamp(.78rem,1.7vw,1.08rem)/1.3 ui-monospace,monospace;letter-spacing:.22em}.lead{color:var(--muted);line-height:1.75;font-size:1.06rem}.view-bios{margin-top:1rem;color:var(--cyan);font-weight:800;letter-spacing:.13em;text-decoration:none}.hero-trio{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}.hero-member{position:relative;margin:0;min-height:620px;overflow:hidden;border-right:1px solid var(--line)}.hero-member:last-child{border-right:0}.hero-member img{width:100%;height:100%;object-fit:cover}.hero-member:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 58%,rgba(5,8,22,.95))}.hero-member figcaption{position:absolute;z-index:2;left:1rem;bottom:1rem}.hero-member b,.hero-member span{display:block}.hero-member b{font-size:1.35rem;text-transform:uppercase}.hero-member span{color:var(--accent);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase}.accent-pink{--accent:var(--pink)}.accent-cyan{--accent:var(--cyan)}.accent-lime{--accent:var(--lime)}.members{padding:3rem 0}.section-title h2{font-size:clamp(2rem,5vw,3.4rem);margin:.2rem 0 1.5rem}.member-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;align-items:start}.member-card{border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:1rem;background:rgba(7,10,23,.94);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}.member-card[open]{border-color:color-mix(in srgb,var(--accent) 75%,white 10%);box-shadow:0 12px 30px rgba(0,0,0,.28),0 0 20px color-mix(in srgb,var(--accent) 14%,transparent)}.member-card summary{list-style:none;cursor:pointer;padding:.7rem;display:grid;grid-template-columns:84px 1fr;gap:.75rem;align-items:center;min-height:102px}.member-card summary::-webkit-details-marker{display:none}.member-card summary img{width:84px;height:84px;object-fit:cover;border-radius:.75rem}.member-summary{display:block;padding:0}.member-summary b,.member-summary em,.member-summary span,.member-summary strong{display:block}.member-summary b{font-size:1.25rem;text-transform:uppercase;line-height:1.05}.member-summary em{font-style:normal;color:var(--accent);font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin:.2rem 0 .32rem;font-size:.76rem}.member-summary span{color:var(--muted);line-height:1.35;font-size:.82rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.reveal{margin-top:.45rem;color:var(--accent);letter-spacing:.1em;font-size:.72rem}.member-card[open] .member-summary span{-webkit-line-clamp:1}.member-card[open] .reveal{font-size:0}.member-card[open] .reveal:after{content:'HIDE BIO';font-size:.72rem}.member-bio{border-top:1px solid var(--line);padding:.85rem;color:var(--muted);line-height:1.55;font-size:.9rem}.member-bio p{margin-bottom:.75rem}.member-bio h3{color:var(--accent);font-size:.72rem;letter-spacing:.16em;margin-bottom:.35rem}.signup{padding:clamp(1.2rem,4vw,2.5rem);display:grid;grid-template-columns:1fr 1.1fr;gap:2rem;align-items:center;margin-bottom:2rem}.signup h2,.about h2{font-size:clamp(2rem,5vw,3.2rem);margin:.2rem 0 .6rem}.signup p,.about p{color:var(--muted);line-height:1.7}.signup label{display:block;font-weight:700;margin-bottom:.5rem}.form-row{display:flex;gap:.6rem}.form-row input{flex:1;min-width:0;background:#050816;border:1px solid var(--line);color:white;border-radius:.8rem;padding:1rem}.form-row button{border:0;border-radius:.8rem;padding:1rem 1.4rem;background:linear-gradient(90deg,var(--pink),#8a2cff);color:white;font-weight:900;letter-spacing:.08em}.consent{display:flex!important;align-items:flex-start;gap:.55rem;margin-top:.8rem;color:var(--muted);font-size:.85rem;font-weight:400!important}.trap{position:absolute;left:-9999px}.form-status{margin:.8rem 0 0}.success{color:var(--lime)!important}.error{color:#ff8698!important}.about{padding:1.4rem 1.6rem;margin-bottom:2rem}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:1.4rem 0 2rem;color:var(--muted);font-size:.85rem}@keyframes pulse{to{height:95%;opacity:.45}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}@media(max-width:920px){.desktop-nav,.header-tag{display:none}.menu-toggle{display:block}.hero{grid-template-columns:1fr}.hero-trio{min-height:470px}.hero-member{min-height:470px}.member-grid{grid-template-columns:1fr}.member-card summary{grid-template-columns:90px 1fr;min-height:108px}.member-card summary img{width:90px;height:90px}.signup{grid-template-columns:1fr}}@media(max-width:600px){.site-header{min-height:72px}.brand img{width:155px}.mobile-nav-head img{width:175px}.menu-toggle{width:44px;height:40px}.hero{padding-top:1rem}.hero-logo{width:min(100%,430px)}.hero-tagline{letter-spacing:.14em}.hero-trio{min-height:360px}.hero-member{min-height:360px}.hero-member figcaption{left:.55rem;bottom:.65rem}.hero-member b{font-size:.86rem}.hero-member span{font-size:.58rem}.member-card summary{grid-template-columns:78px 1fr;min-height:94px}.member-card summary img{width:78px;height:78px}.member-summary b{font-size:1.12rem}.member-summary span{font-size:.78rem}.form-row{flex-direction:column}footer{display:block}}

/* SHƐ11 approved visual system */
.brand img{width:clamp(150px,16vw,215px)}
.hero{display:none}
.hero-banner{
  position:relative;
  margin:1rem auto 0;
  overflow:hidden;
  min-height:clamp(280px,36vw,430px);
  border:1px solid var(--line);
  border-radius:1.5rem;
  background:#050816;
  box-shadow:0 24px 70px rgba(0,0,0,.45)
}
.hero-banner-image{
  width:100%;
  height:100%;
  min-height:clamp(280px,36vw,430px);
  object-fit:cover;
  object-position:center;
  display:block
}
.hero-banner:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(5,8,22,.72),transparent 42%,transparent 75%,rgba(5,8,22,.35));
  pointer-events:none
}
.hero-banner-copy{
  position:absolute;
  z-index:2;
  left:clamp(1.1rem,4vw,3.5rem);
  bottom:clamp(1rem,3vw,2.2rem);
  width:min(38rem,80%);
  padding:1rem 1.1rem;
  border-left:3px solid var(--pink);
  background:linear-gradient(90deg,rgba(5,8,22,.88),rgba(5,8,22,.30));
  backdrop-filter:blur(4px)
}
.hero-banner-copy p:not(.eyebrow){margin:.35rem 0;color:#d8dceb;line-height:1.55}
.members{padding-top:2.3rem}
.member-grid{gap:1rem}
.member-card{background:linear-gradient(180deg,rgba(8,12,25,.98),rgba(4,7,17,.96))}
.member-card summary{grid-template-columns:96px 1fr;min-height:112px}
.member-card summary img{width:96px;height:96px}
.member-card.accent-pink{border-color:rgba(255,43,214,.55)}
.member-card.accent-cyan{border-color:rgba(34,227,255,.55)}
.member-card.accent-lime{border-color:rgba(201,255,39,.55)}
.mobile-nav-head img{width:180px}
@media(max-width:920px){
  .hero-banner{min-height:310px}
  .hero-banner-image{min-height:310px;object-position:center}
  .hero-banner-copy{width:88%}
}
@media(max-width:600px){
  .brand img{width:145px}
  .hero-banner{min-height:260px;border-radius:1rem}
  .hero-banner-image{min-height:260px;object-fit:cover}
  .hero-banner-copy{left:.7rem;right:.7rem;bottom:.7rem;width:auto;padding:.7rem .8rem}
  .hero-banner-copy p:not(.eyebrow){font-size:.82rem;margin:.2rem 0}
  .hero-banner-copy .view-bios{font-size:.72rem}
  .member-card summary{grid-template-columns:82px 1fr;min-height:98px}
  .member-card summary img{width:82px;height:82px}
}


/* Cosmic Sound Universe — approved bright cyberpunk treatment */
:root{
  --cosmic-blue:#42d8ff;
  --cosmic-violet:#9a54ff;
  --cosmic-pink:#ff48cf;
  --cosmic-lime:#d8ff31;
}
body{
  background:
    radial-gradient(circle at 18% 8%,rgba(71,113,255,.28),transparent 26rem),
    radial-gradient(circle at 75% 12%,rgba(255,72,207,.24),transparent 28rem),
    radial-gradient(circle at 55% 62%,rgba(49,207,255,.13),transparent 36rem),
    linear-gradient(180deg,#080b24 0%,#07091a 48%,#090b1f 100%);
}
body:before{
  opacity:.72;
  background-image:
    radial-gradient(circle at 12% 18%,rgba(255,255,255,.85) 0 1px,transparent 1.5px),
    radial-gradient(circle at 55% 8%,rgba(255,255,255,.75) 0 1px,transparent 1.5px),
    radial-gradient(circle at 83% 30%,rgba(255,255,255,.7) 0 1px,transparent 1.5px),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:180px 180px,240px 240px,300px 300px,48px 48px,48px 48px;
}
.site-header{
  background:linear-gradient(180deg,rgba(7,10,28,.96),rgba(7,10,28,.76));
}
.hero-banner{
  border-color:rgba(122,180,255,.36);
  box-shadow:
    0 30px 90px rgba(2,7,30,.62),
    0 0 55px rgba(76,177,255,.16),
    0 0 70px rgba(255,72,207,.11);
}
.hero-banner:after{
  background:
    linear-gradient(90deg,rgba(5,8,28,.48),transparent 35%,transparent 74%,rgba(5,8,28,.22)),
    linear-gradient(180deg,transparent 50%,rgba(5,8,28,.38));
}
.hero-banner-copy{
  border-left-color:var(--cosmic-pink);
  background:linear-gradient(90deg,rgba(8,13,40,.88),rgba(8,13,40,.34));
  box-shadow:0 0 32px rgba(255,72,207,.13);
}
.section-head h2{
  color:#fff;
  text-shadow:0 0 22px rgba(255,72,207,.26);
}
.member-card{
  background:
    linear-gradient(180deg,rgba(18,24,53,.94),rgba(8,12,30,.94));
  box-shadow:
    0 18px 45px rgba(0,0,0,.34),
    inset 0 0 28px rgba(63,154,255,.045);
}
.member-card summary img{
  filter:saturate(1.08) contrast(1.03) brightness(1.05);
}
.member-card.accent-pink{
  box-shadow:0 18px 45px rgba(0,0,0,.34),0 0 28px rgba(255,72,207,.14);
}
.member-card.accent-cyan{
  box-shadow:0 18px 45px rgba(0,0,0,.34),0 0 28px rgba(66,216,255,.14);
}
.member-card.accent-lime{
  box-shadow:0 18px 45px rgba(0,0,0,.34),0 0 28px rgba(216,255,49,.13);
}
.signup{
  background:
    linear-gradient(120deg,rgba(20,18,58,.94),rgba(12,21,54,.9));
  box-shadow:
    0 20px 55px rgba(0,0,0,.38),
    0 0 34px rgba(255,72,207,.12);
}
.submit{
  background:linear-gradient(90deg,#d52bff,#ff42a8);
  box-shadow:0 0 26px rgba(255,66,168,.34);
}
.site-footer{
  background:linear-gradient(180deg,rgba(8,11,28,.32),rgba(8,11,28,.78));
}
.mobile-nav{
  background:
    radial-gradient(circle at 20% 15%,rgba(90,86,255,.18),transparent 22rem),
    radial-gradient(circle at 80% 35%,rgba(255,72,207,.16),transparent 22rem),
    rgba(6,9,25,.98);
}
@media(max-width:600px){
  .hero-banner{
    min-height:300px;
  }
  .hero-banner-image{
    min-height:300px;
    object-position:center;
  }
  .hero-banner-copy{
    backdrop-filter:blur(8px);
  }
}


/* Hero rendering fix: clean background + independent logo/text layers */
.hero-banner{
  min-height:clamp(420px,42vw,560px);
  display:grid;
  place-items:center;
}
.hero-banner-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  object-position:center;
}
.hero-brand-lockup{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:min(72%,820px);
  margin-top:-2rem;
  text-align:center;
}
.hero-brand-logo{
  display:block;
  width:min(100%,690px);
  height:auto;
  filter:drop-shadow(0 0 18px rgba(255,255,255,.12))
         drop-shadow(0 0 34px rgba(172,255,30,.15));
}
.hero-brand-tagline{
  display:flex;
  gap:.8rem;
  justify-content:center;
  flex-wrap:wrap;
  margin:.55rem 0 0;
  font:800 clamp(.82rem,1.6vw,1.15rem)/1.35 ui-monospace,monospace;
  letter-spacing:.22em;
}
.hero-brand-tagline span:first-child{color:var(--cyan)}
.hero-brand-tagline span:last-child{color:#ff62cf}
.hero-banner-copy{
  left:clamp(1rem,3vw,2.4rem);
  bottom:clamp(.9rem,2vw,1.5rem);
  width:min(42rem,72%);
  padding:.85rem 1rem;
}
@media(max-width:700px){
  .hero-banner{
    min-height:365px;
  }
  .hero-brand-lockup{
    width:86%;
    margin-top:-3.5rem;
  }
  .hero-brand-logo{
    width:min(100%,520px);
  }
  .hero-brand-tagline{
    gap:.2rem;
    flex-direction:column;
    font-size:.76rem;
    letter-spacing:.17em;
  }
  .hero-banner-copy{
    left:.7rem;
    right:.7rem;
    bottom:.65rem;
    width:auto;
  }
}


/* Final hero polish */
.site-header{
  min-height:82px;
  padding:.75rem 0;
}
.brand img{
  width:clamp(150px,14vw,205px);
  max-height:58px;
  object-fit:contain;
}
.hero-banner{
  min-height:clamp(360px,34vw,470px);
}
.hero-brand-lockup{
  width:min(58%,680px);
  margin-top:-3.2rem;
}
.hero-brand-logo{
  width:100%;
  max-width:680px;
}
.hero-brand-tagline{
  margin-top:.35rem;
  font-size:clamp(.75rem,1.25vw,1rem);
}
.hero-banner-copy{
  left:clamp(1rem,2.5vw,2rem);
  bottom:clamp(.8rem,1.5vw,1.2rem);
  width:min(39rem,58%);
  padding:.75rem .9rem;
  background:linear-gradient(90deg,rgba(5,8,28,.92),rgba(5,8,28,.46));
}
.hero-banner-copy .eyebrow{
  margin-bottom:.45rem;
}
.hero-banner-copy p:not(.eyebrow){
  margin:.15rem 0 .35rem;
  font-size:clamp(.9rem,1.3vw,1.05rem);
}
.members{
  padding-top:1.8rem;
}
.section-head h2{
  font-size:clamp(2rem,4.2vw,3.6rem);
  line-height:1;
}

@media(max-width:900px){
  .hero-banner{
    min-height:390px;
  }
  .hero-brand-lockup{
    width:72%;
    margin-top:-4.6rem;
  }
  .hero-banner-copy{
    width:72%;
  }
}

@media(max-width:600px){
  .site-header{
    min-height:70px;
  }
  .brand img{
    width:138px;
    max-height:48px;
  }
  .hero-banner{
    min-height:330px;
  }
  .hero-brand-lockup{
    width:82%;
    margin-top:-5rem;
  }
  .hero-brand-tagline{
    font-size:.7rem;
    letter-spacing:.14em;
  }
  .hero-banner-copy{
    width:auto;
    left:.6rem;
    right:.6rem;
    bottom:.55rem;
    padding:.65rem .75rem;
  }
  .hero-banner-copy p:not(.eyebrow){
    font-size:.78rem;
    line-height:1.45;
  }
  .section-head h2{
    font-size:2rem;
  }
}


/* Corrected SHƐ11 logo rendering */
.brand img,
.hero-brand-logo,
.mobile-nav-head img{
  object-fit:contain;
  object-position:center;
  height:auto;
  image-rendering:auto;
}
.hero-brand-logo{
  max-height:240px;
}
