/* roulang page: index */
:root {
            --primary-teal: #0D9488;
            --primary-blue: #0284C7;
            --warm-amber: #F59E0B;
            --night-slate: #0F172A;
            --bg-light: #F8FAFC;
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            scroll-behavior: smooth;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            background-color: var(--bg-light);
            color: #334155;
            line-height: 1.65;
            -webkit-font-smoothing: antialiased;
        }

        .hero-banner-bg {
            background-image: linear-gradient(135deg, rgba(15, 23, 42, 0.88) 0%, rgba(13, 148, 136, 0.82) 100%), url('/assets/images/cf37ba6a058811b2.webp');
            background-size: cover;
            background-position: center;
        }

        .dark-philosophy-bg {
            background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.95) 0%, rgba(17, 94, 89, 0.92) 100%), url('/assets/images/bb62bbf0ad9951ac.webp');
            background-size: cover;
            background-position: center;
        }

        .curved-card {
            border-radius: 20px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 10px 25px -5px rgba(13, 148, 136, 0.07), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
        }

        .curved-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 30px -10px rgba(13, 148, 136, 0.15), 0 10px 15px -5px rgba(0, 0, 0, 0.05);
        }

        .glow-badge {
            background: linear-gradient(135deg, rgba(20, 184, 166, 0.15) 0%, rgba(2, 132, 199, 0.15) 100%);
            border: 1px solid rgba(20, 184, 166, 0.3);
        }

        .pulse-dot {
            animation: pulse-ring 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }

        @keyframes pulse-ring {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.4; transform: scale(1.15); }
        }

        .accordion-content {
            transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
        }
