/*
 * MTG Tarifas · SaaS Purple V1
 * Frontend canónico /tarifas/
 */

body.mtg-tarifas-saas{
    background:
        radial-gradient(
            circle at 10% 3%,
            rgba(112,65,255,.09),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 18%,
            rgba(79,70,229,.07),
            transparent 26%
        ),
        #f7f8fc;
    color:#12152d;
}

body.mtg-tarifas-saas
.site-main{
    overflow:hidden;
}

.mtg-pricing,
.mtg-pricing *{
    box-sizing:border-box;
}

.mtg-pricing{
    --mtg-purple:#6d3df5;
    --mtg-purple-2:#5527db;
    --mtg-purple-3:#8d68ff;
    --mtg-ink:#11142d;
    --mtg-muted:#68708d;
    --mtg-border:#e4e7f1;
    --mtg-soft:#f6f4ff;
    --mtg-green:#18b986;

    width:min(1180px,90%);
    margin:0 auto;
    padding:56px 0 84px;
    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    color:var(--mtg-ink);
}


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

.mtg-pricing-hero{
    position:relative;
    overflow:hidden;
    border-radius:34px;
    padding:74px 36px 70px;
    margin-bottom:72px;
    background:
        radial-gradient(
            circle at 78% 18%,
            rgba(149,111,255,.34),
            transparent 30%
        ),
        radial-gradient(
            circle at 15% 90%,
            rgba(85,50,220,.42),
            transparent 36%
        ),
        linear-gradient(
            135deg,
            #16073d 0%,
            #251064 44%,
            #4117a5 100%
        );
    color:#fff;
    box-shadow:
        0 30px 80px rgba(57,29,130,.20);
}

.mtg-pricing-hero::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(
            rgba(255,255,255,.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.025) 1px,
            transparent 1px
        );
    background-size:38px 38px;
    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.55),
            transparent
        );
    pointer-events:none;
}

.mtg-pricing-hero__glow{
    position:absolute;
    width:480px;
    height:480px;
    right:-150px;
    top:-210px;
    border-radius:50%;
    background:rgba(154,118,255,.22);
    filter:blur(16px);
    pointer-events:none;
}

.mtg-pricing-hero__content{
    position:relative;
    z-index:2;
    max-width:900px;
    margin:auto;
    text-align:center;
}

.mtg-pricing-kicker{
    display:inline-flex;
    align-items:center;
    gap:9px;
    min-height:34px;
    padding:0 15px;
    border:1px solid rgba(255,255,255,.17);
    border-radius:999px;
    background:rgba(255,255,255,.08);
    color:#e9e3ff;
    font-size:12px;
    font-weight:850;
    letter-spacing:.12em;
}

.mtg-pricing-kicker__dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#ab8cff;
    box-shadow:
        0 0 0 5px rgba(171,140,255,.12);
}

.mtg-pricing-hero h1{
    max-width:940px;
    margin:22px auto 0;
    color:#fff;
    font-size:clamp(42px,5.3vw,72px);
    line-height:.99;
    letter-spacing:-.055em;
    font-weight:900;
}

.mtg-pricing-hero p{
    max-width:760px;
    margin:22px auto 0;
    color:#d8d3ec;
    font-size:17px;
    line-height:1.7;
}

.mtg-pricing-hero__trust{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.mtg-pricing-hero__trust span{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.07);
    color:#f5f1ff;
    font-size:13px;
    font-weight:700;
}

.mtg-pricing-hero__trust i{
    display:grid;
    place-items:center;
    width:19px;
    height:19px;
    border-radius:50%;
    background:#fff;
    color:var(--mtg-purple);
    font-style:normal;
    font-size:12px;
    font-weight:950;
}


/* ============================================================
   SECTION HEAD
============================================================ */

.mtg-pricing-section-head{
    max-width:720px;
    margin:0 auto 34px;
    text-align:center;
}

.mtg-pricing-section-head > span{
    display:inline-block;
    color:var(--mtg-purple);
    font-size:12px;
    font-weight:900;
    letter-spacing:.14em;
}

.mtg-pricing-section-head h2{
    margin:10px 0 0;
    color:var(--mtg-ink);
    font-size:clamp(32px,4vw,48px);
    line-height:1.05;
    letter-spacing:-.045em;
    font-weight:900;
}

