/* Club Page Specific Styles */

/* Hero Background Image */
#club-hero .hero-bg {
    background-image: url('../img/club.jpg');
    background-position: 30% center;
    filter: sepia(25%) contrast(120%) brightness(85%) saturate(80%);
}

/* Mobile Background Positioning */
@media (max-width: 768px) {
    #club-hero .hero-bg {
        background-position: 25% center !important;
    }
}

/* Vintage Grain Effect */
#club-hero .grain-effect {
    background-image: 
        radial-gradient(circle at 15% 25%, transparent 0.5%, rgba(139,69,19,0.4) 1%, transparent 1.5%),
        radial-gradient(circle at 85% 75%, transparent 0.5%, rgba(160,82,45,0.3) 1%, transparent 1.5%),
        radial-gradient(circle at 45% 65%, transparent 0.3%, rgba(0,0,0,0.6) 0.8%, transparent 1.2%),
        radial-gradient(circle at 65% 15%, transparent 0.2%, rgba(139,69,19,0.2) 0.7%, transparent 1%),
        radial-gradient(circle at 25% 85%, transparent 0.4%, rgba(0,0,0,0.5) 0.9%, transparent 1.3%),
        radial-gradient(circle at 75% 35%, transparent 0.3%, rgba(160,82,45,0.25) 0.8%, transparent 1.1%),
        radial-gradient(circle at 35% 45%, transparent 0.2%, rgba(101,67,33,0.3) 0.6%, transparent 1%);
    background-size: 1px 1px, 2px 2px, 1.5px 1.5px, 3px 3px, 2.5px 2.5px, 1.8px 1.8px, 1.2px 1.2px;
    background-position: 0 0, 1px 1px, 0.5px 0.5px, 2px 2px, 1.5px 1.5px, 0.8px 0.8px, 0.3px 0.3px;
}

/* Film Scratches Effect */
#club-hero .scratches-effect {
    background-image: 
        linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.1) 0.1%, transparent 0.2%),
        linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.2) 0.05%, transparent 0.1%),
        linear-gradient(45deg, transparent 0%, rgba(255,255,255,0.05) 0.05%, transparent 0.1%);
    background-size: 200px 100%, 100% 300px, 150px 150px;
    background-position: 0 0, 0 0, 50px 50px;
}

/* Scroll Icon Animation - Same as index.html */
#club-hero .scroll-icon { 
    animation: none;
    bottom: 30px; /* Manter o mesmo posicionamento da index.html */
}
#club-hero .scroll-icon svg path:nth-child(2) {
    transform-origin: center;
    animation: wheelDrop 1.8s ease-in-out infinite;
}