/* roulang page: index */
:root {
            --brand-green-dark: #1B4332;
            --brand-green-mid: #2D6A4F;
            --brand-green-light: #52B788;
            --dawn-amber: #D97706;
            --dawn-amber-light: #F59E0B;
            --warm-bg-light: #F8FAFC;
            --warm-bg-bone: #FAF9F6;
            --card-radius: 1.5rem;
            --card-radius-lg: 2rem;
            --shadow-soft: 0 12px 35px -8px rgba(27, 67, 50, 0.08);
            --shadow-hover: 0 20px 40px -10px rgba(27, 67, 50, 0.16);
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            background-color: var(--warm-bg-bone);
            color: #1F2937;
            overflow-x: hidden;
        }

        /* 统一设计规范类 */
        .glass-nav {
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
            background-color: rgba(255, 255, 255, 0.94);
        }

        .hero-bento-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1.5rem;
        }

        @media (min-width: 1024px) {
            .hero-bento-grid {
                grid-template-columns: 1.6fr 1fr;
            }
        }

        .card-custom {
            border-radius: var(--card-radius);
            transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
            box-shadow: var(--shadow-soft);
        }

        .card-custom:hover {
            transform: translateY(-4px);
            box-shadow: var(--shadow-hover);
        }

        .badge-capsule {
            border-radius: 9999px;
            display: inline-flex;
            align-items: center;
            font-size: 0.8125rem;
            font-weight: 600;
            padding: 0.35rem 0.85rem;
        }

        .btn-brand-cta {
            background: linear-gradient(135deg, var(--brand-green-dark) 0%, var(--brand-green-mid) 100%);
            transition: all 0.25s ease;
        }

        .btn-brand-cta:hover {
            background: linear-gradient(135deg, #143527 0%, #245740 100%);
            transform: translateY(-2px);
            box-shadow: 0 10px 20px -5px rgba(27, 67, 50, 0.25);
        }

        .btn-amber-cta {
            background: linear-gradient(135deg, #D97706 0%, #B45309 100%);
            transition: all 0.25s ease;
        }

        .btn-amber-cta:hover {
            background: linear-gradient(135deg, #B45309 0%, #92400E 100%);
            transform: translateY(-2px);
            box-shadow: 0 10px 20px -5px rgba(217, 119, 6, 0.3);
        }

        /* 风琴折叠过渡 */
        .faq-body {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.35s ease-out;
        }

        .faq-item.active .faq-body {
            max-height: 260px;
        }

        .faq-item.active .faq-arrow {
            transform: rotate(180deg);
        }