/* Home-only interpretation of the Atlas masthead; other sections keep their theme. */
.pixelsound-home .hero.section { padding-top: 47px; }
.pixelsound-home .hero::before {
  background:
    radial-gradient(ellipse 52% 75% at 50% 26%, #c9e1df59, transparent 75%),
    linear-gradient(180deg, #edf1ec 0%, var(--bg) 84%);
}
.pixelsound-home .home-masthead { position: relative; max-width: 1120px; margin: 0 auto; }
.pixelsound-home .home-title-line {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(20px, 2.5vw, 36px);
}
.pixelsound-home .home-title-line::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, #77aaa555 12%, transparent 28%, transparent 72%, #77aaa555 88%, transparent);
}
.pixelsound-home .hero .hero-title {
  position: relative;
  flex: none;
  max-width: none;
  margin: 0;
  color: #182d30;
  font: var(--pixelsound-display-weight) clamp(58px, 6.5vw, 86px)/1.08 var(--pixelsound-display-font);
  letter-spacing: var(--pixelsound-display-spacing);
  /* Reserve the local wordmark's measure so font loading cannot move the waves. */
  inline-size: 4.75em;
  text-align: center;
  text-shadow: 0 2px 16px #ffffff66;
}
.pixelsound-home .home-title-wave { flex: 0 1 130px; color: #298f94; opacity: .72; }
.pixelsound-home .hero-subtitle { margin-top: 18px; font-size: 16px; color: #606962; }
.pixelsound-home .hero .ecosystem-carousel { margin-top: 34px; }
/* The existing logo handoff retains its compact icon inside the workflow rail. */
.pixelsound-home .workflow-brand-slot .studio-wordmark { display: none; }
@media (max-width: 680px) {
  .pixelsound-home .hero.section { padding-top: 31px; }
  .pixelsound-home .home-title-line { gap: 8px; }
  .pixelsound-home .hero .hero-title { font-size: clamp(42px, 13.2vw, 64px); }
  .pixelsound-home .home-title-wave { flex-basis: clamp(23px, 7.2vw, 44px); height: 30px; opacity: .64; }
  .pixelsound-home .hero-subtitle { margin-top: 16px; max-width: 30em; padding-inline: 10px; font-size: 14px; line-height: 1.6; }
  .pixelsound-home .hero .ecosystem-carousel { margin-top: 29px; }
}