/* 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)}
/* Diese Bandregel steht im Dokument NACH den Stilbloecken der Seiten und
   ueberschrieb darum deren eigenes Polster: Eine Seite mit fester Leiste
   polstert 76px, bekam aber nur die Bandhoehe — und ihr Titel lag unter
   der Leiste. Die Buchfuehrung gehoert hierher, wo das Band entsteht:
   Wer eine eigene Leiste traegt, bekommt Band plus Leiste. */
body:has(.topnav){padding-top:calc(var(--fb-h) + 76px)}
body.has-politiq-crumbs{padding-top:calc(var(--fb-h) + 48px)}
@media(max-width:1024px){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 *,.site-shell-toggle,.site-shell-toggle *{box-sizing:border-box}
.site-shell-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:auto;min-width:44px;height:44px;padding:0 12px;display:none;align-items:center;justify-content:center;gap:9px;background:rgba(20,26,42,0.9);border:1px solid rgba(255,255,255,0.1);border-radius:10px;color:#d0d9e8;cursor:pointer;-webkit-tap-highlight-color:transparent}
.site-shell-toggle:focus-visible{outline:2px solid #8ab4e8;outline-offset:2px}
.site-shell-toggle span{display:block;width:18px;height:2px;background:#a0b0c8;border-radius:2px;position:relative;transition:background 0.2s}
.site-shell-toggle span::before,.site-shell-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}
.site-shell-toggle span::before{top:-6px}
.site-shell-toggle span::after{top:6px}
.site-shell-toggle b{font:600 .76rem/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.02em;white-space:nowrap}
body.nav-open .site-shell-toggle span{background:transparent}
body.nav-open .site-shell-toggle span::before{top:0;transform:rotate(45deg)}
body.nav-open .site-shell-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}
/* CI 1.0 Kapitel 11.4: die Negativfassung ersetzt die Textmarke in der
   Navigation; flach, ohne Rundung, mit Schutzraum ringsum. */
.sitenav .nav-brand{display:flex;align-items:center;margin-bottom:20px;padding:4px 6px;text-decoration:none}
.sitenav .nav-brand img{width:auto;height:72px}
.sitenav .nav-database-status{position:absolute;top:25px;right:22px;display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(138,180,232,.13);border-radius:50%;background:rgba(20,26,42,.48);color:#73829e;opacity:0;visibility:hidden;transform:scale(.82);pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s,color .2s,border-color .2s,background .2s,box-shadow .2s}
.sitenav .nav-database-hourglass{display:block;font-size:1.2rem;line-height:1;transform-origin:50% 50%}
.sitenav .nav-database-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sitenav .nav-database-status[data-state="busy"]{color:#ff3341;border-color:rgba(227,6,19,.52);background:rgba(227,6,19,.09);box-shadow:0 0 18px rgba(227,6,19,.18);opacity:1;visibility:visible;transform:scale(1);transition-delay:0s;pointer-events:auto}
.sitenav .nav-database-status[data-state="busy"] .nav-database-hourglass{animation:nav-database-hourglass-turn 1.25s linear infinite}
@keyframes nav-database-hourglass-turn{to{transform:rotate(360deg)}}
.sitenav .nav-start{margin:0 0 10px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.025)}
.sitenav .nav-start::before{content:"";width:7px;height:7px;border-radius:50%;background:#d8bd76;box-shadow:0 0 0 3px rgba(216,189,118,0.1)}

.sitenav details{border-top:1px solid rgba(255,255,255,0.05);padding:2px 0}
.sitenav details[open]>summary{color:#eef0f4}
.sitenav details.is-active>summary{color:#eef0f4;background:rgba(216,189,118,0.08)}
.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)}

.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[aria-current="page"]{color:#fff;background:rgba(216,189,118,0.12);box-shadow:inset 3px 0 0 #d8bd76;font-weight:700}
.sitenav a.item[aria-current="page"]::after{content:attr(data-current-label);margin-left:auto;color:#d8bd76;font-size:.54rem;letter-spacing:.06em;text-transform:uppercase}
.sitenav .nav-product{display:flex;align-items:center;gap:8px;min-height:36px;padding:7px 10px 2px;color:#cfd8e8;font-size:.72rem;font-weight:700;line-height:1.3}
.sitenav .nav-product--planned{color:#667796;font-weight:600;padding-bottom:7px}
.sitenav .nav-product--planned .pilot-nav{color:#7f8da7;border-color:rgba(127,141,167,.24)}
.sitenav .pilot-nav{margin-left:auto;padding:2px 5px;border:1px solid rgba(216,189,118,.32);border-radius:4px;color:#d8bd76;font-size:.54rem;letter-spacing:.06em}
.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[aria-current="page"]{color:#eef0f4;background:rgba(216,189,118,0.1);box-shadow:inset 3px 0 0 #d8bd76;font-weight:700}
.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:48px;padding:14px 28px;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;list-style:none;padding:0;font-size:0.74rem;letter-spacing:0.04em;color:#5a6a88;margin:0}
.politiq-topnav .pt-breadcrumb li{display:flex;align-items:center;gap:9px}
.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.
     Das gilt auch fuer die eigene Leiste. Stand sie auf left:0, begann ihre
     Brotkrumenspur bei x=20 — mitten in der Seitenspalte, hinter dem Logo.
     Beide Leisten gehoeren an denselben Anfang, sonst springt die Spur je
     nach Seite. */
  .topnav,.politiq-topnav,.founding-banner{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:104px}
  .site-shell-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,.site-shell-toggle span,.site-shell-toggle span::before,.site-shell-toggle span::after,.sitenav .nav-database-status{transition:none}
  .sitenav .nav-database-status[data-state="busy"] .nav-database-hourglass{animation:none}
}
.founding-banner{z-index:10050!important}
.sitenav{z-index:10060!important}
.site-shell-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(min-width:1025px){#politiq-topnav{left:var(--nav-w)!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:104px}}