/* Music-first homepage, interaction-gated Spotify players, About page, and mobile music navigation. */

/* The shared shell controls both unloaded and loaded Spotify states so the
   gate and iframe always have identical horizontal dimensions. Use available
   width up to a comfortable desktop cap rather than squeezing Spotify into a
   percentage that can trigger its internal overflow UI. */
.spotify-player-shell{
  width:min(100%,34rem);
  max-width:100%;
  min-width:0;
  overflow:hidden;
}
.release-copy>.spotify-player-shell,
.release-page-copy>.spotify-player-shell{
  margin:1.15rem 0 .95rem;
}
.catalog-card-copy>.spotify-player-shell{
  margin:.85rem 0 1rem;
}
.latest-music-card-copy>.spotify-player-shell{
  margin:.8rem 0 .9rem;
}
.spotify-player-gate{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:.9rem;
  width:100%;
  min-height:4.25rem;
  padding:.85rem 1rem;
  border:1px solid rgba(247,244,233,.2);
  border-radius:2px;
  background:linear-gradient(135deg,rgba(247,244,233,.025),rgba(217,165,71,.015));
  color:var(--light);
  text-align:left;
  cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
  transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.spotify-player-gate:hover,
.spotify-player-gate:focus-visible{
  border-color:rgba(217,165,71,.62);
  background:linear-gradient(135deg,rgba(217,165,71,.07),rgba(247,244,233,.025));
  box-shadow:inset 0 0 0 1px rgba(217,165,71,.08);
}
.spotify-player-gate:disabled{
  cursor:progress;
  opacity:.72;
}
.spotify-gate-wave{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  width:2.6rem;
  height:1.65rem;
  color:var(--ember);
}
.spotify-gate-wave span{
  display:block;
  width:2px;
  border-radius:999px;
  background:currentColor;
  transform-origin:center;
}
.spotify-gate-wave span:nth-child(1){height:.52rem}
.spotify-gate-wave span:nth-child(2){height:1rem}
.spotify-gate-wave span:nth-child(3){height:.72rem}
.spotify-gate-wave span:nth-child(4){height:1.35rem}
.spotify-gate-wave span:nth-child(5){height:1.05rem}
.spotify-gate-wave span:nth-child(6){height:1.24rem}
.spotify-gate-wave span:nth-child(7){height:.7rem}
.spotify-player-gate:hover .spotify-gate-wave span,
.spotify-player-gate:focus-visible .spotify-gate-wave span{
  animation:ow-spotify-wave .72s ease-in-out infinite alternate;
}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(2),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(2){animation-delay:-.46s}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(3),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(3){animation-delay:-.18s}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(4),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(4){animation-delay:-.58s}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(5),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(5){animation-delay:-.3s}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(6),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(6){animation-delay:-.66s}
.spotify-player-gate:hover .spotify-gate-wave span:nth-child(7),
.spotify-player-gate:focus-visible .spotify-gate-wave span:nth-child(7){animation-delay:-.24s}
@keyframes ow-spotify-wave{
  from{transform:scaleY(.58);opacity:.68}
  to{transform:scaleY(1.12);opacity:1}
}
.spotify-gate-label{
  min-width:0;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.spotify-gate-arrow{
  color:var(--ember);
  font-family:Georgia,Times New Roman,serif;
  font-size:1.65rem;
  line-height:1;
  transform:translateY(-.03em);
  transition:transform .18s ease,color .18s ease;
}
.spotify-player-gate:hover .spotify-gate-arrow,
.spotify-player-gate:focus-visible .spotify-gate-arrow{
  transform:translate(.18rem,-.03em);
  color:#f0be61;
}
.spotify-embed{
  display:block;
  width:100%;
  height:152px;
  border:0;
  border-radius:12px;
  background:#121212;
  overflow:hidden;
}

/* Homepage current release stays anchored to the top edge of its copy. The
   deferred player may expand the right column without resizing/recentering art. */
.home-page .release-feature{
  align-items:start;
}
.home-page .release-feature .release-visual,
.home-page .release-feature .release-copy{
  align-self:start;
}
.home-page .release-feature .release-visual{
  height:max-content;
  isolation:isolate;
}
.home-page .release-feature .release-visual::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:7% -6% -8%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(217,165,71,.17),rgba(217,165,71,.05) 42%,transparent 72%);
  filter:blur(30px);
  opacity:.58;
  pointer-events:none;
  transition:opacity .24s ease;
}
.home-page .release-feature .release-art{
  position:relative;
  z-index:1;
}
.home-page .release-feature .release-copy h2{
  max-width:12ch;
  font-size:clamp(2.75rem,5vw,5.4rem);
}
.release-page .release-art-stage::after{
  background:radial-gradient(circle,rgba(217,165,71,.18),rgba(217,165,71,.05) 38%,transparent 70%);
  opacity:.66;
}
@media (hover:hover) and (pointer:fine){
  .home-page .release-feature .release-visual:hover::before,
  .home-page .release-feature .release-visual:focus-within::before{
    opacity:.72;
  }
  .release-page .release-art-stage:hover::after,
  .release-page .release-art-stage:focus-within::after{
    opacity:1;
  }
}

