/* Zivenna — Magazin & Artikel (dunkles Zivenna-Design, baut auf zivenna-base.css auf) */

/* ---------- Grundlayout ---------- */
.reading{max-width:760px;margin:0 auto;padding:0 24px}
.mag-main{padding:26px 0 40px}

/* Breadcrumb */
.crumbs{font-size:.82rem;color:var(--muted);margin:6px 0 22px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--gold-300)}
.crumbs .sep{opacity:.5}

/* ---------- Artikelkopf ---------- */
.eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold-400);border:1px solid rgba(233,196,106,.35);border-radius:999px;padding:4px 12px;margin-bottom:16px}
.art-head h1{font-family:var(--serif);font-weight:700;color:var(--star-50);font-size:clamp(2rem,4.6vw,2.9rem);line-height:1.12;letter-spacing:.005em;margin:0 0 14px}
.art-lede{font-size:1.16rem;line-height:1.75;color:var(--star-200)}
.art-meta{margin-top:16px;padding-top:14px;border-top:1px solid var(--night-600);font-size:.82rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:14px}

/* ---------- Fließtext ---------- */
.prose{font-size:1.11rem;line-height:1.85;color:var(--star-200)}
.prose h2{font-family:var(--serif);font-weight:600;color:var(--star-50);font-size:clamp(1.5rem,3vw,1.95rem);line-height:1.2;margin:2.1em 0 .5em}
.prose h3{font-family:var(--sans);font-weight:600;color:var(--star-50);font-size:1.14rem;margin:1.8em 0 .4em}
.prose p{margin:0 0 1.15em}
.prose strong{color:var(--star-50);font-weight:600}
.prose em{color:var(--star-200)}
.prose a{color:var(--purple-300);text-decoration:underline;text-underline-offset:2px;text-decoration-color:rgba(196,181,253,.4)}
.prose a:hover{color:var(--gold-300);text-decoration-color:var(--gold-300)}
.zh{color:var(--gold-300);font-family:var(--serif);font-size:1.02em;white-space:nowrap}

/* Tabelle (Vergleiche) */
.prose .tbl{width:100%;border-collapse:collapse;margin:1.4em 0;font-size:.92rem;border:1px solid var(--night-600);border-radius:12px;overflow:hidden}
.prose .tbl th,.prose .tbl td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--night-600);vertical-align:top}
.prose .tbl th{background:var(--night-700);color:var(--star-50);font-weight:600;font-size:.82rem;letter-spacing:.02em}
.prose .tbl tr:last-child td{border-bottom:0}
.prose .tbl td{color:var(--star-200)}

