/*
==============================================================
 INTERNET FIBRA
 LANDING V3
==============================================================
*/


:root {

    --lp3-primary:
        #D71920;

    --lp3-secondary:
        #111827;

    --lp3-accent:
        #F7C325;

    --lp3-background:
        #F4F6FA;

    --lp3-text:
        #334155;

    --lp3-muted:
        #64748B;

    --lp3-border:
        #E2E8F0;

    --lp3-white:
        #FFFFFF;

    --lp3-radius:
        20px;

    --lp3-control-radius:
        10px;

}


.lp3-root,
.lp3-root * {

    box-sizing:
        border-box;

}


.lp3-root {

    width:
        100%;

    min-width:
        0;


    margin:
        0;


    background:
        var(--lp3-background);


    color:
        var(--lp3-text);


    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

}


.lp3-shell {

    width:
        100%;

    min-width:
        0;

    overflow:
        clip;

}


.lp3-container {

    width:
        min(
            calc(100% - 40px),
            1180px
        );


    margin:
        0 auto;

}


.lp3-narrow {

    max-width:
        920px;

}


.lp3-loading,
.lp3-error {

    min-height:
        280px;


    display:
        flex;

    align-items:
        center;

    justify-content:
        center;


    padding:
        40px;


    color:
        var(--lp3-muted);

}


/*
==============================================================
 HEADER
==============================================================
*/


.lp3-header {

    position:
        relative;

    z-index:
        50;


    width:
        100%;


    background:
        #FFFFFF;


    border-bottom:
        1px solid
        var(--lp3-border);

}


.lp3-header-inner {

    min-height:
        68px;


    display:
        flex;

    align-items:
        center;


    gap:
        28px;

}


.lp3-brand {

    min-width:
        180px;


    display:
        inline-flex;

    align-items:
        center;


    gap:
        9px;


    color:
        var(--lp3-secondary);


    text-decoration:
        none;

}


.lp3-brand strong {

    font-size:
        16px;

    font-weight:
        700;

}


.lp3-brand-dot {

    width:
        10px;

    height:
        10px;


    border-radius:
        999px;


    background:
        var(--lp3-primary);

}


.lp3-brand-logo {

    width:
        38px;

    height:
        38px;


    object-fit:
        contain;

}


.lp3-nav {

    flex:
        1 1 auto;


    display:
        flex;

    align-items:
        center;

    justify-content:
        center;


    gap:
        24px;

}


.lp3-nav a {

    color:
        var(--lp3-text);


    text-decoration:
        none;


    font-size:
        13px;

    font-weight:
        500;


    transition:
        color 150ms ease;

}


.lp3-nav a:hover {

    color:
        var(--lp3-primary);

}


.lp3-header-actions {

    display:
        flex;

    align-items:
        center;


    gap:
        10px;

}


.lp3-menu-toggle {

    display:
        none;


    width:
        38px;

    height:
        38px;


    padding:
        9px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        9px;


    background:
        #FFFFFF;

}


.lp3-menu-toggle span {

    display:
        block;


    height:
        2px;


    margin:
        3px 0;


    border-radius:
        999px;


    background:
        var(--lp3-secondary);

}


/*
==============================================================
 BOTÕES
==============================================================
*/


.lp3-button {

    min-height:
        40px;


    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;


    gap:
        7px;


    padding:
        0 16px;


    border:
        1px solid transparent;


    border-radius:
        999px;


    text-decoration:
        none;


    font-family:
        inherit;

    font-size:
        13px;

    font-weight:
        700;

    line-height:
        1;


    cursor:
        pointer;


    transition:
        transform 120ms ease,
        opacity 150ms ease;

}


.lp3-button:hover {

    transform:
        translateY(-1px);

}


.lp3-button-primary {

    background:
        var(--lp3-primary);


    border-color:
        var(--lp3-primary);


    color:
        #FFFFFF;

}


.lp3-button-outline {

    background:
        #FFFFFF;


    border-color:
        var(--lp3-primary);


    color:
        var(--lp3-primary);

}


.lp3-button-accent {

    background:
        var(
            --lp3-plan-button-bg,
            var(--lp3-accent)
        );


    color:
        var(
            --lp3-plan-button-text,
            #111827
        );

}


/*
==============================================================
 HERO CONTEÚDO
==============================================================
*/


.lp3-hero-content {

    padding:
        58px 0;


    background:
        var(--lp3-background);

}


.lp3-hero-grid {

    display:
        grid;


    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(280px, .65fr);


    gap:
        46px;


    align-items:
        center;

}


