/*
 * Film archive list — SD-92
 * Filter bar + one section per competition year, films as a 4-column
 * card-film grid (SD-77). Module-level layout only; Figma 8291-4882.
 */

.dk-film-archive {
  padding-block: var(--dk-space-section-m);
  padding-inline: var(--dk-space-page-inline);
  background-color: var(--dk-color-white);
}

.dk-film-archive__inner {
  margin: 0 auto;
  max-inline-size: 88.75rem; /* 1420px — Figma L inner */
}

/* Ueberschrift der Eingrenzung — „Rebellen", „Suche nach: …" (Figma
   8291-4882). Steht an derselben Stelle wie sonst die Jahrgangs-Ueberschrift,
   deshalb dieselben Abstaende. */
.dk-film-archive__heading {
  margin-block: var(--dk-space-09) var(--dk-space-06);
}

.dk-film-archive__status {
  margin: var(--dk-space-06) 0 0;
}

/* Die Trefferzahl ist nur fuer Screenreader da (der Fokus springt nach dem
   Abschicken auf den Ergebnisbereich); der Entwurf zeigt ueber dem Raster
   allein die Ueberschrift. Leermeldungen bleiben sichtbar. */
.dk-film-archive__status--sr {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Sprungziel nach dem Filtern — programmatisch fokussiert, deshalb ohne
   sichtbaren Ring (der Fokus wandert sofort weiter zum ersten Link). */
.dk-film-archive__results:focus {
  outline: none;
}

/* --- Head (only on the raw /filme list) --------------------------------- */

.dk-film-archive__head {
  display: flex;
  flex-wrap: wrap;
  gap: var(--dk-space-04);
  align-items: baseline;
  justify-content: space-between;
  margin-block-end: var(--dk-space-06);
}

.dk-film-archive__title,
.dk-film-archive__count,
.dk-film-archive__intro {
  margin: 0;
}

.dk-film-archive__intro {
  margin-block-end: var(--dk-space-08);
  max-inline-size: 44rem;
}

.dk-film-archive .pagination {
  margin-block-start: var(--dk-space-09);
}

/* --- Year section ------------------------------------------------------- */

.dk-film-archive__year + .dk-film-archive__year {
  margin-block-start: var(--dk-space-section-s);
}

/* Kein eigenes Jahres-Badge: die gruene Zahl rechts unten ist das globale
   Brandelement aus components/logo (.logo-year, site.ausgabe) und gehoert
   nicht in dieses Modul. */
.dk-film-archive__year-title {
  margin-block: var(--dk-space-09) var(--dk-space-06);
}

/* --- Card grid ---------------------------------------------------------- */

.dk-film-archive__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: var(--dk-space-06);
  row-gap: var(--dk-space-08);
}

.dk-film-archive__item {
  min-inline-size: 0;
}

/* M — three columns (iPad landscape, 1024–1279px) */
@media (max-width: 79.9375rem) {
  .dk-film-archive__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* S — single column from 1023px down */
@media (max-width: 63.9375rem) {
  .dk-film-archive__grid {
    grid-template-columns: 1fr;
  }
}