/* insights.html — page-specific styles only. All rules namespaced .insp- so
   nothing here collides with assets/styles.css or other pages' own page CSS. */

/* Hero footer meta row: byline + "Updated Weekly" label under the hero copy */
.insp-hero-foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:16px;
  margin-top:30px;padding-top:20px;border-top:1px solid var(--line);
  font-size:.82rem;color:var(--mut);
}
.insp-hero-issue{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.66rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mut);
}
.insp-hero-issue::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--yellow);flex:none}

/* Post cards no longer end in a link (no drafted detail page yet), so the
   trailing "in draft" chip needs the same bottom-alignment .insight-card a
   used to get from assets/styles.css. */
.insp-card-foot{margin-top:auto;padding-top:22px}

/* CTA form: 3-step process list reuses .contact-next-list, just adds a
   bold title line above each step's subtext. */
.insp-step-title{display:block;color:var(--ink);font-weight:700;margin-bottom:2px}

/* "See more" row */
.insp-see-more{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:32px}

/* Extra drafted posts, revealed by the "See more" button. .insight-card
   already sets display:flex in assets/styles.css, which (being an author
   rule) overrides the browser's default [hidden]{display:none} — so this
   needs its own explicit override to actually stay hidden until revealed. */
.insp-card-extra[hidden]{display:none}

/* Active state for the category filter chips (JS-toggled) */
.insights-category-nav a.insp-chip-active{background:var(--yellow)}

@media(max-width:620px){
  .insp-hero-foot{gap:10px}
  .insp-see-more{gap:12px}
}