/* ==========================================================================
   alleKI Relaunch — Design-Schicht über dem Parent-Theme "alleki"
   Überschreibt Variablen + Komponenten. Klassennamen (.ak-*) bleiben gleich,
   damit alle MU-Plugins weiter funktionieren.

   Inhalt
   1  Schriften          7  Kategorien        13 Artikel / Fließtext
   2  Design-Tokens      8  Filter            14 Newsletter, Trust, Footer
   3  Basis              9  Tool-Karten       15 Plugin-Inhalte (Overrides)
   4  Layout-Helfer      10 Vergleiche        16 Barrierefreiheit
   5  Header             11 Blog-Karten
   6  Startseiten-Hero   12 Detailseiten
   ========================================================================== */

/* 1 ── Schriften (lokal, SIL OFL) ───────────────────────────────────────── */
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 900;font-display:swap;
  src:url("../fonts/schibsted-grotesk-var.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;
  src:url("../fonts/source-serif-4-var.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:200 900;font-display:swap;
  src:url("../fonts/source-serif-4-italic-var.woff2") format("woff2")}

/* 2 ── Tokens ───────────────────────────────────────────────────────────── */
:root{
  [style*="background:var(--ak-accent)"][style*="color:#fff"],[style*="background:var(--ak-accent);"][style*="color: #fff"]{color:var(--ak-on-accent)!important}

/* Flächen */
  --ak-bg:#F6F7F9;
  --ak-surface:#FFFFFF;
  --ak-surface2:#EEF1F5;
  --ak-line:#DFE3E8;
  --ak-border:#DFE3E8;
  --ak-border-hover:#98A2B3;

  /* Text */
  --ak-ink:#101828;
  --ak-text:#101828;
  --ak-muted:#475467;
  --ak-faint:#667085;

  /* Aktion (Prüfblau) */
  --ak-accent:#1B3AB8;
  --ak-accent-hover:#142C8F;
  --ak-accent-tint:#E8ECFA;
  --ak-accent-line:#B5C2F5;
  --ak-on-accent:#fff;      /* Text auf Akzent-Flächen */
  --ak-on-ink:#fff;         /* Text auf Tinten-Flächen */
  --ak-body:#1D2939;
  --ak-cyan:#0B6E99;
  --ak-purple:#5B3FA6;

  /* Datenschutz-Ampel — nur für Status, nie als Dekoration */
  --ak-green:#11703F;
  --ak-green-tint:#E6F4EC;
  --ak-green-line:#9AD1B2;
  --ak-yellow:#8A5A00;
  --ak-yellow-tint:#FBF1DC;
  --ak-yellow-line:#EBD39A;
  --ak-red:#B42318;
  --ak-red-tint:#FCE9E7;
  --ak-red-line:#F0A8A1;
  --ak-pink:#B42318;
  --ak-orange:#B54708;

  /* Form */
  --ak-radius:8px;
  --ak-radius-sm:6px;
  --ak-pill:6px;
  --ak-max:1160px;
  --ak-tr:color .15s ease,background-color .15s ease,border-color .15s ease;

  /* Schrift */
  --ak-font:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ak-serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --ak-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --akr-gutter:calc(max(0px,(100% - var(--ak-max))/2) + 24px);
  color-scheme:light;
}

/* 3 ── Basis ────────────────────────────────────────────────────────────── */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--ak-bg);color:var(--ak-text);
  font-family:var(--ak-font);font-size:16px;line-height:1.6;font-weight:400;
  font-feature-settings:"kern","liga";text-rendering:optimizeLegibility;
}
body::before{display:none!important}            /* Rauschen/Grain des alten Designs */
::selection{background:var(--ak-accent-tint);color:var(--ak-ink)}
h1,h2,h3,h4{color:var(--ak-ink);text-wrap:balance}
a{transition:var(--ak-tr)}
img{height:auto}
p{text-wrap:pretty}

/* Das alte Design nutzte Gradient-Text für Zahlen und Wörter */
.ak-grad{background:none!important;-webkit-text-fill-color:currentColor!important;color:inherit!important}

/* Dünne Schriftschnitte sind auf hellem Grund schlecht lesbar */
[style*="font-weight:300"]{font-weight:400!important}

/* 4 ── Layout-Helfer ────────────────────────────────────────────────────── */
.ak-wrap{max-width:var(--ak-max);padding:0 24px}
.ak-section{padding:48px 0}

.ak-label{                                           /* früher: Mono-Versalien mit Strich */
  font-family:var(--ak-font);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;
  color:var(--ak-muted);margin:0 0 6px;display:block
}
.ak-label::before{display:none}
.ak-label:has(+ div .ak-title){display:none}         /* doppelt gemoppelt: Label + Titel */

.ak-title{font-size:clamp(1.6rem,2.6vw,2rem);font-weight:650;letter-spacing:-.022em;line-height:1.15;margin:0 0 6px}
.ak-desc{color:var(--ak-muted);font-size:15px;font-weight:400}

/* Alle Sammlungen (Kategorien, Tools, Vergleiche, Blog) teilen eine Struktur:
   Zellen mit Haarlinie statt schwebender Karten. */
