/* ============================================================
   Pro Tier — Rhythmus im CMS-Fließtext
   Mehr Abstand vor Kapitelüberschriften (h2), goldener Strich unter der h1.
   Kein Strich links vor der h2 (entfernt 24.09.2026).
   Farben ausschließlich über die IPS-Tokens in variables.css.
   ============================================================ */

.narrow > :not(h1) + h2,
main.narrow > article > :not(h1) + h2,
.cms-text > :not(h1) + h2,
.landingpage > :not(h1) + h2 {
  margin-block-start: var(--space-8);
}

.narrow > h1::after,
main.narrow > article > h1::after,
.cms-text > h1::after,
.landingpage > h1::after {
  content: "";
  display: block;

  width: 4.5rem;
  height: 0.125rem;
  margin-block: var(--space-3) 0;
  margin-inline: 0;
  background: var(--color-primary);
}

/* ─── Startseite: Einleitung (cms_content) zentriert ────────────────────
   H1 + Intro-Absatz mittig, auf Lesebreite begrenzt — wie die zentrierte
   Intro-Spalte der Legacy-Startseite. Nur #home; Unterseiten bleiben im
   linksbündigen Textfluss. */
#home > section.cms-text > article {
  max-width: 52rem;
  margin-inline: auto;
  text-align: center;
}

#home > section.cms-text h1::after {
  margin-inline: auto;
}

/* ─── Button im Fließtext ────────────────────────────────────────────────
   Folgt einem Button in derselben Zeile ein Link (z. B. „oder anrufen …“),
   braucht er Abstand — sonst kleben beide aneinander. */
main article p > .btn {
  margin-inline-end: var(--space-4);
  vertical-align: middle;   /* Buttons nebeneinander auf einer Höhe (Icon verschiebt sonst die Grundlinie) */
}

/* ─── Telefon-Button ─────────────────────────────────────────────────────
   Jeder Button mit tel:-Link bekommt ein Telefon-Icon (im CMS-Text kann kein
   Sprite-Icon per PHP gesetzt werden). Maske in currentColor → folgt der
   Schriftfarbe, auch beim Hover und bei .btn.ghost auf dunklem Grund.
   Nebenaktion neben einem .btn.primary: <a class="btn" href="tel:…">. */
a.btn[href^="tel:"]::before {
  content: "";
  flex-shrink: 0;
  inline-size: 1.15em;
  block-size: 1.15em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'><path d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'><path d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'/></svg>") center / contain no-repeat;
}