/* public/css/hero.css */

.hero-section {
    position: relative;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #0b0b0b;
}

.hero-section::before,
.hero-section::after {
    content: "";
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
    opacity: 0;
    animation: heroSlideshow 12s infinite ease-in-out;
    filter: brightness(0.4);
}

.hero-section::before {
    background-image: url('/images/SLM09290.JPG');
}

.hero-section::after {
    background-image: url('/images/SLM09249.JPG');
    animation-delay: 6s;
}

@keyframes heroSlideshow {

    0%,
    100% {
        opacity: 0;
        transform: scale(1.05);
    }

    10%,
    50% {
        opacity: 1;
        transform: scale(1);
    }

    60% {
        opacity: 0;
    }
}