
:root{
  --sp-dark:#0f0404;
  --sp-light:#f7e8e8;
  --sp-coral:#f96a56;
  --sp-white:#ffffff;
  --sp-gray:#d7d0d0;
  --max:1220px;
  --line:rgba(15,4,4,.20);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sp-light);color:var(--sp-dark);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:Arial Black,Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:-.04em;line-height:.92}
h1{font-size:clamp(3.7rem,11vw,9.5rem)}
h2{font-size:clamp(2.6rem,6vw,5.4rem)}
h3{font-size:1.3rem}
.container{width:min(calc(100% - 32px),var(--max));margin:auto}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:16px;top:16px;z-index:999;background:var(--sp-white);padding:10px 14px}
.site-header{position:sticky;top:0;z-index:100;background:rgba(247,232,232,.96);backdrop-filter:blur(10px);border-bottom:2px solid var(--sp-dark)}
.nav{min-height:76px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.brand{width:168px}
.brand img{width:100%;height:auto}
.nav-links{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{text-decoration:none;font-size:.84rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.nav-links a:hover,.nav-links a:focus-visible,.nav-links a[aria-current=page]{color:var(--sp-coral)}
.menu-btn{display:none;border:2px solid var(--sp-dark);background:transparent;padding:8px 14px;font-weight:900;text-transform:uppercase}
.hero{min-height:88vh;position:relative;display:grid;align-items:end;color:var(--sp-light);background:url("../images/hero.webp") center/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,4,4,.05),rgba(15,4,4,.83))}
.hero .container{position:relative;z-index:2;padding:140px 0 70px}
.hero-logo{width:min(760px,90vw);margin-left:auto}
.hero-copy{max-width:720px;margin:24px 0 0 auto;font-size:clamp(1.1rem,2vw,1.45rem);font-weight:700}
.button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;justify-content:flex-end}
.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:11px 19px;border:2px solid var(--sp-dark);background:var(--sp-dark);color:var(--sp-light);font-weight:900;text-transform:uppercase;text-decoration:none;letter-spacing:.04em}
.button.coral{background:var(--sp-coral);color:var(--sp-dark)}
.button.light{background:var(--sp-light);color:var(--sp-dark)}
.button:hover,.button:focus-visible{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--sp-dark)}
.section{padding:92px 0;border-bottom:2px solid var(--sp-dark)}
.section.dark{background:var(--sp-dark);color:var(--sp-light)}
.section.coral{background:var(--sp-coral)}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.kicker{text-transform:uppercase;font-weight:900;letter-spacing:.12em;font-size:.76rem;margin-bottom:18px}
.card{border:2px solid var(--sp-dark);background:var(--sp-white);padding:26px}
.dark .card{background:var(--sp-light);color:var(--sp-dark)}
.release-art{width:100%;aspect-ratio:1;object-fit:cover;border:2px solid var(--sp-dark)}
.photo-strip{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}
.photo-strip img{width:100%;height:100%;object-fit:cover;border:2px solid var(--sp-dark)}
.embed{aspect-ratio:16/9;border:2px solid var(--sp-dark);background:#000}
.embed iframe{width:100%;height:100%;border:0}
.member-grid,.downloads,.social-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.member,.download,.social{border:2px solid var(--sp-dark);padding:20px;background:var(--sp-white)}
.member strong{display:block;color:var(--sp-coral);text-transform:uppercase}
.social{text-align:center;text-decoration:none;font-weight:900;text-transform:uppercase}
.press-quote{font-family:Arial Black,Arial,sans-serif;text-transform:uppercase;font-size:clamp(1.7rem,3.8vw,3.5rem);line-height:1.05}
.press-quote cite{display:block;font-family:Arial,Helvetica,sans-serif;font-size:.95rem;letter-spacing:.05em;margin-top:20px}
footer{background:var(--sp-dark);color:var(--sp-light);padding:34px 0}
.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:900px){.grid-2,.photo-strip{grid-template-columns:1fr}.grid-3,.member-grid,.downloads,.social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-logo,.hero-copy{margin-left:0}.button-row{justify-content:flex-start}}
@media(max-width:720px){.menu-btn{display:block}.nav-links{display:none;position:absolute;left:0;right:0;top:76px;padding:18px;background:var(--sp-light);border-bottom:2px solid var(--sp-dark)}.nav-links.open{display:grid}.section{padding:66px 0}.grid-3,.member-grid,.downloads,.social-grid{grid-template-columns:1fr}.hero{min-height:78vh}.hero .container{padding:110px 0 46px}}



