.blog-section-title {
    margin: 2.5rem 0;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
 }
 
 .blog-header {
    margin-bottom: 4rem;
 }
 
 .blog-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
}

.blog-wrapper .article-box {
    height: 100%;
}

.blog-wrapper .article-box .article-container {
    display: flex;
    flex-direction: column;
    background-color: #f5f5f5;
    padding-bottom: 1.5rem;
    transition: 0.2s;
    height: 100% !important;
    -webkit-box-shadow: 8px 8px 20px -10px rgba(43, 43, 43, 1);
    -moz-box-shadow: 8px 8px 20px -10px rgba(43, 43, 43, 1);
    box-shadow: 8px 8px 20px -10px rgba(43, 43, 43, 1);
}

.blog-wrapper .article-box .article-container .image_wrapper {
    width: 100%;
    height: -moz-fit-content;
    height: fit-content;
}

.blog-wrapper .article-box .article-container .image_wrapper img {
    object-fit: cover;
    width: 100%;
}

.blog-wrapper .article-box .article-container .article-box_content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-inline: 2.4rem;
}

.blog-wrapper .article-box .article-container .article-box_button {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
    padding-bottom: 1.4rem;
    padding-right: 1.4rem;
}

.blog-wrapper .article-box .article-container .article-box_content .content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    max-height: -moz-fit-content;
    max-height: fit-content;
}

.blog-wrapper .article-box .article-container .article-box_content .content-wrapper .date-label {
    font-weight: 400;
    font-size: 0.8rem;
    color: #2b2a2b;
    background-color: #fff;
    text-transform: lowercase;
    border-radius: 2px;
    padding: .6rem;
    margin-top: 2.4rem;
    width: -moz-fit-content;
    width: fit-content;
}

.blog-wrapper .article-box .article-container .article-box_content .content-wrapper .title-label {
    font-size: 1.5rem;
    line-height: 2.4rem;
    font-weight: 500;
    color: #2b2a2b;
    margin-bottom: 0.4rem;
}

.blog-wrapper .article-box .article-container .article-box_content .content-wrapper .content-label {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: #2b2a2b;
}

@media only screen and (max-width: 1100px) {
    .blog-wrapper {
        grid-template-columns: 1fr 1fr;
    }
}

@media only screen and (max-width: 700px) {
    .blog-wrapper {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 3.5rem;
    }
}

.article-wrapper .article-header {
    margin: 3.8rem 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1.5px solid #eff0f0;
}

.article-wrapper .article-header .date-label {
    font-weight: 500;
    font-size: 0.8rem;
    line-height: 1.68rem;
    padding: .6rem;
    margin-bottom: .6rem;
    width: -moz-fit-content;
    width: fit-content;
    color: #2b2a2b;
    background-color: #f5f5f5;
    border-radius: 2px;
}

.article-wrapper .article-header .title-label {
    font-weight: 500;
    font-size: 2.2rem;
    line-height: 4.3rem;
    width: 100%;
    margin-bottom: 1.5rem;
}

.article-wrapper .article-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 6.4rem;
}

.article-wrapper .article-content .title-image {
    margin-bottom: 3.2rem;
    position: relative;
    aspect-ratio: 1 / 1;
    height: 48rem;
    width: 100%;
    max-width: 74rem;
}

@media only screen and (max-width: 1100px) {
    .article-wrapper .article-content .title-image {
        margin-bottom: 4rem;
        height: 46rem;
        width: 100%;
    }
}

@media only screen and (max-width: 700px) {
    .article-wrapper .article-content .title-image {
        height: 27rem;
        width: 100%;
    }
}

.article-wrapper .article-content .title-image img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.article-wrapper .article-content .article-text {
    width: 100%;
    max-width: 74rem;
    display: flex;
    flex-direction: column;
}

.article-wrapper .article-content .article-text img {
    width: 100%;
    height: auto;
    max-width: 45rem;
    max-height: 45rem;
}

.article-wrapper .article-content .article-text li {
    white-space: normal !important;
    font-size: 12pt !important;
}

.article-wrapper .article-content .article-text p, .article-wrapper .article-content .article-text span {
    font-size: 12pt !important;
}

.article-wrapper .article-content .article-text h3 span {
    font-size: 1.125rem !important;
}