:root{
      --blue:#1f6bff;
      --blue2:#0b3dff;
      --gold:#d8b15a;
      --ink:#0b1220;
      --muted:#5b6475;
      --bg:#f7f9ff;
      --card:#ffffff;
      --stroke: rgba(11,18,32,.10);
      --shadow: 0 18px 55px rgba(11,18,32,.12);
      --shadow2: 0 10px 28px rgba(11,18,32,.10);
      --r: 22px;
    }

    *{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial;}
    body{background:var(--bg); color:var(--ink); overflow-x:hidden;}
    a{text-decoration:none}

    .btn-primary{
      background: linear-gradient(135deg, var(--blue), var(--blue2));
      border:0;
      box-shadow: 0 12px 28px rgba(31,107,255,.28);
    }
    .btn-outline-dark{border-color: rgba(11,18,32,.20);}

    .badge-soft{
      background: rgba(216,177,90,.14);
      color: #7a5a1a;
      border: 1px solid rgba(216,177,90,.25);
      border-radius: 999px;
      padding:.35rem .65rem;
      font-weight:600;
      font-size:.8rem;
    }

    .pill{
      display:inline-flex; gap:.55rem; align-items:center;
      padding:.55rem .85rem;
      border-radius:999px;
      background: rgba(31,107,255,.08);
      border: 1px solid rgba(31,107,255,.18);
      color: var(--ink);
      font-size: .92rem;
    }

    .hero{
      position:relative;
      padding: 92px 0 46px;
      overflow:hidden;
    }
    .hero::before{
      content:"";
      position:absolute; inset:-20%;
      background:
        radial-gradient(650px 440px at 16% 20%, rgba(31,107,255,.22), transparent 60%),
        radial-gradient(540px 380px at 78% 22%, rgba(216,177,90,.20), transparent 62%),
        radial-gradient(740px 460px at 55% 86%, rgba(31,107,255,.14), transparent 60%);
      z-index:0;
      transform: rotate(-6deg);
    }
    .hero-inner{position:relative; z-index:1;}

    .hero-title{
      font-size: clamp(2rem, 4.2vw, 3.25rem);
      line-height:1.05;
      letter-spacing:-.02em;
    }
    .lead{color:var(--muted);}

    .section{padding: 72px 0;}
    .section-title{
      font-size: clamp(1.6rem, 2.7vw, 2.1rem);
      letter-spacing:-.02em;
    }
    .muted{color:var(--muted);}

    .cardx{
      background: var(--card);
      border: 1px solid rgba(11,18,32,.10);
      border-radius: var(--r);
      box-shadow: var(--shadow2);
      height:100%;
      overflow:hidden;
      transform-style: preserve-3d;
      will-change: transform;
    }

    .icon{
      width:54px; height:54px;
      border-radius: 16px;
      display:grid; place-items:center;
      background: linear-gradient(135deg, rgba(31,107,255,.15), rgba(216,177,90,.12));
      border: 1px solid rgba(31,107,255,.18);
      user-select:none;
      will-change: transform;
      transform-origin: center;
      font-size: 24px;
    }

    .gs-hover { transform-origin:center; will-change:transform; }

    .float-panel{
      background: rgba(255,255,255,.72);
      border:1px solid rgba(255,255,255,.45);
      border-radius: var(--r);
      box-shadow: var(--shadow);
      overflow:hidden;
      position: relative;
      transform-style:preserve-3d;
    }
    .float-panel::after{
      content:"";
      position:absolute; inset:0;
      background: linear-gradient(135deg, rgba(255,255,255,.70), rgba(255,255,255,.35));
      pointer-events:none;
    }

    .stat{
      border:1px solid rgba(11,18,32,.10);
      border-radius: 18px;
      background: rgba(255,255,255,.80);
      box-shadow: 0 10px 22px rgba(11,18,32,.06);
    }
    .stat .num{font-size: 2rem; font-weight:700; letter-spacing:-.03em;}

    .timeline{
      position:relative;
      padding-left: 26px;
    }
    .timeline::before{
      content:"";
      position:absolute; left:10px; top:0; bottom:0;
      width:2px; background: rgba(11,18,32,.10);
    }
    .step{
      position:relative;
      padding: 14px 16px;
      border-radius: 16px;
      background: rgba(255,255,255,.80);
      border: 1px solid rgba(11,18,32,.10);
      box-shadow: 0 10px 22px rgba(11,18,32,.06);
      margin-bottom: 14px;
      transform-style: preserve-3d;
      will-change: transform;
    }
    .step::before{
      content:"";
      position:absolute; left:-22px; top:18px;
      width:14px; height:14px;
      border-radius:999px;
      background: linear-gradient(135deg, var(--blue), var(--gold));
      box-shadow: 0 10px 18px rgba(31,107,255,.18);
    }

    .faq .accordion-item{
      border: 1px solid rgba(11,18,32,.10);
      border-radius: 16px;
      overflow:hidden;
      background: rgba(255,255,255,.82);
    }

    footer{
      padding: 28px 0;
      border-top: 1px solid rgba(11,18,32,.08);
      color: var(--muted);
    }

    /* GSAP initial states */
    .gs-reveal{opacity:0; transform: translateY(14px);}
    .gs-section{opacity:0; transform: scale(.975) translateY(10px);}
    .mixbar{will-change: height;}

    /* Cursor line */
    body{ cursor: none; } /* hide default cursor */

    #cursorDot{
      position: fixed;
      top:0; left:0;
      width: 10px; height: 10px;
      border-radius: 999px;
      background: var(--gold);
      transform: translate(-50%, -50%);
      pointer-events: none;
      z-index: 999999;
      box-shadow: 0 0 18px rgba(216,177,90,.35);
      opacity: .95;
    }

    #cursorCanvas{
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 999998;
    }

    @media (prefers-reduced-motion: reduce){
      body{cursor:auto;}
      #cursorDot, #cursorCanvas{display:none;}
    }