/* Gueltigkeits-Banner · 16.10.2026 (Andreas: "ab sofort drei Jahre gueltig — ganz gross und prominent").
   Eingebunden auf /preise und der Startseite. Zahl und Text kommen aus dem System (%%AAI_GUELTIG:dauer%%,
   %%AAI_GUELTIG:preisnote%%), nie fest im Text. Steht nur bei per_tranche=true (Block rolling/sonst/ende),
   sonst und ohne Systemwert bleibt die bisherige Zeile. */
.aai-gueltig {
  display: flex; align-items: center; gap: 24px;
  width: 100%; max-width: 56rem; box-sizing: border-box;
  margin: 24px auto 32px; padding: 24px 32px;
  border-radius: 16px; border: 1px solid rgba(16, 185, 148, .35);
  background: linear-gradient(135deg, #f2fffb 0%, #eef8fd 62%, #ffffff 100%);
  box-shadow: 0 12px 32px rgba(10, 77, 124, .08);
  text-align: left;
  transition: transform .2s ease, box-shadow .2s ease;
}
.aai-gueltig:hover { transform: translateY(-1px); box-shadow: 0 16px 40px rgba(10, 77, 124, .11); }
.aai-gueltig__icon {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  width: 88px; height: 88px; border-radius: 50%; color: #fff;
  background: linear-gradient(135deg, #3fe0b0 0%, #0891c2 100%);
  box-shadow: 0 8px 24px rgba(8, 145, 194, .25);
}
.aai-gueltig__icon svg { width: 40px; height: 40px; }
.aai-gueltig__body { min-width: 0; }
/* p mit hoher Spezifitaet: die verschachtelte Regel `& p { margin-bottom: 1rem; padding-right: 1rem }`
   aus style.css laedt nach diesem Block. */
/* (0,3,1): schlaegt `.modul.aai-pt p { padding-right: 0 }` auf /preise (schnitt die Pille rechts ab). */
.aai-gueltig .aai-gueltig__body p.aai-gueltig__neu {
  display: inline-block; margin: 0 0 8px; padding: 2px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  color: #0b6b52; border: 1px solid rgba(63, 224, 176, .5);
  background: linear-gradient(180deg, #f2fffb, #e4fbf4);
}
.aai-gueltig p.aai-gueltig__titel {
  margin: 0 0 8px; padding: 0;
  font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 300; line-height: 1.25; color: #0a4d7c;
}
.aai-gueltig p.aai-gueltig__titel strong { font-weight: 600; color: #0891c2; white-space: nowrap; }
.aai-gueltig p.aai-gueltig__text {
  margin: 0; padding: 0; max-width: 60ch;
  font-size: .95rem; font-weight: 300; line-height: 1.6; color: #3d5a6c;
}
@media (max-width: 640px) {
  .aai-gueltig { flex-direction: column; text-align: center; gap: 16px; padding: 24px 16px; margin: 16px auto 24px; }
  .aai-gueltig__icon { width: 64px; height: 64px; }
  .aai-gueltig__icon svg { width: 30px; height: 30px; }
  .aai-gueltig p.aai-gueltig__text { margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .aai-gueltig { transition: none; }
  .aai-gueltig:hover { transform: none; }
}