.page-exynosmusic {
  --bg: #f7f7fa;
  --panel: #ffffff;
  --panel2: #f5f2fa;
  --line: #e4e0ea;
  --text: #201b2d;
  --muted: #6e667c;
  --green: #7145c6;
  --mint: #7145c6;
  background: #f7f7fa;
}

.page-exynosmusic .suite-page,
.page-exynosmusic main {
  background: #f7f7fa;
}

.page-exynosmusic .shell {
  width: min(1120px, calc(100% - 40px));
}

.page-exynosmusic .hero {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  min-height: 470px;
  padding: 96px 0 64px;
  text-align: left;
}

.page-exynosmusic .hero::before,
.page-exynosmusic .community-cta::after,
.page-exynosmusic .feature::after,
.page-exynosmusic .wave {
  display: none;
}

.page-exynosmusic .hero > div:first-child {
  max-width: 760px;
}

.page-exynosmusic .eyebrow {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6e667c;
  letter-spacing: .08em;
}

.page-exynosmusic .eyebrow::before {
  box-shadow: none;
}

.page-exynosmusic h1 {
  max-width: 760px;
  margin: 18px 0;
  font-size: clamp(44px, 7vw, 76px);
  line-height: .98;
  letter-spacing: -.055em;
}

.page-exynosmusic .gradient {
  background: none;
  color: #201b2d;
  -webkit-text-fill-color: currentColor;
}

.page-exynosmusic .lead {
  max-width: 650px;
  margin: 0;
  font-size: clamp(16px, 2vw, 19px);
}

.page-exynosmusic .actions {
  justify-content: flex-start;
  margin-top: 28px;
}

.page-exynosmusic .button {
  min-height: 44px;
  padding: 0 18px;
  border-color: #e4e0ea;
  border-radius: 999px;
  background: #f8f6fb;
  transition: background-color .15s ease, border-color .15s ease;
}

.page-exynosmusic .button:hover,
.page-exynosmusic .button:focus-visible {
  transform: none;
  border-color: #e4e0ea;
  background: #e4e0ea;
}

.page-exynosmusic .button.primary {
  border-color: #7145c6;
  background: #7145c6;
  color: #08120b;
  box-shadow: none;
}

.page-exynosmusic .section {
  padding: 64px 0;
}

.page-exynosmusic .section-head {
  align-items: end;
  margin-bottom: 24px;
}

.page-exynosmusic .kicker {
  color: #7145c6;
}

.page-exynosmusic .section h2 {
  max-width: 620px;
  font-size: clamp(30px, 4.5vw, 48px);
  line-height: 1.05;
  letter-spacing: -.04em;
}

.page-exynosmusic .features {
  gap: 12px;
}

.page-exynosmusic .feature {
  min-height: 244px;
  padding: 24px;
  border-color: #e4e0ea;
  border-radius: 10px;
  background: #ffffff;
  transition: background-color .15s ease, border-color .15s ease;
}

.page-exynosmusic .feature:hover,
.page-exynosmusic .feature:focus-visible {
  transform: none;
  border-color: #e4e0ea;
  background: #f2eff8;
}

.page-exynosmusic .icon {
  width: 42px;
  height: 42px;
  margin-bottom: 34px;
  border-radius: 8px;
  background: #f8f6fb;
}

.page-exynosmusic .feature h3 {
  font-size: 22px;
}

.page-exynosmusic .strip {
  border-color: #e4e0ea;
  border-radius: 10px;
  background: #e4e0ea;
}

.page-exynosmusic .stat {
  padding: 22px;
  background: #ffffff;
}

.page-exynosmusic .stat b {
  font-size: 24px;
}

.page-exynosmusic .community-cta {
  padding: 32px;
  border-color: #e4e0ea;
  border-radius: 10px;
  background: #ffffff;
}

.page-exynosmusic footer {
  border-color: #e4e0ea;
}

@media (max-width: 880px) {
  .page-exynosmusic .hero {
    min-height: 420px;
    padding: 72px 0 48px;
  }
}

@media (max-width: 560px) {
  .page-exynosmusic .shell {
    width: min(100% - 24px, 1120px);
  }

  .page-exynosmusic .hero {
    min-height: auto;
    padding: 56px 0 40px;
  }

  .page-exynosmusic .hero h1 {
    font-size: 44px;
  }

  .page-exynosmusic .section {
    padding: 48px 0;
  }

  .page-exynosmusic .feature:nth-child(n) {
    min-height: 220px;
  }

  .page-exynosmusic .community-cta {
    padding: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-exynosmusic *,
  .page-exynosmusic *::before,
  .page-exynosmusic *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}