/* ─── Reset & Base ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --clr-primary:   #1f628e;
  --clr-accent:    #e09d71;
  --clr-text:      #1f2937;
  --clr-muted:     #6c869e;
  --clr-border:    #e5e7eb;
  --clr-bg:        #ffffff;
  --clr-surface:   #f9fafb;
  --clr-nav-bg:    #1f628e;
  --clr-nav-text:  #ffffff;
  --clr-nav-hover: #e09d71;
  --font-sans:     'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  --max-w:         1100px;
  --nav-h:         64px;
  /* Design-token aliases – referenced by article/page component CSS */
  --navy:    #1f628e;
  --accent:  #e09d71;
  --surface: #f8f4ef;
  --border:  #e4d9ce;
  --cream:   #ecdcc8;
  --text:    #1a2e3b;
  --muted:   #6c869e;
  --white:   #ffffff;
  --radius:  12px;
  --fh: 'DM Sans', system-ui, sans-serif;
  --fb: 'Lora', Georgia, serif;
}
html { scroll-behavior: smooth; }
body { font-family: var(--font-sans); color: var(--clr-text); background: var(--clr-bg); font-size: 16px; line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--clr-accent); text-decoration: none; font-weight: 700; }
a:hover { text-decoration: underline; }
.article-content table,.article-body table,.page-body table{width:100%;border-collapse:collapse;font-size:.9rem;margin:28px 0;background:var(--white);border-radius:10px;overflow:hidden;box-shadow:0 1px 4px rgba(31,98,142,.08)}
.article-content table thead,.article-body table thead,.page-body table thead{background:var(--navy);color:#fff;text-align:left}
.article-content table th,.article-body table th,.page-body table th{background:var(--navy);padding:11px 16px;font-family:var(--fh);font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#fff;border:none;text-align:left}
.article-content table td,.article-body table td,.page-body table td{padding:10px 16px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:top;line-height:1.5}
.article-content table tbody tr:last-child td,.article-body table tbody tr:last-child td,.page-body table tbody tr:last-child td{border-bottom:none}
.article-content table tbody tr:nth-child(even),.article-body table tbody tr:nth-child(even),.page-body table tbody tr:nth-child(even){background:var(--surface)}
.article-content table tbody tr:hover,.article-body table tbody tr:hover,.page-body table tbody tr:hover{background:#eef4f9}
.article-content .table-wrap,.article-body .table-wrap,.page-body .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:28px 0;border-radius:10px}

/* ─── Header ────────────────────────────────────────────────── */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(31,98,142,0.92);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  height: var(--nav-h);
  display: flex; align-items: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.site-header__inner {
  width: 100%; max-width: var(--max-w);
  margin: 0 auto; padding: 0 20px;
  display: flex; align-items: center; justify-content: space-between;
}
.site-logo {
  display: flex; align-items: center;
  text-decoration: none; white-space: nowrap; flex-shrink: 0;
}
.site-logo img { height: 40px; width: auto; display: block; filter: brightness(0) invert(1); }

/* ─── Navigation ────────────────────────────────────────────── */
.site-nav { position: relative; }
.nav-list {
  list-style: none;
  display: flex; align-items: center; gap: 4px;
}
.nav-item { position: relative; }
.nav-link {
  display: flex; align-items: center; gap: 4px;
  padding: 8px 12px;
  color: var(--clr-nav-text); font-size: .9rem; font-weight: 500;
  border-radius: 6px; white-space: nowrap;
  transition: background .15s, color .15s;
}
.nav-link:hover { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.nav-link--active{background:rgba(255,255,255,.18)!important;color:#fff!important;border-radius:6px}
.nav-arrow { font-size: .75em; opacity: .7; transition: transform .2s; }
.nav-item.has-children:hover .nav-arrow { transform: rotate(180deg); }
.nav-item--cta { margin-left: auto; }
.nav-acct-btn { display: inline-flex; align-items: center; padding: 6px 14px; margin-left: 8px; border: 1.5px solid rgba(255,255,255,.35); border-radius: 50px; color: rgba(255,255,255,.9) !important; font-size: .8rem; font-weight: 600; white-space: nowrap; text-decoration: none; transition: border-color .15s, background .15s; flex-shrink: 0; }
.nav-acct-btn:hover { border-color: #fff; background: rgba(255,255,255,.12); text-decoration: none; }
.nav-cta-btn { display: inline-flex; align-items: center; gap: 4px; padding: 7px 16px; background: var(--clr-accent); color: #fff !important; font-size: .85rem; font-weight: 700; border-radius: 50px; white-space: nowrap; text-decoration: none; transition: background .15s, transform .15s; }
.nav-cta-btn:hover { background: var(--clr-accent-dark, #c47a3a); color: #fff !important; text-decoration: none; transform: translateY(-1px); }
.nav-cta-btn .nav-arrow { opacity: 1; color: #fff; }
.nav-dropdown--right { left: auto; right: 0; }
.nav-divider { height: 1px; background: rgba(0,0,0,.08); margin: 4px 12px; pointer-events: none; }
.nav-item-icon { font-size: .95em; line-height: 1; flex-shrink: 0; }
.nav-dropdown .nav-link { display: flex; align-items: center; gap: 8px; }

/* ─── Mega Menu ──────────────────────────────────────────────────────────── */
.nav-mega{display:none;position:absolute;top:100%;left:0;min-width:540px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.3);border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,.15);padding:16px;z-index:200}
.nav-mega::before{content:'';position:absolute;top:-10px;left:0;width:100%;height:10px;background:transparent}
.nav-item.has-children:hover > .nav-mega,.nav-item.has-children.is-hover > .nav-mega{display:block}
.nav-mega__grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.nav-mega__item{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:8px;text-decoration:none;transition:background .15s;color:var(--clr-text,#1a2e3b)}
.nav-mega__item:hover{background:rgba(31,98,142,.07)}
.nav-mega__icon{font-size:1.3rem;line-height:1;flex-shrink:0;margin-top:2px}
.nav-mega__body{display:flex;flex-direction:column;gap:2px}
.nav-mega__label{font-family:var(--fh,sans-serif);font-size:.9rem;font-weight:700;color:var(--clr-primary,#1f628e);line-height:1.2}
.nav-mega__desc{font-size:.78rem;color:var(--clr-muted,#6c869e);line-height:1.4}
@media(max-width:768px){.nav-mega{position:static;min-width:0;background:rgba(0,0,0,.15);backdrop-filter:none;border:none;box-shadow:none;border-radius:6px;padding:8px}.nav-mega__grid{grid-template-columns:1fr}.nav-mega__desc{display:none}.nav-mega__item{padding:8px 12px}.nav-mega__label{color:rgba(255,255,255,.9)}}

/* ─── Dropdowns ─────────────────────────────────────────────── */
.nav-dropdown {
  display: none; position: absolute; top: 100%; left: 0;
  min-width: 280px; list-style: none;
  background: #fff; border: 1px solid var(--clr-border);
  border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.12);
  padding: 6px 0; z-index: 200;
  /* Padding-top schafft unsichtbare Brücke zwischen Nav-Link und Dropdown */
  padding-top: 10px;
  margin-top: -4px;
}
/* Transparente Brücke verhindert Lücke beim Maus-Übergang */
.nav-dropdown::before {
  content: ''; position: absolute; top: -10px; left: 0;
  width: 100%; height: 10px; background: transparent;
}
.nav-item.has-children:hover > .nav-dropdown,
.nav-item.has-children.is-hover > .nav-dropdown { display: block; }
.nav-dropdown .nav-link { color: var(--clr-text); border-radius: 0; padding: 9px 16px; }
.nav-dropdown .nav-link:hover { background: var(--clr-surface); color: var(--clr-primary); }
.nav-dropdown--sub {
  top: -6px; left: 100%; padding-top: 6px;
  margin-top: 0; margin-left: 0;
}
.nav-dropdown--sub::before {
  content: ''; position: absolute; top: 0; left: -10px;
  width: 10px; height: 100%; background: transparent;
}
.nav-dropdown .nav-item.has-children:hover > .nav-dropdown--sub,
.nav-dropdown .nav-item.has-children.is-hover > .nav-dropdown--sub { display: block; }

/* ─── Mobile toggle ─────────────────────────────────────────── */
.nav-toggle {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 8px;
}
.nav-toggle span {
  display: block; width: 24px; height: 2px;
  background: #fff; border-radius: 2px; transition: all .2s;
}

/* ─── Main content ──────────────────────────────────────────── */
.site-main { max-width: var(--max-w); margin: 0 auto; padding: 16px 20px 64px; }
.entry-title { font-size: clamp(1.6rem, 3.5vw, 2.4rem); font-weight: 800; color: var(--clr-primary); margin-bottom: 16px; line-height: 1.2; }
.entry-meta { color: var(--clr-muted); font-size: .875rem; margin-bottom: 24px; }
.entry-content { max-width: 780px; }
.entry-content h2 { font-size: 1.5rem; color: var(--clr-primary); margin: 32px 0 12px; }
.entry-content h3 { font-size: 1.2rem; color: var(--clr-primary); margin: 24px 0 8px; }
.entry-content p { margin-bottom: 16px; }
.entry-content ul, .entry-content ol { margin: 0 0 16px 24px; }
.entry-content li { margin-bottom: 6px; }
.entry-content blockquote { border-left: 4px solid var(--clr-accent); padding: 12px 20px; margin: 24px 0; background: var(--clr-surface); border-radius: 0 6px 6px 0; font-style: italic; color: var(--clr-muted); }

/* ─── Post-List (Blog-Index) ────────────────────────────────── */
ul.postlist { list-style: none; display: flex; flex-direction: column; gap: 12px; }
ul.postlist li { padding: 16px; background: var(--clr-surface); border: 1px solid var(--clr-border); border-radius: 8px; }
ul.postlist li a { color: var(--clr-primary); font-weight: 600; }
ul.postlist li a:hover { color: var(--clr-accent); text-decoration: none; }
time { color: var(--clr-muted); font-size: .85rem; }

/* ─── Hero ──────────────────────────────────────────────────── */
.hero {
  background: linear-gradient(135deg, var(--clr-primary) 0%, #2a5a8c 100%);
  color: #fff; padding: 64px 20px;
}
.hero__inner { max-width: var(--max-w); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.hero h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); font-weight: 800; line-height: 1.2; margin-bottom: 16px; }
.hero .hero-sub { font-size: 1.1rem; opacity: .85; margin-bottom: 24px; }
.hero .btn { display: inline-block; padding: 12px 24px; background: var(--clr-accent); color: #fff; border-radius: 8px; font-weight: 700; margin-right: 12px; margin-bottom: 8px; transition: opacity .15s; }
.hero .btn:hover { opacity: .85; text-decoration: none; }
.hero img { border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.3); }
@media (max-width: 700px) { .hero__inner { grid-template-columns: 1fr; } .hero img { display: none; } }

/* ─── FAQ ───────────────────────────────────────────────────── */
.faq { margin-top: 40px; border-top: 2px solid var(--clr-border); padding-top: 32px; }
.faq h2 { font-size: 1.5rem; color: var(--clr-primary); margin-bottom: 20px; }
.faq details { border: 1px solid var(--clr-border); border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.faq summary { padding: 14px 20px; font-weight: 600; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; font-size: 1.2rem; color: var(--clr-accent); }
.faq details[open] summary::after { content: '−'; }
.faq details > div { padding: 0 20px 16px; color: var(--clr-muted); }

/* ──DEFERRED── */
/* ─── Footer ────────────────────────────────────────────────── */
.site-footer {
  background: var(--clr-primary); color: rgba(255,255,255,.75);
  padding: 40px 20px 24px;
}
.site-footer__inner { max-width: var(--max-w); margin: 0 auto; }
.site-footer__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; flex-wrap: wrap; margin-bottom: 32px; }
.site-footer__brand strong { color: #fff; font-size: 1.1rem; display: block; margin-bottom: 8px; }
.site-footer__brand p { font-size: .875rem; max-width: 360px; line-height: 1.5; }
.site-footer__social { display: flex; gap: 12px; margin-top: 16px; }
.site-footer__social a { color: rgba(255,255,255,.7); font-size: .85rem; padding: 6px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 6px; transition: all .15s; }
.site-footer__social a:hover { color: #fff; border-color: #fff; text-decoration: none; }
.site-footer__bottom { border-top: 1px solid rgba(255,255,255,.15); padding-top: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.site-footer__legal { display: flex; gap: 20px; flex-wrap: wrap; }
.site-footer__legal a { color: rgba(255,255,255,.6); font-size: .8rem; font-weight: 300 !important; }
.site-footer__legal a:hover { color: #fff; }
.site-footer__copy { font-size: .8rem; color: rgba(255,255,255,.5); }

/* ─── Footer-Navigation (Spalten-Menü) ──────────────────────── */
.footer-nav { padding: 48px 0 40px; margin-bottom: 32px; }
.footer-nav__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.footer-nav__heading-wrap { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; }
.footer-nav__heading { font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #fff; text-decoration: none; transition: color .15s; line-height: 1.3; }
.footer-nav__heading:hover { color: var(--clr-accent, #e09d71); text-decoration: none; }
.footer-nav__toggle { display: none; background: none; border: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.6); font-size: 1rem; line-height: 1; cursor: pointer; padding: 0; width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; transition: border-color .15s, color .15s, transform .2s; align-items: center; justify-content: center; }
.footer-nav__toggle:hover { color: #fff; border-color: rgba(255,255,255,.5); }
.footer-nav__list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-nav__list li { line-height: 1; }
.footer-nav__list a { font-size: .875rem; color: rgba(255,255,255,.6); text-decoration: none; transition: color .15s; font-weight: 300 !important;}
.footer-nav__list a:hover { color: #fff; text-decoration: none; }

/* ─── Responsive ────────────────────────────────────────────── */
@media (max-width: 768px) {
  .nav-list { display: none; flex-direction: column; position: fixed; top: var(--nav-h); left: 0; right: 0; width: 100%; background: var(--clr-primary); padding: 12px 16px; border-radius: 0 0 8px 8px; box-shadow: 0 8px 24px rgba(0,0,0,.2); z-index: 99; }
  .nav-list.is-open { display: flex; }
  .nav-toggle { display: flex; }
  .nav-item--cta { margin-left: 0; }
  .nav-dropdown { position: static; box-shadow: none; border: none; background: rgba(0,0,0,.15); border-radius: 6px; margin-top: 4px; display: none; }
  .nav-item.has-children.is-open > .nav-dropdown,
  .nav-item.has-children.is-open > .nav-mega { display: block; }
  .nav-dropdown .nav-link { color: rgba(255,255,255,.85); }
  .nav-dropdown--sub { left: 0; top: 0; }
  .site-footer__top { flex-direction: column; }
  .footer-nav { padding: 24px 0 16px; }
  .footer-nav__grid { grid-template-columns: 1fr; gap: 0; }
  .footer-nav__col { border-bottom: 1px solid rgba(255,255,255,.1); }
  .footer-nav__heading-wrap { padding: 14px 0; margin-bottom: 0; cursor: pointer; }
  .footer-nav__toggle { display: flex; }
  .footer-nav__list { display: none; padding-bottom: 14px; gap: 12px; }
  .footer-nav__col.is-open .footer-nav__list { display: flex; }
  .footer-nav__col.is-open .footer-nav__toggle { transform: rotate(45deg); }
}

/* ─── Page Transition ───────────────────────────────────────────────────── */
@keyframes page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.site-main{animation:page-in .28s ease both}

/* ─── Article feature components (ToC, Share, Feedback, Newsletter, Quiz) ── */
/* Inhaltsverzeichnis */
.article-toc{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 22px;margin:0 0 36px;font-family:var(--fh)}
.toc__toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;cursor:pointer;padding:0;gap:8px}
.toc__title{font-size:.95rem;font-weight:700;color:var(--navy)}
.toc__chevron{font-size:.85rem;color:var(--muted);transition:transform .2s}
.toc__toggle[aria-expanded="false"] .toc__chevron{transform:rotate(-90deg)}
.toc__list{list-style:none;display:flex;flex-direction:column;gap:2px;margin-top:14px;padding-left:4px}
.toc__item--h3{padding-left:18px}
.toc__link{display:block;font-size:.85rem;color:var(--muted);padding:4px 8px;border-radius:6px;text-decoration:none;transition:background .12s,color .12s;line-height:1.4}
.toc__link:hover,.toc__link.is-active{background:var(--cream);color:var(--navy)}
.toc__link.is-active{font-weight:600}
/* Share Bar */
.article-share{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:36px 0}
.article-share__label{font-family:var(--fh);font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;flex-shrink:0}
.share-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--fh);font-size:.82rem;font-weight:600;padding:7px 14px;border-radius:8px;border:1px solid var(--border);background:var(--white);color:var(--text);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.share-btn:hover{background:var(--surface)}
.share-btn--li{border-color:#0a66c2;color:#0a66c2}
.share-btn--li:hover{background:#e8f0fa}
.share-btn--wa{border-color:#25d366;color:#128c50}
.share-btn--wa:hover{background:#e9fbf0}
.share-btn--copy{border-color:var(--border)}
/* Feedback-Widget */
.article-feedback{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:20px 24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:36px 0}
.article-feedback__q{font-family:var(--fh);font-size:.95rem;font-weight:600;color:var(--navy);flex:1;min-width:200px}
.article-feedback__btns{display:flex;gap:8px}
.article-feedback__thanks{font-family:var(--fh);font-size:.9rem;color:var(--navy);font-weight:600;margin:0}
.fb-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--fh);font-size:.85rem;font-weight:600;padding:8px 18px;border-radius:8px;border:1px solid var(--border);background:var(--white);color:var(--text);cursor:pointer;transition:background .15s,border-color .15s}
.fb-btn--yes:hover{background:#f0fdf4;border-color:#86efac;color:#16a34a}
.fb-btn--no:hover{background:#fef2f2;border-color:#fca5a5;color:#dc2626}
.article-feedback__form{width:100%;margin-top:4px}
.article-feedback__form-label{font-family:var(--fh);font-size:.88rem;font-weight:600;color:var(--navy);margin:0 0 10px}
.fb-textarea{width:100%;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-family:var(--fh);font-size:.88rem;color:var(--text);background:var(--white);resize:vertical;box-sizing:border-box;margin-bottom:8px;outline:none}
.fb-textarea:focus{border-color:var(--navy)}
.fb-form-row{display:flex;gap:8px;flex-wrap:wrap}
.fb-email{flex:1;min-width:160px;border:1px solid var(--border);border-radius:8px;padding:9px 12px;font-family:var(--fh);font-size:.88rem;color:var(--text);background:var(--white);outline:none}
.fb-email:focus{border-color:var(--navy)}
.fb-submit{flex-shrink:0;background:var(--navy);color:#fff;font-family:var(--fh);font-size:.85rem;font-weight:700;padding:9px 20px;border-radius:8px;border:none;cursor:pointer;transition:background .15s}
.fb-submit:hover{background:#174f72}
/* YouTube-Facade – lädt erst auf Klick (bis dahin kein Request an Google) */
.video-embed{position:relative;margin:32px 0;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:var(--navy)}
.video-embed iframe,.video-embed__poster{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-embed__poster{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:0;cursor:pointer;background:linear-gradient(135deg,#1f628e 0%,#14425f 100%);color:#fff;font-family:var(--fh);font-size:.82rem}
.video-embed__play{width:66px;height:66px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;transition:transform .18s,background .18s}
.video-embed__play::before{content:"";border-style:solid;border-width:11px 0 11px 19px;border-color:transparent transparent transparent #fff;margin-left:5px}
.video-embed__poster:hover .video-embed__play{transform:scale(1.08);background:#dc2626}
.video-embed__note{opacity:.82;max-width:80%;line-height:1.5}
/* Verweis-Links aus WP-Embed-Blöcken */
.embed-link{margin:10px 0}
.embed-link a{display:inline-flex;align-items:baseline;gap:8px;font-family:var(--fh);font-size:.95rem;font-weight:600;color:var(--navy);text-decoration:none;border-bottom:1px solid var(--border)}
.embed-link a::before{content:"→";opacity:.55}
.embed-link a:hover{border-bottom-color:var(--navy)}
/* Inline Newsletter – Formular direkt im Artikelfluss */
.nl-inline{background:linear-gradient(135deg,#0d2d45 0%,#1f628e 55%,#1a5a85 100%);border-radius:var(--radius);padding:32px 32px 28px;margin:48px 0;position:relative;overflow:hidden}
.nl-inline::before{content:'';position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(224,157,113,.08);pointer-events:none}
.nl-inline::after{content:'';position:absolute;left:-40px;bottom:-50px;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.04);pointer-events:none}
.nl-inline__inner{position:relative;z-index:1}
.nl-inline__head{margin-bottom:22px}
.nl-inline__eyebrow{font-family:var(--fh);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#e09d71;margin:0 0 8px}
.nl-inline__title{font-family:var(--fh);font-size:1.25rem;font-weight:800;color:#fff!important;margin:0 0 8px;line-height:1.2}
.nl-inline__sub{font-family:var(--fb);font-size:.9rem;color:rgba(255,255,255,.75);margin:0;line-height:1.65}
.nl-inline__form{margin:0}
.nl-inline__fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
@media(max-width:560px){.nl-inline__fields{grid-template-columns:1fr}}
.nl-inline__field{display:flex;flex-direction:column;gap:5px}
.nl-inline__label{font-family:var(--fh);font-size:.75rem;font-weight:600;color:rgba(255,255,255,.7);letter-spacing:.03em}
.nl-inline__form input[type=text],.nl-inline__form input[type=email]{font-family:var(--fh);font-size:.9rem;color:#1a2e3b;background:rgba(255,255,255,.96);border:2px solid transparent;border-radius:8px;padding:10px 14px;width:100%;outline:none;transition:border-color .2s,box-shadow .2s}
.nl-inline__form input[type=text]:focus,.nl-inline__form input[type=email]:focus{border-color:#e09d71;box-shadow:0 0 0 3px rgba(224,157,113,.3)}
.nl-inline__form input::placeholder{color:#9baebb}
.nl-inline__optin{display:flex;align-items:flex-start;gap:9px;font-family:var(--fh);font-size:.8rem;color:rgba(255,255,255,.65);line-height:1.5;cursor:pointer;margin-bottom:16px}
.nl-inline__optin input[type=checkbox]{flex-shrink:0;width:16px;height:16px;margin-top:2px;accent-color:#e09d71;cursor:pointer}
.nl-inline__optin a{color:rgba(255,255,255,.85);text-decoration:underline;text-underline-offset:2px}
.nl-inline__optin a:hover{color:#fff}
.nl-inline__submit-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.nl-inline__btn{flex-shrink:0;display:inline-flex;align-items:center;background:#e09d71;color:#fff;font-family:var(--fh);font-size:.9rem;font-weight:700;padding:12px 24px;border-radius:50px;border:none;cursor:pointer;transition:background .15s,transform .15s;white-space:nowrap;text-decoration:none}
.nl-inline__btn:hover{background:#c47a3a;color:#fff;transform:translateY(-1px)}
.nl-inline__btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.nl-inline__legal{font-family:var(--fh);font-size:.75rem;color:rgba(255,255,255,.45);margin:0;line-height:1.5}
.nl-inline .form-status{margin:16px 0 16px 0;padding:10px 14px;border-radius:8px;font-family:var(--fh);font-size:.85rem;font-weight:500}
.nl-inline .form-status--success{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2)}
.nl-inline .form-status--error{background:rgba(220,80,60,.3);color:#fff;border:1px solid rgba(255,100,80,.4)}
/* Quiz / Wissenscheck */
.article-quiz{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:28px 28px 24px;margin:50px 0}
.quiz__eyebrow{font-family:var(--fh);font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:6px}
.quiz__title{font-family:var(--fh);font-size:1.15rem;font-weight:800;color:var(--navy) !important6/85;margin:0 0 4px}
.quiz__subtitle{font-family:var(--fb);font-size:.85rem;color:var(--muted);margin:0 0 24px}
.quiz__q{margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--border)}
.quiz__q:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.quiz__q-num{font-weight:700;color:var(--accent);margin-right:4px}
.quiz__q-text{font-family:var(--fh);font-size:.95rem;font-weight:600;color:var(--navy);margin:0 0 12px;line-height:1.4}
.quiz__options{display:flex;flex-direction:column;gap:8px}
.quiz__opt{display:flex;align-items:center;gap:10px;padding:9px 14px;border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:background .12s,border-color .12s;font-family:var(--fh);font-size:.88rem;color:var(--text)}
.quiz__opt:hover{background:var(--cream);border-color:var(--navy)}
.quiz__opt input{flex-shrink:0;accent-color:var(--navy)}
.quiz__opt--correct{background:#f0fdf4!important;border-color:#86efac!important;color:#15803d!important;font-weight:600}
.quiz__opt--wrong{background:#fef2f2!important;border-color:#fca5a5!important;color:#dc2626!important}
.quiz__footer{margin-top:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.quiz__submit-btn{background:var(--navy);color:#fff;font-family:var(--fh);font-size:.88rem;font-weight:700;padding:10px 24px;border-radius:8px;border:none;cursor:pointer;transition:background .15s}
.quiz__submit-btn:hover{background:#2a7aad}
.quiz__submit-btn:disabled{opacity:.5;cursor:default}
.quiz__result{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--cream);border-radius:8px;margin-top:16px}
.quiz__result-emoji{font-size:1.6rem;flex-shrink:0}
.quiz__result-score{font-family:var(--fh);font-size:.95rem;font-weight:700;color:var(--navy);display:block}
.quiz__result-msg{font-family:var(--fb);font-size:.85rem;color:var(--muted);margin:2px 0 0}

/* ─── Print ──────────────────────────────────────────────────────────────── */
@media print{
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .site-header,.site-footer,.sticky-cta,.btt,#read-progress,
  .article-share,.article-feedback,.nl-inline,.article-nav,
  .article-sidebar,.freebie,.nav-toggle,.dark-toggle,
  #freebiePopup,.toc__toggle{display:none!important}
  body{font-size:11pt;line-height:1.6;color:#000;background:#fff}
  .article-wrap,.page-wrap,.page-content{max-width:100%;padding:0;margin:0}
  .article-body{display:block}
  .article-toc{border:1px solid #ccc;padding:12px;margin-bottom:20px;page-break-inside:avoid}
  .article-toc .toc__list{display:flex!important}
  h1,h2,h3{page-break-after:avoid;color:#000}
  p,li{orphans:3;widows:3}
  img{max-width:100%;page-break-inside:avoid}
  .article-hero-img{width:100%;margin:0 0 20px;aspect-ratio:auto;max-height:200px}
  a[href]::after{content:" (" attr(href) ")";font-size:9pt;color:#555}
  a[href^="#"]::after,a[href^="javascript"]::after,.share-btn::after,.fb-btn::after{content:none}
  .article-intro{border-left:3px solid #999;padding-left:12px;color:#333}
}

/* ─── Reading Progress Bar ──────────────────────────────────────────────── */
#read-progress{position:fixed;top:0;left:0;width:0%;height:3px;background:linear-gradient(90deg,var(--clr-accent),#c47a3a);z-index:9999;transition:width .1s linear;pointer-events:none}

/* ─── Dark Mode Toggle ──────────────────────────────────────────────────── */
.dark-toggle{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:50%;width:36px;height:36px;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:background .2s;flex-shrink:0}
.dark-toggle:hover{background:rgba(255,255,255,.15)}

/* ─── Sticky CTA (mobile) ───────────────────────────────────────────────── */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:700;padding:12px 16px;background:var(--clr-primary,#1f628e);box-shadow:0 -4px 20px rgba(0,0,0,.22);align-items:center;justify-content:space-between;gap:12px}
@media(max-width:768px){.sticky-cta{display:flex}}
.sticky-cta.is-hidden{transform:translateY(100%);transition:transform .3s ease}
.sticky-cta.is-visible{transform:translateY(0);transition:transform .3s ease}
.sticky-cta__text{font-family:var(--font-sans);font-size:.85rem;color:rgba(255,255,255,.85);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky-cta__btn{flex-shrink:0;background:var(--clr-accent,#e09d71);color:#fff;font-family:var(--font-sans);font-size:.85rem;font-weight:700;padding:9px 18px;border-radius:8px;text-decoration:none;white-space:nowrap;transition:background .15s}
.sticky-cta__btn:hover{background:#c47a3a;text-decoration:none}
.sticky-cta__close{background:none;border:none;color:rgba(255,255,255,.55);font-size:1.2rem;cursor:pointer;padding:4px;line-height:1;flex-shrink:0}
.sticky-cta__close:hover{color:#fff}

/* ─── Back-to-Top ────────────────────────────────────────────── */
.btt{position:fixed;bottom:28px;right:28px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;text-decoration:none;opacity:0;transform:translateY(12px);transition:opacity .3s,transform .3s;z-index:800;pointer-events:none}
.btt.visible{opacity:1;transform:none;pointer-events:auto}
.btt__ring{position:absolute;inset:0;width:44px;height:44px;transform:rotate(-90deg)}
.btt__track{stroke:rgba(255,255,255,.2)}
.btt__progress{stroke:var(--clr-accent,#e09d71);transition:stroke-dashoffset .1s linear}
.btt__arrow{position:relative;font-size:1.1rem;color:#fff;line-height:1;background:var(--clr-primary,#1f628e);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.25)}
.btt:hover .btt__arrow{background:var(--clr-accent,#e09d71)}