/**
 * Node: Artists Page
 * Injected via Asset Injector — scoped to node ID 27762
 */

/**
 * Page title — Artists
 * Centred, glowing purple text effect
 */
body.page-node-27762 h1.title {
  text-align: center;
  font-size: clamp(48px, 8vw, 96px);
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #ede9fe;
  text-shadow:
    0 0 10px rgba(168, 85, 247, 1),
    0 0 25px rgba(168, 85, 247, 0.8),
    0 0 60px rgba(168, 85, 247, 0.5),
    0 0 120px rgba(168, 85, 247, 0.3);
}

/**
 * Artist card
 * Remove default Bootstrap card styles
 * Position relative anchors the title overlay
 */
body.page-node-27762 .card {
  position: relative;
  border: none;
  background: transparent;
  overflow: hidden;
}

/**
 * Artist card — image wrapper span
 * Block display so the image fills it correctly
 */
body.page-node-27762 .card .card-img-top {
  display: block;
}

/**
 * Artist card — image
 * Overrides hardcoded width/height attributes
 * aspect-ratio + object-fit keeps it square at all sizes
 */
body.page-node-27762 .card .card-img-top img {
  display: block;
  width: 100%;
  border-radius: 9px ;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border: 2px solid #a855f7;
  box-shadow:
    0 0 0 1px #6b21a8,
    0 0 28px rgba(168, 85, 247, 0.55),
    0 0 60px rgba(168, 85, 247, 0.2);
}

/**
 * Artist card — card body
 * Lighter gradient, less opaque so the image shows through more
 */
body.page-node-27762 .card .card-body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 28px 12px 10px;
  background: linear-gradient(to top, rgba(8, 0, 18, 0.65) 40%, transparent);
  pointer-events: none;
}

/**
 * Artist card — hover effect
 * Brightness lift on the image, border and glow intensify
 */
body.page-node-27762 .card .card-img-top img {
  transition: filter 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

body.page-node-27762 .card:hover .card-img-top img {
  filter: brightness(1.15);
  border-color: #c084fc;
  box-shadow:
    0 0 0 1px #7e22ce,
    0 0 35px rgba(192, 132, 252, 0.8),
    0 0 80px rgba(168, 85, 247, 0.5);
}

/**
 * Artist card — title glow intensifies on hover
 */
body.page-node-27762 .card .card-text a {
  transition: text-shadow 0.3s ease;
}

body.page-node-27762 .card:hover .card-text a {
  text-shadow:
    0 0 10px rgba(192, 132, 252, 1),
    0 0 30px rgba(168, 85, 247, 0.8),
    0 0 60px rgba(168, 85, 247, 0.5);
}

/**
 * Artist card — artist name
 * Purple glow via text-shadow
 */
body.page-node-27762 .card .card-text {
  text-align: center;
}

body.page-node-27762 .card .card-text a {
  color: #ede9fe;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  pointer-events: all;
  text-shadow:
    0 0 8px rgba(168, 85, 247, 0.9),
    0 0 20px rgba(168, 85, 247, 0.5),
    0 0 40px rgba(168, 85, 247, 0.3);
}