/* Design-Tokens — Farben, Schrift, Abstaende (hell + dunkel)
   Quelle: Code Injection Site Header, Stand 2026-09-14 (2 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

:root{--si-paper:#FFFFFF;--si-card:#F7FAFC;--si-sunk:#EDF2F7;--si-border:#DFE7EF;--si-ink:#0D141C;--si-body:#495A6B;--si-muted:#5C6E82;--si-acc:#1F6FD0;--si-acc-on:#FFFFFF;--si-acc-tx:#1560C4;--si-acc-tint:rgba(31,111,208,.08);--si-acc-line:rgba(31,111,208,.28);--si-bar-dim:#C6D2DE;--si-disp:'Space Grotesk',system-ui,sans-serif;--si-sans:'Inter',system-ui,sans-serif;--si-mono:'JetBrains Mono',ui-monospace,monospace;--ghost-accent-color:#1560C4;--accent-color:#1560C4;}
html[data-theme="dark"]{--si-paper:#0D141C;--si-card:#131E2A;--si-sunk:#0A1017;--si-border:#22344A;--si-ink:#E9EFF6;--si-body:#A9B8C9;--si-muted:#7A8CA0;--si-acc:#FFB22E;--si-acc-on:#0D141C;--si-acc-tx:#FFB22E;--si-acc-tint:rgba(255,178,46,.13);--si-acc-line:rgba(255,178,46,.38);--si-bar-dim:#2E4054;--ghost-accent-color:#FFB22E;--accent-color:#FFB22E;}
/* Kopfnavigation — Leiste, Dropdown, Mobil-Schublade
   Quelle: Code Injection Site Header, Stand 2026-09-14 (58 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-nav,.si-nav *{ box-sizing:border-box; }
.si-nav{ position:sticky; top:0; z-index:9000;
  background:rgba(247,244,236,.85);
  -webkit-backdrop-filter:saturate(140%) blur(10px); backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--si-border); font-family:var(--si-sans); }
.si-nav__wrap{ max-width:1080px; margin:0 auto; padding:0 24px; height:64px; display:flex; align-items:center; gap:26px; }
.si-nav__brand{ font-family:var(--si-disp); font-weight:700; font-size:22px; letter-spacing:-.02em;
  color:var(--si-ink); text-decoration:none; white-space:nowrap; }
.si-nav__brand .g{ color:var(--si-acc-on); }
.si-nav__list{ list-style:none; display:flex; align-items:stretch; gap:2px; height:100%; margin:0; padding:0; }
.si-nav__item{ position:relative; display:flex; align-items:stretch; }
.si-nav__top{ display:inline-flex; align-items:center; gap:6px; height:100%;
  font-family:var(--si-disp); font-weight:500; font-size:15px; letter-spacing:-.01em;
  color:var(--si-body); text-decoration:none; padding:0 12px; background:none; border:none; cursor:pointer;
  border-bottom:2px solid transparent; transition:color .15s ease, border-color .15s ease; }
.si-nav__top:hover{ color:var(--si-ink); }
.si-nav__top.is-active{ color:var(--si-ink); border-bottom-color:var(--si-acc); }
.si-nav__caret{ width:9px; height:9px; color:var(--si-muted); flex:none; transition:transform .18s ease; }
.si-nav__item.open .si-nav__caret{ transform:rotate(180deg); }
.si-nav__panel{ position:absolute; top:100%; left:8px; z-index:50; min-width:248px; max-width:320px;
  background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:10px; margin-top:6px;
  box-shadow:0 14px 36px rgba(22,24,29,.10);
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s; }
.si-nav__item.open .si-nav__panel{ opacity:1; visibility:visible; transform:translateY(0); }
.si-nav__panelinner{ display:flex; flex-direction:column; }
.si-nav__sec{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--si-disp); font-weight:500; font-size:15px; letter-spacing:-.01em;
  color:var(--si-ink); text-decoration:none; padding:10px 12px; border-radius:9px; white-space:nowrap;
  transition:background .12s ease, color .12s ease; }
a.si-nav__sec:hover{ background:var(--si-acc-tint); color:var(--si-acc-tx); }
.si-nav__sec[aria-current="page"]{ color:var(--si-acc-tx); }
.si-nav__subs{ display:flex; flex-direction:column; margin:-2px 0 6px; }
.si-nav__subitem{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--si-sans); font-size:14px; color:var(--si-body); text-decoration:none;
  padding:8px 12px 8px 24px; border-radius:9px; white-space:nowrap; transition:background .12s ease, color .12s ease; }
.si-nav__subitem:hover{ background:var(--si-acc-tint); color:var(--si-ink); }
.si-nav__subitem[aria-current="page"]{ color:var(--si-acc-tx); }
.si-nav__pill{ font-family:var(--si-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--si-muted); }
.si-nav__auth{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.si-nav__authgroup{ display:flex; align-items:center; gap:12px; }
.si-nav__authgroup--in{ display:none; }
.si-nav.is-member .si-nav__authgroup--out{ display:none; }
.si-nav.is-member .si-nav__authgroup--in{ display:flex; }
.si-nav__signin{ font-family:var(--si-disp); font-weight:500; font-size:14px; letter-spacing:-.01em;
  color:var(--si-body); text-decoration:none; padding:8px 4px; background:none; border:none; cursor:pointer;
  transition:color .15s ease; white-space:nowrap; }
.si-nav__signin:hover{ color:var(--si-ink); }
.si-nav__cta{ display:inline-flex; align-items:center; gap:6px; font-family:var(--si-sans); font-weight:500; font-size:14px;
  color:var(--si-acc-on); background:var(--si-acc); border:none; border-radius:9px; padding:9px 16px; cursor:pointer;
  text-decoration:none; white-space:nowrap; transition:transform .12s ease, opacity .15s ease; }
.si-nav__cta:hover{ transform:translateY(-1px); opacity:.94; }
.si-nav__burger{ display:none; width:42px; height:42px; margin-left:auto; align-items:center; justify-content:center;
  background:none; border:1px solid var(--si-border); border-radius:9px; cursor:pointer; }
.si-nav__burger span{ display:block; width:18px; height:1.5px; background:var(--si-ink); position:relative; transition:background .2s ease; }
.si-nav__burger span::before,.si-nav__burger span::after{ content:""; position:absolute; left:0; width:18px; height:1.5px; background:var(--si-ink); transition:transform .2s ease; }
.si-nav__burger span::before{ top:-6px; }
.si-nav__burger span::after{ top:6px; }
.si-nav__burger[aria-expanded="true"] span{ background:transparent; }
.si-nav__burger[aria-expanded="true"] span::before{ transform:translateY(6px) rotate(45deg); }
.si-nav__burger[aria-expanded="true"] span::after{ transform:translateY(-6px) rotate(-45deg); }
.si-nav__drawer{ display:none; overflow:hidden; max-height:0; transition:max-height .28s ease;
  border-top:1px solid var(--si-border); background:var(--si-paper); }
.si-nav__drawer.is-open{ max-height:85vh; overflow:auto; }
.si-macc__auth .si-nav__authgroup{ flex-direction:column; align-items:stretch; gap:10px; }
.si-macc__auth .si-nav__cta{ width:100%; justify-content:center; padding:13px; font-size:15px; }
.si-macc__auth .si-nav__signin{ text-align:center; padding:11px; font-size:15px; }
.si-nav a:focus-visible,.si-nav button:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; border-radius:8px; }
@media (max-width:860px){
  .si-nav__list,.si-nav__auth{ display:none; }
  .si-nav__burger{ display:inline-flex; }
  .si-nav__drawer{ display:block; }
}
@media (prefers-reduced-motion:reduce){ .si-nav *{ transition:none !important; } }
html.si-nav-lock,html.si-nav-lock body{ overflow:hidden; }
html body a.si-btn,html body a.si-nav__cta{ background:var(--si-acc) !important; color:var(--si-acc-on) !important;
  text-decoration:none !important; border:none !important; background-image:none !important; }
html body a.si-card,html body a.si-nav__sec,html body a.si-nav__subitem{ background-image:none !important; }
.gh-content a:not(.si-btn):not(.si-card):not(.si-nav__sec):not(.si-nav__subitem):not(.si-toc a){ border-bottom:1.5px solid var(--si-acc-line); }
.gh-content a:not(.si-btn):not(.si-card):not(.si-nav__sec):not(.si-nav__subitem):not(.si-toc a):hover{ border-bottom-color:var(--si-acc); }
.gh-content a.si-btn,.gh-content a.si-card,.gh-content a.si-nav__sec,.gh-content a.si-nav__subitem{ text-decoration:none !important; }
html body .si-nav{background:rgba(255,255,255,.85);}
html[data-theme="dark"] body .si-nav{background:rgba(13,20,28,.85);}
html body .si-nav__brand .g,html body a.si-btn--ghost,html body .si-btn--ghost,html body code,html body kbd,html body .si-tags span,html body .si-note b,html body .si-steps__n,html body .si-versus__num,html body .si-form__status--ok,html body .si-toc a:hover::before,html body .si-myth--half .si-myth__mark,html body .si-foot__wordmark .g,html body .si-foot__msg [data-members-error],html body .si-cc__manage:hover{color:var(--si-acc-tx);}
html[data-theme="dark"] .si-nav__brand .g{ color:var(--si-acc-tx); }
/* Mitglieder-Menue im Kopf
   Quelle: Code Injection Site Header, Stand 2026-09-14 (17 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-macc{ list-style:none; margin:0; padding:6px 18px 8px; }
.si-macc__item{ border-top:1px solid var(--si-border); }
.si-macc__item:first-child{ border-top:none; }
.si-macc__row{ width:100%; display:flex; align-items:center; justify-content:space-between;
  font-family:var(--si-disp); font-weight:500; font-size:17px; letter-spacing:-.01em; color:var(--si-ink);
  text-decoration:none; background:none; border:none; cursor:pointer; padding:14px 4px; text-align:left; }
.si-macc__pl{ font-family:var(--si-mono); font-size:18px; color:var(--si-muted); transition:transform .18s ease; line-height:1; }
.si-macc__item.open > .si-macc__row .si-macc__pl,
.si-macc__item.open > .si-macc__lead .si-macc__exp .si-macc__pl{ transform:rotate(45deg); }
.si-macc__sub{ list-style:none; max-height:0; overflow:hidden; transition:max-height .24s ease; padding-left:12px; margin:0; }
.si-macc__item.open > .si-macc__sub{ max-height:1200px; }
.si-macc__link{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-family:var(--si-sans); font-size:15.5px; color:var(--si-body); text-decoration:none; padding:12px 4px; }
.si-macc__link:hover{ color:var(--si-ink); }
.si-macc__link[aria-current="page"]{ color:var(--si-acc-tx); }
.si-macc__lead{ position:relative; display:flex; align-items:stretch; }
.si-macc__lead > .si-macc__link{ flex:1 1 auto; }
.si-macc__sec{ font-family:var(--si-disp); font-weight:500; font-size:16px; color:var(--si-ink); }
.si-macc__exp{ flex:0 0 52px; background:none; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; border-left:1px solid var(--si-border); }
.si-macc__pill{ font-family:var(--si-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--si-muted); }
.si-macc__auth{ display:flex; flex-direction:column; gap:10px; padding:16px 18px 8px; border-top:1px solid var(--si-border); }
/* Basis und Ghost-Overrides — Grundtypografie und was das Source-Theme sonst faerbt
   Quelle: Code Injection Site Header, Stand 2026-09-14 (37 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.gh-head,.gh-navigation,.site-header,header.gh-head{ display:none !important; }
html body{ background:var(--si-paper) !important; color:var(--si-body) !important;
  font-family:var(--si-sans) !important; line-height:1.7; -webkit-font-smoothing:antialiased; }
html body h1,html body h2,html body h3,html body h4,html body h5,html body h6{
  font-family:var(--si-disp) !important; color:var(--si-ink) !important; letter-spacing:-.02em; }
html body .gh-main,html body .gh-content,html body .gh-article,html body .gh-canvas,
html body main,html body .site-content{ background:var(--si-paper) !important; }
html body a{ color:var(--si-acc-tx); text-decoration:none; }
html body .gh-button,html body .kg-btn,html body button.gh-button,
html body input[type="submit"],html body .gh-cta-button{
  background-color:var(--si-acc) !important; color:var(--si-acc-on) !important;
  border:none !important; border-radius:9px; font-weight:500; }
html body .post-card,html body .gh-card{ background:var(--si-card); border:1px solid var(--si-border); border-radius:12px; }
html body .gh-article-meta,html body .post-card-meta,html body .byline,html body time{
  font-family:var(--si-mono) !important; color:var(--si-muted); letter-spacing:.02em; text-transform:lowercase; }
hr{ border:none; border-top:1px solid var(--si-border); }
::selection{ background:var(--si-acc); color:var(--si-acc-on); }
blockquote{ font-family:var(--si-disp); font-weight:500; color:var(--si-ink); border-left:3px solid var(--si-acc); padding-left:22px; }
code,kbd{ font-family:var(--si-mono); font-size:.85em; color:var(--si-acc-on); background:var(--si-acc-tint); padding:1px 6px; border-radius:5px; }
pre{ background:var(--si-sunk); border:1px solid var(--si-border); border-radius:12px; padding:16px 18px; overflow-x:auto; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
.gh-content div.gh-table{ overflow-x:auto; }
.gh-content div.gh-table table,
.gh-content table{ white-space:normal; }
.gh-content div.gh-table table tbody td:first-child,
.gh-content div.gh-table table thead th:first-child{ padding-left:16px; }
html body .gh-article-tag,html body .gh-article-tag a{
  font-family:var(--si-mono) !important; color:var(--si-acc-tx) !important;
  text-transform:uppercase; letter-spacing:.16em; font-size:12px; }
.gh-article-tag{ margin-bottom:14px; }
.gh-article-tag::before{ content:""; display:inline-block; width:9px; height:9px; margin-right:9px;
  vertical-align:0; background:var(--si-acc); border-radius:2px; }
html body .gh-article-title{ font-family:var(--si-disp) !important; font-weight:700;
  font-size:clamp(36px,6vw,56px) !important; line-height:1.03; letter-spacing:-.03em; color:var(--si-ink); margin-top:0; }
.gh-article-excerpt{ font-family:var(--si-sans); font-size:18px; line-height:1.6; color:var(--si-body); max-width:620px; margin-top:14px; }
.gh-article-meta-length{ display:none; }
.gh-article-header .gh-article-image{ order:-1; margin-bottom:28px; }
.gh-article-image img{ display:block; width:100%; aspect-ratio:24/7; object-fit:cover; object-position:center; border-radius:14px; }
.gh-content{ font-size:17px; }
.gh-content * + h2{ margin-top:1.6em; }
.gh-content * + h3{ margin-top:1.35em; }
.gh-content * + h4{ margin-top:1.15em; }
.gh-content h2,.gh-content h3,.gh-content h4{ margin-bottom:.5em; }
.gh-content a{ color:var(--si-acc-tx); transition:border-color .15s ease; }
.si-page{ max-width:760px; margin:0 auto; padding:0 20px; }
.gh-footer,.site-footer,footer.site-footer{ display:none !important; }
.si h2[id], .si h3[id], .si-prose h2[id], .si-prose h3[id] { scroll-margin-top: 88px; }
html body{ transition:background-color .25s ease, color .25s ease; }
html body.post-template .gh-container.is-grid{ margin-top:160px; margin-bottom:64px; }
/* Buttons
   Quelle: Code Injection Site Header, Stand 2026-09-14 (10 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

html body a.si-btn--ghost{ background:transparent !important; color:var(--si-acc-on) !important; border:1px solid var(--si-border) !important; }
.si-btn{ display:inline-flex; max-width:100%; align-items:center; gap:8px; font-family:var(--si-sans); font-weight:500; font-size:15px;
  color:var(--si-acc-on); background:var(--si-acc); border:none; border-radius:9px; padding:12px 22px; cursor:pointer;
  text-decoration:none; transition:transform .12s ease, opacity .15s ease; }
.si-btn:hover{ transform:translateY(-1px); opacity:.94; }
.si-btn--ghost{ background:transparent; color:var(--si-acc-on); border:1px solid var(--si-border); }
.si-btn--ghost:hover{ border-color:var(--si-acc) !important; background:var(--si-acc-tint) !important; transform:none; }
.si-btn--sm{ padding:9px 16px; font-size:14px; }
.si-foot__form .si-btn{ white-space:nowrap; }
html body a.si-btn--ghost,html body .si-btn--ghost{color:var(--si-acc-tx) !important;border-color:var(--si-border) !important;}
html body a.si-btn--ghost:hover,html body .si-btn--ghost:hover{border-color:var(--si-acc-line) !important;background:var(--si-acc-tint) !important;}
html[data-theme="dark"] .si-btn--ghost,
html[data-theme="dark"] a.si-btn--ghost{ color:var(--si-ink) !important; }
/* Typografie-Bausteine — Kicker, Lead, Ueberschriften, Meta, Tags, Zitat
   Quelle: Code Injection Site Header, Stand 2026-09-14 (18 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-kicker{ font-family:var(--si-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--si-acc-tx); display:inline-flex; align-items:center; gap:9px; }
.si-kicker::before{ content:""; width:9px; height:9px; background:var(--si-acc); border-radius:2px; flex:none; }
.si-lead{ font-family:var(--si-sans); font-size:19px; line-height:1.6; color:var(--si-body); max-width:620px; }
.si-h{ font-family:var(--si-disp); color:var(--si-ink); letter-spacing:-.02em; line-height:1.1; }
html body h1.si-h--xl{ font-weight:700 !important; font-size:clamp(34px,6vw,54px) !important; letter-spacing:-.03em; }
html body h2.si-h--lg{ font-weight:500 !important; font-size:28px !important; }
.si-h--md{ font-weight:500; font-size:21px; }
.si-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.si-tags span{ font-family:var(--si-mono); font-size:12px; color:var(--si-acc-on); background:var(--si-acc-tint);
  border:1px solid var(--si-acc-line); padding:4px 10px; border-radius:7px; }
.si-meta{ font-family:var(--si-mono); font-size:12px; color:var(--si-muted); letter-spacing:.02em; }
.si-quote{ font-family:var(--si-disp); font-weight:500; font-size:23px; line-height:1.35; color:var(--si-ink);
  letter-spacing:-.01em; border-left:3px solid var(--si-acc); padding:4px 0 4px 22px; max-width:600px; }
.si-signup .si-kicker{ margin-bottom:12px; }
.si-keypoints .si-kicker{ margin-bottom:6px; }
.gh-content .si-quote{ margin:32px 0; }
.si-home__hero .si-kicker{ margin-bottom:22px; }
.si-home__about .si-kicker{ margin-bottom:4px; }
.si-foot__news .si-kicker{ margin-bottom:10px; }
.si-hub .si-lead{max-width:660px;}
/* Hinweiskaesten
   Quelle: Code Injection Site Header, Stand 2026-09-14 (3 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-note{ background:var(--si-acc-tint); border:1px solid var(--si-border); border-left:3px solid var(--si-acc);
  border-radius:0 10px 10px 0; padding:22px 26px; font-size:15px; color:var(--si-body); }
.si-note b{ color:var(--si-acc-on); }
.gh-content .si-flow,.gh-content .si-split,.gh-content .si-myths,
.gh-content .si-chart,.gh-content .si-stats,.gh-content .si-versus,
.gh-content .si-keypoints,.gh-content .si-note,.gh-content .si-steps{ margin:32px 0; }
/* Karten (si-card) — die Grundform jeder Liste
   Quelle: Code Injection Site Header, Stand 2026-09-14 (14 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-card{ display:block; background:var(--si-card); border:1px solid var(--si-border); border-radius:12px;
  overflow:hidden; text-decoration:none; transition:border-color .18s ease, transform .18s ease; }
.si-card:hover{ border-color:var(--si-acc); transform:translateY(-2px); }
.si-card__img{ display:block; width:100%; aspect-ratio:24/9; background:var(--si-sunk); background-size:cover; background-position:center; }
.si-card__body{ display:block; padding:18px 22px; }
.si-card__meta{ display:block; font-family:var(--si-mono); font-size:11px; color:var(--si-muted); letter-spacing:.02em; margin-bottom:8px; }
.si-card__title{ display:block; font-family:var(--si-disp); font-weight:500; font-size:20px; letter-spacing:-.01em; color:var(--si-ink); margin-bottom:6px; }
.si-card__ex{ display:block; font-family:var(--si-sans); font-size:15px; color:var(--si-body); }
html body .si-card__img{background-color:var(--si-sunk);}
.si-postlist__grid > .si-card:nth-child(n+7){ display:none; }
.si-postlist__toggle:checked ~ .si-postlist__grid > .si-card:nth-child(n+7){ display:block; }
.si-postlist:not(.si-postlist--3):not(:has(.si-postlist__grid > .si-card:nth-child(7))) .si-postlist__more{ display:none; }
.si-postlist--3 .si-postlist__grid > .si-card:nth-child(n+4){ display:none; }
.si-postlist--3 .si-postlist__toggle:checked ~ .si-postlist__grid > .si-card:nth-child(n+4){ display:block; }
.si-postlist--3:not(:has(.si-postlist__grid > .si-card:nth-child(4))) .si-postlist__more{ display:none; }
/* Newsletter-Anmeldung im Inhalt
   Quelle: Code Injection Site Header, Stand 2026-09-14 (6 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-signup{ background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:24px 26px; max-width:480px; }
.si-signup h3{ font-family:var(--si-disp); font-weight:500; font-size:20px; color:var(--si-ink); margin:0 0 6px; letter-spacing:-.01em; }
.si-signup p{ font-family:var(--si-sans); font-size:14px; color:var(--si-body); margin-bottom:16px; }
.si-signup .row{ display:flex; gap:9px; flex-wrap:wrap; }
.si-signup input{ flex:1; min-width:180px; font-family:var(--si-sans); font-size:15px; color:var(--si-ink);
  background:var(--si-sunk); border:1px solid var(--si-border); border-radius:9px; padding:11px 13px; }
.si-signup input:focus{ outline:none; border-color:var(--si-acc); }
/* Formulare
   Quelle: Code Injection Site Header, Stand 2026-09-14 (11 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-form{ max-width:520px; }
.si-form__field{ margin-bottom:16px; }
.si-form label{ display:block; font-family:var(--si-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--si-muted); margin:0 0 6px; }
.si-form input,.si-form textarea{ width:100%; box-sizing:border-box; font-family:var(--si-sans); font-size:15px; color:var(--si-ink);
  background:var(--si-sunk); border:1px solid var(--si-border); border-radius:9px; padding:11px 13px; }
.si-form input:focus,.si-form textarea:focus{ outline:none; border-color:var(--si-acc); }
.si-form textarea{ min-height:150px; resize:vertical; line-height:1.6; }
.si-form button{ margin-top:2px; }
.si-form__status{ margin-top:14px; font-size:15px; color:var(--si-body); }
.si-form__status--ok{ color:var(--si-acc-on); }
.si-form__status--err{ color:#a23; }
.si-form__hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
/* Sprunganker — scroll-margin unter der Sticky-Nav
   Quelle: Code Injection Site Header, Stand 2026-09-14 (1 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.gh-content :is(h2,h3,h4)[id], .si-home :is(h2,h3)[id], [id].si-anchor{ scroll-margin-top:88px; }
/* Inhaltsverzeichnis-Chips
   Quelle: Code Injection Site Header, Stand 2026-09-14 (10 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-toc{ display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  background:var(--si-card); border:1px solid var(--si-border); border-radius:14px;
  padding:14px 18px; margin:28px 0; }
.si-toc__label{ display:inline-flex; align-items:center; gap:9px; flex:none; margin-right:6px;
  font-family:var(--si-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--si-muted); }
.si-toc__label::before{ content:""; width:9px; height:9px; background:var(--si-acc); border-radius:2px; flex:none; }
.si-toc a{ display:inline-flex; align-items:center; gap:6px;
  font-family:var(--si-mono); font-size:12.5px; letter-spacing:.02em; color:var(--si-body);
  background:var(--si-sunk); border:1px solid var(--si-border); border-radius:8px;
  padding:6px 11px; text-decoration:none;
  transition:background .14s ease, border-color .14s ease, color .14s ease; }
.si-toc a::before{ content:"\2192"; color:var(--si-muted); transition:color .14s ease; }
.si-toc a:hover{ background:var(--si-acc-tint); border-color:var(--si-acc-line); color:var(--si-acc-tx); }
.si-toc a:hover::before{ color:var(--si-acc-on); }
.si-toc a:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; }
@media (max-width:600px){
  .si-toc{ padding:12px 14px; gap:7px; }
  .si-toc__label{ width:100%; margin:0 0 2px; }
  .si-toc a{ font-size:12px; padding:6px 10px; }
}
@media (prefers-reduced-motion:reduce){ .si-toc a, .si-toc a::before{ transition:none; } }
/* Aktualisierungs-Stempel
   Quelle: Code Injection Site Header, Stand 2026-09-14 (2 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-updated{ font-family:var(--si-mono); font-size:11.5px; letter-spacing:.02em;
  color:var(--si-muted); margin-top:14px; }
.si-updated time{ font-family:var(--si-mono) !important; color:var(--si-body);
  text-transform:none !important; }
/* FAQ-Akkordeon
   Quelle: Code Injection Site Header, Stand 2026-09-14 (7 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-faq{ border-top:1px solid var(--si-border); margin-top:24px; }
.si-faq details{ border-bottom:1px solid var(--si-border); }
.si-faq summary{ font-family:var(--si-disp); font-weight:500; font-size:17px; color:var(--si-ink);
  padding:14px 0; cursor:pointer; list-style:none; display:flex; justify-content:space-between;
  gap:12px; letter-spacing:-.01em; }
.si-faq summary::-webkit-details-marker{ display:none; }
.si-faq summary::after{ content:"+"; font-family:var(--si-mono); color:var(--si-acc-tx); }
.si-faq details[open] summary::after{ content:"\2013"; }
.si-faq details > div{ padding:0 0 16px; color:var(--si-body); max-width:680px; }
/* Kernaussagen-Block
   Quelle: Code Injection Site Header, Stand 2026-09-14 (6 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-keypoints{ background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:22px 24px; }
.si-keypoints ul{ list-style:none; margin-top:6px; padding:0; }
.si-keypoints li{ position:relative; padding:9px 0 9px 22px; font-size:15px; color:var(--si-body); border-bottom:1px solid var(--si-border); }
.si-keypoints li:last-child{ border-bottom:none; }
.si-keypoints li::before{ content:""; position:absolute; left:0; top:16px; width:7px; height:7px; border-radius:2px; background:var(--si-acc); }
.si-keypoints li b{ color:var(--si-ink); font-weight:500; }
/* Kennzahlen (si-stats / si-stat)
   Quelle: Code Injection Site Header, Stand 2026-09-14 (11 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:13px; }
.si-stat{ background:var(--si-card); border:1px solid var(--si-border); border-radius:12px; padding:20px 18px; }
.si-stat__num{ font-family:var(--si-disp); font-weight:700; font-size:clamp(26px,4.5vw,34px); letter-spacing:-.02em; color:var(--si-ink); line-height:1; }
.si-stat__cap{ font-size:13px; color:var(--si-body); margin-top:9px; line-height:1.45; }
.si-stat__src{ font-family:var(--si-mono); font-size:10.5px; color:var(--si-muted); margin-top:8px; letter-spacing:.02em; }
@media(max-width:600px){ .si-stats{ grid-template-columns:1fr; } }
.si-stats__col{ background:var(--si-card); border:1px solid var(--si-border); border-radius:12px; padding:20px 18px; }
.si-stats__n{ font-family:var(--si-disp); font-weight:700; font-size:clamp(26px,4.5vw,34px); letter-spacing:-.02em; color:var(--si-ink); line-height:1; }
.si-stats__cap{ font-size:13px; color:var(--si-body); margin-top:9px; line-height:1.45; }
.si-stats__note{ font-family:var(--si-mono); font-size:11px; color:var(--si-muted); margin-top:10px; letter-spacing:.02em; }
.si-hub .si-home__sec > *:not(.si-home__grid):not(.si-stats):not(.si-steps):not(.si-versus):not(.si-chart){max-width:740px;}
/* Diagramme
   Quelle: Code Injection Site Header, Stand 2026-09-14 (6 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-chart{ background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:24px 26px; }
.si-chart__head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.si-chart__title{ font-family:var(--si-disp); font-weight:500; font-size:17px; color:var(--si-ink); letter-spacing:-.01em; }
.si-chart__src{ font-family:var(--si-mono); font-size:11px; color:var(--si-muted); letter-spacing:.02em; }
.si-chart__foot{ margin-top:18px; padding-top:16px; border-top:1px solid var(--si-border); font-size:14px; color:var(--si-body); }
.si-chart__foot b{ color:var(--si-ink); font-weight:500; }
/* Balken (si-bar / si-bars)
   Quelle: Code Injection Site Header, Stand 2026-09-14 (9 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-bars{ display:flex; flex-direction:column; gap:13px; }
.si-bar{ display:grid; grid-template-columns:124px 1fr 52px; align-items:center; gap:14px; }
.si-bar__label{ font-size:13.5px; color:var(--si-body); text-align:right; }
.si-bar__track{ height:26px; background:var(--si-sunk); border:1px solid var(--si-border); border-radius:7px; overflow:hidden; }
.si-bar__fill{ height:100%; border-radius:6px 0 0 6px; background:var(--si-acc); }
.si-bar__fill--dim{ background:var(--si-bar-dim); }
.si-bar__val{ font-family:var(--si-mono); font-size:13px; color:var(--si-ink); font-weight:500; }
.si-bar__val--dim{ color:var(--si-muted); }
@media(max-width:520px){ .si-bar{ grid-template-columns:96px 1fr 44px; gap:10px; } .si-bar__label{ font-size:12.5px; } }
/* Gegenueberstellung
   Quelle: Code Injection Site Header, Stand 2026-09-14 (11 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-versus{ background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:26px 28px; }
.si-versus__row{ margin-bottom:22px; }
.si-versus__row:last-child{ margin-bottom:0; }
.si-versus__top{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:9px; }
.si-versus__name{ font-family:var(--si-disp); font-weight:500; font-size:16px; color:var(--si-ink); }
.si-versus__num{ font-family:var(--si-disp); font-weight:700; font-size:clamp(24px,5vw,32px); letter-spacing:-.02em; color:var(--si-acc-on); }
.si-versus__num--dim{ color:var(--si-muted); }
.si-versus__track{ height:34px; background:var(--si-sunk); border:1px solid var(--si-border); border-radius:9px; overflow:hidden; }
.si-versus__fill{ height:100%; border-radius:8px 0 0 8px; background:var(--si-acc); }
.si-versus__fill--dim{ background:var(--si-bar-dim); }
html body .si-versus__num--dim{color:var(--si-muted);}
/* Schrittfolgen
   Quelle: Code Injection Site Header, Stand 2026-09-14 (5 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; }
.si-steps__item{ background:var(--si-card); border:1px solid var(--si-border); border-radius:12px; padding:18px 20px; }
.si-steps__n{ display:inline-block; font-family:var(--si-mono); font-size:12px; color:var(--si-acc-on);
  background:var(--si-acc-tint); border:1px solid var(--si-acc-line); border-radius:6px; padding:2px 8px; }
.si-steps__t{ font-family:var(--si-disp); font-weight:500; font-size:17px; color:var(--si-ink); margin:10px 0 4px; letter-spacing:-.01em; }
.si-steps__cap{ font-size:14px; color:var(--si-body); }
/* Ablaufdiagramme
   Quelle: Code Injection Site Header, Stand 2026-09-14 (10 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-flow{ display:grid; grid-template-columns:repeat(auto-fit,minmax(148px,1fr)); gap:12px; }
.si-flow__step{ position:relative; background:var(--si-card); border:1px solid var(--si-border);
  border-radius:12px; padding:16px 18px; }
.si-flow__step--end{ border-color:var(--si-acc-line); background:var(--si-acc-tint); }
.si-flow__n{ font-family:var(--si-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--si-muted); }
.si-flow__step--end .si-flow__n{ color:var(--si-acc-tx); }
.si-flow__t{ font-family:var(--si-disp); font-weight:500; font-size:16px; color:var(--si-ink);
  margin:8px 0 5px; letter-spacing:-.01em; line-height:1.25; }
.si-flow__cap{ font-size:13.5px; color:var(--si-body); line-height:1.5; margin:0; }
.si-flow__step::after{ content:"\2192"; position:absolute; right:-12px; top:50%; transform:translateY(-50%);
  font-family:var(--si-mono); font-size:14px; color:var(--si-acc); z-index:2; line-height:1; }
.si-flow__step:last-child::after{ content:none; }
@media(max-width:640px){
  .si-flow{ grid-template-columns:1fr; }
  .si-flow__step::after{ right:auto; left:50%; top:auto; bottom:-12px; transform:translateX(-50%); content:"\2193"; }
}
/* Zweispalter
   Quelle: Code Injection Site Header, Stand 2026-09-14 (8 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-split{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.si-split__panel{ background:var(--si-card); border:1px solid var(--si-border); border-radius:14px; padding:20px 22px; }
.si-split__panel--live{ border-color:var(--si-acc-line); background:var(--si-acc-tint); }
.si-split__label{ font-family:var(--si-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--si-muted); }
.si-split__panel--live .si-split__label{ color:var(--si-acc-tx); }
.si-split__t{ font-family:var(--si-disp); font-weight:500; font-size:18px; color:var(--si-ink);
  margin:9px 0 6px; letter-spacing:-.01em; }
.si-split__cap{ font-size:14.5px; color:var(--si-body); margin:0; }
@media(max-width:600px){ .si-split{ grid-template-columns:1fr; } }
/* Mythen-Block
   Quelle: Code Injection Site Header, Stand 2026-09-14 (9 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-myths{ display:flex; flex-direction:column; gap:12px; }
.si-myth{ display:grid; grid-template-columns:36px 1fr; gap:15px;
  background:var(--si-card); border:1px solid var(--si-border); border-radius:12px; padding:18px 20px; }
.si-myth__mark{ width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center;
  font-family:var(--si-mono); font-size:15px; line-height:1;
  background:var(--si-sunk); border:1px solid var(--si-border); color:var(--si-bar-dim); }
.si-myth--half .si-myth__mark{ background:var(--si-acc-tint); border-color:var(--si-acc-line); color:var(--si-acc-on); }
.si-myth__verdict{ display:block; font-family:var(--si-mono); font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--si-muted); margin-bottom:5px; }
.si-myth--half .si-myth__verdict{ color:var(--si-acc-tx); }
.si-myth__claim{ font-family:var(--si-disp); font-weight:500; font-size:16px; color:var(--si-ink);
  letter-spacing:-.01em; margin-bottom:7px; line-height:1.3; }
.si-myth__body{ font-size:14.5px; color:var(--si-body); margin:0; }
@media(max-width:520px){ .si-myth{ grid-template-columns:1fr; gap:10px; } }
/* Tabellen — inkl. Ghost-Tabellen im Inhalt
   Quelle: Code Injection Site Header, Stand 2026-09-14 (23 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-table,.si table,.gh-content table,.si-prose table{
  width:100%; border-collapse:separate; border-spacing:0; margin:18px 0 0;
  font-family:var(--si-sans); font-size:14.5px; color:var(--si-body);
  border:1px solid var(--si-border); border-radius:12px; }
.si-table thead th,.si table thead th,.gh-content table thead th,.si-prose table thead th{
  font-family:var(--si-mono); font-size:12px; font-weight:400; letter-spacing:.04em; text-transform:uppercase;
  color:var(--si-acc-tx); text-align:left; background:var(--si-sunk); padding:11px 16px; border-bottom:1.5px solid var(--si-acc-line); }
.si-table thead th:first-child,.si table thead th:first-child,.gh-content table thead th:first-child,.si-prose table thead th:first-child{ border-top-left-radius:11px; }
.si-table thead th:last-child,.si table thead th:last-child,.gh-content table thead th:last-child,.si-prose table thead th:last-child{ border-top-right-radius:11px; }
.si-table tbody td,.si table tbody td,.gh-content table tbody td,.si-prose table tbody td{ padding:11px 16px; border-bottom:1px solid var(--si-border); vertical-align:top; }
.si-table tbody tr:last-child td,.si table tbody tr:last-child td,.gh-content table tbody tr:last-child td,.si-prose table tbody tr:last-child td{ border-bottom:none; }
.si-table tbody tr:hover,.si table tbody tr:hover,.gh-content table tbody tr:hover,.si-prose table tbody tr:hover{ background:var(--si-acc-tint); }
.si-table .num,.si table .num,.gh-content table .num,.si-prose table .num{ text-align:right; font-family:var(--si-mono); font-variant-numeric:tabular-nums; color:var(--si-ink); }
.si-table th,.si-table td,.si table th,.si table td,.gh-content table th,.gh-content table td,.si-prose table th,.si-prose table td{ overflow-wrap:normal; word-break:normal; }
.gh-content div.gh-table table.si-wide{ white-space:nowrap; }
.si-table,
.si table,
.gh-content table,
.si-prose table
{ background:var(--si-card); margin:32px 0; }
.si-table thead th,
.si table thead th,
.gh-content table thead th,
.si-prose table thead th
{ padding:13px 18px; }
.si-table tbody td,
.si table tbody td,
.gh-content table tbody td,
.si-prose table tbody td
{ padding:14px 18px; }
.si-table tbody td:first-child,
.si table tbody td:first-child,
.gh-content table tbody td:first-child,
.si-prose table tbody td:first-child
{ color:var(--si-ink); font-weight:500; }
.si-table tbody tr:nth-child(even),
.si table tbody tr:nth-child(even),
.gh-content table tbody tr:nth-child(even),
.si-prose table tbody tr:nth-child(even)
{ background:var(--si-sunk); }
.si-table tbody tr:hover,
.si table tbody tr:hover,
.gh-content table tbody tr:hover,
.si-prose table tbody tr:hover
{ background:var(--si-acc-tint); }
.si-table tbody tr:last-child td:first-child,
.si table tbody tr:last-child td:first-child,
.gh-content table tbody tr:last-child td:first-child,
.si-prose table tbody tr:last-child td:first-child
{ border-bottom-left-radius:11px; }
.si-table tbody tr:last-child td:last-child,
.si table tbody tr:last-child td:last-child,
.gh-content table tbody tr:last-child td:last-child,
.si-prose table tbody tr:last-child td:last-child
{ border-bottom-right-radius:11px; }
.gh-content div.gh-table table,
.si-table,
.si table,
.gh-content table,
.si-prose table{ margin:40px 0; }
.gh-content div.gh-table table thead th,
.si-table thead th,
.si table thead th,
.gh-content table thead th,
.si-prose table thead th{ padding:14px 16px; }
.gh-content div.gh-table table tbody td,
.si-table tbody td,
.si table tbody td,
.gh-content table tbody td,
.si-prose table tbody td{ padding:16px 16px; line-height:1.55; }
.gh-content div.gh-table table tbody td:first-child,
.si-table tbody td:first-child,
.si table tbody td:first-child,
.gh-content table tbody td:first-child,
.si-prose table tbody td:first-child{ white-space:nowrap; }
@media (max-width:600px){ .si-table th,.si-table td,.si table th,.si table td,.gh-content table th,.gh-content table td,.si-prose table th,.si-prose table td{ padding:9px 11px; font-size:13.5px; } }
/* Index-/Archivkopf
   Quelle: Code Injection Site Header, Stand 2026-09-14 (5 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-index-head{ max-width:1080px; margin:0 auto; padding:48px 24px 10px; }
.si-index-head__kicker{ display:inline-flex; align-items:center; gap:9px;
  font-family:var(--si-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--si-acc-tx); margin-bottom:14px; }
.si-index-head__kicker::before{ content:""; width:9px; height:9px; background:var(--si-acc);
  border-radius:2px; flex:none; }
html body h1.si-index-head__title{ font-family:var(--si-disp) !important; font-weight:700;
  font-size:clamp(34px,6vw,52px) !important; line-height:1.03; letter-spacing:-.03em;
  color:var(--si-ink) !important; margin:0; }
@media (max-width:600px){ .si-index-head{ padding:36px 20px 6px; } }
/* Startseiten- und Hub-Layout (si-home, si-hub)
   Quelle: Code Injection Site Header, Stand 2026-09-14 (21 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-home{ max-width:1080px; margin:0 auto; padding:0 24px; }
.si-home__hero{ padding:84px 0 40px; }
.si-home__hero h1{ margin-bottom:22px; max-width:780px; }
.si-home__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.si-home__sec{ padding:54px 0; border-top:1px solid var(--si-border); }
.si-home__sec h2{ margin-bottom:8px; }
.si-home__sec > p{ max-width:660px; }
.si-home__quote-wrap{ display:flex; flex-direction:column; gap:20px; }
.si-home__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); gap:16px; margin-top:28px; }
.si-home__about{ display:grid; grid-template-columns:1fr; gap:14px; max-width:680px; }
.si-home__about p{ font-size:16px; }
.si-home__news{ padding:54px 0 90px; border-top:1px solid var(--si-border); }
.gh-content .si-home,
.gh-content .si-bleed{
  width:100vw; max-width:100vw;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
}
.si-home__heroin{display:grid;grid-template-columns:1.22fr .78fr;gap:46px;align-items:center;}
.si-home__in{max-width:1080px;margin:0 auto;padding:0 24px;}
.si-hub .si-home__hero{padding:72px 0 48px;}
.si-hub .si-home__sec > p{max-width:680px;}
.si-hub details{max-width:740px;}
.si-home__strip{display:flex;gap:30px;margin-top:30px;padding-top:20px;border-top:1px solid var(--si-border);flex-wrap:wrap;}
.si-home__strip div{font-family:var(--si-mono);font-size:11.5px;color:var(--si-muted);letter-spacing:.04em;}
.si-home__strip b{display:block;font-family:var(--si-disp);font-weight:700;font-size:22px;color:var(--si-ink);letter-spacing:-.02em;margin-bottom:3px;}
/* Footer
   Quelle: Code Injection Site Header, Stand 2026-09-14 (32 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-foot,.si-foot *{ box-sizing:border-box; }
.si-foot{ border-top:1px solid var(--si-border); background:var(--si-paper);
  font-family:var(--si-sans); color:var(--si-body); }
.si-foot__in{ max-width:1080px; margin:0 auto; padding:58px 24px 30px; }
.si-foot__top{ display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:start;
  padding-bottom:40px; border-bottom:1px solid var(--si-border); }
.si-foot__wordmark{ font-family:var(--si-disp); font-weight:700; font-size:24px; letter-spacing:-.02em;
  color:var(--si-ink); text-decoration:none; }
.si-foot__wordmark .g{ color:var(--si-acc-on); }
.si-foot__tag{ font-size:15px; color:var(--si-body); max-width:340px; margin:12px 0 0; }
.si-foot__sib{ font-size:13.5px; color:var(--si-muted); max-width:360px; margin:10px 0 0; }
.si-foot__sib a{ color:var(--si-acc-tx); border-bottom:1px solid var(--si-acc-line); text-decoration:none; }
.si-foot__sib a:hover{ border-bottom-color:var(--si-acc); }
.si-foot__social{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.si-foot__social a{ font-family:var(--si-mono); font-size:12px; color:var(--si-body);
  border:1px solid var(--si-border); border-radius:8px; padding:7px 12px; text-decoration:none;
  transition:border-color .15s ease, background .15s ease, color .15s ease; }
.si-foot__social a:hover{ border-color:var(--si-acc); background:var(--si-acc-tint); color:var(--si-acc-tx); }
.si-foot__news{ background:var(--si-sunk); border:1px solid var(--si-border); border-radius:14px; padding:22px 24px; }
.si-foot__news p{ font-size:14px; color:var(--si-body); margin:0 0 14px; }
.si-foot__form{ display:flex; gap:9px; flex-wrap:wrap; }
.si-foot__form input{ flex:1; min-width:170px; font-family:var(--si-sans); font-size:15px; color:var(--si-ink);
  background:var(--si-card); border:1px solid var(--si-border); border-radius:9px; padding:11px 13px; }
.si-foot__form input:focus{ outline:none; border-color:var(--si-acc); }
.si-foot__msg{ font-family:var(--si-mono); font-size:11.5px; color:var(--si-muted);
  margin:11px 0 0; min-height:1em; letter-spacing:.02em; }
.si-foot__msg [data-members-error]{ color:var(--si-acc-on); }
.si-foot__form.success + .si-foot__msg::before{ content:"Almost there — check your inbox to confirm."; color:var(--si-acc-tx); }
.si-foot__nav{ display:grid; grid-template-columns:repeat(5,1fr); gap:28px; padding:36px 0 30px; }
.si-foot__h{ display:block; font-family:var(--si-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--si-muted); margin-bottom:14px; }
.si-foot__col a{ display:block; font-family:var(--si-disp); font-weight:500; font-size:15px; letter-spacing:-.01em;
  color:var(--si-body); text-decoration:none; padding:5px 0; transition:color .15s ease; }
.si-foot__col a:hover{ color:var(--si-acc-tx); }
.si-foot__base{ display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:space-between; align-items:center;
  padding-top:24px; border-top:1px solid var(--si-border);
  font-family:var(--si-mono); font-size:11.5px; color:var(--si-muted); letter-spacing:.02em; }
.si-foot__base a{ color:var(--si-muted); text-decoration:none; }
.si-foot__base a:hover{ color:var(--si-acc-tx); }
.si-foot a:focus-visible,.si-foot button:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; border-radius:8px; }
@media (max-width:760px){
  .si-foot__top{ grid-template-columns:1fr; gap:30px; }
  .si-foot__nav{ grid-template-columns:1fr 1fr; gap:26px 20px; }
}
@media (max-width:440px){ .si-foot__nav{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce){ .si-foot *{ transition:none !important; } }
/* Cookie-Banner
   Quelle: Code Injection Site Header, Stand 2026-09-14 (32 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-cc,.si-cc *{ box-sizing:border-box; }
.si-cc{ position:fixed; inset:auto 0 0 0; z-index:10000; display:flex; justify-content:center;
  padding:16px; font-family:var(--si-sans); }
.si-cc[hidden]{ display:none; }
.si-cc__card{ width:100%; max-width:680px; background:var(--si-card); border:1px solid var(--si-border);
  border-radius:16px; box-shadow:0 18px 48px rgba(22,24,29,.16); padding:22px 24px; }
.si-cc__title{ font-family:var(--si-disp); font-weight:600; font-size:19px; letter-spacing:-.01em;
  color:var(--si-ink); margin:10px 0 6px; }
.si-cc__text{ font-size:14px; line-height:1.6; color:var(--si-body); margin:0 0 16px; max-width:62ch; }
.si-cc__text a{ color:var(--si-acc-tx); border-bottom:1px solid var(--si-acc-line); text-decoration:none; }
.si-cc__text a:hover{ border-bottom-color:var(--si-acc); }
.si-cc__cats{ margin:2px 0 16px; border-top:1px solid var(--si-border); }
.si-cc__cat{ display:flex; gap:16px; align-items:flex-start; justify-content:space-between;
  padding:15px 0; border-bottom:1px solid var(--si-border); }
.si-cc__cat h4{ font-family:var(--si-disp); font-weight:500; font-size:15px; color:var(--si-ink); margin:0 0 3px; letter-spacing:-.01em; }
.si-cc__cat p{ font-size:13px; color:var(--si-body); margin:0; max-width:48ch; }
.si-cc__sw{ flex:none; position:relative; width:44px; height:26px; }
.si-cc__sw input{ position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.si-cc__track{ position:absolute; inset:0; background:var(--si-sunk); border:1px solid var(--si-border);
  border-radius:999px; transition:background .15s ease, border-color .15s ease; }
.si-cc__track::after{ content:""; position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%;
  background:var(--si-muted); transition:transform .18s ease, background .15s ease; }
.si-cc__sw input:checked + .si-cc__track{ background:var(--si-acc-tint); border-color:var(--si-acc-line); }
.si-cc__sw input:checked + .si-cc__track::after{ transform:translateX(18px); background:var(--si-acc); }
.si-cc__sw input:disabled + .si-cc__track{ opacity:.75; }
.si-cc__sw input:disabled + .si-cc__track::after{ background:var(--si-acc); }
.si-cc__sw input:focus-visible + .si-cc__track{ outline:2px solid var(--si-acc); outline-offset:2px; }
.si-cc__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; }
.si-cc__btn{ font-family:var(--si-sans); font-weight:500; font-size:14px; border-radius:9px; padding:11px 18px;
  cursor:pointer; border:1px solid var(--si-border); background:var(--si-card); color:var(--si-ink);
  transition:transform .12s ease, opacity .15s ease, border-color .15s ease, background .15s ease; }
.si-cc__btn:hover{ transform:translateY(-1px); }
.si-cc__btn--primary{ background:var(--si-acc); border-color:var(--si-acc); color:var(--si-acc-on); }
.si-cc__btn--ghost{ background:transparent; }
.si-cc__btn--ghost:hover{ border-color:var(--si-acc); background:var(--si-acc-tint); }
.si-cc__manage{ margin-left:auto; background:none; border:none; color:var(--si-acc-tx); font-family:var(--si-disp);
  font-weight:500; font-size:14px; cursor:pointer; padding:11px 6px; text-decoration:underline; text-underline-offset:3px; }
.si-cc__manage:hover{ color:var(--si-acc-on); }
.si-cc__btn:focus-visible,.si-cc__manage:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; }
@media (max-width:540px){
  .si-cc__manage{ margin-left:0; order:3; width:100%; text-align:center; padding-top:4px; }
  .si-cc__btn{ flex:1 1 auto; }
}
@media (prefers-reduced-motion:reduce){ .si-cc *{ transition:none !important; } }
/* Crit-Pick-Tracker-Panel im Hero
   Quelle: Code Injection Site Header, Stand 2026-09-14 (14 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-trk{display:block;border:1px solid var(--si-border);border-radius:14px;background:var(--si-card);padding:20px 22px;text-decoration:none;transition:border-color .18s ease,transform .18s ease;}
a.si-trk:hover{border-color:var(--si-acc-line);transform:translateY(-2px);}
.si-trk__head{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px;font-family:var(--si-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--si-muted);}
.si-trk__head b{color:var(--si-acc-tx);font-weight:400;}
.si-trk__row{display:grid;grid-template-columns:1fr 86px 46px;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--si-border);font-family:var(--si-mono);font-size:12px;}
.si-trk__row:last-of-type{border-bottom:none;}
.si-trk__row i{font-style:normal;color:var(--si-body);}
.si-trk__row u{text-decoration:none;color:var(--si-ink);text-align:right;}
.si-trk__bar{height:5px;border-radius:99px;background:var(--si-sunk);border:1px solid var(--si-border);overflow:hidden;}
.si-trk__bar span{display:block;height:100%;background:var(--si-acc);}
.si-trk__bar--dim span{background:var(--si-bar-dim);}
.si-trk__foot{margin-top:11px;padding-top:11px;border-top:1px solid var(--si-border);font-family:var(--si-mono);font-size:10.5px;color:var(--si-muted);line-height:1.6;}
html body a.si-trk,html body a.si-trk *{text-decoration:none !important;border-bottom:none !important;}
@media(max-width:900px){.si-home__heroin{grid-template-columns:1fr;gap:34px;}.si-trk{display:none;}}
/* Hell/Dunkel-Schalter
   Quelle: Code Injection Site Header, Stand 2026-09-14 (9 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-themetoggle{ flex:none; display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; margin-left:8px; background:none; border:1px solid var(--si-border);
  border-radius:9px; color:var(--si-body); cursor:pointer;
  transition:color .15s ease, border-color .15s ease, background .15s ease; }
.si-themetoggle:hover{ color:var(--si-ink); border-color:var(--si-acc); background:var(--si-acc-tint); }
.si-themetoggle svg{ width:18px; height:18px; }
.si-themetoggle__sun{ display:none; }
.si-themetoggle__moon{ display:block; }
html[data-theme="dark"] .si-themetoggle__sun{ display:block; }
html[data-theme="dark"] .si-themetoggle__moon{ display:none; }
.si-themetoggle:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; border-radius:9px; }
@media (prefers-reduced-motion:reduce){ html body,.si-themetoggle{ transition:none; } }
/* Hub-Postliste mit CSS-only Load-more
   Quelle: Code Injection Site Header, Stand 2026-09-14 (8 Regelbloecke).
   Reihenfolge innerhalb der Datei ist die des Originals — nicht umsortieren. */

