@media (max-width: 1300px) {
    .article, .article-hero {
        width: 90%;
        max-width: none;
    }
}
@media (max-width: 950px) {
    .article-content-wrapper {
        flex-direction: column;
        gap: 1rem;
    }
    .article-share-icons {
        flex-direction: row;
    }
    .article-share-items {
        gap: .5rem;
        position: static;
    }
    .article-content * {
        max-width: none;
    }
}
@media (max-width: 720px) {
    .read-more-boxes {
        flex-direction: column;
    }
    .read-more-box {
        display: flex;
        gap: 1rem;
    }
    .read-more-link {
        width: 100%;
    }
    .read-more-box-img {
        max-width: 200px;
        max-height: 200px;
        min-width: 200px;
    }
}
@media (max-width: 500px) {
    .article-header-text {
        font-size: 35px;
    }
    .article-hero  {
        width: 100%;
    }
    .aritcle-info, .article-header {
        width: 90%;
    }
    .aritcle-info {
        align-items: center;
        justify-content: center;
    }
    .article-content h2 {
        font-size: 30px;
    }
    .article-content h3 {
        font-size: 24px;
    }
    .article-content h4 {
        font-size: 19px;
    }
    .article-img-wrapper, .image-wrapper, .blog-text-img-wrapper {
        height: 300px;
    }
    .bread-crumbs {
        font-size: 13px;
    }
    .bread-crumbs img {
        width: 4px;
        height: auto;
    }
    .article-cta-options {
        flex-direction: column;
    }
    .article-cta-header {
        font-size: 25px !important;
    }
    .read-more-box-img {
        max-width: 150px;
        max-height: 150px;
        min-width: 150px;
    }
    .read-more-box-title {
        font-size: 16px !important;
    }
    .read-more-box-topic {
        font-size: 13px !important;
    }
}
@media (max-width: 470px) {
    .aritcle-info {
        font-size: 14px;
        gap: .7rem;
    }
}
@media (max-width: 355px) {
    .article-img-wrapper, .image-wrapper, .blog-text-img-wrapper {
        height: 200px;
    }
    .read-more-box-img {
        max-width: 120px;
        max-height: 120px;
        min-width: 120px;
    }
    .read-more-box-topic {
        font-size: 12px !important;
    }
}