.elementor-7148 .elementor-element.elementor-element-6e56ba5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:4%;--padding-bottom:4%;--padding-left:3%;--padding-right:3%;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}#elementor-popup-modal-7148{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-7148 .dialog-message{width:640px;height:auto;}#elementor-popup-modal-7148 .dialog-close-button{display:flex;}#elementor-popup-modal-7148 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}/* Start custom CSS for html, class: .elementor-element-a2e55fe *//* =====================================================
  CSS PERSONALIZADO PARA FORMULÁRIO DE CONTRATAÇÃO
  Cores da empresa: #263482 (azul), #8cff98 (verde), #ffffff (branco)
===================================================== */

/* =====================================================
  Tipografia base
===================================================== */
html {
    font-size: 62.5% !important;
}

body {
    font-family: 'Roboto', sans-serif !important;
}

.titulo {
    font-family: 'Roboto', sans-serif;
    font-size: 1.7rem !important;
    font-weight: 400;
    color: #222222;
    letter-spacing: 0.0195rem;
}

.titulo-topo {
    font-family: 'Roboto', sans-serif;
    font-size: 2.9rem;
    font-weight: 800;
    color: #222222;
    font-style: italic;
}

.descricao {
    font-family: 'Roboto', sans-serif;
    font-size: 1.6rem;
    font-weight: 400;
    color: #222222;
    font-style: italic;
}

.elementor-form .elementor-field-label {
  margin-bottom: 1rem;
  display: block;
  line-height: 2rem;
}


/* =====================================================
  CSS PERSONALIZADO PARA CAMPOS DE TEXTO E EMAIL
===================================================== */

/* Estilo geral para campos de input texto, email e tel */
#form-field-nomesobrenome,
#form-field-email,
#form-field-whatsapp,
#form-field-nomecondominio,
#form-field-endereco,
#form-field-cidade,
#form-field-cep,
#form-field-bairro,
#form-field-referencia {
    background: linear-gradient(145deg, #ffffff, #f8f9fa);
    border: 2px solid #e0e6ed;
    border-radius: 8px;
    padding: 12px 16px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #333;
    transition: all 0.3s ease;
    height: auto;
    min-height: unset;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
    width: 100%;
    box-sizing: border-box;
}

/* Placeholder personalizado */
#form-field-nomesobrenome::placeholder,
#form-field-email::placeholder,
#form-field-whatsapp::placeholder,
#form-field-nomecondominio::placeholder,
#form-field-endereco::placeholder,
#form-field-cidade::placeholder,
#form-field-cep::placeholder,
#form-field-bairro::placeholder,
#form-field-referencia::placeholder {
    color: #8e9aaf;
    font-style: italic;
    opacity: 0.7;
}

/* Estado hover */
#form-field-nomesobrenome:hover,
#form-field-email:hover,
#form-field-whatsapp:hover,
#form-field-nomecondominio:hover,
#form-field-endereco:hover,
#form-field-cidade:hover,
#form-field-cep:hover,
#form-field-bairro:hover,
#form-field-referencia:hover {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 4px 10px rgba(140, 255, 152, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transform: translateY(-1px);
}

/* Estado focus */
#form-field-nomesobrenome:focus,
#form-field-email:focus,
#form-field-whatsapp:focus,
#form-field-nomecondominio:focus,
#form-field-endereco:focus,
#form-field-cidade:focus,
#form-field-cep:focus,
#form-field-bairro:focus,
#form-field-referencia:focus {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 5px 15px rgba(140, 255, 152, 0.15),
        0 0 0 3px rgba(140, 255, 152, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
    outline: none;
}

/* =====================================================
  CSS PERSONALIZADO PARA BOTÕES RADIO
===================================================== */

/* Container das opções radio */
.elementor-field-group-residencia .elementor-field-option,
.elementor-field-group-periodo .elementor-field-option {
    font-size: 1.6rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-right: 0.8rem;
}

/* Esconde o input radio original */
.elementor-field-group-residencia input[type="radio"],
.elementor-field-group-periodo input[type="radio"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    pointer-events: none;
}

/* Estilo do label que se comporta como botão - APENAS para opções de resposta, NÃO para títulos */
.elementor-field-group-residencia .elementor-field-option label,
.elementor-field-group-periodo .elementor-field-option label {
    background-color: #f5f5f5;
    border: 2px solid #ddd;
    border-radius: 8px;
    padding: 12px 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
    min-width: 50px;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
    margin: 0;
    box-sizing: border-box;
}

/* Hover effect para os botões radio - APENAS para opções */
.elementor-field-group-residencia .elementor-field-option label:hover,
.elementor-field-group-periodo .elementor-field-option label:hover {
    background-color: #8cff98;
    border-color: #8cff98;
    color: #333;
    transform: scale(1.05);
}