.lp3-hero-copy h1 {

    max-width:
        760px;


    margin:
        14px 0 10px;


    color:
        var(--lp3-secondary);


    font-size:
        clamp(
            34px,
            4vw,
            54px
        );

    font-weight:
        800;

    line-height:
        1.04;


    letter-spacing:
        -.035em;

}


.lp3-lead {

    max-width:
        720px;


    margin:
        0;


    color:
        var(--lp3-text);


    font-size:
        17px;

    line-height:
        1.55;

}


.lp3-hero-side {

    padding:
        28px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        var(--lp3-radius);


    background:
        #FFFFFF;


    box-shadow:
        0 14px 40px
        rgba(15, 23, 42, .06);

}


.lp3-hero-side h2 {

    margin:
        14px 0 8px;


    color:
        var(--lp3-secondary);


    font-size:
        28px;

    line-height:
        1.1;

}


.lp3-hero-side p {

    margin:
        0;


    color:
        var(--lp3-muted);


    line-height:
        1.5;

}


.lp3-coverage-form {

    margin-top:
        24px;

}


.lp3-coverage-row {

    max-width:
        620px;


    display:
        grid;


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


    gap:
        10px;

}


.lp3-coverage-row input,
.lp3-footer-coverage input,
.lp3-form-field input {

    width:
        100%;


    height:
        44px;


    padding:
        0 13px;


    border:
        1px solid
        #CBD5E1;


    border-radius:
        10px;


    outline:
        none;


    background:
        #FFFFFF;


    color:
        var(--lp3-secondary);


    font:
        inherit;


    transition:
        border-color 150ms ease,
        box-shadow 150ms ease;

}


.lp3-coverage-row input:focus,
.lp3-footer-coverage input:focus,
.lp3-form-field input:focus {

    border-color:
        var(--lp3-primary);


    box-shadow:
        0 0 0 3px
        color-mix(
            in srgb,
            var(--lp3-primary) 12%,
            transparent
        );

}


.lp3-coverage-result {

    max-width:
        720px;


    margin-top:
        14px;

}


/*
==============================================================
 SEÇÕES
==============================================================
*/


.lp3-section {

    padding:
        72px 0;


    background:
        var(
            --lp3-section-bg,
            var(--lp3-background)
        );

}


.lp3-section-alt {

    background:
        color-mix(
            in srgb,
            var(--lp3-background) 75%,
            #FFFFFF
        );

}


.lp3-section-header {

    max-width:
        800px;


    margin:
        0 0 30px;

}


.lp3-section-header h2 {

    margin:
        12px 0 8px;


    color:
        var(
            --lp3-section-title,
            var(--lp3-secondary)
        );


    font-size:
        clamp(
            30px,
            3vw,
            42px
        );

    font-weight:
        800;

    line-height:
        1.08;


    letter-spacing:
        -.025em;

}


.lp3-section-header p {

    margin:
        0;


    color:
        var(
            --lp3-section-text,
            var(--lp3-muted)
        );


    font-size:
        16px;

    line-height:
        1.55;

}


.lp3-eyebrow {

    display:
        inline-flex;

    align-items:
        center;


    min-height:
        26px;


    padding:
        0 11px;


    border-radius:
        999px;


    background:
        var(
            --lp3-section-eyebrow-bg,
            color-mix(
                in srgb,
                var(--lp3-primary) 10%,
                #FFFFFF
            )
        );


    color:
        var(
            --lp3-section-eyebrow,
            var(--lp3-primary)
        );


    font-size:
        11px;

    font-weight:
        800;

    line-height:
        1;


    text-transform:
        uppercase;

}


.lp3-chip-row {

    display:
        flex;

    flex-wrap:
        wrap;


    gap:
        9px;


    margin-top:
        18px;

}


.lp3-chip {

    display:
        inline-flex;

    align-items:
        center;


    min-height:
        34px;


    padding:
        0 13px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        999px;


    background:
        #FFFFFF;


    color:
        var(--lp3-text);


    font-size:
        12px;

    font-weight:
        500;

}


.lp3-feature-strip {

    display:
        flex;

    flex-wrap:
        wrap;


    gap:
        10px;


    margin:
        0 0 26px;


    padding-bottom:
        26px;


    border-bottom:
        1px solid
        var(--lp3-border);

}


.lp3-feature-strip span {

    min-height:
        38px;


    display:
        inline-flex;

    align-items:
        center;


    padding:
        0 14px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        999px;


    background:
        #FFFFFF;


    font-size:
        12px;

}


/*
==============================================================
 PLANOS
==============================================================
*/