.ak-cat-grid,.ak-tools-grid,.ak-comp-grid,.ak-blog-grid{
  display:grid;gap:0;padding:1px 0 0 1px;
}
.ak-cat-grid>*,.ak-tools-grid>*,.ak-comp-grid>*,.ak-blog-grid>*{
  background:var(--ak-surface);border:1px solid var(--ak-line);margin:-1px 0 0 -1px;
}

/* 5 ── Header ───────────────────────────────────────────────────────────── */
.ak-header{
  position:sticky;top:0;left:auto;right:auto;
  padding:0 var(--akr-gutter);min-height:64px;
  background:var(--ak-surface);backdrop-filter:none;
  border-bottom:1px solid var(--ak-line);box-shadow:none;
  gap:24px;
}
.ak-header.scrolled{padding:0 var(--akr-gutter);background:var(--ak-surface)}
.ak-logo{gap:10px;flex:none}
.ak-logo svg{width:30px;height:30px}
.ak-logo svg rect{fill:var(--ak-ink);rx:7px}
.ak-logo svg path{stroke:var(--ak-on-ink)}
.ak-logo svg circle{fill:var(--ak-on-ink)}
.ak-logo-text{font-size:21px;font-weight:500;letter-spacing:-.03em;color:var(--ak-ink)}
.ak-logo-text span{color:var(--ak-accent);font-weight:700}
.ak-logo-badge{background:none;border:1px solid var(--ak-line);color:var(--ak-muted);border-radius:4px;
  padding:1px 6px;font-size:10px;font-weight:600;letter-spacing:.04em;margin-left:2px}

.ak-nav-wrap{margin-left:auto}
.ak-nav{gap:4px}
.ak-nav a{color:var(--ak-muted);font-size:14.5px;font-weight:500;padding:8px 10px;border-radius:var(--ak-radius-sm);display:inline-block}
.ak-nav a:hover,.ak-nav .current-menu-item a{color:var(--ak-ink);background:var(--ak-surface2)}
.ak-nav a[href*="tool-einreichen"]{
  margin-left:8px;color:var(--ak-ink);border:1px solid var(--ak-ink);padding:7px 14px;background:transparent}
.ak-nav a[href*="tool-einreichen"]:hover{background:var(--ak-ink);color:var(--ak-on-ink)}
.ak-nav-cta{background:var(--ak-ink)!important;color:var(--ak-on-ink)!important;border-radius:var(--ak-radius-sm)}

.ak-menu-toggle{
  width:44px;height:44px;border:1px solid var(--ak-line);border-radius:var(--ak-radius-sm);
  background:var(--ak-surface);color:var(--ak-ink);font-size:20px;line-height:1;cursor:pointer;margin-left:auto}

@media(max-width:960px){
  .ak-header{flex-wrap:wrap;align-items:center;padding-block:10px}
  .ak-nav-wrap{display:none;order:3;flex:1 0 100%;margin:0;padding:8px 0 12px;
    position:static;background:none;border:0;border-top:1px solid var(--ak-line)}
  .ak-nav-wrap.open{display:block}
  .ak-menu-toggle{display:block}
  .ak-nav{flex-direction:column;align-items:stretch;gap:0}
  .ak-nav a{display:block;padding:12px 4px;font-size:16px;border-radius:0;border-bottom:1px solid var(--ak-line);background:none!important}
  .ak-nav a[href*="tool-einreichen"]{margin:12px 0 0;text-align:center;border-radius:var(--ak-radius-sm);border:1px solid var(--ak-ink)}
}
@media(min-width:961px){.ak-menu-toggle{display:none}}

/* 6 ── Startseiten-Hero ─────────────────────────────────────────────────── */
.ak-hero{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:72px;row-gap:0;
  align-items:start;justify-items:start;text-align:left;
  padding:64px var(--akr-gutter) 56px;overflow:visible;
  background:var(--ak-surface);border-bottom:1px solid var(--ak-line);
}
.ak-hero-glow{display:none}
.ak-hero>*{grid-column:1}
.ak-hero-badge{
  display:block;padding:0;background:none;border:0;border-radius:0;
  font-size:15px;font-weight:500;color:var(--ak-muted);margin:0 0 20px}
.ak-hero h1{
  font-size:clamp(2.4rem,5vw,4rem);font-weight:650;line-height:1.04;letter-spacing:-.035em;
  margin:0 0 20px;color:var(--ak-ink)}
.ak-hero>p{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.55;color:var(--ak-muted);max-width:34em;font-weight:400}
.ak-hero>div[style*="justify-content:center"]{justify-content:flex-start!important}
.ak-hero>div[style*="margin-top:28px"]{margin-top:32px!important;gap:10px!important}
.ak-hero>div[style*="margin-top:14px"]{margin-top:16px!important;gap:20px!important}
.ak-hero>div[style*="margin-top:14px"] span{color:var(--ak-faint)!important;font-size:14px!important}

.ak-hero-search{
  display:flex;gap:8px;width:100%;max-width:34rem;margin:28px 0 0}
