/* ===========================================================
   Kurdisch Akademie · Designsystem (ka-design.css)
   Navy · Gold · Weiß · Hellgrau · Grün(Erfolg) · Rot(Warnung)
   =========================================================== */
:root{
  --ka-navy:#0f2a4a; --ka-navy-2:#0a1f38; --ka-navy-3:#15375e;
  --ka-gold:#c9a93f; --ka-gold-2:#e3c766; --ka-gold-soft:#f6eed6;
  --ka-white:#ffffff; --ka-bg:#f4f6f9; --ka-card:#ffffff;
  --ka-line:#e5e7eb; --ka-ink:#1f2937; --ka-muted:#6b7280;
  --ka-success:#15803d; --ka-success-bg:#e7f6ec;
  --ka-warning:#b91c1c; --ka-warning-bg:#fdeaea;
  --ka-radius:18px; --ka-radius-sm:12px;
  --ka-shadow:0 8px 24px rgba(15,42,74,.08);
  --ka-shadow-lg:0 18px 44px rgba(15,42,74,.16);
  --ka-ease:cubic-bezier(.22,.61,.36,1);
}
[data-theme="dark"]{
  --ka-bg:#0b1726; --ka-card:#11233b; --ka-line:#22405f;
  --ka-ink:#eaf1f8; --ka-muted:#9fb3c8; --ka-white:#11233b;
  --ka-gold-soft:#1c3450;
}

/* ---- Basis ---- */
.ka{box-sizing:border-box}
.ka-wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.ka-section{padding:34px 0}
.ka-eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:800;
  letter-spacing:.04em;text-transform:uppercase;font-size:.72rem;
  color:var(--ka-gold);background:rgba(201,169,63,.12);
  border:1px solid rgba(201,169,63,.35);padding:6px 12px;border-radius:999px}
.ka-h2{font-size:clamp(1.4rem,2.4vw,2rem);color:var(--ka-ink);margin:0 0 6px;font-weight:800;letter-spacing:-.01em}
.ka-lead{color:var(--ka-muted);font-size:1.05rem;line-height:1.6;max-width:60ch}

