/* asset/frontend/css/style-custom.css */
body { background: #f0fdf4; scroll-behavior: smooth; user-select: none; } 

.hero-section {
    position: relative; min-height: 85vh;
    display: flex; align-items: flex-end;
    justify-content: center; overflow: hidden; background: #022c22;
}

.hero-bg {
    position: absolute; inset: 0; 
    background-size: cover; background-position: center 10%; 
    opacity: 0.85; filter: saturate(1.2) contrast(1.1); z-index: 1;
}

.hero-overlay { 
    position: absolute; inset: 0; 
    background: linear-gradient(to bottom, transparent 0%, rgba(2, 44, 34, 0.4) 50%, rgba(2, 44, 34, 0.95) 90%, #f0fdf4 100%);
    z-index: 2;
}

@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.animate-marquee { display: flex; width: 200%; animation: marquee 30s linear infinite; }

.glass-card { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.2); }
.stat-card { transition: all 0.3s ease; border-left: 4px solid transparent; }
.stat-card:hover { transform: translateX(5px); border-left-color: #f59e0b; background: #fff; }

.text-gradient-desa { background: linear-gradient(to right, #6ee7b7, #f59e0b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }