/* assets/raster.css – Raster der Website wie in der App: Seitenbreite, wachsender Seitenrand, Abstände, Radien.
   Werte = neu/assets/css/basis.css Abschnitt 1, bei Änderung angleichen (Absprache Design-System 2026-10-12).
   Seitenbereiche (Hero, Hintergründe) laufen randlos, ihr Inhalt steht in .w-innen; Fließtext und Formulare in .w-schmal. */
:root{
  --f-breite:1920px;--f-breite-schmal:900px;
  --f-seitenrand:clamp(16px,4vw,64px);
  --f-abstand-1:4px;--f-abstand-2:8px;--f-abstand-3:12px;--f-abstand-4:16px;--f-abstand-5:20px;--f-abstand-6:24px;--f-abstand-8:32px;--f-abstand-10:40px;
  --f-radius-klein:6px;--f-radius-knopf:8px;--f-radius-feld:10px;--f-radius:12px;--f-radius-gross:14px;--f-radius-rund:999px;
}
@media (min-width:1280px){:root{--f-seitenrand:clamp(64px,5vw,96px)}}
.w-innen{box-sizing:border-box;inline-size:100%;max-inline-size:var(--f-breite);margin-inline:auto;padding-inline:var(--f-seitenrand)}
.w-schmal{box-sizing:border-box;inline-size:100%;max-inline-size:min(var(--f-breite-schmal),72ch);margin-inline:auto}
.w-schmal.w-formular{max-inline-size:var(--f-breite-schmal)}

/* RTL: Richtungszeichen spiegeln (Pfeile „weiter“, Blättern, Brotkrumen). Inhalt, Logos und Zahlen bleiben. */
[dir="rtl"] .w-richtung{display:inline-block;transform:scaleX(-1)}
[dir="rtl"] .hy-bc li:not(:last-child)::after{content:"‹"}