/* roulang page: index */
:root {
      --primary-gradient: linear-gradient(135deg, #0f52ba 0%, #1e3a8a 100%);
      --accent-cyan: #00d2b4;
      --accent-orange: #f59e0b;
      --bg-slate: #f8fafc;
      --dark-titanium: #0a0f1d;
    }
    html {
      scroll-behavior: smooth;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    }
    .hero-bg-overlay {
      background: linear-gradient(105deg, rgba(10, 15, 29, 0.92) 0%, rgba(15, 82, 186, 0.82) 65%, rgba(13, 30, 74, 0.9) 100%);
    }
    .btn-gradient {
      background: linear-gradient(135deg, #0f52ba 0%, #1d63ed 100%);
      position: relative;
      overflow: hidden;
    }
    .btn-gradient::after {
      content: '';
      position: absolute;
      top: -50%;
      left: -60%;
      width: 40%;
      height: 200%;
      background: rgba(255, 255, 255, 0.2);
      transform: rotate(30deg);
      transition: all 0.6s ease;
    }
    .btn-gradient:hover::after {
      left: 130%;
    }
    .card-hover-effect {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .card-hover-effect:hover {
      transform: translateY(-6px);
      box-shadow: 0 16px 36px -8px rgba(15, 82, 186, 0.16);
    }
    .table-compare-row:nth-child(even) {
      background-color: rgba(255, 255, 255, 0.03);
    }