/* Homepage hero logo refinement */
.hero .container{
  padding-top:clamp(190px,24vh,290px);
  padding-bottom:72px;
}

.hero-logo-dark{
  width:min(900px,88vw);
  margin-left:auto;
  margin-top:48px;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
}

.hero-logo-dark img{
  display:block;
  width:100%;
  height:auto;
  transform:translateY(18px);
  filter:
    drop-shadow(0 2px 0 rgba(247,232,232,.65))
    drop-shadow(0 8px 18px rgba(15,4,4,.32));
}

.hero-copy{
  margin-top:50px;
}

@media(max-width:900px){
  .hero .container{
    padding-top:170px;
  }

  .hero-logo-dark{
    width:min(760px,92vw);
    margin-left:0;
    margin-top:34px;
  }

  .hero-logo-dark img{
    transform:translateY(14px);
  }
}

@media(max-width:720px){
  .hero .container{
    padding-top:145px;
    padding-bottom:48px;
  }

  .hero-logo-dark{
    width:94vw;
    margin-top:28px;
  }

  .hero-logo-dark img{
    transform:translateY(10px);
  }

  .hero-copy{
    margin-top:38px;
  }
}


/* Benchmark-driven editorial upgrades */
:root{
  --sp-shadow:10px 10px 0 var(--sp-dark);
  --sp-ease:cubic-bezier(.2,.7,.2,1);
}
body{overflow-x:hidden}
.primary-cta{background:var(--sp-coral)!important;color:var(--sp-dark)!important}
.secondary-cta{background:var(--sp-light)!important;color:var(--sp-dark)!important}
.tertiary-cta{background:transparent!important;color:var(--sp-light)!important;border-color:var(--sp-light)!important}
.hero-actions .button:first-child{transform:scale(1.06);transform-origin:left center}
.editorial-split{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);gap:24px;align-items:stretch}
.editorial-stack{display:grid;gap:18px}
.editorial-panel{border:2px solid var(--sp-dark);background:var(--sp-white);padding:28px;position:relative}
.editorial-panel.offset{transform:translateY(34px);background:var(--sp-coral)}
.editorial-image{width:100%;height:100%;min-height:480px;object-fit:cover;border:2px solid var(--sp-dark)}
.pull-quote{font-family:Arial Black,Arial,sans-serif;text-transform:uppercase;font-size:clamp(2rem,4.7vw,4.4rem);line-height:.95;max-width:1000px}
.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:26px}
.stat{border:2px solid currentColor;padding:18px;min-height:118px}
.stat strong{display:block;font-family:Arial Black,Arial,sans-serif;font-size:1.65rem;line-height:1;text-transform:uppercase}
.release-feature{display:grid;grid-template-columns:minmax(260px,460px) 1fr;gap:54px;align-items:center}
.release-info{max-width:680px}
.release-meta{font-size:.78rem;text-transform:uppercase;font-weight:900;letter-spacing:.12em}
.credit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:26px}
.credit{border-top:2px solid currentColor;padding-top:12px}
.track-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.newsletter{border:2px solid var(--sp-dark);background:var(--sp-white);padding:28px}
.newsletter form{display:flex;gap:10px;flex-wrap:wrap}
.newsletter input{min-height:48px;flex:1 1 260px;border:2px solid var(--sp-dark);padding:10px 12px;font:inherit}
.newsletter button{min-height:48px}
.show-list{display:grid;gap:0;border-top:2px solid var(--sp-dark)}
.show-row{display:grid;grid-template-columns:150px 1fr auto;gap:20px;align-items:center;padding:18px 0;border-bottom:2px solid var(--sp-dark)}
.show-row time{font-weight:900;text-transform:uppercase}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s var(--sp-ease),transform .7s var(--sp-ease)}
.reveal.is-visible{opacity:1;transform:none}
.reveal-delay-1{transition-delay:.08s}
.reveal-delay-2{transition-delay:.16s}
.reveal-delay-3{transition-delay:.24s}
.image-float{transition:transform .35s var(--sp-ease)}
.image-float:hover{transform:translate(-5px,-5px);box-shadow:10px 10px 0 var(--sp-coral)}
.music-player{border:2px solid var(--sp-dark);background:var(--sp-light);padding:18px;margin-top:24px}
.music-player iframe{width:100%;border:0;min-height:152px}
.page-nav-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.page-nav-card{display:block;border:2px solid var(--sp-dark);background:var(--sp-white);padding:24px;text-decoration:none;min-height:180px}
.page-nav-card:hover,.page-nav-card:focus-visible{background:var(--sp-coral);transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--sp-dark)}
@media(max-width:900px){
  .editorial-split,.release-feature{grid-template-columns:1fr}
  .editorial-panel.offset{transform:none}
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .show-row{grid-template-columns:1fr}
  .page-nav-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .stat-row,.credit-grid,.page-nav-cards{grid-template-columns:1fr}
  .editorial-image{min-height:340px}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .image-float:hover,.page-nav-card:hover,.page-nav-card:focus-visible{transform:none}
}