.mtg-pricing-section-head p{
    margin:15px auto 0;
    color:var(--mtg-muted);
    font-size:16px;
    line-height:1.65;
}


/* ============================================================
   PLANES
============================================================ */

.mtg-pricing-plans{
    margin-bottom:84px;
}

.mtg-pricing-grid{
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:24px;
    max-width:1000px;
    margin:0 auto;
    align-items:stretch;
}

.mtg-plan-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    padding:32px;
    border:1px solid var(--mtg-border);
    border-radius:28px;
    background:#fff;
    box-shadow:
        0 18px 55px rgba(24,27,56,.07);
}

.mtg-plan-card--free{
    margin-top:18px;
}

.mtg-plan-card--pro{
    overflow:hidden;
    border-color:rgba(109,61,245,.42);
    background:
        linear-gradient(
            #fff,
            #fff
        ) padding-box,
        linear-gradient(
            135deg,
            #8d68ff,
            #5527db
        ) border-box;
    box-shadow:
        0 30px 80px rgba(82,45,190,.18);
}

.mtg-plan-pro-ribbon{
    position:absolute;
    top:22px;
    right:-37px;
    width:150px;
    padding:7px 0;
    transform:rotate(38deg);
    background:
        linear-gradient(
            90deg,
            #6d3df5,
            #8d68ff
        );
    color:#fff;
    text-align:center;
    font-size:9px;
    font-weight:900;
    letter-spacing:.1em;
}