.lp3-plan-grid {

    display:
        grid;


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


    gap:
        20px;


    align-items:
        stretch;

}


.lp3-plan-grid-business {

    margin-top:
        32px;

}


.lp3-plan-card {

    min-width:
        0;

    height:
        100%;


    display:
        flex;

    flex-direction:
        column;


    padding:
        20px;


    border:
        1px solid
        var(
            --lp3-card-border,
            var(--lp3-border)
        );


    border-radius:
        20px;


    background:
        var(
            --lp3-card-bg,
            #FFFFFF
        );


    box-shadow:
        0 12px 32px
        rgba(17, 24, 39, .055);

}


.lp3-plan-tag-slot {

    min-height:
        28px;


    display:
        flex;

    align-items:
        flex-start;

}


.lp3-plan-tag {

    min-height:
        24px;


    display:
        inline-flex;

    align-items:
        center;


    padding:
        0 10px;


    border-radius:
        999px;


    background:
        var(
            --lp3-plan-tag-bg,
            var(--lp3-primary)
        );


    color:
        var(
            --lp3-plan-tag-text,
            #FFFFFF
        );


    font-size:
        10px;

    font-weight:
        800;

    line-height:
        1;

}


.lp3-plan-title {

    min-height:
        58px;


    margin:
        10px 0 8px;


    color:
        var(
            --lp3-plan-title,
            var(--lp3-secondary)
        );


    font-size:
        23px;

    font-weight:
        800;

    line-height:
        1.16;

}


.lp3-plan-description-slot {

    min-height:
        46px;

}


.lp3-plan-description {

    margin:
        0;


    color:
        var(
            --lp3-plan-description,
            var(--lp3-primary)
        );


    font-size:
        13px;

    font-weight:
        700;

    line-height:
        1.35;

}


.lp3-plan-list {

    flex:
        1 1 auto;


    margin:
        10px 0 0;


    padding:
        0 0 0 17px;


    color:
        var(
            --lp3-plan-benefit,
            #64748B
        );


    font-size:
        13px;

    line-height:
        1.45;

}


.lp3-plan-list li {

    margin:
        0 0 7px;

}


.lp3-plan-footer {

    display:
        grid;


    gap:
        11px;


    margin-top:
        20px;

}


.lp3-price {

    min-height:
        42px;


    display:
        flex;

    align-items:
        baseline;


    gap:
        5px;


    color:
        var(
            --lp3-plan-price,
            var(--lp3-secondary)
        );


    white-space:
        nowrap;

}


.lp3-price-currency {

    font-size:
        20px;

    font-weight:
        800;

}


.lp3-price strong {

    font-size:
        32px;

    font-weight:
        800;

    line-height:
        1;


    letter-spacing:
        -.025em;

}


.lp3-price-cycle {

    margin-left:
        2px;


    font-size:
        11px;

    font-weight:
        500;

}


.lp3-plan-card
.choose-plan-button {

    width:
        100%;


    min-height:
        42px;


    margin:
        0;

}


.lp3-details-link {

    display:
        inline-flex;

    align-items:
        center;


    min-height:
        22px;


    color:
        var(
            --lp3-plan-link,
            #2563EB
        );


    font-size:
        12px;

    font-weight:
        600;

}


/*
==============================================================
 BUSINESS
==============================================================
*/


.lp3-business-head {

    display:
        grid;


    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(280px, .85fr);


    gap:
        42px;


    align-items:
        center;

}


.lp3-business-features {

    display:
        grid;


    gap:
        10px;

}


.lp3-business-features span {

    min-height:
        44px;


    display:
        flex;

    align-items:
        center;


    padding:
        0 15px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        12px;


    background:
        #FFFFFF;

}


/*
==============================================================
 BENEFÍCIOS / ETAPAS
==============================================================
*/


.lp3-info-grid,
.lp3-step-grid {

    display:
        grid;


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


    gap:
        18px;

}


.lp3-info-card,
.lp3-step-card {

    min-width:
        0;


    padding:
        22px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        16px;


    background:
        #FFFFFF;

}


.lp3-info-card h3,
.lp3-step-card h3 {

    margin:
        10px 0 7px;


    color:
        var(--lp3-secondary);


    font-size:
        18px;

    line-height:
        1.25;

}


.lp3-info-card p,
.lp3-step-card p {

    margin:
        0;


    color:
        var(--lp3-muted);


    font-size:
        13px;

    line-height:
        1.5;

}


