.elementor-3292 .elementor-element.elementor-element-4fe8990{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.78;--overlay-mix-blend-mode:multiply;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-3292 .elementor-element.elementor-element-4fe8990:not(.elementor-motion-effects-element-type-background), .elementor-3292 .elementor-element.elementor-element-4fe8990 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1F7A63;}.elementor-3292 .elementor-element.elementor-element-4fe8990::before, .elementor-3292 .elementor-element.elementor-element-4fe8990 > .elementor-background-video-container::before, .elementor-3292 .elementor-element.elementor-element-4fe8990 > .e-con-inner > .elementor-background-video-container::before, .elementor-3292 .elementor-element.elementor-element-4fe8990 > .elementor-background-slideshow::before, .elementor-3292 .elementor-element.elementor-element-4fe8990 > .e-con-inner > .elementor-background-slideshow::before, .elementor-3292 .elementor-element.elementor-element-4fe8990 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://traventisjourneys.com/wp-content/uploads/2026/07/photo-1603376277241-70b32265cf10-scaled.webp");--background-overlay:'';background-position:center center;background-repeat:no-repeat;background-size:cover;}/* Start custom CSS for html, class: .elementor-element-f44577c *//*=========================================
    ENCUESTA TRAVENTIS
=========================================*/

:root{

    --primary:#0077D8;
    --primary-hover:#005CB3;
    --background:#F4F7FB;
    --card:#FFFFFF;
    --text:#2E3A59;
    --border:#E4EAF2;
    --shadow:0 15px 45px rgba(0,0,0,.08);

}

#step5 {

    width:700px;

}

/**********************************
GENERAL
**********************************/

#traventisSurvey{

    max-width:1000px;
    margin:40px auto;
    background:var(--card);
    border-radius:18px;
    overflow:hidden;
    box-shadow:var(--shadow);
    font-family:Poppins,sans-serif;
    color:var(--text);

}

/**********************************
PROGRESS
**********************************/

.survey-progress{

    width:100%;
    height:10px;
    background:#E9EEF5;

}

.survey-progress-bar{

    width:0%;
    height:100%;
    background:linear-gradient(90deg,#E53935,#FB8C00);
    transition:.4s;

}

/**********************************
PASOS
**********************************/

.survey-step{

    display:none;
    padding:80px;

    animation:fade .35s ease;

}

.survey-step.active{

    display:block;

}

@keyframes fade{

from{

opacity:0;
transform:translateY(25px);

}

to{

opacity:1;
transform:translateY(0);

}

}

/**********************************
LOGO
**********************************/

.survey-logo{

    display:none;
    margin:auto;
    max-width:220px;
    margin-bottom:30px;

}

/**********************************
TEXTOS
**********************************/

#traventisSurvey h1{

    font-size:34px;
    font-weight:700;
    text-align:center;
    margin-bottom:5px;

}

#traventisSurvey h2{

    font-size:25px;
    text-align:center;
    margin-bottom:25px;
    color: #1F7A63;

}

#traventisSurvey p{

    text-align:center;
    line-height:1.8;

}

.step-number{

    display:block;
    text-align:center;
    color:#8B98A9;
    margin-bottom:20px;
    font-size:14px;

}

small{

    display:block;
    text-align:center;
    margin-top:15px;
    color:#777;

}

/**********************************
BOTONES
**********************************/

.survey-btn{

    display:block;
    margin:40px auto 0;
    border:none;
    padding:16px 45px;
    background:#1F7A63;
    color:#FFF;
    border-radius:50px;
    cursor:pointer;
    font-size:16px;
    transition:.3s;

}

.survey-btn:hover{

    background:#1F5A13;
    transform:translateY(-3px);

}

/**********************************
CARITAS
**********************************/

#traventisSurvey .emoji-grid{

    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:10px;

}

#traventisSurvey .emoji-card{

    border:2px solid var(--border);
    border-radius:16px;
    padding:25px;
    cursor:pointer;
    transition:.35s;
    text-align:center;
    background:#FFF;

}

#traventisSurvey .emoji-card:hover{

    transform:translateY(-8px);
    border-color:#1F7A63;
    box-shadow:0 12px 35px rgba(0,119,216,.15);

}

