/* ============================================================================
   ZENTRALE LINKREGEL (v2510-81, Gman 28.10.2026 12:56 und 12:59). EINE Stelle fuer alle Links der Seite.
   Design-Doku: wiki/konzepte/linkregel.md (Datei:Zeile der Einzelregeln dort und in familien77/BERICHT.md).
   Gate: nachweise/version_2510/familien77/linkregel.py (Playwright ueber ALLE Links; Abweichungen muessen 0 sein).

   REGEL (Text- und Kartenlinks, Menue, Footer, Vertrauenszeile, Teaser):
     Ruhe    = Seitenstandard: Text in Navy (helle Flaeche) bzw. Creme (dunkle Flaeche), KEINE Linie.
     Hover / Fokus (Tastatur) / Aktiv / Touch (Tippen) = Terracotta-Text + GENAU EINE Unterstreichung.
   Eine Linie heisst: entweder die einlaufende Linie der .tl-Links (Hintergrund, 1,5 px, schon Seitenstandard)
   oder text-decoration (alle uebrigen Textlinks). Nie beides, nie ein Dauerstrich in der Ruhe.

   FARBEN (nur vorhandene Werte): helle Flaeche #A3421D (5,6:1 auf Creme); dunkle Flaeche #C65A30
   (3,0:1 auf Navy, nur AA fuer grosse Schrift; #A3421D waere dort 1,6:1 und unlesbar). Austausch ueber die Variablen.

   AUSNAHMEN (Knopf-/Flaechen-Stile, eigene Klassen, hier bewusst NICHT geregelt, im Test als «Ausnahme» gefuehrt):
     .btn .btn-haupt .leiste-btn   Terracotta-/Navy-Flaeche, Hover = dunklere Flaeche (Knopf, kein Textlink)
     .start-karte .start-glas      Hero-Knoepfe: Terracotta-Flaeche bzw. Glas
     .folge-btn                    Navy-Knopf «Alle Projekte»
     .wa-knopf                     Umriss-Knopf «Per WhatsApp schreiben» (Hover = Creme-Flaeche)
     .fuss-social a                runde Icon-Knoepfe (kein Text)
     .leiste-tel                   Umriss-Knopf «Per WhatsApp schreiben» in der mobilen Leiste (Rand = Knopfform, kein Textlink)
     .skip                         Sprunglink, nur bei Fokus sichtbar
     .menue-mobil                  Menue-Knopf (button, nicht a)
     .weg-tafel .folge-link        ganze Bildkarten: die Karte selbst ist Flaeche, der Link-Text darin (.tl bzw. .tafel-link) folgt der Regel
   ============================================================================ */
:root{
  --link-ruhe:#122E4D;          /* Navy: Text auf heller Flaeche */
  --link-ruhe-dunkel:#F6F1E8;   /* Creme: Text auf dunkler Flaeche */
  --link-hover:#A3421D;         /* Terracotta, helle Flaeche */
  --link-hover-dunkel:#C65A30;  /* v2510-82: in css/v82-2810.css auf #E27D50 gehoben (4,78:1 auf Navy) */
  --link-linie:1.5px;
  --link-abstand:.22em;
}

