/* ═══════════════════════════════════════════
   Blog — list (/blog/) + single post
   Loaded after recipes.css and reuses its .dr tokens, buttons, hero band, cards and toast.
   Light mode only for now.
   ═══════════════════════════════════════════ */

.dr .band-in--center{text-align:center}
.dr .band-in--center .hero-sub{margin:12px auto 0}
.dr .blog-wrap{padding-top:44px;padding-bottom:80px}

/* ---------- meta line: CATEGORY · date ---------- */
.dr .post-meta{font-size:12.5px;color:var(--text-soft);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.dr .post-meta em{font-style:normal;color:var(--accent-deep);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:11px}

/* ---------- featured post ---------- */
.dr .blog-feature{display:grid;grid-template-columns:1.15fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin-bottom:40px;transition:.2s;text-decoration:none;color:inherit}
.dr .blog-feature:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.dr .blog-feature .photo{aspect-ratio:auto;min-height:300px;font-size:76px}
.dr .bf-body{padding:34px 36px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.dr .bf-body h2{font-size:clamp(24px,2.6vw,32px);line-height:1.2}
.dr .bf-body p{color:var(--text-soft);font-size:15.5px}
.dr .bf-body .btn{align-self:flex-start;margin-top:6px}
.dr .blog-feature:hover .btn{filter:brightness(1.05)}

/* ---------- post cards ---------- */
.dr .blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:26px}
.dr .post-card{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:inherit}
.dr .post-card .photo{border-radius:var(--radius);aspect-ratio:3/2;font-size:48px;transition:.2s;box-shadow:var(--shadow)}
.dr .post-card:hover .photo{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.dr .post-card h3{font-size:19px;line-height:1.32}
.dr .post-card:hover h3{color:var(--brand)}
.dr .post-card p{font-size:14px;color:var(--text-soft)}
.dr .post-card .post-date{font-size:12.5px;color:var(--text-soft);margin-top:auto}

/* pagination */
.dr .blog-pages{margin-top:44px}
.dr .blog-pages ul{list-style:none;margin:0;padding:0;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.dr .blog-pages .page-numbers{display:inline-flex;align-items:center;min-width:40px;height:40px;justify-content:center;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:14px;text-decoration:none;color:var(--text);transition:.18s}
.dr .blog-pages a.page-numbers:hover{border-color:var(--brand)}
.dr .blog-pages .current{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
.dr .blog-pages .dots{border:0;background:none}

/* ---------- article ---------- */
.dr .article{max-width:848px;margin:0 auto;padding:0 24px 80px}
.dr .article-head{text-align:center;padding:46px 0 26px}
.dr .article-head .post-meta{justify-content:center}
.dr .article-head h1{font-size:clamp(30px,4.4vw,44px);line-height:1.16;margin:12px 0}
.dr .article-photo{border-radius:22px;aspect-ratio:16/9;font-size:90px;box-shadow:var(--shadow)}
.dr .article .lede{font-size:18.5px;color:var(--text-soft);line-height:1.7;margin:22px 0;font-family:var(--serif)}

/* post body from the editor */
.dr .entry{margin-top:22px}
.dr .entry > :first-child{margin-top:0}
.dr .entry h2{font-size:25px;margin:36px 0 12px}
.dr .entry h3{font-size:19px;margin:26px 0 8px}
.dr .entry p{margin:0 0 16px;font-size:16.5px;line-height:1.78;color:var(--text)}
.dr .entry ul,.dr .entry ol{margin:0 0 18px;padding-left:22px;color:var(--text);line-height:1.78;font-size:16.5px}
.dr .entry li{margin-bottom:7px}
.dr .entry strong,.dr .entry b{color:var(--brand-strong)}
.dr .entry a{color:var(--accent-deep);text-decoration:underline;text-underline-offset:3px}
.dr .entry a:hover{color:var(--brand-strong)}
.dr .entry blockquote,.dr .entry .wp-block-pullquote{border:0;border-left:3px solid var(--accent);padding:6px 0 6px 20px;margin:26px 0;text-align:left}
.dr .entry blockquote p,.dr .entry .wp-block-pullquote p{font-family:var(--serif);font-size:20px;line-height:1.5;color:var(--brand-strong);margin:0}
.dr .entry blockquote cite{display:block;margin-top:8px;font-size:13px;font-style:normal;color:var(--text-soft)}
.dr .entry img{max-width:100%;height:auto;border-radius:var(--radius-sm)}
.dr .entry figure{margin:26px 0}
.dr .entry figcaption{font-size:13px;color:var(--text-soft);text-align:center;margin-top:8px}
.dr .entry hr{border:0;border-top:1px solid var(--line);margin:32px 0}

/* share row */
.dr .share{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:34px 0;font-size:13.5px;color:var(--text-soft)}
.dr .share b{color:var(--text)}
.dr .share-cat{margin-left:auto}

/* three recipe cards fit across the 800px column */
.dr .article .grid{grid-template-columns:repeat(auto-fill,minmax(196px,1fr))}
.dr .article .sec + .sec{margin-top:40px}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .dr .blog-feature{grid-template-columns:1fr}
  .dr .blog-feature .photo{min-height:0;aspect-ratio:16/9}
}
@media (max-width:620px){
  .dr .blog-wrap{padding-top:30px;padding-bottom:60px}
  .dr .bf-body{padding:22px 20px 24px}
  .dr .article{padding-left:16px;padding-right:16px}
  .dr .article-head{padding:32px 0 20px}
  .dr .article-photo{border-radius:16px}
  .dr .share-cat{margin-left:0;width:100%}
  .dr .blog-grid{gap:30px}
}