/* especifico da pagina */

header{
    background-image: url(../img/bg-espera.webp);
}

header .container .form .logo-lockup {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: nowrap;
}

header .container .form .logo-lockup .logo {
    width: 60%;
    max-width: 280px;
    height: auto;
}

header .container .form .logo-lockup .logo-version {
    font-size: 1.08em;
    font-weight: 600;
    color: #FCFCFC;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1;
}

.depoimentos-texto .container {
    gap: 14px;
}

.depoimentos-texto .container .carousel-shell {
    width: calc(100% + 120px);
    overflow: hidden;
    margin: 4px -60px 0 -60px;
    position: relative;
}

.depoimentos-texto .container .carousel-shell::before,
.depoimentos-texto .container .carousel-shell::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 96px;
    z-index: 2;
    pointer-events: none;
}

.depoimentos-texto .container .carousel-shell::before {
    left: 0;
    background: linear-gradient(90deg, #F3F6FF 0%, rgba(243, 246, 255, 0) 100%);
}

.depoimentos-texto .container .carousel-shell::after {
    right: 0;
    background: linear-gradient(270deg, #F3F6FF 0%, rgba(243, 246, 255, 0) 100%);
}

.depoimentos-texto .container .items {
    display: flex;
    flex-wrap: nowrap;
    gap: 18px;
    width: max-content;
    margin-top: 0;
    justify-content: flex-start;
    animation: depoimentos-scroll 42s linear infinite;
}

.depoimentos-texto .container .items .item {
    flex: 0 0 430px;
}

.depoimentos-texto .container .items .item img {
    border-radius: 14px;
    display: block;
    box-shadow: 0 20px 45px rgba(34, 34, 34, .12);
}

.depoimentos-texto .container .carousel-shell:hover .items {
    animation-play-state: paused;
}

@keyframes depoimentos-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-50% - 12.5px));
    }
}

@media only screen and (max-width: 760px){
    header{
        background-image: url(../img/bg-espera-mob.webp);
    }

    header .container .form .logo-lockup {
        gap: 8px;
    }

    header .container .form .logo-lockup .logo {
        width: 55%;
        max-width: 230px;
    }

    header .container .form .logo-lockup .logo-version {
        font-size: 1em;
    }

    .depoimentos-texto .container .carousel-shell {
        width: calc(100% + 32px);
        margin: 0 -16px;
    }

    .depoimentos-texto .container .carousel-shell::before,
    .depoimentos-texto .container .carousel-shell::after {
        width: 20px;
    }

    .depoimentos-texto .container .items {
        gap: 14px;
        margin-top: 0;
        animation-duration: 28s;
    }

    .depoimentos-texto .container .items .item {
        flex: 0 0 320px;
    }
}