/* Professional barber background effects */
.barber-hero-bg {
    position: relative;
    overflow: hidden;
}

.barber-hero-bg::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(
            circle at 25% 25%,
            rgba(212, 175, 55, 0.06) 0%,
            transparent 40%
        ),
        radial-gradient(
            circle at 75% 75%,
            rgba(205, 133, 63, 0.04) 0%,
            transparent 35%
        ),
        radial-gradient(
            circle at 50% 10%,
            rgba(139, 69, 19, 0.03) 0%,
            transparent 50%
        ),
        radial-gradient(
            circle at 10% 90%,
            rgba(160, 82, 45, 0.05) 0%,
            transparent 30%
        );
    animation: subtleMove 25s ease-in-out infinite;
    z-index: 1;
}

.barber-hero-bg::after {
    content: '';
    position: absolute;
    top: 10%;
    right: 10%;
    width: 200px;
    height: 200px;
    background: 
        radial-gradient(circle, 
            rgba(212, 175, 55, 0.08) 0%, 
            rgba(205, 133, 63, 0.04) 40%, 
            transparent 70%
        );
    animation: gentlePulse 8s ease-in-out infinite;
    z-index: 1;
    border-radius: 50%;
}

.barber-hero-content {
    position: relative;
    z-index: 10;
}

/* Subtle pattern movement */
@keyframes subtleMove {
    0% {
        transform: translateX(0) translateY(0);
    }
    25% {
        transform: translateX(10px) translateY(-5px);
    }
    50% {
        transform: translateX(0) translateY(-10px);
    }
    75% {
        transform: translateX(-10px) translateY(-5px);
    }
    100% {
        transform: translateX(0) translateY(0);
    }
}

/* Gentle pulse effect */
@keyframes gentlePulse {
    0%, 100% {
        opacity: 0.1;
        transform: scale(1);
    }
    50% {
        opacity: 0.2;
        transform: scale(1.1);
    }
}

/* Floating scissors animation */
@keyframes floatScissors {
    0%, 100% {
        transform: translate(0, 0) rotate(0deg);
        opacity: 0.1;
    }
    25% {
        transform: translate(20px, -15px) rotate(5deg);
        opacity: 0.2;
    }
    50% {
        transform: translate(-10px, -25px) rotate(-3deg);
        opacity: 0.15;
    }
    75% {
        transform: translate(15px, -10px) rotate(2deg);
        opacity: 0.1;
    }
}

/* Floating scissors elements */
.barber-hero-bg .floating-element {
    position: absolute;
    z-index: 1;
    opacity: 0.1;
    animation: floatScissors 10s ease-in-out infinite;
}

.barber-hero-bg .floating-element:nth-child(2) {
    top: 60%;
    right: 15%;
    font-size: 80px;
    animation-delay: -2s;
}

.barber-hero-bg .floating-element:nth-child(3) {
    top: 40%;
    right: 70%;
    font-size: 60px;
    animation-delay: -4s;
}