/*!
 * cav-magazin.css — einheitlicher Look für alle Magazin-Bausteine (gerenderte
 * cav_-Boxen + die fertig vom Studio gelieferten Body-Boxen .fk-faq / Glossar).
 * Nutzt die Marken-/GeneratePress-Optik (Fredoka-Headings, warme Töne, runde Karten).
 *
 * ============================================================================
 * KOMPONENTEN-VERTRAG (Studio-Pipeline liefert nur cav_-Meta → Rendering hier)
 * class-cav-magazin.php rendert je Meta-Feld genau eine Box-Klasse:
 *   cav_facts / „Das fördert es"      → <aside class="cav-box cav-nutzen">  (Fakten-Liste)
 *   cav_praxistipp                    → <aside class="cav-box cav-praxistipp">
 *   cav_check / „Auf einen Blick"     → <aside class="cav-box cav-check">    (Häkchen-Liste)
 *   cav_produkt (verknüpftes Buch)    → <aside class="cav-box cav-produkt">  (Cover-Karte)
 *   cav_quellen                       → <aside class="cav-box cav-quellen">
 *   cav_frage (Forscher-Frage)        → .cav-box.cav-frage (Navy-Spotlight)
 * Body-Boxen aus dem Studio (im Content-HTML):  .fk-faq (Accordion), .cav-glossar/.fk-glossar (dl).
 * Beitrags-Karte (Index/Teaser/AJAX): .cav-magcard (Renderer cav_mag_card in functions.php).
 * REGEL: Alle Farben/Radien/Schatten über --cav-*-Tokens. Keine Inline-Hex in neuen Boxen.
 * ============================================================================
 */

