/* Section Base Styles */
section {
    padding: 80px 0;
}

/* --- Section Scroll Animations --- */

/* Initial state for scroll-animated sections */
.section-animated {
    opacity: 0;
    will-change: transform, opacity;
    /* Ensure no visual jump before animation starts, relies solely on keyframes once triggered */
}

/* Animation trigger classes */
.section-animated.entry-fadeInUp {
    animation: fadeInUp 1s cubic-bezier(.25, .46, .45, .94) both;
    animation-delay: var(--animation-delay, 0s);
}

.section-animated.entry-slideInRight {
    animation: slideInRight 1s cubic-bezier(.25, .46, .45, .94) both;
    animation-delay: var(--animation-delay, 0s);
}

.section-animated.entry-slideInLeft {
    animation: slideInLeft 1s cubic-bezier(.25, .46, .45, .94) both;
    animation-delay: var(--animation-delay, 0s);
}

.section-animated.entry-zoom {
    animation: zoomInFade 1.2s cubic-bezier(.25, .46, .45, .94) both;
    animation-delay: var(--animation-delay, 0s);
}

.section-title {
    font-size: 40px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 16px;
    color: var(--gray-900);
}

.section-subtitle {
    text-align: center;
    color: var(--gray-600);
    font-size: 18px;
    margin-bottom: 48px;
}

/* Section Particles Animation (Used in Categories, Services, Products Hero) */
.section-particles {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}

.section-particles .particle {
    position: absolute;
    width: 4px;
    height: 4px;
    background: var(--accent-green);
    border-radius: 50%;
    animation: particleFloat 12s infinite ease-in-out;
    opacity: 0.3;
}

.section-particles .particle:nth-child(1) {
    left: 10%;
    animation-delay: 0s;
    animation-duration: 10s;
}

.section-particles .particle:nth-child(2) {
    left: 25%;
    animation-delay: 2s;
    animation-duration: 13s;
}

.section-particles .particle:nth-child(3) {
    left: 40%;
    animation-delay: 4s;
    animation-duration: 11s;
}

.section-particles .particle:nth-child(4) {
    left: 60%;
    animation-delay: 1s;
    animation-duration: 14s;
}

.section-particles .particle:nth-child(5) {
    left: 75%;
    animation-delay: 3s;
    animation-duration: 12s;
}

.section-particles .particle:nth-child(6) {
    left: 90%;
    animation-delay: 5s;
    animation-duration: 15s;
}

/* Responsive Overrides (General) */
@media (max-width: 992px) {
    .section-title {
        font-size: 36px;
    }
    .section-subtitle {
        font-size: 17px;
    }
}

@media (max-width: 768px) {
    .section-title {
        font-size: 30px;
    }
    .section-subtitle {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
}