/* NUMERY® Blog „Notizen aus der Praxis“ (10/2026)
   Ergänzt style.css. Wird von Blog/build_blog.py nach assets/blog.css kopiert – hier ändern, nicht dort. */

/* ---------- Karten: Startseite, Übersicht, „Weitere Beiträge“ ---------- */
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.blog-grid:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.blog-card{min-height:320px;color:var(--ink)}
.blog-card h3{font-size:24px;line-height:1.18;letter-spacing:-.015em;margin:0 0 14px}
.blog-meta{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--coral-deep);margin:0 0 20px}
.blog-alle{margin-top:44px;text-align:center}

/* ---------- Übersicht: neuester Beitrag als große Lavendel-Fläche ---------- */
.blog-feature{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:28px 64px;align-items:end;
  background:var(--coral);color:var(--ink);padding:56px 56px 52px;margin-bottom:20px;border-radius:0 0 80px 0;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.blog-feature:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(22,21,26,.1)}
.blog-feature .blog-meta{color:var(--ink)}
.blog-feature h2{font-size:clamp(30px,3.4vw,46px);line-height:1.08;letter-spacing:-.03em;margin:0;max-width:20ch}
.blog-feature p{font-size:18px;line-height:1.55;color:var(--ink);margin:0}
.blog-feature .arrow{color:var(--ink);margin-top:22px}
.blog-feature:hover .arrow{gap:12px}

/* ---------- Beitragsseite ---------- */
.blog-post-hero h1{font-size:clamp(34px,4.2vw,58px);max-width:21ch}
.blog-post-hero .lead{font-size:clamp(20px,1.9vw,24px);line-height:1.45;color:var(--ink-2);max-width:640px;margin-bottom:30px}
.kicker a{color:inherit;transition:color .2s}
.kicker a:hover{color:var(--ink)}
.blog-autorin{display:flex;align-items:center;gap:14px}
.blog-autorin img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.blog-autorin strong{display:block;font-size:15px;font-weight:600;line-height:1.3;color:var(--ink)}
.blog-autorin span{display:block;font-size:14px;line-height:1.4;color:var(--muted)}
.blog-text{font-size:18px}
.blog-text p{line-height:1.7}
.blog-zitat{margin:44px 0;padding:4px 0 4px 28px;border-left:3px solid var(--coral)}
.blog-zitat p{font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.4vw,30px);line-height:1.25;letter-spacing:-.015em;color:var(--ink);margin:0}
.blog-kasten{background:var(--coral-tint);padding:32px 36px;margin:48px 0 0;border-radius:0 0 40px 0}
.blog-kasten h2{font-size:clamp(22px,2.2vw,28px);margin:0 0 14px}
.blog-kasten p{margin:0 0 12px}
.blog-kasten p:last-child{margin-bottom:0}
.blog-mehr .section-head{margin-bottom:36px}

@media(max-width:1060px){
  .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .blog-home .blog-grid>:nth-child(3){display:none}
}
@media(max-width:850px){
  .blog-grid,.blog-grid:has(>:nth-child(2):last-child){grid-template-columns:1fr;gap:16px}
  .blog-home .blog-grid>:nth-child(3){display:flex}
  .blog-card{min-height:0}
  .blog-feature{grid-template-columns:1fr;gap:18px;padding:34px 26px 32px;border-radius:0 0 44px 0}
  .blog-text{font-size:17px}
  .blog-zitat{margin:34px 0;padding-left:20px}
  .blog-kasten{padding:26px 24px;border-radius:0 0 32px 0}
}
