/* roulang page: index */
:root {
      --primary: #e11d48;
      --primary-hover: #be123c;
      --bg-dark: #090d16;
      --surface-dark: #111827;
      --border-dark: #243049;
    }
    body {
      background-color: var(--bg-dark);
      color: #f3f4f6;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", sans-serif;
      overflow-x: hidden;
    }
    .hero-mesh {
      background: radial-gradient(circle at 50% 15%, rgba(225, 29, 72, 0.18) 0%, rgba(9, 13, 22, 0) 70%);
    }
    /* 卡片堆叠视觉系统 */
    .card-stack-container {
      perspective: 1200px;
    }
    .card-stack-main {
      transform: translateZ(35px) scale(1.02);
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      z-index: 20;
    }
    .card-stack-left {
      transform: rotate(-6deg) translateY(24px) translateX(-38px) scale(0.92);
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      z-index: 10;
    }
    .card-stack-right {
      transform: rotate(6deg) translateY(24px) translateX(38px) scale(0.92);
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      z-index: 10;
    }
    .card-stack-container:hover .card-stack-main {
      transform: translateZ(50px) scale(1.04);
    }
    .card-stack-container:hover .card-stack-left {
      transform: rotate(-9deg) translateY(32px) translateX(-55px) scale(0.94);
    }
    .card-stack-container:hover .card-stack-right {
      transform: rotate(9deg) translateY(32px) translateX(55px) scale(0.94);
    }
    .badge-blur {
      backdrop-filter: blur(8px);
      background: rgba(17, 24, 39, 0.75);
    }