/* =========================================================
   MUSLIM PATH - WHY CHOOSE US V2
   FACEBOOK PROFILE COVER LANGUAGE
========================================================= */

.mpa-adv2 {
    padding:22px 18px 80px;
    background:#f7fafc;
    color:#17344e;
}

.mpa-adv2__shell {
    width:min(1320px,100%);
    margin:0 auto;
}


/* =========================================================
   PROFILE COVER
========================================================= */

.mpa-adv2-profile {
    position:relative;
    padding-bottom:34px;
}

.mpa-adv2-cover {
    width:100%;
    height:420px;
    border-radius:28px;
    overflow:hidden;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.mpa-adv2-cover.no-cover {
    background:
        radial-gradient(circle at 24% 22%,rgba(255,255,255,.18),transparent 22%),
        radial-gradient(circle at 78% 34%,rgba(253,176,2,.13),transparent 18%),
        #0756a0;
}

.mpa-adv2-avatar {
    position:relative;
    z-index:3;
    width:132px;
    height:132px;
    margin:-66px auto 0;
    padding:8px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 8px 24px rgba(9,47,81,.14);
}

.mpa-adv2-avatar img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    border-radius:50%;
}

.mpa-adv2-profile__copy {
    max-width:900px;
    margin:24px auto 0;
    text-align:center;
}

.mpa-adv2-eyebrow {
    display:block;
    margin-bottom:10px;
    color:#5f8fb8;
    font-size:13px;
    font-weight:700;
}

.mpa-adv2-profile__copy h1 {
    max-width:900px;
    margin:0 auto;
    color:#08284c;
    font-size:clamp(36px,4.4vw,58px);
    line-height:1.08;
    letter-spacing:-.025em;
    font-weight:760;
}

.mpa-adv2-profile__copy > p {
    max-width:780px;
    margin:17px auto 0;
    color:#5b7083;
    font-size:16px;
    line-height:1.9;
}

.mpa-adv2-actions {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:9px;
    margin-top:25px;
}

.mpa-adv2-actions a {
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 19px;
    border-radius:8px;
    border:1px solid #d5e1ea;
    color:#174a73;
    background:#fff;
    text-decoration:none;
    font-size:13px;
    font-weight:750;
}

.mpa-adv2-actions a.is-primary {
    color:#fff;
    background:#075aa7;
    border-color:#075aa7;
}


/* =========================================================
   FACTS / PROFILE STATS
========================================================= */

.mpa-adv2-facts {
    max-width:940px;
    margin:34px auto 0;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #dce5ec;
    border-bottom:1px solid #dce5ec;
}

.mpa-adv2-facts > div {
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:15px;
    text-align:center;
}

.mpa-adv2-facts > div + div {
    border-left:1px solid #dce5ec;
}

.mpa-adv2-facts span {
    width:6px;
    height:6px;
    flex:0 0 auto;
    border-radius:50%;
    background:#fdb002;
}

.mpa-adv2-facts strong {
    color:#01478d;
    font-size:13px;
    line-height:1.45;
}


/* =========================================================
   INTRO
========================================================= */

.mpa-adv2-intro {
    max-width:830px;
    margin:92px auto 68px;
    text-align:center;
}