/* =========================================================
   CLEAN CONTRAST-SAFE RELEASE
   ========================================================= */

:root{
  --sp-dark:#0f0404;
  --sp-light:#f7e8e8;
  --sp-coral:#f96a56;
  --sp-white:#ffffff;
  --sp-muted:#6f6363;
}

body{
  background:var(--sp-light);
  color:var(--sp-dark);
}

/* Never place brand marks directly over visually busy photography */
.hero{
  min-height:86vh;
  background:
    linear-gradient(90deg,rgba(247,232,232,.98) 0%,rgba(247,232,232,.92) 42%,rgba(247,232,232,.36) 68%,rgba(15,4,4,.20) 100%),
    url("../images/hero.webp") center/cover no-repeat;
  color:var(--sp-dark);
  align-items:center;
}

.hero::after{
  display:none;
}

.hero .container{
  padding-top:150px;
  padding-bottom:90px;
}

.hero-logo-dark{
  width:min(760px,82vw);
  margin:0;
  transform:none;
}

.hero-logo-dark img{
  transform:none;
  filter:none;
}

.hero-copy{
  max-width:640px;
  margin:32px 0 0;
  color:var(--sp-dark);
  text-shadow:none;
}

.hero-actions{
  justify-content:flex-start;
}

.tertiary-cta{
  color:var(--sp-dark)!important;
  border-color:var(--sp-dark)!important;
}

/* High-contrast image framing */
.editorial-image,
.release-art,
.photo-strip img,
.image-float{
  border:2px solid var(--sp-dark);
  background:var(--sp-white);
}

/* Keep copy out of images */
.image-copy-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);
  gap:28px;
  align-items:stretch;
}

.copy-panel{
  background:var(--sp-white);
  color:var(--sp-dark);
  border:2px solid var(--sp-dark);
  padding:30px;
}

.copy-panel.coral{
  background:var(--sp-coral);
}

.copy-panel.dark{
  background:var(--sp-dark);
  color:var(--sp-light);
}

/* Ensure dark sections remain readable */
.section.dark,
.quote-band{
  background:var(--sp-dark);
  color:var(--sp-light);
}

.section.dark a,
.quote-band a{
  color:var(--sp-light);
}

/* Ensure coral sections use dark text only */
.section.coral,
.release-future{
  background:var(--sp-coral);
  color:var(--sp-dark);
}

/* Buttons */
.button{
  box-shadow:none;
}

.button:hover,
.button:focus-visible{
  transform:translate(-2px,-2px);
  box-shadow:5px 5px 0 var(--sp-dark);
}

