/* ============================================================
   Big Apple Baby — Phase 3: article-page reskin
   Matches design/article-mockup.html (editorial layout, Newsreader reading
   type, terracotta pull-quotes, comparison tables, "Keep reading" cards,
   newsletter band). Loaded ONLY on single posts via the bab-article-extras
   mu-plugin (enqueued after the child style.css). Uses the theme's existing
   --bab-* tokens. Reversible: remove the mu-plugin + this file.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,400;6..72,500&family=Inter:wght@400;500;600&display=swap');

:root{
  --bab-read:"Newsreader",Georgia,"Times New Roman",serif;
  --bab-sans:"Inter",-apple-system,"Segoe UI",sans-serif;
  --bab-sage-tint:#eef2ec;
}

/* ---------- Article head: centered ---------- */
.single .entry-header{ text-align:center; max-width:760px; margin-left:auto; margin-right:auto; padding-top:6px; }
.single .entry-title{ margin:12px auto 14px !important; max-width:18ch; }
.single .entry-header .entry-meta{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px;
  font-family:var(--bab-sans); font-size:14px; color:var(--bab-soft); }
.single .entry-header .entry-meta .updated{ display:none; }              /* hide noisy auto-modified date */
.single .entry-header .entry-meta .author-name{ color:var(--bab-ink); font-weight:600; }

/* ---------- Category bar (theme's .bab-adbar) → centered pill ---------- */
.single .bab-adbar{ display:flex; justify-content:center; align-items:center; gap:10px;
  background:none; border:0; padding:4px 0 0; margin:0 0 2px; letter-spacing:normal; }
.single .bab-adbar span{ display:inline-block; }
.single .bab-adbar span:first-child{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--bab-muted); }
.single .bab-adbar span:last-child{ font-family:var(--bab-sans); font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; font-weight:600; color:var(--bab-green-dark); background:#eef0e9;
  padding:4px 11px; border-radius:999px; }
.single .bab-adbar span:last-child:empty{ display:none; }

/* ---------- Lead / featured image ---------- */
.single .featured-image.page-header-image-single{ max-width:980px; margin:24px auto 4px; }
.single .featured-image img{ border-radius:14px; }

/* ---------- Standfirst (the .bab-dek lead paragraph) ---------- */
.single .entry-content p.bab-dek{ font-family:var(--bab-read) !important; font-size:22px !important;
  line-height:1.5 !important; color:var(--bab-soft) !important; font-weight:400 !important; margin:8px 0 26px !important; }

/* ---------- Reading prose (direct children only — protects bab-* components) ---------- */
.single .entry-content > p,
.single .entry-content > ul > li,
.single .entry-content > ol > li{ font-family:var(--bab-read); font-size:19.5px; line-height:1.72; color:#2a251e; }
.single .entry-content > h2{ font-size:27px; margin:42px 0 14px; }
.single .entry-content > p a:not(.bab-cta),
.single .entry-content > ul > li a:not(.bab-cta){ color:var(--bab-green-dark);
  text-decoration:underline; text-decoration-color:#bcd0c1; text-decoration-thickness:1px; text-underline-offset:3px; }

/* ---------- Pull-quote (match mockup) ---------- */
.single .entry-content .bab-pull{ font-family:Georgia,"Fraunces",serif; font-weight:500; font-size:27px;
  line-height:1.3; color:var(--bab-green-dark); border-left:3px solid var(--bab-cta);
  padding:6px 0 6px 24px; margin:30px 0; background:none; font-style:normal; }

/* ---------- Comparison table ---------- */
.single .entry-content table{ width:100%; border-collapse:collapse; font-family:var(--bab-sans); font-size:15.5px;
  margin:30px 0; background:var(--bab-paper); border:1px solid var(--bab-line); border-radius:12px; overflow:hidden; }
.single .entry-content thead th{ background:var(--bab-sage-tint); font-weight:600; color:var(--bab-green-dark); }
.single .entry-content th,.single .entry-content td{ text-align:left; padding:12px 16px;
  border-bottom:1px solid var(--bab-line); vertical-align:top; line-height:1.45; }
.single .entry-content tbody tr:last-child td{ border-bottom:0; }
.single .entry-content tbody td:first-child{ font-weight:600; color:var(--bab-ink); width:24%; }

/* ---------- "Keep reading" cards (built by the mu-plugin) ---------- */
.bab-keepreading{ margin:46px 0 8px; }
.bab-keepreading h2{ font-family:Georgia,"Fraunces",serif; font-size:24px; color:var(--bab-ink);
  border-bottom:1px solid var(--bab-line); padding-bottom:13px; margin:0 0 24px; }
.bab-kr-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.bab-kr-card{ display:block; text-decoration:none !important; }
.bab-kr-ph{ display:block; aspect-ratio:3/2; border-radius:12px; overflow:hidden; background:#e9e2d4; margin-bottom:12px; }
.bab-kr-ph img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.bab-kr-card:hover .bab-kr-ph img{ transform:scale(1.04); }
.bab-kr-cat{ display:inline-block; font-family:var(--bab-sans); font-size:10.5px; letter-spacing:.12em;
  text-transform:uppercase; font-weight:600; color:var(--bab-green-dark); background:#eef0e9;
  padding:3px 9px; border-radius:999px; margin-bottom:8px; }
.bab-kr-title{ display:block; font-family:Georgia,"Fraunces",serif; font-size:18px; line-height:1.25;
  color:var(--bab-ink) !important; }
.bab-kr-card:hover .bab-kr-title{ color:var(--bab-cta) !important; }

/* ---------- Newsletter band (built by the mu-plugin) ---------- */
.bab-news-band{ background:var(--bab-green-dark); color:#fbf8f0; border-radius:18px; padding:44px;
  text-align:center; margin:34px 0 8px; }
.bab-news-band h2{ font-family:Georgia,"Fraunces",serif; color:#fbf8f0; font-size:28px; margin:0 0 8px; }
.bab-news-band p{ color:#d9e2da; margin:0 auto 22px; max-width:48ch; font-family:var(--bab-read); font-size:17px; }
.bab-news-band form{ display:flex; gap:10px; max-width:430px; margin:0 auto; }
.bab-news-band input{ flex:1; border:0; border-radius:10px; padding:13px 16px; font-family:var(--bab-sans); font-size:15px; }
.bab-news-band button{ border:0; border-radius:10px; padding:13px 22px; background:var(--bab-cta); color:#fff;
  font-weight:600; font-family:var(--bab-sans); font-size:15px; cursor:pointer; }
.bab-news-band button:hover{ background:var(--bab-cta-dark); }

/* ---------- Author card polish ---------- */
.single .bab-author-box{ border:1px solid var(--bab-line); border-radius:14px; background:var(--bab-paper); padding:26px 28px; }

/* ---------- Responsive ---------- */
@media(max-width:820px){
  .bab-kr-grid{ grid-template-columns:1fr 1fr; gap:20px; }
}
@media(max-width:560px){
  .single .entry-content > p,.single .entry-content > ul > li{ font-size:18px; }
  .single .entry-content table{ font-size:14px; }
  .single .entry-content th,.single .entry-content td{ padding:10px 12px; }
  .bab-kr-grid{ grid-template-columns:1fr; }
  .bab-news-band{ padding:30px 20px; }
  .bab-news-band form{ flex-direction:column; }
  .single .bab-author-box{ padding:22px 20px; gap:14px; }
}