/* ===================================================================
   FlowTrig — blog.css   (Blog listing — builds on case-study.css)
   Uses the SAME token gradient + banner styles as case studies.
   Only adds: search bar, date·read-time meta, hide KPI numbers.
   =================================================================== */

/* search / category bar */
.blog-tools{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:26px; }
.blog-search{ flex:1; min-width:220px; display:flex; align-items:center; gap:9px; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:11px 15px; }
.blog-search svg{ width:17px; height:17px; color:var(--tx-mute); flex:0 0 17px; }
.blog-search input{ flex:1; background:none; border:0; color:var(--tx); font-size:14px; outline:none; }

/* card meta: date + read time (blog cards don't use KPI numbers) */
.cs-readmore .blog-date{ font-size:11.5px; color:var(--tx-mute); font-family:var(--font-m); white-space:nowrap; }
.blog-page .cs-banner .kpi{ display:none; }
.blog-feature-tag{ position:absolute; top:14px; right:14px; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; background:rgba(0,0,0,.35); color:#fff; border:1px solid rgba(255,255,255,.25); padding:4px 9px; border-radius:999px; backdrop-filter:blur(4px); }