/* ===== News & Updates cards (homepage section + /news-and-updates listing) ===== */
.nu-section{ position: relative; padding: 80px 0 70px; background: #ffffff; }
.nu-section .sec-title-two{ margin-bottom: 45px; }
.nu-row{ margin-bottom: -30px; }
.nu-col{ margin-bottom: 30px; }

.nu-card{
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(15,25,35,0.07);
    border: 1px solid #eef2f5;
    color: inherit;
    text-decoration: none;
    transition: transform 350ms ease, box-shadow 350ms ease;
}
.nu-card:hover, .nu-card:focus-visible{
    transform: translateY(-6px);
    box-shadow: 0 18px 34px rgba(15,25,35,0.12);
    color: inherit;
    text-decoration: none;
}
.nu-card:focus-visible{ outline: 2px solid #00bffe; outline-offset: 3px; }

/* Share images (og:image) are typically 1200 x 630, i.e. 1.91:1 */
.nu-card-image{
    position: relative;
    width: 100%;
    aspect-ratio: 1.91 / 1;
    overflow: hidden;
    background: linear-gradient(135deg, #e6f8ff 0%, #f4f7fa 100%);
    flex-shrink: 0;
}
.nu-card-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 500ms ease;
}
.nu-card:hover .nu-card-image img{ transform: scale(1.05); }

/* Shown when an item has no image, or the external image fails to load */
.nu-card-image .nu-card-fallback{
    position: absolute;
    inset: 0;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #00a9dd;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 0 16px;
    text-align: center;
    word-break: break-word;
}
.nu-card-image .nu-card-fallback i{ font-size: 38px; opacity: 0.85; }
.nu-card-image.is-fallback .nu-card-fallback{ display: flex; }

.nu-card-body{
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.nu-card-meta{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-bottom: 10px;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #00a9dd;
}
.nu-card-meta .nu-date{ color: #8a9199; font-weight: 500; }
.nu-card-meta i{ margin-right: 4px; }
.nu-card-body h4{
    font-family: 'Poppins', sans-serif;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.45;
    color: #1c2226;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
    transition: color 250ms ease;
}
.nu-card:hover .nu-card-body h4{ color: #00a9dd; }
.nu-card-body p{
    font-family: 'Lato', sans-serif;
    font-size: 14.5px;
    line-height: 23px;
    color: #6b7378;
    margin: 0 0 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}
.nu-card-link{
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid #eef2f5;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    color: #00a9dd;
}
.nu-card-link i{ margin-left: 5px; transition: transform 300ms ease; display: inline-block; }
.nu-card:hover .nu-card-link i{ transform: translate(2px, -2px); }

.nu-view-all{ text-align: center; margin-top: 50px; }
.nu-empty{ text-align: center; font-family: 'Lato', sans-serif; font-size: 16px; color: #8a9199; padding: 40px 0; }

/* Listing page */
.nu-listing{ padding: 70px 0 60px; background: #f7f9fb; }
.nu-pager{ margin-top: 50px; display: flex; justify-content: center; }
.nu-pager .pagination{ flex-wrap: wrap; justify-content: center; }
.nu-pager .pagination li a{ color: #00a9dd; }
.nu-pager .pagination li.active a{ background: #00bffe; border-color: #00bffe; color: #fff; }

@media (max-width: 991px){
    .nu-section{ padding: 60px 0 55px; }
    .nu-listing{ padding: 55px 0 45px; }
}
@media (max-width: 767px){
    .nu-col{ margin-bottom: 22px; }
    .nu-row{ margin-bottom: -22px; }
    .nu-card-body{ padding: 18px 18px 20px; }
    .nu-card-body h4{ font-size: 16px; }
    .nu-view-all{ margin-top: 36px; }
}