/*
Theme Name: Mas les Heures Bleues
Theme URI: https://maslesheuresbleues.fr/
Description: Thème sur mesure pour le gîte Mas Les Heures Bleues.
Author: Philippe Chieux et Célia Kinloch
Version: 1.2.1
Requires at least: 6.3
Requires PHP: 8.3
Text Domain: masheuresbleues
License: GNU General Public License v3.0 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Template: kadence
*/

@font-face {
    font-family: "Kristian Paradise";
    src: url("assets/fonts/kristian_paradise.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Source Sans 3";
    src: url("assets/fonts/SourceSans3-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Source Sans 3";
    src: url("assets/fonts/SourceSans3-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* La typographie commune se règle dans le personnalisateur Kadence. */
:where(a, button, input, select, textarea):focus-visible {
    outline: 3px solid var(--text-strong);
    outline-offset: 4px;
}

@keyframes hero-zoom-left {
    from {
        transform: scale(1.02) translate3d(0, 0, 0);
    }

    to {
        transform: scale(1.13) translate3d(-1.5%, -1%, 0);
    }
}

@keyframes hero-zoom-right {
    from {
        transform: scale(1.02) translate3d(0, 0, 0);
    }

    to {
        transform: scale(1.13) translate3d(1.5%, -1%, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-ken-burns .splide__slide .kb-bg-slide {
        animation: none !important;
        transform: none !important;
    }
}

.hero-ken-burns {
    border-bottom: 8px solid var(--brand-primary);
}
.hero-ken-burns .kb-bg-slide {
    transform: scale(1.02);
    transform-origin: center center;
    will-change: transform;
}

/* La slide active zoome progressivement */
.hero-ken-burns .splide__slide:nth-child(odd).is-active .kb-bg-slide {
    animation: hero-zoom-left 5s linear forwards;
}

.hero-ken-burns .splide__slide:nth-child(even).is-active .kb-bg-slide {
    animation: hero-zoom-right 5s linear forwards;
}