.ak-hero-search input[type=search]{
  flex:1;min-width:0;height:52px;padding:0 16px;font-size:16px;font-family:inherit;
  background:var(--ak-surface);color:var(--ak-ink);border:1px solid var(--ak-ink);border-radius:var(--ak-radius-sm)}
.ak-hero-search input[type=search]:focus-visible{outline:2px solid var(--ak-accent);outline-offset:2px}
.ak-hero-search button{
  flex:none;height:52px;padding:0 22px;font:600 16px/1 var(--ak-font);cursor:pointer;
  background:var(--ak-accent);color:var(--ak-on-accent);border:1px solid var(--ak-accent);border-radius:var(--ak-radius-sm)}
.ak-hero-search button:hover{background:var(--ak-accent-hover);border-color:var(--ak-accent-hover)}
.ak-hero-search+div[style*="margin-top:28px"]{margin-top:16px!important}
.ak-hero-search+div .ak-btn-primary{background:transparent;color:var(--ak-ink);border-color:var(--ak-ink)}   /* nur eine Hauptaktion: die Suche */
.ak-hero-search+div .ak-btn-primary:hover{background:var(--ak-ink);color:var(--ak-on-ink)}
.ak-stats{
  grid-column:2;grid-row:1 / span 6;align-self:center;
  display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin:0;width:100%;justify-content:stretch}
.ak-stats>div{text-align:left!important;border-top:1px solid var(--ak-ink);padding:16px 0 32px}
.ak-stat-n{font-size:clamp(2.6rem,5vw,3.75rem);font-weight:600;letter-spacing:-.04em;line-height:1;
  font-variant-numeric:tabular-nums;color:var(--ak-ink)}
.ak-stat-l{font-size:15px;color:var(--ak-muted);margin-top:8px;font-weight:500}

@media(max-width:900px){
  .ak-hero{grid-template-columns:minmax(0,1fr);padding-top:48px;padding-bottom:48px}
  .ak-stats{grid-column:1;grid-row:auto;margin-top:40px}
}

/* Buttons */
.ak-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 22px;border-radius:var(--ak-radius-sm);font-weight:600;font-size:15px;line-height:1.2;
  border:1px solid transparent;text-decoration:none;cursor:pointer;transition:var(--ak-tr)}
.ak-btn-primary{background:var(--ak-accent);color:var(--ak-on-accent);border-color:var(--ak-accent)}
.ak-btn-primary:hover{background:var(--ak-accent-hover);border-color:var(--ak-accent-hover);transform:none;box-shadow:none;color:var(--ak-on-accent)}
.ak-btn-outline{background:transparent;color:var(--ak-ink);border:1px solid var(--ak-ink);padding:13px 22px;font-size:15px}
.ak-btn-outline:hover{background:var(--ak-ink);color:var(--ak-on-ink)}
.ak-btn[disabled]{opacity:.45;cursor:not-allowed}
.ak-hero .ak-btn{padding:14px 24px!important;font-size:16px!important;font-weight:600!important}

/* Hero-Anzeige (wird per JS von MU-Plugin hinter .ak-hero eingefügt) */
.ak-hero+div[style*="max-width:1200px"],.ak-hero+div[style*="max-width: 1200px"]{max-width:var(--ak-max)!important;margin-top:32px!important;box-sizing:border-box}

/* Startseite: Sektionen mit eigenem Seitenabstand würden doppelt einrücken */
section[style*="padding:0 24px"]{padding-left:0!important;padding-right:0!important}

/* 7 ── Kategorien ───────────────────────────────────────────────────────── */
section:has(>.ak-wrap>.ak-cats){padding-top:44px!important}
.ak-cats{background:none;border:0;border-radius:0;padding:0;margin:0;position:static}
.ak-cats>div:first-child{align-items:baseline!important;margin-bottom:16px!important}
.ak-cats h2{font-size:clamp(1.4rem,2.2vw,1.75rem)!important;font-weight:650!important;letter-spacing:-.02em}
.ak-cats a[style*="font-size:12px"]{font-size:14px!important;font-weight:600!important;color:var(--ak-accent)!important}

.ak-cat-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.ak-cat-btn{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  border-radius:0;padding:13px 16px;color:var(--ak-ink);text-align:left}
.ak-cat-btn:hover,.ak-cat-btn.active{background:var(--ak-surface2)}
.ak-cat-icon{display:none}
.ak-cat-name{font-size:15px;font-weight:600}
.ak-cat-count{font-size:13.5px;color:var(--ak-faint);font-variant-numeric:tabular-nums;white-space:nowrap}

a[style*="color:var(--ak-accent)"][style*="font-size:12px"]{font-size:14px!important;font-weight:600!important}
[id]{scroll-margin-top:84px}

/* 8 ── Filter ───────────────────────────────────────────────────────────── */
.ak-filters{gap:6px}
.ak-filter{
  padding:8px 14px;border-radius:var(--ak-radius-sm);font-size:14px;font-weight:500;
  background:var(--ak-surface);color:var(--ak-muted);border:1px solid var(--ak-line);cursor:pointer}
.ak-filter:hover{color:var(--ak-ink);border-color:var(--ak-border-hover);background:var(--ak-surface)}
.ak-filter.active{background:var(--ak-ink);color:var(--ak-on-ink);border-color:var(--ak-ink)}

