.news-list{

    .news-card_learn-more{
        color: $c-5 !important;
        display: flex;
        align-self: end;
        font-size: $fs-18;
        font-weight: $fw-bold;
        align-items: center;
        gap: 24px;
    }

    h2{
        font-size: $fs-48;
        margin-bottom: 40px;
        text-align: center;

        @include sm{
            font-size: $fs-32;
        }
    }

    .news-card{
        
        margin-top: 24px;
        overflow: hidden;
        transition: transform 0.3s ease-in-out;
        border-radius: 12px;

        background-color: $c-4;
        &__text{
            padding: 16px 16px 24px 16px;
            
        }

        &__date{
            font-size: $fs-16 !important;
            font-weight: $fw-light;
        }   

        h4{
            font-size: $fs-24;
            line-height: 1.2;
        }

        .gap{
            gap: 16px;
        }

        &:hover{
            cursor: pointer;
            
            h4{
                color: $c-5;
            }
            
            img{
                transform: scale(1.08);
            }
        }
       
    }

    img{
        width: 100%;
        height: 238px;
        object-fit: cover;
        object-position: center;
        border-radius: 12px 12px 0 0;
        transition: transform 0.3s ease-in-out;
    }

    a{
        text-decoration: none;
        color: black;
    }

    .flex{
        display: flex;
        flex-direction: column;
        @include xs{
            flex-direction: column;
        }
    }
}

.single-article {
    margin: rem(80px 0);
}