#traventisSurvey .emoji-card.active{

    background:#EDF7FF;
    border-color:var(--primary);

}

#traventisSurvey .emoji{

    font-size:60px;
    margin-bottom:15px;

}

#traventisSurvey .emoji-card span{

    display:block;
    font-weight:600;

}

/**********************************
RATING
**********************************/

/**********************************
CARRUSEL CALIFICACIONES
**********************************/

.rating-carousel{

    position:relative;

    overflow:hidden;

    min-height:220px;

    margin-top:25px;

}


.rating-slide{

    display:none;

    text-align:center;

    animation:fadeSlide .35s ease;

}


.rating-slide.active{

    display:block;

}


.rating-slide h3{

    font-size:25px;

    margin-bottom:1px;

    color:var(--text);

}


.rating-slide p{

    max-width:550px;

    margin:0 auto 35px;

    line-height:1.8;

    color:#777;

}


/**********************************
ESTRELLAS
**********************************/

.rating-slide .stars{

    display:flex;

    justify-content:center;

    gap:12px;

    margin-top:25px;

}


.rating-slide .star{

    font-size:45px;

    color:#D9D9D9;

    cursor:pointer;

    transition:.25s;

}


.rating-slide .star:hover{

    transform:scale(1.25);

}


.rating-slide .star.active{

    color:#FFC107;

}


/**********************************
BOTONES
**********************************/

.survey-actions{

    display:flex;

    justify-content:space-between;

    gap:20px;

    margin-top:20px;

}


.survey-actions .survey-btn{

    margin:0;

    flex:1;

}


/**********************************
ANIMACION
**********************************/

@keyframes fadeSlide{

    from{

        opacity:0;

        transform:translateX(30px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}


/**********************************
RESPONSIVE
**********************************/

@media(max-width:768px){

.rating-slide h3{

font-size:24px;

}

.rating-slide .star{

font-size:42px;

}

.survey-actions{

flex-direction:column;

}

}

.rating-item label{

    font-weight:600;

}

.stars{

    display:flex;
    gap:10px;

}

.star{

    font-size:34px;
    cursor:pointer;
    color:#D5D5D5;
    transition:.25s;

}

.star:hover{

    transform:scale(1.15);

}

.star.active{

    color:#FFC107;

}

/**********************************
TEXTAREA
**********************************/

textarea{

    width:100%;
    border:2px solid var(--border);
    border-radius:15px;
    padding:18px;
    resize:none;
    font-size:15px;
    outline:none;
    transition:.3s;

}

textarea:focus{

    border-color:var(--primary);

}

/**********************************
NPS
**********************************/

.nps{

    display:grid;
    grid-template-columns:repeat(11,1fr);
    gap:10px;

}

.nps button{

    height:55px;
    border:none;
    border-radius:12px;
    background:#F3F6FA;
    cursor:pointer;
    transition:.25s;
    font-weight:600;

}

.nps button:hover{

    background:var(--primary);
    color:#FFF;

}

.nps button.active{

    background:var(--primary);
    color:#FFF;

}

/**********************************
RADIOS
**********************************/

.radioGroup{

    display:flex;
    justify-content:center;
    gap:50px;
    margin:35px 0;

}

.radioGroup label{

    cursor:pointer;
    font-size:18px;

}

.radioGroup input{

    margin-right:10px;

}

/**********************************
SUCCESS
**********************************/

.success{

    text-align:center;
    padding:50px 0;

}

.success-icon{

    font-size:65px;
    margin-bottom:20px;

}

/**********************************
RESPONSIVE
**********************************/

@media(max-width:768px){

.survey-step{

padding:35px;

}

.emoji-grid{

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

}

.rating-item{

flex-direction:column;
align-items:flex-start;
gap:15px;

}

.nps{

grid-template-columns:repeat(6,1fr);

}

#traventisSurvey h1{

font-size:28px;

}

#traventisSurvey h2{

font-size:24px;

}

}

@media(max-width:480px){

.emoji-grid{

grid-template-columns:1fr;

}

.nps{

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

}

.survey-logo{

max-width:170px;

}

}/* End custom CSS */