/* --- 1. .tl-Links (Seitenstandard pfeil-v2-2710.css): Farben ueber die Variablen, eine einlaufende Linie, nie text-decoration/Rand --- */
body .tl{--t:var(--link-ruhe);--th:var(--link-hover);--ph:var(--link-hover)}
body .cap .tl,body .tl-hell,body .fam-kachel .tl{--t:var(--link-ruhe-dunkel);--th:var(--link-hover-dunkel);--ph:var(--link-hover-dunkel)}
body a.tl,body a[href] .tl,body .tl:hover,body .tl:focus-visible,body a:is(:hover,:focus-visible,:active) .tl{text-decoration:none!important;border-bottom-width:0!important}
body a.tl:is(:active),body a:active .tl{color:var(--th)}
body a.tl:active,body a:active .tl.tl{background-size:100% var(--link-linie)}
/* Ruhelinie «Mehr zum Ablauf»: Dauerstrich entfernt (weg-2510-05.css:18, pfeil-v2-2710.css:25) */
body .ws-mehr a.ab-mehr.tl{border-bottom:0!important;background-image:linear-gradient(currentColor,currentColor)!important;background-position:0 calc(100% + 3px)!important;background-size:0 var(--link-linie)!important}
body .ws-mehr a.ab-mehr.tl:is(:hover,:focus-visible,:active){background-size:100% var(--link-linie)!important}
/* Vertrauenszeile im Hero: kein Dauerstrich (v76-2810.css:52), Linie wie alle .tl bei Hover/Fokus/Tippen; zweizeilig: Linie unter jeder Zeile */
body .hero-sterne.hero-vertrauen a.tl{text-decoration:none!important;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* --- 2. Textlinks ohne .tl (Kopf, Menuepanel, Footer, Presse): text-decoration als EINE Linie --- */
body :is(.menue-tel,.mobilpanel-tel,.mobilpanel-nav a,.mp-mehr a,.pstr-alle,main p a:not([class]):not(.fuss a),.gs-fuss a:not(.tl)){color:var(--link-ruhe)!important;text-decoration:none!important;border-bottom:0!important}
body :is(.fuss .fuss-spalte a:not(.wa-knopf),.fuss-unten a){text-decoration:none!important;border-bottom:0!important}
body :is(.menue-tel,.mobilpanel-tel,.mobilpanel-nav a,.mp-mehr a,.pstr-alle,main p a:not([class]):not(.fuss a),.gs-fuss a:not(.tl)):is(:hover,:focus-visible,:active),
body :is(.menue-tel,.mobilpanel-tel,.mobilpanel-nav a,.mp-mehr a,.pstr-alle,main p a:not([class]):not(.fuss a),.gs-fuss a:not(.tl)):is(:hover,:focus-visible,:active) :is(span,strong,em){color:var(--link-hover)!important;text-decoration:underline!important;text-decoration-thickness:var(--link-linie)!important;text-underline-offset:var(--link-abstand)!important;text-decoration-color:currentColor!important}
body :is(.fuss .fuss-spalte a:not(.wa-knopf),.fuss-unten a):is(:hover,:focus-visible,:active){color:var(--link-hover-dunkel)!important;text-decoration:underline!important;text-decoration-thickness:var(--link-linie)!important;text-underline-offset:var(--link-abstand)!important;text-decoration-color:currentColor!important}

/* --- 3. Karten-/Kachel-Linktexte: die Karte ist Flaeche, der Text darin folgt der Regel --- */
body .weg-tafel .tafel-link{border-bottom:0!important;text-decoration:none!important}
body .weg-tafel:is(:hover,:focus-visible,:active) .tafel-link{color:var(--link-hover-dunkel)!important;text-decoration:underline!important;text-decoration-thickness:var(--link-linie)!important;text-underline-offset:var(--link-abstand)!important;text-decoration-color:currentColor!important}
body .folge-link:is(:hover,:focus-visible,:active) .tl{border-bottom-color:transparent!important}

/* --- 4. Weitere Links (Gman 28.10.2026 13:24): Hero-Karte (helle Flaeche), Logo, «Ganze Bewertung lesen», Kartenzeilen --- */
/* Hero-Karte ist hell (Variante C): Vertrauenszeile folgt der Regel fuer helle Flaeche */
body #kopf .hero-inhalt .tl,body #kopf .hero-inhalt .tl-hell{--t:var(--link-ruhe);--th:var(--link-hover);--ph:var(--link-hover)}
/* Logo (Bildlink): Ruhe keine Linie, Hover/Fokus/Tippen eine Terracotta-Linie unter dem Logo */
body .menue-logo{text-decoration:none!important;background-image:linear-gradient(var(--link-hover),var(--link-hover))!important;background-repeat:no-repeat!important;background-position:0 calc(100% - 2px)!important;background-size:0 var(--link-linie)!important;transition:background-size .25s ease}
body .menue-logo:is(:hover,:focus-visible,:active){background-size:100% var(--link-linie)!important}
/* «Ganze Bewertung lesen» / «Weiterlesen» (button.gs-mehr, js/bewertungen.js): Ruhe keine Linie (vorher Dauerstrich, index.html Inline-Stil .gs-mehr) */
body .gs-mehr{color:var(--link-ruhe)!important;text-decoration:none!important}
body .gs-mehr:is(:hover,:focus-visible,:active){color:var(--link-hover)!important;text-decoration:underline!important;text-decoration-thickness:var(--link-linie)!important;text-underline-offset:var(--link-abstand)!important;text-decoration-color:currentColor!important}
/* FAQ-Zeilen (summary): Frage wie ein Textlink */
body .faq-e summary{color:var(--link-ruhe);text-decoration:none}
body .faq-e summary:is(:hover,:focus-visible,:active){color:var(--link-hover);text-decoration:underline;text-decoration-thickness:var(--link-linie);text-underline-offset:var(--link-abstand);text-decoration-color:currentColor}
/* Presse-Eintraege: Linie nur unter dem Titel (nicht unter Medienname und Bild) */
body .pstr li a:is(:hover,:focus-visible,:active){text-decoration:none!important}
body .pstr li a .pstr-tit{color:var(--link-ruhe)!important;text-decoration:none}
body .pstr li a:is(:hover,:focus-visible,:active) .pstr-tit{color:var(--link-hover)!important;text-decoration:underline!important;text-decoration-thickness:var(--link-linie)!important;text-underline-offset:var(--link-abstand)!important;text-decoration-color:currentColor!important}
/* Vertrauenszeile (Hero-Karte, hell): css/v81-2810.css:70 setzt Navy mit !important, Hover/Fokus/Tippen hier wieder Terracotta */
html body #kopf.hero .hero-inhalt .hero-sterne a.tl:is(:hover,:focus-visible,:active),html body #kopf.hero .hero-inhalt .hero-sterne a.tl:is(:hover,:focus-visible,:active) span:not([aria-hidden=true]){color:var(--link-hover)!important}
