/* roulang page: index */
:root {
            --primary: #0F766E;
            --accent: #EA580C;
            --dark: #0F172A;
            --surface: #F8FAFC;
            --text-main: #1E293B;
            --text-muted: #475569;
            --border: #E2E8F0;
        }
        * { box-sizing: border-box; margin: 0; padding: 0; }
        body { font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; color: var(--text-main); background-color: #FFFFFF; line-height: 1.75; letter-spacing: -0.01em; }
        html { scroll-behavior: smooth; }
        .hero-title { font-size: clamp(1.85rem, 3.8vw, 2.75rem); letter-spacing: -0.02em; }
        .feature-card { transition: all 0.25s ease-in-out; border: 1px solid var(--border); }
        .feature-card:hover { transform: translateY(-4px); box-shadow: 0 10px 25px -5px rgba(15, 118, 110, 0.08); border-color: #CBD5E1; }
        .badge-live { position: relative; }
        .badge-live::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #10B981; margin-right: 6px; animation: pulse-green 2s infinite; }
        @keyframes pulse-green {
            0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
            70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
            100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
        }
        details > summary { list-style: none; cursor: pointer; }
        details > summary::-webkit-details-marker { display: none; }
        details[open] summary svg { transform: rotate(180deg); }