.si-postlist{ margin:34px 0 0; }
.si-postlist__toggle{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.si-postlist__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); gap:14px; }
.si-postlist__more{ display:flex; justify-content:center; margin-top:20px; }
.si-postlist__toggle:checked ~ .si-postlist__more{ display:none; }
.si-postlist__btn{ cursor:pointer; user-select:none; }
.si-postlist__toggle:focus-visible ~ .si-postlist__more .si-postlist__btn{ outline:2px solid var(--si-acc); outline-offset:3px; }
@media(max-width:600px){ .si-postlist__grid{ grid-template-columns:1fr; } }
/* Navigation in drei Kontexten — eine Markup-Form, drei Hausformen
   Ghosts {{navigation}} rendert partials/navigation.hbs und liefert ueberall dieselben
   <li class="si-nav__item"><a class="si-nav__top">. Statt drei Markup-Varianten zu pflegen
   (genau die Doppelpflege, die dieser Umbau abschafft), passt CSS sie ein.
   Neu am 14.09.2026 mit Theme 1.0.1. */

/* Mobil-Schublade: Form von .si-macc__item / .si-macc__link uebernehmen */
.si-macc .si-nav__item{ border-top:1px solid var(--si-border); }
.si-macc .si-nav__item:first-child{ border-top:none; }
.si-macc .si-nav__top{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-family:var(--si-sans); font-size:15.5px; color:var(--si-body); text-decoration:none; padding:12px 4px; }
.si-macc .si-nav__top:hover{ color:var(--si-ink); }
.si-macc .si-nav__top[aria-current="page"]{ color:var(--si-acc-tx); }

