/* ============================================================
   Datei:        assets/css/shared/vorschau-platzhalter.css
   Seite:        Startseite, Detailseite
   Zweck:        Vorschaufläche eines Projekts: Bild oder ruhiges Farbfeld in der Kategoriefarbe,
                 solange es noch kein Bild gibt
   Abhängig von: assets/css/shared/variablen.css
   Genutzt von:  assets/js/shared/projekt-bausteine.js
   ============================================================ */

/* --- 1. Fläche (ohne Bild: weicher Verlauf mit Lichtfleck in der Kategoriefarbe) --- */
.vorschau {
  --kat-farbe: var(--akzent-1);
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background:
    radial-gradient(70% 90% at 80% 10%, color-mix(in srgb, var(--kat-farbe) 30%, transparent), transparent 70%),
    linear-gradient(160deg, var(--farbe-flaeche-hell), var(--farbe-flaeche));
}

/* --- 2. Echtes Vorschaubild --- */
.vorschau img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}