/*
|--------------------------------------------------------------------------
| MUSAFIRCAB-V3.4-SMART-BLOG-TRAVEL-GUIDE-OS-SAFE
|--------------------------------------------------------------------------
*/


.mc34-page{

    --mc34-navy:#071c31;
    --mc34-navy2:#0c304e;
    --mc34-red:#ed1c24;
    --mc34-red-dark:#c9141b;
    --mc34-text:#172033;
    --mc34-body:#526071;
    --mc34-muted:#7a8795;
    --mc34-line:#e2e8ee;
    --mc34-soft:#f6f8fb;
    --mc34-red-soft:#fff3f3;
    --mc34-green:#1ca665;

    color:
        var(--mc34-text);

    font-family:
        Inter,
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;

}


.mc34-page *,
.mc34-page *::before,
.mc34-page *::after{

    box-sizing:border-box;

}


.mc34-shell{

    width:min(
        1220px,
        calc(100% - 32px)
    );

    margin-inline:auto;

}


.mc34-detail-shell{

    width:min(
        1120px,
        calc(100% - 32px)
    );

    margin-inline:auto;

}


.mc34-eyebrow{

    display:block;

    margin-bottom:7px;

    color:
        var(--mc34-red);

    font-size:10px;

    line-height:1.2;

    font-weight:900;

    letter-spacing:.11em;

    text-transform:uppercase;

}


/* ================================================================
   BREADCRUMBS
   ================================================================ */

.mc34-breadcrumb{

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    gap:7px;

    margin-bottom:22px;

    color:
        rgba(255,255,255,.6);

    font-size:10px;

}


.mc34-breadcrumb a{

    color:
        rgba(255,255,255,.84);

    text-decoration:none;

}


/* ================================================================
   BLOG HUB HERO
   ================================================================ */

.mc34-blog-hero{

    position:relative;

    overflow:hidden;

    padding:
        36px 0 45px;

    background:

        radial-gradient(
            circle at 88% 3%,
            rgba(237,28,36,.17),
            transparent 27%
        ),

        linear-gradient(
            135deg,
            #061a2d,
            #0b304e
        );

}


.mc34-blog-hero-grid{

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        220px;

    gap:55px;

    align-items:end;

}


.mc34-blog-hero h1{

    max-width:800px;

    margin:
        0 0 14px!important;

    color:#fff!important;

    font-size:
        clamp(
            37px,
            4.6vw,
            57px
        )!important;

    line-height:1.04!important;

    font-weight:900!important;

    letter-spacing:-.045em!important;

}


.mc34-blog-hero p{

    max-width:790px;

    margin:0;

    color:
        rgba(255,255,255,.76);

    font-size:14px;

    line-height:1.75;

}


.mc34-blog-hero .mc34-eyebrow{

    color:#ff9195;

}


.mc34-library-count{

    padding:21px;

    border:
        1px solid
        rgba(255,255,255,.14);

    border-radius:15px;

    background:
        rgba(255,255,255,.07);

}


.mc34-library-count small,
.mc34-library-count strong,
.mc34-library-count span{

    display:block;

}


.mc34-library-count small{

    color:
        rgba(255,255,255,.57);

    font-size:9px;

    font-weight:850;

    text-transform:uppercase;

    letter-spacing:.07em;

}


.mc34-library-count strong{

    margin:
        6px 0 2px;

    color:#fff;

    font-size:38px;

    line-height:1;

    font-weight:900;

}


.mc34-library-count span{

    color:
        rgba(255,255,255,.7);

    font-size:9px;

}


/* ================================================================
   TOPICS
   ================================================================ */

.mc34-topic-strip{

    border-bottom:
        1px solid
        var(--mc34-line);

    background:#fff;

}


.mc34-topic-scroll{

    min-height:65px;

    display:flex;

    align-items:center;

    gap:7px;

    overflow-x:auto;

    scrollbar-width:none;

}


