/* roulang page: index */
:root {
      --bg-dark: #0B0818;
      --bg-violet: #120E29;
      --card-bg: #1F1A3A;
      --primary: #7C3AED;
      --secondary: #06B6D4;
      --accent: #F97316;
      --border-line: rgba(255, 255, 255, 0.08);
      --text-main: #F8FAFC;
      --text-muted: #94A3B8;
    }
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }
    body {
      background-color: var(--bg-dark);
      color: var(--text-main);
      font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
      line-height: 1.7;
      letter-spacing: 0.02em;
      overflow-x: hidden;
      padding-bottom: 70px;
    }
    a {
      text-decoration: none;
      color: inherit;
      transition: all 0.25s ease;
    }
    .glass-panel {
      background: rgba(31, 26, 58, 0.65);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid var(--border-line);
      box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.36);
    }
    .hover-glow:hover {
      border-color: rgba(124, 58, 237, 0.4);
      box-shadow: 0 10px 25px -5px rgba(124, 58, 237, 0.25), 0 8px 10px -6px rgba(6, 182, 212, 0.2);
      transform: translateY(-3px);
    }
    .btn-gradient {
      background: linear-gradient(135deg, #F97316 0%, #EA580C 100%);
      position: relative;
      overflow: hidden;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    .btn-gradient:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(249, 115, 22, 0.4);
    }
    .btn-gradient::after {
      content: '';
      position: absolute;
      top: 0;
      left: -150%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
      transform: skewX(-20deg);
      transition: 0.6s;
    }
    .btn-gradient:hover::after {
      left: 150%;
    }
    .btn-outline {
      border: 1px solid rgba(6, 182, 212, 0.5);
      background: rgba(6, 182, 212, 0.05);
      color: #06B6D4;
    }
    .btn-outline:hover {
      background: rgba(6, 182, 212, 0.15);
      border-color: #06B6D4;
      transform: translateY(-2px);
    }
    .text-gradient {
      background: linear-gradient(135deg, #FFFFFF 20%, #A78BFA 60%, #38BDF8 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .section-spacing {
      padding-top: 5rem;
      padding-bottom: 5rem;
    }
    /* 手风琴原生过渡 */
    details > summary {
      list-style: none;
      cursor: pointer;
    }
    details > summary::-webkit-details-marker {
      display: none;
    }
    details[open] summary svg {
      transform: rotate(180deg);
    }
    /* 底部固定转化条 */
    .sticky-bar {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 50;
      background: rgba(18, 14, 41, 0.95);
      backdrop-filter: blur(10px);
      border-top: 1px solid rgba(124, 58, 237, 0.3);
    }