/* itsolar Core — Hero carousel (cross-fade background) */

.sm-hero-slides {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}

.sm-hero-slides__layer {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
    transform: scale(1.06);
    transition: opacity 1100ms cubic-bezier(.4, 0, .2, 1),
                transform 7000ms ease-out;
    will-change: opacity, transform;
}
.sm-hero-slides__layer.is-active {
    opacity: 1;
    transform: scale(1);
}

/* Dots */
.sm-hero-slides__dots {
    position: absolute;
    bottom: 1.25rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
    z-index: 3;
    pointer-events: auto;
}
.sm-hero-slides__dot {
    width: 30px;
    height: 4px;
    border-radius: 2px;
    border: none;
    background: rgba(255, 255, 255, 0.35);
    padding: 0;
    cursor: pointer;
    transition: background-color 300ms ease, width 300ms ease;
}
.sm-hero-slides__dot:hover {
    background: rgba(255, 255, 255, 0.6);
}
.sm-hero-slides__dot.is-active {
    background: #f58220;
    width: 44px;
}
.sm-hero-slides__dot:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

/* Cuando el block está dentro del wp-block-cover del hero, ajusta z-index del overlay y contenido */
.wp-block-cover.sm-hero > .wp-block-cover__background {
    z-index: 1;
}
.wp-block-cover.sm-hero > .wp-block-cover__inner-container {
    z-index: 2;
}

/* Movement reduction */
@media (prefers-reduced-motion: reduce) {
    .sm-hero-slides__layer {
        transition: opacity 600ms ease;
        transform: none !important;
    }
}