/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/


.neon-separator {
    position: relative;
}

/* Ligne néon fixe */
.neon-separator::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    z-index: 5;

    background: rgb(156 106 175);

    box-shadow:
        0 0 4px rgba(170, 120, 255, 0.9),
        0 0 10px rgba(145, 100, 255, 0.7),
        0 0 20px rgba(120, 80, 255, 0.5);
}

/* Highlight lumineux animé */
.neon-separator::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 34px;
    height: 34px;

    z-index: 6;
    transform: translate(-50%, -50%) rotate(-6deg);

    background:
        /* halo très diffus */
        radial-gradient(
            circle,
            rgba(255,255,255,0.75) 0%,
            rgba(235,220,255,0.45) 10%,
            rgba(200,155,255,0.18) 25%,
            rgba(175,120,255,0.06) 42%,
            transparent 68%
        ),

        /* rayon horizontal très doux */
        linear-gradient(
            90deg,
            transparent 0%,
            transparent 39%,
            rgba(225,200,255,0.03) 43%,
            rgba(255,255,255,0.18) 48%,
            rgba(255,255,255,0.55) 50%,
            rgba(255,255,255,0.16) 52%,
            rgba(225,200,255,0.03) 57%,
            transparent 63%
        ),

        /* rayon vertical encore plus discret */
        linear-gradient(
            0deg,
            transparent 0%,
            transparent 40%,
            rgba(255,255,255,0.02) 44%,
            rgba(255,255,255,0.14) 48%,
            rgba(255,255,255,0.42) 50%,
            rgba(255,255,255,0.12) 52%,
            transparent 60%
        ),

        /* diagonale très légère */
        linear-gradient(
            45deg,
            transparent 0%,
            transparent 45%,
            rgba(255,255,255,0.03) 48%,
            rgba(255,255,255,0.13) 50%,
            rgba(255,255,255,0.03) 52%,
            transparent 56%
        );

    filter:
        blur(0.6px)
        drop-shadow(0 0 3px rgba(255,255,255,0.35))
        drop-shadow(0 0 7px rgba(180,120,255,0.28));

    opacity: 0.85;

    animation: neon-flare 8s linear infinite;
}

@keyframes neon-flare {
    0% {
        left: -30px;
        opacity: 0;
        transform: translate(-50%, -50%) rotate(-12deg) scale(0.3);
    }

    15% {
        opacity: 0.25;
        transform: translate(-50%, -50%) rotate(-8deg) scale(0.4);
    }

    35% {
        opacity: 0.55;
        transform: translate(-50%, -50%) rotate(-3deg) scale(0.7);
    }

    /* Point le plus lumineux */
    52% {
        opacity: 0.8;
        transform: translate(-50%, -50%) rotate(4deg) scale(1.1);
    }

    68% {
        opacity: 0.6;
        transform: translate(-50%, -50%) rotate(9deg) scale(0.75);
    }

    85% {
        opacity: 0.3;
        transform: translate(-50%, -50%) rotate(14deg) scale(0.4);
    }

    100% {
        left: calc(100% + 30px);
        opacity: 0;
        transform: translate(-50%, -50%) rotate(18deg) scale(0.15);
    }
}