.mpa-adv2-intro > span,
.mpa-adv2-market header > span,
.mpa-adv2-related > div > span,
.mpa-adv2-faq header > span,
.mpa-adv2-final > span {
    display:block;
    margin-bottom:10px;
    color:#5f8fb8;
    font-size:11px;
    line-height:1.5;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.mpa-adv2-intro h2 {
    margin:0;
    color:#08284c;
    font-size:clamp(31px,3.6vw,46px);
    line-height:1.15;
    letter-spacing:-.025em;
}

.mpa-adv2-intro p {
    max-width:740px;
    margin:18px auto 0;
    color:#5b7184;
    font-size:16px;
    line-height:1.9;
}


/* =========================================================
   STORIES
========================================================= */

.mpa-adv2-stories {
    border-top:1px solid #dce5ec;
}

.mpa-adv2-story {
    display:grid;
    grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
    align-items:center;
    gap:68px;
    padding:68px 0;
    border-bottom:1px solid #dce5ec;
}

.mpa-adv2-story.is-reverse figure {
    order:2;
}

.mpa-adv2-story.is-reverse .mpa-adv2-story__copy {
    order:1;
}

.mpa-adv2-story figure {
    margin:0;
    height:390px;
    overflow:hidden;
    border-radius:20px;
    background:#e9f1f6;
}

.mpa-adv2-story figure img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.mpa-adv2-image-placeholder {
    position:relative;
    width:100%;
    height:100%;
    background:#eaf3f9;
    overflow:hidden;
}

.mpa-adv2-image-placeholder::before {
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-80px;
    top:-90px;
    border:1px solid rgba(1,71,141,.12);
    border-radius:50%;
}

.mpa-adv2-image-placeholder::after {
    content:"";
    position:absolute;
    width:190px;
    height:190px;
    left:-70px;
    bottom:-85px;
    border:1px solid rgba(1,71,141,.09);
    border-radius:50%;
}

.mpa-adv2-image-placeholder span {
    position:absolute;
    left:50%;
    top:50%;
    width:44px;
    height:2px;
    transform:translate(-50%,-50%);
    background:#fdb002;
}

.mpa-adv2-story__number {
    display:block;
    margin-bottom:11px;
    color:#f0a700;
    font-size:12px;
    font-weight:850;
    letter-spacing:.12em;
}

.mpa-adv2-story__copy h2 {
    max-width:590px;
    margin:0;
    color:#08284c;
    font-size:clamp(29px,3vw,42px);
    line-height:1.17;
    letter-spacing:-.02em;
}

.mpa-adv2-story__copy p {
    max-width:620px;
    margin:19px 0 0;
    color:#566f83;
    font-size:16px;
    line-height:1.95;
}


/* =========================================================
   MARKET SECTION
========================================================= */

.mpa-adv2-market {
    margin:92px 0;
    padding:64px 0;
    border-top:1px solid #dce5ec;
    border-bottom:1px solid #dce5ec;
}

.mpa-adv2-market header {
    max-width:810px;
    margin:0 auto 46px;
    text-align:center;
}

.mpa-adv2-market header h2,
.mpa-adv2-related h2,
.mpa-adv2-faq h2 {
    margin:0;
    color:#08284c;
    font-size:clamp(30px,3.4vw,44px);
    line-height:1.16;
    letter-spacing:-.025em;
}

.mpa-adv2-market header p {
    max-width:730px;
    margin:17px auto 0;
    color:#5b7184;
    line-height:1.85;
}

.mpa-adv2-market__split {
    max-width:1000px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    border-top:1px solid #dce5ec;
}

.mpa-adv2-market__split article {
    padding:37px 45px 0 0;
}

.mpa-adv2-market__split article + article {
    padding-left:45px;
    border-left:1px solid #dce5ec;
}

.mpa-adv2-market__split small {
    display:block;
    margin-bottom:10px;
    color:#f0a700;
    font-size:11px;
    font-weight:850;
    letter-spacing:.12em;
}

.mpa-adv2-market__split p {
    margin:0;
    color:#526d82;
    font-size:15px;
    line-height:1.95;
}


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

.mpa-adv2-related {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:50px;
    padding:0 0 70px;
    border-bottom:1px solid #dce5ec;
}

.mpa-adv2-related > div {
    max-width:680px;
}

.mpa-adv2-related nav {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:9px 20px;
}

.mpa-adv2-related nav a {
    color:#01478d;
    text-decoration:none;
    font-size:13px;
    font-weight:750;
    border-bottom:1px solid rgba(1,71,141,.2);
}


/* =========================================================
   FAQ
========================================================= */

.mpa-adv2-faq {
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:75px;
    padding:78px 0;
}

.mpa-adv2-faq details {
    border-bottom:1px solid #dce5ec;
}

.mpa-adv2-faq summary {
    position:relative;
    cursor:pointer;
    list-style:none;
    padding:21px 38px 21px 0;
    color:#153b59;
    font-size:15px;
    line-height:1.55;
    font-weight:750;
}

.mpa-adv2-faq summary::-webkit-details-marker {
    display:none;
}

.mpa-adv2-faq summary::after {
    content:"+";
    position:absolute;
    right:3px;
    top:18px;
    color:#f0a700;
    font-size:21px;
    font-weight:400;
}

.mpa-adv2-faq details[open] summary::after {
    content:"−";
}

.mpa-adv2-faq details p {
    margin:0;
    padding:0 38px 22px 0;
    color:#5a7285;
    line-height:1.85;
}


/* =========================================================
   FINAL CTA
========================================================= */

.mpa-adv2-final {
    max-width:1000px;
    margin:8px auto 0;
    padding:54px 60px;
    text-align:center;
    border-top:3px solid #fdb002;
    background:#08284c;
    border-radius:20px;
}

.mpa-adv2-final > span {
    color:#fdb002;
}

.mpa-adv2-final h2 {
    max-width:780px;
    margin:0 auto;
    color:#fff;
    font-size:clamp(29px,3.3vw,42px);
    line-height:1.16;
}

.mpa-adv2-final p {
    max-width:700px;
    margin:17px auto 0;
    color:#c7d5df;
    line-height:1.8;
}

.mpa-adv2-final a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:45px;
    margin-top:24px;
    padding:0 22px;
    border-radius:8px;
    background:#fdb002;
    color:#08284c;
    text-decoration:none;
    font-size:13px;
    font-weight:800;
}