.mc34-topic-scroll::-webkit-scrollbar{

    display:none;

}


.mc34-topic-scroll a{

    flex:0 0 auto;

    min-height:34px;

    display:flex;

    align-items:center;

    padding:
        0 12px;

    border:
        1px solid
        #dce3e9;

    border-radius:999px;

    color:#435063;

    text-decoration:none;

    font-size:10px;

    font-weight:800;

}


.mc34-topic-scroll a:hover,
.mc34-topic-scroll a.active{

    border-color:
        var(--mc34-red);

    background:
        var(--mc34-red-soft);

    color:
        var(--mc34-red);

}


/* ================================================================
   BLOG CONTENT
   ================================================================ */

.mc34-blog-content{

    padding:
        28px 0 65px;

    background:
        var(--mc34-soft);

}


/* ================================================================
   SEARCH
   ================================================================ */

.mc34-searchbar{

    display:grid;

    grid-template-columns:
        minmax(250px,1fr)
        190px
        auto
        auto;

    gap:8px;

    align-items:center;

    margin-bottom:22px;

    padding:13px;

    border:
        1px solid
        var(--mc34-line);

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 6px 20px
        rgba(16,24,40,.04);

}


.mc34-search-input{

    position:relative;

}


.mc34-search-input > span{

    position:absolute;

    left:12px;

    top:50%;

    transform:
        translateY(-50%);

    color:#98a2b3;

    font-size:16px;

}


.mc34-searchbar input,
.mc34-searchbar select{

    width:100%;

    min-height:44px;

    border:
        1px solid
        #d8e0e7;

    border-radius:9px;

    background:#fff;

    color:#344054;

    font:inherit;

    font-size:11px;

    outline:0;

}


.mc34-searchbar input{

    padding:
        0 12px 0 35px;

}


.mc34-searchbar select{

    padding:
        0 10px;

}


.mc34-searchbar input:focus,
.mc34-searchbar select:focus{

    border-color:
        rgba(237,28,36,.58);

    box-shadow:
        0 0 0 3px
        rgba(237,28,36,.06);

}


.mc34-searchbar button{

    min-height:44px;

    padding:
        0 15px;

    border:0;

    border-radius:9px;

    background:
        var(--mc34-red);

    color:#fff;

    font-size:10px;

    font-weight:900;

    cursor:pointer;

}


.mc34-reset{

    color:#667085;

    text-decoration:none;

    font-size:9px;

    font-weight:800;

}


/* ================================================================
   FEATURED
   ================================================================ */

.mc34-featured{

    overflow:hidden;

    display:grid;

    grid-template-columns:
        minmax(0,1.18fr)
        minmax(0,.82fr);

    margin-bottom:28px;

    border:
        1px solid
        #dfe6ec;

    border-radius:18px;

    background:#fff;

    box-shadow:
        0 10px 30px
        rgba(16,24,40,.06);

}


.mc34-featured-image{

    position:relative;

    min-height:380px;

    display:block;

    overflow:hidden;

    background:#e8edf1;

}


.mc34-featured-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

}


.mc34-featured-image > span{

    position:absolute;

    top:16px;

    left:16px;

    min-height:30px;

    display:flex;

    align-items:center;

    padding:
        0 10px;

    border-radius:999px;

    background:
        rgba(255,255,255,.94);

    color:
        var(--mc34-red);

    font-size:8px;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:.06em;

}


.mc34-featured-copy{

    display:flex;

    flex-direction:column;

    justify-content:center;

    padding:
        34px;

}


.mc34-meta{

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    gap:6px;

    color:#84909c;

    font-size:9px;

    font-weight:700;

}


.mc34-meta i{

    color:#c3cbd3;

    font-style:normal;

}


.mc34-featured-copy h2{

    margin:
        13px 0 12px!important;

    font-size:
        clamp(
            27px,
            3vw,
            38px
        )!important;

    line-height:1.15!important;

    font-weight:900!important;

    letter-spacing:-.035em!important;

}


