.elementor-kit-14{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-14 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//*######################################################################
#
#   TRANSPOINT SOLUTIONS
#   DESIGN SYSTEM (CSS MASTER)
#
#   Versão: 1.0
#   Desenvolvido para Elementor PRO
#
#   Autor:
#   Ilson Carvalho
#
######################################################################*/



/*======================================================================
=                    IDENTIDADE VISUAL (CORES)                        =
======================================================================*/

:root{

    /*==============================================================
      CORES PRINCIPAIS
    ==============================================================*/

    --tp-primary:#071A49;
    --tp-primary-light:#0B2A78;

    --tp-secondary:#168DFF;
    --tp-secondary-hover:#2A9CFF;


    /*==============================================================
      CTA (CALL TO ACTION)
    ==============================================================*/

    --tp-accent:#F68B1F;
    --tp-accent-hover:#FF9D3A;


    /*==============================================================
      TEXTOS
    ==============================================================*/

    --tp-white:#FFFFFF;

    --tp-text:#F4F7FC;

    --tp-text-light:#D8DDE8;

    --tp-gray:#AEB7C6;


    /*==============================================================
      FUNDOS
    ==============================================================*/

    --tp-background:#071A49;

    --tp-background-light:#0B2A78;


    /*==============================================================
      BORDAS
    ==============================================================*/

    --tp-border:rgba(255,255,255,.08);


    /*==============================================================
      SOMBRAS
    ==============================================================*/

    --tp-shadow:

        0 12px 30px rgba(0,0,0,.20);

    --tp-shadow-hover:

        0 18px 40px rgba(0,0,0,.30);


    /*==============================================================
      RAIOS
    ==============================================================*/

    --tp-radius:12px;

    --tp-radius-small:8px;

    --tp-radius-large:18px;


    /*==============================================================
      ANIMAÇÕES
    ==============================================================*/

    --tp-speed:.30s;

}



/*==================================================
=            HEADER PRINCIPAL (.tp-header)          =
==================================================*/

.tp-header{

    /* Layout */
    width:100%;
    min-height:88px;

    display:flex;
    align-items:center;
    justify-content:center;

    /* Fundo */

    background:rgba(7,20,73,.96);

    /* Efeito Glass */

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    /* Borda */

    border-bottom:1px solid rgba(255,255,255,.06);

    /* Sombra */

    box-shadow:
        0 8px 30px rgba(0,0,0,.18);

    /* Transição */

    transition:

        background .35s ease,

        box-shadow .35s ease,

        min-height .35s ease,

        backdrop-filter .35s ease;

    /* Sempre acima */

    z-index:9999;

}
/*================================================
  HEADER MOBILE
================================================*/

@media (max-width: 767){

    /* aqui entram os ajustes */
    .tp-header{
    padding:10px 10px;
}
.tp-header .tp-logo{
    max-width:100px;
}
.tp-header .tp-menu{
    order:2;
}
.tp-header .tp-buttons{
    gap:2px;
}


}




/*----------------------------------------------------------------------
  LOGO
----------------------------------------------------------------------*/

.tp-logo{

    transition:all var(--tp-speed);

}

.tp-logo img{

    height:58px;

    width:auto;

    transition:all var(--tp-speed);

}

.tp-logo:hover{

    transform:scale(1.05);

}

.tp-logo:hover img{

    filter:

        drop-shadow(0 0 8px rgba(22,141,255,.45));

}





/*----------------------------------------------------------------------
  MENU PRINCIPAL
----------------------------------------------------------------------*/

.tp-menu{

    font-size:15px;

    font-weight:600;

}

.tp-menu a{

    color:var(--tp-text-light) !important;

    text-decoration:none;

    padding:12px 6px;

    transition:all var(--tp-speed);

    position:relative;

}

/* Hover */

.tp-menu a:hover{

    color:var(--tp-white) !important;

}

/* Linha inferior */

.tp-menu a::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:-6px;

    width:0;

    height:2px;

    background:var(--tp-secondary);

    transition:all .30s;

    transform:translateX(-50%);

}