.button.light{
  background:var(--sp-light);
  color:var(--sp-dark);
  border-color:var(--sp-dark);
}

/* Better readable cards */
.card,
.editorial-panel,
.download,
.member,
.social,
.newsletter,
.page-nav-card{
  background:var(--sp-white);
  color:var(--sp-dark);
}

.dark .card,
.dark .editorial-panel,
.dark .download{
  background:var(--sp-light);
  color:var(--sp-dark);
}

/* Safer image cropping */
.editorial-image{
  object-position:center center;
}

img[alt*="portrait"]{
  object-position:center 25%;
}

/* Photos page: no text directly over images */
.photo-caption{
  margin-top:10px;
  font-size:.9rem;
  font-weight:700;
}

/* Mobile contrast */
@media(max-width:900px){
  .hero{
    background:
      linear-gradient(180deg,rgba(247,232,232,.98) 0%,rgba(247,232,232,.94) 58%,rgba(247,232,232,.72) 100%),
      url("../images/hero.webp") center/cover no-repeat;
  }

  .hero-logo-dark{
    width:min(700px,92vw);
  }

  .image-copy-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:720px){
  .hero{
    min-height:auto;
  }

  .hero .container{
    padding-top:115px;
    padding-bottom:54px;
  }

  .hero-logo-dark{
    width:94vw;
  }
}





/* =========================================================
   VERSION 4: NATURAL-ASPECT EDITORIAL IMAGE LAYOUTS
   ========================================================= */

.home-feature-photo,
.music-banner-photo,
.yellow-portrait-photo{
  display:block;
  width:100%;
  height:auto;
  object-fit:initial;
  object-position:initial;
  border:2px solid var(--sp-dark);
  background:var(--sp-light);
}

.home-feature-wrap,
.music-banner-wrap{
  margin-bottom:24px;
}

.home-story-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.8fr);
  gap:20px;
  align-items:start;
}

.home-story-copy{
  background:var(--sp-coral);
  color:var(--sp-dark);
  border:2px solid var(--sp-dark);
  padding:30px;
}

.music-release-editorial{
  display:grid;
  gap:28px;
}

.music-release-copy{
  max-width:900px;
}

.music-release-copy.dark-copy{
  color:var(--sp-light);
}

.yellow-release-grid{
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
  gap:42px;
  align-items:start;
}

.yellow-portrait-photo{
  max-width:680px;
  margin:0 auto;
}

.apple-music-button{
  background:var(--sp-light)!important;
  color:var(--sp-dark)!important;
  border-color:var(--sp-dark)!important;
}

.apple-music-button:hover,
.apple-music-button:focus-visible{
  background:var(--sp-white)!important;
  color:var(--sp-dark)!important;
}

@media(max-width:900px){
  .home-story-grid,
  .yellow-release-grid{
    grid-template-columns:1fr;
  }
}


/* Version 6 group-focused imagery */
.group-image{
  display:block;
  width:100%;
  height:auto;
  border:2px solid var(--sp-dark);
}

.yellow-portrait-photo[src*="group-editorial"]{
  max-width:100%;
  width:100%;
  height:auto;
}

.download{display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:250px}
.download .button{align-self:flex-start}
.download.unavailable{background:var(--sp-light);border-style:dashed;opacity:.8}
.resource-status{display:inline-block;width:max-content;border:2px solid var(--sp-dark);padding:8px 12px;font-weight:900;text-transform:uppercase;font-size:.78rem;letter-spacing:.06em}


/* Streamlined navigation and merchandise */
.footer-links a{
  color:var(--sp-light);
  font-weight:900;
  text-transform:uppercase;
  text-decoration:none;
  font-size:.78rem;
  letter-spacing:.06em;
}
.footer-links a:hover,
.footer-links a:focus-visible{
  color:var(--sp-coral);
}

.merch-feature{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);
  gap:42px;
  align-items:center;
}

.merch-feature-image{
  width:100%;
  height:auto;
  border:2px solid var(--sp-light);
  background:var(--sp-light);
}

