/* roulang page: index */
:root {
            --color-primary: #0F52BA;
            --color-primary-hover: #0A3D8F;
            --color-accent: #0284C7;
            --color-gold: #D4AF37;
            --bg-body: #F8FAFC;
            --bg-card: #FFFFFF;
            --border-soft: #E2E8F0;
            --text-heading: #0F172A;
            --text-body: #334155;
            --text-muted: #64748B;
        }

        body {
            background-color: var(--bg-body);
            color: var(--text-body);
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
            overflow-x: hidden;
            scroll-padding-top: 104px;
        }

        .num-tabular {
            font-variant-numeric: tabular-nums;
        }

        .soft-card-shadow {
            box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.04), 0 12px 28px -4px rgba(15, 82, 186, 0.07);
            transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .soft-card-shadow:hover {
            box-shadow: 0 16px 32px -8px rgba(15, 82, 186, 0.16), 0 6px 12px -4px rgba(15, 23, 42, 0.05);
            transform: translateY(-3px);
        }

        .gold-glow-border {
            border: 1px solid rgba(212, 175, 55, 0.35);
            box-shadow: 0 0 20px rgba(212, 175, 55, 0.08);
        }

        .hero-bg-overlay {
            background: linear-gradient(135deg, rgba(11, 21, 40, 0.94) 0%, rgba(15, 33, 62, 0.90) 65%, rgba(15, 82, 186, 0.75) 100%);
        }

        .custom-scrollbar::-webkit-scrollbar {
            height: 6px;
        }
        .custom-scrollbar::-webkit-scrollbar-thumb {
            background: #CBD5E1;
            border-radius: 9999px;
        }