/* Estado selecionado para os botões radio - APENAS para opções */
.elementor-field-group-residencia .elementor-field-option input[type="radio"]:checked + label,
.elementor-field-group-periodo .elementor-field-option input[type="radio"]:checked + label {
    background-color: #8cff98;
    border-color: #8cff98;
    color: #333;
    font-weight: 600;
}

/* =====================================================
  Estilos para os labels dos campos
===================================================== */
.elementor-form .elementor-field-label {
    margin-bottom: 1rem;
    display: block;
    line-height: 2rem;
    font-family: 'Roboto', sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: #263482;
}

/* =====================================================
  CSS ESPECÍFICO PARA NOVO FORMULÁRIO DE INDICAÇÃO DE CLIENTE
===================================================== */

/* Estilo geral para campos do formulário de indicação */
#form-field-nomecliente,
#form-field-emailcliente,
#form-field-whatsappcliente,
#form-field-nomecondominiocliente,
#form-field-ruacliente,
#form-field-cidadecliente,
#form-field-cepcliente,
#form-field-bairrocliente,
#form-field-referenciacliente {
    background: linear-gradient(145deg, #ffffff, #f8f9fa);
    border: 2px solid #e0e6ed;
    border-radius: 8px;
    padding: 12px 16px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #333;
    transition: all 0.3s ease;
    height: auto;
    min-height: unset;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
    width: 100%;
    box-sizing: border-box;
}

/* Placeholder personalizado para formulário de indicação */
#form-field-nomecliente::placeholder,
#form-field-emailcliente::placeholder,
#form-field-whatsappcliente::placeholder,
#form-field-nomecondominiocliente::placeholder,
#form-field-ruacliente::placeholder,
#form-field-cidadecliente::placeholder,
#form-field-cepcliente::placeholder,
#form-field-bairrocliente::placeholder,
#form-field-referenciacliente::placeholder {
    color: #8e9aaf;
    font-style: italic;
    opacity: 0.7;
}

/* Estado hover para formulário de indicação */
#form-field-nomecliente:hover,
#form-field-emailcliente:hover,
#form-field-whatsappcliente:hover,
#form-field-nomecondominiocliente:hover,
#form-field-ruacliente:hover,
#form-field-cidadecliente:hover,
#form-field-cepcliente:hover,
#form-field-bairrocliente:hover,
#form-field-referenciacliente:hover {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 4px 10px rgba(140, 255, 152, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transform: translateY(-1px);
}

/* Estado focus para formulário de indicação */
#form-field-nomecliente:focus,
#form-field-emailcliente:focus,
#form-field-whatsappcliente:focus,
#form-field-nomecondominiocliente:focus,
#form-field-ruacliente:focus,
#form-field-cidadecliente:focus,
#form-field-cepcliente:focus,
#form-field-bairrocliente:focus,
#form-field-referenciacliente:focus {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 5px 15px rgba(140, 255, 152, 0.15),
        0 0 0 3px rgba(140, 255, 152, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
    outline: none;
}

/* Container das opções radio para novo formulário */
.elementor-field-group-residenciacliente .elementor-field-option,
.elementor-field-group-periodocliente .elementor-field-option {
    font-size: 1.6rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-right: 0.8rem;
}

/* Esconde o input radio original do novo formulário */
.elementor-field-group-residenciacliente input[type="radio"],
.elementor-field-group-periodocliente input[type="radio"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    pointer-events: none;
}

/* Estilo do label que se comporta como botão - novo formulário */
.elementor-field-group-residenciacliente .elementor-field-option label,
.elementor-field-group-periodocliente .elementor-field-option label {
    background-color: #f5f5f5;
    border: 2px solid #ddd;
    border-radius: 8px;
    padding: 12px 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
    min-width: 50px;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
    margin: 0;
    box-sizing: border-box;
}

/* Hover effect para os botões radio - novo formulário */
.elementor-field-group-residenciacliente .elementor-field-option label:hover,
.elementor-field-group-periodocliente .elementor-field-option label:hover {
    background-color: #8cff98;
    border-color: #8cff98;
    color: #333;
    transform: scale(1.05);
}

/* Estado selecionado para os botões radio - novo formulário */
.elementor-field-group-residenciacliente .elementor-field-option input[type="radio"]:checked + label,
.elementor-field-group-periodocliente input[type="radio"]:checked + label {
    background-color: #8cff98;
    border-color: #8cff98;
    color: #333;
    font-weight: 600;
}

/* =====================================================
  CSS PERSONALIZADO PARA BOTÃO DE ENVIO DO FORMULÁRIO
===================================================== */

