/* ===========================================================================
   Amorazza - Pressebereich (V605)
   ---------------------------------------------------------------------------
   Sachlich, ohne Werbeton. Wer hier landet, sucht Material - keine
   Ueberzeugung.
   Alle Farben mit RUECKFALLWERT: fehlt tokens.css, waere die Regel sonst
   ungueltig und Text wie Rahmen verschwaenden.
   =========================================================================== */

.presse {
  max-width: 760px;
  margin: 0 auto;
  padding: 24px 16px 64px;
}

.presse h1 { margin: 0 0 10px; }

.presse-lead {
  font-size: var(--fs-strong, 1.05rem);
  color: var(--text, #6b5560);
  margin: 0 0 30px;
}

.presse-block { margin: 0 0 38px; }
.presse-block h2 {
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--rose-200, #f4c0d1);
  font-size: var(--fs-title, 1.4rem);
}

.presse-hinweis,
.presse-leer {
  font-size: var(--fs-meta, .9rem);
  color: var(--ink-500, #666);
  margin: 0 0 14px;
}

/* --- Unterlagen ---------------------------------------------------------- */

.presse-liste { list-style: none; padding: 0; margin: 0; }

.presse-liste li + li { margin-top: 8px; }

.presse-liste a {
  display: flex;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  padding: 12px 16px;
  background: rgba(212, 83, 126, .05);
  border: 2px solid var(--rose-400, #d4537e);
  border-radius: var(--r-lg, 14px);
  text-decoration: none;
  color: var(--rose-600, #993556);
  transition: background .2s, border-color .2s;
}
.presse-liste a:hover,
.presse-liste a:focus-visible {
  background: rgba(212, 83, 126, .10);
  border-color: var(--rose-600, #993556);
}

/* Das Kuerzel der Dateiart. Feste Breite, damit die Titel untereinander
   auf einer Linie beginnen. */
.presse-endung {
  flex: 0 0 auto;
  min-width: 52px;
  padding: 3px 8px;
  background: var(--rose-600, #993556);
  color: #fff;
  border-radius: 5px;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-align: center;
}

.presse-titel { flex: 1 1 auto; font-weight: 600; }

.presse-meta {
  flex: 0 0 auto;
  font-size: var(--fs-meta, .85rem);
  font-weight: 400;
  color: var(--ink-500, #666);
  white-space: nowrap;
}

/* --- Bildmaterial -------------------------------------------------------- */

.presse-bilder {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 18px;
}

.presse-bilder figure { margin: 0; }

.presse-bilder a {
  display: block;
  border: 2px solid var(--rose-200, #f4c0d1);
  border-radius: var(--r-lg, 14px);
  overflow: hidden;
  transition: border-color .2s;
}
.presse-bilder a:hover,
.presse-bilder a:focus-visible { border-color: var(--rose-400, #d4537e); }

.presse-bilder img {
  display: block;
  width: 100%;
  height: 160px;
  object-fit: cover;
}

.presse-bilder figcaption {
  margin-top: 6px;
  font-size: var(--fs-meta, .9rem);
  line-height: 1.4;
}
.presse-bilder figcaption .presse-meta { display: block; }

/* --- Ansprechpartner ------------------------------------------------------ */

.presse-kontakt p { line-height: 1.7; }
.presse-kontakt a { color: var(--rose-600, #993556); }

@media (max-width: 520px) {
  /* Auf schmalen Schirmen bricht die Zeile - dann soll das Kuerzel oben
     stehen und der Titel darunter, statt drei Dinge nebeneinander zu
     quetschen. */
  .presse-liste a { flex-wrap: wrap; gap: 6px 10px; }
  .presse-titel { flex: 1 1 100%; order: 2; }
  .presse-meta  { order: 3; }
}