/* Shared interaction language. Button controls reverse contrast; text links and
   provider links use the ember accent so every interactive element responds. */
.button,
.nav-cta,
.support-button,
.mobile-music-nav a,
.menu-toggle{
  transition:transform .16s ease,background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease;
}
.button-primary:hover,
.button-primary:focus-visible,
.support-button:hover,
.support-button:focus-visible{
  background:var(--light);
  color:var(--ink);
  border-color:var(--light);
  box-shadow:0 .85rem 2.25rem rgba(0,0,0,.28);
}
.nav-cta:not(.button-primary):hover,
.nav-cta:not(.button-primary):focus-visible{
  background:var(--light);
  color:var(--ink);
  border-color:var(--light);
  box-shadow:0 .65rem 1.8rem rgba(0,0,0,.22);
}
.menu-toggle:hover,
.menu-toggle:focus-visible{
  background:rgba(217,165,71,.12);
  color:var(--ember);
}
.text-link{
  transition:color .16s ease,border-color .16s ease;
}
.text-link--muted{
  color:rgba(247,244,233,.52);
  border-bottom-color:rgba(247,244,233,.2);
}
.text-link:hover,
.text-link:focus-visible,
.text-link--muted:hover,
.text-link--muted:focus-visible{
  color:var(--ember);
  border-bottom-color:var(--ember);
}
.release-details-link{
  display:inline-flex;
  margin-top:.9rem;
  align-self:flex-start;
  width:max-content;
  max-width:100%;
}

/* Listening-provider links remain visually lightweight beneath the player. */
.release-copy .platform-pills,
.release-page-copy .platform-pills,
.catalog-card-copy .platform-pills,
.latest-music-card-copy .platform-pills{
  gap:.65rem 1.25rem;
}
.release-copy .platform-pills,
.catalog-card-copy .platform-pills,
.latest-music-card-copy .platform-pills{
  margin:.85rem 0 0;
}
.release-copy .platform-pills a,
.release-page-copy .platform-pills a,
.catalog-card-copy .platform-pills a,
.latest-music-card-copy .platform-pills a{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(247,244,233,.82);
  transition:color .16s ease;
}
.release-copy .platform-pills a:hover,
.release-copy .platform-pills a:focus-visible,
.release-page-copy .platform-pills a:hover,
.release-page-copy .platform-pills a:focus-visible,
.catalog-card-copy .platform-pills a:hover,
.catalog-card-copy .platform-pills a:focus-visible,
.latest-music-card-copy .platform-pills a:hover,
.latest-music-card-copy .platform-pills a:focus-visible{
  background:transparent!important;
  color:var(--ember);
}

