.blog-hero { background: var(--ink); color: white; padding-block: clamp(66px, 6vw, 112px); }
.blog-hero h1 { color: var(--teal); font: 700 clamp(44px, 5vw, 76px)/1.12 var(--heading-font); margin-bottom: .3em; }
.blog-hero p { margin: 0; }
.blog-content { padding-block: clamp(38px, 5vw, 90px); }
.blog-count { color: #345762; font-size: .9rem; }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 34px); }
.post-card { overflow: hidden; border-radius: 12px; background: var(--light); }
.post-link { display: flex; height: 100%; flex-direction: column; color: inherit; text-decoration: none; }
.post-link:focus-visible { outline-offset: -4px; }
.post-image { aspect-ratio: 1.85; background: #bad5d7 url('revital-logo.webp') center / 54px auto no-repeat; }
.post-image img { width: 100%; height: 100%; object-fit: cover; }
.post-copy { display: flex; flex: 1; flex-direction: column; padding: clamp(18px, 2vw, 36px); }
.post-copy time { font-size: .84rem; color: #345762; margin-bottom: 10px; }
.post-copy :is(h2,h3) { font-size: clamp(20px, 1.7vw, 30px); overflow-wrap: anywhere; }
.post-more { margin-top: auto; text-decoration: underline; text-underline-offset: 4px; font-weight: 700; }
.post-link:hover :is(h2,h3) { text-decoration: underline; text-underline-offset: 4px; }
.blog-pages { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 40px; }
.blog-pages > * { display: grid; place-items: center; min-width: 43px; min-height: 43px; padding-inline: 12px; border: 1px solid #9ab8ba; border-radius: 30px; color: var(--ink); text-decoration: none; font-weight: 600; }
.blog-pages [aria-current] { background: var(--ink); color: white; border-color: var(--ink); }
.blog-pages a:hover { background: var(--light); }
@media (max-width: 900px) { .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .blog-grid { grid-template-columns: 1fr; } }

.more-news { background: var(--light); padding-block: clamp(40px,5vw,80px); }
.more-news .post-card { background: #fff; }
.more-news .pill { margin-top: 24px; }