.news-page {
    max-width: var(--max);
    margin: 0 auto;
    padding: 2rem 0 3rem
}

.news-featured {
    display: grid;
    grid-template-columns: 44% 1fr;
    min-height: 320px;
    overflow: hidden;
    border: 1px solid #d7e1ec;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 20px #092d550b
}

.news-featured__image,
.news-tile__image {
    position: relative;
    display: block;
    overflow: hidden;
    background: #dce6ed
}

.news-featured__image img,
.news-tile__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .28s ease
}

.news-featured__image:hover img,
.news-tile__image:hover img {
    transform: scale(1.035)
}

.news-featured__image>span,
.news-tile__image>span {
    position: absolute;
    top: .8rem;
    left: .8rem;
    border-radius: 5px;
    background: #edb500;
    color: #082e56;
    padding: .22rem .58rem;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase
}

.news-featured__body {
    display: flex;
    flex-direction: column;
    padding: 1.55rem 1.8rem
}

.news-meta {
    margin: 0 0 .55rem;
    color: #60738d;
    font-size: .76rem
}

.news-meta:first-letter {
    color: #e8ab00
}

.news-meta i {
    font-style: normal;
    margin: 0 .45rem
}

.news-featured h1 {
    font-size: clamp(1.55rem, 2.55vw, 2.25rem);
    max-width: 750px
}

.news-featured h1 a,
.news-tile h2 a {
    color: #073c77;
    text-decoration: none
}

.news-featured__body>p:not(.news-meta) {
    color: #62728a
}

.news-read {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: auto;
    color: #0c4b84;
    font-size: .83rem;
    font-weight: 800;
    text-decoration: none
}

.news-read span,
.news-tile__body div a b {
    display: grid;
    place-items: center;
    width: 32px;
    height: 28px;
    border: 1px solid #d9e3ee;
    border-radius: 6px;
    font-size: 1rem
}

.news-page__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 1.3rem 0 .85rem;
    padding-bottom: .45rem;
    border-bottom: 1px solid #d6e0ea
}

.news-page__heading h2 {
    margin: 0;
    color: #083c73;
    font-size: 1.15rem
}

.news-page__heading h2 span {
    color: #e8ab00
}

.news-page__heading a {
    border: 1px solid #d4dfe9;
    border-radius: 6px;
    padding: .22rem .6rem;
    color: #42536a;
    font-size: .72rem;
    text-decoration: none
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem
}

.news-tile {
    overflow: hidden;
    border: 1px solid #d9e2ec;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 5px 15px #092d5508
}

.news-tile__image {
    height: 146px
}

.news-tile__image>span {
    right: .7rem;
    left: auto;
    background: #0b5b91;
    color: #fff
}

.news-tile__body {
    padding: 1rem
}

.news-tile h2 {
    min-height: 3.55em;
    margin: .25rem 0 .45rem;
    font-size: 1.04rem
}

.news-tile__body>p:not(.news-meta) {
    display: -webkit-box;
    overflow: hidden;
    color: #64758c;
    font-size: .86rem;
    line-height: 1.45;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.news-tile__body div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: .7rem;
    border-top: 1px solid #dde5ed;
    color: #62738a;
    font-size: .75rem
}

.news-tile__body div a {
    display: flex;
    align-items: center;
    gap: .45rem;
    color: #0c4b84;
    font-weight: 800;
    text-decoration: none
}

.news-tile__body div a b {
    width: 25px;
    height: 23px
}

.news-page__footer {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #d7e1ea;
    color: #5f6f82;
    font-size: .82rem
}

.news-page__footer p {
    margin: 0
}

.news-page__footer a {
    color: #0756a0;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap
}

@media(max-width:1300px) {
    .news-page {
        margin-left: 1rem;
        margin-right: 1rem
    }
}

@media(max-width:800px) {
    .news-featured {
        grid-template-columns: 1fr
    }

    .news-featured__image {
        min-height: 220px
    }

    .news-grid {
        grid-template-columns: 1fr 1fr
    }

    .news-page__footer {
        display: block
    }

    .news-page__footer a {
        display: inline-block;
        margin-top: .7rem
    }
}

@media(max-width:520px) {
    .news-featured__body {
        padding: 1.25rem
    }

    .news-grid {
        grid-template-columns: 1fr
    }

    .news-tile__image {
        height: 185px
    }
}