/* =========================================================
   HOME MIND-MAP LINKS
========================================================= */

.mpa-why-map__node {
    text-decoration:none !important;
}


/* =========================================================
   DARK MODE
========================================================= */

html.mpa-dark .mpa-adv2 {
    background:#03182f;
}

html.mpa-dark .mpa-adv2-avatar {
    background:#08284c;
    box-shadow:0 8px 24px rgba(0,0,0,.22);
}

html.mpa-dark .mpa-adv2-eyebrow,
html.mpa-dark .mpa-adv2-intro > span,
html.mpa-dark .mpa-adv2-market header > span,
html.mpa-dark .mpa-adv2-related > div > span,
html.mpa-dark .mpa-adv2-faq header > span {
    color:#fdb002 !important;
}

html.mpa-dark .mpa-adv2-profile__copy h1,
html.mpa-dark .mpa-adv2-intro h2,
html.mpa-dark .mpa-adv2-story__copy h2,
html.mpa-dark .mpa-adv2-market header h2,
html.mpa-dark .mpa-adv2-related h2,
html.mpa-dark .mpa-adv2-faq h2,
html.mpa-dark .mpa-adv2-faq summary {
    color:#fff;
}

html.mpa-dark .mpa-adv2-profile__copy > p,
html.mpa-dark .mpa-adv2-intro p,
html.mpa-dark .mpa-adv2-story__copy p,
html.mpa-dark .mpa-adv2-market header p,
html.mpa-dark .mpa-adv2-market__split p,
html.mpa-dark .mpa-adv2-faq details p {
    color:#aec2d2;
}

html.mpa-dark .mpa-adv2-facts,
html.mpa-dark .mpa-adv2-facts > div + div,
html.mpa-dark .mpa-adv2-stories,
html.mpa-dark .mpa-adv2-story,
html.mpa-dark .mpa-adv2-market,
html.mpa-dark .mpa-adv2-market__split,
html.mpa-dark .mpa-adv2-market__split article + article,
html.mpa-dark .mpa-adv2-related,
html.mpa-dark .mpa-adv2-faq details {
    border-color:#1b3954;
}

html.mpa-dark .mpa-adv2-facts strong,
html.mpa-dark .mpa-adv2-related nav a {
    color:#fdb002 !important;
}

html.mpa-dark .mpa-adv2-story figure,
html.mpa-dark .mpa-adv2-image-placeholder {
    background:#08233e;
}

