

div.landing {
    padding:var(--padding-v) var(--padding-h);
    min-height:80vh;
    display: grid;
    place-content: end center;
    .title--1{
        --max-size:48;
        --min-size:20;
    }
    .title--2{
        font-family:var(--font1);
        font-weight: var(--bold1);       
        color: var(--primary);
        --max-size: 30;
        --min-size: 20;
    }
    .landing__list .title{
        font-family: var(--font1);
        font-weight: var(--bold3);
        --max-size:28;
        --min-size:20;
        margin:0 0 1.5rem;
        display: flex;
        align-items: center;
    }
    .landing__list .title:last-child{
        margin: 0;
    }
    .landing__list .title::before{
        font-family: var(--awesome);
        margin-right: 12px;
        font-size: 1.5em;
        font-weight: 900;
        width:1.5em;
        text-align:center;
    }
    .landing__list .title:nth-child(1)::before{
        content:'\f2b5';
    }
    .landing__list .title:nth-child(2)::before{
        content:'\f336';
    }

    .landing__left{
        background: rgba(255,255,255,.75);
        padding: var(--padding-inner);
        color:var(--contrast);
        text-align: left;
        display: grid;
        place-content: center start;  
        .title--2{
            margin-bottom:1em;
        }      
    }
    .landing__right{
        background: var(--primary);
        color:var(--primary-invert);
        padding: var(--padding-inner);
        .title--2{
            color:#fff;
        }
    }
    .landing__container{
        max-width: 1120px;
    }
    .landing__img{
        display: none;
    }
    
    @media (min-width: 769px) {
        .landing__buttons .open-modal{display:none;}
        .landing__list{margin-bottom:1rem ;}
    }
    @media (max-width: 768px) {
        min-height: auto;
        padding: 0;
        background-image:none;
        .landing__img{
            display: block;
        }
       .title--1{
           background:var(--primary);
           color:#fff;
           padding: 12px 16px;
           margin: 0;
        }
        .landing__inner{
            border-bottom: 1px solid var(--contrast);
        }
        .landing__inner p{
            margin:0;
        }
        .landing__right{
            display:none;
        }
    }

    form.fluent_form_3 .wpf_has_custom_css.ff-btn-submit{
        background: var(--dark);
        color:#fff;
        border-color:var(--dark);
    }
    .fluentform .ff-text-left{
        text-align: center;
    }
    .fluentform .text-danger{
        color:#eee;
    }
}

.marquee-wrapper {
width: 100%;
    overflow: hidden;
    background: var(--primary);
    padding: 20px 0;
    display: flex;
    border-bottom:1px solid var(--contrast);
    border-top:1px solid var(--contrast);
}

.marquee-content {
display: flex;
    width: max-content; /* Importante para que no se colapse */
    animation: loop-infinito 15s linear infinite;
}

.marquee-content h4 {
    display: inline-block;
    font-family: var(--font1);
    font-weight: bold;
    margin:0;
    color: white;
    font-size: 1.35rem;
    letter-spacing: 2px;
    padding: 0 30px; /* Espacio entre palabras */
    text-transform: uppercase;
    white-space: nowrap;
}

/* El truco de la animación */
@keyframes loop-infinito {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Pausa al pasar el ratón (opcional pero profesional) */
.marquee-wrapper:hover .marquee-content {
    animation-play-state: paused;
}


