/* Sichtbare KI-Kennzeichnung (Fix-Lauf 1, PL-001).
 *
 * Zwei Formen, beide aus inc/ai-disclosure.php:
 *   .ibmh-ai-badge — Overlay in Karten- und Teaserflaechen, wo unter dem Bild kein Platz ist.
 *   .ibmh-ai-note  — Bildunterschrift unter dem Projekt-Hero.
 *
 * Die Karten-Medienflaechen sind im Raster auf `aspect-ratio` mit `overflow: hidden` gebaut
 * und tragen selbst keine Positionierung. Deshalb setzt diese Datei `position: relative`
 * auf genau diese drei Flaechen — sie haben keine absolut positionierten Kinder, die das
 * stoeren koennte.
 */

.ibmh-project-card__media,
.ibmh-projekt-weitere__bild {
  position: relative;
}

.ibmh-ai-badge {
  position: absolute;
  left: 0.5rem;
  bottom: 0.5rem;
  z-index: 1;
  max-width: calc(100% - 1rem);
  padding: 0.25em 0.6em;
  border-radius: 999px;
  background: rgba(12, 22, 40, 0.78);
  color: #ffffff;
  /* 13px. Die Kennzeichnung erfuellt eine Transparenzpflicht — sie muss im Vorbeiscrollen
   * lesbar sein, nicht nur auffindbar. Unter 12px war sie das nicht (QA-09). */
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;
  text-transform: none;
  text-decoration: none;
  text-align: left;
  /* Bewusst KEIN white-space: nowrap mit text-overflow: ellipsis. Auf der schmalsten
   * Medienflaeche (218px, "Ausgewaehlte Projekte" bei 768px) haette die groessere Schrift
   * sonst zu "KI-Visualisierung · Symb…" gekuerzt. Eine abgeschnittene Offenlegung ist
   * keine Offenlegung; zwei Zeilen sind das kleinere Uebel. */
  overflow-wrap: break-word;
  /* Auf dem Bild reicht die Deckfarbe allein nicht immer: ein sehr helles Motiv laesst die
   * Pille verschwimmen, ein sehr dunkles laesst sie mit dem Bild verschmelzen. */
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

@supports (backdrop-filter: blur(4px)) {
  .ibmh-ai-badge {
    background: rgba(12, 22, 40, 0.62);
    backdrop-filter: blur(4px);
  }
}

/* Auf schmalen Viewports steht die Karte einspaltig und ist damit BREITER als im Raster —
 * die Pille braucht hier keine kleinere Schrift, nur einen etwas knapperen Abstand zur Ecke.
 * (Die frueheren 0.64rem = 10.2px waren ausgerechnet dort am kleinsten, wo am meisten Platz
 * ist. Das war verkehrt herum, QA-09.) */
@media (max-width: 480px) {
  .ibmh-ai-badge {
    left: 0.4rem;
    bottom: 0.4rem;
  }
}

/* Bildunterschrift am Projekt-Hero. Bewusst keine Overlay-Pille: im Hero ist Platz, und eine
 * Unterschrift unter dem Bild ist die klarere Offenlegung. */
.ibmh-ai-note {
  display: block;
  margin: 0.5rem 0 0;
  /* 14px, dieselbe Leseschwelle wie die Pille (QA-09). */
  font-size: 0.875rem;
  line-height: 1.45;
  /* Kontrast auf der ECHTEN Seitenflaeche gemessen, nicht auf angenommenem Weiss: Der Hero
   * steht auf dem hellblauen Seitenverlauf (gemessen rgb(224,230,239)), dort 5,04:1 — AA fuer
   * Fliesstext erfuellt. Gegen reines Weiss waeren es 6,36:1; diese Zahl waere geschoent. */
  color: #51607a;
  text-align: left;
}

.ibmh-ai-note::before {
  content: "";
  display: inline-block;
  width: 0.42em;
  height: 0.42em;
  margin-right: 0.5em;
  vertical-align: 0.08em;
  border-radius: 50%;
  background: #1f63c4;
}

@media (forced-colors: active) {
  .ibmh-ai-badge {
    background: Canvas;
    color: CanvasText;
    border: 1px solid CanvasText;
    box-shadow: none;
  }

  .ibmh-ai-note::before {
    background: CanvasText;
  }
}

/* PL-006 (21.09.2026): Die Uebergangsregel zum Seitenverhaeltnis ist entfallen. Seit der
 * Kundenentscheidung laeuft wieder gruppe-03 (1536x864), das exakt zu den width/height-
 * Attributen im Markup passt -- eine Korrektur des Seitenverhaeltnisses ist nicht mehr noetig.
 * Die Kennzeichnung des Bildes uebernimmt .ibmh-ai-note unterhalb der Abbildung. */
.ibmh-team-preview__group {
  margin: 0;
}


/* -------------------------------------------------------------------------
 * PL-049 (P2) — Fokus unter dem fixierten Header (WCAG 2.4.11)
 *
 * Hierher verlegt am 21.09.2026 (Fix-Lauf 2). Der Regelsatz stand in
 * ibmh-components.css und wirkte deshalb auf sechs Seiten nicht, die diese
 * Datei nicht laden. ibmh-ai-disclosure.css wird als einzige Datei
 * bedingungslos ausgeliefert und ist damit der richtige Ort fuer eine Regel,
 * die jede Seite braucht. Fachlich gehoert sie nicht zur KI-Kennzeichnung —
 * beim naechsten Theme-Zugriff gehoert sie in die globale Theme-CSS.
 *
 * Die zweite Regel ist zwingend: scroll-padding des Containers und
 * scroll-margin des Ziels addieren sich, sonst springen alle Anker zu tief.
 * Gemessen (U-frontend, 21.09.): verdeckte Shift-Tab-Stopps auf den sechs
 * Seiten 2/1/2/5/2/5/2/2/3 -> jeweils 0, Kontrollseiten unveraendert,
 * 50 Ankersprünge vorher gleich nachher.
 * ------------------------------------------------------------------------- */
html {
  scroll-padding-top: calc(var(--ibmh-header-clear, 4rem) + 1rem);
}
html [id] {
  scroll-margin-top: 0;
}