/* roulang page: index */
:root {
            --color-bg-light: #F8FAFC;
            --color-bg-card: #FFFFFF;
            --color-brand-teal: #0F766E;
            --color-brand-cyan: #0284C7;
            --color-brand-blue: #2563EB;
            --color-accent-emerald: #10B981;
            --color-dark-panel: #0F172A;
            --color-text-main: #0F172A;
            --color-text-muted: #475569;
            --border-subtle: rgba(226, 232, 240, 0.8);
            --radius-card: 1.25rem;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
            color: var(--color-text-main);
            background-color: var(--color-bg-light);
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
        }

        .gradient-brand-text {
            background: linear-gradient(135deg, #0F766E 0%, #0284C7 50%, #2563EB 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .gradient-brand-bg {
            background: linear-gradient(135deg, #0F766E 0%, #0284C7 50%, #2563EB 100%);
        }

        .card-interaction {
            transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .card-interaction:hover {
            transform: translateY(-4px);
            box-shadow: 0 16px 30px -8px rgba(15, 118, 110, 0.12);
            border-color: rgba(16, 185, 129, 0.4);
        }

        /* 隐藏移动端抽屉过渡 */
        #mobileDrawer {
            transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;
        }

        /* 手风琴折叠状态动画 */
        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.35s ease-out;
        }
        .faq-item.active .faq-answer {
            max-height: 240px;
        }
        .faq-item.active .faq-icon {
            transform: rotate(180deg);
        }