@charset "UTF-8";

/* =====================================================
   STUART MANSFIELD — ALIVE COLOUR EDITION
   Bright editorial colour layer over Cinematic V4.
   This is the final cascade layer; apparent repeats are scoped overrides.
===================================================== */

:root {
  --alive-ink: #17223c;
  --alive-indigo: #17143f;
  --alive-cobalt: #123eae;
  --alive-violet: #58318f;
  --alive-magenta: #a72f79;
  --alive-coral: #df4b55;
  --alive-orange: #ef7652;
  --alive-gold: #e2aa43;
  --alive-cream: #fff6e8;
  --alive-champagne: #f5e7cf;
  --alive-peach: #ffd9ca;
  --alive-sky: #e4edff;
  --alive-mint: #dff4e9;
  --alive-white: #fffaf2;
  --alive-line: rgba(226, 170, 67, .52);
  --alive-shadow: 0 28px 70px rgba(29, 31, 83, .17);
}

/* Single-cover catalogue player
   The eleven track cards remain in the DOM as the playlist, while the shared
   player presents only the artwork and details for the active song. */
.music .preview-card-carousel {
  display: none !important;
}

.music .song-preview-list {
  display: block !important;
  width: 100%;
}

.music .preview-now-playing {
  display: grid !important;
  grid-template-columns: 190px minmax(220px, .85fr) auto minmax(240px, 1.2fr) auto;
  grid-template-areas:
    "cover copy controls wave count"
    "cover copy controls wave time";
  gap: 8px 28px;
  width: min(100%, 1180px) !important;
  margin: 18px auto 0 !important;
  padding: 28px 30px !important;
  align-items: center;
  border: 1px solid rgba(226, 170, 67, .72);
  border-radius: 34px;
  background: linear-gradient(112deg, rgba(11, 18, 49, .97), rgba(16, 48, 112, .9));
  box-shadow: 0 24px 58px rgba(4, 8, 28, .3);
}

.music .preview-now-cover {
  grid-area: cover;
  width: 190px !important;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  border: 1px solid rgba(226, 170, 67, .48);
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .26);
}

.music .preview-now-copy {
  grid-area: copy;
}

.music .preview-now-copy strong {
  margin-bottom: 8px;
  font-size: clamp(27px, 2.3vw, 39px);
}

.music .preview-now-copy small {
  display: block;
  margin-top: 5px;
}