/* ---------- CTA-Block ---------- */
.cta-box{margin:34px 0 8px;padding:26px 28px;border-radius:18px;background:var(--grad);border:1px solid rgba(233,196,106,.5);box-shadow:0 18px 50px rgba(124,58,237,.28);text-align:center}
.cta-box .glyphbg{font-family:var(--serif);color:var(--gold-300);font-size:1.5rem;opacity:.85}
.cta-box h3{font-family:var(--serif);font-weight:600;color:#fff;font-size:1.5rem;margin:.2em 0 .5em;line-height:1.2}
.cta-box p{color:#EDE7FB;font-size:1rem;margin:0 auto 18px;max-width:46ch}
.cta-box .btn-primary{font-size:1.05rem;padding:15px 30px}
.cta-box .microtrust{margin-top:12px;font-size:.82rem;color:#D9CFF3}

/* ---------- Disclaimer-Box ---------- */
.disc-box{margin:26px 0 0;padding:14px 18px;background:var(--night-800);border:1px solid var(--night-600);border-left:3px solid var(--gold-400);border-radius:10px;font-size:.86rem;line-height:1.6;color:var(--muted)}

/* ---------- Magazin-Hub-Hero ---------- */
.mag-hero{padding:54px 0 18px;text-align:center}
.mag-hero .eyebrow{margin-bottom:18px}
.mag-hero h1{font-family:var(--serif);font-weight:700;color:var(--star-50);font-size:clamp(2.3rem,5.4vw,3.6rem);line-height:1.08;margin:0 0 16px}
.mag-hero p{max-width:60ch;margin:0 auto;font-size:1.16rem;line-height:1.7;color:var(--star-200)}

/* ---------- Cluster-Raster (Hub) ---------- */
.cluster-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:36px 0}
@media(max-width:720px){.cluster-grid{grid-template-columns:1fr}}
.cluster-card{display:block;background:var(--night-700);border:1px solid var(--night-600);border-radius:18px;padding:24px 24px 22px;transition:.2s;box-shadow:0 10px 34px rgba(124,58,237,.10)}
.cluster-card:hover{transform:translateY(-3px);border-color:rgba(233,196,106,.45);box-shadow:0 16px 44px rgba(124,58,237,.20)}
.cluster-card .ck{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-400);font-weight:700}
.cluster-card h2{font-family:var(--serif);font-weight:600;color:var(--star-50);font-size:1.5rem;margin:8px 0 6px;line-height:1.15}
.cluster-card p{color:var(--star-200);font-size:.98rem;line-height:1.6;margin:0 0 12px}
.cluster-card .count{font-size:.82rem;color:var(--muted)}
.cluster-card .go{color:var(--gold-300);font-weight:600;font-size:.9rem}

/* ---------- Artikel-Liste (Pillar/Hub) ---------- */
.art-list{display:grid;gap:16px;margin:26px 0}
.art-card{display:block;background:var(--night-700);border:1px solid var(--night-600);border-radius:16px;padding:20px 22px;transition:.2s}
.art-card:hover{transform:translateY(-2px);border-color:rgba(233,196,106,.4);box-shadow:0 12px 34px rgba(124,58,237,.16)}
.art-card .ck{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-400);font-weight:700}
.art-card h3{font-family:var(--serif);font-weight:600;color:var(--star-50);font-size:1.32rem;margin:6px 0 6px;line-height:1.2}
.art-card p{color:var(--star-200);font-size:.96rem;line-height:1.55;margin:0}
.art-card .go{display:inline-block;margin-top:10px;color:var(--gold-300);font-weight:600;font-size:.88rem}

/* Pillar-Kopf */
.pillar-head{padding:48px 0 6px}
.pillar-head h1{font-family:var(--serif);font-weight:700;color:var(--star-50);font-size:clamp(2.1rem,5vw,3.1rem);line-height:1.1;margin:0 0 14px}
.pillar-head .intro{max-width:64ch;font-size:1.14rem;line-height:1.7;color:var(--star-200)}

/* „Weiterlesen“-Querverweise unter Artikeln */
.related{margin:40px 0 0;border-top:1px solid var(--night-600);padding-top:26px}
.related h2{font-family:var(--serif);color:var(--star-50);font-size:1.4rem;font-weight:600;margin:0 0 16px}

/* Abschnitts-Divider */
.mag-sec-title{font-family:var(--serif);color:var(--star-50);font-size:1.7rem;font-weight:600;margin:38px 0 4px;display:flex;align-items:baseline;gap:12px}
.mag-sec-title .ck{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-400);font-weight:700}
.mag-sec-sub{color:var(--muted);font-size:.98rem;margin:0 0 4px}

/* nav: sekundäre Links auf kleinen Screens ausblenden */
@media(max-width:640px){.nav-links{display:none}}

/* ---------- Magazin-Suche ---------- */
.mag-search{position:relative;max-width:640px;margin:26px auto 6px}
.mag-search svg{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted);pointer-events:none}
.mag-search input{width:100%;background:var(--night-700);border:1px solid var(--night-600);border-radius:999px;padding:14px 22px 14px 50px;color:var(--star-50);font-family:var(--sans);font-size:1.02rem;outline:none;transition:.2s}
.mag-search input::placeholder{color:var(--muted)}
.mag-search input:focus{border-color:var(--gold-400);box-shadow:0 0 0 3px rgba(233,196,106,.15)}
#results-info{color:var(--muted);font-size:.9rem;margin:10px 2px 16px;text-align:center}
.no-res{color:var(--star-200);text-align:center;padding:26px;background:var(--night-700);border:1px solid var(--night-600);border-radius:14px}