/* ---- Hero ---- */
.ka-hero{position:relative;overflow:hidden;border-radius:26px;margin:18px 0 26px;
  background:linear-gradient(135deg,var(--ka-navy) 0%,var(--ka-navy-2) 65%);
  color:#fff;padding:46px 40px 40px;box-shadow:var(--ka-shadow-lg)}
.ka-hero::after{content:"";position:absolute;left:40px;bottom:30px;width:84px;height:5px;
  background:linear-gradient(90deg,var(--ka-gold),var(--ka-gold-2));border-radius:4px}
.ka-hero .ka-hero-svg{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
.ka-hero-inner{position:relative;z-index:2;max-width:760px}
.ka-hero h1{font-size:clamp(1.9rem,4vw,3rem);line-height:1.08;margin:14px 0 12px;font-weight:800;letter-spacing:-.02em;color:#fff}
.ka-hero h1 .ku{font-family:"Shasenem Soran","Noto Naskh Arabic",Tahoma,serif;color:var(--ka-gold-2);font-weight:700}
.ka-hero p{font-size:1.1rem;line-height:1.6;color:#dbe7f5;max-width:60ch;margin:0 0 22px}
.ka-hero .ka-eyebrow{color:var(--ka-gold-2);background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}

/* Suche + Filter im Hero */
.ka-searchbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}
.ka-search{position:relative;flex:1;min-width:240px}
.ka-search input{width:100%;box-sizing:border-box;padding:14px 16px 14px 44px;border-radius:14px;
  border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.96);color:#13263d;
  font-size:1rem;outline:none;transition:box-shadow .2s}
.ka-search input:focus{box-shadow:0 0 0 4px rgba(201,169,63,.4)}
.ka-search::before{content:"🔍";position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:.6}
.ka-filters{display:flex;gap:8px;flex-wrap:wrap}
.ka-filters select{padding:13px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.96);color:#13263d;font-size:.95rem}
.ka-filter-toggle{display:none}

/* ---- KPI / Statistik-Karten ---- */
.ka-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:8px 0 4px}
.ka-kpi{background:var(--ka-card);border:1px solid var(--ka-line);border-radius:var(--ka-radius);
  padding:18px 16px;text-align:center;box-shadow:var(--ka-shadow);transition:transform .25s var(--ka-ease),box-shadow .25s}
.ka-kpi:hover{transform:translateY(-4px);box-shadow:var(--ka-shadow-lg)}
.ka-kpi .ic{font-size:1.7rem;display:block;margin-bottom:6px}
.ka-kpi .num{font-size:2rem;font-weight:800;color:var(--ka-navy);line-height:1;letter-spacing:-.02em}
[data-theme="dark"] .ka-kpi .num{color:var(--ka-gold-2)}
.ka-kpi .lbl{color:var(--ka-muted);font-size:.86rem;margin-top:6px;font-weight:600}
.ka-kpi.gold{background:linear-gradient(135deg,var(--ka-gold-soft),#fff)}
[data-theme="dark"] .ka-kpi.gold{background:linear-gradient(135deg,#1c3450,#11233b)}

/* ---- Karten-Raster + 4 Typen ---- */
.ka-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.ka-card{position:relative;background:var(--ka-card);border:1px solid var(--ka-line);
  border-radius:var(--ka-radius);padding:20px;box-shadow:var(--ka-shadow);
  transition:transform .28s var(--ka-ease),box-shadow .28s,border-color .28s;overflow:hidden}
.ka-card::before{content:"";position:absolute;left:0;top:0;height:4px;width:100%;
  background:linear-gradient(90deg,var(--ka-gold),var(--ka-gold-2));transform:scaleX(0);
  transform-origin:left;transition:transform .3s var(--ka-ease)}
.ka-card:hover{transform:translateY(-6px);box-shadow:var(--ka-shadow-lg);border-color:rgba(201,169,63,.5)}
.ka-card:hover::before{transform:scaleX(1)}
.ka-card .ic{font-size:1.9rem;display:inline-flex;width:54px;height:54px;align-items:center;justify-content:center;
  border-radius:14px;background:var(--ka-gold-soft);margin-bottom:10px}
.ka-card h3{margin:4px 0 6px;font-size:1.18rem;color:var(--ka-ink);font-weight:800}
.ka-card p{margin:0;color:var(--ka-muted);font-size:.96rem;line-height:1.55}
.ka-card .chips{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px}
.ka-chip{font-size:.78rem;font-weight:700;color:var(--ka-navy);background:var(--ka-gold-soft);
  border:1px solid rgba(201,169,63,.4);border-radius:999px;padding:4px 10px}
[data-theme="dark"] .ka-chip{color:var(--ka-gold-2)}

/* Lernkarte: linker Goldbalken */
.ka-card--learn{border-left:5px solid var(--ka-gold)}
/* Infokarte: navy-getönt */
.ka-card--info{background:linear-gradient(135deg,#eef3f9,#fff);border-color:#dbe6f1}
[data-theme="dark"] .ka-card--info{background:linear-gradient(135deg,#13273f,#11233b)}
.ka-card--info .ic{background:rgba(15,42,74,.08);color:var(--ka-navy)}
/* Statistikkarte: zentriert, große Zahl */
.ka-card--stat{text-align:center}
.ka-card--stat .num{font-size:2.3rem;font-weight:800;color:var(--ka-navy);letter-spacing:-.02em}
[data-theme="dark"] .ka-card--stat .num{color:var(--ka-gold-2)}
/* Aktionskarte: navy bg, weiße Schrift, CTA */
.ka-card--action{background:linear-gradient(135deg,var(--ka-navy),var(--ka-navy-3));color:#fff;border:0}
.ka-card--action::before{display:none}
.ka-card--action h3{color:#fff}.ka-card--action p{color:#cfe0f1}
.ka-card--action .ic{background:rgba(255,255,255,.12)}

/* ---- Buttons ---- */
.ka-btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.97rem;
  border:0;border-radius:13px;padding:12px 20px;cursor:pointer;text-decoration:none;
  background:var(--ka-navy);color:#fff;
  transition:transform .15s var(--ka-ease),box-shadow .2s,background .2s;line-height:1}
.ka-btn:active{transform:translateY(1px)}
.ka-btn--primary{background:var(--ka-navy);color:#fff;box-shadow:0 6px 16px rgba(15,42,74,.25)}
.ka-btn--primary:hover{background:var(--ka-navy-3);box-shadow:0 10px 22px rgba(15,42,74,.32)}
.ka-btn--gold{background:linear-gradient(135deg,var(--ka-gold),var(--ka-gold-2));color:#3a2c05;box-shadow:0 6px 16px rgba(201,169,63,.35)}
.ka-btn--gold:hover{filter:brightness(1.05);box-shadow:0 10px 22px rgba(201,169,63,.45)}
.ka-btn--ghost{background:transparent;color:var(--ka-navy);border:1.5px solid var(--ka-navy)}
.ka-btn--ghost:hover{background:var(--ka-navy);color:#fff}
[data-theme="dark"] .ka-btn--ghost{color:var(--ka-gold-2);border-color:var(--ka-gold-2)}

/* ---- Hinweise / Status ---- */
.ka-note{border-radius:14px;padding:14px 16px;border:1px solid var(--ka-line);background:var(--ka-card)}
.ka-note.success{background:var(--ka-success-bg);border-color:#bfe6cb;color:var(--ka-success)}
.ka-note.warn{background:var(--ka-warning-bg);border-color:#f3c6c6;color:var(--ka-warning)}
.ka-note a{font-weight:700;color:inherit}

/* ---- Related / Seitenende ---- */
.ka-related{margin-top:36px;background:var(--ka-card);border:1px solid var(--ka-line);
  border-radius:22px;padding:24px;box-shadow:var(--ka-shadow)}
.ka-related h2{margin:0 0 14px;font-size:1.2rem;color:var(--ka-ink)}
.ka-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.ka-related a{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:13px;
  background:var(--ka-bg);text-decoration:none;color:var(--ka-ink);font-weight:600;
  border:1px solid var(--ka-line);transition:transform .2s var(--ka-ease),border-color .2s}
.ka-related a:hover{transform:translateX(4px);border-color:var(--ka-gold)}
.ka-meta-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px;padding-top:14px;
  border-top:1px dashed var(--ka-line);color:var(--ka-muted);font-size:.86rem}
.ka-meta-row b{color:var(--ka-ink)}

/* ---- Animationen (ausfallsicher: nur verstecken, wenn JS bestätigt aktiv ist) ---- */
.reveal{opacity:1;transform:none}
html.ka-js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ka-ease),transform .6s var(--ka-ease)}
html.ka-js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html.ka-js .reveal{opacity:1!important;transform:none!important}
  .ka-card,.ka-kpi,.ka-btn{transition:none}
}

/* ---- Sticky Header (vorhandener site-header) ---- */
.site-header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(1.2) blur(2px)}

/* ---- Retrofit: vorhandene Karten-/Hero-Klassen angleichen ---- */
.toolcard,.lib-card,.corpus-card,.dict-card,.t-card,.portal-card,.rescard{
  border-radius:var(--ka-radius)!important;box-shadow:var(--ka-shadow);
  transition:transform .28s var(--ka-ease),box-shadow .28s}
.toolcard:hover,.lib-card:hover,.dict-card:hover,.t-card:hover,.portal-card:hover{
  transform:translateY(-5px);box-shadow:var(--ka-shadow-lg)}
/* Sektions-Karten (Subartu, Kurden, Philosophie, Pioniere) */
.kd-card,.sb-card,.phcard,.pn-card{transition:transform .28s var(--ka-ease),box-shadow .28s}
.kd-card:hover,.sb-card:hover,.phcard:hover,.pn-card:hover{transform:translateY(-5px);box-shadow:var(--ka-shadow-lg)}
/* Related-Box immer zentriert (falls außerhalb eines Containers eingefügt) */
.ka-wrap>.ka-related{margin-left:0;margin-right:0}

/* ---- Mobile ---- */
@media (max-width:760px){
  .ka-hero{padding:30px 22px 26px;border-radius:20px}
  .ka-hero h1{font-size:1.7rem}
  .ka-btn{padding:14px 20px;font-size:1rem}
  .ka-search input{padding:15px 16px 15px 44px;font-size:1rem}
  .ka-filter-toggle{display:inline-flex;width:100%;justify-content:center;margin-bottom:8px}
  .ka-filters{display:none;width:100%}
  .ka-filters.open{display:flex}
  .ka-filters select{flex:1;min-width:140px}
  .ka-related a:hover{transform:none}
}