/* roulang page: index */
:root {
            --bg-main: #F8FAFC;
            --color-primary: #1E2229;
            --color-amber: #D97706;
            --color-amber-dark: #B45309;
            --color-slate-dark: #0F172A;
            --border-grid: #E2E8F0;
        }
        html {
            scroll-behavior: smooth;
            font-family: system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
        }
        body {
            background-color: var(--bg-main);
            color: #334155;
            overflow-x: hidden;
        }
        .grid-line-pattern {
            background-image: radial-gradient(rgba(217, 119, 6, 0.08) 1px, transparent 1px), radial-gradient(rgba(15, 23, 42, 0.05) 1px, transparent 1px);
            background-size: 24px 24px;
            background-position: 0 0, 12px 12px;
        }
        .hero-banner-mask {
            background: linear-gradient(105deg, rgba(15, 23, 42, 0.95) 0%, rgba(30, 34, 41, 0.90) 55%, rgba(15, 23, 42, 0.82) 100%);
        }
        .accordion-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
        }
        .accordion-open .accordion-content {
            max-height: 250px;
            transition: max-height 0.4s ease-in-out;
        }