/* ===== PROFESSIONAL THEME - MODERN BACKGROUNDS ===== */
/* Consistent modern design across all sections */

/* Global Body Enhancement */
body {
    background: #f8f9fa;
    position: relative;
}

/* Section Alternating Backgrounds */
section {
    position: relative;
    overflow: visible;
}

/* Stats Section - Blue Gradient */
.stats-section {
    background: linear-gradient(135deg, #2196f3 0%, #1976d2 50%, #0d47a1 100%) !important;
    position: relative;
}

.stats-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 15s ease-in-out infinite;
}

/* Video Section - Light Gray with Pattern */
.video-section {
    background: linear-gradient(135deg, #eceff1 0%, #cfd8dc 100%) !important;
    position: relative;
}

.video-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255,255,255,.1) 35px, rgba(255,255,255,.1) 70px);
    opacity: 0.5;
}

/* Profil Section - Teal Gradient */
.profil {
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 50%, #006064 100%) !important;
    position: relative;
}

.profil::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 40%, rgba(255, 255, 255, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.08) 0%, transparent 50%);
    animation: float 18s ease-in-out infinite;
}

/* Program Section - Orange Gradient */
.program {
    background: linear-gradient(135deg, #ff9800 0%, #f57c00 50%, #e65100 100%) !important;
    position: relative;
}

.program::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 15% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 85% 75%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 20s ease-in-out infinite;
}

/* Kesemaptaan Section - Green Gradient */
.kesemaptaan {
    background: linear-gradient(135deg, #4caf50 0%, #388e3c 50%, #1b5e20 100%) !important;
    position: relative;
}

.kesemaptaan::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 25% 35%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 75% 65%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 17s ease-in-out infinite;
}

/* Prestasi Section - Red Gradient */
.prestasi {
    background: linear-gradient(135deg, #f44336 0%, #d32f2f 50%, #b71c1c 100%) !important;
    position: relative;
}

.prestasi::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 16s ease-in-out infinite;
}

/* Fasilitas Section - Indigo Gradient */
.fasilitas {
    background: linear-gradient(135deg, #3f51b5 0%, #303f9f 50%, #1a237e 100%) !important;
    position: relative;
}

.fasilitas::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 40%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 19s ease-in-out infinite;
}

/* Blog Section - Light Background with Subtle Pattern */
.blog-section {
    background: linear-gradient(135deg, #fafafa 0%, #e0e0e0 100%) !important;
    position: relative;
}

.blog-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        repeating-linear-gradient(0deg, transparent, transparent 50px, rgba(0,0,0,.02) 50px, rgba(0,0,0,.02) 100px);
    opacity: 0.5;
}

/* Biaya Section - Gold Gradient */
.biaya-section {
    background: linear-gradient(135deg, #ffd700 0%, #ffa000 50%, #ff6f00 100%) !important;
    position: relative;
}

.biaya-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 255, 255, 0.15) 0%, transparent 50%);
    animation: float 21s ease-in-out infinite;
}

/* Pendaftaran Section - Deep Purple Gradient */
.pendaftaran {
    background: linear-gradient(135deg, #9c27b0 0%, #7b1fa2 50%, #4a148c 100%) !important;
    position: relative;
}

.pendaftaran::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 25% 35%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 75% 65%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    animation: float 22s ease-in-out infinite;
}

/* Footer - Dark Gradient */
footer {
    background: linear-gradient(135deg, #263238 0%, #37474f 50%, #455a64 100%) !important;
    position: relative;
}

footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 40%, rgba(255, 255, 255, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.03) 0%, transparent 50%);
}

/* Floating Animation */
@keyframes float {
    0%, 100% { 
        transform: translateY(0px) scale(1);
        opacity: 1;
    }
    50% { 
        transform: translateY(-20px) scale(1.05);
        opacity: 0.8;
    }
}

/* Ensure content is above background effects */
section > .container,
section > .container-fluid {
    position: relative;
    z-index: 1;
}

/* Enhanced Section Headers */
.section-header {
    position: relative;
    z-index: 2;
}

/* Add subtle glow to section titles */
.section-title {
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

/* Decorative Elements */
section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
}

/* Remove after effect for specific sections */
.hero::after,
footer::after {
    display: none;
}

/* Smooth transitions between sections */
section {
    transition: background 0.5s ease;
}

/* Add depth with shadows */
.stats-section,
.program,
.kesemaptaan,
.prestasi,
.fasilitas,
.biaya-section,
.pendaftaran {
    box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    section::before {
        opacity: 0.5;
    }
    
    @keyframes float {
        0%, 100% { 
            transform: translateY(0px) scale(1);
        }
        50% { 
            transform: translateY(-10px) scale(1.02);
        }
    }
}

/* Print styles - remove backgrounds for printing */
@media print {
    section::before,
    section::after {
        display: none !important;
    }
    
    section {
        background: white !important;
    }
}