/* roulang page: index */
:root {
      --canvas: #080d1a;
      --surface: rgba(13, 23, 42, 0.75);
      --border-light: rgba(56, 189, 248, 0.15);
      --border-hover: rgba(56, 189, 248, 0.45);
      --cyan-glow: #00f2fe;
      --blue-accent: #2563eb;
    }
    body {
      background-color: var(--canvas);
      color: #94a3b8;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      overflow-x: hidden;
    }
    .glass-panel {
      background: var(--surface);
      backdrop-filter: blur(12px);
      border: 1px solid var(--border-light);
    }
    .glass-panel:hover {
      border-color: var(--border-hover);
    }
    .glow-btn {
      background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);
      box-shadow: 0 0 20px rgba(14, 165, 233, 0.4);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .glow-btn:hover {
      box-shadow: 0 0 28px rgba(14, 165, 233, 0.7);
      transform: translateY(-2px);
    }
    .glow-outline-btn {
      background: rgba(14, 165, 233, 0.08);
      border: 1px solid rgba(56, 189, 248, 0.4);
      backdrop-filter: blur(8px);
      transition: all 0.3s ease;
    }
    .glow-outline-btn:hover {
      background: rgba(14, 165, 233, 0.2);
      border-color: #38bdf8;
      box-shadow: 0 0 15px rgba(56, 189, 248, 0.3);
    }
    .text-glow {
      text-shadow: 0 0 16px rgba(56, 189, 248, 0.5);
    }
    .section-divider {
      background: radial-gradient(circle at center, rgba(56, 189, 248, 0.2) 0%, rgba(8, 13, 26, 0) 70%);
      height: 1px;
    }