/* ==========================================================================
   Baustein: Stub-Kasten, nur während des Rebuilds
   Datei: css/bausteine/_stub.css
   Gebraucht auf: index.html, solange Sektionen als Stub stehen; work-zone.html, solange
   Bilder fehlen (Platzhalter für Bild, Tafel und Logos)
   Bauvorschrift: DESIGN.md, kein Baustein. Diese Datei und ihr <link> fallen weg, sobald der letzte Stub ersetzt ist
   Regeln: docs/entwicklung.md. Klassen-Präfix dieser Datei siehe unten,
   Tokens und Rollen kommen aus css/style.css und werden hier nicht neu definiert.
   ========================================================================== */

/* Präfix: .stub- (.stub-note für eine ganze Sektion, .stub-bild für ein fehlendes Bild) */
.stub-note {
  margin-top: 72px;
  padding: 28px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-md);
  color: var(--body);
  max-width: 720px;
}
.stub-note strong { color: var(--ink); font-weight: 700; }

/* Platzhalter für ein Bild, das noch geliefert wird (2026-09-29, work-zone.html).
   Steht dort, wo das Bild stehen wird, und trägt dessen Platzhalter-Namen in eckigen
   Klammern nach CLAUDE.md, darunter eine Zeile, welches Bild gemeint ist. Fläche Weiß mit
   gestricheltem Rahmen in --line-strong (3.06 auf --paper, 3.12 auf Weiß), damit er auf
   Hell, auf Weiß und auf dem Milchglas der Prozess-Sektion gleich lesbar bleibt. Text in
   --muted (5.21 auf Weiß).
   flex und die Streckung im Raster füllen den Platz, den der Baustein dem Bild gibt. */
.stub-bild {
  flex: 1 1 auto;
  display: grid; place-content: center; gap: 8px;
  min-height: 120px;
  padding: 24px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-xl);
  background: var(--white);
  color: var(--muted);
  text-align: center;
  overflow-wrap: anywhere;
}
/* Seitenverhältnis der Tafeln in der Prozess-Sektion (process-tab-*.avif, 1106 x 974), damit
   die Illustration mit Platzhaltern so hoch steht wie später mit den Screenshots. */
.stub-bild--tafel { aspect-ratio: 1106 / 974; }

@media (max-width: 640px) {
  .stub-note { margin-top: 48px; padding: 20px; }
  .stub-bild { padding: 18px; }
}