.mc34-featured-copy h2 a{

    color:#0c2237!important;

    text-decoration:none!important;

}


.mc34-featured-copy p{

    margin:
        0 0 19px;

    color:#667085;

    font-size:12px;

    line-height:1.75;

}


.mc34-read-feature{

    width:max-content;

    min-height:41px;

    display:inline-flex;

    align-items:center;

    padding:
        0 14px;

    border-radius:8px;

    background:
        var(--mc34-red);

    color:#fff!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:900;

}


/* ================================================================
   MAIN LAYOUT
   ================================================================ */

.mc34-blog-layout{

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        280px;

    gap:30px;

    align-items:start;

}


.mc34-section-head{

    display:flex;

    align-items:end;

    justify-content:space-between;

    gap:18px;

    margin-bottom:15px;

}


.mc34-section-head h2{

    margin:0!important;

    color:#10283e!important;

    font-size:27px!important;

    line-height:1.2!important;

    font-weight:900!important;

    letter-spacing:-.03em!important;

}


.mc34-results{

    flex:0 0 auto;

    color:#7a8795;

    font-size:9px;

    font-weight:750;

}


/* ================================================================
   BLOG CARDS
   ================================================================ */

.mc34-blog-grid{

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:16px;

}


.mc34-blog-card{

    overflow:hidden;

    border:
        1px solid
        #dde5eb;

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 6px 19px
        rgba(16,24,40,.045);

    transition:
        transform .18s ease,
        box-shadow .18s ease;

}


.mc34-blog-card:hover{

    transform:
        translateY(-3px);

    box-shadow:
        0 14px 32px
        rgba(16,24,40,.08);

}


.mc34-blog-card-image{

    position:relative;

    aspect-ratio:
        16 / 9.5;

    display:block;

    overflow:hidden;

    background:#e8edf1;

}


.mc34-blog-card-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform .3s ease;

}


.mc34-blog-card:hover
.mc34-blog-card-image img{

    transform:
        scale(1.025);

}


.mc34-blog-card-image span{

    position:absolute;

    left:10px;

    bottom:10px;

    min-height:27px;

    display:flex;

    align-items:center;

    padding:
        0 9px;

    border-radius:999px;

    background:
        rgba(7,28,49,.88);

    color:#fff;

    font-size:8px;

    font-weight:850;

}


.mc34-blog-card-body{

    padding:15px;

}


.mc34-blog-card h3{

    margin:
        8px 0!important;

    font-size:16px!important;

    line-height:1.4!important;

    font-weight:850!important;

    letter-spacing:-.015em!important;

}


.mc34-blog-card h3 a{

    color:#172b40!important;

    text-decoration:none!important;

}


.mc34-blog-card h3 a:hover{

    color:
        var(--mc34-red)!important;

}


.mc34-blog-card p{

    min-height:53px;

    margin:
        0 0 11px;

    color:#6e7a88;

    font-size:10.5px;

    line-height:1.65;

}


.mc34-card-read{

    color:
        var(--mc34-red)!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:900;

}


/* ================================================================
   SIDEBAR
   ================================================================ */

.mc34-sidebar{

    position:sticky;

    top:
        calc(
            var(
                --mc311c-header-height,
                110px
            )
            +
            16px
        );

    display:grid;

    gap:13px;

}


.mc34-side-card{

    padding:17px;

    border:
        1px solid
        var(--mc34-line);

    border-radius:13px;

    background:#fff;

}


.mc34-side-card h3{

    margin:
        0 0 10px!important;

    color:#10283e!important;

    font-size:14px!important;

    font-weight:900!important;

}


.mc34-side-card nav{

    display:grid;

}


.mc34-side-card nav a{

    min-height:38px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:8px;

    border-bottom:
        1px solid
        #edf1f4;

    color:#435063;

    text-decoration:none;

    font-size:10px;

    font-weight:750;

}


.mc34-side-card nav a:last-child{

    border-bottom:0;

}