.mtg-plan-card__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.mtg-plan-badge{
    display:inline-flex;
    align-items:center;
    min-height:31px;
    padding:0 13px;
    border-radius:999px;
    background:#f1f3f8;
    color:#555d77;
    font-size:11px;
    font-weight:850;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.mtg-plan-badge--pro{
    background:#eee9ff;
    color:#6539e6;
}

.mtg-plan-icon{
    display:grid;
    place-items:center;
    width:45px;
    height:45px;
    border-radius:14px;
    background:#f4f2ff;
    color:#7250e9;
}

.mtg-plan-icon svg{
    width:21px;
    height:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.mtg-plan-icon--pro{
    background:
        linear-gradient(
            135deg,
            #7c4eff,
            #5527db
        );
    color:#fff;
    box-shadow:
        0 12px 28px rgba(85,39,219,.28);
}

.mtg-plan-card h3{
    margin:24px 0 0;
    color:var(--mtg-ink);
    font-size:30px;
    line-height:1;
    font-weight:900;
    letter-spacing:-.035em;
}

.mtg-plan-desc{
    min-height:52px;
    margin:12px 0 0;
    color:var(--mtg-muted);
    font-size:14px;
    line-height:1.65;
}

.mtg-plan-price{
    display:flex;
    align-items:baseline;
    gap:8px;
    margin:24px 0 22px;
}

.mtg-plan-price strong{
    color:var(--mtg-ink);
    font-size:46px;
    line-height:1;
    letter-spacing:-.05em;
    font-weight:900;
}

.mtg-plan-price span{
    color:#838aa0;
    font-size:14px;
    font-weight:700;
}

.mtg-plan-price--pro strong{
    color:#5729d9;
}

.mtg-plan-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:52px;
    padding:0 22px;
    border-radius:14px;
    text-decoration:none !important;
    font-size:14px;
    font-weight:850;
    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.mtg-plan-button:hover{
    transform:translateY(-2px);
}

.mtg-plan-button--free{
    border:1px solid #dfe3ec;
    background:#fff;
    color:#252944;
}

.mtg-plan-button--pro{
    background:
        linear-gradient(
            135deg,
            #7548f7,
            #5527db
        );
    color:#fff !important;
    box-shadow:
        0 15px 32px rgba(85,39,219,.22);
}

.mtg-plan-separator{
    height:1px;
    margin:28px 0 22px;
    background:#eceef4;
}

.mtg-plan-card h4{
    margin:0 0 16px;
    color:#272b45;
    font-size:13px;
    font-weight:850;
}

.mtg-plan-highlights{
    display:grid;
    gap:13px;
    padding:0;
    margin:0;
    list-style:none;
}

.mtg-plan-highlights li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:#363b55;
    font-size:13px;
    line-height:1.45;
}

.mtg-plan-check{
    flex:0 0 auto;
    display:grid;
    place-items:center;
    width:21px;
    height:21px;
    margin-top:1px;
    border-radius:50%;
    background:#eef1f6;
    color:#596179;
    font-size:11px;
    font-weight:950;
}

.mtg-plan-check--pro{
    background:#eee9ff;
    color:#6539e6;
}

.mtg-plan-highlights small{
    display:block;
    margin-top:2px;
    color:#8a91a7;
    font-size:11px;
}


/* ============================================================
   COMPARADOR
============================================================ */

.mtg-pricing-compare{
    margin-bottom:58px;
}

.mtg-compare-shell{
    overflow:hidden;
    border:1px solid var(--mtg-border);
    border-radius:26px;
    background:#fff;
    box-shadow:
        0 18px 60px rgba(28,31,61,.07);
}

.mtg-compare-table{
    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
}

.mtg-compare-table th,
.mtg-compare-table td{
    border:0;
}

.mtg-compare-table thead th{
    padding:22px 24px;
    background:#17152d;
    color:#fff;
    font-size:13px;
    font-weight:850;
    text-align:center;
}

.mtg-compare-table thead th:first-child{
    width:50%;
    text-align:left;
}

.mtg-compare-table thead
.mtg-compare-pro{
    background:
        linear-gradient(
            135deg,
            #6d3df5,
            #5527db
        );
}

.mtg-compare-section td{
    padding:12px 24px !important;
    background:#f2effd !important;
    color:#603cd4 !important;
    font-size:11px !important;
    font-weight:900 !important;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.mtg-compare-table tbody
tr:not(.mtg-compare-section){
    border-bottom:1px solid #edf0f5;
}

.mtg-compare-table tbody
tr:not(.mtg-compare-section):last-child{
    border-bottom:0;
}

.mtg-compare-table tbody td{
    padding:16px 24px;
    color:#515970;
    font-size:13px;
    line-height:1.45;
    text-align:center;
}

.mtg-compare-table tbody td:first-child{
    color:#252944;
    text-align:left;
    font-weight:700;
}

.mtg-compare-table tbody
.mtg-compare-pro{
    background:#fbfaff;
}

.mtg-saas-check{
    display:inline-grid;
    place-items:center;
    width:25px;
    height:25px;
    border-radius:50%;
    background:#eee9ff;
    color:#6436e6;
    font-size:13px;
    font-weight:950;
}

.mtg-saas-no{
    color:#c2c7d2;
    font-size:22px;
    font-weight:800;
}

.mtg-saas-value{
    color:#596179;
    font-size:12px;
    font-weight:750;
}


/* ============================================================
   CONFIANZA
============================================================ */

.mtg-pricing-confidence{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:68px;
}

.mtg-confidence-card{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
    padding:20px;
    border:1px solid var(--mtg-border);
    border-radius:18px;
    background:#fff;
}

.mtg-confidence-icon{
    flex:0 0 auto;
    display:grid;
    place-items:center;
    width:43px;
    height:43px;
    border-radius:13px;
    background:#f2efff;
    font-size:19px;
}

.mtg-confidence-card strong,
.mtg-confidence-card span{
    display:block;
}

.mtg-confidence-card strong{
    color:#242842;
    font-size:13px;
    font-weight:850;
}

.mtg-confidence-card span{
    margin-top:4px;
    color:#7c8399;
    font-size:11px;
    line-height:1.5;
}


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

.mtg-pricing-cta{
    position:relative;
    overflow:hidden;
    border-radius:30px;
    padding:58px 32px;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(168,132,255,.35),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #16073d,
            #371094
        );
    text-align:center;
    color:#fff;
    box-shadow:
        0 24px 70px rgba(55,26,132,.18);
}

.mtg-pricing-cta__glow{
    position:absolute;
    width:380px;
    height:380px;
    left:-170px;
    bottom:-250px;
    border-radius:50%;
    background:#7346ef;
    opacity:.3;
}

.mtg-pricing-cta__content{
    position:relative;
    z-index:2;
    max-width:760px;
    margin:auto;
}

.mtg-pricing-cta__content > span{
    color:#bda8ff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.14em;
}

.mtg-pricing-cta h2{
    margin:10px auto 0;
    color:#fff;
    font-size:clamp(32px,4vw,48px);
    line-height:1.04;
    letter-spacing:-.045em;
    font-weight:900;
}

.mtg-pricing-cta p{
    max-width:610px;
    margin:15px auto 0;
    color:#d7d1e9;
    font-size:15px;
    line-height:1.65;
}

.mtg-pricing-cta a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:50px;
    margin-top:24px;
    padding:0 24px;
    border-radius:14px;
    background:#fff;
    color:#4f24cc !important;
    text-decoration:none !important;
    font-size:14px;
    font-weight:850;
    box-shadow:
        0 15px 35px rgba(0,0,0,.16);
}


