/* ============================================================
   AOB UI-Auflockerung — Wave 1 (2026-06-28)
   NUR Darstellung/Abstände. Keine Inhalte/Preise/Varianten.
   Additiv, zuletzt geladen. Rollback: <link> in header.php entfernen.
   ============================================================ */

/* 1) Horizontaler Scroll-Guard (100vw-/Scrollbar-Überhang) —
   'clip' statt 'hidden': bricht position:sticky NICHT. */
html, body { overflow-x: clip; max-width: 100%; }

/* 2) Preisseite: mehr Luft zwischen den Behandlungsblöcken,
   dezente Trennlinie statt gedrängter Block-Wand. */
.pbt-sec { margin: 2.6rem 0 1.5rem; }
.pbt-sec + .pbt-sec { padding-top: 2.1rem; border-top: 1px solid rgba(70,112,116,.10); }
.pbt-acc-wrap { padding-bottom: .4rem; }

/* 3) Behandlungsgruppen-Überschrift etwas mehr Atmung. */
.pbt-sec__head { margin-bottom: .5rem; }

/* 4) Karten-CTA-Zeile: Button-Abstand minimal großzügiger (klarere Trennung). */
.pbt-card__cta { gap: .5rem; }

/* ============================================================
   Wave 2 (2026-06-28): Detailseiten Bild/Text-ALTERNATION
   ------------------------------------------------------------
   Bug: site.css setzt `.split.split-reverse > :first-child { order: 2 }`.
   Die Reverse-Blöcke haben im Markup aber TEXT als erstes Kind
   (split-text zuerst, split-image danach). order:2 schiebt den Text
   wieder nach rechts → Bild landet links → alle Blöcke wirken gleich
   (Bild|Text unter Bild|Text). Es gibt KEINE echte Alternation.
   Fix: order neutralisieren → die Markup-Reihenfolge entscheidet:
     normal  .split          = Bild | Text   (image-first markup)
     reverse .split-reverse  = Text | Bild   (text-first markup)
   Nur Layout-Position — Bildinhalt/Texte/Preise bleiben unangetastet.
   ============================================================ */
.split.split-reverse > :first-child { order: 0; }   /* Desktop: Text links | Bild rechts */

@media (max-width: 940px){
  /* Mobil 1-spaltig: IMMER zuerst Bild, dann Text — egal ob normal/reverse,
     damit nicht Text-unter-Text bzw. Bild-unter-Bild gestapelt wird. */
  .split.split-reverse .split-image { order: 0; }
  .split.split-reverse .split-text  { order: 1; }
}

/* ============================================================
   Wave 3 (2026-06-28): Karten-FAMILIE sitewide an Master (/preise) angleichen
   ------------------------------------------------------------
   Reine Optik (Rundung/Schatten/Border/Hover) wie .pbt-card — damit alle
   Karten überall zur Preis-Kategorie passen. KEINE Inhalte/Preise/Logik.
   (Die vollen Varianten/Kur-Tab-Karten selbst werden in Welle B per
   gemeinsamem Bauteil auf die Detailseiten eingebettet — separat, mit Pilot.)
   ============================================================ */
:root{ --aob-card-radius:12px; --aob-card-border:#ecefed; --aob-card-shadow:0 1px 3px rgba(0,0,0,.04); --aob-card-shadow-hover:0 6px 18px rgba(0,0,0,.07); }

/* Ablauf-„step-cards" auf den Detailseiten → gleiche Karten-Optik wie Master */
.steps-grid .step-card{
  border:1px solid var(--aob-card-border);
  border-radius:var(--aob-card-radius);
  box-shadow:var(--aob-card-shadow);
  transition:box-shadow .2s, border-color .2s, transform .12s;
}
.steps-grid .step-card:hover{
  box-shadow:var(--aob-card-shadow-hover);
  border-color:var(--gold,#dabe92);
  transform:translateY(-2px);
}

/* Behandlungs-Teaser (b-card, /behandlungen) → konsistente Rundung mit Master */
.b-card{ border-radius:var(--aob-card-radius); }

/* Duo-Preis-Tabelle → als gerahmte Karte statt nackter Tabelle */
.price-table{
  border:1px solid var(--aob-card-border);
  border-radius:var(--aob-card-radius);
  box-shadow:var(--aob-card-shadow);
  overflow:hidden;
}
.price-table td{ padding:.85rem 1.1rem; }

/* ============================================================
   Welle 8 (2026-06-28): Hautberater — fehlende Pflichtfrage sichtbar machen.
   Bisher tat "Weiter" bei unbeantworteter Pflichtfrage scheinbar nichts
   ("hängt"). Jetzt scrollt der Berater zur fehlenden Frage + markiert sie.
   ============================================================ */
.aob-advisor-missing{
  border-radius:10px;
  outline:2px solid #d98b2b;
  outline-offset:4px;
  box-shadow:0 0 0 4px rgba(217,139,43,.16);
  animation:aobMissingPulse 1.1s ease-in-out 2;
}
@keyframes aobMissingPulse{
  0%,100%{ box-shadow:0 0 0 4px rgba(217,139,43,.16); }
  50%{ box-shadow:0 0 0 7px rgba(217,139,43,.30); }
}