.mc34-side-card nav b{

    color:
        var(--mc34-red);

}


.mc34-recent-list{

    display:grid;

}


.mc34-recent-list a{

    padding:
        10px 0;

    border-bottom:
        1px solid
        #edf1f4;

    text-decoration:none;

}


.mc34-recent-list a:last-child{

    border-bottom:0;

}


.mc34-recent-list strong,
.mc34-recent-list small{

    display:block;

}


.mc34-recent-list strong{

    color:#344054;

    font-size:10px;

    line-height:1.45;

    font-weight:800;

}


.mc34-recent-list small{

    margin-top:3px;

    color:#98a2b3;

    font-size:8px;

}


.mc34-category-list{

    display:grid;

}


.mc34-category-list a{

    min-height:36px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    border-bottom:
        1px solid
        #edf1f4;

    color:#435063;

    text-decoration:none;

    font-size:10px;

}


.mc34-category-list a:last-child{

    border:0;

}


.mc34-category-list b{

    min-width:24px;

    height:21px;

    display:grid;

    place-items:center;

    border-radius:999px;

    background:#f1f4f7;

    color:#667085;

    font-size:8px;

}


.mc34-side-cta{

    padding:19px;

    border-radius:13px;

    background:
        linear-gradient(
            145deg,
            #071c31,
            #0e3657
        );

}


.mc34-side-cta span{

    color:#ff9397;

    font-size:8px;

    font-weight:850;

}


.mc34-side-cta h3{

    margin:
        5px 0 8px!important;

    color:#fff!important;

    font-size:18px!important;

    line-height:1.3!important;

    font-weight:900!important;

}


.mc34-side-cta p{

    margin:
        0 0 13px;

    color:
        rgba(255,255,255,.69);

    font-size:9.5px;

    line-height:1.6;

}


.mc34-side-cta a{

    color:#60dfa5!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:900;

}


/* ================================================================
   EMPTY
   ================================================================ */

.mc34-empty{

    padding:
        65px 20px;

    border:
        1px dashed
        #cfd8e0;

    border-radius:14px;

    background:#fff;

    text-align:center;

}


.mc34-empty strong{

    display:block;

    color:#172b40;

    font-size:18px;

}


.mc34-empty p{

    color:#667085;

    font-size:11px;

}


.mc34-empty a{

    display:inline-flex;

    min-height:40px;

    align-items:center;

    padding:
        0 13px;

    border-radius:8px;

    background:
        var(--mc34-red);

    color:#fff!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:900;

}


/* ================================================================
   PAGINATION
   ================================================================ */

.mc34-pagination{

    margin-top:28px;

}


.mc34-pagination nav > div:first-child{

    display:none!important;

}


.mc34-pagination nav > div:last-child{

    display:flex!important;

    align-items:center;

    justify-content:space-between;

    gap:12px;

}


.mc34-pagination nav span,
.mc34-pagination nav a{

    font-size:10px!important;

}


/* ================================================================
   BLOG HUB BOTTOM CTA
   ================================================================ */

.mc34-blog-bottom-cta{

    padding:
        37px 0;

    background:
        linear-gradient(
            135deg,
            #071c31,
            #0c3556
        );

}


.mc34-blog-bottom-cta
.mc34-shell{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

}


.mc34-blog-bottom-cta span{

    color:#ff9699;

    font-size:8px;

    font-weight:900;

}


.mc34-blog-bottom-cta h2{

    margin:
        4px 0!important;

    color:#fff!important;

    font-size:27px!important;

    line-height:1.2!important;

    font-weight:900!important;

}


.mc34-blog-bottom-cta p{

    margin:0;

    color:
        rgba(255,255,255,.67);

    font-size:10px;

}


.mc34-blog-bottom-cta
.mc34-shell > div:last-child{

    display:flex;

    gap:8px;

    flex:0 0 auto;

}