/* Estilo principal do botão de envio */
.elementor-form .elementor-button.elementor-size-sm,
.elementor-form .elementor-button {
    background-color: #263482; /* Azul sólido sem gradiente */
    border: none;
    border-radius: 10px;
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
    font-size: 1.9rem;
    font-weight: 600;
    letter-spacing: 0.0925;
    /*text-transform: uppercase;*/
    padding: 15px 30px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    box-shadow: 
        0 4px 15px rgba(38, 52, 130, 0.25),
        0 2px 5px rgba(0, 0, 0, 0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    outline: none;
    cursor: pointer;
    z-index: 1;
}

/* Hover effect */
.elementor-form .elementor-button:hover {
    background-color: #1e2968; /* Tom mais escuro ao passar o mouse */
    transform: translateY(-3px);
    box-shadow: 
        0 8px 20px rgba(38, 52, 130, 0.3),
        0 4px 10px rgba(38, 52, 130, 0.2);
    color: #ffffff;
}

/* Active state */
.elementor-form .elementor-button:active {
    transform: translateY(-1px);
    box-shadow: 
        0 4px 10px rgba(38, 52, 130, 0.25),
        0 2px 5px rgba(38, 52, 130, 0.15);
}

/* Adiciona ícone de seta */
.elementor-form .elementor-button .elementor-button-text:after {
    content: "→";
    margin-left: 8px;
    transition: transform 0.3s ease;
    display: inline-block;
}

.elementor-form .elementor-button:hover .elementor-button-text:after {
    transform: translateX(5px);
}

/* =====================================================
  CSS PERSONALIZADO PARA CAMPOS SELECT
===================================================== */

/* Container do select wrapper */
.elementor-field-group-bairro .elementor-select-wrapper {
    position: relative;
    background: linear-gradient(145deg, #ffffff, #f8f9fa);
    border: 2px solid #e0e6ed;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
    transition: all 0.3s ease;
    overflow: hidden;
}

/* Estado hover do wrapper */
.elementor-field-group-bairro .elementor-select-wrapper:hover {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 4px 10px rgba(140, 255, 152, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transform: translateY(-1px);
}

/* Estado focus do wrapper quando select está focado */
.elementor-field-group-bairro .elementor-select-wrapper:has(select:focus) {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 5px 15px rgba(140, 255, 152, 0.15),
        0 0 0 3px rgba(140, 255, 152, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
}

/* Estilo do select propriamente dito */
#form-field-bairro {
    background: transparent;
    border: none;
    padding: 12px 40px 12px 16px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #333;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: none;
    cursor: pointer;
}

/* Personalização da seta do select */
.elementor-field-group-bairro .select-caret-down-wrapper {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 2;
    transition: all 0.3s ease;
}

/* Estilo do ícone da seta */
.elementor-field-group-bairro .select-caret-down-wrapper svg {
    width: 16px;
    height: 16px;
    fill: #8e9aaf;
    transition: all 0.3s ease;
}

/* Efeito hover na seta */
.elementor-field-group-bairro .elementor-select-wrapper:hover .select-caret-down-wrapper svg {
    fill: #8cff98;
    transform: scale(1.1);
}

/* Efeito focus na seta */
.elementor-field-group-bairro .elementor-select-wrapper:has(select:focus) .select-caret-down-wrapper svg {
    fill: #8cff98;
    transform: scale(1.2) rotate(180deg);
}

/* Estilo das opções do select (quando suportado pelo navegador) */
#form-field-bairro option {
    background-color: #ffffff;
    color: #333;
    padding: 10px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.5rem;
}

/* =====================================================
  CSS PERSONALIZADO PARA CAMPO DE NOME DO CONDOMÍNIO (INPUT TEXT)
===================================================== */

/* Estilo específico para o campo de texto nomecondominio */
#form-field-nomecondominio {
    background: linear-gradient(145deg, #ffffff, #f8f9fa);
    border: 2px solid #e0e6ed;
    border-radius: 8px;
    padding: 12px 16px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #333;
    transition: all 0.3s ease;
    height: auto;
    min-height: unset;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
    width: 100%;
    box-sizing: border-box;
}

/* Estado hover para o campo nomecondominio */
#form-field-nomecondominio:hover {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 4px 10px rgba(140, 255, 152, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transform: translateY(-1px);
}

/* Estado focus para o campo nomecondominio */
#form-field-nomecondominio:focus {
    border-color: #8cff98;
    background: linear-gradient(145deg, #ffffff, #f0fff2);
    box-shadow: 
        0 5px 15px rgba(140, 255, 152, 0.15),
        0 0 0 3px rgba(140, 255, 152, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
    outline: none;
}

/* Placeholder personalizado */
#form-field-nomecondominio::placeholder {
    color: #8e9aaf;
    font-style: italic;
    opacity: 0.7;
}/* End custom CSS */