/* ============================================================
   LEGACY
============================================================ */

.mtg-tarifas-switch,
.mtg-tarifas-plans,
.mtg-tarifas-compare,
.mtg-tarifas-note,
.mtg-tarifas-footer,
.mtg-tarifas-hero,
.mtg-tv2{
    display:none !important;
}


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

@media (max-width:760px){

    .mtg-pricing{
        width:min(100% - 26px,1180px);
        padding:28px 0 48px;
    }

    .mtg-pricing-hero{
        border-radius:24px;
        padding:48px 20px 44px;
        margin-bottom:50px;
    }

    .mtg-pricing-hero h1{
        font-size:39px;
    }

    .mtg-pricing-hero p{
        font-size:15px;
    }

    .mtg-pricing-hero__trust{
        gap:8px;
    }

    .mtg-pricing-grid{
        grid-template-columns:1fr;
    }

    .mtg-plan-card{
        padding:25px 21px;
        border-radius:22px;
    }

    .mtg-plan-card--free{
        margin-top:0;
    }

    .mtg-plan-price strong{
        font-size:40px;
    }

    .mtg-pricing-confidence{
        grid-template-columns:1fr;
    }

    .mtg-compare-shell{
        overflow:visible;
        border:0;
        box-shadow:none;
        background:transparent;
    }

    .mtg-compare-table,
    .mtg-compare-table tbody,
    .mtg-compare-table tr,
    .mtg-compare-table td{
        display:block;
        width:100%;
    }

    .mtg-compare-table thead{
        display:none;
    }

    .mtg-compare-section{
        margin-top:18px;
    }

    .mtg-compare-section:first-child{
        margin-top:0;
    }

    .mtg-compare-section td{
        border-radius:12px;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section){
        overflow:hidden;
        margin-top:10px;
        border:1px solid var(--mtg-border);
        border-radius:16px;
        background:#fff;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section) td{
        display:grid;
        grid-template-columns:
            minmax(110px,.8fr)
            minmax(0,1.2fr);
        gap:12px;
        align-items:center;
        padding:13px 16px;
        border-bottom:1px solid #edf0f5;
        text-align:right;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section)
    td:last-child{
        border-bottom:0;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section)
    td::before{
        content:attr(data-label);
        color:#777f96;
        font-size:11px;
        font-weight:850;
        text-align:left;
        text-transform:uppercase;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section)
    td:first-child{
        display:block;
        background:#fafbfe;
        color:#242842;
        text-align:left;
        font-size:13px;
        font-weight:850;
    }

    .mtg-compare-table tbody
    tr:not(.mtg-compare-section)
    td:first-child::before{
        display:none;
    }

    .mtg-pricing-cta{
        border-radius:23px;
        padding:44px 20px;
    }

}


/* MTG_COMPARE_CTA_V1_START */

.mtg-compare-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 18px;
    border-radius:12px;
    text-decoration:none !important;
    font-size:13px;
    font-weight:900;
    letter-spacing:-.01em;
    transition:
        transform .18s ease,
        opacity .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.mtg-compare-cta:hover{
    transform:translateY(-1px);
}

.mtg-compare-cta--free{
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.12);
    color:#ffffff !important;
}

.mtg-compare-cta--free:hover{
    background:rgba(255,255,255,.16);
    box-shadow:0 10px 22px rgba(0,0,0,.14);
}

.mtg-compare-cta--pro{
    background:#ffffff;
    border:1px solid rgba(255,255,255,.18);
    color:#5a2bdf !important;
    box-shadow:0 10px 24px rgba(22,7,61,.20);
}

.mtg-compare-cta--pro:hover{
    background:#f7f4ff;
}

@media (max-width:760px){

    .mtg-compare-cta{
        width:100%;
        min-height:42px;
        padding:0 12px;
        font-size:12px;
    }

}

/* MTG_COMPARE_CTA_V1_END */