.mc34-blog-bottom-cta a{

    min-height:43px;

    display:flex;

    align-items:center;

    padding:
        0 14px;

    border:
        1px solid
        rgba(255,255,255,.25);

    border-radius:8px;

    color:#fff!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:850;

}


.mc34-blog-bottom-cta a.primary{

    border-color:
        var(--mc34-red);

    background:
        var(--mc34-red);

}


/* ================================================================
   DETAIL HERO
   ================================================================ */

.mc34-detail-hero{

    padding:
        34px 0 43px;

    background:

        radial-gradient(
            circle at 90% 5%,
            rgba(237,28,36,.16),
            transparent 26%
        ),

        linear-gradient(
            135deg,
            #061a2d,
            #0c304e
        );

}


.mc34-detail-category{

    width:max-content;

    min-height:29px;

    display:flex;

    align-items:center;

    padding:
        0 10px;

    margin-bottom:13px;

    border:
        1px solid
        rgba(255,255,255,.16);

    border-radius:999px;

    background:
        rgba(255,255,255,.07);

    color:#ff9da1;

    font-size:8px;

    font-weight:900;

    text-transform:uppercase;

    letter-spacing:.06em;

}


.mc34-detail-hero h1{

    max-width:940px;

    margin:
        0 0 14px!important;

    color:#fff!important;

    font-size:
        clamp(
            38px,
            5vw,
            61px
        )!important;

    line-height:1.04!important;

    font-weight:900!important;

    letter-spacing:-.045em!important;

}


.mc34-detail-intro{

    max-width:820px;

    margin:
        0 0 19px;

    color:
        rgba(255,255,255,.73);

    font-size:13px;

    line-height:1.75;

}


.mc34-detail-meta{

    display:flex;

    flex-wrap:wrap;

    gap:7px;

}


.mc34-detail-meta span{

    min-height:30px;

    display:flex;

    align-items:center;

    padding:
        0 9px;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:7px;

    background:
        rgba(255,255,255,.05);

    color:
        rgba(255,255,255,.78);

    font-size:8px;

    font-weight:750;

}


/* ================================================================
   DETAIL IMAGE
   ================================================================ */

.mc34-detail-media{

    padding:
        30px 0 0;

    background:#fff;

}


.mc34-detail-media figure{

    overflow:hidden;

    margin:0;

    border-radius:17px;

    background:#e9edf2;

}


.mc34-detail-media img{

    width:100%;

    max-height:620px;

    display:block;

    object-fit:cover;

    aspect-ratio:
        16 / 8.5;

}


/* ================================================================
   ARTICLE
   ================================================================ */

.mc34-article-section{

    padding:
        40px 0 68px;

    background:#fff;

}


.mc34-article-layout{

    display:grid;

    grid-template-columns:
        230px
        minmax(0,760px);

    gap:44px;

    justify-content:center;

    align-items:start;

}


.mc34-article-side{

    position:sticky;

    top:
        calc(
            var(
                --mc311c-header-height,
                110px
            )
            +
            16px
        );

    display:grid;

    gap:13px;

}


.mc34-toc{

    overflow:hidden;

    border:
        1px solid
        var(--mc34-line);

    border-radius:12px;

    background:#fff;

}


.mc34-toc-head{

    min-height:47px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:
        0 13px;

    border-bottom:
        1px solid
        #e8edf1;

}


.mc34-toc-head span{

    color:#172b40;

    font-size:10px;

    font-weight:900;

}


.mc34-toc-head button{

    width:28px;

    height:28px;

    border:
        1px solid
        #dce3e9;

    border-radius:7px;

    background:#fff;

    color:#344054;

    cursor:pointer;

}


.mc34-toc nav{

    max-height:460px;

    overflow:auto;

    padding:8px;

}


.mc34-toc nav.hidden{

    display:none;

}


.mc34-toc nav a{

    display:block;

    padding:
        7px 8px;

    border-radius:6px;

    color:#667085;

    text-decoration:none;

    font-size:9px;

    line-height:1.4;

}


