/**
 * Retro Photos — "retro" variant
 *
 * Cream paper store wall; press shots are white polaroids taped to it (the same
 * tape + paper-mat language as the footer receipt and the framed players). The
 * polaroid frame is a warm white that lifts off the paper; the caption is
 * handwritten on the bottom strip; the download arrow is a brand-stamped corner
 * button revealed on hover.
 *
 * CONTRAST: captions/headings are ink on white/paper. The brand shows through the
 * heading's double-print shadow, the tape edges, and the download button's fill.
 * No body text on a raw --template fill — legible at any brand color.
 */

.retro-photos[data-variant="retro"] {
  --r-paper:  #f3ecdb;
  --r-ink:    #2a2018;
  --r-white:  #fcfaf3;
  --r-deep:   color-mix(in srgb, var(--template) 40%, #160f06);

  color: var(--r-ink);
  background-color: var(--r-paper);
  background-image: repeating-linear-gradient(90deg, rgba(0,0,0,0.012) 0 1px, transparent 1px 4px);
}

/* ───────────────────────────────────────────────────────── HEADER */

.retro-photos[data-variant="retro"] .retro-photos__kicker {
  color: var(--r-deep);
}

.retro-photos[data-variant="retro"] .retro-photos__title-h {
  color: var(--r-ink);
  text-shadow: 3px 3px 0 var(--template),
               4px 4px 0 var(--r-deep);
}

/* ──────────────────────────────────────────────────────── POLAROID */

/* the polaroid frame: warm white card, thick bottom border, soft drop shadow */
.retro-photos[data-variant="retro"] .retro-photos__content {
  background-color: var(--r-white);
  padding: 0.7rem 0.7rem 0;
  border: 1px solid color-mix(in srgb, var(--r-ink) 10%, transparent);
  box-shadow: 0 6px 14px rgba(20, 12, 4, 0.16);
  transition: box-shadow 0.32s ease;
}

.retro-photos[data-variant="retro"] .retro-photos__item:hover .retro-photos__content,
.retro-photos[data-variant="retro"] .retro-photos__item:focus-within .retro-photos__content {
  box-shadow: 0 16px 30px rgba(20, 12, 4, 0.28);
}

/* tape — translucent matte strip, same as the footer receipt */
.retro-photos[data-variant="retro"] .retro-photos__tape {
  background-color: rgba(255, 255, 255, 0.34);
  border-left: 1px solid rgba(255, 255, 255, 0.45);
  border-right: 1px solid rgba(255, 255, 255, 0.45);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
  backdrop-filter: saturate(1.1) brightness(1.04);
}

/* warm the photos toward the room's palette, like the hero posters */
.retro-photos[data-variant="retro"] .retro-photos__image {
  filter: sepia(0.16) saturate(1.04) contrast(1.02);
}

/* download arrow — paper stamp that fills brand on hover */
.retro-photos[data-variant="retro"] .retro-photos__download {
  background-color: var(--r-white);
  color: var(--r-ink);
  border: 2px solid var(--r-ink);
  box-shadow: 1px 2px 0 var(--r-deep);
}

.retro-photos[data-variant="retro"] .retro-photos__download:hover {
  background-color: var(--template);
  color: var(--on-template);
}

/* caption — handwritten ink on the white strip */
.retro-photos[data-variant="retro"] .retro-photos__caption {
  color: color-mix(in srgb, var(--r-ink) 82%, transparent);
  padding: 0.6rem 0.2rem 0.7rem;
}
