
.search-overlay { display: none; position: fixed; inset: 0; z-index: 200; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); padding: 20vh 1rem 0; }
.search-overlay.active { display: block; }
.search-box { max-width: 600px; margin: 0 auto; position: relative; }
.search-box input { width: 100%; padding: 1rem 1.25rem 1rem 3rem; font-size: 1.125rem; font-family: var(--font-body); border: 2px solid var(--border); border-radius: var(--radius); background: var(--bg-card); color: var(--text); outline: none; transition: border-color 0.2s; }
.search-box input:focus { border-color: var(--color-primary); }
.search-box svg { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--text-muted); width: 20px; height: 20px; }
.search-close { position: absolute; top: 1.5rem; right: 1.5rem; background: none; border: none; color: var(--text-secondary); cursor: pointer; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.search-close svg { width: 24px; height: 24px; }
.mobile-menu-backdrop { display: none; position: fixed; inset: 0; z-index: 140; background: rgba(0,0,0,0.5); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.mobile-menu-backdrop.active { display: block; }
.mobile-menu { display: none; position: fixed; top: 0; left: 0; bottom: 0; width: min(300px, 85vw); z-index: 150; background: var(--bg); padding: 0; flex-direction: column; overflow-y: auto; -webkit-overflow-scrolling: touch; transform: translateX(-100%); transition: transform 0.3s ease; box-shadow: var(--shadow-lg); }
.mobile-menu.active { display: flex; transform: translateX(0); }
.mobile-menu-header { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-light); min-height: var(--nav-height); }
.mobile-menu-header strong { font-family: var(--font-heading); font-size: 1.1rem; color: var(--text); }
.mobile-menu-close { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; border: none; background: transparent; color: var(--text-secondary); cursor: pointer; }
.mobile-menu-close:hover { background: var(--bg-secondary); color: var(--text); }
.mobile-menu-close svg { width: 20px; height: 20px; }
.mobile-menu-nav { padding: 0.75rem 1rem; flex: 1; }
.mobile-menu-nav a { display: flex; align-items: center; padding: 0.875rem 0.75rem; font-size: 1rem; color: var(--text); font-weight: 500; border-radius: 8px; text-decoration: none; min-height: 48px; transition: background 0.15s; }
.mobile-menu-nav a:hover { background: var(--bg-secondary); color: var(--color-primary); text-decoration: none; }
.site-footer { border-top: 1px solid var(--border); margin-top: 4rem; padding: 3rem 0 2rem; background: var(--bg-secondary); }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; margin-bottom: 2rem; }
@media (min-width: 768px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr; } }
.footer-brand { font-family: var(--font-heading); font-size: 1.125rem; font-weight: 700; margin-bottom: 0.5rem; color: var(--text); }
.footer-desc { font-size: 0.875rem; color: var(--text-secondary); line-height: 1.6; }
.footer-heading { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-secondary); margin-bottom: 0.75rem; }
.footer-links { list-style: none; padding: 0; }
.footer-links li { margin-bottom: 0.4rem; }
.footer-links a { color: var(--text-secondary); font-size: 0.875rem; text-decoration: none; }
.footer-links a:hover { color: var(--color-primary); }
.footer-bottom { padding-top: 1.5rem; border-top: 1px solid var(--border-light); font-size: 0.8rem; color: var(--text-secondary); text-align: center; }
.search-results { max-width: 600px; margin: 1.5rem auto 0; max-height: 50vh; overflow-y: auto; }
.search-result-item { display: block; padding: 0.75rem 1rem; border-radius: 8px; text-decoration: none; color: inherit; transition: background 0.15s; }
.search-result-item:hover { background: var(--bg-secondary); text-decoration: none; }
.search-result-item strong { display: block; font-size: 0.95rem; color: var(--text); margin-bottom: 0.2rem; }
.search-result-item p { font-size: 0.8rem; color: var(--text-secondary); margin: 0; line-height: 1.4; }
.search-empty { text-align: center; color: var(--text-muted); font-size: 0.9rem; padding: 1.5rem; }
.reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.author-avatar, .byline-avatar, .author-avatar-lg, .author-box-img, .author-hero img[class*="avatar"], .author-box img[class*="avatar"], .author-box img[class*="author"], .article-byline img[class*="byline"], .author-box-bottom img { display: block; border-radius: 50% !important; clip-path: circle(50% at 50% 50%); object-fit: cover !important; aspect-ratio: 1 / 1 !important; overflow: hidden; flex-shrink: 0; }
.author-box-bottom .author-box-img, .author-box-bottom img[class*="author"], .article-byline .byline-avatar { width: 64px !important; height: 64px !important; min-width: 64px !important; min-height: 64px !important; max-width: 64px !important; max-height: 64px !important; }
.author-card .author-avatar, .author-bio-card .author-avatar { width: 64px; height: 64px; }
body { background: radial-gradient(ellipse at 20% 0%, color-mix(in srgb, var(--color-primary) 6%, transparent) 0%, transparent 50%), radial-gradient(ellipse at 80% 100%, color-mix(in srgb, var(--color-secondary) 5%, transparent) 0%, transparent 50%), var(--bg); }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } .hero-card, .article-card { transition: none; } .hero-card:hover, .article-card:hover { transform: none; } }
/* --- Mobile Sticky Newsletter Bar --- */
.nl-sticky-bar { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 120; background: var(--bg-card); border-top: 1px solid var(--border); box-shadow: 0 -4px 20px rgba(0,0,0,0.12); padding: 0.75rem 1rem; transform: translateY(100%); transition: transform 0.4s ease; }
.nl-sticky-bar.visible { transform: translateY(0); }
.nl-sticky-form { display: flex; flex-direction: column; gap: 0.5rem; max-width: 480px; margin: 0 auto; }
.nl-sticky-text { font-size: 0.85rem; color: var(--text); text-align: center; line-height: 1.3; }
.nl-sticky-text strong { color: var(--color-primary); }
.nl-sticky-row { display: flex; gap: 0.5rem; }
.nl-sticky-input { flex: 1; min-width: 0; padding: 0.55rem 0.75rem; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-secondary); color: var(--text); font-size: 0.85rem; font-family: var(--font-body); }
.nl-sticky-input:focus { border-color: var(--color-primary); outline: none; }
.nl-sticky-btn { padding: 0.55rem 1rem; background: var(--color-primary); color: #fff; border: none; border-radius: 8px; font-weight: 600; font-size: 0.85rem; font-family: var(--font-body); cursor: pointer; white-space: nowrap; transition: opacity 0.2s; }
.nl-sticky-btn:hover { opacity: 0.9; }
.nl-sticky-close { position: absolute; top: 0.5rem; right: 0.5rem; background: none; border: none; color: var(--text-muted); font-size: 1.25rem; cursor: pointer; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background 0.15s; }
.nl-sticky-close:hover { background: var(--bg-secondary); color: var(--text); }
@media (min-width: 768px) { .nl-sticky-bar { display: none !important; } }
html.dark .nl-sticky-bar { box-shadow: 0 -4px 20px rgba(0,0,0,0.35); }
.newsletter-placeholder { font-size: 0.8rem; color: var(--text-muted); padding: 1rem; text-align: center; border: 2px dashed var(--border); border-radius: 8px; }
.newsletter-form { display: flex; flex-direction: column; gap: 0.5rem; }
.newsletter-input { width: 100%; padding: 0.6rem 0.75rem; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-secondary); color: var(--text); font-size: 0.85rem; font-family: var(--font-body); }
.newsletter-input:focus { border-color: var(--color-primary); outline: none; }
.newsletter-btn { width: 100%; padding: 0.6rem; background: var(--color-primary); color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; font-size: 0.85rem; font-family: var(--font-body); transition: opacity 0.2s; }
.newsletter-btn:hover { opacity: 0.9; }
.newsletter-placeholder { font-size: 0.8rem; color: var(--text-muted); padding: 1rem; text-align: center; border: 2px dashed var(--border); border-radius: 8px; }
.category-section { margin-bottom: 2rem; }
.category-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; padding-bottom: 0.4rem; border-bottom: 2px solid var(--color-primary); }
.category-header h2 { font-size: 1.1rem; font-weight: 700; color: var(--text); margin: 0; }
.category-more { font-size: 0.8rem; font-weight: 600; color: var(--color-primary); text-decoration: none; white-space: nowrap; }
.category-more:hover { text-decoration: underline; }
.home-card-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .home-card-grid { grid-template-columns: repeat(2, 1fr); } }
.article-card { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: var(--bg-card); text-decoration: none; color: inherit; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.article-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); text-decoration: none; }
.article-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.article-card-body { padding: 1rem 1.25rem 1.25rem; flex: 1; display: flex; flex-direction: column; }
.article-card-body h3 { font-size: 1rem; font-weight: 700; line-height: 1.3; margin-bottom: 0.5rem; color: var(--text); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.article-card-body p { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.55; flex: 1; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.article-card-body time { font-size: 0.7rem; color: var(--text-muted); margin-top: auto; padding-top: 0.75rem; letter-spacing: 0.03em; display: flex; align-items: center; gap: 0.35rem; }
.hero-meta time { display: inline-flex; align-items: center; gap: 0.35rem; }
.pulse-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--color-primary); flex-shrink: 0; animation: pulse-glow 2s ease-in-out infinite; }
@keyframes pulse-glow { 0%,100% { opacity: 1; box-shadow: 0 0 0 0 var(--color-primary); } 50% { opacity: 0.7; box-shadow: 0 0 6px 2px var(--color-primary); } }
time.time-fresh { color: var(--color-primary); font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .pulse-dot { animation: none; } }
.content-label { display: inline-block; font-size: 0.65rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-primary); margin-bottom: 0.3rem; }
@media (min-width: 640px) { .article-card-body h3 { font-size: 1.05rem; } }
.home-sidebar { display: flex; flex-direction: column; gap: 1.5rem; align-self: start; }
.sidebar-widget { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; overflow: hidden; }
.sidebar-widget h3 { font-size: 0.95rem; font-weight: 700; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--border-light); color: var(--text); }
.trending-list { list-style: none; padding: 0; margin: 0; counter-reset: trending; }
.trending-list li { margin-bottom: 0.1rem; }
.trending-list a { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.5rem 0.25rem; border-radius: 8px; text-decoration: none; color: inherit; transition: background 0.15s; }
.trending-list a:hover { background: var(--bg-secondary); text-decoration: none; }
.trending-rank { flex-shrink: 0; width: 24px; height: 24px; border-radius: 6px; background: var(--bg-secondary); color: var(--color-primary); font-size: 0.75rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.trending-title { font-size: 0.85rem; font-weight: 500; line-height: 1.35; color: var(--text); }
.glossary-teaser { display: block; text-decoration: none; color: inherit; padding: 0.75rem; border-radius: 8px; background: var(--bg-secondary); transition: background 0.15s; }
.glossary-teaser:hover { background: var(--border-light); text-decoration: none; }
.glossary-teaser strong { display: block; font-size: 0.95rem; color: var(--color-primary); margin-bottom: 0.3rem; }
.glossary-teaser p { font-size: 0.8rem; color: var(--text-secondary); line-height: 1.5; margin: 0; }
.author-spotlight { display: flex; gap: 0.75rem; text-decoration: none; color: inherit; padding: 0.5rem; border-radius: 8px; transition: background 0.15s; }
.author-spotlight:hover { background: var(--bg-secondary); text-decoration: none; }
.author-spotlight img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.author-spotlight strong { display: block; font-size: 0.9rem; color: var(--text); margin-bottom: 0.2rem; }
.author-spotlight p { font-size: 0.78rem; color: var(--text-secondary); line-height: 1.4; margin: 0; }
.ad-widget { text-align: center; }
.ad-label { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); display: block; margin-bottom: 0.4rem; }
.ad-content { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.5; }
.ad-placeholder { min-height: 200px; border: 2px dashed var(--border); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 0.8rem; margin-top: 0.25rem; }