.lp3-info-icon,
.lp3-step-number {

    width:
        34px;

    height:
        34px;


    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;


    border-radius:
        10px;


    background:
        color-mix(
            in srgb,
            var(--lp3-primary) 10%,
            #FFFFFF
        );


    color:
        var(--lp3-primary);


    font-size:
        13px;

    font-weight:
        800;

}


/*
==============================================================
 ACCORDION
==============================================================
*/


.lp3-accordion-list {

    display:
        grid;


    gap:
        10px;

}


.lp3-accordion {

    overflow:
        hidden;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        12px;


    background:
        #FFFFFF;

}


.lp3-accordion summary {

    min-height:
        52px;


    display:
        flex;

    align-items:
        center;


    padding:
        0 16px;


    color:
        var(--lp3-secondary);


    font-size:
        14px;

    font-weight:
        700;


    cursor:
        pointer;

}


.lp3-accordion-body {

    padding:
        0 16px 16px;


    color:
        var(--lp3-muted);


    font-size:
        13px;

    line-height:
        1.55;

}


.lp3-accordion-body p {

    margin:
        0;

}


/*
==============================================================
 CHECKOUT
==============================================================
*/


.lp3-checkout-panel {

    display:
        grid;


    grid-template-columns:
        minmax(0, .75fr)
        minmax(0, 1.25fr);


    gap:
        44px;


    padding:
        34px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        20px;


    background:
        #FFFFFF;

}


.lp3-checkout-panel h2 {

    margin:
        0 0 8px;


    color:
        var(--lp3-secondary);


    font-size:
        30px;

}


.lp3-checkout-panel p {

    margin:
        0;


    color:
        var(--lp3-muted);


    line-height:
        1.5;

}


.lp3-checkout-fields {

    display:
        grid;


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


    gap:
        14px;

}


.lp3-form-field {

    display:
        grid;


    gap:
        6px;

}


.lp3-form-field span {

    color:
        var(--lp3-secondary);


    font-size:
        12px;

    font-weight:
        600;

}


.lp3-checkout-submit {

    grid-column:
        1 / -1;


    width:
        100%;

}


/*
==============================================================
 EXTRAS AUTOMÁTICOS
==============================================================
*/


.lp3-extra-grid {

    display:
        grid;


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


    gap:
        10px;


    margin-top:
        18px;

}


.lp3-extra-item {

    min-width:
        0;


    display:
        grid;


    gap:
        5px;


    padding:
        12px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        10px;


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


    font-size:
        12px;

}


.lp3-extra-item strong {

    color:
        var(--lp3-secondary);

}


.lp3-extra-wide {

    grid-column:
        1 / -1;

}


.lp3-mini-grid {

    display:
        grid;


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


    gap:
        10px;

}


.lp3-mini-card {

    padding:
        12px;


    border:
        1px solid
        var(--lp3-border);


    border-radius:
        10px;


    background:
        #FFFFFF;

}


.lp3-mini-card p {

    margin:
        5px 0 0;


    color:
        var(--lp3-muted);

}


/*
==============================================================
 CTA / FOOTER
==============================================================
*/


.lp3-final-cta {

    padding:
        48px 0;


    background:
        var(--lp3-secondary);


    color:
        #FFFFFF;

}


.lp3-final-cta-inner {

    display:
        grid;


    grid-template-columns:
        minmax(0, 1fr)
        minmax(320px, .8fr);


    gap:
        32px;


    align-items:
        center;

}


.lp3-final-cta h2 {

    margin:
        8px 0;


    font-size:
        32px;

}


.lp3-final-cta p {

    margin:
        0;


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

}


.lp3-footer-coverage {

    display:
        grid;


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


    gap:
        9px;

}


.lp3-footer {

    background:
        #FFFFFF;

}


.lp3-footer-grid {

    display:
        grid;


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


    gap:
        32px;


    padding-top:
        40px;

    padding-bottom:
        40px;

}


.lp3-footer-brand strong {

    color:
        var(--lp3-secondary);


    font-size:
        18px;

}


.lp3-footer-brand p {

    max-width:
        300px;


    color:
        var(--lp3-muted);


    font-size:
        13px;

}


.lp3-footer-column {

    display:
        grid;


    align-content:
        start;


    gap:
        9px;

}


.lp3-footer-column strong {

    margin-bottom:
        3px;


    color:
        var(--lp3-secondary);

}


.lp3-footer-column a {

    color:
        var(--lp3-muted);


    font-size:
        13px;


    text-decoration:
        none;

}


.lp3-cookie {

    border-top:
        1px solid
        var(--lp3-border);


    background:
        #FFFFFF;

}


