.underline {
    border: 4px solid var(--secondary-color) !important;
}

.achievement {
    max-width: 180px;
    max-height: 320px;
    width: 162px;
    height: 290px;
}

.splide__slide img {
    width: 100%;
    border-radius: 10%;
    height: auto;
}

.is-active {
    width: 50% !important;
    height: 283px;
}

.The-Difference-We-Make {
    /* Gradient from top to bottom */
    background: linear-gradient(to bottom, #FFE6A1, #F7C948);
    height: auto;
    margin: 0;
}

.fs-50 {
    font-size: 50px;
}

.fs-25 {
    font-size: 25px;
}

.fs-35 {
    font-size: 35px;
}

.fs-48 {
    font-size: 48px;
}

.fs-40 {
    font-size: 40px;
}

.fs-18 {
    font-size: 18px;
}

.fs-20 {
    font-size: 20px;
}

.fs-22 {
    font-size: 22px;
}

.border-radius-33 {
    border-radius: 33px;
}

.program-updates-bg {
    background-color: #1A2B48;
}

.bg-modal {
    background-color: #F7C948;
}

.carousel-updates img {
    width: 100%;
    height: 200px;
    /* fixed card image height */
    object-fit: cover;
    /* crop nicely */
    border-radius: 8px;
}

.carousel-modal img {
    width: 100%;
    max-height: 100%;
    min-height: 300px;
    object-fit: cover;
    margin: 0 auto;
}

/* PARTNERS LIST */
.partners-list {
    max-height: calc(15 * 2.5rem);
    overflow-y: auto;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    list-style-type: disc !important;
    list-style-position: inside !important;

    padding-left: 0 !important;
    margin: 0 !important;
    row-gap: 0.75rem;
}

/* FORCE BULLET VISIBILITY */
.partners-list li::marker {
    color: #fff !important;
    font-size: 1rem;
}

/* LIST ITEM */
.partner-item {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 0.95rem;
}

.partner-item::before {
    content: "•";
    margin-right: 0.5rem;
    color: #fff;
}


:root {
    --sticky-nav-height: 7.5rem;
    /* approximate height of your nav */
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--sticky-nav-height);
    /* space for sticky nav */
}

/* Optional: if nav height changes responsively */
@media (max-width: 768px) {
    :root {
        --sticky-nav-height: 80px;
        /* smaller nav on mobile */
    }
}