/* =========================================
   MODULE: BLOG HERO — light theme
   ========================================= */
.blog-hero {
  /* Your Care Solutions brand override — scoped here so the rest of the
     theme (nav, footer, buttons) keeps its existing tokens untouched. */
  --clr-black:     #1f2a30;
  --clr-accent:    #29AAE2;
  --clr-accent-dk: #1f7faa;
  --clr-teal:      #0c6e62;
  --clr-teal-dk:   #084a42;
  --clr-mid:       #f7f5f0;
  --clr-mid-dk:    #e3e8e9;
  --clr-muted:     #59666d;
  --clr-border:    #e3e8e9;
  --font-display:  "Poppins", "Segoe UI", system-ui, sans-serif;
  --font-body:     "Inter", "Segoe UI", system-ui, sans-serif;
}
.blog-hero { background: var(--clr-white); padding-top: calc(6rem + clamp(2rem, 4vh, 4rem)); padding-bottom: 0; overflow: hidden; }
.blog-hero__inner { display: flex; flex-direction: column; gap: clamp(2.5rem, 5vw, 4rem); }
.blog-hero__top { border-top: 1px solid var(--clr-border); padding-top: 1.5rem; display: grid; grid-template-columns: auto 1fr auto; gap: 1.5rem clamp(2rem, 5vw, 5rem); align-items: end; }
.blog-hero__eyebrow { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--clr-muted); writing-mode: vertical-rl; transform: rotate(180deg) translateY(20px); align-self: start; padding-top: 0.5rem; opacity: 0; animation: blogFadeUp 0.6s var(--ease-out-expo) 0.1s forwards; }
.blog-hero__title { font-family: var(--font-display); font-size: clamp(4.5rem, 12vw, 11rem); line-height: 0.9; letter-spacing: 0.01em; color: var(--clr-black); grid-column: 2; opacity: 0; transform: translateY(20px); animation: blogFadeUp 0.8s var(--ease-out-expo) 0.2s forwards; }
.blog-hero__intro { font-size: clamp(0.9rem, 1.4vw, 1.05rem); color: var(--clr-muted); line-height: 1.7; font-weight: 300; max-width: 30ch; align-self: end; grid-column: 3; opacity: 0; transform: translateY(20px); animation: blogFadeUp 0.8s var(--ease-out-expo) 0.35s forwards; }
.blog-hero__filters { display: flex; align-items: center; gap: 0; border-top: 1px solid var(--clr-border); border-bottom: 1px solid var(--clr-border); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; opacity: 0; animation: blogFadeUp 0.6s var(--ease-out-expo) 0.5s forwards; }
.blog-hero__filters::-webkit-scrollbar { display: none; }
.blog-filter-btn { flex-shrink: 0; font-family: var(--font-display); font-size: 0.9rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--clr-muted); background: none; border: none; border-right: 1px solid var(--clr-border); padding: 1rem 1.75rem; cursor: pointer; transition: color var(--duration-fast), background var(--duration-fast); white-space: nowrap; }
.blog-filter-btn:last-child { border-right: none; }
.blog-filter-btn:hover { color: var(--clr-black); background: var(--clr-mid); }
.blog-filter-btn.is-active { color: #ffffff; background: #29AAE2; }
@keyframes blogFadeUp { to { opacity: 1; transform: translateY(0); } }
@media (max-width: 900px) {
  .blog-hero__top { grid-template-columns: 1fr; grid-template-rows: auto auto auto; }
  .blog-hero__eyebrow { writing-mode: horizontal-tb; transform: none; }
  .blog-hero__title, .blog-hero__intro { grid-column: 1; max-width: 100%; }
}