/* --- Glossary A-Z Index --- */
.glossary-search-wrap { margin-bottom: 1.25rem; }
.glossary-search-input { width: 100%; padding: 0.75rem 1rem 0.75rem 2.75rem; font-size: 1rem; font-family: var(--font-body); border: 2px solid var(--border); border-radius: var(--radius); background: var(--bg-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 0.875rem center; color: var(--text); outline: none; transition: border-color 0.2s; }
.glossary-search-input:focus { border-color: var(--color-primary); }
.glossary-az-bar { display: flex; flex-wrap: wrap; gap: 0.25rem; padding: 0.75rem 0; margin-bottom: 1.5rem; position: sticky; top: var(--nav-height, 60px); background: var(--bg); z-index: 10; border-bottom: 1px solid var(--border-light); }
.glossary-az-link { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; height: 2rem; font-size: 0.8rem; font-weight: 600; font-family: var(--font-heading); border-radius: 6px; text-decoration: none; color: var(--color-primary); background: var(--bg-card); border: 1px solid var(--border-light); transition: all 0.15s; cursor: pointer; }
.glossary-az-link:hover { background: var(--color-primary); color: #fff; text-decoration: none; }
.glossary-az-disabled { color: var(--text-muted); opacity: 0.4; cursor: default; border-color: transparent; background: transparent; }
.glossary-az-disabled:hover { background: transparent; color: var(--text-muted); }
.glossary-letter-section { margin-bottom: 2rem; }
.glossary-letter-heading { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; color: var(--color-primary); padding-bottom: 0.5rem; border-bottom: 2px solid var(--color-primary); margin-bottom: 0.75rem; }
.glossary-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.glossary-item a { display: flex; flex-direction: column; padding: 0.625rem 0.75rem; border-radius: 8px; text-decoration: none; color: inherit; transition: background 0.15s; }
.glossary-item a:hover { background: var(--bg-secondary); text-decoration: none; }
.glossary-term { font-size: 0.95rem; color: var(--text); }
.glossary-def { font-size: 0.8rem; color: var(--text-secondary); line-height: 1.4; margin-top: 0.15rem; }
.glossary-no-results { text-align: center; color: var(--text-muted); font-size: 0.95rem; padding: 2rem 0; }
@media (max-width: 767px) { .glossary-az-link { min-width: 1.75rem; height: 1.75rem; font-size: 0.7rem; } .glossary-az-bar { gap: 0.2rem; } }
/* --- FAQ Accordion (shared: articles + glossary) --- */
.faq-section { margin: 2.5rem 0 1.5rem; }
.faq-section h2 { font-size: 1.5rem; font-weight: 700; margin-bottom: 1.25rem; padding-bottom: 0.75rem; border-bottom: 2px solid var(--border); color: var(--text); }
.faq-item { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: 0.75rem; }
.faq-item details { padding: 0; }
.faq-summary { padding: 1rem 1.25rem; font-weight: 600; font-size: 0.95rem; color: var(--text); cursor: pointer; background: var(--bg-secondary); list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.faq-summary::-webkit-details-marker { display: none; }
.faq-chevron { flex-shrink: 0; transition: transform 0.2s ease; color: var(--text-muted); }
details[open] > .faq-summary .faq-chevron { transform: rotate(180deg); }
.faq-answer { padding: 0.75rem 1.25rem 1rem; font-size: 0.95rem; line-height: 1.7; color: var(--text-secondary); border-top: 1px solid var(--border); }
.content-timestamp { margin-top: 2rem; font-size: 0.8rem; color: var(--text-muted); font-style: italic; }

/* ===== Design System — SSR ===== */
:root {
  --bg: #f8f8f8;
  --fg: #1a1a2e;
  --text: #1a1a2e;
  --text-secondary: #4b5563;
  --text-muted: #6b7280;
  --bg-card: #ffffff;
  --bg-secondary: #f3f4f6;
  --card-bg: #ffffff;
  --muted: #6b7280;
  --muted-light: #9ca3af;
  --border: #e5e7eb;
  --border-light: #f3f4f6;
  --border-color: #e5e7eb;
  --glass-bg: rgba(255,255,255,0.72);
  --glass-border: rgba(226,232,240,0.5);
  --radius: 12px;
  --shadow-lg: 0 10px 40px rgba(0,0,0,0.08);
  --nav-height: 56px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0c0f1a;
    --fg: #e8ecf4;
    --text: #e8ecf4;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    --bg-card: rgba(15,20,35,0.72);
    --bg-secondary: rgba(30,40,60,0.5);
    --card-bg: rgba(15,20,35,0.72);
    --muted: #8896ab;
    --muted-light: #64748b;
    --border: rgba(255,255,255,0.08);
    --border-light: rgba(255,255,255,0.04);
    --border-color: rgba(255,255,255,0.08);
    --glass-bg: rgba(15,20,35,0.72);
    --glass-border: rgba(255,255,255,0.08);
    --shadow-lg: 0 10px 40px rgba(0,0,0,0.3);
  }
  html { color-scheme: dark; }
  body { background: var(--bg); color: var(--fg); }
  a { color: #60a5fa; }
  .nav { border-color: var(--border); background: var(--glass-bg); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
  footer { border-color: var(--border); background: rgba(15,20,35,0.3); }
  .glass-card { background: var(--glass-bg); border-color: var(--glass-border); }
  .article-card { background: var(--bg-card); border-color: var(--border); }
  .article-card-body h3, .article-card-body h2 { color: var(--text); }
}
body { background: var(--bg); color: var(--fg); }

/* Glass nav */
.nav { position: sticky; top: 0; z-index: 50; background: var(--glass-bg); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--glass-border); padding: 0 1.5rem; height: var(--nav-height); }
.nav .container { display: flex; align-items: center; justify-content: space-between; height: var(--nav-height); max-width: 1280px; margin: 0 auto; }
.nav-logo { height: 32px; }
.nav-links { display: flex; gap: 1.5rem; }
.nav-link { font-size: 0.875rem; font-weight: 500; color: var(--text-muted); transition: color 0.2s; }
.nav-link:hover { color: var(--text); text-decoration: none; }

/* Glass card */
.glass-card { background: var(--glass-bg); backdrop-filter: blur(20px); border: 1px solid var(--glass-border); border-radius: var(--radius); }

/* Container */
.container { max-width: 1280px; margin: 0 auto; padding: 0 1rem; }
@media (min-width: 640px) { .container { padding: 0 1.5rem; } }
@media (min-width: 1024px) { .container { padding: 0 2rem; } }

/* Footer */
footer { border-top: 1px solid var(--border); background: rgba(255,255,255,0.3); padding: 3rem 0; margin-top: 3rem; }
footer .footer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
@media (max-width: 768px) { footer .footer-grid { grid-template-columns: 1fr; } }
footer h4 { font-family: var(--font-heading); font-size: 0.875rem; font-weight: 600; margin-bottom: 0.75rem; }
footer p, footer a, footer li { font-size: 0.75rem; color: var(--text-muted); line-height: 1.8; }
footer a:hover { color: var(--text); }
footer .footer-bottom { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border); text-align: center; font-size: 0.75rem; color: var(--text-muted); }

/* Breadcrumbs */
.breadcrumbs { display: flex; gap: 0.5rem; font-size: 0.75rem; color: var(--text-muted); margin-bottom: 1rem; }
.breadcrumbs a { color: var(--text-muted); }
.breadcrumbs a:hover { color: var(--text); }
.breadcrumbs .sep { color: var(--muted-light); }

/* Content Label */
.content-label { display: inline-flex; align-items: center; gap: 0.375rem; border-radius: 0.5rem; border: 1px solid; padding: 0.25rem 0.75rem; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.content-label--anzeige { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.content-label--sponsored { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.content-label--affiliate { background: #f3e8ff; color: #6b21a8; border-color: #e9d5ff; }

/* Prose styles */
.prose { font-size: 1.05rem; line-height: 1.8; }
.prose h2 { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; margin: 2rem 0 1rem; letter-spacing: -0.01em; }
.prose h3 { font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; margin: 1.5rem 0 0.75rem; }
.prose p { margin: 1rem 0; }
.prose a { color: var(--color-primary); }
.prose a:hover { text-decoration: underline; }
.prose img { border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.prose blockquote { border-left: 3px solid var(--color-primary); padding-left: 1rem; font-family: var(--font-heading); }
.prose ul, .prose ol { margin: 1rem 0; padding-left: 1.5rem; }
.prose strong { color: var(--text); }

/* Newsletter box */
.newsletter-box { padding: 1.25rem; }
.newsletter-box h3 { font-family: var(--font-heading); font-size: 0.875rem; font-weight: 600; margin-bottom: 0.5rem; }
.newsletter-box p { font-size: 0.75rem; color: var(--text-muted); margin-bottom: 0.75rem; }
.newsletter-box form { display: flex; gap: 0.5rem; }
.newsletter-box input { flex: 1; border-radius: 0.5rem; border: 1px solid var(--border); background: rgba(255,255,255,0.5); padding: 0.375rem 0.75rem; font-size: 0.75rem; }
.newsletter-box button { border-radius: 0.5rem; background: var(--color-primary); color: #fff; padding: 0.375rem 0.75rem; font-size: 0.75rem; font-weight: 500; border: none; cursor: pointer; }
.newsletter-box button:hover { opacity: 0.9; }


/* Sidebar Widgets (unified spacing for buildSidebarHtml output) */
.sidebar-widget { border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; background: var(--bg-card); }
.sidebar-widget + .sidebar-widget { margin-top: 1.25rem; }
.sidebar-widget h3 { font-family: var(--font-heading); font-size: 0.95rem; font-weight: 700; margin-bottom: 0.5rem; color: var(--text); }
.sidebar-widget p { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.5; margin-bottom: 0.75rem; }
.home-sidebar .sidebar-widget + .sidebar-widget { margin-top: 1.25rem; }


/* ToC Widget (unified for template toc-box + dynamic toc-widget) */
.toc-widget { padding: 1.25rem; }
.toc-widget h3 { font-family: var(--font-heading); font-size: 0.95rem; font-weight: 700; margin-bottom: 0.5rem; color: var(--text); }
.toc-list { list-style: none; padding: 0; counter-reset: toc; }
.toc-list li { counter-increment: toc; padding: 0.4rem 0; border-bottom: 1px solid var(--border-light); font-size: 0.8rem; }
.toc-list li:last-child { border-bottom: none; }
.toc-list a { color: var(--text-secondary); text-decoration: none; transition: color 0.2s; }
.toc-list a:hover, .toc-list a.active { color: var(--color-primary); font-weight: 600; }