/* Footer-Spalten: Form von .si-foot__col a uebernehmen */
.si-foot__list{ list-style:none; margin:0; padding:0; }
.si-foot__col .si-foot__list .si-nav__top{ display:block; font-family:var(--si-disp); font-weight:500;
  font-size:15px; letter-spacing:-.01em; color:var(--si-body); text-decoration:none; padding:5px 0;
  transition:color .15s ease; }
.si-foot__col .si-foot__list .si-nav__top:hover{ color:var(--si-acc-tx); }
/* Hub-Weiche — die Cluster-Liste direkt unter dem Lead
   Neu am 14.09.2026 mit Theme 1.0.2. Ein Hub ist eine Weiche, kein Essay: die Liste steht
   oben, die Prosa darunter. Diese Regeln geben dem Routing-Block eine eigene Flaeche,
   damit der Uebergang von "wohin" zu "worum geht es" sichtbar ist. */

.si-home__sec--routes{ margin-top:34px; padding-top:26px; border-top:1px solid var(--si-border); }
.si-home__sec--routes > h2{ margin-bottom:4px; }
.si-home__sec--routes .si-meta{ margin:0 0 18px; }
.si-home__sec--routes .si-postlist{ margin-top:0; }

/* Die Prosa steht jetzt unter der Weiche und braucht etwas Luft nach oben. */
.si-hub__prose{ margin-top:40px; padding-top:30px; border-top:1px solid var(--si-border); }

