/* Lesegröße 20.10.2026 (Rico): Fließtext 17 px Handy, 18 px ab 768 px; Kleingedrucktes nie unter 14 px.
   Gemeinsam für alle Seiten, per <link> nach dem Seiten-Stil eingebunden. Werte in em = relativ zum Fließtext. */

/* Grundschrift */
@media (min-width:768px){ html body{font-size:18px} }

/* Fließtext, der bisher per rem kleiner gesetzt war */
html body .lead p{font-size:1.06em}
html body table{font-size:1em}
html body th{font-size:.9em}
html body .author-box p,
html body .card p,
html body .prob p,
html body .checks li,
html body .teaser p.tz,
html body .stat .l{font-size:1em}
html body .sample .tip,
html body .hero .trust,
html body .byline,
html body .book .b-sub,
html body .a-hero .meta,
html body .who,
html body .top{font-size:.95em}
html body .sample pre,
html body .teaser pre{font-size:.9em}

/* Kartentitel bleiben über dem größeren Kartentext */
html body .card .ct{font-size:1.15em}

/* Kleingedrucktes und Etiketten: mindestens 14 px */
html body .crumbs,
html body .cta-box .note,
html body .note,
html body .btn-note,
html body .paytrust,
html body .pages figcaption,
html body .card .more,
html body .teaser .lock,
html body .paymethods .pm-lbl,
html body .steps,
html body .flag{font-size:max(14px,.85em)}
html body footer,
html body footer p,
html body footer .foot-links,
html body footer .foot-links a{font-size:max(14px,.85rem)}
html body .eyebrow,
html body .cta-box .eyebrow,
html body .sample .lbl,
html body .teaser .lbl,
html body .box .bl,
html body .cat .cl,
html body .card .cap,
html body .card .wf,
html body .rel-card .rc-cap,
html body .book .b-top,
html body .book .b-foot,
html body .ba .tag,
html body .paymethods span,
html body .kicker,
html body .hero .kicker,
html body .a-hero .kicker,
html body .price-card .ribbon,
html body .guar .seal{font-size:14px}
/* Copyright-Zeile im Fuß hat ein Inline-Stil mit .82rem (13,1 px) */
html body footer p[style]{font-size:14px !important}

/* Navigation und Knöpfe: nicht unter 15 px (Handy 14 px, unter 380 px 13 px, damit die Kopfzeile hält; vorher 11,8 px) */
html body .nav .btn{font-size:15px}
@media (max-width:600px){ html body .nav .btn{font-size:14px} }
@media (max-width:380px){ html body .nav .btn{font-size:13px} }

/* Überschriften: H2 auf dem Handy mind. 1,5-mal Fließtext, lange Wörter trennen statt überstehen */
@media (max-width:767px){ html body h2{font-size:1.6rem} }
html body h1, html body h2{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}

/* Weiß auf dunkel 20.10.2026 (Rico): Lesetext auf dunklem Grund (Navy #14233A/#1D3050, Fuß #0E1929)
   in Lese-Weiß #F0EFEA statt Grau. Gold-Akzente (Kicker, Eyebrows, Labels, Punkt im Logo, Knöpfe) bleiben. */
html body footer,
html body footer p,
html body footer span:not(.dot),
html body footer .foot-links,
html body footer .foot-links a,
html body header a:not(.btn):not(.brand),
html body .nav-links a.plain,
html body .a-hero .meta,
html body .a-hero .crumbs,
html body .a-hero .crumbs a,
html body .hero p.sub,
html body .hero .trust,
html body .hero .byline,
html body .hero .byline span,
html body .hero .btn-note,
html body .hero .paymethods .pm-lbl,
html body .final p,
html body .cta-box p,
html body .cta-box .note,
html body .sample .tip,
html body .sample .tip b,
html body .teaser p.tz,
html body .top,
html body .top .steps,
html body .top .steps span{color:#F0EFEA}
/* Startseite: drei Stellen tragen das Grau inline (Kopf-Link, Hinweis unter dem Hero-Knopf, Zahlungshinweis im Schluss) */
html body header a[style*="color"]:not(.btn),
html body .hero .btn-note[style*="color"],
html body .final .wrap > div[style*="color"]{color:#F0EFEA !important}

/* Nutzenblock „Was Du davon hast“ 22.10.2026 (Rico: „Benefit: Was Sie davon haben MUSS überall rein“, GEO-STANDARD B.15).
   Direkt unter H1/Unterzeile, Haken als eigenes Zeichen per CSS (Goldkreis, weißer Haken), kein Emoji, keine Icon-Bibliothek.
   Inhalte: docs/nutzenblock.json, Werkzeug ~/.claude/loops/nutzenblock.py. */
html body .nutzen{margin:22px 0 6px;max-width:46rem}
html body .nutzen .nutzen-titel{margin:0 0 10px;font-weight:700;font-size:1.1em;line-height:1.35;color:var(--navy,#14233A)}
html body .nutzen ul.nutzen-liste{list-style:none;margin:0;padding:0}
html body .nutzen ul.nutzen-liste li{position:relative;margin:0 0 9px;padding:0 0 0 34px;font-size:1em;line-height:1.55;color:var(--ink,#1a2230)}
html body .nutzen ul.nutzen-liste li::before{content:"";position:absolute;left:0;top:.18em;width:22px;height:22px;border-radius:50%;background:var(--gold,#B8893B)}
html body .nutzen ul.nutzen-liste li::after{content:"";position:absolute;left:8px;top:calc(.18em + 4px);width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
html body .hero .nutzen .nutzen-titel,
html body .a-hero .nutzen .nutzen-titel,
html body .hero .nutzen ul.nutzen-liste li,
html body .a-hero .nutzen ul.nutzen-liste li{color:#F0EFEA}
html body .a-hero .nutzen{margin-top:20px}
