/* roulang page: index */
:root {
            --primary-blue: #1E40AF;
            --accent-blue: #3B82F6;
            --accent-cyan: #06B6D4;
            --bg-light: #F8FAFC;
            --card-white: #FFFFFF;
            --text-main: #0F172A;
            --text-muted: #475569;
            --border-color: #E2E8F0;
        }
        body {
            background-color: var(--bg-light);
            color: var(--text-main);
            font-family: 'PingFang SC', 'Microsoft YaHei', system-ui, -apple-system, sans-serif;
            -webkit-font-smoothing: antialiased;
        }
        .text-gradient {
            background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #06b6d4 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .hero-pattern {
            background-color: #f8fafc;
            background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
            background-size: 24px 24px;
        }
        .custom-shadow {
            box-shadow: 0 10px 30px -5px rgba(30, 64, 175, 0.06), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
        }
        .custom-shadow-hover:hover {
            box-shadow: 0 20px 35px -5px rgba(30, 64, 175, 0.12), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
            transform: translateY(-2px);
        }