.tp-menu a:hover::after{

    width:100%;

}

/* Item ativo */

.tp-menu .current-menu-item a,

.tp-menu .current_page_item a,

.tp-menu .elementor-item-active{

    color:var(--tp-white) !important;

    font-weight:700;

}

.tp-menu .current-menu-item a::after,

.tp-menu .current_page_item a::after,

.tp-menu .elementor-item-active::after{

    width:100%;

}

/* Espaçamento entre itens */

.tp-menu li{

    margin:0 12px;

}

.tp-menu a{

    transition:

     color .30s,

        transform .30s;

}

.tp-menu a:hover{

    transform:translateY(-2px);

}







/*----------------------------------------------------------------------
  BOTÃO ENTRAR
----------------------------------------------------------------------*/

.tp-btn-login .elementor-button{

    background:var(--tp-secondary) !important;

    color:var(--tp-white) !important;

    border:none !important;

    border-radius:10px;

    padding:12px 26px;

    font-size:15px;

    font-weight:600;

    transition:all var(--tp-speed);

    box-shadow:0 8px 18px rgba(22,141,255,.20);

}

/* Hover */

.tp-btn-login .elementor-button:hover{

    background:var(--tp-secondary-hover) !important;

    color:var(--tp-white) !important;

    transform:translateY(-2px);

    box-shadow:0 12px 28px rgba(22,141,255,.35);

}


/*----------------------------------------------------------------------
  BOTÃO COMPRAR
----------------------------------------------------------------------*/

.tp-btn-buy .elementor-button{

    background:linear-gradient(
        135deg,
        var(--tp-accent),
        var(--tp-accent-hover)
    );

    color:var(--tp-white);

    border:none;

    border-radius:10px;

    padding:12px 34px;

    font-size:15px;

    font-weight:700;

    transition:all var(--tp-speed);

    box-shadow:0 8px 18px rgba(246,139,31,.25);

}


/* Hover */

.tp-btn-buy .elementor-button:hover{

    transform:translateY(-2px);

    filter:brightness(1.05);

    box-shadow:

        0 12px 28px rgba(246,139,31,.35);

}





/*----------------------------------------------------------------------
  HEADER STICKY
----------------------------------------------------------------------*/

/* Em desenvolvimento */





/*----------------------------------------------------------------------
  HEADER MOBILE
----------------------------------------------------------------------*/

/* Em desenvolvimento */






/*======================================================================
=                           HERO - S1                                =
======================================================================*/






/*======================================================================
=                         RECURSOS - S2                              =
======================================================================*/






/*======================================================================
=                        BENEFÍCIOS - S3                             =
======================================================================*/






/*======================================================================
=                           PLANOS - S4                              =
======================================================================*/






/*======================================================================
=                        DEPOIMENTOS - S5                            =
======================================================================*/






/*======================================================================
=                             FAQ - S7                               =
======================================================================*/






/*======================================================================
=                           CTA FINAL - S8                           =
======================================================================*/






/*======================================================================
=                      BARRA DE CONFIANÇA - S9                        =
======================================================================*/











/*=========================================================
=
=            TRANSPOINT UI KIT
=                 FOOTER
=
=========================================================*/

:root{

    /* FOOTER */

    --tp-footer-bg:#07184A;
    --tp-footer-bg2:#091F5D;

    --tp-footer-border:rgba(255,255,255,.08);

    --tp-footer-title:#2EB6FF;

    --tp-footer-text:#D9E4FF;

    --tp-footer-link:#FFFFFF;

    --tp-footer-link-hover:#2EB6FF;

    --tp-footer-icon:#2EB6FF;

    --tp-footer-icon-bg:rgba(46,182,255,.08);

    --tp-footer-icon-hover:#FF9E2C;

    --tp-footer-divider:rgba(255,255,255,.10);

}





/*======================================================================
=                         RESPONSIVIDADE                             =
======================================================================*/

@media(max-width:1024px){

}

@media(max-width:767px){

}


/*=========================================================
=
=          CONTAINER PRINCIPAL
=
=========================================================*/

