/* roulang page: index */
:root {
      --color-primary: #1E40AF;
      --color-accent: #3B82F6;
      --color-cyan: #06B6D4;
      --color-bg: #F8FAFC;
      --color-dark: #0F172A;
      --color-card: #FFFFFF;
      --color-text: #0F172A;
      --color-text-muted: #64748B;
      --color-border: #E2E8F0;
      --radius-lg: 12px;
      --shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
      --shadow-hover: 0 20px 25px -5px rgba(30, 64, 175, 0.1), 0 8px 10px -6px rgba(30, 64, 175, 0.05);
    }
    
    html {
      scroll-behavior: smooth;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    }

    body {
      background-color: var(--color-bg);
      color: #334155;
      overflow-x: hidden;
    }

    .glass-nav {
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      background: rgba(255, 255, 255, 0.85);
      border-bottom: 1px solid rgba(226, 232, 240, 0.8);
    }

    .card-custom {
      background-color: var(--color-card);
      border: 1px solid var(--color-border);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow-sm);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

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

    .badge-primary {
      background: rgba(59, 130, 246, 0.1);
      color: var(--color-primary);
      border: 1px solid rgba(59, 130, 246, 0.2);
    }

    .hero-bg {
      background: linear-gradient(135deg, rgba(248, 250, 252, 0.94) 0%, rgba(239, 246, 255, 0.85) 100%),
                  url('/assets/images/e4546e66bb291566.jpg') center/cover no-repeat;
    }

    .dark-section-bg {
      background: radial-gradient(circle at 80% 20%, rgba(30, 64, 175, 0.35) 0%, rgba(15, 23, 42, 0.98) 70%),
                  url('/assets/images/2e6ac5e9e2809c2c.jpg') center/cover no-repeat;
    }

    .stat-glow {
      text-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
    }

    /* 滚动条美化 */
    ::-webkit-scrollbar {
      width: 8px;
    }
    ::-webkit-scrollbar-track {
      background: #F1F5F9;
    }
    ::-webkit-scrollbar-thumb {
      background: #CBD5E1;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #94A3B8;
    }