/* Rentique Weiß — Kontakt- und Anfrageseite.
   ————————————————————————————————————————————————————————————————————————
   Wird nur auf /kontakt.html geladen (Frontmatter "css: kontakt"). Hier steht
   ausschließlich das, wofür es im Design-System und in site.css keine Klasse
   gibt — drei Kleinigkeiten. Nur Token, keine festen Farben oder Abstände.
   ———————————————————————————————————————————————————————————————————————— */

/* ——— 0 · hidden muss hidden bleiben ———
   Das Design-System setzt .rw-notice und .rw-field__error auf display:flex.
   Eine Autorenregel schlägt immer die Regel des Browsers — und dessen
   [hidden]{display:none} ist genau so eine. Ohne die beiden Zeilen hier stehen
   alle Fehlerkästen und alle Rückmeldungen dieser Seite sichtbar da, obwohl
   sie hidden tragen. Gemessen: 5 leere Fehlermeldungen und 5 Meldekästen.

   Beide Regeln stehen ABSICHTLICH vor der :target-Regel: gleiche Spezifität,
   also gewinnt die spätere — der angesprungene Kasten wird sichtbar, alle
   anderen bleiben weg. */
.kontakt-melder[hidden],
.rw-maxw-form .rw-field__error[hidden]{display:none}

/* ——— 1 · Rückmeldung des Servers, ohne JavaScript ———
   kontakt.php leitet nach dem Absenden auf /kontakt.html?ok=1#gesendet weiter
   (bzw. auf #fehler-…). Eine statische HTML-Datei kann den Fragebogen nicht
   auswerten — das Fragment kann sie aber sehr wohl: :target greift ohne eine
   Zeile JavaScript.

   Im Ruhezustand tragen die Kästen das hidden-Attribut. Ist keine CSS da,
   bleiben sie also verborgen, statt eine alte Bestätigung zu behaupten. Diese
   Regel schlägt das hidden-Attribut, weil Autorenregeln vor der Regel des
   Browsers kommen. */
.kontakt-melder{margin-bottom:var(--space-6)}
/* !important, weil /css/rentique.css [hidden]{display:none !important} setzt
   (nötig für Schublade und Einwilligung). Ohne das hier bleibt die
   Bestätigung ohne JavaScript unsichtbar — gemessen am 22.09.2026. */
.kontakt-melder:target{display:flex !important}

/* ——— 2 · Zwei Felder nebeneinander (Zeitraum von / bis) ———
   Erst ab dem kleinen Umbruchpunkt; darunter stehen sie untereinander.
   Die Abstände muss dieser Block selbst setzen: die Regel .rw-field+.rw-field
   aus dem Design-System greift nur zwischen unmittelbar benachbarten Feldern,
   und dieser Behälter steht dazwischen. */
.kontakt-paar{display:grid;gap:var(--space-5);grid-template-columns:1fr;
  margin-top:var(--space-5)}
.kontakt-paar+.rw-field{margin-top:var(--space-5)}
.kontakt-paar .rw-field+.rw-field{margin-top:0}
@media (min-width:620px){.kontakt-paar{grid-template-columns:1fr 1fr}}

/* ——— 3 · Abschnitt „Bezahlen" ———
   Er steht am Fuß der rechten Spalte, unter den direkten Kontaktwegen, und
   braucht genau zwei Zeilen:

   · Ein eigener Abstand nach oben. Mit dem Standardabstand der Hinweiskästen
     läse er sich als vierter Kasten der Reihe darüber; er ist aber ein eigener
     Abschnitt mit eigener Überschrift.
   · Kein Hover-Rand. Die drei Zahlungswege benutzen die Optik von .contact-way,
     sind aber bewusst keine Links — es gibt nichts anzuklicken, keine QR-Codes
     und keine Kontodaten auf dieser Seite. Der mitwandernde Kupferrand würde
     einen Klick versprechen, den es nicht gibt. */
.kontakt-zahlen{margin-top:var(--space-10)}
.kontakt-zahlweg:hover{border-color:var(--border-subtle)}

/* ——— 4 · Honigtopf ———
   Aus dem Blick genommen, aber nicht display:none — manche Maschinen prüfen
   genau darauf und lassen solche Felder dann aus. Aus dem Textfluss geschoben
   fällt es ihnen seltener auf. Für Menschen ist es unerreichbar: unsichtbar,
   nicht mit der Tabulatortaste erreichbar (tabindex="-1" im Markup) und für
   Vorlesegeräte per aria-hidden weggeblendet. */
.kontakt-topf{position:absolute;left:-9999px;top:auto;
  width:1px;height:1px;overflow:hidden}