.mc34-toc nav a.level-3{

    padding-left:17px;

    font-size:8.5px;

}


.mc34-toc nav a:hover,
.mc34-toc nav a.active{

    background:
        var(--mc34-red-soft);

    color:
        var(--mc34-red);

}


.mc34-toc-loading{

    display:block;

    padding:8px;

    color:#98a2b3;

    font-size:9px;

}


.mc34-article-help{

    padding:15px;

    border-radius:12px;

    background:#f5f8fb;

}


.mc34-article-help span,
.mc34-article-help strong{

    display:block;

}


.mc34-article-help span{

    color:#7b8794;

    font-size:8px;

}


.mc34-article-help strong{

    margin:
        4px 0 9px;

    color:#172b40;

    font-size:11px;

    line-height:1.4;

}


.mc34-article-help a{

    color:
        var(--mc34-red)!important;

    text-decoration:none!important;

    font-size:8.5px;

    font-weight:900;

}


/* ================================================================
   ARTICLE CONTENT NORMALISATION
   ================================================================ */

.mc34-article-content{

    min-width:0;

    color:#344054;

    font-family:
        Inter,
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif!important;

    font-size:16px;

    line-height:1.82;

}


.mc34-article-content *{

    max-width:100%;

}


.mc34-article-content span,
.mc34-article-content p,
.mc34-article-content li,
.mc34-article-content strong,
.mc34-article-content b,
.mc34-article-content em{

    font-family:inherit!important;

}


.mc34-article-content p{

    margin:
        0 0 19px!important;

    color:#445365!important;

    font-size:16px!important;

    line-height:1.82!important;

}


.mc34-article-content h2{

    margin:
        39px 0 14px!important;

    padding-top:5px;

    color:#10283e!important;

    font-family:inherit!important;

    font-size:
        clamp(
            25px,
            3vw,
            32px
        )!important;

    line-height:1.23!important;

    font-weight:900!important;

    letter-spacing:-.025em!important;

}


.mc34-article-content h3{

    margin:
        28px 0 10px!important;

    color:#19364f!important;

    font-family:inherit!important;

    font-size:
        clamp(
            19px,
            2.2vw,
            23px
        )!important;

    line-height:1.32!important;

    font-weight:850!important;

}


.mc34-article-content h4{

    margin:
        23px 0 9px!important;

    color:#263f56!important;

    font-family:inherit!important;

    font-size:18px!important;

    font-weight:850!important;

}


.mc34-article-content ul,
.mc34-article-content ol{

    margin:
        0 0 21px!important;

    padding-left:24px!important;

}


.mc34-article-content li{

    margin-bottom:8px!important;

    color:#445365!important;

    font-size:15px!important;

    line-height:1.7!important;

}


.mc34-article-content a{

    color:
        #c8181e!important;

    text-decoration:
        underline!important;

    text-decoration-thickness:
        1px!important;

    text-underline-offset:
        2px!important;

}


.mc34-article-content img{

    width:auto;

    height:auto;

    display:block;

    margin:
        25px auto;

    border-radius:12px;

}


.mc34-article-content blockquote{

    margin:
        25px 0!important;

    padding:
        18px 20px!important;

    border-left:
        4px solid
        var(--mc34-red)!important;

    border-radius:
        0 10px 10px 0;

    background:#f8fafc;

    color:#344054;

}


.mc34-article-content table{

    width:100%!important;

    display:block;

    overflow-x:auto;

    margin:
        24px 0!important;

    border-collapse:collapse;

}


.mc34-article-content th,
.mc34-article-content td{

    padding:
        10px 12px!important;

    border:
        1px solid
        #dde5eb!important;

    font-size:13px!important;

}


/* ================================================================
   ARTICLE END
   ================================================================ */

.mc34-article-end{

    margin-top:42px;

    padding:25px;

    border-radius:15px;

    background:
        linear-gradient(
            135deg,
            #071c31,
            #103b5c
        );

}


