/* ============================================================
   fluid/index.css — GENERIERT von scripts/build_fluid.py
   Nicht direkt bearbeiten. Quellen: reset.css
   ============================================================ */

/* ---------- reset.css ---------- */
/* ============================================================
   fluid/reset.css — Robustheits-Schicht
   Teil des wiederverwendbaren /fluid-Pakets. Enthaelt KEINE
   projektspezifischen Farben oder Schriften.

   Alles steht in @layer reset. Ungeschichtetes CSS gewinnt in der
   Kaskade immer gegen geschichtetes — das bestehende styles.css
   bleibt damit unangetastet und das Design kann sich nicht
   versehentlich verschieben.
   ============================================================ */

@layer reset, tokens, base, layout, components, utilities, overrides;

@layer reset {

  *, *::before, *::after { box-sizing: border-box; }

  html {
    /* iOS dreht Schriften im Querformat sonst eigenmaechtig hoch */
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* Platz fuer die Scrollbar immer reservieren: kein Springen,
       wenn eine Seite laenger wird als der Viewport */
    scrollbar-gutter: stable;
  }

  /* clip statt hidden: hidden macht den Container zum Scroll-Port und
     bricht damit jedes position:sticky weiter innen. */
  html, body { overflow-x: clip; }

  /* Medien nie breiter als ihr Container.
     Bewusst OHNE svg: Inline-Icons stehen im Textfluss, ein
     display:block wuerde ihre vertikale Ausrichtung sichtbar
     verschieben — und das Design soll unveraendert bleiben. */
  img, picture, video, canvas, iframe {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
  }
  svg { max-inline-size: 100%; }

  /* Lange Komposita, URLs und Mailadressen duerfen brechen.
     break-word statt anywhere: anywhere trennt auch dort, wo noch
     Platz waere, und macht den Flattersatz unruhig. */
  p, li, dd, dt, td, th, figcaption, blockquote, summary,
  h1, h2, h3, h4, h5, h6, .lead {
    overflow-wrap: break-word;
  }

  /* Silbentrennung nur im Fliesstext. Setzt lang="de" voraus — ist
     auf allen Seiten gesetzt. */
  p, li, dd, blockquote { hyphens: auto; }

  table { inline-size: 100%; border-collapse: collapse; }

  /* Sichtbarer Fokus nur fuer Tastaturnutzung */
  :focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
  }

  /* Ankerziele nicht unter der fixierten Kopfleiste verstecken */
  :target { scroll-margin-block-start: 6rem; }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: .01ms !important;
      scroll-behavior: auto !important;
    }
  }

  /* Keine Glas-/Blur-Effekte, wenn der Nutzer sie abbestellt hat */
  @media (prefers-reduced-transparency: reduce) {
    .site-nav, .rm-consent { backdrop-filter: none; -webkit-backdrop-filter: none; }
  }

  /* Hoher Kontrast: Raender statt Schatten */
  @media (prefers-contrast: more) {
    .card, .rm-contact-panel, .rm-consent { box-shadow: none; border: 1px solid currentColor; }
  }

  /* Windows-Kontrastmodus: Systemfarben respektieren */
  @media (forced-colors: active) {
    .card, .rm-consent, .rm-contact-panel { border: 1px solid CanvasText; box-shadow: none; }
    .btn { border: 1px solid ButtonText; }
  }

  @media print {
    .site-nav, .sticky-cta, .rm-consent, .rm-contact,
    .read-progress, .nav-mobile, footer nav { display: none !important; }
    a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; word-break: break-all; }
    * { background: transparent !important; box-shadow: none !important; }
  }
}