.merch-feature-copy{
  max-width:620px;
}

.merch-status-grid .card{
  min-height:220px;
}

@media(max-width:900px){
  .merch-feature{
    grid-template-columns:1fr;
  }
}


.merch-store-cta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:36px;
}

.merch-store-cta > div{
  max-width:720px;
}

.text-link{
  font-weight:900;
  color:var(--sp-dark);
}

@media(max-width:760px){
  .merch-store-cta{
    align-items:flex-start;
    flex-direction:column;
  }
}


/* Action-first page structure */
.hero-quick-actions{
  margin-top:24px;
}

.closing-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:36px;
}

.closing-cta-copy{
  max-width:760px;
}

.closing-cta .track-actions{
  margin-top:0;
  flex-shrink:0;
}

@media(max-width:760px){
  .closing-cta{
    align-items:flex-start;
    flex-direction:column;
  }

  .closing-cta .track-actions{
    margin-top:4px;
  }
}


/* Mailing-list integration */
.newsletter .track-actions{
  margin-top:20px;
}

.form-note{
  margin:14px 0 0;
  font-size:.86rem;
  font-weight:700;
}

.social.mailing-list-social{
  background:var(--sp-dark);
  color:var(--sp-light);
}

.social.mailing-list-social:hover,
.social.mailing-list-social:focus-visible{
  background:var(--sp-coral);
  color:var(--sp-dark);
}

/* =========================================================
   CANONICAL BUTTON CONTRAST SYSTEM
   This is the final source of truth for every button.
   Explicit -webkit-text-fill-color prevents Safari from
   displaying inherited link text in the background color.
   ========================================================= */

html body a.button,
html body button.button{
  appearance:none;
  -webkit-appearance:none;
  background:var(--sp-dark) !important;
  background-color:var(--sp-dark) !important;
  color:var(--sp-light) !important;
  -webkit-text-fill-color:var(--sp-light) !important;
  border:2px solid var(--sp-dark) !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
  text-shadow:none !important;
}

/* Coral buttons: dark text on coral. Contrast ratio: approximately 6.95:1. */
html body a.button.coral,
html body button.button.coral,
html body a.button.primary-cta,
html body button.button.primary-cta,
html body a.button.mailing-list-button,
html body button.button.mailing-list-button{
  background:var(--sp-coral) !important;
  background-color:var(--sp-coral) !important;
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
  border-color:var(--sp-dark) !important;
}

/* Light buttons: dark text on light. Contrast ratio: approximately 16.99:1. */
html body a.button.light,
html body button.button.light,
html body a.button.secondary-cta,
html body button.button.secondary-cta,
html body a.button.instagram-button,
html body button.button.instagram-button,
html body a.button.apple-music-button,
html body button.button.apple-music-button{
  background:var(--sp-light) !important;
  background-color:var(--sp-light) !important;
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
  border-color:var(--sp-dark) !important;
}

/* Extra specificity for variant buttons inside dark sections. */
html body .section.dark a.button.coral,
html body .section.dark button.button.coral,
html body .section.dark a.button.light,
html body .section.dark button.button.light,
html body .section.dark a.button.primary-cta,
html body .section.dark a.button.secondary-cta,
html body .section.dark a.button.instagram-button,
html body .section.dark a.button.apple-music-button,
html body .section.dark a.button.mailing-list-button{
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
}

/* Transparent hero button, retained for future use. */
html body a.button.tertiary-cta,
html body button.button.tertiary-cta{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--sp-light) !important;
  -webkit-text-fill-color:var(--sp-light) !important;
  border-color:var(--sp-light) !important;
}

/* Hover/focus states always retain readable text. */
html body a.button:hover,
html body a.button:focus-visible,
html body button.button:hover,
html body button.button:focus-visible{
  background:var(--sp-coral) !important;
  background-color:var(--sp-coral) !important;
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
  border-color:var(--sp-dark) !important;
}