.tp-footer{

    background:linear-gradient(
        180deg,
        var(--tp-footer-bg),
        var(--tp-footer-bg2)
    );

    color:var(--tp-footer-text);

    position:relative;

    overflow:hidden;

    padding:10px 0 0px;

    border-top:2px solid rgba(255,255,255,.08);

}

/*=========================================================
=
=          WRAPPER
=
=========================================================*/

.tp-footer-wrapper{

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

    gap:0px;

    flex-wrap:nowrap;

}


/*=========================================================
=
=          COLUNAS
=
=========================================================*/

.tp-footer-brand{

    flex:1.35;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

    align-items:flex-start;

}


.tp-footer-products{

    flex:0.90;
    

}

.tp-footer-company{

    flex:0.95;
    
    

}

.tp-footer-support{

    flex:0.95;
    

}

.tp-footer-contact{

    flex:1.05;
    min-width:260px;

}

.tp-footer-products{

    border-left:1px solid rgba(255,255,255,.12);

    padding-left:12px;

}

.tp-footer-company{

    border:none;

    padding-left:1px;

}

.tp-footer-support{

    border:none;

    padding-left:12px;

}

.tp-footer-contact{

    border-left:1px solid rgba(255,255,255,.12);

    padding-left:12px;

}

    padding-left:12px;

    border-left:1px solid var(--tp-footer-divider);

}

.tp-footer-brand{

    flex:1.45;

}

.tp-footer-products{

    flex:1;

}

.tp-footer-company{

    flex:1;

}

.tp-footer-support{

    flex:1;

}

.tp-footer-contact{

    flex:1;

}

.tp-footer-wrapper{

    align-items:flex-start;

}

.tp-footer-brand{

    align-self:flex-start;

}



/*=========================================================
= LINKS
=========================================================*/

.tp-footer-nav a,
.tp-footer-contact-list a{

    color:#D5DDF2;

    text-decoration:none !important;

    font-size:10px;

    font-weight:400;

    line-height:1.75;

    transition:all .30s ease;
    white-space:nowrap;

}

.tp-footer-nav a:hover,
.tp-footer-contact-list a:hover{

    color:var(--tp-primary);
    

}

/*=========================================================
=
=          LOGO PRINCIPAL
=
=========================================================*/

.tp-footer-logo{

    width:195px;

    max-width:200px;

}

.tp-footer-logo img{

    width:100%;

    display:block;

    height:auto;

    margin-bottom:0px;
    
    font-size:12px;

}


/*=========================================================
=
=          LOGO DESENVOLVIDO POR
=
=========================================================*/

.tp-footer-dev{

    display:flex;

    align-items:center;

    gap:10px;

}

.tp-footer-dev-logo{

    width:30px;

    flex-shrink:0;

}

.tp-footer-dev-logo img{

    width:100%;

    height:auto;

    display:block;

}

.tp-footer-dev-text{

    font-size:12px;

    line-height:1.5;

    color:#C9D9FF;

}


/*=========================================================
=
=          TIPOGRAFIA FOOTER
=
=========================================================*/

/* Texto institucional */

.tp-footer-brand-text{

    font-size:15px;

    line-height:1.65;

    max-width:260px;

    margin:10px 0 18px;

}
.tp-footer-copy{

    font-size:13px;

    color:#B7C7F4;

}

.tp-footer-dev-text{

    font-size:13px;

    line-height:1.0;

    color:#B7C7F4;

}

/*=========================================================*/

/* Títulos das colunas */

.tp-footer-col-title{

    font-size:22px;

    font-weight:700;

    color:#38B8FF;

    text-transform:uppercase;

    letter-spacing:.6px;

    margin-bottom:20px;

}

/*=========================================================*/

/* Navegação */

.tp-footer-nav{

    display:flex;

    flex-direction:column;

    gap:12px;

}

/* Links */

.tp-footer-nav a{

    color:#F5F8FF;

    text-decoration:none;

    font-size:12px;

    font-weight:400;

    transition:.30s;

    position:relative;

}