/* 9 ── Tool-Karten ──────────────────────────────────────────────────────── */
.ak-tools-grid{grid-template-columns:repeat(auto-fill,minmax(310px,1fr))}
.ak-tool-wrap{display:flex}
.ak-tool-wrap>*{flex:1;min-width:0}
.ak-card{
  display:flex;flex-direction:column;height:100%;
  background:transparent;border:0;border-radius:0;padding:18px 18px 14px;box-shadow:none;transform:none}
.ak-tools-grid>.ak-card{background:var(--ak-surface);border:1px solid var(--ak-line)}
.ak-tools-grid>.ak-card:hover{background:var(--ak-surface2);border-color:var(--ak-line)}
.ak-card::before{display:none}
.ak-card:hover{background:var(--ak-surface2);border-color:transparent;transform:none;box-shadow:none}
.ak-card:hover .ak-card-name{color:var(--ak-accent)}
.ak-card-head{align-items:flex-start;gap:8px;margin-bottom:10px}
.ak-card-info{gap:12px;min-width:0}
.ak-card-icon{
  flex:none;width:36px;height:36px;border-radius:var(--ak-radius-sm);
  background:var(--ak-surface2)!important;color:var(--ak-ink)!important;
  border:1px solid var(--ak-line);font-size:16px;font-weight:650}
