/* roulang page: index */
:root {
        --primary: #F59E0B;
        --primary-deep: #D97706;
        --secondary: #1E1B4B;
        --accent: #FF4500;
        --bg-main: #0B0F19;
        --bg-deep: #020617;
        --panel: #131B2E;
        --border-color: rgba(245, 158, 11, 0.2);
      }
      * { box-sizing: border-box; }
      body {
        margin: 0;
        padding: 0;
        background-color: var(--bg-main);
        color: #E2E8F0;
        font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
        line-height: 1.6;
        overflow-x: hidden;
      }
      .bg-grid-pattern {
        background-image: radial-gradient(rgba(245, 158, 11, 0.08) 1px, transparent 1px);
        background-size: 28px 28px;
      }
      .hero-slant {
        clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
      }
      @media (min-width: 768px) {
        .hero-slant {
          clip-path: polygon(0 0, 100% 0, 100% 86%, 0 100%);
        }
      }
      .amber-glow {
        box-shadow: 0 0 35px -5px rgba(245, 158, 11, 0.35);
      }
      .amber-glow-sm {
        box-shadow: 0 0 15px 0 rgba(245, 158, 11, 0.25);
      }
      .coral-glow {
        box-shadow: 0 0 25px 0 rgba(255, 69, 0, 0.4);
      }
      .glow-border {
        border: 1px solid rgba(245, 158, 11, 0.25);
        transition: all 0.3s ease;
      }
      .glow-border:hover {
        border-color: rgba(245, 158, 11, 0.6);
        box-shadow: 0 0 20px rgba(245, 158, 11, 0.15);
      }
      .step-line {
        position: absolute;
        top: 2rem;
        left: 10%;
        right: 10%;
        height: 2px;
        background: linear-gradient(90deg, #F59E0B, #FF4500, #312E81);
        z-index: 0;
      }
      .accordion-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease, padding 0.35s ease;
      }
      .accordion-item.active .accordion-content {
        max-height: 240px;
        padding-top: 0.75rem;
      }
      .accordion-item.active .faq-icon {
        transform: rotate(180deg);
        color: #F59E0B;
      }
      .pulse-indicator {
        animation: pulseAnimation 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
      }
      @keyframes pulseAnimation {
        0%, 100% { opacity: 1; transform: scale(1); }
        50% { opacity: 0.4; transform: scale(1.15); }
      }
      .hide-scrollbar::-webkit-scrollbar {
        display: none;
      }
      .hide-scrollbar {
        -ms-overflow-style: none;
        scrollbar-width: none;
      }

/* roulang page: category1 */
:root {
      --primary: #F59E0B;
      --primary-deep: #D97706;
      --secondary: #1E1B4B;
      --accent: #FF4500;
      --bg-main: #0B0F19;
      --bg-deep: #020617;
      --panel: #131B2E;
      --border-color: rgba(245, 158, 11, 0.2);
    }
    body {
      margin: 0;
      padding: 0;
      background-color: var(--bg-main);
      color: #E2E8F0;
      font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
      line-height: 1.6;
      overflow-x: hidden;
    }
    .bg-grid-pattern {
      background-image: radial-gradient(rgba(245, 158, 11, 0.08) 1px, transparent 1px);
      background-size: 28px 28px;
    }
    .glow-border {
      border: 1px solid rgba(245, 158, 11, 0.25);
      transition: all 0.3s ease;
    }
    .glow-border:hover {
      border-color: rgba(245, 158, 11, 0.6);
      box-shadow: 0 0 20px rgba(245, 158, 11, 0.15);
    }
    .badge-amber {
      background: linear-gradient(135deg, rgba(245, 158, 11, 0.2), rgba(217, 119, 6, 0.3));
      border: 1px solid rgba(245, 158, 11, 0.4);
      color: #FCD34D;
    }
    .badge-fire {
      background: linear-gradient(135deg, rgba(255, 69, 0, 0.2), rgba(185, 28, 28, 0.3));
      border: 1px solid rgba(255, 69, 0, 0.5);
      color: #FCA5A5;
    }
    .accordion-item.active .accordion-content {
      max-height: 320px;
      padding-top: 0.75rem;
    }
    .accordion-item.active .faq-icon {
      transform: rotate(180deg);
      color: #F59E0B;
    }
    .channel-scroll::-webkit-scrollbar {
      display: none;
    }
    .channel-scroll {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }