/*! SONIC SNOWFLAKE RECORDS — Artists View Styles */

.artists-header { padding-top: calc(var(--nav-h) + 2.5rem); padding-bottom: .5rem; }
.artists-header__title { font-size: var(--fs-hero); line-height: .9; margin: .6rem 0 1.2rem; }
.artists-header__sub { max-width: 62ch; color: var(--mist); font-size: var(--fs-lead); }

.artists-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
@media (max-width: 860px) { .artists-grid { grid-template-columns: 1fr; } }

.artist-hub-card {
  display: flex; gap: 0; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--line);
  background: var(--panel); transition: transform var(--dur-med) var(--ease-out), border-color var(--dur-med) ease, box-shadow var(--dur-med) ease;
}
.artist-hub-card:hover {
  transform: translateY(-6px);
  border-color: color-mix(in srgb, var(--card-accent, var(--neon)) 55%, transparent);
  box-shadow: 0 30px 70px -28px color-mix(in srgb, var(--card-accent, var(--neon)) 55%, transparent);
}
.artist-hub-card__art { width: 42%; flex: none; aspect-ratio: 3/4; overflow: hidden; }
.artist-hub-card__art img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }
.artist-hub-card:hover .artist-hub-card__art img { transform: scale(1.06); }
.artist-hub-card__body { padding: 26px 26px 28px; display: flex; flex-direction: column; justify-content: center; }
.artist-hub-card__eyebrow { font-family: var(--font-mono); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--card-accent, var(--neon-bright)); margin-bottom: 10px; }
.artist-hub-card__name { font-family: var(--font-display); font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 800; margin-bottom: 10px; }
.artist-hub-card__bio { color: var(--mist); font-size: .92rem; line-height: 1.65; margin-bottom: 18px; }
.artist-hub-card__cta { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--pearl); }
.artist-hub-card__cta svg { width: 14px; height: 14px; transition: transform var(--dur-fast) var(--ease-out); }
.artist-hub-card:hover .artist-hub-card__cta svg { transform: translateX(4px); }

@media (max-width: 560px) {
  .artist-hub-card { flex-direction: column; }
  .artist-hub-card__art { width: 100%; aspect-ratio: 16/9; }
}