html body a.button.coral:hover,
html body a.button.coral:focus-visible,
html body a.button.primary-cta:hover,
html body a.button.primary-cta:focus-visible,
html body a.button.mailing-list-button:hover,
html body a.button.mailing-list-button:focus-visible{
  background:var(--sp-light) !important;
  background-color:var(--sp-light) !important;
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
}

html body a.button.light:hover,
html body a.button.light:focus-visible,
html body a.button.secondary-cta:hover,
html body a.button.secondary-cta:focus-visible,
html body a.button.instagram-button:hover,
html body a.button.instagram-button:focus-visible,
html body a.button.apple-music-button:hover,
html body a.button.apple-music-button:focus-visible{
  background:var(--sp-coral) !important;
  background-color:var(--sp-coral) !important;
  color:var(--sp-dark) !important;
  -webkit-text-fill-color:var(--sp-dark) !important;
}

html body a.button:focus-visible,
html body button.button:focus-visible{
  outline:4px solid var(--sp-white) !important;
  outline-offset:4px !important;
}

/* Header menu button also receives explicit foreground/background colors. */
html body .menu-btn{
  background:var(--sp-light);
  color:var(--sp-dark);
  -webkit-text-fill-color:var(--sp-dark);
  border-color:var(--sp-dark);
}

html body .menu-btn:hover,
html body .menu-btn:focus-visible{
  background:var(--sp-coral);
  color:var(--sp-dark);
  -webkit-text-fill-color:var(--sp-dark);
}



/* FINAL BUTTON VISIBILITY FIX — applied after every earlier rule */
html body a.button,
html body a.button:link,
html body a.button:visited,
html body button.button{
  text-decoration:none !important;
  opacity:1 !important;
  filter:none !important;
}

html body a.button .button-label,
html body a.button:link .button-label,
html body a.button:visited .button-label,
html body button.button .button-label{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  text-shadow:none !important;
}

/* A default button may not share the dark-section background. */
html body .section.dark a.button,
html body .section.dark a.button:link,
html body .section.dark a.button:visited,
html body .section.dark button.button,
html body .quote-band a.button,
html body .quote-band a.button:link,
html body .quote-band a.button:visited{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#f7e8e8 !important;
}

