:root{
  --primary:#003A8C; --primary-dark:#002a66; --accent:#E30613; --bg:#F5F7FB; --text:#0F172A; --muted:#64748b; --white:#ffffff;
  --site-title-size: 2rem;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0; overflow-x:hidden}
body{ font-family:system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif; color:var(--text); background:var(--bg); line-height:1.7 }
h1,h2,h3,h4{ font-weight:800; letter-spacing:.2px }
a{ color:var(--primary); text-decoration:none } a:hover{ color:var(--primary-dark) }
img,iframe,video{ max-width:100%; height:auto }

.container{ width:min(1200px,92vw); margin:0 auto; }

.site-header{ background:var(--white); border-bottom:2px solid var(--primary); position:sticky; top:0; z-index:1000 }
.navbar{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0 }
.branding{ display:flex; align-items:center; gap:14px; flex:1 1 auto; min-width:0 }
.site-logo{ width:48px; aspect-ratio:1/1; border-radius:8px; background: var(--primary) }
.branding .title{ font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size: var(--site-title-size); }
.branding .title a{ color:inherit; text-decoration:none }

.menu{ list-style:none; display:flex; gap:6px; margin:0; padding:0; flex-wrap:wrap }
.menu a{ display:block; padding:10px 14px; border-radius:10px; color:var(--text); min-height:44px }
.menu a:hover,.menu .current-menu-item>a{ background:#eef2ff; color:var(--primary) }

.menu-toggle{ display:none; border:2px solid var(--primary); background:transparent; border-radius:10px; padding:10px 12px; font-weight:800; text-transform:uppercase }

.button{ background:var(--primary); color:#fff; padding:12px 18px; border-radius:9999px; display:inline-block; font-weight:800; text-transform:uppercase; font-size:.9rem; letter-spacing:.5px }
.button.ghost{ background:transparent; color:var(--primary); border:2px solid var(--primary) }
.button.accent{ background:var(--accent) }

.hero{ color:white; padding:32px 0 12px; background: linear-gradient(180deg, rgba(0,58,140,.86) 0%, rgba(0,42,102,.92) 100%); }
.hero h1{ font-size: clamp(2.2rem,1.32rem + 3.3vw,3.63rem); margin:0 0 8px 0 }
.hero p{ color:#e5e7eb; max-width:74ch; font-weight:600; margin:0 }
.cta{ display:flex; gap:12px; margin-top:14px; flex-wrap:wrap }

.grid{ display:grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap:18px; width:100% }
.card{ background:var(--white); border:1px solid #e5e7eb; border-radius:16px; padding:18px; box-shadow:0 6px 18px -12px rgba(0,42,102,.25); max-width:100% }
.card h3{ margin-top:0 }

.section{ padding:26px 0 }
.post-list article{ background:var(--white); border:1px solid #e5e7eb; border-radius:16px; overflow:hidden; display:flex; flex-direction:column }
.post-list .thumb{ aspect-ratio:16/9; background:#e5e7eb }
.post-list .wrap{ padding:14px }
.meta{ color:var(--muted); font-size:.9rem }
.badge{ display:inline-block; padding:6px 10px; border-radius:9999px; background:#e6eefc; color:#001b44; font-weight:800; text-transform:uppercase; font-size:.75rem; border:1px solid rgba(255,255,255,.4) }

.sidebar{ position:sticky; top:98px }
.content-with-sidebar{ display:grid; grid-template-columns:1fr; gap:22px }
@media (min-width: 992px){ .content-with-sidebar{ grid-template-columns: 1.7fr .9fr } }

.fb-embed-placeholder { overflow: hidden; max-width: 100%; }
.fb-embed-placeholder iframe{ width:100% !important; height:680px; border:none; display:block }

/* Mobile improvements */
:root{ --fs-body: clamp(15px, 0.8vw + 13px, 18px); --fs-h1: clamp(28px, 2.4vw + 18px, 48px); --fs-h2: clamp(22px, 1.6vw + 16px, 34px); --fs-h3: clamp(18px, 1.2vw + 14px, 24px) }
body{ font-size: var(--fs-body) } h1{ font-size: var(--fs-h1); line-height:1.15 } h2{ font-size: var(--fs-h2) } h3{ font-size: var(--fs-h3) }

@media (max-width: 991px){
  .site-header .navbar{ flex-wrap:wrap }
  .site-nav{ width:100%; order:3 }
  .menu{ display:none; flex-direction:column; gap:0; background:var(--white); border:1px solid #e5e7eb; border-radius:12px; padding:8px }
  .menu.open{ display:flex }
  .menu a{ padding:12px 14px }
  .menu-toggle{ display:inline-block; margin-left:auto }
  .branding{ width:100%; justify-content:space-between }
  .content-with-sidebar{ grid-template-columns: 1fr }
  .grid{ grid-template-columns: 1fr }
}

/* Impressum kompakter */
.compact-impressum .entry-content p{ margin:6px 0; line-height:1.5 }

/* Consent Box */
#fb-consent-box { background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:16px; }
#fb-consent-box p { margin:0 0 10px 0; }

/* Containment to avoid overflow */
.site-main, .container, .grid, .card, .entry-content { max-width: 100%; }
.section { padding-left: 12px; padding-right: 12px; }
.card { overflow: hidden; }