.mc34-article-end > span{

    color:#ff979b;

    font-size:8px;

    font-weight:900;

}


.mc34-article-end h2{

    margin:
        5px 0 7px!important;

    color:#fff!important;

    font-size:23px!important;

    line-height:1.3!important;

    font-weight:900!important;

}


.mc34-article-end p{

    margin:
        0 0 14px;

    color:
        rgba(255,255,255,.68);

    font-size:10px;

}


.mc34-article-end > div{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

}


.mc34-article-end a{

    min-height:39px;

    display:flex;

    align-items:center;

    padding:
        0 12px;

    border:
        1px solid
        rgba(255,255,255,.25);

    border-radius:8px;

    color:#fff!important;

    text-decoration:none!important;

    font-size:8.5px;

    font-weight:850;

}


.mc34-article-end a.primary{

    border-color:
        var(--mc34-red);

    background:
        var(--mc34-red);

}


/* ================================================================
   RELATED
   ================================================================ */

.mc34-related{

    padding:
        56px 0;

    background:
        var(--mc34-soft);

}


.mc34-related
.mc34-section-head > a{

    color:
        var(--mc34-red);

    text-decoration:none;

    font-size:9px;

    font-weight:900;

}


.mc34-related-grid{

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    gap:13px;

}


.mc34-related-grid article{

    overflow:hidden;

    border:
        1px solid
        var(--mc34-line);

    border-radius:12px;

    background:#fff;

}


.mc34-related-grid article > a{

    display:block;

}


.mc34-related-grid img{

    width:100%;

    aspect-ratio:
        16 / 9;

    display:block;

    object-fit:cover;

}


.mc34-related-grid article > div{

    padding:13px;

}


.mc34-related-grid span{

    color:#8a96a3;

    font-size:8px;

}


.mc34-related-grid h3{

    margin:
        5px 0 9px!important;

    font-size:12px!important;

    line-height:1.45!important;

    font-weight:850!important;

}


.mc34-related-grid h3 a{

    color:#263b50!important;

    text-decoration:none!important;

}


.mc34-related-read{

    color:
        var(--mc34-red)!important;

    text-decoration:none!important;

    font-size:8px;

    font-weight:900;

}


/* ================================================================
   DETAIL BOTTOM
   ================================================================ */

.mc34-detail-bottom{

    padding:
        34px 0;

    background:
        var(--mc34-navy);

}


.mc34-detail-bottom
.mc34-detail-shell{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

}


.mc34-detail-bottom span{

    color:#ff989c;

    font-size:8px;

    font-weight:900;

}


.mc34-detail-bottom h2{

    margin:
        4px 0 0!important;

    color:#fff!important;

    font-size:24px!important;

    font-weight:900!important;

}


.mc34-detail-bottom a{

    min-height:42px;

    display:flex;

    align-items:center;

    padding:
        0 14px;

    border-radius:8px;

    background:
        var(--mc34-red);

    color:#fff!important;

    text-decoration:none!important;

    font-size:9px;

    font-weight:900;

}


/* ================================================================
   TABLET
   ================================================================ */

@media(
    max-width:1000px
){

    .mc34-blog-layout{

        grid-template-columns:1fr;

    }


    .mc34-sidebar{

        position:static;

        grid-template-columns:
            1fr
            1fr;

    }


    .mc34-article-layout{

        grid-template-columns:1fr;

        gap:24px;

    }


    .mc34-article-side{

        position:static;

        grid-template-columns:
            1fr
            1fr;

    }


    .mc34-related-grid{

        grid-template-columns:
            1fr
            1fr;

    }

}


/* ================================================================
   MOBILE
   ================================================================ */

