/* roulang page: index */
:root {
      --primary-purple: #1e1b4b;
      --primary-indigo: #312e81;
      --accent-gold: #d97706;
      --accent-amber: #f59e0b;
      --bg-slate: #0f172a;
      --card-bg-light: #ffffff;
      --border-light: rgba(226, 232, 240, 0.8);
    }
    body {
      color: #334155;
      background-color: #f8fafc;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    }
    .custom-gradient-hero {
      background: linear-gradient(135deg, rgba(15, 23, 42, 0.94) 0%, rgba(30, 27, 75, 0.92) 50%, rgba(49, 46, 129, 0.88) 100%),
                  url('/assets/images/c8689cc2b9bbc051.png') center/cover no-repeat;
    }
    .dark-section-bg {
      background: linear-gradient(180deg, #0b0f19 0%, #0f172a 100%);
    }
    .glass-nav {
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      background-color: rgba(255, 255, 255, 0.92);
      border-bottom: 1px solid rgba(226, 232, 240, 0.8);
    }
    .luxury-card {
      background: #ffffff;
      border: 1px solid var(--border-light);
      box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.05), 0 8px 10px -6px rgba(15, 23, 42, 0.03);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .luxury-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 20px 30px -10px rgba(30, 27, 75, 0.12);
      border-color: rgba(217, 119, 6, 0.35);
    }
    .pulse-dot {
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background-color: #10b981;
      box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
      animation: pulse 2s infinite;
    }
    @keyframes pulse {
      0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
      }
      70% {
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(16, 185, 129, 0);
      }
      100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
      }
    }