/* Load after BOTH talent.css and talent-site.css, on David's page first.
   Add data-tda-visual-v6 to the existing .tda-talent element.
   This is a focused add-on, not a replacement stylesheet. */
.tda-talent[data-tda-visual-v6] {
  --tda-v6-stage-art: url('assets/backstage-david-tall-4096.webp');
  background-image: var(--tda-v6-stage-art);
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  --tda-v6-rail: 16px;
}

/* Equal horizontal/vertical image scale is calculated in the companion script.
   The image position follows page progress; objects never stretch with content. */
.tda-talent[data-tda-visual-v6].tda-v6-art-ready {
  background-size: var(--tda-v6-art-width) var(--tda-v6-art-height);
  background-position: center var(--tda-v6-art-y, 0px);
}

.tda-talent[data-tda-visual-v6] .tda-case {
  background-color: #09090b;
  background-image:
    radial-gradient(ellipse at 0 15%, #ff007a08, transparent 55%),
    linear-gradient(112deg, #ffffff06, transparent 36%, #00000024);
  box-shadow: 0 12px 22px #0009, inset 0 1px 0 #ffffff14;
}

/* Preserve the four photographic rail images installed in talent-site.css.
   Increase their displayed thickness without changing the case width. */
.tda-talent[data-tda-visual-v6] .tda-case::before {
  background-size:
    auto var(--tda-v6-rail), auto var(--tda-v6-rail),
    var(--tda-v6-rail) auto, var(--tda-v6-rail) auto;
}
.tda-talent[data-tda-visual-v6] .tda-corner { width: 52px; height: 52px; }

.tda-talent[data-tda-visual-v6] .tda-hero-portrait.tda-hero-cutout {
  filter: drop-shadow(-3px 0 4px #ff007a29) drop-shadow(12px 20px 24px #0009);
}
.tda-talent[data-tda-visual-v6] .tda-header::after {
  box-shadow: 0 1px 4px #ff007a59;
}

/* Portrait photographs remain uncropped; some side letterboxing is intentional.
   The earlier 50vw/clamp height added unnecessary top/bottom bars to wide stills. */
.tda-talent[data-tda-visual-v6] .tda-gallery-stage {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
}
.tda-talent[data-tda-visual-v6] .tda-gallery-stage figure > img {
  width: 100%; height: 100%; object-fit: contain;
}

@media (max-width: 760px) {
  .tda-talent[data-tda-visual-v6] {
    --tda-v6-rail: 11px;
    --tda-v6-stage-art: url('assets/backstage-david-tall-mobile.webp');
  }
  .tda-talent[data-tda-visual-v6] .tda-corner { width: 40px; height: 40px; }
  .tda-talent[data-tda-visual-v6] .tda-gallery-stage { aspect-ratio: 4 / 3; }
}

/* Reduced-motion mode uses one static proportionate plate, then the stage color.
   No moving background, repetition or non-uniform image stretching. */
@media (prefers-reduced-motion: reduce) {
  .tda-talent[data-tda-visual-v6] {
    background-size: 100% auto !important;
    background-position: center top !important;
  }
}