.tp-footer-nav a:hover{

    color:#38B8FF;

    padding-left:8px;

}

/*=========================================================*/

/* Contatos */

.tp-footer-contact-list{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.tp-footer-contact-list a{

    color:#F5F8FF;

    text-decoration:none;

    font-size:12px;

    transition:.30s;

}

.tp-footer-contact-list a:hover{

    color:#38B8FF;

}

/*=========================================================
= LINHA DIVISÓRIA
=========================================================*/

.tp-footer-bottom{

    margin-top:5px;
    padding-top:12px;
    border-top:1px solid rgba(255,255,255,.10);
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:0px;
    padding:10px 0 1px;
    

}

/*=========================================================
=    ÍCONES SOCIAIS
=========================================================*/
.tp-footer-social{

    display:flex;

    gap:12px;

    margin-top:18px;

    margin-bottom:0;

}

.tp-footer-social a{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid rgba(64,181,255,.35);

    border-radius:50%;

    color:#67D0FF;

    font-size:18px;

    transition:.30s;

}

.tp-footer-social a:hover{

    background:#2196F3;

    border-color:#2196F3;

    color:#FFF;

    transform:translateY(-3px);

    box-shadow:0 10px 20px rgba(33,150,243,.35);

}































































































/* ===== S5 - PLANOS E LICENCIAMENTO — CSS COMPLEMENTAR ===== */

/* Iluminação azul sutil ao centro da seção */
.tp-s5-section {
    position: relative;
    overflow: hidden;
}
.tp-s5-section::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 900px;
    height: 900px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(20,156,255,0.18) 0%, rgba(20,156,255,0) 70%);
    pointer-events: none;
    z-index: 0;
}

/* Destaque da palavra "PLANO IDEAL" no título */
.tp-highlight {
    color: #149CFF;
}

/* Linha de cards */
.tp-cards-row {
    position: relative;
    z-index: 1;
}

/* Card padrão */
.tp-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    width: 33%;
}

/* Card em destaque (Plano Anual) */
.tp-card-highlight {
    position: relative;
    background-color: #072357 !important;
    transform: scale(1.01);
}

/* Selo "MAIS VENDIDO" no topo do card destaque */
.tp-card-highlight > .elementor-widget-text-editor:first-child {
    position: relative;
    margin-top: -30px;
    display: inline-block;
    padding: 9px 20px;
    border-radius: 10px;
    background: linear-gradient(90deg, #0E74FF, #005BFF);
    color: #FFFFFF;
    font-weight: 700;
    font-size: 15px;
    align-self: center;
}

/* Linha de preço */
.tp-price-row {
    line-height: 1;
}

/* Nota inferior (selo de garantia) */
.tp-footer-note {
    margin-top: 20px;
}

/* ===== RESPONSIVIDADE ===== */

/* TABLET */
@media (max-width: 1024px) {
    .tp-cards-row {
        flex-direction: column !important;
    }
    .tp-card {
        width: 100% !important;
    }
    .tp-card-highlight {
        order: -1; /* Anual continua em destaque/topo */
    }
}

/* MOBILE */
@media (max-width: 767px) {
    .tp-cards-row {
        flex-direction: column !important;
        gap: 30px !important;
    }
    .tp-card {
        width: 100% !important;
        min-height: auto !important;
        padding: 30px !important;
    }
    .tp-card .elementor-heading-title {
        font-size: 24px !important;
    }
    .tp-price-row .elementor-heading-title {
        font-size: 42px !important;
    }
    .tp-card .elementor-button {
        width: 100% !important;
    }
    .tp-footer-note {
        width: 90% !important;
        flex-direction: column;
        text-align: center;
    }
}
/* ===== DESTAQUE CARD ANUAL ===== */

.tp-card-highlight{
    transform: scale(0.85);
    z-index: 10;

    box-shadow:
    0 0 20px rgba(20,156,255,.35),
    0 0 40px rgba(20,156,255,.20),
    inset 0 0 0 1px rgba(20,156,255,.60);
}
/* ===== SELO MAIS VENDIDO ===== *//* End custom CSS */