/* roulang page: index */
/* 设计变量与全局重置 */
    :root {
      --primary-purple: #8B5CF6;
      --primary-indigo: #6366F1;
      --accent-cyan: #06B6D4;
      --bg-deep: #0F0A1A;
      --bg-card: #1A1326;
      --border-dim: #2D2438;
      --text-body: #B0AABF;
      --text-white: #F8FAFC;
      --success-green: #10B981;
      --warning-orange: #F59E0B;
      --shadow-purple: rgba(139, 92, 246, 0.2);
      --radius-card: 24px;
      --radius-btn: 12px;
    }
    
    * {
      box-sizing: border-box;
    }
    
    body {
      margin: 0;
      font-family: 'PingFang SC', 'Microsoft YaHei', 'Inter', system-ui, sans-serif;
      background-color: var(--bg-deep);
      color: var(--text-body);
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }
    
    /* 数字专用字体 */
    .font-mono-data {
      font-family: 'Inter', 'SF Mono', 'Monaco', monospace;
      letter-spacing: -0.5px;
    }
    
    /* 容器宽度 */
    .container-main {
      max-width: 1280px;
      margin-left: auto;
      margin-right: auto;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    
    /* 霓虹发光文字 */
    .text-glow-purple {
      text-shadow: 0 0 12px rgba(139, 92, 246, 0.5);
    }
    .text-glow-cyan {
      text-shadow: 0 0 10px rgba(6, 182, 212, 0.3);
    }
    
    /* 卡片玻璃效果 */
    .glass-card {
      background: rgba(26, 19, 38, 0.75);
      backdrop-filter: blur(12px);
      border: 1px solid var(--border-dim);
      border-radius: var(--radius-card);
      box-shadow: 0 4px 24px rgba(139, 92, 246, 0.08);
      transition: all 0.25s ease;
    }
    .glass-card:hover {
      border-color: var(--primary-purple);
      box-shadow: 0 12px 32px var(--shadow-purple);
      transform: translateY(-2px);
    }
    
    /* 按钮系统 */
    .btn-primary {
      background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 100%);
      color: white;
      font-weight: 600;
      border-radius: var(--radius-btn);
      padding: 0.85rem 2rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s ease;
      box-shadow: 0 4px 14px rgba(139, 92, 246, 0.3);
      border: none;
      cursor: pointer;
    }
    .btn-primary:hover {
      filter: brightness(1.1);
      box-shadow: 0 8px 20px rgba(139, 92, 246, 0.45);
      transform: translateY(-2px);
    }
    
    .btn-outline {
      background: transparent;
      border: 1px solid var(--accent-cyan);
      color: var(--accent-cyan);
      font-weight: 600;
      border-radius: var(--radius-btn);
      padding: 0.85rem 2rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s ease;
      cursor: pointer;
    }
    .btn-outline:hover {
      background: rgba(6, 182, 212, 0.1);
      color: white;
      border-color: white;
      box-shadow: 0 4px 18px rgba(6, 182, 212, 0.25);
    }
    
    .text-link {
      color: var(--accent-cyan);
      font-weight: 500;
      transition: all 0.2s;
    }
    .text-link:hover {
      text-decoration: underline;
      color: #22d3ee;
    }
    
    /* FAQ 手风琴动画 */
    .faq-answer {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      background: #221A33;
      border-radius: 0 0 12px 12px;
    }
    .faq-item.active .faq-answer {
      max-height: 300px;
    }
    
    /* 导航栏滚动效果 */
    .main-nav {
      transition: background 0.3s, backdrop-filter 0.3s;
    }
    .main-nav.scrolled {
      background: rgba(15, 10, 26, 0.9);
      backdrop-filter: blur(16px);
      border-bottom: 1px solid var(--border-dim);
    }
    
    /* 移动端菜单 */
    .mobile-menu {
      transition: opacity 0.3s ease, transform 0.3s ease;
      opacity: 0;
      transform: translateY(-10px);
      pointer-events: none;
      position: absolute;
      top: 64px;
      left: 0;
      width: 100%;
      background: rgba(15, 10, 26, 0.98);
      backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--border-dim);
      padding: 1rem 1.5rem;
    }
    .mobile-menu.open {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }
    
    /* 自定义滚动条 */
    ::-webkit-scrollbar {
      width: 6px;
    }
    ::-webkit-scrollbar-track {
      background: #0A0513;
    }
    ::-webkit-scrollbar-thumb {
      background: #4B3A6B;
      border-radius: 3px;
    }