/*
 * Macro Micro UI Polish — PLUS clarity
 * Scope: PLUS membership page only.
 * No content, pricing, CTA, membership or plan logic changes.
 */

.mm-v13-plus-page .mms-plus-page{
    --mm-ui-plus-red:#e62b22;
    --mm-ui-plus-ink:#18202b;
    --mm-ui-plus-muted:#697386;
}

/* 1) Keep the existing hero design, only make the two-column opening read as one unit. */
.mm-v13-plus-page .mms-plus-shell{
    gap:20px;
}

.mm-v13-plus-page .mms-plus-hero{
    box-shadow:
        0 18px 48px rgba(17,24,39,.13),
        0 10px 28px rgba(230,43,34,.07);
}

.mm-v13-plus-page .mms-plus-status{
    border-color:#dfe3e9;
    box-shadow:0 14px 36px rgba(17,24,39,.075);
}

/* 2) Section titles: clearer hierarchy without changing content. */
.mm-v13-plus-page .mms-plus-section-head{
    padding-top:2px;
    margin-top:38px;
    margin-bottom:15px;
}

.mm-v13-plus-page .mms-plus-section-head h2{
    position:relative;
    padding-left:14px;
    font-weight:850;
}

.mm-v13-plus-page .mms-plus-section-head h2:before{
    content:"";
    position:absolute;
    left:0;
    top:.18em;
    bottom:.18em;
    width:3px;
    border-radius:99px;
    background:var(--mm-ui-plus-red);
}

.mm-v13-plus-page .mms-plus-section-head p{
    color:#667085;
}

/* 3) "PLUS neden farklı?" — make each benefit easier to scan. */
.mm-v13-plus-page .mms-plus-pillars{
    gap:14px;
}

.mm-v13-plus-page .mms-plus-pillar{
    position:relative;
    min-height:150px;
    border-color:#e3e6eb;
    box-shadow:0 8px 24px rgba(17,24,39,.045);
    transition:box-shadow .18s ease,border-color .18s ease,transform .18s ease;
}

.mm-v13-plus-page .mms-plus-pillar:hover{
    border-color:#d9dde4;
    box-shadow:0 12px 30px rgba(17,24,39,.07);
    transform:translateY(-1px);
}

.mm-v13-plus-page .mms-plus-pillar b{
    font-size:15px;
    color:var(--mm-ui-plus-ink);
}

.mm-v13-plus-page .mms-plus-pillar span{
    color:#667085;
}

/* 4) Plans — clearer Retail vs B2B distinction, no content changes. */
.mm-v13-plus-page .mms-plus-lists{
    gap:18px;
}

.mm-v13-plus-page .mms-plus-plan{
    border-color:#dde2e8;
    box-shadow:0 12px 32px rgba(17,24,39,.065);
}

.mm-v13-plus-page .mms-plus-plan.is-retail{
    box-shadow:
        0 12px 32px rgba(17,24,39,.055),
        0 8px 22px rgba(230,43,34,.045);
}

.mm-v13-plus-page .mms-plus-plan.is-b2b{
    box-shadow:
        0 12px 32px rgba(17,24,39,.065),
        0 8px 22px rgba(17,24,39,.035);
}

.mm-v13-plus-page .mms-plus-plan-label{
    color:#344054;
}

.mm-v13-plus-page .mms-plus-plan h3{
    color:#17202c;
}

.mm-v13-plus-page .mms-plus-plan-sub{
    color:#667085;
}

.mm-v13-plus-page .mms-plus-plan-badge{
    border:1px solid #ece7dd;
}

/* Benefit rows read more clearly without changing any list text. */
.mm-v13-plus-page .mms-plus-list li{
    padding-top:13px!important;
    padding-bottom:13px!important;
    color:#344054;
}

.mm-v13-plus-page .mms-plus-list li strong{
    font-weight:850;
}

/* Gift/summary boxes should be visibly separate from normal benefits. */
.mm-v13-plus-page .mms-plus-gift{
    border-color:#dfe3e8;
    background:#f7f8fa;
}

.mm-v13-plus-page .mms-plus-gift b{
    color:#222b38;
}

/* Footnote stays secondary, but not washed out. */
.mm-v13-plus-page .mms-plus-footnote{
    color:#6f7886;
}

/* Mobile: preserve existing stack; only maintain readable rhythm. */
@media(max-width:860px){
    .mm-v13-plus-page .mms-plus-section-head{
        margin-top:30px;
        margin-bottom:12px;
    }

    .mm-v13-plus-page .mms-plus-pillar{
        min-height:auto;
    }

    .mm-v13-plus-page .mms-plus-lists{
        gap:14px;
    }
}

@media(max-width:520px){
    .mm-v13-plus-page .mms-plus-section-head h2{
        padding-left:11px;
    }

    .mm-v13-plus-page .mms-plus-section-head h2:before{
        width:3px;
    }

    .mm-v13-plus-page .mms-plus-pillar{
        box-shadow:0 7px 20px rgba(17,24,39,.045);
    }

    .mm-v13-plus-page .mms-plus-plan{
        box-shadow:0 9px 24px rgba(17,24,39,.055);
    }
}
