/* Navigationsbaum und Gruendungsband — erzeugt aus
   layouts/partials/sitenav.html durch scripts/build_standalone_nav.py.
   Fuer Seiten, deren Sicherheitsrichtlinie keine eingefuegten Stile
   zulaesst; sonst bringt sitenav-standalone.js den Stil selbst mit. */
:root{--nav-w:264px;--fb-h:36px}
/* Gruendungsband — auf jeder Seite, ueber die volle Breite; der Navigationsbaum
   liegt darueber, damit es rechts von ihm beginnt. Die Hoehe misst das Skript
   unten, weil der Text auf schmalen Schirmen umbricht. */
.founding-banner{position:fixed;top:0;left:0;right:0;z-index:45;background:linear-gradient(90deg,rgba(227,6,19,0.92),rgba(180,5,15,0.92));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,0.12);color:#fff;font-size:0.78rem;letter-spacing:0.06em;padding:9px 16px;text-align:center;font-weight:600;text-transform:uppercase;line-height:1.35}
.founding-banner .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ffd1d1;margin-right:8px;vertical-align:middle;animation:fb-pulse 2.4s ease-in-out infinite}
@keyframes fb-pulse{0%,100%{opacity:0.5;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
@media(max-width:640px){.founding-banner{font-size:0.7rem;padding:8px 12px;letter-spacing:0.04em}}
@media(prefers-reduced-motion:reduce){.founding-banner .dot{animation:none}}
body{padding-top:var(--fb-h)}
body.has-politiq-crumbs{padding-top:calc(var(--fb-h) + 40px)}
/* Not every layout sets border-box globally (the mitwirken pages do not); without
   this the padding would widen the rail beyond the space the body reserves. */
.sitenav,.sitenav *,.nav-toggle,.nav-toggle *{box-sizing:border-box}
.nav-toggle{position:fixed;top:calc(var(--fb-h) + 8px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));z-index:60;width:44px;height:44px;display:none;align-items:center;justify-content:center;background:rgba(20,26,42,0.9);border:1px solid rgba(255,255,255,0.1);border-radius:10px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nav-toggle:focus-visible{outline:2px solid #8ab4e8;outline-offset:2px}
.nav-toggle span{display:block;width:18px;height:2px;background:#a0b0c8;border-radius:2px;position:relative;transition:background 0.2s}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#a0b0c8;border-radius:2px;transition:transform 0.25s ease,top 0.25s ease}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
body.nav-open .nav-toggle span{background:transparent}
body.nav-open .nav-toggle span::before{top:0;transform:rotate(45deg)}
body.nav-open .nav-toggle span::after{top:0;transform:rotate(-45deg)}

.sitenav{position:fixed;top:0;left:0;z-index:55;width:var(--nav-w);height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:rgba(10,15,26,0.72);backdrop-filter:blur(14px);border-right:1px solid rgba(255,255,255,0.07);padding:22px 16px calc(24px + env(safe-area-inset-bottom));padding-left:calc(16px + env(safe-area-inset-left));text-align:left;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.15) transparent}
.sitenav::-webkit-scrollbar{width:6px}
.sitenav::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:3px}
.sitenav .nav-brand{display:flex;align-items:center;gap:10px;margin-bottom:20px;text-decoration:none}
.sitenav .nav-brand img{width:34px;height:34px;border-radius:50%;flex:0 0 34px}
.sitenav .nav-brand b{color:#eef0f4;font-size:0.9rem;font-weight:600;letter-spacing:0.03em;line-height:1.2}
.sitenav .nav-brand small{display:block;color:#5a6a88;font-size:0.62rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;margin-top:2px}

.sitenav details{border-top:1px solid rgba(255,255,255,0.05);padding:2px 0}
.sitenav details[open]>summary{color:#eef0f4}
.sitenav summary{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 8px;color:#8494b4;font-size:0.7rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;list-style:none;border-radius:7px;transition:color 0.2s,background 0.2s}
.sitenav summary::-webkit-details-marker{display:none}
.sitenav summary:hover{color:#eef0f4;background:rgba(255,255,255,0.04)}
.sitenav summary:focus-visible{outline:2px solid #8ab4e8;outline-offset:-2px}
.sitenav summary .chev{width:11px;height:11px;flex:0 0 11px;margin-left:auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform 0.25s ease}
.sitenav details[open] summary .chev{transform:rotate(90deg)}
/* Gattungsbegriffe vertragen Versalien, ein Markenname nicht. */
.sitenav summary.brandname{text-transform:none;letter-spacing:0.04em;font-size:0.82rem}

.sitenav ul{list-style:none;margin:2px 0 10px;padding:0 0 0 9px;border-left:1px solid rgba(255,255,255,0.07)}
.sitenav ul ul{margin-bottom:4px}
.sitenav a.item{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 10px;color:#94a4c4;font-size:0.8rem;line-height:1.35;text-decoration:none;border-radius:7px;transition:color 0.15s,background 0.15s}
.sitenav a.item:hover{color:#eef0f4;background:rgba(255,255,255,0.05)}
.sitenav a.item:focus-visible{outline:2px solid #8ab4e8;outline-offset:-2px}
.sitenav a.item.sub{font-size:0.76rem;color:#7a8aaa;min-height:36px;padding:6px 10px}
.sitenav a.item.sub:hover{color:#cfd8e8}
.sitenav a.item .ext{width:10px;height:10px;flex:0 0 10px;margin-left:auto;opacity:0.45;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sitenav .nav-foot{margin-top:16px;padding-top:8px;border-top:1px solid rgba(255,255,255,0.05);color:#3a4a68;font-size:0.68rem}
.sitenav .nav-foot a{display:flex;align-items:center;min-height:34px;padding:4px 10px;color:#5068a0;text-decoration:none;border-radius:7px}
.sitenav .nav-foot a:hover{color:#8ab4e8;background:rgba(255,255,255,0.04)}
.sitenav .nav-foot a:focus-visible{outline:2px solid #8ab4e8;outline-offset:-2px}

.topnav{top:var(--fb-h)}
/* Brotkrumen-Leiste — gleiche Stelle auf jeder Seite, gleiche Anmutung wie
   auf podcasts.politiq.ch. Sie erscheint nur, wo die Seite nicht schon eine
   eigene mitbringt. */
.politiq-topnav{position:fixed;top:var(--fb-h);left:0;right:0;z-index:44;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:8px 20px;background:rgba(10,15,26,0.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,0.07)}
.politiq-topnav .pt-breadcrumb{display:flex;align-items:center;gap:9px;font-size:0.74rem;letter-spacing:0.04em;color:#5a6a88;margin:0}
.politiq-topnav .pt-breadcrumb a{display:inline-flex;align-items:center;gap:6px;color:#9aaacc;text-decoration:none;transition:color 0.2s}
.politiq-topnav .pt-breadcrumb a:hover{color:#d0dcf4}
.politiq-topnav .pt-sep{color:#3a4a68}
.politiq-topnav svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){.politiq-topnav{font-size:0.68rem;padding:7px 12px}}
.nav-scrim{position:fixed;inset:0;z-index:50;background:rgba(6,9,16,0.6);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity 0.25s ease,visibility 0.25s ease}

@media(min-width:1025px){
  body{padding-left:var(--nav-w)}
  /* Page chrome that is fixed across the full width (fachbuecher, datenschutz,
     mitwirken) does not follow the body padding — it has to be moved itself. */
  .topnav{left:var(--nav-w)}
}
@media(max-width:1024px){
  /* Below the breakpoint the hamburger floats over the top left corner; the
     page's own bar has to leave that corner free. */
  .topnav,.topbar{padding-left:64px}
  .nav-toggle{display:flex}
  .sitenav{width:min(86vw,320px);transform:translateX(-102%);transition:transform 0.28s cubic-bezier(0.4,0,0.2,1);box-shadow:0 0 40px rgba(0,0,0,0.5);padding-top:calc(var(--fb-h) + 60px + env(safe-area-inset-top))}
  body.nav-open .sitenav{transform:translateX(0)}
  body.nav-open .nav-scrim{opacity:1;visibility:visible}
  body.nav-open{overflow:hidden}
  /* Opaque in drawer mode — a translucent panel over the page is unreadable. */
  .sitenav{background:rgba(9,13,23,0.985)}
  .sitenav a.item,.sitenav a.item.sub,.sitenav summary,.sitenav .nav-foot a{min-height:44px}
  .sitenav a.item{font-size:0.88rem}
  .sitenav a.item.sub{font-size:0.83rem}
  .sitenav summary{font-size:0.72rem}
  .sitenav .nav-brand{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .sitenav,.nav-scrim,.sitenav summary .chev,.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{transition:none}
}
.founding-banner{z-index:10050!important}
.sitenav{z-index:10060!important}
.nav-toggle{z-index:10070!important}
.nav-scrim{z-index:10055!important}
/* Die Politiq-Kopfleiste des Gastes beginnt unter dem Band und rechts vom Baum. */
.politiq-topnav{top:var(--fb-h)!important}
@media(min-width:1025px){.politiq-topnav{left:var(--nav-w)!important;width:auto!important;right:0!important}}
@media(max-width:1024px){.politiq-topnav{padding-left:64px!important}}
/* Initiq (initiq.politiq.ch) bringt eine eigene klebende Kopfzeile mit. */
.site-header{top:var(--fb-h)!important;z-index:10040!important}
/* Animierter Hintergrund (bg-canvas.js) — hinter allem, nie im Weg. */
.politiq-bg-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
@media(max-width:1024px){.site-header .bar{padding-left:60px}}
