
    html,body{height:100%}
    body{
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
      color:var(--ink); background:var(--bg);
      text-rendering:optimizeLegibility;
      -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
    }

    /* ---------- NAVBAR (subtle glass) ---------- */
    .navbar{
      --bs-navbar-padding-y:.65rem;
      background: rgba(255,255,255,.85);
      backdrop-filter: saturate(160%) blur(10px);
      border-bottom: 1px solid rgba(43,108,255,.08);
      transition: box-shadow .25s ease, background .25s ease, border-color .25s ease;
      z-index: 1030;
    }
    .navbar.stuck{box-shadow:0 10px 30px rgba(15,23,42,.12); background:#fff}
    .navbar-brand{letter-spacing:.2px}
    .brand-dot{width:.55rem;height:.55rem;border-radius:50%;margin-left:.35rem;display:inline-block;vertical-align:middle;
      background: radial-gradient(12px 12px at 30% 30%, #fff 0, #fff 20%, transparent 21%), linear-gradient(135deg,var(--brand-600),var(--accent-cyan));}
    .nav-link{border-radius:.5rem}
    .nav-link:hover{background:var(--brand-50)}

    /* Mega dropdown */
    .dropdown-mega{position: static;}
    .dropdown-mega .dropdown-menu{
      left:0; right:0; border:0; border-radius:0;
      padding:2rem 0; margin-top:0;
      box-shadow:0 24px 48px rgba(15,23,42,.12);
      background:#fff;
    }
    .dropdown-item{border-radius:.6rem}
    .dropdown-item:hover{background:var(--brand-50)}

    /* ---------- HERO (video only) ---------- */
    .hero{position:relative;min-height:100vh;overflow:hidden}
    .hero-video{
      position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; filter:none !important;
      will-change:transform;
    }

    /* ---------- TYPO & SECTION ---------- */
    .section{padding:5.25rem 0; position:relative}
    .section-title{font-weight:800; letter-spacing:-.02em}
    .section-lead{color:var(--muted); max-width:72ch}
    .gradient-divider{height:4px;border:0;background:linear-gradient(90deg,var(--brand-600),var(--accent-cyan),var(--accent-indigo));opacity:.9;border-radius:999px}

    /* ---------- CARDS / SURFACES ---------- */
    .feature{
      background:var(--card);
      border-radius:1.15rem;
      padding:2rem 1.6rem;
      box-shadow:0 10px 28px rgba(10,22,50,.08);
      border:1px solid rgba(43,108,255,.10);
      background-image:
        radial-gradient(800px 280px at 110% -20%, rgba(24,182,246,.10), transparent 60%),
        radial-gradient(600px 220px at -10% -10%, rgba(79,70,229,.08), transparent 55%);
    }
    .card.soft{
      border:1px solid rgba(43,108,255,.10);
      border-radius:1.15rem;
      box-shadow:0 12px 30px rgba(15,23,42,.08);
      overflow:hidden;
      background:linear-gradient(180deg, #fff, #fbfdff);
    }

    /* ---------- STEPS ---------- */
    .step{
      background:linear-gradient(180deg,#fff,#f9fbff);
      border-radius:1rem;
      padding:1.25rem 1.25rem;
      border:1px solid rgba(43,108,255,.12);
      box-shadow:0 10px 24px rgba(10,22,50,.06);
    }
    .step .num{
      width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:800;color:#fff;margin-right:.8rem;flex:0 0 auto;
      background: linear-gradient(135deg,var(--brand-600),var(--accent-cyan));
      box-shadow:0 10px 20px rgba(43,108,255,.25);
    }

    /* ---------- BUTTONS ---------- */
    .btn-brand{
      --g1: var(--brand-600);
      --g2: var(--accent-cyan);
      background: linear-gradient(135deg, var(--g1), var(--g2));
      color:#fff; border:0; border-radius:999px;
      padding:.72rem 1.25rem; font-weight:700; letter-spacing:.15px;
      box-shadow:0 14px 28px rgba(43,108,255,.28);
      transition: transform .15s ease, box-shadow .2s ease, filter .15s ease;
    }
    .btn-brand:hover{ transform: translateY(-2px); box-shadow:0 18px 40px rgba(43,108,255,.35); color:#fff; filter:saturate(1.05)}
    .btn-brand:active{ transform: translateY(0) }

.btn-ghost {
  background-color: transparent;
  color: #000; /* black text */
  border: 1px solid #000; /* black border */
  border-radius: 999px;
  padding: .65rem 1.1rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-ghost:hover {
  background-color: #000; /* black background on hover */
  color: #fff; /* white text on hover */
}

    /* “Read More” special button */
    .btn-cta{
      --g1: var(--brand-600); --g2: var(--accent-indigo);
      background: linear-gradient(135deg, var(--g1), var(--g2));
      color:#fff; border:0; border-radius:999px; padding:.75rem 1.35rem; font-weight:700;
      display:inline-flex; align-items:center; gap:.5rem;
      box-shadow:0 14px 34px rgba(79,70,229,.30);
    }
    .btn-cta .chev{transition: transform .18s ease}
    .btn-cta:hover .chev{transform: translateX(3px)}

    /* ---------- PARALLAX ---------- */
    .parallax{background-attachment: fixed;background-position:center;background-size:cover;min-height:46vh;display:grid;place-items:center;color:#fff;text-align:center;position:relative;overflow:hidden;}
    .parallax::after{content:""; position:absolute; inset:0; z-index:0; background: linear-gradient(to bottom, rgba(10,36,102,.35), rgba(10,36,102,.55));}
    .parallax .inner{position:relative; z-index:1; padding:4rem 1rem}
    @media (max-width: 991px){ .parallax{background-attachment:scroll} }

    /* ---------- FOOTER ---------- */
    .footer{background:#0b1220;color:#cbd5e1}
    .footer a{color:#cbd5e1;text-decoration:none}
    .footer a:hover{color:#fff}

    /* Utilities */
    .ratio img{object-fit:cover}

    /* Back-to-top button */
    .back-to-top{
      position:fixed; right:22px; bottom:22px; z-index:1050;
      width:48px; height:48px; border-radius:999px; display:flex; align-items:center; justify-content:center;
      box-shadow: 0 12px 28px rgba(43,108,255,.35);
      opacity:0; transform: translateY(10px); pointer-events:none; transition: all .25s ease;
      background: linear-gradient(135deg, var(--brand-600), var(--accent-cyan)); color:#fff; border:0;
    }
    .back-to-top.show{opacity:1; transform: translateY(0); pointer-events:auto;}

    /* ---------- PARTNERS (logo cloud) ---------- */
    .logo-cloud { row-gap: 1.25rem; }
    .partner-logo{
      height: 36px; max-height: 44px; width: auto;
      
      transition: transform .15s ease, filter .2s ease, opacity .2s ease;
    }
    .partner-logo:hover{
      filter: none; opacity: 1; transform: translateY(-2px);
    }
    @media (min-width: 992px){
      .partner-logo{ height: 40px; }
    }


    /* Remove the underline from links inside the card */
.innovation-card {
  text-decoration: none; /* Removes underline */
  color: inherit; /* Inherit text color */
}

.innovation-card .card-body {
  color: var(--ink); /* Ensures text color is consistent */
}

.innovation-card .card-body:hover {
  color: var(--brand-600); /* Change color when hovering (optional) */
}

.innovation-card .card-title {
  font-weight: bold; /* Ensures the title is bold */
  text-decoration: none; /* Ensures no underlines */
}

.innovation-card .card-text {
  font-size: 1rem; /* Adjusts font size for better readability */
}

.innovation-card .card-title:hover {
  color: var(--accent-cyan); /* Optional: Change color on hover */
}




.hero-video { opacity: 0; transition: opacity 0.6s ease; }
#fallbackImage { transition: opacity 0.6s ease; }
