/* ============================================================
   CoLe's Heart — aktuelles.css
   Blog „Aktuelles" (Page 417) — Version C (Karten-Galerie).
   Index: Hero (+IG) · jahr-gruppierter Beitrags-Feed (Shortcode
   [ch_news_feed]) · Spendenband (.mag-donate-Reuse).
   Einzelbeitrag: Theme-Single (body.single-post) on-brand gestylt.
   Neuer Standard: 2 Schriften, flache Hintergründe, eckige Bilder.
   ============================================================ */

.ak-container { width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: 40px; box-sizing: border-box; }
.ak-container--narrow { max-width: 760px; }

/* ---------- geteilte Kleinbausteine ---------- */
.ak-kicker { font-family: var(--ch-font-body); font-weight: 700; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--ch-gold-600); display: inline-block; }
.ak-date { font-family: var(--ch-font-body); font-weight: 600; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ch-ink-mute); }
.ak-readmore { font-family: var(--ch-font-body); font-weight: 600; font-size: 14.5px; color: var(--ch-gold-600); display: inline-flex; align-items: center; gap: 6px; margin-top: auto; }
.ak-readmore svg { width: 16px; height: 16px; }
.ak-igbtn { display: inline-flex; align-items: center; gap: 10px; }
.ak-igbtn svg { width: 18px; height: 18px; flex: none; }

/* Video-/Bild-Thumbnail mit Play-Overlay (eckig) */
.ak-media { position: relative; display: block; overflow: hidden; background: var(--ch-cream-deep); }
.ak-media img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16/9; border-radius: 0 !important; }
.ak-media__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ak-media__play::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(40,30,10,.04), rgba(40,30,10,.32)); }
.ak-media__btn { position: relative; width: 74px; height: 74px; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--ch-gold-600); display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 30px rgba(40,30,10,.3); transition: transform .2s, background .2s; }
.ak-media__btn svg { width: 30px; height: 30px; margin-left: 3px; }
.fc-card:hover .ak-media__btn { transform: scale(1.06); background: #fff; }
.ak-media__tag { position: absolute; left: 0; top: 0; z-index: 2; background: var(--ch-gold-400); color: #2a2010; font-family: var(--ch-font-body); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; padding: 6px 12px; display: inline-flex; align-items: center; gap: 6px; }
.ak-media__tag svg { width: 13px; height: 13px; }

/* ===================== Index · Hero ===================== */
.ak-hero { background: var(--ch-cream); padding-block: 78px 24px; }
.ak-hero__inner { max-width: 1180px; }
.ak-hero__title { font-family: var(--ch-font-display) !important; font-weight: 600 !important; font-size: clamp(44px, 6vw, 78px); line-height: 1.02; letter-spacing: -0.015em; color: var(--ch-ink); margin: 14px 0 0; text-wrap: balance; }
.ak-hero__title em { font-style: italic; color: var(--ch-gold-500); }
.ak-hero__lead { font-size: 20px; line-height: 1.55; color: var(--ch-ink-soft); margin: 18px 0 0; max-width: 560px; }
.ak-hero__actions { margin-top: 30px; display: flex; gap: 14px; flex-wrap: wrap; }

/* ===================== Index · Feed ===================== */
.ak-feed { background: var(--ch-cream); padding-block: 24px 90px; }
.ak-feed__group + .ak-feed__group { margin-top: 64px; }
.ak-year { display: flex; align-items: center; gap: 20px; margin: 0 0 30px; }
.ak-year__n { font-family: var(--ch-font-display); font-weight: 600; font-size: clamp(30px, 3.4vw, 44px); color: var(--ch-ink); line-height: 1; }
.ak-year__rule { flex: 1; height: 1px; background: var(--ch-line); }
.ak-year__count { font-family: var(--ch-font-body); font-weight: 600; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--ch-ink-mute); }

.fc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.fc-card { display: flex; flex-direction: column; background: var(--ch-white); border: 1px solid var(--ch-line); text-decoration: none; color: inherit; transition: border-color .15s, transform .15s, box-shadow .15s; }
.fc-card:hover { border-color: var(--ch-gold-300); transform: translateY(-3px); box-shadow: var(--ch-shadow-sm); }
.fc-card__body { padding: 22px 22px 26px; display: flex; flex-direction: column; flex: 1; }
.fc-card__meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.fc-card__title { display: block; font-family: var(--ch-font-display); font-weight: 600; font-size: 24px; line-height: 1.12; color: var(--ch-ink); margin: 0 0 10px; transition: color .15s; }
.fc-card:hover .fc-card__title { color: var(--ch-gold-600); }
.fc-card__excerpt { display: block; font-size: 15px; line-height: 1.6; color: var(--ch-ink-soft); margin: 0 0 16px; flex: 1; }
.fc-empty { border: 1px dashed var(--ch-line); text-align: center; padding: 30px; color: var(--ch-ink-mute); font-size: 14px; }

/* ===================== Einzelbeitrag (Theme-Single) ===================== */
body.single-post #content { padding-block: 36px 90px; }
body.single-post .post-content-inner { max-width: 760px; margin-inline: auto; }
/* Theme-Beitragsbild auf Single ausblenden — Medien kommen aus dem Inhalt (.ak-embed) */
body.single-post .post-image, body.single-post .post-thumbnail, body.single-post .post > .post-image { display: none !important; }
/* Titel als Serifen-Überschrift, zentriert */
body.single-post .post-title.entry-title { font-family: var(--ch-font-display) !important; font-weight: 600 !important; font-size: clamp(34px, 4.4vw, 56px); line-height: 1.05; color: var(--ch-ink); text-align: center; max-width: 760px; margin: 0 auto 6px; }
body.single-post .post-title.entry-title a { color: var(--ch-ink); text-decoration: none; }

.ak-meta { text-align: center; display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 0 22px; }
.ak-meta .ak-dot { color: var(--ch-gold-300); }
.ak-embed { margin: 0 0 10px; }
.ak-embed img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 0 !important; background: var(--ch-cream-deep); }
/* Video: natürliches Seitenverhältnis (Hoch- oder Querformat), zentriert, Höhe gedeckelt */
.ak-embed video { display: block; width: auto; max-width: 100%; max-height: 78vh; margin-inline: auto; border-radius: 0 !important; background: #000; }
.ak-embed__note { font-size: 12.5px; color: var(--ch-ink-mute); font-style: italic; text-align: center; margin: 8px 0 30px; }
.ak-body { font-size: 18px; line-height: 1.78; color: var(--ch-ink-soft); }
.ak-body p { margin: 0 0 20px; }
.ak-body a { color: var(--ch-gold-600); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--ch-gold-200); }
.ak-body a:hover { border-color: var(--ch-gold-500); }
.ak-body strong { color: var(--ch-ink); font-weight: 700; }
.ak-sign { font-family: var(--ch-font-display) !important; font-style: italic; font-size: 22px; color: var(--ch-ink); margin: 30px 0 0; }
.ak-back-wrap { max-width: 760px; margin: 40px auto 0; padding-top: 26px; border-top: 1px solid var(--ch-line); }
.ak-back { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: 14.5px; color: var(--ch-ink-soft); text-decoration: none; }
.ak-back:hover { color: var(--ch-gold-600); }

/* ===================== Responsive ===================== */
@media (max-width: 920px) {
  .fc-grid { grid-template-columns: repeat(2, 1fr); }
  .ak-container { padding-inline: 24px; }
}
@media (max-width: 600px) {
  .fc-grid { grid-template-columns: 1fr; }
  .ak-hero { padding-block: 48px 16px; }
}
