.elementor-383 .elementor-element.elementor-element-1b7ee1f{--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:60px;--padding-bottom:60px;--padding-left:0px;--padding-right:0px;}.elementor-383 .elementor-element.elementor-element-c0cc38f{--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;--margin-top:50px;--margin-bottom:80px;--margin-left:0px;--margin-right:0px;}.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-383 .elementor-element.elementor-element-7271db4{text-align:center;}.elementor-383 .elementor-element.elementor-element-7271db4 .elementor-heading-title{font-family:"Nunito Sans", Sans-serif;font-size:28px;font-weight:700;color:var( --e-global-color-7ba6ffe );}.elementor-383 .elementor-element.elementor-element-ee5fbed{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-383 .elementor-element.elementor-element-24c893d{--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:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.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-383 .elementor-element.elementor-element-1e7c0d9{font-family:"Inter", Sans-serif;font-weight:400;color:var( --e-global-color-166c8c8 );}.elementor-383 .elementor-element.elementor-element-45e4b69{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-383 .elementor-element.elementor-element-750ab3c{--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:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-383 .elementor-element.elementor-element-026c486{font-family:"Inter", Sans-serif;font-weight:400;color:var( --e-global-color-166c8c8 );}.elementor-383 .elementor-element.elementor-element-98dbc70{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-383 .elementor-element.elementor-element-c9c4700{--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:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-383 .elementor-element.elementor-element-326d0ac{font-family:"Inter", Sans-serif;font-weight:400;color:var( --e-global-color-166c8c8 );}.elementor-383 .elementor-element.elementor-element-38185d4{--display:flex;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-383 .elementor-element.elementor-element-a02759d{--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:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-383 .elementor-element.elementor-element-5f97738{font-family:"Inter", Sans-serif;font-weight:400;color:var( --e-global-color-166c8c8 );}.elementor-383 .elementor-element.elementor-element-545812d{--n-accordion-title-font-size:17px;padding:30px 0px 0px 0px;--n-accordion-title-justify-content:space-between;--n-accordion-title-flex-grow:1;--n-accordion-title-icon-order:initial;--n-accordion-item-title-space-between:10px;--n-accordion-item-title-distance-from-content:0px;--n-accordion-border-radius:10px 10px 10px 10px;--n-accordion-title-hover-color:var( --e-global-color-7ba6ffe );--n-accordion-title-active-color:#FFFFFF;--n-accordion-icon-size:15px;--n-accordion-icon-normal-color:var( --e-global-color-7ba6ffe );--n-accordion-icon-active-color:#FFFFFF;}.elementor-383 .elementor-element.elementor-element-545812d > .e-n-accordion > .e-n-accordion-item > .e-n-accordion-item-title:hover{background-color:#42B2E21F;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-3b32913 );}.elementor-383 .elementor-element.elementor-element-545812d > .e-n-accordion > .e-n-accordion-item[open] > .e-n-accordion-item-title{background-color:var( --e-global-color-7ba6ffe );}.elementor-383 .elementor-element.elementor-element-545812d {--n-accordion-padding:15px 30px 15px 30px;}:where( .elementor-383 .elementor-element.elementor-element-545812d > .e-n-accordion > .e-n-accordion-item > .e-n-accordion-item-title > .e-n-accordion-item-title-header ) > .e-n-accordion-item-title-text{font-weight:600;}:where( .elementor-383 .elementor-element.elementor-element-545812d > .e-n-accordion > .e-n-accordion-item ) > .e-con{border-style:none;--border-radius:0px 0px 0px 0px;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-383 .elementor-element.elementor-element-1b7ee1f{--content-width:1336px;}.elementor-383 .elementor-element.elementor-element-c0cc38f{--content-width:980px;}}@media(max-width:1366px){.elementor-383 .elementor-element.elementor-element-1b7ee1f{--padding-top:3%;--padding-bottom:5%;--padding-left:1%;--padding-right:1%;}.elementor-383 .elementor-element.elementor-element-c0cc38f{--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}}@media(max-width:767px){.elementor-383 .elementor-element.elementor-element-c0cc38f{--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}.elementor-383 .elementor-element.elementor-element-7271db4 .elementor-heading-title{font-size:22px;}.elementor-383 .elementor-element.elementor-element-1e7c0d9{font-size:16px;}.elementor-383 .elementor-element.elementor-element-026c486{font-size:16px;}.elementor-383 .elementor-element.elementor-element-326d0ac{font-size:16px;}.elementor-383 .elementor-element.elementor-element-5f97738{font-size:16px;}.elementor-383 .elementor-element.elementor-element-545812d{padding:10px 0px 0px 0px;--n-accordion-title-font-size:15px;}}/* Start custom CSS *//* ======================================================= */
/*      ESTILOS PREMIUM v20 - CALCULADORA LAGOON           */
/*      Desktop por Defecto / Tu CSS para Móvil            */
/* ======================================================= */

/* --- 1. ESTILOS GLOBALES (Aplican a ambos widgets) --- */
:root {
    --font-titulo: 'Nunito Sans', sans-serif;
    --font-texto: 'Josefin Sans', sans-serif;
    --color-primario: #275B9A;
    --color-acento: #1E4371;
    --color-texto-claro: #6c757d;
    --color-borde-suave: #e9ecef;
}
.elementor-widget-fluent-form-widget, #resumen-calculadora { font-family: var(--font-texto); }
.fluentform_wrapper_3 .ff-custom_html h2, .fluentform_wrapper_3 .ff-el-input--label label { font-family: var(--font-titulo); color: var(--color-acento); font-weight: 700; }
.fluentform_wrapper_3 .ff-custom_html p { font-size: 17px; line-height: 1.6; color: #555; }
.fluentform_wrapper_3 .ff-btn { font-family: var(--font-titulo); font-weight: 700 !important; text-transform: uppercase; letter-spacing: 1px; background-color: var(--color-primario) !important; color: #ffffff !important; border: none !important; border-radius: 8px !important; padding: 14px 32px !important; box-shadow: 0 4px 15px rgba(0,0,0,0.1); transition: all 0.3s ease !important; }
.fluentform_wrapper_3 .ff-btn:hover { background-color: var(--color-acento) !important; transform: translateY(-2px); box-shadow: 0 7px 20px rgba(0,0,0,0.15); }

/* --- BOTONES Y NAVEGACIÓN --- */
/* ¡CORRECCIÓN! Añadimos padding (margen) sobre los botones */
/* --- 2. ESTILO UNIFICADO DE BOTONES --- */
.fluentform_wrapper_3 .ff-btn,
#resumen-visitante .ff-btn {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-color: #275B9A !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
   padding: 14px 28px !important; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease !important;
    cursor: pointer;
     line-height: normal; /* Asegura consistencia */
}
.fluentform_wrapper_3 .ff-btn:hover,
#resumen-visitante .ff-btn:hover {
    background-color: #1E4371 !important;
    transform: translateY(-2px);
    box-shadow: 0 7px 20px rgba(0,0,0,0.15);
}
.fluentform_wrapper_3 .step-nav {
    margin-top: 40px !important;
    padding-top: 25px !important;
    border-top: 1px solid var(--color-borde-suave);
}

/* ==================================================================== */
/* --- 3. DISEÑO PARA MÓVIL (calculadora-mobile) ---                  */
/*    (Usando el código proporcionado que funciona correctamente)     */
/* ==================================================================== */


@media (max-width: 767px) {

    /* Contenedor principal del widget móvil */
    .calculadora-mobile > .elementor-widget-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Contenedor de las tarjetas */
    .calculadora-mobile .ff_el_checkable_photo_holders {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        padding: 0 8px;
        box-sizing: border-box;
        width: 100%;
    }

    /* Cada tarjeta individual */
    .calculadora-mobile .ff-el-form-check,
    .calculadora-mobile .ff-el-image-holder {
        width: 100%;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }

    .calculadora-mobile .ff-el-image-holder {
        padding: 6px;
        border: 1px solid var(--color-borde-suave);
        border-radius: 10px;
        background-color: #fff;
        transition: all 0.3s ease;
        text-align: center;
    }

    /* La imagen dentro de la tarjeta */
    .calculadora-mobile label.ff-el-image-input-src {
        height: 110px; /* Tamaño de imagen reducido */
        width: 100%;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        display: block;
        margin: 0 auto;
    }

    /* El texto y el radio button */
    .calculadora-mobile .ff-el-form-check-label {
        display: flex !important;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin-top: 8px;
        text-align: center;
    }

    .calculadora-mobile .ff-el-form-check input[type="radio"] {
        margin: 0;
        transform: translateY(1px);
    }

    .calculadora-mobile .ff-el-form-check-label span {
        font-size: 11px !important;
        font-weight: 600;
        color: var(--color-acento);
        line-height: 1.2;
    }
    
    /* El efecto de selección en móvil */
    .calculadora-mobile .ff_item_selected {
        border: 2px solid var(--color-primario) !important;
        box-shadow: 0 0 10px rgba(39, 91, 154, 0.15);
        transform: scale(1.02);
    }
    
    /* Títulos de los pasos más pequeños en móvil */
    .fluentform_wrapper_3 .ff-custom_html h2 {
        font-size: 20px !important;
    }
}

/* Por defecto, ocultamos los bloques dinámicos */
.bloque-logueado,
.bloque-visitante {
    display: none;
}

/* Si el usuario NO está logueado, mostramos el bloque para visitantes */
body:not(.logged-in) .bloque-visitante {
    display: block !important;
}

/* Si el usuario SÍ está logueado, mostramos los bloques para registrados */
body.logged-in .bloque-logueado {
    display: block !important;
}

/* --- 4. RESUMEN LATERAL --- */
#resumen-calculadora { background-color: #ffffff; border: 1px solid var(--color-borde-suave); border-radius: 12px; box-shadow: 0 15px 40px rgba(0,0,0,0.08); padding: 25px; position: sticky; top: 120px; }
#resumen-calculadora h3 { font-family: var(--font-titulo); font-size: 24px; font-weight: 700; color: var(--color-acento); text-align: center; margin-top: 0; margin-bottom: 25px; }
.resumen-linea { display: flex; flex-direction: column; margin-bottom: 18px; border-bottom: 1px solid var(--color-borde-suave); padding-bottom: 18px; }
.resumen-linea:last-of-type { border-bottom: none; }
.resumen-linea span:first-child { font-family: var(--font-texto); font-size: 15px; color: var(--color-texto-claro); margin-bottom: 5px; }
.resumen-linea span:last-child { font-family: var(--font-titulo); font-size: 17px; font-weight: 600; color: var(--color-acento); }
.resumen-total { text-align: center; margin-top: 20px; padding-top: 20px; border-top: 2px solid var(--color-primario); }
.resumen-total span:first-child { font-family: var(--font-titulo); font-weight: 600; color: var(--color-acento); font-size: 20px; display: block; margin-bottom: 5px; }
#resumen-total-valor { font-family: var(--font-titulo); font-weight: 800; color: var(--color-primario); font-size: 36px; line-height: 1.1; }
.aviso-resumen { font-family: var(--font-texto); font-size: 13px; color: var(--color-texto-claro); text-align: center; margin-top: 25px; }


/* Corrección del Resumen en Móvil */
@media (max-width: 991px) {
    #resumen-calculadora {
        position: static !important;
        margin-top: 40px;
        box-shadow: none;
        border-width: 2px;
    }
}

@media (max-width: 767px) {
    .fluentform_wrapper_3 .ff-custom_html h2 { font-size: 20px !important; }
}

/* ======================================================= */
/*      7. ESTILOS DE LA BARRA DE PROGRESO                 */
/* ======================================================= */

/* Contenedor principal del encabezado del paso */
.fluentform_wrapper_3 .ff-step-header {
    margin-bottom: 35px; /* Damos más espacio debajo de la barra */
    border-bottom: 1px solid var(--color-borde-suave);
    padding-bottom: 25px;
}

/* Texto "Paso X de X" */
.fluentform_wrapper_3 .ff-el-progress-status {
    font-family: var(--font-texto);
    color: var(--color-texto-claro);
    font-size: 14px;
    margin-bottom: 10px;
    text-align: left; /* Aseguramos la alineación */
}

/* El "carril" o fondo de la barra de progreso */
.fluentform_wrapper_3 .ff-el-progress {
    height: 12px; /* Un grosor moderno */
    background-color: #e9ecef; /* Un gris muy suave */
    border-radius: 50px; /* Bordes totalmente redondeados */
    overflow: hidden; /* Importante para que la barra de adentro herede los bordes */
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
}

/* La barra de progreso azul (el relleno) */
.fluentform_wrapper_3 .ff-el-progress-bar {
    background-color: var(--color-primario); /* Usamos tu color de marca */
    border-radius: 50px;
    transition: width 0.4s ease-in-out; /* Animación suave al avanzar */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* El texto del porcentaje ("80%") */
.fluentform_wrapper_3 .ff-el-progress-bar span {
    color: #ffffff;
    font-family: var(--font-titulo);
    font-weight: 700;
    font-size: 10px;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2); /* Sombra para que resalte */
}

/* --- Ajustes para Móvil --- */
@media (max-width: 767px) {
    .fluentform_wrapper_3 .ff-step-header {
        margin-bottom: 25px;
        padding-bottom: 20px;
    }
    
    .fluentform_wrapper_3 .ff-el-progress {
        height: 10px; /* Un poco más fina en móvil */
    }
}/* End custom CSS */