@media(
    max-width:767px
){

    .mc34-shell,
    .mc34-detail-shell{

        width:
            calc(
                100% - 22px
            );

    }


    .mc34-blog-hero{

        padding:
            22px 0 29px;

    }


    .mc34-blog-hero-grid{

        grid-template-columns:1fr;

        gap:0;

    }


    .mc34-blog-hero h1{

        font-size:
            clamp(
                31px,
                9vw,
                41px
            )!important;

    }


    .mc34-blog-hero p{

        font-size:12px;

    }


    .mc34-library-count{

        display:none;

    }


    .mc34-topic-scroll{

        min-height:57px;

    }


    .mc34-searchbar{

        grid-template-columns:1fr;

        padding:11px;

    }


    .mc34-searchbar button{

        width:100%;

    }


    .mc34-featured{

        grid-template-columns:1fr;

        border-radius:14px;

    }


    .mc34-featured-image{

        min-height:230px;

    }


    .mc34-featured-copy{

        padding:20px;

    }


    .mc34-featured-copy h2{

        font-size:
            27px!important;

    }


    .mc34-blog-grid{

        grid-template-columns:1fr;

        gap:12px;

    }


    .mc34-blog-card{

        display:grid;

        grid-template-columns:
            125px
            1fr;

    }


    .mc34-blog-card-image{

        height:100%;

        aspect-ratio:auto;

    }


    .mc34-blog-card-body{

        padding:12px;

    }


    .mc34-blog-card h3{

        font-size:13px!important;

    }


    .mc34-blog-card p{

        display:none;

    }


    .mc34-sidebar{

        grid-template-columns:1fr;

    }


    .mc34-blog-bottom-cta
    .mc34-shell{

        display:block;

    }


    .mc34-blog-bottom-cta h2{

        font-size:23px!important;

    }


    .mc34-blog-bottom-cta p{

        margin-bottom:14px;

    }


    .mc34-blog-bottom-cta
    .mc34-shell > div:last-child{

        display:grid;

        grid-template-columns:
            1fr
            1fr;

    }


    .mc34-blog-bottom-cta a{

        justify-content:center;

    }


    .mc34-detail-hero{

        padding:
            22px 0 29px;

    }


    .mc34-detail-hero h1{

        font-size:
            clamp(
                32px,
                9.5vw,
                43px
            )!important;

    }


    .mc34-detail-intro{

        font-size:12px;

    }


    .mc34-detail-media{

        padding-top:18px;

    }


    .mc34-detail-media figure{

        border-radius:12px;

    }


    .mc34-detail-media img{

        aspect-ratio:
            16 / 10;

    }


    .mc34-article-section{

        padding:
            25px 0 45px;

    }


    .mc34-article-side{

        grid-template-columns:1fr;

    }


    .mc34-article-help{

        display:none;

    }


    .mc34-article-content{

        font-size:15px;

    }


    .mc34-article-content p{

        font-size:15px!important;

        line-height:1.75!important;

    }


    .mc34-article-content h2{

        margin-top:
            31px!important;

        font-size:
            25px!important;

    }


    .mc34-article-content h3{

        font-size:
            20px!important;

    }


    .mc34-related{

        padding:
            40px 0;

    }


    .mc34-related-grid{

        grid-template-columns:
            1fr
            1fr;

        gap:8px;

    }


    .mc34-detail-bottom
    .mc34-detail-shell{

        display:block;

    }


    .mc34-detail-bottom h2{

        margin-bottom:
            13px!important;

        font-size:
            22px!important;

    }


    .mc34-detail-bottom a{

        width:100%;

        justify-content:center;

    }

}


/* ================================================================
   SMALL MOBILE
   ================================================================ */

@media(
    max-width:430px
){

    .mc34-related-grid{

        grid-template-columns:1fr;

    }


    .mc34-blog-bottom-cta
    .mc34-shell > div:last-child{

        grid-template-columns:1fr;

    }

}


/* ================================================================
   REDUCED MOTION
   ================================================================ */

@media(
    prefers-reduced-motion:reduce
){

    .mc34-page *,
    .mc34-page *::before,
    .mc34-page *::after{

        scroll-behavior:auto!important;

        transition:none!important;

    }

}