/* 50-templates.css — coverage-page chips, the blog-article page template and the Google Ads
   landing-page template (Lorena, 11 Sep 2026). Layout only; style.css §1 tokens. */

/* ---- coverage chips in the coverage-page hero: current page filled ---- */
.cr-chips-row { display:flex; flex-wrap:wrap; gap:var(--sp-2); max-width:none; }
.cr-chip { display:inline-flex; align-items:center; padding:var(--pill-pad); border:1px solid var(--glass-55); border-radius:var(--r-btn);
  color:var(--on-dark); font-size:var(--fs-ui); font-weight:var(--w-semi); line-height:var(--lh-small); text-decoration:none;
  transition:background-color var(--dur-fast) ease, color var(--dur-fast) ease, border-color var(--dur-fast) ease; }
.cr-chip:hover { background:var(--glass-16); color:var(--on-dark); }
.cr-chip:focus-visible { outline:var(--focus-w) solid var(--accent-hi); outline-offset:var(--focus-w); }
body.cr-page-home-insurance .cr-chip-home-insurance, body.cr-page-auto-insurance .cr-chip-auto-insurance,
body.cr-page-life-insurance .cr-chip-life-insurance, body.cr-page-business-insurance .cr-chip-business-insurance {
  background:var(--page); border-color:var(--page); color:var(--ink); }

/* ---- blog article ---- */
.cr-article-hero { background:var(--ink); color:var(--on-dark); padding:var(--section) var(--pad-h); }
.cr-article-hero .cr-crumbs-path { color:var(--on-dark-muted); max-width:none; }
.cr-article-hero .cr-crumbs-path a { color:var(--on-dark-muted); }
.cr-article-hero .cr-crumbs-path strong { color:var(--on-dark); }
.cr-article-hero h1 { --mw:24ch; max-width:var(--mw); color:var(--on-dark); }
.cr-article-hero .cr-article-meta { color:var(--on-dark-muted); font-size:var(--fs-ui); max-width:none; }
.cr-article-grid { --cols:minmax(0,2fr) minmax(0,1fr); --ai:start; --g:var(--gap-col); }
.cr-article { display:flex; flex-direction:column; gap:var(--sp-4); }
.cr-article .wp-block-image.cr-article-img { margin:0; }
.cr-article .cr-article-img img { display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover; border-radius:var(--r-card); }
.cr-band .cr-article p { max-width:var(--mw-prose); }
.cr-band .cr-article h2 { font-size:var(--fs-h3); max-width:var(--mw-prose); margin-top:var(--sp-3); }
.cr-article h3 { font-size:var(--fs-body); }
.cr-article .cr-checklist { max-width:var(--mw-prose); }
.cr-article-table { width:100%; max-width:var(--mw-prose); border-collapse:collapse; font-size:var(--fs-ui); line-height:var(--lh-ui); }
.cr-article-table th, .cr-article-table td { text-align:left; padding:var(--sp-3) var(--sp-4); border:1px solid var(--border); vertical-align:top; }
.cr-article-table th { background:var(--surface); font-weight:var(--w-semi); color:var(--text); }
.cr-article-table td { color:var(--muted); }
.cr-article-side { display:flex; flex-direction:column; gap:var(--sp-4); background:var(--page); border:1px solid var(--border); border-radius:var(--r-card); padding:var(--pad-card); box-shadow:var(--shadow); }
.cr-article-side h3 { font-size:var(--fs-h3); }
.cr-article-side .cr-post { box-shadow:none; }
.cr-article-side .cr-post-body { padding:var(--sp-5); gap:var(--sp-2); }
.cr-band .cr-article-side .cr-post h4 { font-size:var(--fs-body); line-height:var(--lh-h3); }
.cr-band .cr-article-side .cr-post-more { max-width:none; }

/* ---- landing page (Google Ads): the form lives on the page ---- */
.cr-landing-form { background:var(--surface); scroll-margin-top:var(--scroll-mt); }
.cr-landing-form-col { display:flex; flex-direction:column; gap:var(--sp-4); max-width:60ch; margin:0 auto; }
.cr-landing-form-col > .cr-sechead { margin-bottom:0; align-items:center; text-align:center; }
.cr-landing-form-col .cr-form-card { width:100%; box-sizing:border-box; }
.cr-landing-form-col .cr-form-note { text-align:center; margin:0 auto; }

@media (max-width:767px) {
  .cr-article-grid { --cols:minmax(0,1fr); --g:var(--gap-grid); }
  .cr-article-table { display:block; overflow-x:auto; }
}
