/* roulang page: index */
:root {
            --primary: #4f46e5;
            --primary-gradient: linear-gradient(135deg, #2563eb 0%, #4f46e5 50%, #7c3aed 100%);
            --slate-bg: #f8fafc;
            --dark-card: #0b0f19;
        }
        html {
            scroll-behavior: smooth;
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
            color: #1e293b;
            background-color: #ffffff;
            overflow-x: hidden;
        }
        .bg-gradient-brand {
            background: var(--primary-gradient);
        }
        .hero-banner-bg {
            background-image: linear-gradient(to right, rgba(15, 23, 42, 0.95), rgba(30, 41, 59, 0.82)), url('/assets/images/50a20d12d2950494.webp');
            background-size: cover;
            background-position: center;
        }
        .philosophy-bg {
            background-image: linear-gradient(to right, rgba(11, 15, 25, 0.97), rgba(15, 23, 42, 0.92)), url('/assets/images/df44dc0f490c20c0.webp');
            background-size: cover;
            background-position: center;
        }
        .cta-box-bg {
            background-image: linear-gradient(135deg, rgba(37, 99, 235, 0.96), rgba(79, 70, 229, 0.96), rgba(124, 58, 237, 0.96)), url('/assets/images/43de0a56672de70e.webp');
            background-size: cover;
            background-position: center;
        }
        .data-badge {
            display: inline-flex;
            align-items: center;
            padding: 0.25rem 0.75rem;
            font-size: 0.8125rem;
            font-weight: 600;
            border-radius: 9999px;
            background-color: #eef2ff;
            color: #4338ca;
            border: 1px solid rgba(199, 210, 254, 0.7);
        }
        .accordion-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out;
        }
        .accordion-content.open {
            max-height: 200px;
        }