.article-card, .featured-article, .popular-list__item { isolation: isolate; transition: transform 220ms cubic-bezier(.22,1,.36,1), background 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.article-card, .featured-article, .popular-list__item { cursor: pointer; }
.article-card__hitarea, .featured-article__hitarea, .popular-list__hitarea { position: absolute; inset: 0; z-index: 1; display: block; border-radius: inherit; }
.article-card > :not(.article-card__hitarea), .featured-article > :not(.featured-article__hitarea), .popular-list__item > :not(.popular-list__hitarea) { position: relative; z-index: 2; pointer-events: none; }
.article-card::after { z-index: 2; pointer-events: none; }
.article-card:hover, .article-card:focus-within { background: linear-gradient(135deg, #e6ffd9 0%, #dff8ff 100%); border-color: #29c982; transform: translateY(-4px); box-shadow: 0 14px 30px rgba(15, 31, 26, .14); }
.article-card:hover .article-card__meta, .article-card:focus-within .article-card__meta { color: #0f1e1a; background: #b8f25f; }
.article-card:hover .article-card__title, .article-card:hover .card__text, .article-card:hover .card__link, .article-card:focus-within .article-card__title, .article-card:focus-within .card__text, .article-card:focus-within .card__link { color: #0f1e1a; }
.article-card:hover .card__link, .article-card:focus-within .card__link { transform: translateX(4px); }
.article-card__hitarea:focus-visible, .featured-article__hitarea:focus-visible, .popular-list__hitarea:focus-visible { outline: 3px solid #29c982; outline-offset: -3px; }
.featured-article:hover, .featured-article:focus-within { background: linear-gradient(135deg, #102a27 0%, #17453b 100%); border-color: #29c982; transform: translateY(-4px); box-shadow: 0 16px 34px rgba(15, 31, 26, .2); }
.featured-article:hover .featured-article__link, .featured-article:focus-within .featured-article__link { color: #b8f25f; transform: translateX(4px); }
.popular-list__item { position: relative; border-radius: 16px; transition-property: background, transform, box-shadow; }
.popular-list__item:hover, .popular-list__item:focus-within { background: linear-gradient(90deg, #e6ffd9, #dff8ff); transform: translateX(4px); box-shadow: 0 8px 18px rgba(15, 31, 26, .08); }
.popular-list__item:hover .popular-list__title, .popular-list__item:focus-within .popular-list__title { color: #147a47; }
@media (prefers-reduced-motion: reduce) { .article-card, .featured-article, .popular-list__item, .article-card .card__link, .featured-article__link { transition: none; } }

#latest-articles + .blog-list__actions { position: relative; inset: auto; clear: both; display: flex; width: 100%; margin-top: 72px; transform: none; order: 0; z-index: 10; isolation: isolate; }
#latest-articles { position: relative; z-index: 1; }
#latest-articles .article-card { position: relative; z-index: 0; }
#latest-articles .article-card__hitarea { z-index: 3; }

.blog-list__actions.is-complete .button:disabled { opacity: .72; cursor: default; pointer-events: none; }

.article-card > .card__link { position: absolute; right: auto; bottom: 20px; left: 20px; z-index: 2; pointer-events: none; }
.article-card > .card__text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

[data-article-list="latest"] .article-card:nth-child(n + 7) { display: none; }
[data-article-list="latest"].is-expanded .article-card { display: flex; }
.blog-list__actions { display: flex; justify-content: center; margin-top: 32px; }
.blog-list__actions .button { min-width: 220px; }


.blog-list__actions-host { display: block; width: 100%; clear: both; position: relative; z-index: 20; margin-top: 72px; }
.blog-list__actions-host .blog-list__actions { position: static; inset: auto; display: flex; width: 100%; margin: 0; z-index: auto; isolation: isolate; }
.blog-list__actions-host .button { position: relative; z-index: 21; }


.blog-list__actions-host { grid-column: 1 / -1; grid-row: auto; align-self: start; justify-self: stretch; flex-basis: 100%; }
#latest-articles + .blog-list__actions-host { grid-column: 1 / -1; }


@media (min-width: 1400px) {
  body[data-page="blog"] main > section:nth-child(3) { height: auto; min-height: 0; padding: 20px 0 80px; overflow: visible; }
  body[data-page="blog"] main > section:nth-child(3) > .container { height: auto; min-height: 0; position: relative; }
  body[data-page="blog"] main > section:nth-child(3) .section-heading { position: relative; inset: auto; margin: 0 0 32px; }
  body[data-page="blog"] main > section:nth-child(3) .grid--3 { position: relative; inset: auto; width: 100%; height: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 32px; }
  body[data-page="blog"] main > section:nth-child(3) .blog-list__actions-host { grid-column: 1 / -1; position: relative; inset: auto; width: 100%; margin-top: 72px; }
}