/* insights.css — /insights (the blog), in the solution-page design language.
   Reuses .panel/.hero/.cta from solution.css; card + filter styling here. */

/* ---------- hero: search under the copy ---------- */
.ins-hero{grid-template-columns:1fr}
.ins-hero .hero__copy{align-items:center;text-align:center;max-width:720px;margin:0 auto}
.ins-hero .hero__sub{margin-inline:auto}
.ins-search{width:min(560px,100%);margin-top:var(--sp-2)}
.ins-search input{width:100%;padding:14px var(--sp-5);border-radius:40px;
  border:var(--border) solid var(--line-solutions);
  background:var(--card-solutions);backdrop-filter:var(--card-blur);
  color:#fff;font-size:var(--step-0);outline:none}
.ins-search input::placeholder{color:var(--text-solutions-soft)}
.ins-search input:focus{border-color:var(--action);background:rgba(255,255,255,.14)}

/* ---------- filter pills ---------- */
.ins-filters{display:flex;flex-wrap:wrap;gap:var(--sp-2);
  justify-content:center;margin-bottom:var(--sp-8)}
.ins-filter{font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;
  letter-spacing:.04em;padding:8px var(--sp-4);border-radius:20px;cursor:pointer;
  border:var(--border) solid var(--line);background:var(--surface);
  color:var(--text-soft);transition:all .15s}
.ins-filter:hover{border-color:var(--line-strong);color:var(--text)}
.ins-filter.is-active{background:var(--brand-700);border-color:var(--brand-700);color:#fff}

/* ---------- shared card bits ---------- */
.ins-meta{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.06em;
  text-transform:uppercase}
.ins-cat{color:var(--accent);font-weight:650}
.ins-date{color:var(--text-faint)}
.ins-tag{background:var(--action);color:var(--action-text);border-radius:12px;
  padding:2px var(--sp-3);font-weight:650}
.ins-more{display:inline-block;margin-top:auto;font-family:var(--font-mono);
  font-size:var(--step--1);font-weight:650;color:var(--accent)}

/* shot placeholder — the indigo band until real post art exists */
.ins-featured__shot,.ins-card__shot{position:relative;display:grid;place-items:center;
  padding:var(--sp-4);text-align:center;overflow:hidden;
  background-color:var(--surface-solutions);background-image:var(--solutions-fx)}
.ins-featured__shot span,.ins-card__shot span{font-family:var(--font-mono);
  font-size:var(--step--2);letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-solutions-soft)}

/* ---------- featured post ---------- */
.ins-featured{display:grid;gap:0;margin-bottom:var(--sp-8);overflow:hidden;
  background:var(--surface);border:var(--border) solid var(--line);
  border-radius:var(--radius-lg);transition:border-color .15s}
.ins-featured:hover{border-color:var(--line-strong)}
@media(min-width:820px){.ins-featured{grid-template-columns:1.1fr 1fr}}
.ins-featured__shot{min-height:240px}
.ins-featured__body{display:flex;flex-direction:column;gap:var(--sp-3);
  padding:clamp(24px,3vw,40px)}
.ins-featured__title{margin:0;font-size:clamp(22px,2.6vw,32px);line-height:1.2}
.ins-featured__title a{color:var(--text-heading)}
.ins-featured__title a:hover{color:var(--accent);text-decoration:none}
.ins-featured__excerpt{margin:0;color:var(--text-soft)}

/* ---------- grid ---------- */
.ins-grid{display:grid;gap:var(--sp-6);grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.ins-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ins-grid{grid-template-columns:1fr}}
.ins-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;
  background:var(--surface);border:var(--border) solid var(--line);
  border-radius:var(--radius-lg);transition:border-color .15s,transform .15s}
.ins-card:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.ins-card__shot{aspect-ratio:16/9}
.ins-card__body{display:flex;flex-direction:column;gap:var(--sp-3);
  padding:var(--sp-5);flex:1}
.ins-card__title{margin:0;font-size:var(--step-1);line-height:1.3}
.ins-card__title a{color:var(--text-heading)}
.ins-card__title a:hover{color:var(--accent);text-decoration:none}
.ins-card__excerpt{margin:0;color:var(--text-soft);font-size:var(--step--1);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.ins-empty{text-align:center;color:var(--text-soft);padding:var(--sp-8) 0}
.is-hidden{display:none !important}

/* ---------- newsletter ---------- */
.ins-signup{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.ins-signup input{flex:1;min-width:220px;padding:12px var(--sp-4);
  border-radius:var(--radius);border:var(--border) solid var(--line-strong);
  background:var(--surface);color:var(--text);font-size:var(--step-0)}
.ins-signup input:focus{outline:2px solid var(--accent);outline-offset:1px}

/* real featured images (CMS data URIs) fill the shot instead of overflowing */
.ins-featured__shot,.ins-card__shot{overflow:hidden}
.ins-featured__shot img,.ins-card__shot img{width:100%;height:100%;object-fit:cover;display:block}

/* covers: one social-card shape everywhere; the image is never cropped */
.ins-featured__shot,.ins-card__shot{position:relative;aspect-ratio:1.91/1;min-height:0;padding:0}
.ins-featured__shot{align-self:start}

/* first 24 posts show; the rest are in the HTML and revealed on demand */
[data-insights]:not(.is-expanded) .ins-card--extra{display:none}
.ins-more-wrap{text-align:center;margin:var(--sp-8) 0 0}