/* roulang page: index */
:root {
            --primary: #0F766E;
            --primary-hover: #0D9488;
            --accent: #EA580C;
            --dark-surface: #0F172A;
            --card-border: #E2E8F0;
        }
        html {
            scroll-behavior: smooth;
        }
        body {
            color: #334155;
            background-color: #F8FAFC;
        }
        .hero-banner-bg {
            background-image: linear-gradient(135deg, rgba(15, 23, 42, 0.92) 0%, rgba(15, 118, 110, 0.88) 100%), url('/assets/images/2f1c73133bf1a2fb.jpg');
            background-size: cover;
            background-position: center;
        }
        .section-dark-bg {
            background-image: radial-gradient(#1E293B 1px, transparent 1px), linear-gradient(to bottom, #0F172A, #020617);
            background-size: 24px 24px, 100% 100%;
        }
        .badge-pulse {
            box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6);
            animation: pulse-ring 2s infinite;
        }
        @keyframes pulse-ring {
            0% { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.6); }
            70% { box-shadow: 0 0 0 8px rgba(234, 88, 12, 0); }
            100% { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0); }
        }