/* gemeinsame Karte */
.cav-box{ border-radius:16px; padding:22px 26px; margin:30px 0; font-size:16.5px; line-height:1.62; box-shadow:0 14px 34px -26px rgba(42,58,82,.4); }
.cav-box__title{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; margin:0 0 14px; font-size:21px; line-height:1.15; color:var(--cav-navy,#2A3A52); }

/* Schon gewusst? (Fakten) */
.cav-facts{ background:#F4F1E9; border:1px solid rgba(217,164,65,.32); }
.cav-facts__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
.cav-facts__item{ display:flex; gap:13px; align-items:flex-start; }
.cav-facts__emoji{ font-size:23px; line-height:1.25; flex:none; }

/* Forscher-Frage (Spotlight) */
.cav-frage{ background:linear-gradient(150deg,#34465f,#2A3A52); color:#fff; border:none; }
.cav-frage__badge{ display:inline-block; background:rgba(255,255,255,.16); font-size:12px; font-weight:800; letter-spacing:.4px; padding:6px 13px; border-radius:999px; margin-bottom:13px; }
.cav-frage, .cav-frage p, .cav-frage .cav-frage__q, .cav-frage .cav-frage__a{ color:#fff !important; }
.cav-frage .cav-frage__q{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; font-size:21px; line-height:1.25; margin:0 0 9px; }
.cav-frage .cav-frage__a{ margin:0; opacity:.92; }

/* Passendes Malbuch (Produkt-Karte mit Cover) */
.cav-produkt{ background:#fff; border:1px solid rgba(140,136,130,.2); }
.cav-produkt__row{ display:flex; flex-wrap:wrap; gap:14px; }
.cav-produkt__card{ display:flex; align-items:center; gap:16px; flex:1 1 260px; min-width:0; text-decoration:none; background:#FAF8F3; border:1px solid rgba(140,136,130,.18); border-radius:14px; padding:12px 16px; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.cav-produkt__card:hover{ transform:translateY(-2px); border-color:rgba(46,139,134,.4); box-shadow:0 16px 30px -20px rgba(42,58,82,.45); }
.cav-produkt__media{ flex:none; width:56px; }
.cav-produkt__media img{ width:56px; height:auto; border-radius:8px; display:block; box-shadow:0 6px 14px -8px rgba(42,58,82,.5); }
.cav-produkt__body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.cav-produkt__name{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; font-size:16px; color:var(--cav-navy,#2A3A52); line-height:1.22; }
.cav-produkt__btn{ color:var(--cav-teal,#2E8B86); font-weight:700; font-size:14px; }

/* Quellen */
.cav-quellen{ background:#FAF8F3; border:1px solid rgba(140,136,130,.18); }
.cav-quellen__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.cav-quellen__item{ font-size:15px; }
.cav-quellen__item a{ color:var(--cav-teal,#2E8B86); font-weight:700; text-decoration:none; }
.cav-quellen__item a:hover{ text-decoration:underline; }
.cav-quellen__note{ display:block; color:#8C8882; font-size:13px; margin-top:2px; }

/* ---- Bausteine für Eltern & Pädagog:innen ---- */
.cav-nutzen{ background:#EAF3F1; border:1px solid rgba(46,139,134,.28); }
.cav-praxistipp{ background:#FFF9EC; border:1px solid rgba(217,164,65,.35); border-left:5px solid var(--cav-honey,#D9A441); }
.cav-praxistipp__badge{ display:inline-block; background:var(--cav-honey,#D9A441); color:#33322E; font-weight:800; font-size:12px; letter-spacing:.3px; padding:5px 12px; border-radius:999px; margin-bottom:12px; }
.cav-praxistipp__text p{ margin:0 0 8px; } .cav-praxistipp__text p:last-child{ margin-bottom:0; }
.cav-check{ background:#fff; border:1px solid rgba(140,136,130,.2); }
.cav-check__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.cav-check__item{ position:relative; padding-left:32px; }
.cav-check__item::before{ content:'✓'; position:absolute; left:0; top:1px; width:21px; height:21px; border-radius:50%; background:var(--cav-teal,#2E8B86); color:#fff; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; }

/* ---- Body-Boxen vom Studio (FAQ + Glossar) im selben Look ---- */
.fk-faq, .cav-glossar, .fk-glossar{ background:#F4F1E9; border:1px solid rgba(140,136,130,.18); border-radius:16px; padding:22px 26px; margin:30px 0; }
.fk-faq > h2, .fk-faq > h3, .cav-glossar > h2, .cav-glossar > h3, .fk-glossar > h2, .fk-glossar > h3{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; color:var(--cav-navy,#2A3A52); margin:0 0 14px; font-size:21px; }
.fk-faq details{ border-bottom:1px solid rgba(140,136,130,.22); padding:12px 0; }
.fk-faq details:last-child{ border-bottom:none; }
.fk-faq summary{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; color:var(--cav-navy,#2A3A52); cursor:pointer; font-size:16.5px; list-style:none; }
.fk-faq summary::-webkit-details-marker{ display:none; }
.fk-faq summary::after{ content:'+'; float:right; color:var(--cav-honey,#D9A441); font-weight:800; }
.fk-faq details[open] summary::after{ content:'–'; }
.fk-faq details > *:not(summary){ margin-top:10px; color:#33322E; }
/* Glossar als Definitionsliste */
.cav-glossar dl, .fk-glossar dl, .fk-faq dl{ margin:0; }
.cav-glossar dt, .fk-glossar dt{ font-weight:700; color:var(--cav-navy,#2A3A52); margin-top:12px; }
.cav-glossar dd, .fk-glossar dd{ margin:2px 0 0; color:#33322E; }

/* ---- Magazin-Beitrags-Karte (cav_mag_card) — Komponente statt Inline-Styles ----
   PHP liefert nur Klassen + Gradient/Label-Farbe via Custom-Properties:
   --cav-mc-grad  = linear-gradient(...) für Header, --cav-mc-cat = Kategorie-Textfarbe. */
.cav-magcard{ display:flex; flex-direction:column; background:var(--cav-white,#fff);
  border:1px solid var(--cav-card-border,rgba(140,136,130,0.16)); border-radius:var(--cav-radius-md,16px);
  overflow:hidden; box-shadow:var(--cav-shadow-sm,0 12px 30px -18px rgba(42,58,82,0.28));
  text-decoration:none; transition:transform .15s ease; }
.cav-magcard:hover{ transform:translateY(-4px); }
.cav-magcard__media{ aspect-ratio:16/10; position:relative;
  background:var(--cav-mc-grad,linear-gradient(150deg,#6E7A8C,#454f60)); background-size:cover; background-position:center; }
.cav-magcard__cat{ position:absolute; top:14px; left:14px; background:rgba(255,255,255,0.92);
  color:var(--cav-mc-cat,var(--cav-navy,#2A3A52)); font-size:11px; font-weight:800; letter-spacing:.5px;
  padding:5px 11px; border-radius:var(--cav-radius-pill,999px); }
.cav-magcard__body{ padding:20px; display:flex; flex-direction:column; flex:1; }
.cav-magcard__title{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:500; font-size:19px;
  color:var(--cav-navy,#2A3A52); margin:0; line-height:1.18; }
.cav-magcard__excerpt{ font-size:var(--cav-fs-body-sm,14.5px); color:var(--cav-ink-2,#5C574F); line-height:1.5; margin:8px 0 0; }
.cav-magcard__foot{ display:flex; align-items:center; justify-content:space-between; margin-top:16px; }
.cav-magcard__meta{ font-size:12.5px; color:var(--cav-meta-text,#6E6A63); font-weight:700; }
.cav-magcard__more{ font-weight:800; color:var(--cav-navy,#2A3A52); font-size:13.5px; }

/* ---- Kontextuelle interne Verlinkung unter Beiträgen (cav-related.php) ---- */
.cav-related-inline{ margin:34px 0 0; padding:20px 24px; background:var(--cav-hafer,#F4F1E9);
  border:1px solid var(--cav-card-border,rgba(140,136,130,.18)); border-radius:var(--cav-radius-md,16px); }
.cav-related-inline__h{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; font-size:14px;
  color:var(--cav-navy,#2A3A52); text-transform:uppercase; letter-spacing:.05em; margin:0 0 10px; }
.cav-related-inline__list{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.cav-related-inline__list a{ color:var(--cav-navy,#2A3A52); font-weight:700; text-decoration:none;
  border-bottom:1px solid transparent; }
.cav-related-inline__list a:hover{ border-bottom-color:currentColor; }
.cav-related-inline__prod{ display:inline-flex; align-items:center; gap:9px; margin-top:14px; padding:10px 16px;
  background:var(--cav-navy,#2A3A52); color:#fff; font-weight:800; font-size:14px;
  border-radius:var(--cav-radius-pill,999px); text-decoration:none; }
.cav-related-inline__prod span{ background:rgba(255,255,255,.18); font-size:11px; font-weight:800;
  letter-spacing:.3px; text-transform:uppercase; padding:3px 8px; border-radius:999px; }

@media (max-width:600px){
	.cav-box, .fk-faq, .cav-glossar, .fk-glossar{ padding:18px 18px; }
	.cav-box__title{ font-size:19px; }
}