@media(max-width:640px){
  .si-home__sec--routes{ margin-top:26px; padding-top:20px; }
  .si-hub__prose{ margin-top:30px; padding-top:24px; }
}
/* Die zwei Weichen der Startseite — "Start here" und "What do you make?"
   Neu am 14.09.2026 mit Theme 1.0.3.

   Sie ersetzen die handgeschriebene Kartenreihe "Where games get found" (sechs Links,
   einer doppelt) und den leeren `#si-latest-grid`, den ein Footer-Skript zur Laufzeit
   fuellte. Beide Bloecke kommen jetzt aus `{{#get}}` und stehen im Roh-HTML.

   Optisch sollen die beiden Weichen als ein Paar lesbar sein und sich vom Prosa-Teil
   darunter absetzen — deshalb dieselbe Flaeche, ein Trenner nach oben, mehr Luft. */

.si-home__sec--areas{ margin-top:38px; padding-top:28px; border-top:1px solid var(--si-border); }
.si-home__sec--areas > h2{ margin-bottom:6px; }
.si-home__sec--areas .si-lead--sm{ margin:0 0 20px; max-width:62ch; font-size:1rem; opacity:.85; }

/* 🆕 1.0.5 — Zwei Spalten statt `auto-fit`.

   `.si-home__grid` steht auf `repeat(auto-fit,minmax(248px,1fr))`. Das ist fuer eine
   Postliste richtig (sechs Karten fuellen jede Zeile), fuer eine Weiche aber nicht:
   bei **vier** Tueren ergab es 3 + 1, und die vierte Karte stand allein und halb so
   hoch in einer eigenen Zeile. Genau der Zustand, den Isabella am 15.09.2026 gemeldet
   hat („looks a bit wild, maybe use 2x2 grid").

   Eine Weiche hat wenige, gleichrangige Ziele. Zwei feste Spalten geben daraus immer
   ein sauberes Raster — 2 Tueren = eine Zeile, 4 = 2x2, 6 = 3x2 — und breitere Karten,
   in denen die langen Hub-Titel nicht mehr dreizeilig umbrechen. */
