/*
Theme Name:     Mancini Services
Theme URI:      n/a
Template:       kadence
Author:         comodolab
Author URI:     n/a
Description:    Child Theme Description
Version:        1.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/

:root {
    --giallo: #ffc71c;
    --nero: #000000;
    --bianco: #ffffff;
    --grigiochiaro: #f8f8f8;
}

/*--------------------------------------------------------------
# Slider
--------------------------------------------------------------*/
.mancini-border {
    position: relative;
}
.mancini-border::before {
    content: '';
    display: block;
    width: 0%;
    height: 4px;
    position: absolute;
    top: 0;
    left: -20px;
    transform: rotate(90deg);
    transform-origin: 0% 0%;
    background-color: var(--giallo);
    animation: borderwidth 4s linear forwards;
}
@keyframes borderwidth {
    from {
      width: 0%;
    }
    to {
        width: 100%;
    }
  }

/*--------------------------------------------------------------
# Intro home
--------------------------------------------------------------*/
.mancini-intro-home,
.mancini-home-usato {
    position: relative;
}
.mancini-scroller {
    white-space: nowrap;  /* Impedisce al testo di andare a capo */
    font-size: 25vw;
    line-height: .1;
    position: absolute;
    bottom: 10%;
    color: var(--grigiochiaro);
}


/*--------------------------------------------------------------
# Newsletter
--------------------------------------------------------------*/
.mancini-newsletter {
    position: relative;
    overflow: hidden;
}
.mancini-newsletter::before {
    content: 'Newsletter';
    position: absolute;
    bottom: -54px;
    font-size: 13vw;
    font-weight: 600;
    letter-spacing: 1vw;
    line-height: 1;
    opacity: .3;
    text-transform: uppercase;
    color: var(--giallo);
    white-space: nowrap; /* Assicura che il testo rimanga in una sola riga */
    animation: scroll-left 40s linear infinite; /* Applica l'animazione */
}
@keyframes scroll-left {
    0% {
        transform: translateX(100%); /* Parte da destra, completamente fuori dal contenitore */
    }
    100% {
        transform: translateX(0%); /* Si muove tutto a sinistra fino a uscire completamente */
    }
}


/*--------------------------------------------------------------
# Arrows Kadence slider
--------------------------------------------------------------*/
.kb-splide .splide__arrow {
    background: var(--giallo);
    width: 3rem;
}

.kb-splide .splide__arrow:focus,
.kb-splide .splide__arrow:hover {
    background: var(--giallo);
}