.scroll-thumb {
    height: calc(100% / 4);
}

#landingSection {
    background-image: url(../assets/Phase1_Images/Main_Page_Headers/Insights.jpg);
}

#menu .icon {
    margin-right: unset;
}

.articles-section {
    box-sizing: border-box;
}

.articles-container {
    padding: 0 6%;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.articles-row {
    width: 100%;
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    gap: 16px;
}

.article {
    width: 100%;
    max-width: unset;
    max-height: unset;
    aspect-ratio: unset;
    height: 37.5vh;
}

.article .section-subheading {
    font-weight: 500;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0%;
}

.article .section-headline {
    font-weight: 800;
    font-size: 32px;
    line-height: 48px;
    letter-spacing: 0%;
}

.article.hidden {
    opacity: 0;
    cursor: unset;
    user-select: none;
}

#scrollLine {
    margin-top: 6px;
    width: 0px;
    height: 15px;
    max-height: 20px;
}

@media only screen and (max-height: 650px) {
    .article {
        padding: 18px;
    }

    .article .section-headline {
        font-size: 32px;
        line-height: 36px;
    }
}

@media only screen and (max-width: 800px) and (orientation: portrait) {
    .articles-section {
        padding: 30% 0;
    }

    .articles-container {
        padding: 45px 5% 0;
        height: 85%;
        align-content: center;
        gap: 8px;
    }

    .articles-row {
        /* display: none; */
        flex-direction: column;
        gap: 8px;
    }

    .article {
        height: 25%;
    }

    .article .section-subheading {
        font-size: 20px;
        line-height: 20px;
    }

    .section-underline {
        margin: 8px 0 16px;
    }

    .article .section-headline {
        font-size: 24px;
        line-height: 28px;
    }

    .article-read-more {
        display: none;
    }
}

@media only screen and (max-width: 500px) {
    .article .section-subheading {
        font-size: 18px;
        line-height: 18px;
    }

    .article .section-headline {
        font-size: 18px;
        line-height: 20px;
    }
}

@media only screen and (max-width: 1000px) and (orientation: landscape) {
    .articles-section {
        padding: 50% 0;
    }
}

@media only screen and (max-width: 400px) and (orientation: portrait) {
    .article .section-subheading {
        font-size: 14px;
        line-height: 14px;
    }

    .article .section-headline {
        font-size: 12px;
        line-height: 16px;
    }

    .section-underline {
        margin: 6px 0 12px;
    }
}

@media only screen and (max-height: 500px) and (orientation: landscape) {
    .articles-section {
        padding: unset;
        padding-top: 60px;
    }

    .article .section-subheading {
        font-size: 18px;
        line-height: 24px;
    }

    .article .section-headline {
        font-size: 20px;
        line-height: 24px;
        -webkit-line-clamp: 2;
    }
}