.si-areas{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }

/* 1.0.9 — die Leitkarte. Eine Tuer traegt den Block, die uebrigen stehen darunter.
   grid-column:1/-1 statt span 2, damit die Karte volle Breite behaelt, egal wie viele
   Tueren darunter stehen. Ausgeloest durch den internen Tag #feature auf der Seite. */
.si-areas .si-card--lead{ grid-column:1 / -1; }
.si-areas .si-card--lead .si-card__body{ padding-top:18px; }
.si-areas .si-card--lead .si-card__title{ font-size:1.3rem; line-height:1.25; letter-spacing:-.015em; }
.si-areas .si-card--lead .si-card__ex{ font-size:1rem; max-width:60ch; }

/* Bereichs-Karten tragen kein Datum und duerfen deshalb enger stehen als Post-Karten. */
.si-areas .si-card__body{ padding-top:14px; }
.si-areas .si-card__title{ font-weight:650; }

/* Keine der vier Bereichsseiten hat heute ein Beitragsbild. Der Platzhalter war deshalb
   auf jeder Karte ein leerer grauer Block im Seitenverhaeltnis 24:9 — zusammen die
   Haelfte der sichtbaren Flaeche, ohne eine einzige Aussage. In dieser Weiche faellt er
   weg; sobald eine Seite ein Bild bekommt, erscheint es wieder (dann traegt es etwas).
   In Postlisten bleibt der Platzhalter, dort haelt er die Kartenhoehen gleich. */