html body .section.dark a.button .button-label,
html body .section.dark a.button:link .button-label,
html body .section.dark a.button:visited .button-label,
html body .quote-band a.button .button-label{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

/* Coral remains coral, with dark text. */
html body .section.dark a.button.coral,
html body .section.dark a.button.coral:link,
html body .section.dark a.button.coral:visited,
html body .section.dark a.button.primary-cta,
html body .section.dark a.button.mailing-list-button{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#f96a56 !important;
}

html body .section.dark a.button.coral .button-label,
html body .section.dark a.button.primary-cta .button-label,
html body .section.dark a.button.mailing-list-button .button-label{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

/* Explicit light/platform buttons: dark text in every link state. */
html body a.button.light,
html body a.button.light:link,
html body a.button.light:visited,
html body a.button.apple-music-button,
html body a.button.apple-music-button:link,
html body a.button.apple-music-button:visited,
html body a.button.youtube-button,
html body a.button.youtube-button:link,
html body a.button.youtube-button:visited,
html body a.button.secondary-cta,
html body a.button.secondary-cta:link,
html body a.button.secondary-cta:visited,
html body a.button.instagram-button,
html body a.button.instagram-button:link,
html body a.button.instagram-button:visited{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}

html body a.button.light .button-label,
html body a.button.apple-music-button .button-label,
html body a.button.youtube-button .button-label,
html body a.button.secondary-cta .button-label,
html body a.button.instagram-button .button-label{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

/* Hover/focus never changes text to the background color. */
html body a.button:hover,
html body a.button:focus-visible,
html body button.button:hover,
html body button.button:focus-visible{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}
html body a.button:hover .button-label,
html body a.button:focus-visible .button-label,
html body button.button:hover .button-label,
html body button.button:focus-visible .button-label{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

/* =========================================================
   UNIVERSAL HIGH-CONTRAST BUTTON OVERRIDE
   Added after user QA. This block is the final source of truth.
   Every button gets explicit foreground/background colors,
   including visited links, inner spans, and Safari text fill.
   ========================================================= */
html body a.button,
html body a.button:link,
html body a.button:visited,
html body button.button,
html body .menu-btn{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border:2px solid #0f0404 !important;
  text-decoration:none !important;
  opacity:1 !important;
  visibility:visible !important;
}

html body a.button *,
html body a.button:link *,
html body a.button:visited *,
html body button.button *,
html body .menu-btn *{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  opacity:1 !important;
  visibility:visible !important;
}

html body a.button.coral,
html body a.button.coral:link,
html body a.button.coral:visited,
html body button.button.coral,
html body a.button.primary-cta,
html body a.button.primary-cta:link,
html body a.button.primary-cta:visited,
html body a.button.mailing-list-button,
html body a.button.mailing-list-button:link,
html body a.button.mailing-list-button:visited{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}

html body a.button.coral *,
html body a.button.primary-cta *,
html body a.button.mailing-list-button *{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

html body a.button.light,
html body a.button.light:link,
html body a.button.light:visited,
html body button.button.light,
html body a.button.apple-music-button,
html body a.button.apple-music-button:link,
html body a.button.apple-music-button:visited,
html body a.button.youtube-button,
html body a.button.youtube-button:link,
html body a.button.youtube-button:visited,
html body a.button.instagram-button,
html body a.button.instagram-button:link,
html body a.button.instagram-button:visited,
html body a.button.secondary-cta,
html body a.button.secondary-cta:link,
html body a.button.secondary-cta:visited{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}

html body a.button.light *,
html body a.button.apple-music-button *,
html body a.button.youtube-button *,
html body a.button.instagram-button *,
html body a.button.secondary-cta *{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

html body a.button:hover,
html body a.button:focus-visible,
html body button.button:hover,
html body button.button:focus-visible,
html body .menu-btn:hover,
html body .menu-btn:focus-visible{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
  outline:4px solid #ffffff !important;
  outline-offset:3px !important;
}

html body a.button:hover *,
html body a.button:focus-visible *,
html body button.button:hover *,
html body button.button:focus-visible *,
html body .menu-btn:hover *,
html body .menu-btn:focus-visible *{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}

/* =========================================================
   TWO-BUTTON SYSTEM — FINAL OVERRIDE
   Primary: coral background / dark text
   Secondary: light background / dark text
   New stylesheet filename prevents stale browser cache.
   ========================================================= */
html body a.button,
html body a.button:link,
html body a.button:visited,
html body button.button{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:48px !important;
  padding:11px 19px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
  text-decoration:none !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
  filter:none !important;
  text-shadow:none !important;
  border:3px solid #0f0404 !important;
}
html body a.button.button-primary,
html body a.button.button-primary:link,
html body a.button.button-primary:visited,
html body button.button.button-primary{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}
html body a.button.button-secondary,
html body a.button.button-secondary:link,
html body a.button.button-secondary:visited,
html body button.button.button-secondary{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
}
html body a.button .button-label,
html body a.button:link .button-label,
html body a.button:visited .button-label,
html body button.button .button-label{
  display:inline !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
  filter:none !important;
  text-shadow:none !important;
}
html body a.button:hover,
html body a.button:focus-visible,
html body button.button:hover,
html body button.button:focus-visible{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border-color:#0f0404 !important;
  transform:translate(-3px,-3px) !important;
  box-shadow:6px 6px 0 #0f0404 !important;
}
html body a.button:hover .button-label,
html body a.button:focus-visible .button-label,
html body button.button:hover .button-label,
html body button.button:focus-visible .button-label{
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
}
html body a.button.button-primary:hover,
html body a.button.button-primary:focus-visible,
html body button.button.button-primary:hover,
html body button.button.button-primary:focus-visible{
  background:#f96a56 !important;
  background-color:#f96a56 !important;
}
html body a.button.button-secondary:hover,
html body a.button.button-secondary:focus-visible,
html body button.button.button-secondary:hover,
html body button.button.button-secondary:focus-visible{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
}
html body a.button:focus-visible,
html body button.button:focus-visible,
html body .menu-btn:focus-visible{
  outline:4px solid #ffffff !important;
  outline-offset:4px !important;
}
html body .menu-btn,
html body .menu-btn:hover,
html body .menu-btn:focus-visible{
  background:#f7e8e8 !important;
  background-color:#f7e8e8 !important;
  color:#0f0404 !important;
  -webkit-text-fill-color:#0f0404 !important;
  border:3px solid #0f0404 !important;
}



/* =========================================================
   FULL-BAND SPLIT HOMEPAGE HERO
   Uses the approved group photograph without generative AI.
   The image is never used as a text background, and contain
   prevents any member from being cropped out.
   ========================================================= */
html body .hero.hero-split{
  min-height:clamp(620px,78vh,860px);
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(360px,.85fr);
  align-items:stretch;
  background:#0f0404 !important;
  color:#f7e8e8;
  position:relative;
  overflow:hidden;
}

html body .hero.hero-split::after{
  content:none !important;
  display:none !important;
}

html body .hero-photo-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  background:#0f0404;
  padding:clamp(14px,1.5vw,28px) 0 clamp(14px,1.5vw,28px) clamp(14px,1.5vw,28px);
}

html body .hero-photo-panel img{
  display:block;
  width:100%;
  height:100%;
  max-height:820px;
  object-fit:contain;
  object-position:center;
  background:#0f0404;
}

html body .hero-content-panel{
  display:flex;
  align-items:center;
  background:#0f0404;
  border-left:2px solid #f96a56;
  padding:clamp(50px,6vw,104px) clamp(28px,5vw,88px);
}

html body .hero-content-inner{
  width:min(100%,600px);
  margin:0 auto;
}

html body .hero-logo-light{
  width:min(100%,540px);
  margin:0;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
}

html body .hero-logo-light img{
  display:block;
  width:100%;
  height:auto;
  filter:none;
}

html body .hero.hero-split .hero-copy{
  max-width:560px;
  margin:28px 0 0;
  color:#f7e8e8;
  font-size:clamp(1.1rem,1.45vw,1.4rem);
  font-weight:700;
}

html body .hero.hero-split .button-row{
  justify-content:flex-start;
  margin-top:30px;
}

@media(max-width:980px){
  html body .hero.hero-split{
    min-height:auto;
    grid-template-columns:1fr;
  }

  html body .hero-photo-panel{
    aspect-ratio:16/9;
    padding:18px 18px 0;
  }

  html body .hero-photo-panel img{
    width:100%;
    height:100%;
    max-height:none;
  }

  html body .hero-content-panel{
    border-left:0;
    border-top:2px solid #f96a56;
    padding:46px 24px 56px;
  }

  html body .hero-content-inner{
    width:min(100%,760px);
  }

  html body .hero-logo-light{
    width:min(520px,86vw);
  }
}

@media(max-width:560px){
  html body .hero-photo-panel{
    padding:10px 10px 0;
  }

  html body .hero-content-panel{
    padding:38px 20px 46px;
  }

  html body .hero.hero-split .button-row{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  html body .hero.hero-split .button{
    width:100%;
  }
}


/* Homepage hero orientation: logo/copy left, full-band image right */
html body .hero.hero-split{
  grid-template-columns:minmax(360px,.85fr) minmax(0,1.65fr);
}

html body .hero-content-panel{
  order:1;
  border-left:0;
  border-right:2px solid #f96a56;
}

html body .hero-photo-panel{
  order:2;
  padding:clamp(14px,1.5vw,28px) clamp(14px,1.5vw,28px)
          clamp(14px,1.5vw,28px) 0;
}

@media(max-width:980px){
  html body .hero-content-panel{
    order:1;
    border-right:0;
    border-bottom:2px solid #f96a56;
    border-top:0;
  }

  html body .hero-photo-panel{
    order:2;
    padding:0 18px 18px;
  }
}

@media(max-width:560px){
  html body .hero-photo-panel{
    padding:0 10px 10px;
  }
}
