/* roulang page: index */
:root {
            --primary: #0F2942;
            --primary-light: #1B4965;
            --accent: #E65F2B;
            --accent-hover: #D45113;
            --dark-surface: #0B132B;
            --neutral-bg: #F8FAFC;
            --slate-text: #334155;
            --emerald-trust: #059669;
        }
        body {
            font-family: -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
            color: var(--slate-text);
            background-color: #FFFFFF;
            overflow-x: hidden;
            scroll-behavior: smooth;
        }
        .text-primary { color: var(--primary); }
        .bg-primary { background-color: var(--primary); }
        .bg-primary-light { background-color: var(--primary-light); }
        .bg-accent { background-color: var(--accent); }
        .bg-accent:hover { background-color: var(--accent-hover); }
        .text-accent { color: var(--accent); }
        .border-accent { border-color: var(--accent); }
        .dark-section { background-color: var(--dark-surface); }
        .card-soft {
            background: #FFFFFF;
            border: 1px solid rgba(226, 232, 240, 0.9);
            box-shadow: 0 4px 20px -4px rgba(15, 41, 66, 0.05);
            transition: all 0.25s ease-out;
        }
        .card-soft:hover {
            transform: translateY(-4px);
            box-shadow: 0 12px 28px -6px rgba(15, 41, 66, 0.12);
            border-color: rgba(230, 95, 43, 0.3);
        }