.music .preview-now-copy .preview-now-genre {
  margin-top: 12px;
  color: rgba(255, 246, 232, .76);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.music .preview-now-controls {
  grid-area: controls;
}

.music .preview-now-wave {
  grid-area: wave;
  width: 100%;
}

.music .preview-now-count {
  grid-area: count;
  align-self: end;
  color: var(--alive-gold);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  white-space: nowrap;
}

.music .preview-now-time {
  grid-area: time;
  align-self: start;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .music .preview-now-playing {
    grid-template-columns: 140px minmax(0, 1fr) auto;
    grid-template-areas:
      "cover copy count"
      "cover controls time"
      "wave wave wave";
    gap: 16px 20px;
    padding: 22px !important;
    border-radius: 26px;
  }

  .music .preview-now-cover {
    width: 140px !important;
  }
}

@media (max-width: 600px) {
  .music .preview-now-playing {
    grid-template-columns: 92px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "cover copy count"
      "controls controls controls"
      "time time time" !important;
    gap: 14px 16px;
    width: calc(100% - 28px) !important;
    margin: 14px auto 0 !important;
    padding: 16px !important;
    border-radius: 22px;
  }

  .music .preview-now-cover {
    width: 92px !important;
  }

  .music .preview-now-copy strong {
    font-size: clamp(22px, 7vw, 28px);
    white-space: normal;
  }

  .music .preview-now-copy .preview-now-genre {
    margin-top: 8px;
    font-size: 9px;
  }

  .music .preview-now-count {
    justify-self: end;
    font-size: 12px;
  }

  .music .preview-now-controls {
    justify-self: center;
  }

  .music .preview-now-time {
    justify-self: end;
  }

  .music .preview-now-wave {
    display: none !important;
  }
}

html {
  background: var(--alive-cream);
}

body {
  background: var(--alive-cream);
  color: var(--alive-ink);
}

/* Header and hero
----------------------------------------------------- */
.site-header,
.site-header.scrolled {
  border-bottom-color: var(--alive-line);
  background: rgba(20, 18, 54, .95);
  box-shadow: 0 14px 35px rgba(17, 17, 55, .14);
}

.header-listen {
  border-color: var(--alive-gold);
  background: rgba(226, 170, 67, .08);
  color: #ffd875;
}

.header-listen:hover,
.header-listen:focus-visible {
  background: var(--alive-gold);
  color: var(--alive-indigo);
}

.cinematic-hero {
  border-bottom-color: var(--alive-line);
  background:
    radial-gradient(circle at 18% 28%, rgba(229, 71, 94, .26), transparent 28%),
    radial-gradient(circle at 70% 10%, rgba(56, 91, 218, .25), transparent 35%),
    linear-gradient(118deg, #17143f 0%, #25205b 50%, #123b86 100%);
}

.cinematic-hero::before {
  opacity: .5;
}

.cinematic-portrait-frame {
  border-color: var(--alive-gold);
  box-shadow:
    0 26px 70px rgba(8, 12, 48, .32),
    18px 18px 0 rgba(223, 75, 85, .12);
}

/* My Christmas pre-release campaign overlay */
.christmas-release-overlay {
  display: flex;
  position: absolute;
  top: clamp(18px, 3vw, 38px);
  left: clamp(18px, 3vw, 38px);
  z-index: 4;
  max-width: min(390px, calc(100% - 36px));
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(16px, 2.2vw, 25px);
  border: 1px solid rgba(241, 189, 82, .62);
  border-left: 3px solid var(--alive-gold);
  background: linear-gradient(135deg, rgba(8, 10, 21, .94), rgba(23, 20, 63, .82));
  box-shadow: 0 18px 45px rgba(0, 0, 0, .35);
  color: #fff8e9;
  pointer-events: none;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .7);
}

.christmas-release-overlay p,
.christmas-release-overlay strong,
.christmas-release-overlay span,
.christmas-release-overlay time {
  margin: 0;
}

.christmas-release-overlay .christmas-release-eyebrow {
  color: #f1bd52 !important;
  font: 700 clamp(10px, .72vw, 12px)/1.35 var(--font-body);
  letter-spacing: .18em;
  text-transform: uppercase;
}

.christmas-release-overlay strong {
  margin-top: 7px;
  color: #fff8e9;
  font: 600 clamp(32px, 3.2vw, 54px)/.95 var(--font-heading);
  letter-spacing: -.025em;
}

.christmas-release-overlay span {
  margin-top: 10px;
  color: rgba(255, 248, 233, .88);
  font: 600 clamp(11px, .82vw, 14px)/1.4 var(--font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.christmas-release-overlay time {
  margin-top: 12px;
  padding: 7px 10px;
  background: #f1bd52;
  color: #17143f;
  font: 800 clamp(11px, .78vw, 13px)/1.2 var(--font-body);
  letter-spacing: .06em;
  text-shadow: none;
  text-transform: uppercase;
}

@media (max-width: 700px) {
  .christmas-release-overlay {
    top: 14px;
    left: 14px;
    max-width: calc(100% - 28px);
    padding: 14px 15px;
  }

  .christmas-release-overlay strong {
    font-size: clamp(29px, 10vw, 42px);
  }

  .christmas-release-overlay span {
    font-size: 10px;
  }
}

.cinematic-eyebrow,
.cinematic-hero h1 em,
.cinematic-photo-caption {
  color: #f1bd52;
}

.cinematic-button-primary {
  border-color: var(--alive-gold);
  background: linear-gradient(100deg, #edb84f, #f6cf70);
  color: var(--alive-indigo);
  box-shadow: 0 14px 30px rgba(226, 170, 67, .2);
}

.cinematic-button-secondary {
  border-color: rgba(255, 246, 232, .64);
  background: rgba(255, 255, 255, .07);
}

/* Biography — warm and luminous
----------------------------------------------------- */
.about {
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(239, 118, 82, .19), transparent 28%),
    radial-gradient(circle at 92% 78%, rgba(85, 75, 196, .14), transparent 30%),
    linear-gradient(135deg, #fffaf2 0%, #fff1df 50%, #f4e9ff 100%);
  color: var(--alive-ink);
}

.about::after {
  position: absolute;
  right: -160px;
  bottom: -220px;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(167, 47, 121, .16);
  border-radius: 50%;
  box-shadow:
    0 0 0 54px rgba(167, 47, 121, .035),
    0 0 0 108px rgba(18, 62, 174, .025);
  content: "";
  pointer-events: none;
}

.about-image::before {
  border-color: var(--alive-coral);
  background: linear-gradient(145deg, rgba(223, 75, 85, .13), rgba(18, 62, 174, .1));
}

.about-image img {
  box-shadow:
    -18px 20px 0 rgba(226, 170, 67, .18),
    0 30px 65px rgba(48, 40, 103, .19);
}

.about-copy .kicker {
  color: var(--alive-coral);
}

.about-copy h2 {
  color: var(--alive-indigo);
}

.about-copy p {
  color: #47506c;
}

.about-copy .philosophy {
  border-left-color: var(--alive-gold);
  color: var(--alive-magenta);
}

/* Music — rich colour, never flat black
----------------------------------------------------- */
.music {
  background:
    radial-gradient(circle at 8% 10%, rgba(238, 86, 95, .34), transparent 24%),
    radial-gradient(circle at 92% 72%, rgba(36, 91, 218, .42), transparent 30%),
    linear-gradient(145deg, #201653 0%, #16367f 48%, #0f52a0 100%);
}

.music::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
  background-size: 52px 52px;
  content: "";
  pointer-events: none;
}

.music > .wrap {
  position: relative;
}

.song-previews {
  overflow: hidden;
  border: 1px solid rgba(255, 217, 129, .46);
  background: linear-gradient(145deg, rgba(24, 20, 65, .94), rgba(19, 62, 130, .92));
  box-shadow: 0 30px 75px rgba(8, 15, 58, .35);
}

.song-previews .kicker {
  color: #ffd067;
}

.song-previews h2,
.song-previews-description {
  color: var(--alive-white);
}

.song-current-release {
  background: linear-gradient(145deg, rgba(224, 69, 86, .16), rgba(24, 80, 179, .14));
}

.preview-streaming-links a,
.song-current-release-button {
  border-color: rgba(255, 210, 103, .7);
  background: rgba(255, 255, 255, .055);
  color: #fff3d4;
}




.video-prev,
.video-next {
  border-color: var(--alive-gold) !important;
  background: var(--alive-indigo) !important;
  color: #ffd36e !important;
}


/* Videos — bright gallery field
----------------------------------------------------- */
.video-showcase {
  background:
    radial-gradient(circle at 15% 15%, rgba(223, 75, 85, .12), transparent 26%),
    radial-gradient(circle at 85% 85%, rgba(18, 62, 174, .12), transparent 28%),
    linear-gradient(135deg, #fff8ec, #e8efff) !important;
}

.video-showcase .kicker {
  color: var(--alive-coral);
}

.video-showcase .section-head h2 {
  color: var(--alive-indigo) !important;
  text-shadow: 0 8px 28px rgba(23, 20, 63, .08);
}

.video-card {
  overflow: hidden;
  border: 1px solid rgba(73, 60, 139, .18);
  background: rgba(255, 250, 242, .94);
  box-shadow: var(--alive-shadow);
}

.video-card h3 {
  color: var(--alive-indigo) !important;
}

.video-card p {
  color: #5a6276 !important;
}

/* Sync — bold coral and cobalt split
----------------------------------------------------- */
.sync-grid {
  background: var(--alive-coral);
}

.sync-copy {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 10%, rgba(255, 210, 112, .26), transparent 27%),
    linear-gradient(145deg, #e54d59 0%, #be3473 100%);
}

.sync-copy::after {
  position: absolute;
  right: -130px;
  bottom: -150px;
  width: 400px;
  height: 400px;
  border: 1px solid rgba(255, 244, 223, .22);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.sync .kicker,
.sync-copy h2,
.sync-copy p {
  position: relative;
  z-index: 1;
  color: var(--alive-white) !important;
}

.sync .kicker {
  color: #ffe08a !important;
}

.sync-copy .button {
  position: relative;
  z-index: 1;
  border-color: var(--alive-indigo);
  background: var(--alive-indigo);
  color: var(--alive-white);
}

.sync-credentials { position: relative; z-index: 1; margin: 26px 0 8px; padding-top: 24px; border-top: 1px solid rgba(255, 244, 223, .3); }
.sync-credentials h3 { margin: 0 0 12px; color: var(--alive-white); font-family: var(--font-heading); font-size: clamp(27px, 2vw, 36px); line-height: 1.08; }
.sync-credentials p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; }
.sync-credential-list { display: flex; position: relative; z-index: 1; flex-wrap: wrap; gap: 8px; margin: 18px 0 12px; padding: 0; list-style: none; }
.sync-credential-list li { padding: 7px 10px; border: 1px solid rgba(255, 224, 138, .55); color: var(--alive-white); font-size: 12px; font-weight: 700; letter-spacing: .06em; line-height: 1.25; text-transform: uppercase; }
.sync-copy .sync-rights-note { margin-bottom: 18px; color: rgba(255, 255, 255, .78) !important; font-size: 12px; line-height: 1.5; }

.sync-image::after {
  background: linear-gradient(90deg, rgba(190, 52, 115, .32), transparent 38%);
}

/* Creative services — individual colour personalities
----------------------------------------------------- */
.creative {
  background:
    radial-gradient(circle at 5% 50%, rgba(255, 133, 91, .15), transparent 27%),
    radial-gradient(circle at 95% 20%, rgba(57, 79, 202, .15), transparent 28%),
    linear-gradient(135deg, #fff3df, #efe8ff 58%, #e2efff);
}

.creative .kicker {
  color: var(--alive-coral);
}

.creative .section-head h2 {
  color: var(--alive-indigo);
}

.feature-grid article,
.feature-grid article:not(:last-child) {
  border: 1px solid rgba(68, 53, 132, .18);
  color: var(--alive-ink);
  box-shadow: 0 22px 52px rgba(52, 42, 111, .12);
}

.feature-grid article:nth-child(1) {
  background: linear-gradient(145deg, #fff8e6, #ffd9c8);
}

.feature-grid article:nth-child(2) {
  background: linear-gradient(145deg, #f5eaff, #dfe5ff);
}

.feature-grid article:nth-child(3) {
  background: linear-gradient(145deg, #e4f1ff, #dff4e9);
}

.feature-grid h3 {
  color: var(--alive-indigo) !important;
}

.feature-grid p {
  color: #515a70 !important;
}

.feature-grid article:nth-child(1) .feature-icon {
  color: var(--alive-coral);
}

.feature-grid article:nth-child(2) .feature-icon {
  color: var(--alive-magenta);
}

.feature-grid article:nth-child(3) .feature-icon {
  color: var(--alive-cobalt);
}

/* Contact and footer
----------------------------------------------------- */
.contact {
  border-block-color: var(--alive-line);
  background:
    linear-gradient(110deg, rgba(27, 20, 74, .90), rgba(155, 38, 113, .74) 55%, rgba(24, 67, 169, .78)),
    url("assets/stuart-mansfield-studio-deep-in-thought.jpg") center 34% / cover;
}

.contact::before {
  border-color: rgba(255, 215, 113, .32);
  box-shadow:
    0 0 0 55px rgba(238, 111, 83, .05),
    0 0 0 110px rgba(41, 88, 202, .04);
}

.contact .kicker {
  color: #ffd46f;
}

.contact h2,
.contact p {
  color: var(--alive-white);
}

.contact .button {
  border-color: #ffd46f;
  background: linear-gradient(100deg, #e9ae42, #ffd77a);
  color: var(--alive-indigo);
  box-shadow: 0 16px 35px rgba(15, 13, 55, .24);
}

.sm-divider {
  height: 2px;
  background: linear-gradient(90deg, var(--alive-coral), var(--alive-magenta), var(--alive-cobalt), var(--alive-gold));
  opacity: 1;
}

.sm-footer {
  border-top-color: var(--alive-line);
  background:
    radial-gradient(circle at 85% 15%, rgba(51, 88, 193, .25), transparent 30%),
    linear-gradient(135deg, #17143f, #102c69);
}

.sm-footer-socials a {
  border-color: rgba(255, 212, 111, .55);
  color: #ffd46f;
}

/* Responsive colour composition
----------------------------------------------------- */
@media (max-width: 980px) {
  .sync-grid {
    background: linear-gradient(145deg, #e54d59, #913980);
  }

  .sync-image {
    min-height: 440px;
  }
}

@media (max-width: 700px) {
  .cinematic-hero {
    background:
      radial-gradient(circle at 20% 10%, rgba(228, 77, 89, .28), transparent 30%),
      linear-gradient(155deg, #17143f, #24327e 72%, #174f9c);
  }

  .about {
    background: linear-gradient(155deg, #fff9ed, #ffe8da 58%, #eee8ff);
  }

  .about-image img {
    box-shadow: -10px 12px 0 rgba(226, 170, 67, .18), 0 22px 44px rgba(48, 40, 103, .17);
  }

  .music {
    background: linear-gradient(155deg, #241651, #173a83 56%, #145baa);
  }

  .video-showcase {
    background: linear-gradient(155deg, #fff7eb, #e8efff) !important;
  }

  .feature-grid article:hover {
    transform: none;
  }

  .contact {
    background:
      linear-gradient(155deg, rgba(29, 20, 78, .92), rgba(174, 45, 112, .76), rgba(23, 72, 176, .80)),
      url("assets/stuart-mansfield-studio-deep-in-thought.jpg") 58% center / cover;
  }
}

/* Film placement — compact editorial proof point
----------------------------------------------------- */
.film-placement {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 6vw, 88px) 0;
  border-block: 1px solid rgba(226, 170, 67, .36);
  background:
    radial-gradient(circle at 4% 50%, rgba(226, 72, 86, .25), transparent 30%),
    radial-gradient(circle at 96% 65%, rgba(30, 91, 207, .28), transparent 34%),
    linear-gradient(115deg, #090d18 0%, #0b172a 52%, #071225 100%);
  color: var(--alive-champagne);
}

.film-placement::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .12;
  background-image: repeating-linear-gradient(
    90deg,
    transparent 0 66px,
    rgba(255, 255, 255, .16) 67px 68px
  );
}

.film-placement-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(240px, 380px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(48px, 7vw, 108px);
  max-width: 1240px;
}

.film-placement-poster {
  width: min(100%, 306px);
  margin: 0 auto;
  padding: 8px;
  border: 1px solid rgba(226, 170, 67, .78);
  background: rgba(4, 7, 16, .76);
  box-shadow: 0 24px 55px rgba(0, 0, 0, .38);
}

.film-placement-poster img {
  display: block;
  width: 100%;
  height: min(460px, 57vw);
  object-fit: contain;
  background: #05070c;
}

.film-placement-copy {
  max-width: 680px;
}

.film-placement-copy .kicker {
  margin-bottom: 18px;
  color: var(--alive-coral);
}

.film-placement-copy h2 {
  margin: 0;
  color: var(--alive-champagne);
  font-size: clamp(48px, 6vw, 86px);
  line-height: .98;
}

.film-placement-lead {
  margin: 22px 0 0;
  color: #91b2ff;
  font-size: clamp(20px, 2vw, 28px);
  font-style: italic;
}

.film-placement-lead cite {
  font-weight: 700;
}

.film-placement-rule {
  width: 76px;
  height: 2px;
  margin: 28px 0;
  background: var(--alive-gold);
}

.film-placement-copy > p:not(.kicker):not(.film-placement-lead):not(.film-placement-credit):not(.film-placement-tags) {
  max-width: 620px;
  color: rgba(246, 239, 225, .84);
  font-size: clamp(17px, 1.45vw, 21px);
  line-height: 1.75;
}

.film-placement-credit {
  margin: 28px 0 0;
  padding-left: 18px;
  border-left: 2px solid var(--alive-gold);
  color: var(--alive-gold);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.film-placement-tags {
  margin: 30px 0 0;
  padding-top: 20px;
  border-top: 1px solid rgba(226, 170, 67, .5);
  color: #8eabff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 4px;
  text-transform: uppercase;
}

.film-placement-tags span {
  margin-inline: 10px;
  color: var(--alive-gold);
}

/* Videos — cinematic black gallery. */
.video-showcase {
  background:
    radial-gradient(circle at 12% 12%, rgba(223, 75, 85, .10), transparent 28%),
    radial-gradient(circle at 88% 84%, rgba(27, 77, 188, .18), transparent 32%),
    linear-gradient(145deg, #05070c, #09111d 58%, #04070d) !important;
}

.video-showcase .kicker {
  color: var(--alive-gold) !important;
}

.video-showcase .section-head h2 {
  color: var(--alive-champagne) !important;
  text-shadow: none;
}

.video-card {
  border-color: rgba(226, 170, 67, .42);
  background: rgba(10, 13, 22, .92);
  box-shadow: 0 22px 48px rgba(0, 0, 0, .34);
}

.video-card h3 {
  color: var(--alive-champagne) !important;
}

.video-card p {
  color: rgba(246, 239, 225, .72) !important;
}

@media (max-width: 800px) {
  .film-placement {
    padding: 54px 0 60px;
  }

  .film-placement-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .film-placement-poster {
    width: min(72vw, 280px);
  }

  .film-placement-poster img {
    height: auto;
    max-height: 420px;
  }

  .film-placement-copy {
    width: min(100%, 620px);
    margin-inline: auto;
    text-align: center;
  }

  .film-placement-copy h2 {
    font-size: clamp(44px, 12vw, 64px);
  }

  .film-placement-rule {
    margin-inline: auto;
  }

  .film-placement-copy > p:not(.kicker):not(.film-placement-lead):not(.film-placement-credit):not(.film-placement-tags) {
    margin-inline: auto;
  }

  .film-placement-credit {
    display: inline-block;
    text-align: left;
  }
}

@media (max-width: 480px) {
  .film-placement-poster {
    width: min(74vw, 245px);
  }

  .film-placement-poster img {
    max-height: 360px;
  }

  .film-placement-tags {
    letter-spacing: 2px;
  }
}

/* Compact preview and release carousels
----------------------------------------------------- */
.song-preview-list {
  display: block;
}

.preview-card-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
}

.preview-card-strip .preview-track {
  height: 100%;
}

.preview-card-strip .preview-cover {
  width: min(100%, 180px);
  margin: 14px auto 16px;
  border: 1px solid rgba(226, 170, 67, .24);
}

.preview-now-playing {
  margin-top: 22px;
}

/* The catalogue covers are visual navigation, so they stay compact. */



@media (min-width: 701px) and (max-width: 1050px) {
  .preview-card-strip {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    padding: 0 0 14px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .preview-card-strip::-webkit-scrollbar {
    display: none;
  }

  .preview-card-strip .preview-track {
    flex: 0 0 calc((100% - 18px) / 2);
    scroll-snap-align: start;
  }

  .preview-card-strip .preview-cover {
    width: min(100%, 210px);
  }


}

@media (max-width: 700px) {
  .song-preview-list {
    display: block;
    padding: 0;
    margin: 0;
    overflow: visible;
  }

  .preview-card-strip {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 0 7% 16px;
    margin-inline: -7%;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .preview-card-strip::-webkit-scrollbar {
    display: none;
  }

  .preview-card-strip .preview-track {
    flex: 0 0 76%;
    scroll-snap-align: center;
  }

  .preview-card-strip .preview-cover {
    width: min(100%, 210px);
  }

  .preview-now-playing {
    width: 100%;
    margin-top: 18px;
  }


}

/* About — Songs. Stories. Substance.
----------------------------------------------------- */
.about {
  isolation: isolate;
  padding-block: clamp(82px, 8vw, 126px);
  background:
    radial-gradient(circle at 88% 22%, rgba(40, 91, 178, .16), transparent 34%),
    linear-gradient(112deg, #090e15 0%, #0d1724 54%, #10233b 100%);
  color: var(--alive-champagne);
}

.about::after {
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background:
    repeating-linear-gradient(90deg, transparent 0 79px, rgba(255, 255, 255, .016) 80px),
    repeating-linear-gradient(0deg, transparent 0 79px, rgba(255, 255, 255, .012) 80px);
  box-shadow: none;
  opacity: .65;
  z-index: -1;
}

.about-grid {
  width: min(1480px, 92%);
  grid-template-columns: minmax(0, 1.08fr) minmax(430px, .92fr);
  gap: clamp(58px, 6.5vw, 112px);
}

.about-image {
  overflow: visible;
  padding: 0 18px 18px 0;
}

.about-image::before {
  inset: 20px 0 0 20px;
  border: 1px solid rgba(226, 170, 67, .72);
  background: rgba(226, 170, 67, .08);
}

.about-image img {
  width: 100%;
  height: clamp(540px, 44vw, 690px);
  min-height: 0;
  object-fit: cover;
  object-position: 54% center;
  filter: grayscale(1) contrast(1.1) brightness(.78);
  box-shadow: 0 28px 60px rgba(0, 0, 0, .32);
}

.about-copy {
  position: relative;
  padding-block: 12px;
}

.about-copy::after {
  display: block;
  width: min(190px, 36%);
  height: 1px;
  margin-top: 34px;
  background: linear-gradient(90deg, var(--alive-gold), transparent);
  content: "";
}

.about-quote {
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--alive-gold);
}

.about-quote > p {
  max-width: 700px;
  margin: 0;
  color: var(--alive-gold) !important;
  font-family: var(--font-script);
  font-size: clamp(32px, 3vw, 48px);
  line-height: 1.12;
}

.about-attribution {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 7px;
  margin-top: 18px;
  padding-right: 4%;
}

.about-attribution cite {
  color: var(--alive-white);
  font-family: var(--font-script);
  font-size: clamp(27px, 2.2vw, 38px);
  font-style: normal;
  line-height: 1;
}

.about-attribution span {
  color: var(--alive-gold);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .28em;
  text-transform: uppercase;
}

.about-copy .kicker {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--alive-gold);
}

.about-copy .kicker::before {
  width: 34px;
  height: 1px;
  background: var(--alive-gold);
  content: "";
}

.about-copy h2 {
  max-width: 720px;
  margin: 24px 0 30px;
  color: var(--alive-white);
  font-size: clamp(58px, 5.4vw, 88px);
  line-height: .92;
}

.about-body {
  max-width: 650px;
  margin-top: 32px;
  padding-top: 26px;
  border-top: 1px solid rgba(226, 170, 67, .32);
}

.about .about-body p {
  max-width: 680px;
  color: rgba(255, 250, 242, .82) !important;
  font-size: clamp(15px, 1.12vw, 18px);
  line-height: 1.75;
}

.about-body p + p {
  margin-top: 12px;
}

@media (max-width: 900px) {
  .about-grid {
    grid-template-columns: 1fr;
    gap: 62px;
  }

  .about-image {
    width: min(100%, 820px);
    margin-inline: auto;
  }

  .about-image img {
    height: clamp(480px, 66vw, 640px);
  }

  .about-copy {
    width: min(100%, 760px);
    margin-inline: auto;
  }
}

@media (max-width: 600px) {
  .about {
    padding-block: 68px;
  }

  .about-image {
    width: 100%;
    padding: 0 10px 10px 0;
  }

  .about-image img {
    height: min(112vw, 470px);
    min-height: 360px;
  }

  .about-copy {
    padding-block: 0;
    text-align: center;
  }

  .about-copy .kicker {
    justify-content: center;
  }

  .about-copy h2 {
    font-size: clamp(44px, 14vw, 58px);
  }

  .about-quote > p {
    font-size: clamp(31px, 9vw, 40px);
  }

  .about-attribution {
    align-items: center;
    padding-right: 0;
  }

  .about-body {
    margin-top: 28px;
  }

  .about-copy::after {
    margin-inline: auto;
  }
}

/* About showcase — featured release, services and contact
----------------------------------------------------- */
.about-showcase {
  border-top: 1px solid rgba(226, 170, 67, .42);
  border-bottom: 1px solid rgba(226, 170, 67, .42);
  background: linear-gradient(112deg, #080d14, #0b1624 58%, #10223a);
  color: var(--alive-white);
}

.about-showcase-statement {
  margin: 0;
  padding: 20px 5%;
  border-bottom: 1px solid rgba(226, 170, 67, .38);
  color: rgba(255, 250, 242, .72);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .32em;
  line-height: 1.7;
  text-align: center;
  text-transform: uppercase;
}

.about-showcase-main {
  display: grid;
  grid-template-columns: minmax(490px, .92fr) minmax(0, 1.08fr);
  gap: clamp(48px, 5.5vw, 90px);
  width: min(1480px, 90%);
  padding-block: clamp(46px, 5vw, 74px);
}

.about-showcase-label {
  margin: 0 0 16px;
  color: var(--alive-gold);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.about-release-layout {
  display: grid;
  grid-template-columns: minmax(180px, 250px) minmax(260px, 1fr);
  gap: clamp(28px, 3vw, 48px);
  align-items: center;
}

.about-release-cover {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  box-shadow: 0 24px 52px rgba(0, 0, 0, .34);
}

.about-release-player h3 {
  margin: 0;
  color: var(--alive-white);
  font-family: var(--font-heading);
  font-size: clamp(30px, 2.6vw, 43px);
  font-weight: 600;
}

.about-release-player > p {
  margin: 5px 0 24px;
  color: var(--alive-gold);
  font-family: var(--font-heading);
  font-size: 20px;
}

.about-audio-progress {
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 250, 242, .28);
}

.about-audio-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--alive-gold);
}

.about-audio-controls {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 18px;
}

.about-audio-controls button {
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--alive-white);
  cursor: pointer;
  font-size: 16px;
}

.about-audio-controls button:focus-visible,
.about-spotify-button:focus-visible,
.about-showcase-contact-action a:focus-visible {
  outline: 2px solid var(--alive-gold);
  outline-offset: 4px;
}

.about-audio-controls .about-audio-toggle {
  width: 48px;
  height: 48px;
  border: 1px solid var(--alive-gold);
  border-radius: 50%;
  color: var(--alive-gold);
}

.about-audio-time {
  margin-left: auto;
  color: rgba(255, 250, 242, .78);
  font-size: 12px;
  white-space: nowrap;
}

.about-spotify-button {
  display: inline-flex;
  justify-content: center;
  margin-top: 20px;
  padding: 13px 24px;
  border: 1px solid var(--alive-gold);
  color: var(--alive-white);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-decoration: none;
  text-transform: uppercase;
}

.about-services {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-left: 1px solid rgba(255, 250, 242, .18);
}

.about-services article {
  padding: 8px clamp(14px, 2vw, 28px);
  text-align: center;
}

.about-services i {
  color: var(--alive-gold);
  font-size: 42px;
}

.about-services h3 {
  margin: 20px 0 12px;
  color: var(--alive-gold);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.about-services p {
  margin: 0;
  color: rgba(255, 250, 242, .84);
  font-size: 13px;
  line-height: 1.62;
}

.about-showcase-contact {
  border-top: 1px solid rgba(226, 170, 67, .42);
  background:
    radial-gradient(circle at 8% 50%, rgba(239, 118, 82, .18), transparent 28%),
    linear-gradient(100deg, #21191b, #111724 52%, #0d1a2b);
}

.about-showcase-contact-inner {
  display: grid;
  grid-template-columns: 1.35fr .8fr 1fr .55fr;
  align-items: center;
  width: min(1480px, 86%);
  padding-block: 34px;
}

.about-showcase-contact-inner > * {
  min-width: 0;
  margin: 0;
  padding-inline: clamp(22px, 3vw, 48px);
}

.about-showcase-contact-inner > * + * {
  border-left: 1px solid rgba(255, 250, 242, .24);
}

.about-showcase-contact h3 {
  margin: 0 0 8px;
  color: var(--alive-white);
  font-family: var(--font-heading);
  font-size: clamp(34px, 3vw, 48px);
}

.about-showcase-contact p {
  color: rgba(255, 250, 242, .82);
  font-size: 13px;
  line-height: 1.6;
}

.about-showcase-contact-action {
  display: grid;
  justify-items: center;
  gap: 12px;
}

.about-showcase-contact-action a {
  min-width: 170px;
  padding: 14px 20px;
  border: 1px solid var(--alive-gold);
  color: var(--alive-white);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}

.about-showcase-contact-action span {
  width: 210px;
  max-width: 100%;
  color: var(--alive-gold);
  font-size: 16px;
  line-height: 1.35;
  text-align: center;
  text-wrap: balance;
}

.about-showcase-signature {
  color: var(--alive-gold) !important;
  font-family: var(--font-script);
  font-size: clamp(25px, 2vw, 34px) !important;
  line-height: 1.25 !important;
  text-align: center;
}

.about-showcase-roles {
  color: var(--alive-white) !important;
  font-family: var(--font-heading);
  font-size: 18px !important;
  line-height: 1.55 !important;
}

@media (max-width: 1180px) {
  .about-showcase-main {
    grid-template-columns: 1fr;
  }

  .about-services {
    padding-top: 42px;
    border-top: 1px solid rgba(255, 250, 242, .18);
    border-left: 0;
  }

  .about-showcase-contact-inner {
    grid-template-columns: 1fr 1fr;
    gap: 30px 0;
  }

  .about-showcase-contact-inner > :nth-child(3) {
    border-left: 0;
  }
}

@media (max-width: 700px) {
  .about-showcase-statement {
    padding-inline: 8%;
    font-size: 9px;
    letter-spacing: .22em;
  }

  .about-showcase-main {
    width: min(100% - 36px, 620px);
  }

  .about-release-layout {
    grid-template-columns: 1fr;
  }

  .about-release-cover {
    width: min(100%, 320px);
    margin-inline: auto;
  }

  .about-release-player {
    text-align: center;
  }

  .about-audio-controls {
    justify-content: center;
  }

  .about-audio-time {
    margin-left: 0;
  }

  .about-services {
    grid-template-columns: 1fr 1fr;
    gap: 38px 0;
  }

  .about-services article {
    padding-inline: 10px;
  }

  .about-showcase-contact-inner {
    grid-template-columns: 1fr;
    width: min(100% - 36px, 560px);
    text-align: center;
  }

  .about-showcase-contact-inner > * {
    padding: 24px 8px;
  }

  .about-showcase-contact-inner > * + * {
    border-top: 1px solid rgba(255, 250, 242, .24);
    border-left: 0;
  }

  .about-showcase-roles {
    text-align: center;
  }
}

/* Six-cover preview catalogue + shared player
----------------------------------------------------- */
.song-preview-layout {
  display: block;
}

.song-preview-feature {
  display: none;
}

.song-preview-list {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 22px;
  background: transparent;
}

.song-preview-list .preview-track {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 0;
  padding: 0 0 18px;
  flex-direction: column;
  align-items: stretch;
  border: 1px solid rgba(226, 170, 67, .42);
  background: rgba(8, 14, 28, .46);
  overflow: hidden;
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.song-preview-list .preview-track:hover,
.song-preview-list .preview-track.is-selected {
  transform: translateY(-4px);
  border-color: var(--alive-gold);
  background: rgba(31, 42, 102, .72);
}

.preview-cover {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  margin: 0 0 16px;
  object-fit: cover;
  cursor: pointer;
}

.song-preview-list .preview-number,
.song-preview-list .preview-duration,
.song-preview-list .preview-request,
.song-preview-list .preview-wave {
  display: none;
}

.song-preview-list .preview-track-info {
  min-width: 0;
  padding: 0 14px;
}

.song-preview-list .preview-track-info h3 {
  margin: 0 0 4px;
  color: var(--alive-white);
  font-size: clamp(18px, 1.55vw, 25px);
  line-height: 1.05;
}

.song-preview-list .preview-track-info span {
  display: block;
  overflow: hidden;
  color: rgba(255, 246, 232, .64);
  font-size: 11px;
  letter-spacing: .7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.song-preview-list .preview-play {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 250, 242, .78);
  border-radius: 50%;
  background: rgba(10, 15, 27, .84);
  color: var(--alive-white);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
}

.song-preview-list .preview-play:hover,
.song-preview-list .preview-play.is-playing {
  border-color: var(--alive-gold);
  background: var(--alive-gold);
  color: var(--alive-indigo);
}

.preview-now-playing {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 90px minmax(190px, .72fr) auto minmax(220px, 1.6fr) auto;
  gap: 24px;
  align-items: center;
  margin-top: 10px;
  padding: 18px;
  border: 1px solid rgba(226, 170, 67, .58);
  background: linear-gradient(110deg, rgba(15, 22, 56, .96), rgba(19, 59, 128, .88));
  box-shadow: 0 18px 42px rgba(5, 9, 30, .24);
}

.preview-now-cover {
  width: 90px;
  aspect-ratio: 1;
  object-fit: cover;
}

.preview-now-copy {
  min-width: 0;
}

.preview-now-copy span {
  display: block;
  margin-bottom: 5px;
  color: var(--alive-gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.preview-now-copy strong {
  display: block;
  overflow: hidden;
  color: var(--alive-white);
  font-family: var(--font-heading);
  font-size: clamp(25px, 2.4vw, 38px);
  font-weight: 500;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.preview-now-copy small,
.preview-now-time {
  color: rgba(255, 246, 232, .68);
}

.preview-now-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.preview-now-controls button {
  display: grid;
  width: 38px;
  height: 38px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(226, 170, 67, .55);
  border-radius: 50%;
  background: rgba(9, 16, 38, .78);
  color: var(--alive-white);
  cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}

.preview-now-controls button:hover,
.preview-now-controls button:focus-visible {
  background: var(--alive-gold);
  color: var(--alive-indigo);
  transform: translateY(-2px);
}

.preview-now-controls .preview-now-toggle {
  width: 48px;
  height: 48px;
  background: var(--alive-gold);
  color: var(--alive-indigo);
}

.preview-now-wave {
  position: relative;
  height: 48px;
  overflow: hidden;
  background: repeating-linear-gradient(90deg, rgba(126, 174, 255, .28) 0 2px, transparent 2px 6px);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
}

.preview-now-wave span {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  background: repeating-linear-gradient(90deg, #67b7ff 0 2px, transparent 2px 6px);
  transition: width .12s linear;
}

.song-preview-note,
.preview-streaming-links {
  grid-column: 1 / -1;
}

@media (max-width: 1050px) {
  .song-preview-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .song-preview-list {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding: 0 7% 16px;
    margin-inline: -7%;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .song-preview-list::-webkit-scrollbar {
    display: none;
  }

  .song-preview-list .preview-track {
    flex: 0 0 72%;
    scroll-snap-align: start;
  }

  .preview-now-playing,
  .song-preview-note,
  .preview-streaming-links {
    flex: 0 0 100%;
  }

  .preview-now-playing {
    grid-template-columns: 64px minmax(0, 1fr) auto;
    gap: 14px;
    padding: 14px;
    scroll-snap-align: start;
  }

  .preview-now-cover {
    width: 64px;
  }

  .preview-now-controls {
    grid-column: 1 / -1;
    padding-top: 4px;
  }

  .preview-now-wave {
    display: none;
  }

  .preview-now-copy strong {
    font-size: 24px;
  }

  .song-preview-note,
  .preview-streaming-links {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .feature-grid article {
    transition: none;
  }
}

/* Creative Work — cinematic contact, credits and sync showcase */
.creative-work-showcase{background:#111;color:#f6f0e7;font-family:var(--font-body)}
.creative-work-contact-banner{display:grid;grid-template-columns:40% 60%;min-height:390px;background:#111}
.creative-work-contact-image{background:linear-gradient(90deg,transparent 70%,#111),url("assets/stuart-mansfield-songwriter-playing-guitar-hero.webp") center/cover no-repeat;filter:grayscale(1)}
.creative-work-contact-copy{align-self:center;max-width:800px;padding:54px 8vw 54px 4vw}
.creative-work-gold-kicker{margin:0 0 12px;color:#d6a65a;font-size:17px;letter-spacing:.28em;text-transform:uppercase}
.creative-work-contact-copy h2{margin:0 0 14px;font-family:var(--font-heading);font-size:clamp(38px,4vw,68px);font-weight:500;line-height:1;text-transform:uppercase}
.creative-work-contact-copy>p:not(.creative-work-gold-kicker){max-width:760px;margin:0 0 24px;font-size:18px;line-height:1.55}
.creative-work-email-button,.creative-work-catalogue{display:inline-flex;align-items:center;gap:14px;padding:14px 22px;border:1px solid #c99a52;color:#d9ad68;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.creative-work-credits,.creative-work-info-strip{background:#f3eee5;color:#171717}
.creative-work-credits{padding:28px 5vw 32px;text-align:center}
.creative-work-credits>h2,.creative-work-featured>h2{margin:0 0 22px;font-size:clamp(22px,2vw,32px);font-weight:600;letter-spacing:.25em;text-transform:uppercase}
.creative-work-credits>h2:after,.creative-work-featured>h2:after{display:block;width:72px;height:2px;margin:12px auto 0;background:#c79a56;content:""}
.creative-work-credits-grid{display:grid;grid-template-columns:repeat(6,1fr);max-width:1450px;margin:auto}
.creative-work-credits-grid article{display:flex;min-width:0;flex-direction:column;align-items:center;padding:0 22px;border-right:1px solid rgba(171,125,66,.35)}
.creative-work-credits-grid article:last-child{border:0}
.creative-work-credits-grid i,.creative-work-bmi{display:grid;width:58px;height:58px;margin-bottom:12px;place-items:center;border:1px solid #c79a56;border-radius:50%;font-size:29px}
.creative-work-bmi{font-family:var(--font-heading)}
.creative-work-credits-grid strong{font-size:14px;text-transform:uppercase}.creative-work-credits-grid span{margin-top:6px;font-size:15px;line-height:1.4}
.creative-work-featured{padding:30px 5vw;background:radial-gradient(circle at 50% 50%,#252525,#0e0e0e 70%);text-align:center}
.creative-work-song-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,28px);max-width:1400px;margin:auto;text-align:left}
.creative-work-song-grid img{display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover;border:1px solid #4a443c;background:#0e0e0e}
.creative-work-song-grid h3{margin:16px 12px 5px;font-size:19px;text-transform:uppercase}
.creative-work-song-grid p{margin:0 12px;color:#d2a969;line-height:1.45}.creative-work-catalogue{margin-top:24px;color:#f6f0e7}
.creative-work-info-strip{display:grid;grid-template-columns:repeat(2,1fr);gap:0;padding:22px 5vw}
.creative-work-info-strip article{display:flex;align-items:center;gap:20px;padding:0 32px;border-right:1px solid rgba(171,125,66,.35)}
.creative-work-info-strip article:last-child{border:0}.creative-work-info-strip i{display:grid;flex:0 0 62px;height:62px;place-items:center;border:1px solid #c79a56;border-radius:50%;font-size:28px}
.creative-work-info-strip strong,.creative-work-info-strip span{display:block}.creative-work-info-strip strong{margin-bottom:5px;font-size:17px;letter-spacing:.08em;text-transform:uppercase}.creative-work-info-strip span{font-size:14px;line-height:1.4}
@media(max-width:980px){.creative-work-contact-banner{grid-template-columns:1fr}.creative-work-contact-image{min-height:330px;background-image:linear-gradient(0deg,#111,transparent 50%),url("assets/stuart-mansfield-songwriter-playing-guitar-hero.webp")}.creative-work-contact-copy{padding:40px 7vw}.creative-work-credits-grid{grid-template-columns:repeat(3,1fr);row-gap:28px}.creative-work-song-grid{grid-template-columns:repeat(2,1fr)}.creative-work-song-grid article:last-child{grid-column:1/-1;width:calc(50% - 14px);margin:auto}.creative-work-info-strip{grid-template-columns:1fr;gap:18px}.creative-work-info-strip article{border-right:0;border-bottom:1px solid rgba(171,125,66,.35);padding:0 0 18px}.creative-work-info-strip article:last-child{border:0}}
@media(max-width:560px){.creative-work-contact-image{min-height:260px}.creative-work-contact-copy h2{font-size:38px}.creative-work-credits-grid,.creative-work-song-grid{grid-template-columns:1fr}.creative-work-credits-grid article{border:0;border-bottom:1px solid rgba(171,125,66,.25);padding:18px}.creative-work-song-grid article:last-child{grid-column:auto;width:100%}.creative-work-song-grid{gap:30px}.creative-work-info-strip{padding:26px 22px}.creative-work-info-strip article{align-items:flex-start}.creative-work-credits>h2,.creative-work-featured>h2{letter-spacing:.14em}}

/* Featured Songs for Sync — responsive six-card grid. */
@media (min-width: 1100px) {
  .creative-work-song-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: clamp(12px, 1.35vw, 22px);
    padding-left: 24px;
    padding-right: 24px;
  }

  .creative-work-song-grid h3 {
    margin: 12px 6px 5px;
    font-size: clamp(14px, 1.15vw, 18px);
  }

  .creative-work-song-grid p {
    margin: 0 6px;
    font-size: clamp(12px, .95vw, 15px);
  }
}

@media (max-width: 980px) {
  .creative-work-song-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creative-work-song-grid article:last-child {
    grid-column: auto;
    width: auto;
    margin: 0;
  }
}

@media (max-width: 560px) {
  .creative-work-song-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .creative-work-song-grid article:last-child {
    width: 100%;
  }
}

/* Mobile breathing room between the sync image and creative-work image. */
@media (max-width: 700px) {
  .sync-copy + .sync-image {
    border-top: 24px solid var(--alive-indigo);
  }

  .creative-work-contact-banner + .creative-work-credits,
  .creative-work-credits + .creative-work-featured,
  .creative-work-featured + .creative-work-info-strip {
    border-top: 24px solid var(--alive-indigo);
  }

  .sync + .sm-divider {
    height: 26px;
    background:
      linear-gradient(90deg, var(--alive-coral), var(--alive-magenta), var(--alive-cobalt), var(--alive-gold)) top / 100% 2px no-repeat,
      var(--alive-indigo);
  }
}

/* Request Full Catalogue — compact premium callout
----------------------------------------------------- */
.catalogue-request-section {
  width: min(1400px, 100%);
  margin: 28px auto 4px;
  padding: 11px;
  background: transparent;
  color: #fff8ef;
}

.catalogue-request-panel {
  display: grid;
  min-height: 142px;
  grid-template-columns: auto minmax(0, 1fr) minmax(280px, 390px);
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
  width: 100%;
  margin-inline: auto;
  padding: 22px clamp(28px, 4vw, 68px);
  border: 1px solid rgba(255, 219, 195, .42);
  box-shadow:
    0 0 0 10px #101113,
    0 0 0 11px rgba(220, 77, 122, .72);
  background:
    linear-gradient(105deg, rgba(67, 15, 38, .88), rgba(167, 31, 83, .94) 54%, rgba(224, 67, 116, .94));
}

.catalogue-request-icon {
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border: 1px solid rgba(255, 248, 239, .88);
  border-radius: 50%;
  color: #fff8ef;
  font-size: 34px;
}

.catalogue-request-content h2 {
  margin: 0 0 8px;
  color: #fff8ef;
  font-family: var(--font-heading);
  font-size: clamp(25px, 2.3vw, 38px);
  font-weight: 500;
  line-height: 1.08;
  text-transform: none;
}

.catalogue-request-content p {
  max-width: 760px;
  margin: 0;
  color: rgba(255, 248, 239, .94);
  font-size: clamp(14px, 1.1vw, 17px);
  line-height: 1.5;
}

.catalogue-request-button {
  display: inline-flex;
  min-height: 64px;
  align-items: center;
  justify-content: center;
  padding: 16px 24px;
  border: 1px solid rgba(255, 248, 239, .42);
  background: #111214;
  color: #fff8ef;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .13em;
  text-align: center;
  text-transform: uppercase;
  transition: background-color .25s ease, border-color .25s ease;
}

.catalogue-request-button:hover,
.catalogue-request-button:focus-visible {
  border-color: #fff8ef;
  background: #1b1c1f;
}

@media (max-width: 980px) {
  .catalogue-request-panel {
    grid-template-columns: auto minmax(0, 1fr);
    padding-block: 26px;
  }

  .catalogue-request-button {
    grid-column: 1 / -1;
    width: min(100%, 390px);
    margin-inline: auto;
  }
}

@media (max-width: 600px) {
  .catalogue-request-section {
    padding: 16px 18px;
  }

  .catalogue-request-panel {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 26px 22px;
    text-align: center;
  }

  .catalogue-request-icon {
    width: 64px;
    height: 64px;
    margin-inline: auto;
    font-size: 28px;
  }

  .catalogue-request-content h2 {
    font-size: 28px;
  }

  .catalogue-request-content p {
    font-size: 15px;
  }

  .catalogue-request-button {
    grid-column: auto;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .catalogue-request-button {
    transition: none;
  }
}

/* =====================================================
   FINAL COMPACT MUSIC CAROUSELS
   Kept last so legacy grid rules cannot collapse cards.
===================================================== */
.song-previews-head {
  display: block !important;
  grid-template-columns: 1fr !important;
  margin-bottom: clamp(30px, 4vw, 54px);
}

.song-previews-intro {
  width: min(100%, 980px);
}

.song-previews-intro h2 {
  max-width: none;
}

.song-previews-description {
  max-width: 760px;
}

.music-preview-hero,
.song-current-release,
.song-preview-feature {
  display: none !important;
}

.song-preview-layout {
  display: block !important;
}

.music .song-preview-list {
  display: block !important;
  width: 100%;
  padding: 0;
  overflow: visible;
}

.preview-card-carousel {
  position: relative;
  width: 100%;
}

.preview-card-strip {
  display: flex !important;
  width: 100% !important;
  gap: 16px !important;
  padding: 4px 2px 16px !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.preview-card-strip::-webkit-scrollbar {
  display: none;
}

.preview-card-strip > .preview-track {
  display: flex !important;
  flex: 0 0 calc((100% - 48px) / 4) !important;
  width: calc((100% - 48px) / 4) !important;
  min-width: calc((100% - 48px) / 4) !important;
  max-width: calc((100% - 48px) / 4) !important;
  height: auto !important;
  min-height: 246px !important;
  padding: 0 0 14px !important;
  scroll-snap-align: start;
  cursor: pointer;
}

.preview-card-strip > .preview-track:focus-visible {
  outline: 3px solid var(--alive-gold);
  outline-offset: 3px;
}

.preview-card-strip > .preview-track:hover,
.preview-card-strip > .preview-track.is-selected {
  transform: none;
}

.preview-card-strip > .preview-track .preview-cover {
  display: block;
  flex: 0 0 auto;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 1;
  margin: 0 0 13px !important;
  object-fit: cover;
}

.preview-card-strip .preview-track-info h3 {
  font-size: 18px;
  line-height: 1.08;
}

.preview-card-arrow {
  position: absolute;
  top: 50%;
  z-index: 4;
  display: grid;
  width: 42px;
  height: 56px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--alive-gold);
  background: rgba(20, 18, 53, .94);
  color: var(--alive-gold);
  box-shadow: 0 12px 28px rgba(4, 7, 24, .28);
  cursor: pointer;
  transform: translateY(-50%);
}

.preview-card-prev { left: -21px; }
.preview-card-next { right: -21px; }

.music .preview-now-playing {
  width: 100%;
  margin-top: 16px;
}

/* Album catalogue: a neat sleeve-sized navigation row. */








@media (min-width: 701px) and (max-width: 1050px) {
  #music {
    scroll-margin-top: 138px;
  }

  .preview-card-strip > .preview-track {
    flex-basis: calc((100% - 18px) / 2) !important;
    width: calc((100% - 18px) / 2) !important;
    min-width: calc((100% - 18px) / 2) !important;
    max-width: calc((100% - 18px) / 2) !important;
    padding: 14px 14px 18px !important;
  }

  .preview-card-strip > .preview-track .preview-cover {
    width: min(100%, 210px) !important;
    height: auto !important;
    aspect-ratio: 1;
    margin: 0 auto 16px !important;
  }


}

/* iPad Pro portrait and similarly sized tablets. */
@media (min-width: 1051px) and (max-width: 1180px) {
  #music {
    scroll-margin-top: 118px;
  }
}

@media (max-width: 700px) {
  .preview-card-carousel {
    width: calc(100% + 12%);
    margin-inline: -6%;
  }

  .preview-card-strip {
    padding-inline: 6% !important;
  }

  .preview-card-strip > .preview-track {
    flex: 0 0 min(68vw, 238px) !important;
    width: min(68vw, 238px) !important;
    min-width: min(68vw, 238px) !important;
    max-width: min(68vw, 238px) !important;
  }

  .preview-card-strip > .preview-track .preview-cover {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
  }

  .preview-card-arrow {
    top: 50%;
    width: 38px;
    height: 52px;
  }

  .preview-card-prev { left: 0; }
  .preview-card-next { right: 0; }

  .music .preview-now-playing {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    margin-top: 14px;
  }


}

/* Phone music player — full-width, calm and intentional
----------------------------------------------------- */
@media (max-width: 600px) {
  #music {
    scroll-margin-top: 92px;
  }

  .music.section {
    padding-bottom: 18px;
  }

  .music > .wrap {
    width: 100%;
  }

  .music .song-previews {
    margin: 48px 0 0;
    width: 100%;
    padding: 46px 0 40px;
    border-inline: 0;
  }

  .music .song-previews-head {
    padding-inline: 20px;
  }

  .music .song-preview-layout,
  .music .song-preview-list {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  .music .preview-card-carousel {
    width: 100%;
    margin-inline: 0;
    overflow: hidden;
  }

  .music .preview-card-strip {
    gap: 0 !important;
    padding: 4px 0 16px !important;
    scroll-padding-inline: 0;
  }

  .music .preview-card-strip > .preview-track {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    padding: 14px 18px 16px !important;
    scroll-snap-align: start;
  }

  .music .preview-card-strip > .preview-track .preview-cover {
    width: min(100%, 240px) !important;
    margin: 0 auto 16px !important;
  }

  .music .preview-card-strip .preview-track-info {
    width: min(100%, 240px);
    margin-inline: auto;
  }

  .music .preview-card-prev {
    left: 0;
  }

  .music .preview-card-next {
    right: 0;
  }

  .music .preview-now-playing {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    grid-template-areas:
      "cover copy"
      "controls controls"
      "time time";
    width: 100% !important;
    max-width: none !important;
    gap: 14px 16px;
    margin: 16px 0 0 !important;
    padding: 16px;
    overflow: hidden;
    justify-self: center;
    scroll-snap-align: none;
  }

  .music .preview-now-cover {
    grid-area: cover;
    width: 72px;
  }

  .music .preview-now-copy {
    grid-area: copy;
  }

  .music .preview-now-copy strong {
    font-size: clamp(23px, 8vw, 30px);
  }

  .music .preview-now-controls {
    grid-area: controls;
    padding-top: 2px;
  }

  .music .preview-now-time {
    grid-area: time;
    justify-self: end;
    font-size: 15px;
  }

  .music .preview-now-wave {
    display: none;
  }

  .music .song-preview-note {
    display: flex !important;
    gap: 7px;
    align-items: center;
    justify-content: center;
    margin: 22px 16px 14px;
    text-align: center;
  }

  .music .song-preview-note span {
    padding: 0;
  }

  .music .preview-streaming-links {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    margin: 0;
    padding: 0 14px 18px;
  }

  .music .preview-streaming-links a {
    min-width: 0;
    min-height: 40px;
    gap: 5px;
    justify-content: center;
    padding: 8px 5px;
    font-size: 9px;
    letter-spacing: .04em;
    white-space: nowrap;
  }

  .music .preview-streaming-links .fa {
    flex: 0 0 auto;
    font-size: 13px;
  }
}

/* Privacy page — same bright identity
----------------------------------------------------- */
.privacy-page {
  background:
    radial-gradient(circle at 8% 12%, rgba(223, 75, 85, .15), transparent 24%),
    radial-gradient(circle at 92% 78%, rgba(18, 62, 174, .13), transparent 28%),
    linear-gradient(145deg, #fffaf2, #fff0df 52%, #eee9ff);
  color: var(--alive-ink);
}

.privacy-inner {
  padding: clamp(28px, 5vw, 64px);
  border: 1px solid rgba(96, 72, 153, .14);
  background: rgba(255, 250, 242, .76);
  box-shadow: var(--alive-shadow);
}

.privacy-brand,
.privacy-page h1,
.privacy-section h2 {
  color: var(--alive-indigo);
}

.privacy-back,
.privacy-kicker,
.privacy-email,
.privacy-language button.active {
  color: var(--alive-coral);
}

.privacy-section p {
  color: #535d72;
}

.privacy-footer {
  background: linear-gradient(135deg, var(--alive-indigo), #123878);
  color: rgba(255, 250, 242, .72);
}

.privacy-footer a {
  color: #ffd46f;
}

/* Current release — balanced artwork spacing
----------------------------------------------------- */
@media (min-width: 951px) {
  .song-current-release {
    padding: 24px;
    border: 1px solid rgba(226, 170, 67, .30);
    background: rgba(255, 255, 255, .045);
  }

  .song-current-release-cover {
    width: 100%;
    max-width: none;
  }
}

@media (min-width: 701px) and (max-width: 950px) {
  .song-previews-head {
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: 28px;
  }

  .song-current-release {
    padding: 22px;
    border: 1px solid rgba(226, 170, 67, .30);
    background: rgba(255, 255, 255, .045);
  }

  .song-current-release-cover {
    max-width: none;
  }
}

/* Mobile language controls live inside the open menu. */
.mobile-language-switcher {
  display: none;
}

@media (max-width: 980px) {
  .mobile-nav .mobile-language-switcher {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    padding-top: 20px;
    border-top: 1px solid rgba(226, 170, 67, .30);
    color: var(--alive-champagne);
  }

  .mobile-language-switcher .lang {
    min-width: 48px;
    padding: 10px 12px;
    border: 1px solid rgba(226, 170, 67, .34);
    color: var(--alive-champagne);
    font: 700 13px/1 var(--font-body);
    letter-spacing: 1px;
    opacity: .72;
  }

  .mobile-language-switcher .lang.active {
    border-color: var(--alive-gold);
    background: var(--alive-gold);
    color: var(--alive-indigo);
    opacity: 1;
  }
}

@media (max-width: 700px) {
  .song-current-release {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 30px;
    padding: 24px;
    border: 1px solid rgba(226, 170, 67, .34);
    background: rgba(255, 255, 255, .05);
  }

  .song-current-release-label {
    margin-bottom: 18px;
  }

  .song-current-release-cover {
    width: min(100%, 280px);
    max-width: 280px;
    margin-inline: auto;
  }

  .song-current-release h3 {
    margin: 20px 0 5px;
    font-size: clamp(30px, 10vw, 38px);
    line-height: 1.05;
    text-align: center;
  }

  .song-current-release-style {
    text-align: center;
  }

.song-current-release-button {
    width: min(100%, 280px);
    margin: 20px auto 0;
    padding: 13px 18px;
  }
}

/* Final cascade: compact eleven-song player with one changing cover. */
.music .preview-card-carousel { display: none !important; }
.music .song-preview-list { display: block !important; width: 100% !important; }

.music .preview-now-playing {
  display: grid !important;
  grid-template-columns: 190px minmax(220px, .85fr) auto minmax(240px, 1.2fr) auto !important;
  grid-template-areas:
    "cover copy controls wave count"
    "cover copy controls wave time" !important;
  gap: 8px 28px !important;
  width: min(100%, 1180px) !important;
  margin: 18px auto 0 !important;
  padding: 28px 30px !important;
  align-items: center !important;
  overflow: hidden;
  border: 1px solid rgba(226, 170, 67, .72) !important;
  border-radius: 34px !important;
  background: linear-gradient(112deg, rgba(11, 18, 49, .97), rgba(16, 48, 112, .9)) !important;
  box-shadow: 0 24px 58px rgba(4, 8, 28, .3) !important;
}

.music .preview-now-cover { grid-area: cover; width: 190px !important; }
.music .preview-now-copy { grid-area: copy; }
.music .preview-now-controls { grid-area: controls; }
.music .preview-now-wave { grid-area: wave; display: block !important; width: 100%; }
.music .preview-now-count { grid-area: count; align-self: end; }
.music .preview-now-time { grid-area: time; align-self: start; }

@media (max-width: 900px) {
  .music .preview-now-playing {
    grid-template-columns: 140px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "cover copy count"
      "cover controls time"
      "wave wave wave" !important;
    gap: 16px 20px !important;
    padding: 22px !important;
    border-radius: 26px !important;
  }

  .music .preview-now-cover { width: 140px !important; }
}

@media (max-width: 600px) {
  .music .preview-now-playing {
    grid-template-columns: 92px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "cover copy count"
      "controls controls controls"
      "time time time" !important;
    gap: 14px 16px !important;
    width: calc(100% - 28px) !important;
    margin: 14px auto 0 !important;
    padding: 16px !important;
    border-radius: 22px !important;
  }

  .music .preview-now-cover { width: 92px !important; }
  .music .preview-now-wave { display: none !important; }
}

/* Editorial split layout: story at left, eleven-song player at right. */
@media (min-width: 1101px) {
  .music .song-previews {
    position: relative;
    display: grid !important;
    grid-template-columns: minmax(280px, .72fr) minmax(620px, 1.45fr);
    gap: clamp(48px, 6vw, 96px);
    align-items: center;
    padding: clamp(62px, 7vw, 104px) clamp(44px, 6vw, 96px) !important;
    overflow: hidden;
    background:
      radial-gradient(circle at 86% 38%, rgba(67, 113, 222, .2), transparent 32%),
      radial-gradient(circle at 8% 78%, rgba(167, 47, 121, .13), transparent 30%),
      linear-gradient(125deg, rgba(12, 16, 53, .98), rgba(19, 56, 127, .92));
  }

  .music .song-previews::after {
    content: "";
    position: absolute;
    top: 14%;
    bottom: 14%;
    left: 35.5%;
    width: 1px;
    background: linear-gradient(transparent, rgba(226, 170, 67, .72), transparent);
    pointer-events: none;
  }

  .music .song-previews-head {
    position: relative;
    z-index: 1;
    display: block !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
  }

  .music .song-previews-intro {
    width: auto !important;
    max-width: 430px;
    margin: 0 !important;
  }

  .music .song-previews-intro::before {
    content: "11 SONGS • 20-SECOND PREVIEWS";
    display: inline-flex;
    margin-bottom: 28px;
    padding: 8px 13px;
    border: 1px solid rgba(226, 170, 67, .58);
    border-radius: 999px;
    color: var(--alive-gold);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .15em;
  }

  .music .song-previews-intro h2 {
    max-width: 390px;
    margin-bottom: 24px;
    font-size: clamp(48px, 4.7vw, 76px);
    line-height: .94;
    text-wrap: balance;
  }

  .music .song-previews-description {
    max-width: 420px;
    font-size: clamp(17px, 1.35vw, 21px);
    line-height: 1.72;
  }

  .music .song-current-release {
    display: none !important;
  }

  .music .song-preview-layout {
    position: relative;
    z-index: 1;
    min-width: 0;
    margin: 0 !important;
  }

  .music .preview-now-playing {
    grid-template-columns: 168px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "cover copy count"
      "cover controls time"
      "wave wave wave" !important;
    gap: 16px 25px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 26px !important;
    border-color: rgba(226, 170, 67, .6) !important;
    border-radius: 30px !important;
    background:
      linear-gradient(115deg, rgba(6, 12, 39, .94), rgba(24, 57, 127, .8)) !important;
    box-shadow:
      0 32px 76px rgba(3, 7, 30, .4),
      inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    backdrop-filter: blur(14px);
  }

  .music .preview-now-cover {
    width: 168px !important;
    border-radius: 10px;
    transform: rotate(-1.2deg);
    transition: transform .3s ease;
  }

  .music .preview-now-playing:hover .preview-now-cover {
    transform: rotate(0deg) translateY(-3px);
  }

  .music .preview-now-copy strong {
    font-size: clamp(30px, 3vw, 46px);
    white-space: normal;
  }

  .music .preview-now-controls {
    justify-content: flex-start;
  }

  .music .preview-now-wave {
    height: 42px;
    margin-top: 5px;
  }

  .music .song-preview-note {
    margin: 22px 0 12px;
  }

  .music .preview-streaming-links {
    justify-content: flex-start;
  }
}

@media (min-width: 1101px) and (max-width: 1280px) {
  .music .song-previews {
    grid-template-columns: minmax(260px, .65fr) minmax(570px, 1.35fr);
    gap: 46px;
    padding-inline: 42px !important;
  }

  .music .song-previews::after { left: 34%; }
  .music .preview-now-playing { grid-template-columns: 145px minmax(0, 1fr) auto !important; }
  .music .preview-now-cover { width: 145px !important; }
}

/* Featured-release visual language for the catalogue player. */
.music .preview-now-volume {
  grid-area: volume;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--alive-white);
  font-size: 20px;
  cursor: pointer;
}

.music .preview-now-volume:hover,
.music .preview-now-volume:focus-visible {
  color: var(--alive-gold);
}

@media (min-width: 1101px) {
  .music .preview-now-playing {
    position: relative;
    grid-template-columns: 210px minmax(0, 1fr) auto auto !important;
    grid-template-areas:
      "cover copy count count"
      "cover wave wave wave"
      "cover controls time volume" !important;
    gap: 20px 32px !important;
    min-height: 360px;
    padding: 30px 38px 30px 30px !important;
    overflow: visible;
    border: 0 !important;
    border-radius: 0 !important;
    background: rgba(4, 13, 27, .84) !important;
    box-shadow: none !important;
    backdrop-filter: none;
  }

  .music .preview-now-playing::after {
    content: "";
    position: absolute;
    top: 26px;
    right: 0;
    bottom: 26px;
    width: 1px;
    background: rgba(255, 255, 255, .24);
  }

  .music .preview-now-cover {
    width: 210px !important;
    border: 0;
    border-radius: 0;
    box-shadow: 0 20px 46px rgba(0, 0, 0, .38);
    transform: none;
  }

  .music .preview-now-playing:hover .preview-now-cover {
    transform: translateY(-3px);
  }

  .music .preview-now-copy span {
    margin-bottom: 12px;
    color: var(--alive-gold);
    font-size: 12px;
    letter-spacing: .18em;
  }

  .music .preview-now-copy strong {
    margin-bottom: 12px;
    font-size: clamp(42px, 4vw, 62px);
    line-height: .95;
  }

  .music .preview-now-copy small:not(.preview-now-genre) {
    display: none;
  }

  .music .preview-now-copy .preview-now-genre {
    margin-top: 0;
    color: var(--alive-gold);
    font-family: var(--font-heading);
    font-size: clamp(18px, 1.8vw, 27px);
    letter-spacing: 0;
    text-transform: none;
  }

  .music .preview-now-wave {
    height: 7px;
    margin: 0;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .32);
    -webkit-mask-image: none;
    mask-image: none;
  }

  .music .preview-now-wave span {
    border-radius: inherit;
    background: var(--alive-gold);
  }

  .music .preview-now-controls {
    gap: 16px;
  }

  .music .preview-now-controls button {
    width: 42px;
    height: 42px;
    border-color: transparent;
    background: transparent;
    font-size: 17px;
  }

  .music .preview-now-controls .preview-now-toggle {
    width: 66px;
    height: 66px;
    border: 2px solid var(--alive-gold);
    background: transparent;
    color: var(--alive-gold);
    font-size: 20px;
  }

  .music .preview-now-controls .preview-now-toggle:hover,
  .music .preview-now-controls .preview-now-toggle:focus-visible {
    background: var(--alive-gold);
    color: var(--alive-indigo);
  }

  .music .preview-now-time {
    align-self: center;
    justify-self: end;
    color: rgba(255, 255, 255, .82);
    font-size: 16px;
  }

  .music .preview-now-count {
    align-self: start;
    justify-self: end;
  }

  .music .preview-now-volume {
    align-self: center;
  }
}

@media (max-width: 900px) {
  .music .preview-now-playing {
    grid-template-areas:
      "cover copy count"
      "cover controls volume"
      "wave wave time" !important;
  }
}

@media (max-width: 600px) {
  .music .preview-now-playing {
    grid-template-areas:
      "cover copy count"
      "controls controls controls"
      "time time volume" !important;
  }

  .music .preview-now-volume {
    justify-self: end;
  }
}

/* Keep the upper feature as artwork—not a second audio player. */
.about-featured-release {
  display: grid;
  align-content: start;
  justify-items: center;
}

.about-featured-release .about-showcase-label {
  width: min(100%, 360px);
}

.about-featured-release .about-release-layout {
  display: block;
  width: min(100%, 360px);
}

.about-release-cover-link {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
}

.about-release-cover-link::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(226, 170, 67, .42);
  box-shadow: inset 0 0 0 8px rgba(5, 12, 24, .12);
  pointer-events: none;
  transition: border-color .25s ease, box-shadow .25s ease;
}

.about-release-cover-link:hover::after,
.about-release-cover-link:focus-visible::after {
  border-color: var(--alive-gold);
  box-shadow: inset 0 0 0 8px rgba(226, 170, 67, .08);
}

/* A fixed player frame: title length never changes the artwork or panel size. */
@media (min-width: 1101px) {
  .music .preview-now-playing {
    grid-template-rows: 1fr 7px auto !important;
    height: 390px !important;
    min-height: 390px !important;
    max-height: 390px !important;
    overflow: hidden !important;
  }

  .music .preview-now-cover {
    width: 210px !important;
    min-width: 210px;
    height: 210px !important;
    min-height: 210px;
    max-height: 210px;
  }

  .music .preview-now-copy {
    align-self: center;
    min-height: 148px;
  }

  .music .preview-now-copy strong {
    display: -webkit-box;
    min-height: 60px;
    max-height: 122px;
    overflow: hidden;
    font-size: clamp(42px, 4vw, 62px);
    line-height: .96;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .music .preview-now-copy strong.is-long {
    font-size: clamp(32px, 3vw, 44px);
    line-height: 1;
    -webkit-line-clamp: 3;
  }

  .music .preview-now-copy strong.is-very-long {
    font-size: clamp(27px, 2.45vw, 36px);
    line-height: 1.02;
    -webkit-line-clamp: 3;
  }
}

@media (max-width: 1100px) {
  .about-featured-release .about-showcase-label,
  .about-featured-release .about-release-layout {
    width: min(100%, 300px);
  }

  .music .preview-now-cover {
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  .music .preview-now-copy strong {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .music .preview-now-copy strong.is-long {
    font-size: clamp(20px, 4vw, 28px);
  }

  .music .preview-now-copy strong.is-very-long {
    font-size: clamp(18px, 3.5vw, 24px);
  }
}

/* Compact Featured Release: artwork and release details, without a second player. */
.about-featured-release {
  justify-items: stretch;
}

.about-featured-release .about-showcase-label {
  width: 100%;
}

.about-featured-release .about-release-layout {
  display: grid;
  grid-template-columns: minmax(170px, 220px) minmax(190px, 1fr);
  gap: clamp(24px, 3vw, 42px);
  width: 100%;
  align-items: center;
}

.about-release-summary h3 {
  margin: 0;
  color: var(--alive-white);
  font-family: var(--font-heading);
  font-size: clamp(34px, 3vw, 48px);
  font-weight: 500;
  line-height: 1;
}

.about-release-summary > p {
  margin: 10px 0 0;
  color: var(--alive-gold);
  font-family: var(--font-heading);
  font-size: 21px;
}

.about-release-summary .about-spotify-button {
  margin-top: 28px;
}

.reggae-streams-badge {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  min-height: 32px;
  padding: 7px 10px;
  align-items: center;
  justify-content: center;
  background: rgba(3, 7, 13, .9);
  color: var(--alive-gold);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}

.preview-now-cover-wrap {
  position: relative;
  grid-area: cover;
  width: 190px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  box-shadow: 0 20px 46px rgba(0, 0, 0, .38);
}

.preview-now-cover-wrap .preview-now-cover {
  width: 100% !important;
  height: 100% !important;
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
  box-shadow: none;
}

.preview-now-reggae-badge[hidden] {
  display: none !important;
}

@media (min-width: 1101px) {
  .preview-now-cover-wrap {
    width: 210px;
    height: 210px;
    transform: none;
    transition: transform .3s ease;
  }

  .music .preview-now-playing:hover .preview-now-cover-wrap {
    transform: translateY(-3px);
  }

  .music .preview-now-cover {
    transform: none !important;
  }
}

@media (min-width: 601px) and (max-width: 1100px) {
  .preview-now-cover-wrap {
    width: 140px;
  }
}

@media (max-width: 760px) {
  .about-featured-release {
    justify-items: center;
  }

  .about-featured-release .about-showcase-label {
    width: min(100%, 300px);
  }

  .about-featured-release .about-release-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    width: min(100%, 300px);
    text-align: center;
  }

  .about-release-summary .about-spotify-button {
    width: 100%;
    margin-top: 20px;
  }
}

@media (max-width: 600px) {
  .preview-now-cover-wrap {
    width: 92px;
  }

  .preview-now-cover-wrap .reggae-streams-badge {
    min-height: 22px;
    padding: 5px 4px;
    font-size: 6px;
    letter-spacing: .09em;
  }
}

/* Final compact phone player. */
@media (max-width: 600px) {
  .music .preview-now-playing {
    grid-template-columns: 76px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "cover copy count"
      "controls controls controls"
      "time time volume" !important;
    gap: 10px 12px !important;
    width: calc(100% - 32px) !important;
    min-height: 0 !important;
    margin: 12px auto 0 !important;
    padding: 13px !important;
    border-radius: 18px !important;
  }

  .preview-now-cover-wrap {
    width: 76px;
  }

  .music .preview-now-copy span {
    margin-bottom: 4px;
    font-size: 8px;
    letter-spacing: .14em;
  }

  .music .preview-now-copy strong {
    margin-bottom: 4px;
    font-size: 21px;
    line-height: .98;
    -webkit-line-clamp: 2;
  }

  .music .preview-now-copy strong.is-long {
    font-size: 18px;
    -webkit-line-clamp: 3;
  }

  .music .preview-now-copy strong.is-very-long {
    font-size: 16px;
    line-height: 1;
    -webkit-line-clamp: 3;
  }

  .music .preview-now-copy small:not(.preview-now-genre) {
    font-size: 11px;
  }

  .music .preview-now-copy .preview-now-genre {
    margin-top: 5px;
    font-size: 8px;
    letter-spacing: .06em;
  }

  .music .preview-now-count {
    align-self: start;
    font-size: 10px;
  }

  .music .preview-now-controls {
    gap: 10px;
    padding-top: 0;
  }

  .music .preview-now-controls button {
    width: 34px;
    height: 34px;
    font-size: 13px;
  }

  .music .preview-now-controls .preview-now-toggle {
    width: 50px;
    height: 50px;
    font-size: 16px;
  }

  .music .preview-now-time {
    align-self: center;
    justify-self: end;
    font-size: 13px;
  }

  .music .preview-now-volume {
    width: 34px;
    height: 34px;
    font-size: 16px;
  }

  .preview-now-cover-wrap .reggae-streams-badge {
    min-height: 18px;
    padding: 4px 2px;
    font-size: 5px;
    letter-spacing: .05em;
  }

  .music .song-preview-note {
    margin-top: 15px;
    margin-bottom: 10px;
    font-size: 9px;
  }
}

/* Slim mobile catalogue player: one information row and one control row. */
@media (max-width: 600px) {
  .music .preview-now-playing {
    grid-template-columns: 68px minmax(0, 1fr) auto auto !important;
    grid-template-areas:
      "cover copy count count"
      "controls controls time volume" !important;
    gap: 8px 9px !important;
    width: calc(100% - 28px) !important;
    margin-top: 10px !important;
    padding: 10px !important;
    border-radius: 16px !important;
  }

  .preview-now-cover-wrap {
    width: 68px;
  }

  .music .preview-now-copy strong { font-size: 18px; }
  .music .preview-now-copy strong.is-long { font-size: 16px; }
  .music .preview-now-copy strong.is-very-long { font-size: 14px; }

  .music .preview-now-controls {
    justify-content: flex-start;
    gap: 6px;
  }

  .music .preview-now-controls button {
    width: 28px;
    height: 28px;
    font-size: 11px;
  }

  .music .preview-now-controls .preview-now-toggle {
    width: 40px;
    height: 40px;
    font-size: 13px;
  }

  .music .preview-now-time {
    align-self: center;
    font-size: 11px;
    white-space: nowrap;
  }

  .music .preview-now-volume {
    align-self: center;
    width: 28px;
    height: 28px;
    font-size: 14px;
  }

  .music .song-preview-note {
    margin: 10px 0 7px;
    font-size: 8px;
    line-height: 1.2;
  }

  .music .preview-streaming-links {
    gap: 5px;
    padding: 0 14px 12px;
  }

  .music .preview-streaming-links a {
    min-height: 34px;
    padding: 6px 4px;
    font-size: 8px;
  }

  .music .preview-streaming-links .fa { font-size: 11px; }
}
@media (max-width: 600px) {
  .music .preview-now-playing {
    margin-top: 30px !important;
  }
}