/* =====================================================================
   KI-WERKSTATT – GEMEINSAMES STYLESHEET (Version 2.8)
   ---------------------------------------------------------------------
   Farbgebung: Standardfarbe der Website ist #0c5393 (Blau).
   Die Palette ist als CSS-Variablen definiert, sodass alle Bereiche
   (Teilnehmer, Kursleitung, Startseite) zentral angepasst werden koennen.
   ===================================================================== */

:root{
  --g:#0c5393;        /* Hauptfarbe (Standardfarbe der Website) */
  --g2:#1063b8;       /* hellere Variante fuer Verlaeufe/Akzente */
  --gl:#e3eef9;       /* sehr helle Akzentflaeche */
  --ink:#14202b;      /* Textfarbe */
  --muted:#63707c;    /* Sekundaertext */
  --bg:#f4f7fb;       /* Seitenhintergrund */
  --card:#fff;
  --line:#d5e0ec;     /* Rahmenlinien */
  --gold:#efc84a;     /* bleibt: Spiel-Buttons Datenschutz */
  --red:#963d3d;      /* bleibt: Loesch-/Warnbuttons */
  --r:18px;
  --shadow:0 12px 32px rgba(9,42,80,.08);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:var(--g2)}

/* Kopfzeile: Das Logo steht direkt vor dem Text "KI-Werkstatt ..." und
   ist auf die Texthoehe skaliert (1.5em = Zeilenhoehe des Titels).
   Breite folgt automatisch aus dem Seitenverhaeltnis des Bildes. */
.top{position:relative;z-index:30;background:rgba(244,247,251,.96);border-bottom:1px solid var(--line)}.topin{max-width:1260px;margin:auto;padding:10px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{font-weight:850;color:var(--g);display:flex;align-items:center;gap:8px}.brand-logo{height:1.5em;width:auto;object-fit:contain;display:block}.mark{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--g);color:#fff;overflow:hidden}.mark img{width:100%;height:100%;object-fit:cover;border-radius:10px;display:block}.progress{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:14px}.bar{width:170px;height:8px;background:#d8e4f2;border-radius:99px;overflow:hidden}.bar span{display:block;height:100%;width:0;background:var(--g2)}

.wrap{max-width:1260px;margin:auto;padding:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:23px;box-shadow:var(--shadow);margin:18px 0}.hero{background:linear-gradient(145deg,#072f57,#1063b8);color:#fff;padding:34px;border-radius:25px;box-shadow:var(--shadow);margin-bottom:18px}.eyebrow,.kicker{font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.eyebrow{opacity:.82}.kicker{color:var(--g2)}.hero h1{font-size:clamp(35px,5vw,58px);line-height:1.02;margin:10px 0}.hero p{font-size:18px;max-width:930px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.chip{padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.14);font-size:13px}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.btn{border:0;border-radius:11px;padding:10px 14px;background:var(--g);color:#fff;font-weight:800}.btn.secondary{background:#e9f0f8;color:var(--g)}.btn.gold{background:var(--gold);color:#3b3100}.btn.red{background:var(--red);color:#fff}.actions{display:flex;flex-wrap:wrap;gap:8px}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:11px;padding:11px 12px;background:#fff}.work{min-height:230px;resize:vertical}textarea{resize:vertical}.callout{padding:15px;border-radius:13px;background:#fff8de;border:1px solid #ead99a}.danger{padding:15px;border-radius:13px;background:#fff0f0;border:1px solid #eccaca}.notice{padding:13px 15px;border-radius:12px;background:#ecf4fc;border:1px solid #cbe0f2}.module{border:1px solid var(--line);border-radius:15px;padding:16px;background:#fff}.module.locked{opacity:.55}.prompt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.prompt{border:1px solid var(--line);border-radius:15px;padding:16px}.prompt h3{font-size:17px;margin:4px 0 7px}.badge{display:inline-block;padding:5px 8px;border-radius:999px;background:var(--gl);color:var(--g);font-size:11px;font-weight:850}pre{white-space:pre-wrap;background:#eef3f8;border-radius:11px;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.table th{font-size:12px;color:var(--muted);text-transform:uppercase}.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px}.stat strong{display:block;font-size:24px;color:var(--g)}.checks label{display:block;margin:9px 0}.checks input{width:auto;margin-right:8px}.cert{border:2px solid var(--g);border-radius:18px;padding:32px;text-align:center;background:linear-gradient(#fff,#f1f7fd)}.cert h2{font-size:34px}.cert-name{font-size:25px;font-weight:850;color:var(--g);margin:16px}.hidden{display:none!important}.footer{padding:30px 2px 60px;color:var(--muted);font-size:12px;text-align:center}.filterbar{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:10px}.status-pill{display:inline-block;padding:5px 8px;border-radius:999px;background:var(--gl);color:var(--g);font-weight:800;font-size:12px}.savebox{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.trainer-lock{background:#fff8de;border:1px solid #ead99a;padding:14px;border-radius:12px}

/* Startseiten-Hero: Logo-Karte oben */
.hero-logo{width:110px;height:110px;border-radius:22px;background:#fff;padding:7px;box-shadow:0 6px 18px rgba(0,0,0,.18);display:block}

@media(max-width:950px){.grid3,.statgrid{grid-template-columns:1fr 1fr}.prompt-grid{grid-template-columns:1fr}.filterbar{grid-template-columns:1fr 1fr}.layout{grid-template-columns:1fr}}
@media(max-width:650px){.wrap{padding:10px}.hero{padding:23px}.grid2,.grid3,.statgrid,.filterbar{grid-template-columns:1fr}.progress .label{display:none}.bar{width:95px}.savebox{grid-template-columns:1fr}}
@media print{.top,.footer,.no-print,.actions,.trainer-lock{display:none!important}.wrap{max-width:none}.card,.hero{box-shadow:none}.cert{break-inside:avoid}}