/* ===== Helles Theme, seitenuebergreifend (nach allen anderen Stylesheets einbinden) ===== */
:root {
color-scheme: light;
--bg-color: #f4f4f2;
--bg-secondary: #e9e9e5;
--text-color: #1e293b;
--text-muted: #475569;
--heading-color: #0f172a;
--primary-color: #2563eb;
--primary-hover: #1d4ed8;
--accent-color: #1d4ed8;
--card-bg: #ffffff;
--card-bg-rgb: 255, 255, 255;
--card-border: rgba(15, 23, 42, 0.10);
--nav-bg: rgba(244, 244, 242, 0.85);
--glow-primary: rgba(37, 99, 235, 0.08);
--glow-secondary: rgba(37, 99, 235, 0.06);
/* Variablen aus dem angehaengten Tool-CSS (local-seo-check), das body dunkel faerbt */
--bg-dark: #f4f4f2;
--text-main: #1e293b;
--glass-bg: rgba(255, 255, 255, 0.7);
--glass-border: rgba(15, 23, 42, 0.10);
/* Statusfarben: dunkler fuer Kontrast auf hellem Grund */
--ok: #15803d; --ok-bg: rgba(21, 128, 61, 0.10);
--warn: #b45309; --warn-bg: rgba(180, 83, 9, 0.10);
--err: #b3361b; --err-bg: rgba(179, 54, 27, 0.10);
}
body { background-color: var(--bg-color); color: var(--text-color); }
/* Hintergrund-Blobs: Screen-Blend ist auf hell unsichtbar bzw. milchig */
.bg-blobs { filter: blur(80px); }
.blob { mix-blend-mode: normal; opacity: 0.07; }
.blob-3 { background: rgba(37, 99, 235, 0.08); }
/* Buttons */
.btn-primary { box-shadow: none; }
.btn-primary:hover { box-shadow: none; }
.btn-secondary:hover { background-color: rgba(15, 23, 42, 0.05); border-color: rgba(15, 23, 42, 0.25); }
/* Karten: weiss, Schatten statt dunkler Glow */
.card, .pain-point-card, .home-card, .faq-item, .contact-wrapper, .a-proof { box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.05); }
/* Preis-Karten sind keine Links: Hover aus styles.min.css (Rand, dunkler Schatten) neutralisieren */
.card:hover { border-color: var(--card-border); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.05); }
.pain-point-card:hover { box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12); }
.home-card, .a-proof { background: #ffffff; }
.bg-darker .card, .bg-darker .home-card, .bg-darker .faq-item, .bg-darker .contact-wrapper { background: #ffffff; }
.price-block { background: rgba(37, 99, 235, 0.07); border-color: rgba(37, 99, 235, 0.25); }
/* Pain-Point: Rot dunkler fuer Kontrast auf hell */
.pain-impact { color: #b3361b; background: rgba(232, 89, 60, 0.10); }
/* Navigation */
.nav-dropdown { box-shadow: 0 18px 40px rgba(15, 23, 42, 0.15) !important; }
.nav-dropdown a:hover { background: rgba(37, 99, 235, 0.10) !important; }
/* Footer-Badge (SiteLock) bleibt wie es ist */
/* Cookie-Banner immer hell, unabhaengig vom System-Dunkelmodus */
:root {
--cookie-bg: #ffffff; --cookie-text: #333333; --cookie-border: #e0e0e0;
--cookie-button-bg: #0062cc; --cookie-button-text: #ffffff; --cookie-button-hover: #004c9e;
--cookie-secondary-bg: #f5f5f5;
}

/* Keine Farbverlaeufe im Text: Ueberschriften in LocSEO-Navy, hervorgehobene Woerter in LocSEO-Blau, jeweils Vollton.
   Hebt auch den Verlauf aus styles.min.css und dem angehaengten Tool-CSS auf. */
body h1, body h2, body h3, body .text-gradient {
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-text-fill-color: currentColor;
}
body h1 { color: #0f172a; }
body .text-gradient { color: inherit; } /* Entschlackt 22.10.: hervorgehobene Wörter einfarbig wie die Überschrift */
body h1 em, body h2 em, body h3 em { color: inherit; } /* ebenso hervorgehobene Wörter per <em> in Überschriften */

/* Hero ohne Hintergrundgrafik (Netzwerkbild und runder Abdunkel-Verlauf) */
#hero::before, #hero::after { content: none; display: none; }

/* Markenname: der Schlusspunkt bleibt blau (LocSEO - Pritchett.) */

/* ===== Bausteine aus styles.min.css, die dort fest dunkel gesetzt sind (zentral, vorher seitenweise ueberschrieben) ===== */
/* Ratgeber-Karten (.section-card) */
body .section-card h2 { color: var(--heading-color); }
body .section-card .card-subtitle { color: var(--text-muted); }
body .section-card .check-list { background: rgba(15, 23, 42, 0.03); border: 1px solid rgba(15, 23, 42, 0.08); }
/* Badge: weisse Schrift auf blauer Flaeche (styles.min.css setzt #000 !important) */
body .card-badge { color: #ffffff !important; opacity: 1; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.15); }
body .zombie-header { color: #b3361b !important; }
/* Kennzahlen */
body .stat-number { color: #2563eb; }
body .stat-label { color: var(--text-muted); }
body .stat-box:not([class*="bg-"]) { background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.10); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.05); }
body .stat-box:not([class*="bg-"]):hover { background: #ffffff; border-color: rgba(37, 99, 235, 0.4); }
/* Kontakt: Auswahl-Schalter Firma/Verein und Profilkarte */
body .form-toggle button { color: var(--text-muted); }
body .form-toggle button.active { color: #ffffff; }
body .profile-card { background: #ffffff; border: 1px solid var(--card-border); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.05); color: var(--text-color); }
body .profile-banner { background: #dbe6fb; }
body .profile-banner::after { background: none; }
body .profile-message { color: var(--text-muted); }

/* Schmale Bildschirme: Listenpunkte mit fettem Begriff am Anfang als Fliesstext statt Flex-Spalten
   (sonst bricht der Begriff mitten im Wort um). Desktop bleibt unveraendert. */
@media (max-width: 600px) {
  body .check-list li:has(> strong) { display: block; position: relative; padding-left: 1.6rem; }
  body .check-list li:has(> strong)::before { position: absolute; left: 0; top: 0; }
  body .detail-facts li:has(> strong) { display: block; position: relative; padding-left: 2.1rem; }
  body .detail-facts li:has(> strong)::before { position: absolute; left: 0.9rem; top: 0.7rem; }
}

/* <main class="container section-padding">: .section-padding (padding: x 0) hebt den Seitenabstand von .container auf,
   der Text klebt auf schmalen Bildschirmen am Rand (Glossar). */
@media (max-width: 1432px) { body main.container.section-padding { padding-left: 2rem; padding-right: 2rem; } }
@media (max-width: 768px) { body main.container.section-padding { padding-left: 1.25rem; padding-right: 1.25rem; } }

/* Links in FAQ-Antworten: blau und unterstrichen, damit sie als Links erkennbar sind (Buttons ausgenommen) */
body .faq-content a:not(.btn-primary):not(.btn-secondary) { color: #2563eb; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
body .faq-content a:not(.btn-primary):not(.btn-secondary):hover { color: #1d4ed8; }

/* Keine farbigen Oberkanten an Karten: Streifen und farbige border-top entfernt, Rahmen ringsum einheitlich (Überschreibt Altbasis styles.min.css) */
body .stat-box::before, body .result-hero::before { content: none; display: none; }
body .pain-point-card, body .solution-card { border-top: 1px solid var(--card-border, rgba(15, 23, 42, 0.10)); }
body .section-card { border-top: 1px solid rgba(15, 23, 42, 0.10); }

/* Entschlackt 22.10.: keine Versal-Labels/Pillen mehr. Kartenmarkierung ("Empfohlen", "Beliebt") als kleiner blauer Text über dem Titel (wie .pr-flag auf der Startseite) */
body .pkg-flag { display: block; margin: 0 0 0.5rem; font-size: 0.82rem; line-height: 1.5; font-weight: 600; color: #1d4ed8; text-transform: none; letter-spacing: 0; }
@media (min-width: 681px) { body .fs-pakete .card:not(:has(.pkg-flag))::before { content: "\a0"; display: block; margin: 0 0 0.5rem; font-size: 0.82rem; line-height: 1.5; } }
@media (min-width: 1001px) {
  body .kfz-pakete .card:not(:has(.pkg-flag))::before { content: "\a0"; display: block; margin: 0 0 0.5rem; font-size: 0.82rem; line-height: 1.5; }
  body .pakete-grid .paket-card:not(:has(.pkg-flag))::before { content: "\a0"; display: block; margin: 0 0 0.5rem; font-size: 0.82rem; line-height: 1.5; }
}
/* Hinweis in Normalschrift statt Pille ("Nur im Paket ...") */
body .lbl-note { margin: 0.75rem 0 0; font-size: 0.9rem; line-height: 1.6; color: var(--text-muted); font-weight: 400; text-transform: none; letter-spacing: 0; }
/* Meta-Zeilen und Untertitel in Satzschreibung statt Versalien */
body .tool-card-meta, body .ratgeber-card-meta { text-transform: none; letter-spacing: 0; font-size: 0.82rem; }
body .section-card .card-subtitle { text-transform: none; letter-spacing: 0; }
/* Gründer-Hinweis als schlichter blauer Satz statt Pille */
body .gr-badge { display: block; padding: 0; margin: 0 0 1rem; border: 0; border-radius: 0; background: none; font-size: 0.95rem; font-weight: 600; color: #1d4ed8; }

/* Buttons flach (22.10.2026): kompakt, wenig Rundung, kein Schatten, kein Anheben.
   Blau für die Hauptaktion, ruhiger Rahmen für die zweite Aktion. */
body .btn-primary, body .btn-secondary {
  border-radius: 6px !important;
  padding: 0.7rem 1.25rem !important;
  min-height: 2.75rem !important;
  font-weight: 500 !important;
  font-size: 0.95rem;
  line-height: 1.3;
  box-shadow: none !important;
  display: inline-flex;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 120ms var(--ease-out, ease) !important;
}
body .btn-primary { background-color: #2563eb !important; color: #ffffff !important; border: 1px solid #2563eb !important; }
body .btn-primary:hover { background-color: #1d4ed8 !important; border-color: #1d4ed8 !important; }
body .btn-secondary { background-color: transparent !important; color: #0f172a !important; border: 1px solid rgba(15, 23, 42, 0.18) !important; }
body .btn-secondary:hover { background-color: rgba(15, 23, 42, 0.04) !important; border-color: rgba(15, 23, 42, 0.32) !important; }
body .btn-primary:hover, body .btn-secondary:hover { transform: none !important; }
body .btn-primary:active:not(:disabled), body .btn-secondary:active:not(:disabled) { transform: scale(0.97) !important; }

/* Nach-oben-Button: am Handy klein und dezent */
@media (max-width: 767px) {
  body #back-to-top { width: 44px; height: 44px; right: 12px; bottom: 12px; background: #fff; color: #0f172a; border: 1px solid rgba(15, 23, 42, 0.15); box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08); font-size: 1.1rem; }
}

/* Kontrast (WCAG AA): Fussnote ohne Transparenz, Links auf der zweiten Flaeche (#e9e9e5) dunkler */
body .footer-bottom p { opacity: 1; }
body .home-card-link, body .bg-darker a:not(.btn-primary):not(.btn-secondary), body .bg-secondary a:not(.btn-primary):not(.btn-secondary) { color: #1d4ed8 !important; }
body .stats-section a:not(.btn-primary):not(.btn-secondary) { color: #1d4ed8 !important; }
/* Footer-Spaltentitel als h3 (Ueberschriftenfolge), Optik wie vorher als h4 */
body .footer-col h3 { font-size: 1rem; margin-bottom: 1rem; }
/* Tabellen: nur die Tabelle wischbar, nicht die Seite */
body .table-container { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }