/* Sim-Department — FAQ Widget. Alles unter .sd-faq gekapselt. */
.sd-faq{
  --sdf-text: var(--sd-offwhite, #F5F3EF);
  --sdf-muted: #9a9aa2;
  --sdf-faint: #6a6a72;
  --sdf-accent: var(--sd-red, #E10600);
  --sdf-accent-dim: rgba(225,6,0,.12);
  --sdf-panel: rgba(255,255,255,.03);
  --sdf-panel-2: rgba(255,255,255,.05);
  --sdf-line: rgba(245,243,239,.12);
  --sdf-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sdf-display: "Inter Display", "Inter", system-ui, sans-serif;
  --sdf-body: "Inter", system-ui, sans-serif;

  color: var(--sdf-text);
  font-family: var(--sdf-body);
  font-size: 15px;
  line-height: 1.6;
  max-width: 1100px;
  margin: 0 auto;
  width: 100%;
}
.sd-faq *{ box-sizing: border-box; }
.sd-faq a{ color: var(--sdf-accent); text-decoration: none; }
.sd-faq a:hover{ text-decoration: underline; }
.sd-faq .sdf-boot{ padding: 48px 8px; color: var(--sdf-muted); font-family: var(--sdf-mono); font-size: 13px; letter-spacing: .06em; }

/* ---- top bar ---- */
.sdf-bar{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.sdf-search{ flex:1 1 320px; display:flex; align-items:center; gap:12px; height:52px; padding:0 16px;
  background: var(--sdf-panel); border:1px solid var(--sdf-line); border-radius:4px; }
.sdf-search:focus-within{ border-color: var(--sdf-accent); box-shadow:0 0 0 3px var(--sdf-accent-dim); }
.sdf-search__icon{ color: var(--sdf-accent); font-family: var(--sdf-mono); }
.sdf-search__input{ flex:1; background:transparent; border:0; outline:0; color:var(--sdf-text);
  font-family: var(--sdf-mono); font-size:15px; }
.sdf-search__input::placeholder{ color: var(--sdf-faint); }

.sdf-meta{ display:flex; align-items:center; gap:14px; font-family:var(--sdf-mono); font-size:11px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--sdf-muted); }
.sdf-live{ display:flex; align-items:center; gap:7px; }
.sdf-led{ width:8px; height:8px; border-radius:50%; background:#35D07F; box-shadow:0 0 9px 1px rgba(53,208,127,.5); }
.sd-faq[data-state="error"] .sdf-led{ background: var(--sdf-accent); box-shadow:none; }

.sdf-lang{ display:flex; border:1px solid var(--sdf-line); border-radius:3px; overflow:hidden; }
.sdf-lang button{ font-family:var(--sdf-mono); font-size:11px; letter-spacing:.1em; background:transparent;
  color:var(--sdf-muted); border:0; padding:6px 12px; cursor:pointer; }
.sdf-lang button.on{ background: var(--sdf-accent); color:#fff; font-weight:700; }

/* ---- layout ---- */
.sdf-body{ display:grid; grid-template-columns: 220px 1fr; gap:32px; align-items:start; }

/* ---- timing tower ---- */
.sdf-tower{ position:sticky; top:90px; align-self:start; max-height:calc(100vh - 120px); overflow:auto; }
.sdf-chan{ display:flex; align-items:center; width:100%; text-align:left; cursor:pointer;
  background:transparent; border:0; border-left:2px solid transparent; color:var(--sdf-muted);
  font-family:var(--sdf-mono); font-size:12.5px; padding:8px 12px; }
.sdf-chan:hover{ color:var(--sdf-text); background:var(--sdf-panel); }
.sdf-chan.on{ color:var(--sdf-text); border-left-color:var(--sdf-accent);
  background:linear-gradient(90deg, var(--sdf-accent-dim), transparent); }
.sdf-chan__name{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sdf-chan__ct{ color:var(--sdf-faint); font-size:11px; padding-left:8px; }
.sdf-chan.on .sdf-chan__ct{ color:var(--sdf-accent); }

/* ---- entries ---- */
.sdf-cathead{ display:flex; align-items:baseline; gap:12px; margin:4px 0 14px; }
.sdf-cathead:not(:first-child){ margin-top:34px; padding-top:24px; border-top:1px solid var(--sdf-line); }
.sdf-cathead h3{ font-family:var(--sdf-display); font-weight:600; font-size:20px; margin:0; letter-spacing:-.01em; color:var(--sdf-text); }
.sdf-idx{ font-family:var(--sdf-mono); font-size:11px; color:var(--sdf-accent); letter-spacing:.1em; }

.sdf-entry{ border:1px solid var(--sdf-line); border-radius:4px; margin-bottom:8px; background:var(--sdf-panel); overflow:hidden; }
.sdf-q{ display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer;
  background:transparent; border:0; color:var(--sdf-text); padding:14px 16px;
  font-family:var(--sdf-display); font-size:15.5px; font-weight:500; letter-spacing:-.005em; }
.sdf-q:hover{ background:var(--sdf-panel-2); }
.sdf-mark{ font-family:var(--sdf-mono); color:var(--sdf-accent); width:14px; flex:none; transition:transform .25s ease; }
.sdf-entry.open .sdf-mark{ transform:rotate(90deg); }
.sdf-qt{ flex:1; }
.sdf-fb{ font-family:var(--sdf-mono); font-size:9px; letter-spacing:.12em; color:var(--sdf-faint);
  border:1px solid var(--sdf-line); border-radius:2px; padding:1px 5px; flex:none; }

.sdf-awrap{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
.sdf-entry.open .sdf-awrap{ grid-template-rows:1fr; }
.sdf-ainner{ overflow:hidden; }
.sdf-a{ padding:2px 16px 18px 42px; color:#d8d6d2; font-size:14px; }
.sdf-a p{ margin:0 0 10px; }
.sdf-a ul, .sdf-a ol{ margin:0 0 10px; padding-left:20px; }
.sdf-a li{ margin:3px 0; }
.sdf-a h4{ font-family:var(--sdf-display); font-size:14px; color:var(--sdf-text); margin:14px 0 6px; }
.sdf-a code{ font-family:var(--sdf-mono); font-size:12.5px; background:rgba(0,0,0,.35);
  padding:1px 5px; border-radius:2px; color:var(--sdf-accent); }
.sdf-a img{ max-width:340px; width:100%; height:auto; border:1px solid var(--sdf-line);
  border-radius:3px; margin:2px 0 12px; display:block; }
.sdf-a a.image{ display:inline-block; }

.sdf-empty{ border:1px dashed var(--sdf-line); border-radius:4px; padding:40px 24px; text-align:center; color:var(--sdf-muted); }
.sdf-empty__h{ font-family:var(--sdf-display); font-size:18px; color:var(--sdf-text); margin:0 0 6px; }

@media (max-width:820px){
  .sdf-body{ grid-template-columns:1fr; gap:18px; }
  .sdf-tower{ position:static; max-height:none; display:flex; gap:6px; overflow-x:auto; padding-bottom:6px; }
  .sdf-chan{ border-left:0; border-bottom:2px solid transparent; white-space:nowrap; }
  .sdf-chan.on{ background:var(--sdf-accent-dim); border-bottom-color:var(--sdf-accent); }
}
@media (prefers-reduced-motion: reduce){ .sd-faq *{ transition:none !important; } }

.sd-faq{
  /* … bestehende Zeilen … */
  padding-top: clamp(90px, 12vh, 140px);
}