.ak-card-icon img{background:#fff}
.ak-card-name{font-size:16px;font-weight:650;letter-spacing:-.01em;line-height:1.25;color:var(--ak-ink)}
.ak-card-maker{font-size:13px;color:var(--ak-faint)}
.ak-card-desc{font-size:14px;line-height:1.5;color:var(--ak-muted);font-weight:400;margin-bottom:12px;min-height:0}
.ak-card-tags{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0 0 12px}
.ak-card-foot{
  margin-top:auto;border-top:1px solid var(--ak-line);padding-top:10px;
  display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ak-card-price{font-size:13.5px;color:var(--ak-muted);font-weight:400;text-align:right;flex:1;min-width:0;line-height:1.4}
.ak-card-foot .ak-rating{flex:none;white-space:nowrap}

/* Bewertung: Zahl statt fünf Sterne */
.ak-rating{display:inline-flex;align-items:baseline;gap:0}
.ak-rating .s{display:none}
.ak-rating .v{margin:0;font-size:16px;font-weight:650;color:var(--ak-ink);letter-spacing:0}
.ak-rating .v::after{content:" / 5";font-size:13px;font-weight:400;color:var(--ak-faint)}

/* Kategorie-Tag */
.ak-tag{background:none;padding:0;border-radius:0;font-size:13.5px;color:var(--ak-muted);font-weight:400}

/* Datenschutz-Status — das wiederkehrende Erkennungszeichen der Seite */
.ak-dsgvo{
  display:inline-flex;align-items:center;gap:7px;
  padding:0;background:none;border-radius:0;font-size:13.5px;font-weight:600;white-space:nowrap}
.ak-dsgvo::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;flex:none}
.ak-dsgvo-green{background:none;color:var(--ak-green)}
.ak-dsgvo-yellow{background:none;color:var(--ak-yellow)}
.ak-dsgvo-red{background:none;color:var(--ak-red)}

/* Badges: ruhig, nur „Redaktions-Tipp" ist gefüllt */
.ak-badge{
  flex:none;font-size:12px;font-weight:600;padding:3px 8px;border-radius:4px;
  background:transparent;color:var(--ak-muted);border:1px solid var(--ak-line);white-space:nowrap}
.ak-b-tip{background:var(--ak-ink);color:var(--ak-on-ink);border-color:var(--ak-ink)}
.ak-b-de,.ak-b-best,.ak-b-new,.ak-b-os,.ak-b-aff{background:transparent;color:var(--ak-ink);border-color:var(--ak-border-hover)}

/* 10 ── Vergleiche ──────────────────────────────────────────────────────── */
.ak-comp-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.ak-comp-card{border-radius:0;padding:15px 18px;background:var(--ak-surface)}
.ak-comp-card:hover{background:var(--ak-surface2);transform:none;border-color:var(--ak-line)}
.ak-comp-card>div:first-child{margin-bottom:6px!important}
.ak-comp-card>div:first-child>span[style*="font-size:14px"]:first-child{display:none}
.ak-comp-title{font-size:15.5px;font-weight:650;color:var(--ak-ink);line-height:1.3}
.ak-comp-card:hover .ak-comp-title{color:var(--ak-accent)}
.ak-comp-sub{font-size:14px;color:var(--ak-muted);font-weight:400;margin-top:4px;line-height:1.5}
.ak-hot{display:none}
.ak-versus{gap:0;margin-bottom:40px;border:1px solid var(--ak-line);background:var(--ak-surface)}
.ak-vs-card{border:0;border-radius:0;background:transparent;padding:28px}
.ak-vs-sep{color:var(--ak-faint);font-size:15px;font-weight:600;padding:0 8px}
.ak-winner{background:var(--ak-green-tint);border:1px solid var(--ak-green-line);color:var(--ak-green);border-radius:var(--ak-radius-sm);padding:12px 16px;font-weight:600}

/* 11 ── Blog-Karten ─────────────────────────────────────────────────────── */
section:has(>.ak-wrap>.ak-label+div .ak-blog-grid),
section:has(>.ak-wrap .ak-blog-grid){padding-top:24px}
.ak-blog-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.ak-blog-card{border-radius:0;padding:20px;background:var(--ak-surface);position:static;display:flex;flex-direction:column}
.ak-blog-card::before{display:none}
.ak-blog-card:hover{background:var(--ak-surface2);transform:none;border-color:var(--ak-line)}
.ak-blog-card:hover h3{color:var(--ak-accent)}
.ak-blog-meta{margin-bottom:12px;gap:10px}
.ak-blog-card .ak-blog-tag{background:none!important;color:var(--ak-ink)!important;padding:0;border-radius:0;font-size:13.5px;font-weight:650}
.ak-blog-date{font-size:13.5px;color:var(--ak-faint)}
.ak-blog-card h3{font-size:19px;font-weight:650;letter-spacing:-.015em;line-height:1.25;margin-bottom:8px}
.ak-blog-card p{font-size:15px;color:var(--ak-muted);line-height:1.55;font-weight:400}
.ak-blog-more{margin-top:auto;padding-top:14px;font-size:14px;color:var(--ak-accent);font-weight:600}

/* 12 ── Detailseiten ────────────────────────────────────────────────────── */
.ak-detail{max-width:860px;padding:40px 24px 88px}
.ak-article{max-width:760px;padding:40px 24px 88px}
.ak-breadcrumb{font-size:14px;color:var(--ak-faint);margin-bottom:28px}
.ak-breadcrumb a{color:var(--ak-muted)}
.ak-breadcrumb a:hover{color:var(--ak-accent);text-decoration:underline;text-underline-offset:3px}

.ak-detail-head{gap:16px;margin-bottom:20px}
.ak-detail-icon{
  width:60px;height:60px;border-radius:var(--ak-radius);font-size:26px;font-weight:650;
  background:var(--ak-surface2)!important;color:var(--ak-ink)!important;border:1px solid var(--ak-line)}
.ak-detail-icon img{background:#fff}
.ak-detail h1{font-size:clamp(2rem,4vw,2.75rem);font-weight:650;letter-spacing:-.03em;line-height:1.08}
.ak-detail-head p{color:var(--ak-muted)!important}
.ak-detail>p:first-of-type,.ak-detail-head+p{font-size:19px!important;line-height:1.55!important;color:var(--ak-ink)!important;max-width:36em!important}

/* Eckdaten als Tabelle: 3 × 2 */
.ak-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:1px 0 0 1px;margin-bottom:40px}
@media(max-width:560px){.ak-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ak-fact{display:flex;flex-direction:column;background:var(--ak-surface);border:1px solid var(--ak-line);border-radius:0;margin:-1px 0 0 -1px;padding:16px 18px}
.ak-fact-v{font-size:19px;font-weight:650;color:var(--ak-ink);margin:0 0 2px}
.ak-fact-l{font-size:13.5px;color:var(--ak-muted);font-weight:400;line-height:1.4}
/* Felder ohne Wert (Emoji entfernt): Bezeichnung oben, Inhalt als Wert */
.ak-fact-v:empty{order:-1;font-size:13.5px;font-weight:400;color:var(--ak-muted);margin:0 0 2px}
.ak-fact-v:empty+.ak-fact-l{font-size:16.5px;font-weight:650;color:var(--ak-ink);line-height:1.3}
.ak-fact:nth-child(3) .ak-fact-v:empty::before{content:"Serverstandort"}
.ak-fact:nth-child(4) .ak-fact-v:empty::before{content:"Auftragsverarbeitung"}
.ak-fact:nth-child(5) .ak-fact-v:empty::before{content:"Preis"}
.ak-fact:nth-child(6) .ak-fact-v:empty::before{content:"Kategorie"}

.ak-pros-cons{gap:0;margin-bottom:40px;border:1px solid var(--ak-line);background:var(--ak-surface)}
.ak-pros,.ak-cons{background:transparent;border:0;border-radius:0;padding:24px 26px}
.ak-pros{border-top:3px solid var(--ak-green)}
.ak-cons{border-top:3px solid var(--ak-red);border-left:1px solid var(--ak-line)}
@media(max-width:640px){.ak-cons{border-left:0;border-top:3px solid var(--ak-red)}}
.ak-pros h3,.ak-cons h3{font-size:16px;font-weight:650;margin-bottom:14px}
.ak-pros h3{color:var(--ak-green)}
.ak-cons h3{color:var(--ak-red)}
.ak-pro-item,.ak-con-item{font-size:15px;line-height:1.5;color:var(--ak-text);font-weight:400;margin-bottom:10px;padding-left:12px}
.ak-pro-item{border-left:2px solid var(--ak-green-line)}
.ak-con-item{border-left:2px solid var(--ak-red-line)}

.ak-dsgvo-box{border-radius:var(--ak-radius);padding:22px 24px;margin-bottom:32px}
.ak-dsgvo-box h3{font-size:17px!important;font-weight:650!important}
.ak-dsgvo-box div[style*="color:var(--ak-muted)"]{font-size:15px!important;color:var(--ak-text)!important}

/* Info-Zeilen in Seitenspalten */
.ak-sidebar-card{background:var(--ak-surface);border:1px solid var(--ak-line);border-radius:var(--ak-radius);padding:20px;margin-bottom:16px}
.ak-sidebar-card h3{font-size:16px;font-weight:650;margin-bottom:12px}
.ak-info-row{padding:10px 0;border-bottom:1px solid var(--ak-line);font-size:14.5px}
.ak-info-label{color:var(--ak-muted);font-weight:400}
.ak-info-value{font-weight:600}
.ak-affiliate-notice{background:var(--ak-surface);border:1px solid var(--ak-line);border-radius:var(--ak-radius-sm);color:var(--ak-muted);font-size:13.5px}

/* 13 ── Artikel / Fließtext ─────────────────────────────────────────────── */
.ak-article h1{font-size:clamp(2rem,4.2vw,2.9rem);font-weight:650;letter-spacing:-.03em;line-height:1.1;margin-bottom:18px}
.ak-article-meta{color:var(--ak-faint);font-size:14.5px}

.ak-article-content{
  font-family:var(--ak-serif);font-size:19px;line-height:1.7;font-weight:400;color:var(--ak-body);
  font-optical-sizing:auto;max-width:42em}
.ak-article-content>*{max-width:100%}
.ak-article-content h2,.ak-article-content h3,.ak-article-content h4,
.ak-article-content table,.ak-article-content .wp-block-table{font-family:var(--ak-font)}
.ak-article-content h2{color:var(--ak-ink);font-size:1.7rem;font-weight:650;letter-spacing:-.022em;line-height:1.2;margin:2.2em 0 .6em}
.ak-article-content h3{color:var(--ak-ink);font-size:1.3rem;font-weight:650;letter-spacing:-.015em;line-height:1.25;margin:1.8em 0 .5em}
.ak-article-content p{margin-bottom:1.15em}
.ak-article-content a{color:var(--ak-accent);border-bottom:0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.ak-article-content a:hover{color:var(--ak-accent-hover);text-decoration-thickness:2px}
.ak-article-content strong{font-weight:650;color:var(--ak-ink)}
.ak-article-content blockquote{
  border-left:3px solid var(--ak-ink);background:none;border-radius:0;padding:2px 0 2px 22px;margin:1.6em 0;
  font-style:italic;color:var(--ak-ink)}
.ak-article-content ul,.ak-article-content ol{margin:1.2em 0;padding-left:1.4em}
.ak-article-content li{margin-bottom:.5em;padding-left:.2em}
.ak-article-content li::marker{color:var(--ak-faint)}
.ak-article-content img{border-radius:var(--ak-radius-sm)}
.ak-article-content hr{border:0;border-top:1px solid var(--ak-line);margin:2.4em 0}
.ak-article-content code{font-family:var(--ak-mono);font-size:.88em;background:var(--ak-surface2);padding:.1em .35em;border-radius:4px}

/* Tabellen in Redaktionstexten (Vergleichs- und Preistabellen) */
.ak-article-content table,.ak-single-content table,.ak-detail table{
  width:100%;border-collapse:collapse;font-size:15px;line-height:1.45;margin:1.6em 0;
  background:var(--ak-surface);border:1px solid var(--ak-line)}
.ak-article-content th,.ak-single-content th,.ak-detail th{
  text-align:left;font-weight:650;color:var(--ak-ink);background:var(--ak-surface2);
  padding:12px 14px;border-bottom:1px solid var(--ak-border-hover)}
.ak-article-content td,.ak-single-content td,.ak-detail td{padding:12px 14px;border-top:1px solid var(--ak-line);vertical-align:top;color:var(--ak-text)}
.ak-article-content tr:first-child td{border-top:0}
.ak-article-content figure.wp-block-table,.ak-article-content .wp-block-table{overflow-x:auto}

.ak-single-content{grid-template-columns:1fr 320px;gap:40px}

/* 14 ── Newsletter, Trust, Footer ───────────────────────────────────────── */
.ak-newsletter{
  background:var(--ak-surface);border:1px solid var(--ak-line);border-radius:var(--ak-radius);
  padding:32px 36px;gap:28px}
.ak-newsletter h2{font-size:22px;font-weight:650;letter-spacing:-.015em;margin-bottom:6px}
.ak-newsletter p{color:var(--ak-muted);font-size:15px;font-weight:400}
.ak-nl-form{max-width:420px;gap:8px}
.ak-nl-form input{
  padding:13px 14px;border-radius:var(--ak-radius-sm);border:1px solid var(--ak-border-hover);
  background:var(--ak-surface);color:var(--ak-ink);font-size:16px}
.ak-nl-form input::placeholder{color:var(--ak-faint)}
.ak-nl-form button{padding:13px 20px;border-radius:var(--ak-radius-sm);background:var(--ak-accent);color:var(--ak-on-accent);font-weight:600;font-size:15px}
.ak-nl-form button:hover{background:var(--ak-accent-hover)}

.ak-trust{justify-content:flex-start;gap:8px 28px;padding:28px 0 8px}
.ak-trust-item{font-size:14px;color:var(--ak-muted);gap:0}
.ak-trust-item>span:empty{display:none}

.ak-footer{background:var(--ak-surface);border-top:1px solid var(--ak-line);padding:56px 0 24px;margin-top:24px}
.ak-footer-grid{gap:40px}
.ak-footer-about p{color:var(--ak-muted);font-size:14.5px;max-width:28em;line-height:1.55;font-weight:400}
.ak-footer-about .ak-logo svg{width:24px;height:24px}
.ak-footer-col h4{font-size:14px;font-weight:650;text-transform:none;letter-spacing:0;color:var(--ak-ink);margin-bottom:14px}
.ak-footer-col a{font-size:15px;color:var(--ak-muted);margin-bottom:10px}
.ak-footer-col a:hover{color:var(--ak-accent);text-decoration:underline;text-underline-offset:3px}
.ak-footer-bottom{margin-top:40px;font-size:13.5px;color:var(--ak-faint)}

.ak-pagination a,.ak-pagination span{border-radius:var(--ak-radius-sm);padding:9px 14px;color:var(--ak-muted);background:var(--ak-surface)}
.ak-pagination .current,.ak-pagination a:hover{background:var(--ak-ink);color:var(--ak-on-ink);border-color:var(--ak-ink)}

.ak-empty{color:var(--ak-muted)}
.ak-empty-icon{display:none}

/* 15 ── Inhalte aus MU-Plugins (Inline-Styles des alten Dunkel-Designs) ─────
   Die Plugins schreiben Farben direkt ins style-Attribut. Statt die Plugins
   zu ändern, werden die alten Neon-/Dunkel-Werte hier auf das neue System gemappt. */

/* Text */
[style*="color:#8b949e"],[style*="color:#484f58"],[style*="color:#888"],[style*="color:#666"]{color:var(--ak-muted)!important}
[style*="color:#00e5a0"],[style*="color:#58a6ff"],[style*="color:#79c0ff"],[style*="color:#00c4ff"]{color:var(--ak-accent)!important}
[style*="color:#22c55e"],[style*="color:#3fb950"]{color:var(--ak-green)!important}
[style*="color:#facc15"],[style*="color:#e3b341"],[style*="color:#eab308"],[style*="color:#f59e0b"],[style*="color:#f0883e"],[style*="color:#ffa657"]{color:var(--ak-yellow)!important}
[style*="color:#ef4444"],[style*="color:#f85149"]{color:var(--ak-red)!important}
[style*="color:#0d1117"],[style*="color:#0a0a0f"]{color:var(--ak-on-accent)!important}      /* Text auf Akzent-Buttons */
[style*="color:#e6edf3"],[style*="color:#e8e8f0"]{color:var(--ak-ink)!important}

/* Flächen */
[style*="background:#00e5a0;"],[style*="background:#00cc8e;"],[style*="background:#00e5a0\""]{background:var(--ak-accent)!important}
/* Logo-Kacheln mit Kategorie-Farbe (Hex mit Alpha, z. B. #00e5a015) → neutral */
[style*="width:48px"][style*="height:48px"][style*="border-radius"],[style*="width:56px"][style*="height:56px"][style*="border-radius"],[style*="width:40px"][style*="height:40px"][style*="border-radius"]{background:var(--ak-surface2)!important;color:var(--ak-ink)!important;border:1px solid var(--ak-line)}
[style*="background:#3fb950"]{background:var(--ak-green)!important}
[style*="background:#f85149"]{background:var(--ak-red)!important}
[style*="background:#e3b341"]{background:var(--ak-yellow)!important}
[style*="background:rgba(0,229,160"],[style*="background: rgba(0,229,160"]{background:var(--ak-accent-tint)!important}
[style*="background:rgba(34,197,94"]{background:var(--ak-green-tint)!important}
[style*="background:rgba(250,204,21"]{background:var(--ak-yellow-tint)!important}
[style*="background:rgba(239,68,68"]{background:var(--ak-red-tint)!important}
[style*="background:rgba(255,255,255,.0"]{background:var(--ak-surface2)!important}
[style*="background:#161b22"],[style*="background:#12121a"],[style*="background:#1a1a25"]{background:var(--ak-surface)!important}
[style*="background:#0d1117"],[style*="background:#0a0a0f"]{background:var(--ak-bg)!important}

/* Rahmen */
[style*="rgba(0,229,160"][style*="border"]{border-color:var(--ak-accent-line)!important}
[style*="rgba(34,197,94"][style*="border"]{border-color:var(--ak-green-line)!important}
[style*="rgba(250,204,21"][style*="border"]{border-color:var(--ak-yellow-line)!important}
[style*="rgba(239,68,68"][style*="border"]{border-color:var(--ak-red-line)!important}
[style*="border:1px solid #21262d"],[style*="border:1px solid #30363d"],[style*="border:1px solid rgba(255,255,255"]{border-color:var(--ak-line)!important}
[style*="border-bottom:1px solid rgba(255,255,255"],[style*="border-top:1px solid rgba(255,255,255"]{border-color:var(--ak-line)!important}

/* Verlaufstext (Gradient) der Plugin-Seiten, z. B. /werben/ → ruhige Tinte */
[style*="-webkit-background-clip:text"]{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--ak-ink)!important}
[style*="linear-gradient(135deg,rgba(0,229,160"],[style*="linear-gradient(135deg,rgba(0,196,255"]{background:transparent!important}
h1[style*="color:#00e5a0"],h2[style*="color:#00e5a0"],h3[style*="color:#00e5a0"]{color:var(--ak-ink)!important}

/* Plugin-Elemente ohne Inline-Farben */
select,input[type=text],input[type=email],input[type=search],input[type=url],textarea{
  background:var(--ak-surface);color:var(--ak-ink);border:1px solid var(--ak-border-hover);border-radius:var(--ak-radius-sm)}
input::placeholder,textarea::placeholder{color:var(--ak-faint)}
select option,select optgroup{background:var(--ak-surface);color:var(--ak-ink)}

img.emoji{display:none!important}   /* falls ein Cache noch Emoji-Grafiken enthält */

/* Anzeigen-Bausteine der Plugins: gleiche Rundung wie der Rest */
[class^="akads-"],[class*=" akads-"],[class^="aksales-"],[class*=" aksales-"]{border-radius:var(--ak-radius)!important}
[class^="akads-"] .ak-btn,[class^="akads-"] a[style*="border-radius"]{border-radius:var(--ak-radius-sm)!important}

/* Seitentyp-Label über der Überschrift ist redundant (Brotkrumen zeigen es schon) */
.ak-label:has(+h1){display:none}

/* Werbe-Hinweis ("ANZEIGE") bleibt dezent */
[class*="akads"] [style*="text-transform:uppercase"],[class*="aksales"] [style*="text-transform:uppercase"]{letter-spacing:.02em!important}

/* 16 ── Barrierefreiheit ────────────────────────────────────────────────── */
.ak-skip{position:absolute;left:12px;top:-80px;z-index:300;background:var(--ak-ink);color:var(--ak-on-ink);padding:12px 18px;
  border-radius:var(--ak-radius-sm);font-weight:600;text-decoration:none}
.ak-skip:focus{top:12px}
.ak-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
main{display:block}
.admin-bar .ak-header{top:32px}
@media(max-width:782px){.admin-bar .ak-header{top:46px}}

/* Links im Fließtext nicht nur über die Farbe erkennbar machen */
.ak-breadcrumb a,label a,.ak-detail p a,.ak-article p a,.ak-footer-bottom a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
label a{color:var(--ak-accent)}

/* Werbe-Beschriftungen ("Anzeige") waren 9–10 px in hellem Grau */
.akads-card>div:first-child,.akads-banner>div:first-child{color:var(--ak-faint)!important;font-size:11px!important;opacity:1!important}
@media(max-width:960px){.ak-footer-col a{padding:5px 0}}

:focus{outline:none}
:focus-visible{outline:2px solid var(--ak-accent);outline-offset:2px;border-radius:2px}
.ak-btn-primary:focus-visible,.ak-filter.active:focus-visible{outline-color:var(--ak-ink)}
a,button,input,select,textarea,summary{touch-action:manipulation}
.ak-filter,.ak-btn,.ak-nl-form button,.ak-menu-toggle{min-height:44px}
@media(pointer:fine){.ak-filter{min-height:38px}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* 17 ── Dunkler Modus (automatisch nach Systemeinstellung) ──────────────────
   Nur die Variablen werden getauscht; alle Komponenten nutzen sie bereits. */
@media (prefers-color-scheme: dark){
  :root{
    --ak-bg:#0E1117;
    --ak-surface:#151A23;
    --ak-surface2:#1D2432;
    --ak-line:#2A3242;
    --ak-border:#2A3242;
    --ak-border-hover:#4A5568;

    --ak-ink:#EEF1F6;
    --ak-text:#EEF1F6;
    --ak-body:#D5DBE6;
    --ak-muted:#A9B3C4;
    --ak-faint:#8E99AC;

    --ak-accent:#8FA8FF;
    --ak-accent-hover:#B3C3FF;
    --ak-accent-tint:#1B2547;
    --ak-accent-line:#32407A;
    --ak-on-accent:#0E1117;
    --ak-on-ink:#0E1117;
    --ak-cyan:#6CC4EA;
    --ak-purple:#B7A4F0;

    --ak-green:#4CC38A;
    --ak-green-tint:#12261D;
    --ak-green-line:#245C42;
    --ak-yellow:#E3B341;
    --ak-yellow-tint:#2A2210;
    --ak-yellow-line:#5C4A1A;
    --ak-red:#FF8A80;
    --ak-red-tint:#2D1715;
    --ak-red-line:#6B2F2A;
    --ak-pink:#FF8A80;
    --ak-orange:#F5A25D;
    color-scheme:dark;
  }
  .ak-card-icon img,.ak-detail-icon img{background:#fff;padding:3px}
  .ak-hero-search input[type=search]{border-color:var(--ak-border-hover)}
  .ak-article-content img{opacity:.92}
}