html.mpa-dark .mpa-adv2-actions a:not(.is-primary) {
    color:#e9f1f7;
    background:#0a2743;
    border-color:#29445d;
}


/* =========================================================
   RTL
========================================================= */

html[dir="rtl"] .mpa-adv2-market__split article {
    padding:37px 0 0 45px;
}

html[dir="rtl"] .mpa-adv2-market__split article + article {
    padding-right:45px;
    padding-left:0;
    border-left:0;
    border-right:1px solid #dce5ec;
}

html.mpa-dark[dir="rtl"] .mpa-adv2-market__split article + article {
    border-right-color:#1b3954;
}

html[dir="rtl"] .mpa-adv2-faq summary {
    padding:21px 0 21px 38px;
}

html[dir="rtl"] .mpa-adv2-faq summary::after {
    right:auto;
    left:3px;
}

html[dir="rtl"] .mpa-adv2-faq details p {
    padding:0 0 22px 38px;
}


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

@media (max-width:900px) {

    .mpa-adv2 {
        padding:12px 9px 58px;
    }

    .mpa-adv2-cover {
        height:230px;
        border-radius:21px;
    }

    .mpa-adv2-avatar {
        width:108px;
        height:108px;
        margin-top:-54px;
        padding:6px;
    }

    .mpa-adv2-profile__copy {
        margin-top:19px;
        padding:0 8px;
    }

    .mpa-adv2-profile__copy h1 {
        font-size:34px;
    }

    .mpa-adv2-profile__copy > p {
        font-size:14px;
        line-height:1.85;
    }

    .mpa-adv2-facts {
        grid-template-columns:1fr 1fr;
        margin-top:27px;
    }

    .mpa-adv2-facts > div {
        min-height:65px;
        padding:11px 8px;
    }

    .mpa-adv2-facts > div + div {
        border-left:0;
    }

    .mpa-adv2-facts > div:nth-child(even) {
        border-left:1px solid #dce5ec;
    }

    html.mpa-dark .mpa-adv2-facts > div:nth-child(even) {
        border-left-color:#1b3954;
    }

    .mpa-adv2-intro {
        margin:65px auto 42px;
        padding:0 8px;
    }

    .mpa-adv2-story {
        grid-template-columns:1fr;
        gap:27px;
        padding:43px 0;
    }

    .mpa-adv2-story.is-reverse figure,
    .mpa-adv2-story.is-reverse .mpa-adv2-story__copy {
        order:initial;
    }

    .mpa-adv2-story figure {
        height:270px;
    }

    .mpa-adv2-story__copy {
        padding:0 7px;
    }

    .mpa-adv2-story__copy h2 {
        font-size:29px;
    }

    .mpa-adv2-story__copy p {
        font-size:15px;
    }

    .mpa-adv2-market {
        margin:65px 0;
        padding:48px 8px;
    }

    .mpa-adv2-market__split {
        grid-template-columns:1fr;
    }

    .mpa-adv2-market__split article,
    html[dir="rtl"] .mpa-adv2-market__split article {
        padding:29px 0;
    }

    .mpa-adv2-market__split article + article,
    html[dir="rtl"] .mpa-adv2-market__split article + article {
        padding:29px 0 0;
        border-left:0;
        border-right:0;
        border-top:1px solid #dce5ec;
    }

    html.mpa-dark .mpa-adv2-market__split article + article {
        border-top-color:#1b3954;
    }

    .mpa-adv2-related {
        align-items:flex-start;
        flex-direction:column;
        gap:25px;
    }

    .mpa-adv2-related nav {
        justify-content:flex-start;
    }

    .mpa-adv2-faq {
        grid-template-columns:1fr;
        gap:28px;
        padding:59px 0;
    }

    .mpa-adv2-final {
        padding:39px 22px;
        border-radius:17px;
    }

}

@media (max-width:390px) {

    .mpa-adv2-cover {
        height:205px;
    }

    .mpa-adv2-profile__copy h1 {
        font-size:30px;
    }

    .mpa-adv2-facts strong {
        font-size:11px;
    }
}