.si-areas .si-card__img--none{ display:none; }

.si-home__sec--latest{ margin-top:38px; padding-top:28px; border-top:1px solid var(--si-border); }
.si-home__sec--latest > h2{ margin-bottom:16px; }
.si-home__sec--latest .si-home__cta{ margin-top:22px; }

/* Der Textteil der Startseite (Beleg-Streifen, Zitat, Ueber-mich, Newsletter, FAQ) steht
   seit 1.0.3 unter den Weichen. Er bekommt denselben Trenner wie die Hub-Prosa. */
.si-home__prose{ margin-top:40px; padding-top:30px; border-top:1px solid var(--si-border); }
.si-home__prose > .si-home,
.si-home__prose > .si-home > .si-home__in{ margin:0; padding:0; max-width:none; }

@media(max-width:640px){
  .si-home__sec--areas,
  .si-home__sec--latest{ margin-top:28px; padding-top:22px; }
  .si-home__prose{ margin-top:30px; padding-top:24px; }
  .si-areas{ grid-template-columns:1fr; gap:14px; }
}
/* Kopf-Untermenue "What you make" — CSS-only
   Neu am 16.09.2026 mit Theme 1.0.7.

   🔴 Die Regel, die die Form bestimmt: die vier Bereichslinks muessen im ausgelieferten
   HTML stehen. `visibility:hidden` nimmt sie aus dem Bild, nicht aus dem Dokument —
   `display:none` wuerde dasselbe tun, aber ohne Uebergang. Was hier NICHT stehen darf,
   ist ein Skript, das die Liste erst baut: genau daran ist die alte SI_NAV-Leiste
   gescheitert (Crawlability, Korrektur 10.08.2026).

   Geoeffnet wird ueber :hover UND :focus-within — letzteres ist der Tastaturweg, ohne
   eine Zeile JavaScript. */

.si-nav__item--sub{ position:relative; }

.si-nav__subcaret{ width:9px; height:9px; color:var(--si-muted); flex:none;
  transition:transform .18s ease; }
.si-nav__item--sub:hover .si-nav__subcaret,
.si-nav__item--sub:focus-within .si-nav__subcaret{ transform:rotate(180deg); }

.si-nav__sub{ position:absolute; top:100%; left:4px; z-index:50; min-width:210px;
  list-style:none; margin:6px 0 0; padding:8px;
  background:var(--si-card); border:1px solid var(--si-border); border-radius:14px;
  box-shadow:0 14px 36px rgba(13,20,28,.10);
  display:flex; flex-direction:column;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s; }

.si-nav__item--sub:hover .si-nav__sub,
.si-nav__item--sub:focus-within .si-nav__sub{ opacity:1; visibility:visible; transform:translateY(0); }

/* Die Eintraege kommen aus partials/navigation.hbs und tragen dieselben Klassen wie
   oben — hier bekommen sie die Form einer Liste statt die einer Leiste. */
.si-nav__sub .si-nav__item{ display:block; }
.si-nav__sub .si-nav__top{ display:block; height:auto; width:100%; white-space:nowrap;
  padding:9px 12px; border-radius:9px; border-bottom:none;
  color:var(--si-ink); font-size:15px;
  transition:background .12s ease, color .12s ease; }
.si-nav__sub .si-nav__top:hover{ background:var(--si-gold-tint); color:var(--si-acc-tx); }
.si-nav__sub .si-nav__top.is-active{ color:var(--si-acc-tx); background:var(--si-gold-tint); }

/* Mobil-Schublade: Zwischenzeile vor den vier Bereichen. */
.si-macc__group{ list-style:none; padding:16px 4px 4px; }
.si-macc__h{ font-family:var(--si-mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--si-muted); }
/* Basics-Block auf den Hub-Seiten
   Neu am 16.09.2026 mit Theme 1.0.7. Markup: partials/si/hub-basics.hbs

   Drei Spalten, bewusst als Textliste und nicht als Kartenraster: der Block soll unter
   der Cluster-Liste und den Bereichen stehen, ohne mit ihnen um Aufmerksamkeit zu
   ringen. Karten haette er dafuer zu viel Gewicht. */

.si-basics{ border-top:1px solid var(--si-border); padding-top:34px; }

.si-basics__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:22px; }

.si-basics__h{ display:block; font-family:var(--si-mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--si-muted); padding-bottom:9px;
  border-bottom:1px solid var(--si-border); margin-bottom:11px; }
.si-basics__h a{ color:inherit; text-decoration:none; transition:color .15s ease; }
.si-basics__h a:hover{ color:var(--si-acc-tx); }

.si-basics__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.si-basics__list a{ font-family:var(--si-disp); font-weight:500; font-size:15.5px; line-height:1.35;
  letter-spacing:-.01em; color:var(--si-body); text-decoration:none;
  transition:color .15s ease; }
.si-basics__list a:hover{ color:var(--si-acc-tx); }

@media (max-width:820px){ .si-basics__cols{ grid-template-columns:1fr 1fr; gap:22px; } }
@media (max-width:520px){ .si-basics__cols{ grid-template-columns:1fr; gap:20px; } }
/* Link-Seite /links/ (custom-si-links.hbs)
   Neu am 23.09.2026 mit Theme 1.0.10. Ziel der Bio-Links auf allen sieben Kanaelen.

   Eine schmale Spalte, grosse Tippflaechen (min. 56px), ein Akzent: der Rand und die
   Flaeche beim Hover. Icons folgen der Textfarbe, keine Plattformfarben — sonst stuenden
   sieben Akzente auf einer Flaeche (Design System v2 §8). */

.si-links{ max-width:520px; margin:0 auto; padding:56px 20px 72px; text-align:center; }

.si-links__mark{ display:inline-block; border-radius:18px; overflow:hidden; line-height:0; }
.si-links__mark img{ width:72px; height:72px; display:block; }

html body .si-links__title{ font-family:var(--si-disp); font-weight:700; font-size:30px;
  letter-spacing:-.02em; line-height:1.15; color:var(--si-ink); margin:18px 0 0; }
html body .si-links__lead{ font-family:var(--si-sans); font-size:16px; line-height:1.55;
  color:var(--si-body); margin:10px auto 0; max-width:420px; }

.si-links__list{ list-style:none; margin:32px 0 0; padding:0; display:grid; gap:12px; }
.si-links__list li{ margin:0; padding:0; }

html body a.si-links__a{ display:flex; align-items:center; justify-content:center; gap:12px;
  min-height:56px; padding:0 20px; border:1px solid var(--si-border); border-radius:12px;
  background:var(--si-card); color:var(--si-ink) !important; font-family:var(--si-sans);
  font-weight:600; font-size:16px; text-decoration:none !important;
  transition:border-color .18s ease, background .18s ease, transform .18s ease; }
html body a.si-links__a:hover, html body a.si-links__a:focus-visible{
  border-color:var(--si-acc-line); background:var(--si-acc-tint); transform:translateY(-1px); }
html body a.si-links__a:focus-visible{ outline:2px solid var(--si-acc); outline-offset:2px; }
.si-links__a svg{ width:20px; height:20px; flex:none; }

.si-links__body{ margin-top:28px; text-align:left; }

html body .si-links__home{ margin:36px 0 0; font-family:var(--si-mono); font-size:12px;
  letter-spacing:.08em; color:var(--si-muted); }
html body .si-links__home a{ color:var(--si-acc-tx); text-decoration:none; }

@media (prefers-reduced-motion:reduce){ html body a.si-links__a{ transition:none; transform:none !important; } }

/* Redesign „für Indies" — Theme 1.1.0, 28.09.2026
Entwurf: Design-Flaeche „See Indie — Redesign für Indies". Seitenplan: Werkstatt-Datei 17.
Neue Klassen tragen das Praefix si-x-. Ein Akzent pro Flaeche: hell Blau, dunkel Gold;
die Bereiche unterscheiden sich durch Muster, nicht durch Farben. */

