﻿/* =========================
   BASE DIVISOR PREMIUM
========================= */

.section-divider-line {
    height: 5px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

    /* Línea base animada */
    .section-divider-line::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        opacity: 0;
        transform: scaleX(0.5);
        transform-origin: center;
        animation: dividerReveal 1.2s ease forwards;
    }

    /* Brillo animado */
    .section-divider-line::after {
        content: "";
        position: absolute;
        top: 0;
        left: -35%;
        width: 35%;
        height: 3px;
        background: linear-gradient( 90deg, transparent, rgba(255,255,255,0.85), transparent );
        animation: dividerFlow 4s linear infinite;
        animation-delay: 1.2s;
    }

/* Azul */
.divider-1::before {
    background: linear-gradient( 90deg, transparent 0%, rgba(73,147,204,0.9) 30%, #4993cc 50%, rgba(73,147,204,0.9) 70%, transparent 100% );
}
/* Azul-Dorado */
.divider-2::before {
    background: linear-gradient( 90deg, transparent 0%, #4993cc 25%, #fdd757 50%, #4993cc 75%, transparent 100% );
}
/* Dorado-Verde */
.divider-3::before {
    background: linear-gradient( 90deg, transparent 0%, #fdd757 30%, #bbd000 50%, #fdd757 70%, transparent 100% );
}
/* Tricolor completo */
.divider-4::before {
    background: linear-gradient( 90deg, transparent 0%, #4993cc 20%, #fdd757 50%, #bbd000 80%, transparent 100% );
}
/* Animaciones */
@keyframes dividerReveal {
    from {
        opacity: 0;
        transform: scaleX(0.4);
    }

    to {
        opacity: 1;
        transform: scaleX(1);
    }
}

@keyframes dividerFlow {
    from {
        left: -35%;
    }

    to {
        left: 100%;
    }
}