.lp3-cookie-inner {

    min-height:
        64px;


    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;


    gap:
        20px;


    padding-top:
        10px;

    padding-bottom:
        10px;


    color:
        var(--lp3-muted);


    font-size:
        12px;

}


.lp3-cookie-actions {

    display:
        flex;

    align-items:
        center;


    gap:
        10px;

}


.lp3-text-button {

    border:
        0;


    background:
        transparent;


    color:
        var(--lp3-primary);


    font:
        inherit;

    font-weight:
        600;


    cursor:
        pointer;

}


/*
==============================================================
 MODAL
==============================================================
*/


body.lp3-modal-open {

    overflow:
        hidden;

}


.lp3-modal {

    position:
        fixed;

    z-index:
        9999;


    inset:
        0;


    display:
        grid;

    place-items:
        center;


    padding:
        20px;

}


.lp3-modal[hidden] {

    display:
        none;

}


.lp3-modal-backdrop {

    position:
        absolute;


    inset:
        0;


    background:
        rgba(15, 23, 42, .62);

}


.lp3-modal-card {

    position:
        relative;

    z-index:
        1;


    width:
        min(
            100%,
            440px
        );


    padding:
        28px;


    border-radius:
        18px;


    background:
        #FFFFFF;


    box-shadow:
        0 30px 80px
        rgba(15,23,42,.25);

}


.lp3-modal-card h2 {

    margin:
        0 0 8px;


    color:
        var(--lp3-secondary);


    font-size:
        25px;

}


.lp3-modal-card p {

    margin:
        0 0 20px;


    color:
        var(--lp3-muted);


    line-height:
        1.5;

}


.lp3-modal-close {

    position:
        absolute;


    top:
        10px;

    right:
        10px;


    width:
        34px;

    height:
        34px;


    border:
        0;


    border-radius:
        8px;


    background:
        transparent;


    color:
        var(--lp3-muted);


    font-size:
        24px;


    cursor:
        pointer;

}


/*
==============================================================
 RESPONSIVIDADE
==============================================================
*/


@media (
    max-width: 1100px
) {

    .lp3-plan-grid {

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

    }


    .lp3-info-grid,
    .lp3-step-grid {

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

    }


    .lp3-footer-grid {

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

    }

}


@media (
    max-width: 900px
) {

    .lp3-header-inner {

        min-height:
            62px;


        gap:
            12px;

    }


    .lp3-menu-toggle {

        display:
            block;


        margin-left:
            auto;

    }


    .lp3-nav {

        position:
            absolute;


        top:
            calc(100% + 1px);

        left:
            20px;

        right:
            20px;


        display:
            none;


        padding:
            12px;


        border:
            1px solid
            var(--lp3-border);


        border-radius:
            12px;


        background:
            #FFFFFF;


        box-shadow:
            0 16px 34px
            rgba(15,23,42,.12);

    }


    .lp3-nav.is-open {

        display:
            grid;

    }


    .lp3-nav a {

        padding:
            10px;

    }


    .lp3-header-actions {

        display:
            none;

    }


    .lp3-hero-grid,
    .lp3-business-head,
    .lp3-checkout-panel,
    .lp3-final-cta-inner {

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

    }


    .lp3-hero-side {

        max-width:
            none;

    }

}


@media (
    max-width: 680px
) {

    .lp3-container {

        width:
            min(
                calc(100% - 28px),
                1180px
            );

    }


    .lp3-section,
    .lp3-hero-content {

        padding:
            48px 0;

    }


    .lp3-plan-grid,
    .lp3-info-grid,
    .lp3-step-grid,
    .lp3-footer-grid,
    .lp3-checkout-fields,
    .lp3-extra-grid,
    .lp3-mini-grid {

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

    }


    .lp3-plan-tag-slot,
    .lp3-plan-title,
    .lp3-plan-description-slot {

        min-height:
            0;

    }


    .lp3-plan-title {

        margin-top:
            10px;

    }


    .lp3-coverage-row,
    .lp3-footer-coverage {

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

    }


    .lp3-button {

        width:
            100%;

    }


    .lp3-checkout-panel {

        padding:
            22px;

    }


    .lp3-cookie-inner {

        align-items:
            stretch;

        flex-direction:
            column;

    }


    .lp3-cookie-actions {

        width:
            100%;

    }

}


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

    .lp3-root *,
    .lp3-root *::before,
    .lp3-root *::after {

        scroll-behavior:
            auto !important;

        transition-duration:
            .01ms !important;

        animation-duration:
            .01ms !important;

    }

}