:root{--si-mark-blue:#4E96E8;--si-pat:#E4ECF4;--si-pat-dot:#D3DEEA;}
html[data-theme="dark"]{--si-pat:#1B2A3A;--si-pat-dot:#2A3D52;}

/* ---------- Kopfleiste ---------- */
.si-nav__wrap{max-width:1248px;gap:18px;}
.si-nav__brand{display:inline-flex;align-items:center;gap:10px;}
.si-nav__mark{width:32px;height:32px;border-radius:8px;display:block;}
.si-nav .si-ic{display:none;}
.si-nav__list--areas .si-ic{display:block;width:18px;height:18px;color:var(--si-acc);flex:none;}
.si-nav__list--areas .si-nav__top{gap:8px;color:var(--si-ink);font-weight:500;}
.si-nav__list--areas .si-nav__top.is-active{background:var(--si-acc-tint);border-radius:10px;border-bottom-color:transparent;color:var(--si-acc-tx);}
.si-nav__list--areas .si-nav__item{padding:12px 0;}
.si-nav__list--areas .si-nav__top{padding:0 12px;border-radius:10px;}
.si-nav__list--areas .si-nav__top:hover{background:var(--si-acc-tint);}
.si-nav__div{width:1px;height:24px;background:var(--si-border);flex:none;}
.si-nav__sub .si-nav__top:hover,.si-nav__sub .si-nav__top.is-active{background:var(--si-acc-tint);}
.si-macc .si-ic{display:block;width:18px;height:18px;color:var(--si-acc);}
.si-macc--areas .si-nav__top{justify-content:flex-start;gap:10px;}
@media (max-width:1120px){
.si-nav__list,.si-nav__auth,.si-nav__div{display:none;}
.si-nav__burger{display:inline-flex;}
.si-nav__drawer{display:block;}
}

/* ---------- Grundraster ---------- */
.si-x{--si-x-w:1200px;}
.si-x-in{max-width:var(--si-x-w);margin:0 auto;padding:0 24px;box-sizing:border-box;}
.si-x-sec{padding:56px 0;}
.si-x-sec--tight{padding:24px 0;}
.si-x .si-kicker{margin-bottom:14px;}
.si-x-h1{font-family:var(--si-disp) !important;font-weight:700 !important;color:var(--si-ink) !important;
font-size:clamp(44px,7vw,92px) !important;line-height:.98 !important;letter-spacing:-.045em !important;margin:0 0 24px;}
.si-x-h1--hub{font-size:clamp(36px,5vw,62px) !important;line-height:1.03 !important;letter-spacing:-.035em !important;max-width:900px;}
.si-x-lead{font-family:var(--si-sans);font-size:clamp(17px,1.6vw,20px);line-height:1.6;color:var(--si-body);max-width:640px;margin:0;}
.si-x-h2{font-family:var(--si-disp) !important;font-weight:700 !important;color:var(--si-ink) !important;
font-size:clamp(30px,3.6vw,44px) !important;line-height:1.06 !important;letter-spacing:-.03em !important;margin:0;max-width:820px;}
.si-x-h2--sm{font-size:clamp(26px,2.8vw,34px) !important;}
.si-x-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:30px;flex-wrap:wrap;}
.si-x-head__aside{max-width:380px;font-size:16px;color:var(--si-body);margin:0;}
.si-x-more{font-family:var(--si-sans);font-weight:600;font-size:15px;color:var(--si-acc-tx);text-decoration:none;}
.si-x-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;}
.si-x-cta .si-btn{padding:15px 24px;font-size:16px;border-radius:12px;font-weight:600;}
.si-x-note{font-size:14.5px;color:var(--si-muted);margin:22px 0 0;}
.si-x-empty{font-size:16px;color:var(--si-body);background:var(--si-card);border:1.5px dashed var(--si-border);border-radius:16px;padding:22px 24px;margin:0;max-width:760px;}

/* Icons */
.si-x-ic{display:inline-flex;align-items:center;justify-content:center;color:var(--si-acc);}
.si-x-ic .si-ic{width:22px;height:22px;display:block;}
.si-x-ic--tile,.si-x-ic--lg{width:64px;height:64px;border-radius:16px;background:var(--si-paper);border:1px solid var(--si-border);}
.si-x-ic--tile .si-ic,.si-x-ic--lg .si-ic{width:32px;height:32px;}
.si-x-ic--lg{margin-bottom:22px;width:76px;height:76px;border-radius:20px;}
.si-x-ic--lg .si-ic{width:38px;height:38px;}

/* Muster je Bereich — statt zusaetzlicher Farben */
.si-x-pat--games{background-color:var(--si-card);background-image:linear-gradient(var(--si-pat) 1px,transparent 1px),linear-gradient(90deg,var(--si-pat) 1px,transparent 1px);background-size:16px 16px;}
.si-x-pat--art{background-color:var(--si-card);background-image:radial-gradient(var(--si-pat-dot) 1.4px,transparent 1.6px);background-size:14px 14px;}
.si-x-pat--music{background-color:var(--si-card);background-image:repeating-linear-gradient(90deg,var(--si-pat) 0 2px,transparent 2px 10px);}
.si-x-pat--small-business{background-color:var(--si-card);background-image:repeating-linear-gradient(135deg,var(--si-pat) 0 1px,transparent 1px 12px);}

/* Chips */
.si-x-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.si-x-chip{display:inline-flex;align-items:center;font-family:var(--si-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
color:var(--si-muted);background:var(--si-card);border:1px solid var(--si-border);border-radius:99px;padding:4px 10px;white-space:nowrap;}
.si-x-chip--acc{color:var(--si-acc-tx);background:var(--si-acc-tint);border-color:var(--si-acc-line);}

/* ---------- Startseite: Hero ---------- */
.si-x-hero{padding:80px 0 64px;}
.si-x-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;}
.si-x-pick{border:1px solid var(--si-border);border-radius:20px;background:var(--si-paper);padding:10px;
box-shadow:0 1px 0 var(--si-border),0 24px 48px -28px rgba(13,20,28,.18);}
.si-x-pick__h{display:block;font-family:var(--si-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--si-muted);padding:14px 16px 8px;}
.si-x-pick__list{list-style:none;margin:0;padding:0;}
.si-x-pick__list .si-nav__item{display:block;}
.si-x-pick__list .si-nav__top{display:grid;grid-template-columns:52px 1fr 20px;grid-template-rows:auto auto;column-gap:16px;align-items:center;
padding:14px 16px;border-radius:14px;text-decoration:none;color:var(--si-ink);border:none;}
.si-x-pick__list .si-nav__top:hover{background:var(--si-acc-tint);}
.si-x-pick__list .si-ic{grid-row:1 / 3;width:52px;height:52px;box-sizing:border-box;padding:12px;border:1px solid var(--si-border);border-radius:12px;color:var(--si-acc);background:var(--si-card);}
.si-x-pick__list .si-nav__label{font-family:var(--si-disp);font-weight:700;font-size:20px;letter-spacing:-.01em;color:var(--si-ink);}
.si-x-pick__list .si-nav__top::after{grid-column:2;font-family:var(--si-sans);font-size:14.5px;color:var(--si-body);}
.si-x-pick__list .si-nav__top::before{content:"→";grid-column:3;grid-row:1 / 3;order:3;color:var(--si-acc);font-weight:600;}
.si-x-pick__list .si-nav__item--games .si-nav__top::after{content:"Steam page, wishlists, press, launch";}
.si-x-pick__list .si-nav__item--art .si-nav__top::after{content:"Illustration, painting, photography, craft, Etsy";}
.si-x-pick__list .si-nav__item--music .si-nav__top::after{content:"Self-released: solo artists, producers, bands";}
.si-x-pick__list .si-nav__item--small-business .si-nav__top::after{content:"From a one-desk office to a workshop";}
.si-x-pick__foot{margin:8px 16px 10px;padding-top:14px;border-top:1px dashed var(--si-border);font-size:14px;color:var(--si-muted);}
.si-x-pick__foot a{font-weight:500;color:var(--si-acc-tx);}

/* Streifen „Written for" */
.si-x-strip{border-top:1px solid var(--si-border);border-bottom:1px solid var(--si-border);background:var(--si-card);}
.si-x-strip__in{display:flex;gap:14px 20px;align-items:center;flex-wrap:wrap;padding-top:18px;padding-bottom:18px;
font-family:var(--si-mono);font-size:13px;color:var(--si-body);}
.si-x-strip__in i{font-style:normal;color:var(--si-bar-dim);}
.si-x-strip__h{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--si-acc-tx);margin-right:8px;}

/* Bento */
.si-x-bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
.si-x-tile{border:1px solid var(--si-border);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;background:var(--si-paper);}
.si-x-tile__band{height:130px;border-bottom:1px solid var(--si-border);display:flex;align-items:flex-end;padding:20px 24px;}
.si-x-tile__body{padding:24px 26px 26px;display:flex;flex-direction:column;gap:12px;flex:1;}
.si-x-tile__t{margin:0 !important;font-family:var(--si-disp) !important;font-weight:700 !important;font-size:28px !important;letter-spacing:-.02em;}
.si-x-tile__t a{color:var(--si-ink);text-decoration:none;}
.si-x-tile__ex{margin:0;font-size:15.5px;line-height:1.55;color:var(--si-body);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.si-x-tile__soon{margin:4px 0 0;font-size:14.5px;color:var(--si-muted);background:var(--si-card);border:1px dashed var(--si-border);border-radius:12px;padding:12px 14px;}
.si-x-tile .si-x-more{margin-top:auto;padding-top:6px;}
.si-x-rows{list-style:none;margin:4px 0 0;padding:0;}
.si-x-rows a{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--si-border);
font-size:15px;color:var(--si-ink);text-decoration:none;}
.si-x-rows a span{color:var(--si-acc);}
.si-x-rows a:hover{color:var(--si-acc-tx);}

