/* roulang page: index */
:root {
            --primary-gradient: linear-gradient(135deg, #0EA5E9 0%, #06B6D4 50%, #10B981 100%);
            --glow-shadow: 0 10px 25px -5px rgba(14, 165, 233, 0.3);
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            background-color: #F8FAFC;
            color: #1E293B;
            overflow-x: hidden;
        }
        .hero-bg-overlay {
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.88) 0%, rgba(15, 23, 42, 0.95) 100%);
        }
        .glow-button {
            background: var(--primary-gradient);
            box-shadow: 0 4px 14px 0 rgba(14, 165, 233, 0.39);
            transition: all 0.25s ease-in-out;
        }
        .glow-button:hover {
            box-shadow: 0 6px 20px rgba(14, 165, 233, 0.6);
            transform: translateY(-1px);
        }
        .card-custom {
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }
        .card-custom:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        }