/* ============================================================
   RANDORI-PRO · Polish Layer (additiv, lädt zuletzt)
   Schärft Typografie, Zustände & mobile Robustheit auf allen
   Seiten — ohne Layout-Struktur oder CI zu verändern.
   ============================================================ */

/* ── 1 · Rendering-Grundschärfe ─────────────────────────────── */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1;
}

/* Horizontales Ausbrechen einzelner Elemente kann das Layout
   auf Mobilgeräten "crashen" — global abriegeln. */
html, body { overflow-x: clip; }

/* Medien nie breiter als ihr Container */
img, video, svg, canvas { max-width: 100%; }
iframe { max-width: 100%; }
video { height: auto; }

/* ── 2 · Typografische Politur ──────────────────────────────── */
body { font-optical-sizing: auto; }
h1, h2, h3, .b-hero h1, .b-sec__title { text-wrap: balance; }
p, li, blockquote, figcaption { text-wrap: pretty; }

/* Textlinks: präzise, professionelle Unterstreichung */
p a[href]:not([class]), li a[href]:not([class]) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-decoration-color: color-mix(in oklab, currentColor 42%, transparent);
}
p a[href]:not([class]):hover, li a[href]:not([class]):hover {
  text-decoration-color: currentColor;
}

/* Anker-Sprünge landen nicht unter dem fixen Glas-Header */
[id] { scroll-margin-top: 96px; }

/* Lange deutsche Komposita (Selbstverteidigung, Frühförderung …)
   dürfen auf schmalen Screens nie aus dem Viewport ragen. */
@media (max-width: 560px) {
  /* Kleine Überschriften (FAQ-Fragen etc.) dürfen an Silbengrenzen trennen */
  h3, h4 {
    overflow-wrap: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    hyphenate-limit-chars: 10 5 4;
  }
  /* Große Display-Headlines nie trennen (z. B. „persönli-chen", „auszupro-bieren") */
  h1, h2 {
    overflow-wrap: break-word;
    hyphens: none;
    -webkit-hyphens: none;
  }
}

/* Ziffern in Zahlen/Statistiken gleichbreit — ruhigeres Bild */
[class*="stat"], [class*="kennzahl"], [class*="count"], time, .b-num {
  font-variant-numeric: tabular-nums lining-nums;
}

/* ── 3 · Interaktions-Zustände ──────────────────────────────── */
:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--rp-rot-akzent);
  outline-offset: 3px;
  border-radius: 2px;
}

a, button, summary, [role="button"] {
  -webkit-tap-highlight-color: rgba(220, 13, 29, 0.12);
  touch-action: manipulation;
}

/* Buttons: definierter Druckpunkt */
.btn-primary:active, .b-btn:active, .sticky-cta:active, .nav .nav-cta:active {
  transform: translateY(1px) scale(0.99);
  transition-duration: 60ms;
}

/* ── 4 · Mobile Härtung ─────────────────────────────────────── */
@media (max-width: 720px) {
  /* Mindest-Touchziele */
  .nav-toggle { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }

  /* Sticky-CTA respektiert die iPhone-Home-Indicator-Zone */
  .sticky-cta {
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }
  .s-sticky a {
    padding-bottom: max(20px, env(safe-area-inset-bottom)) !important;
  }

  /* Fixe Header respektieren die Notch/Dynamic Island */
  .site-header, .b-header {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  /* Karten & Grids: Inhalte dürfen ihre Zelle nie sprengen */
  [class*="grid"] > *, [class*="row"] > *, [class*="cards"] > * {
    min-width: 0;
  }
}

/* Sehr schmale Geräte (320–360px): Displaygrößen sanft eindampfen */
@media (max-width: 360px) {
  :root {
    --fs-display-l: 42px;
    --fs-display-m: 32px;
    --fs-display-s: 24px;
    --fs-pull: 26px;
  }
}

/* ── 5 · Ruhe & Zugänglichkeit ──────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

::selection { background: var(--rp-rot-akzent); color: #fff; }

/* Schlanke, markenfarbene Scrollbar (nur Haupt-Scrollleiste) */
@media (pointer: fine) {
  html { scrollbar-width: thin; scrollbar-color: rgba(109, 23, 35, 0.35) transparent; }
}

/* Bild-Platzhalter: gleichmäßige, ruhige Optik überall */
[class*="-ph"] { user-select: none; }