/* Belegband — dunkle Flaeche; Akzent darauf: Markenblau (hell) bzw. Gold (dunkel) */
.si-x-proof{background:#0D141C;border-radius:28px;padding:52px 56px;display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;color:#A9B8C9;}
html[data-theme="dark"] .si-x-proof{background:var(--si-card);border:1px solid var(--si-border);}
.si-x-proof__k{display:flex;gap:10px;align-items:center;font-family:var(--si-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--si-mark-blue);margin-bottom:16px;}
.si-x-proof__k::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--si-mark-blue);}
html[data-theme="dark"] .si-x-proof__k{color:var(--si-acc);}
html[data-theme="dark"] .si-x-proof__k::before{background:var(--si-acc);}
.si-x-proof__h{font-family:var(--si-disp) !important;font-weight:700 !important;font-size:clamp(28px,3vw,40px) !important;line-height:1.08;letter-spacing:-.03em;color:#E9EFF6 !important;margin:0 0 14px;}
.si-x-proof p{margin:0 0 16px;font-size:16px;line-height:1.6;color:#A9B8C9;}
.si-x-proof__a{font-weight:600;color:var(--si-mark-blue) !important;text-decoration:none;}
html[data-theme="dark"] .si-x-proof__a{color:var(--si-acc) !important;}
.si-x-proof__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.si-x-stat{border:1px solid #22344A;border-radius:16px;padding:20px;background:#131E2A;display:flex;flex-direction:column;gap:8px;}
html[data-theme="dark"] .si-x-stat{background:var(--si-paper);}
.si-x-stat b{font-family:var(--si-disp);font-weight:700;font-size:34px;letter-spacing:-.02em;color:#E9EFF6;line-height:1;}
.si-x-stat span{font-size:14px;color:#A9B8C9;line-height:1.4;}
.si-x-proof__src{grid-column:1 / -1;font-family:var(--si-mono);font-size:12px !important;color:#7A8CA0 !important;margin:4px 0 0 !important;}

/* Basics-Karten (01–03) und Unter-Hub-Karten */
.si-x-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.si-x-basic{border:1px solid var(--si-border);border-radius:20px;padding:28px;display:flex;flex-direction:column;gap:12px;background:var(--si-paper);text-decoration:none;
transition:border-color .18s ease,transform .18s ease;}
.si-x-basic:hover{border-color:var(--si-acc-line);transform:translateY(-2px);}
.si-x-basic__top{display:flex;justify-content:space-between;align-items:center;}
.si-x-basic__n{font-family:var(--si-mono);font-size:13px;color:var(--si-acc-tx);}
.si-x-basic__t{font-family:var(--si-disp);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.2;color:var(--si-ink);}
.si-x-basic__ex{font-size:15.5px;line-height:1.55;color:var(--si-body);}
.si-x-basic .si-x-more{margin-top:auto;}
.si-x-basic--sub .si-x-basic__t{font-size:21px;}

/* Artikelkarten */
.si-x-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.si-x-card{display:flex;flex-direction:column;border:1px solid var(--si-border);border-radius:18px;overflow:hidden;background:var(--si-paper);text-decoration:none;
transition:border-color .18s ease,transform .18s ease;}
.si-x-card:hover{border-color:var(--si-acc-line);transform:translateY(-2px);}
.si-x-card__img{display:block;aspect-ratio:16/9;background:var(--si-sunk);background-size:cover;background-position:center;}
.si-x-card__body{display:flex;flex-direction:column;gap:10px;padding:18px 20px 22px;}
.si-x-card__chips{display:flex;flex-wrap:wrap;gap:6px;}
.si-x-card__title{font-family:var(--si-disp);font-weight:700;font-size:19px;line-height:1.28;letter-spacing:-.015em;color:var(--si-ink);}
.si-x-card__meta{font-family:var(--si-mono);font-size:11.5px;color:var(--si-muted);}
.si-postlist__grid.si-x-grid3 > .si-x-card:nth-child(n+7){display:none;}
.si-postlist__toggle:checked ~ .si-postlist__grid.si-x-grid3 > .si-x-card:nth-child(n+7){display:flex;}
.si-postlist:not(:has(.si-postlist__grid > .si-x-card:nth-child(7))) .si-postlist__more{display:none;}

/* Prosa und Newsletter */
.si-x-prose{max-width:760px;}
.si-x-prosewrap .si-home__prose{margin-top:0;padding-top:0;border-top:none;}
.si-x-news{border:1px solid var(--si-acc-line);background:var(--si-acc-tint);border-radius:28px;padding:48px 56px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.si-x-news p{margin:12px 0 0;font-size:16px;color:var(--si-body);}
.si-x-news__l{display:block;font-family:var(--si-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--si-body);margin-bottom:10px;}
.si-x-news__row{display:flex;gap:10px;}
.si-x-news__row input{flex:1;min-width:0;font-family:var(--si-sans);font-size:16px;padding:15px 16px;border:1px solid var(--si-border);border-radius:12px;background:var(--si-paper);color:var(--si-ink);}
.si-x-news__row input:focus{outline:none;border-color:var(--si-acc);}
.si-x-news__row .si-btn{border-radius:12px;padding:0 22px;font-weight:600;}
.si-x-news__note{font-size:13.5px !important;color:var(--si-muted) !important;}
.si-x-news__form.success .si-x-news__note::before{content:"Almost there — check your inbox to confirm. ";color:var(--si-acc-tx);}

/* ---------- Bereichs-Hub ---------- */
.si-x-ahero{border-bottom:1px solid var(--si-border);padding:28px 0 64px;}
.si-x-crumb{font-family:var(--si-mono);font-size:12.5px;color:var(--si-muted);display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:40px;}
.si-x-crumb a{color:var(--si-muted);text-decoration:none;}
.si-x-crumb a:hover{color:var(--si-acc-tx);}
.si-x-crumb span:last-child{color:var(--si-ink);}
.si-x-crumb i{font-style:normal;color:var(--si-bar-dim);}
.si-x-crumb--post{margin-bottom:18px;}
.si-x-crumb--post a:last-child{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.si-x-ahero__grid,.si-x-thero__grid{display:grid;grid-template-columns:1.3fr .7fr;gap:56px;align-items:end;}
.si-x-ahero .si-kicker{display:flex;}
.si-x-count,.si-x-forwho{background:var(--si-paper);border:1px solid var(--si-border);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:16px;}
.si-x-count__h{font-family:var(--si-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--si-muted);}
.si-x-count__row{display:flex;gap:28px;}
.si-x-count__row b{display:block;font-family:var(--si-disp);font-weight:700;font-size:34px;color:var(--si-ink);line-height:1;}
.si-x-count__row span{font-size:13px;color:var(--si-body);}
.si-x-count__btn{justify-content:center;border-radius:12px;padding:14px 18px;font-weight:600;}
.si-x-corners{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:6px;}
.si-x-corner{display:flex;align-items:center;gap:14px;border:1px solid var(--si-border);border-radius:16px;padding:18px 20px;text-decoration:none;color:var(--si-ink);background:var(--si-paper);}
.si-x-corner b{font-family:var(--si-disp);font-size:19px;flex:1;}
.si-x-corner:hover{border-color:var(--si-acc-line);}

/* ---------- Themen-Hub ---------- */
.si-x-thero{border-bottom:1px solid var(--si-border);padding:28px 0 56px;}
.si-x-thero .si-x-ic--lg{display:flex;}
.si-x-forwho__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.si-x-forwho__list .si-nav__top{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--si-border);
font-family:var(--si-disp);font-weight:500;font-size:16px;color:var(--si-ink);text-decoration:none;height:auto;}
.si-x-forwho__list .si-nav__top:hover{border-color:var(--si-acc-line);background:var(--si-acc-tint);}
.si-x-forwho__list .si-ic{width:20px;height:20px;color:var(--si-acc);}
.si-x-pills{display:flex;flex-wrap:wrap;gap:8px;}
.si-x-pills a{font-family:var(--si-sans);font-weight:500;font-size:14.5px;color:var(--si-ink);border:1px solid var(--si-border);border-radius:99px;padding:9px 15px;text-decoration:none;}
.si-x-pills a:hover{border-color:var(--si-acc-line);background:var(--si-acc-tint);}
.si-x-grp{display:grid;grid-template-columns:240px 1fr;gap:40px;padding:26px 0;border-top:1px solid var(--si-border);}
.si-x-grp:last-child{border-bottom:1px solid var(--si-border);}
.si-x-grp__h{display:flex;flex-direction:column;gap:6px;}
.si-x-grp__h b{font-family:var(--si-disp);font-size:22px;color:var(--si-ink);}
.si-x-grp__h span:last-child{font-family:var(--si-mono);font-size:12px;color:var(--si-muted);}
.si-x-grp__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.si-x-grp__list a{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--si-border);border-radius:14px;padding:15px 18px;
font-family:var(--si-disp);font-weight:500;font-size:16.5px;line-height:1.3;color:var(--si-ink);text-decoration:none;height:100%;box-sizing:border-box;}
.si-x-grp__list a span{color:var(--si-acc);}
.si-x-grp__list a:hover{border-color:var(--si-acc-line);background:var(--si-acc-tint);}
.si-x-up{display:flex;flex-direction:column;gap:6px;border:1px solid var(--si-border);border-radius:16px;padding:20px 22px;text-decoration:none;max-width:520px;}
.si-x-up__k{font-family:var(--si-mono);font-size:12px;color:var(--si-muted);}
.si-x-up__t{font-family:var(--si-disp);font-weight:700;font-size:19px;color:var(--si-ink);}
.si-basics .si-basics__cols{margin-top:0;}
.si-basics.si-x-sec{border-top:none;}

/* ---------- Artikel ---------- */
.si-x-postk{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:14px;}
.si-x-postk .gh-article-tag{margin-bottom:0;}
.si-x-after{margin-top:48px;}
.si-x-after__grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.si-x-partof{display:flex;flex-direction:column;gap:8px;border:1px solid var(--si-acc-line);background:var(--si-acc-tint);border-radius:18px;padding:22px;text-decoration:none;}
.si-x-partof b{font-family:var(--si-disp);font-weight:700;font-size:19px;line-height:1.3;color:var(--si-ink);}
.si-x-forwho--post .si-x-forwho__list{display:grid;grid-template-columns:1fr 1fr;}
.si-x-sib{padding-top:40px;}
.si-x-sib .si-x-grid3{margin-top:4px;}

/* ---------- Articles-Index ---------- */
.si-x-sec--row{padding:28px 0;}
.si-x-rowsec{display:grid;grid-template-columns:220px 1fr;gap:36px;padding-top:28px !important;border-top:1px solid var(--si-border);}
.si-x-rowsec__h{display:flex;flex-direction:column;gap:6px;}
.si-x-rowsec__h b{font-family:var(--si-disp);font-size:24px;color:var(--si-ink);}
.si-x-rowsec__h a{font-size:14px;color:var(--si-acc-tx);text-decoration:none;}

/* ---------- Fuss ---------- */
.si-foot__in{max-width:1248px;}
.si-foot__wordmark{display:inline-flex;align-items:center;gap:10px;}
.si-foot__mark{width:30px;height:30px;border-radius:7px;display:block;}
.si-foot .si-ic{display:none;}

/* ---------- Responsiv ---------- */
@media (max-width:980px){
.si-x-hero__grid,.si-x-ahero__grid,.si-x-thero__grid,.si-x-proof,.si-x-news{grid-template-columns:1fr;}
.si-x-three,.si-x-grid3{grid-template-columns:1fr 1fr;}
.si-x-grp,.si-x-rowsec{grid-template-columns:1fr;gap:16px;}
.si-x-proof,.si-x-news{padding:34px 28px;}
}
@media (max-width:640px){
.si-x-hero{padding:44px 0 36px;}
.si-x-sec{padding:40px 0;}
.si-x-in{padding:0 16px;}
.si-x-bento,.si-x-three,.si-x-grid3,.si-x-corners,.si-x-grp__list,.si-x-after__grid,.si-x-proof__stats{grid-template-columns:1fr;}
.si-x-pick__list .si-nav__top{grid-template-columns:44px 1fr 16px;column-gap:12px;padding:12px;}
.si-x-pick__list .si-ic{width:44px;height:44px;padding:10px;}
.si-x-pick__list .si-nav__label{font-size:18px;}
.si-x-news__row{flex-direction:column;}
.si-x-news__row .si-btn{padding:14px;justify-content:center;}
.si-x-count__row{gap:20px;}
}

/* 1.1.1 · Wortmarke ohne Luecke: Abstand haengt am Icon, nicht als gap zwischen See und Indie */
.si-nav__brand,.si-foot__wordmark{gap:0;}
.si-nav__mark,.si-foot__mark{margin-right:10px;}

/* ===== 390 · Einfache Seiten + Fallstudie (Theme 1.1.2, 28.09.2026) ===== */
.si-x--page .si-x-thero__text,.si-x--case .si-x-thero__text{max-width:820px;}
.si-x--page .si-x-prose > :first-child,.si-x--case .si-x-prose > :first-child{margin-top:0;}
.si-x-prose .si-page,.si-x-prose .si-home__sec:first-child{margin-top:0;padding-top:0;border-top:none;}
.si-x-log{list-style:none;margin:0;padding:0;}
.si-x-log a{display:grid;grid-template-columns:120px 1fr 20px;gap:16px;align-items:baseline;padding:14px 0;border-top:1px solid var(--si-border);text-decoration:none;color:var(--si-ink);}
.si-x-log li:first-child a{border-top:none;padding-top:0;}
.si-x-log time{font-family:var(--si-mono);font-size:13px;color:var(--si-muted);}
.si-x-log b{font-weight:600;font-size:17px;line-height:1.4;}
.si-x-log span{color:var(--si-acc);}
.si-x-log a:hover b{color:var(--si-acc-tx);}
.si-x-rowsec__h .si-x-note{margin:0;}
@media (max-width:640px){.si-x-log a{grid-template-columns:1fr 16px;gap:4px 12px;}.si-x-log time{grid-column:1 / -1;}}

/* 1.1.3 · Altrumpf im neuen Rahmen: kein Doppelabstand unter dem Kopf, kein Einzug durch .si-page */
.si-x .si-x-prose > :first-child{margin-top:0 !important;}
.si-x .si-x-prose .si-page{margin-top:0 !important;padding-left:0;padding-right:0;max-width:none;}