/* Additional global styles can be added here if needed. Core layout is handled inline per page. */

/* Streaming CTA block on artist pages */
.artist-streaming-cta {
  margin: 28px 0 8px;
  padding: 18px 20px;
  border-radius: var(--radius-xl);
  border: 1px solid rgba(251,191,36,0.25);
  background: radial-gradient(circle at top left, rgba(251,191,36,0.10), rgba(15,23,42,0.85));
  box-shadow: 0 18px 45px rgba(0,0,0,0.65);
}

.artist-streaming-cta h2 {
  font-size: 1.2rem;
  margin-bottom: 8px;
}

.artist-streaming-cta p {
  margin-bottom: 14px;
  max-width: 46rem;
}

.artist-streaming-buttons {
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}

.streaming-btn {
  display:inline-flex;
  align-items:center;
  gap: 8px;
}

.streaming-btn .icon {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,0.7);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 11px;
}

/* Mobile stack */
@media (max-width: 640px) {
  .artist-streaming-cta {
    padding: 16px 14px;
  }
  .artist-streaming-buttons {
    flex-direction:column;
    align-items:flex-start;
  }
}


.lane-artist-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.lane-artist-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 0.78rem;
  text-decoration: none;
  border: 1px solid rgba(148,163,184,0.7);
  background: radial-gradient(circle at top left, rgba(15,23,42,0.95), rgba(15,23,42,0.8));
  color: #e5e7eb;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
}

.lane-artist-link .platform-icon {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  border: 1px solid rgba(148,163,184,0.8);
}

.lane-artist-link .platform-label {
  letter-spacing: 0.02em;
}

.lane-artist-link.spotify-btn {
  border-color: rgba(45, 212, 191, 0.8);
}
.lane-artist-link.spotify-btn .platform-icon {
  border-color: rgba(45, 212, 191, 0.9);
}

.lane-artist-link.apple-btn {
  border-color: rgba(248, 250, 252, 0.85);
}
.lane-artist-link.apple-btn .platform-icon {
  border-color: rgba(248, 250, 252, 0.9);
}

.lane-artist-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 40px rgba(0,0,0,0.55);
  color: #facc15;
}


/* Card styling for new R&B editorial sections */
.section-rnb-practice .section-inner,
.blog-rnb-context .section-inner,
.blog-rnb-practice .section-inner,
.faq-rnb-extra .section-inner,
.contact-rnb-note .section-inner,
.artist-lane-practice .section-inner {
  background: radial-gradient(circle at top left, rgba(15,23,42,0.95), rgba(2,6,23,0.98));
  border-radius: var(--radius-xl);
  border: 1px solid rgba(148,163,184,0.45);
  box-shadow: 0 22px 55px rgba(15,23,42,0.9);
  padding: 22px 22px 20px;
}

/* Use card-like layout for the routine blocks on the homepage */
.section-rnb-practice .two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 16px;
}

.section-rnb-practice .two-column > div {
  background: radial-gradient(circle at top left, rgba(15,23,42,0.9), rgba(15,23,42,0.98));
  border-radius: 20px;
  border: 1px solid rgba(148,163,184,0.5);
  padding: 16px 16px 14px;
}

/* Bullet list cards on artist pages */
.artist-lane-practice .key-points-list {
  list-style: none;
  margin: 20px 0 8px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.artist-lane-practice .key-points-list li {
  background: radial-gradient(circle at top left, rgba(15,23,42,0.96), rgba(15,23,42,1));
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,0.4);
  padding: 12px 14px;
  font-size: 0.88rem;
}

.artist-lane-practice .key-points-list li strong {
  color: #facc15;
  display: block;
  margin-bottom: 4px;
}

/* Blog context/practice cards */
.blog-rnb-context .section-inner h2,
.blog-rnb-practice .section-inner h2 {
  margin-bottom: 8px;
}

.blog-rnb-context .section-inner p + p,
.blog-rnb-practice .section-inner p + p {
  margin-top: 6px;
}

/* FAQ extra cards */
.faq-rnb-extra .section-inner h3 {
  margin-top: 14px;
  margin-bottom: 4px;
  font-size: 1rem;
  color: #e5e7eb;
}

/* Contact note slight layout tweak */
.contact-rnb-note .section-inner p + p {
  margin-top: 6px;
}

@media (max-width: 880px) {
  .section-rnb-practice .two-column,
  .artist-lane-practice .key-points-list {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* Shared section wrapper: keep sections centered with breathing room on the sides */
.section-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

@media (max-width: 640px) {
  .section-shell {
    padding-left: 16px;
    padding-right: 16px;
  }
}