/* Blog hero + filters + cards */
.kicker{font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#259492;margin:0 0 6px}
.blog-hero{display:grid;grid-template-columns:1fr;gap:12px;align-items:end;padding:10px 0}
.blog-hero .lede.callout{
  font-size:1.1rem;line-height:1.55;color:#0d1b2a;max-width:56ch;
  padding:12px 16px;border-radius:14px;border:1px solid #e6ebf2;background:linear-gradient(180deg,#fff 0%,#f7fafc 100%);
  box-shadow:0 8px 24px rgba(16,24,40,.06)
}
.blog-filters{display:flex;gap:10px;padding:8px 0 16px}
.blog-filters .chip{display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid #e6ebf2;color:#0d1b2a;font-weight:700;text-decoration:none}
.blog-filters .chip.active{background:linear-gradient(90deg,#259492,#3ed4be);color:#06101d;border-color:transparent}

.post-grid{display:grid;gap:18px;grid-template-columns:repeat(12,1fr)}
.post-card{grid-column:span 4;background:#fff;border:1px solid #e6ebf2;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(16,24,40,.08);position:relative}
.post-card .thumb{display:block;aspect-ratio:16/9;overflow:hidden}
.post-card img{width:100%;height:100%;object-fit:cover;display:block}
.post-body{padding:16px 16px 18px}
.post-title{margin:0 0 6px;font-size:1.15rem;line-height:1.25}
.post-title a{color:#0d1b2a;text-decoration:none}
.post-title a:hover{text-decoration:underline}
.post-excerpt{color:#516072;margin:0 0 12px;min-height:3.2em}
.meta{font-size:.9rem;color:#7a8899}
.post-card.featured{grid-column:span 12;display:grid;grid-template-columns:1.25fr 1fr}
.post-card.featured .thumb{aspect-ratio:auto}
.post-card.featured .post-body{display:flex;flex-direction:column;justify-content:center}
@media(max-width:900px){.post-card{grid-column:span 12}.post-card.featured{grid-template-columns:1fr}}
/* Blog category tabs sit below the sticky header */
.service-tabs{
  display:flex;
  gap:18px;
  align-items:center;
  justify-content:center;
  padding:10px 0;                 /* vertical breathing room */
  background:#fff;
  border-top:1px solid #e8edf3;   /* separate from header */
  border-bottom:1px solid #eef2f6;
  position:relative;
  z-index: 1;                     /* stay above page content, below header */
}

/* Links inside the tabs */
.service-tabs a{
  position:relative;
  text-decoration:none;
  color:#0d1b2a;
  font-weight:700;
  opacity:.9;
  padding:6px 8px;
  white-space:nowrap;             /* keep “White-Label” from wrapping */
  transition:opacity .18s ease;
}
.service-tabs a:hover,
.service-tabs a:focus-visible{
  opacity:1;
}

/* Underline indicator for hover/active */
.service-tabs a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-6px;
  height:2px;
  background:transparent;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s, background .18s;
}
.service-tabs a:hover::after,
.service-tabs a[aria-current="page"]::after{
  background:linear-gradient(90deg,#259492,#3ed4be);
  transform:scaleX(1);
}

/* Make sure sticky header and tabs don’t overlap */
header{ z-index:40; }
header + .service-tabs{ margin-top:0; }

@media (max-width:700px){
  .service-tabs{ gap:12px; padding:8px 0; }
  .service-tabs a{ font-weight:600; }
}