.nv-post-list {
    --post-brand: var(--nv-brand, #1c9cbf);
    --post-ink: var(--nv-ink, #1f2a33);
    padding: 40px 0 60px;
    background: linear-gradient(180deg, #f3f9fb, #fff 75%);
    color: var(--post-ink);
}
.nv-post-list .nv-post-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.nv-post-list .nv-post-eyebrow { color: #147a96; font-size: 12px; }
.nv-post-list h1 { margin: 8px 0 0; font-size: 28px; font-weight: 700; line-height: 1.6; }
.nv-post-list .nv-post-total { padding: 8px 16px; border: 1px solid #dcebf0; border-radius: 30px; background: #fff; color: #667787; white-space: nowrap; }
.nv-post-list .nv-post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; list-style: none; }
.nv-post-list .nv-post-item { min-width: 0; }
.nv-post-list .nv-post-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid #e6eef2; border-radius: 20px; background: #fff; box-shadow: 0 6px 24px rgba(21, 62, 77, .05); transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
.nv-post-list .nv-post-card:focus-within { border-color: var(--post-brand); box-shadow: 0 16px 36px rgba(21, 62, 77, .12); }
.nv-post-list .nv-post-image { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #eaf4f7; isolation: isolate; }
.nv-post-list .nv-post-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .65, .3, 1), filter .7s ease; }
.nv-post-list .nv-post-image::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, transparent 30%, rgba(9, 44, 56, .55)); opacity: .25; transition: opacity .4s ease; pointer-events: none; }
.nv-post-list .nv-post-date { position: absolute; top: 16px; inset-inline-start: 16px; z-index: 2; display: grid; justify-items: center; min-width: 58px; padding: 8px 12px; border-radius: 12px; background: rgba(255, 255, 255, .95); color: var(--post-ink); box-shadow: 0 4px 16px #163b4814; font-size: 12px; }
.nv-post-list .nv-post-date strong { font-size: 23px; line-height: 1.3; }
.nv-post-list .nv-post-image-action { position: absolute; bottom: 18px; inset-inline-end: 18px; z-index: 2; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #ffffff80; border-radius: 50%; background: #ffffff26; color: #fff; opacity: 0; transform: translateY(12px); transition: opacity .4s ease, transform .4s ease; }
.nv-post-list .nv-post-image:focus-visible img { transform: scale(1.07); }
.nv-post-list .nv-post-image:focus-visible::after { opacity: 1; }
.nv-post-list .nv-post-image:focus-visible .nv-post-image-action { opacity: 1; transform: none; }
.nv-post-list .nv-post-placeholder { display: grid; place-items: center; height: 100%; background: linear-gradient(135deg, #e8f6fa, #d4e8ef); color: #78a6b5; font-size: 48px; }
.nv-post-list .nv-post-content { display: flex; flex: 1; flex-direction: column; padding: 22px; }
.nv-post-list .nv-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; color: #667787; font-size: 12px; line-height: 1.8; }
.nv-post-list .nv-post-meta span:first-child { margin-inline-end: auto; overflow-wrap: anywhere; }
.nv-post-list .nv-post-meta i { margin-inline-end: 4px; color: #88a1ad; }
.nv-post-list .nv-post-title { margin: 14px 0 10px; font-size: 18px; font-weight: 700; line-height: 1.9; overflow-wrap: anywhere; }
.nv-post-list .nv-post-title a { color: var(--post-ink); transition: color .2s ease; }
.nv-post-list .nv-post-title a:hover { color: #147a96; }
.nv-post-list .nv-post-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin: 0 0 22px; color: #667787; font-size: 13px; line-height: 2; overflow-wrap: anywhere; }
.nv-post-list .nv-post-more { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 16px; border-top: 1px solid #edf2f5; color: #147a96; font-size: 13px; font-weight: 700; }
.nv-post-list .nv-post-more i { transition: transform .25s ease; }
.nv-post-list .nv-post-more:hover i { transform: translateX(-5px); }
.nv-post-list a:focus-visible { outline: 2px solid var(--post-brand); outline-offset: 3px; }
.nv-post-list .nv-post-image:focus-visible { outline-offset: -4px; }
.nv-post-list .nv-post-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 38px; }
.nv-post-list .nv-post-pagination > * { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 10px; border: 1px solid #e0eaf0; border-radius: 12px; background: #fff; color: #526774; }
.nv-post-list .nv-post-pagination [aria-current], .nv-post-list .nv-post-pagination a:hover { background: #147a96; border-color: #147a96; color: #fff; }
.nv-post-list .nv-post-empty { padding: 65px 20px; text-align: center; background: #fff; border: 1px dashed #cddfe6; border-radius: 20px; color: #667787; }
.nv-post-list .nv-post-empty > i { display: block; margin-bottom: 20px; color: var(--post-brand); font-size: 40px; }
@media (hover: hover) and (pointer: fine) {
    .nv-post-list .nv-post-card:hover { transform: translateY(-7px); border-color: #c4e1ea; box-shadow: 0 18px 38px rgba(21, 62, 77, .12); }
    .nv-post-list .nv-post-image:hover img { transform: scale(1.07); filter: saturate(1.08); }
    .nv-post-list .nv-post-image:hover::after { opacity: 1; }
    .nv-post-list .nv-post-image:hover .nv-post-image-action { opacity: 1; transform: none; }
}
@media (max-width: 991px) { .nv-post-list .nv-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; } }
@media (max-width: 575px) {
    .nv-post-list { padding: 28px 0 40px; }
    .nv-post-list .nv-post-grid { grid-template-columns: minmax(0, 1fr); }
    .nv-post-list h1 { font-size: 23px; }
    .nv-post-list .nv-post-content { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .nv-post-list *, .nv-post-list *::after { transition: none !important; animation: none !important; }
    .nv-post-list .nv-post-card:hover, .nv-post-list .nv-post-image img, .nv-post-list .nv-post-more i { transform: none !important; }
}