.latest-music-section{
  padding:clamp(5rem,9vw,8rem) clamp(1.25rem,5vw,5rem);
  background:#11130f;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.latest-music-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:1.5rem;
  margin-bottom:clamp(2rem,4vw,3.5rem);
}
.latest-music-heading h2{
  margin:.35rem 0 0;
  font-family:Georgia,Times New Roman,serif;
  font-size:clamp(2.8rem,5vw,5rem);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.045em;
}
.latest-music-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1rem,2vw,1.5rem);
}
.latest-music-card{
  display:grid;
  grid-template-columns:minmax(8.5rem,11rem) minmax(0,1fr);
  gap:1.2rem;
  align-items:start;
  min-width:0;
  padding:1.15rem;
  border:1px solid rgba(247,244,233,.12);
  background:rgba(247,244,233,.025);
}
.latest-music-art,
.latest-music-card-copy{
  align-self:start;
}
.latest-music-art{
  position:relative;
  overflow:hidden;
  aspect-ratio:1;
  container-type:inline-size;
}
.latest-music-art a,
.latest-music-art img{
  display:block;
  width:100%;
  height:100%;
}
.latest-music-art img{
  object-fit:cover;
  transition:transform .3s ease;
}
.latest-music-art a:hover img,
.latest-music-art a:focus-visible img{
  transform:scale(1.025);
}
.latest-music-card-copy{
  min-width:0;
}
.latest-music-card-copy .release-status{
  margin-top:0;
  font-size:.68rem;
}
.latest-music-card-copy h3{
  margin:.3rem 0 .7rem;
  font-family:Georgia,Times New Roman,serif;
  font-size:clamp(1.55rem,2.5vw,2.2rem);
  font-weight:400;
  line-height:1;
}
.latest-music-card-copy h3 a{
  color:inherit;
  text-decoration:none;
}
.latest-music-card-copy .platform-pills a{
  font-size:.6rem;
}
.latest-music-footer{
  display:flex;
  justify-content:center;
  margin-top:1.5rem;
}

.mobile-music-nav{
  display:none;
}

.about-page .about-section{
  align-items:start;
  padding-top:clamp(8.5rem,13vw,12rem);
}
.about-page .bio-portrait-wrap,
.about-page .bio-copy{
  align-self:start;
}
.about-page .bio-copy>.kicker{
  margin-bottom:2rem;
}

@media (max-width:1100px){
  .latest-music-grid{grid-template-columns:1fr}
}

@media (max-width:820px){
  .home-page{padding-bottom:calc(4.8rem + env(safe-area-inset-bottom,0px))}
  .spotify-player-shell{
    width:100%;
    max-width:100%;
  }
  .mobile-music-nav{
    position:fixed;
    z-index:80;
    left:0;
    right:0;
    bottom:0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.55rem;
    padding:.6rem max(.75rem,env(safe-area-inset-left)) calc(.6rem + env(safe-area-inset-bottom,0px)) max(.75rem,env(safe-area-inset-right));
    border-top:1px solid rgba(247,244,233,.16);
    background:rgba(10,12,10,.94);
    -webkit-backdrop-filter:blur(12px) saturate(120%);
    backdrop-filter:blur(12px) saturate(120%);
    box-shadow:0 -1rem 2.5rem rgba(0,0,0,.35);
  }
  .mobile-music-nav a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:3rem;
    padding:.65rem .6rem;
    border:1px solid rgba(217,165,71,.4);
    background:rgba(217,165,71,.1);
    color:var(--light);
    letter-spacing:.09em;
    text-transform:uppercase;
    text-decoration:none;
    font-size:.68rem;
    font-weight:800;
  }
  .mobile-music-nav a:first-child{
    background:var(--ember);
    color:#0d0f0c;
  }
  .mobile-music-nav a:hover,
  .mobile-music-nav a:focus-visible,
  .mobile-music-nav a:first-child:hover,
  .mobile-music-nav a:first-child:focus-visible{
    background:var(--light);
    border-color:var(--light);
    color:var(--ink);
    transform:translateY(-1px);
  }
  .latest-music-heading{
    align-items:start;
    flex-direction:column;
  }
  .latest-music-card{
    grid-template-columns:8rem minmax(0,1fr);
    gap:1rem;
    padding:1rem;
  }
}

@media (max-width:580px){
  .latest-music-card{
    grid-template-columns:1fr;
  }
  .latest-music-art{
    width:min(100%,18rem);
  }
}

@media (prefers-reduced-motion:reduce){
  .spotify-player-gate,
  .spotify-gate-arrow,
  .button,
  .nav-cta,
  .support-button,
  .text-link,
  .mobile-music-nav a,
  .menu-toggle,
  .release-copy .platform-pills a,
  .release-page-copy .platform-pills a,
  .catalog-card-copy .platform-pills a,
  .latest-music-card-copy .platform-pills a,
  .latest-music-art img{transition:none}
  .home-page .release-feature .release-visual::before{transition:none}
  .spotify-player-gate:hover .spotify-gate-wave span,
  .spotify-player-gate:focus-visible .spotify-gate-wave span{animation:none}
}
