/* =====================================================================
   MBWC – KI-Bildkennzeichnung (EU AI Act, Art. 50 – ab 02.08.2026)

   Rechtssicher & dezent:
   - DAUERHAFT sichtbares, kleines „KI"-Chip in der Bildecke = die klare
     Kennzeichnung „bei erster Wahrnehmung" (Art. 50(4)). Kein reines „(i)".
   - Details (kurzer Satz + „Details im Impressum") erst beim KLICK auf das
     Chip – KEIN Aufpoppen mehr beim bloßen Überfahren des Bildes.
   - Volltext im Impressum („Bildnachweise & KI-Hinweis").

   CI: Glas/Gold, Radius, weiche Schatten. Schrift erbt (Open Sans).
   ===================================================================== */

.ki-fig:not(.ki-host){position:relative; display:block; width:-moz-fit-content; width:fit-content; max-width:100%;}
.ki-fig:not(.ki-host) > img{display:block; max-width:100%; height:auto;}

/* Das Chip: klein, dauerhaft sichtbar, gut lesbar (Glas, dunkler Text) */
.ki-badge{
  position:absolute; right:9px; bottom:9px; z-index:20;
  display:inline-flex; align-items:center; gap:4px;
  height:21px; padding:0 7px; margin:0;
  border-radius:999px; cursor:pointer;
  font-family:"Open Sans", system-ui, -apple-system, sans-serif;
  font-weight:700; font-size:10.5px; line-height:1; letter-spacing:.04em;
  color:#3a2d10;
  background:rgba(255,253,249,.82);
  border:1px solid rgba(124,82,0,.28);
  -webkit-backdrop-filter:blur(7px) saturate(140%);
  backdrop-filter:blur(7px) saturate(140%);
  box-shadow:0 2px 8px rgba(32,27,20,.20);
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease;
}
.ki-badge__k{font-weight:800;}
.ki-badge svg{width:11px; height:11px; display:block; opacity:.75; pointer-events:none;}
.ki-badge:hover{background:rgba(255,255,255,.94); box-shadow:0 4px 12px rgba(32,27,20,.26);}
.ki-badge:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(122,95,34,.55), 0 4px 12px rgba(32,27,20,.26);
}

/* Pop-over (kompakt) – nur bei .is-open sichtbar */
.ki-pop{
  position:absolute; right:6px; bottom:40px; z-index:21;
  width:min(230px, calc(100vw - 40px));
  background:#fffdf9; color:#33312b;
  border:1px solid #e7ddcc; border-radius:12px;
  padding:.62rem .74rem;
  box-shadow:0 12px 30px rgba(32,27,20,.22);
  font-size:.78rem; line-height:1.48; text-align:left;
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateY(5px) scale(.97); transform-origin:bottom right;
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.ki-fig.is-open .ki-pop{opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1);}
.ki-pop__title{display:block; font-weight:700; color:#7c5200; margin:0 0 .22rem; font-size:.8rem;}
.ki-pop__text{display:block; margin:0;}
.ki-pop__more{color:#7c5200; font-weight:700; text-decoration:underline; text-underline-offset:2px; white-space:nowrap;}
.ki-pop__more:hover,.ki-pop__more:focus-visible{color:#33312b;}

.ki-pop::after{
  content:""; position:absolute; right:13px; bottom:-7px;
  width:12px; height:12px; background:#fffdf9;
  border-right:1px solid #e7ddcc; border-bottom:1px solid #e7ddcc;
  transform:rotate(45deg);
}

@media (max-width:560px){ .ki-pop{right:0;} }
@media (prefers-reduced-motion:reduce){ .ki-badge, .ki-pop{transition:none;} }
