
    /* ====== Reset kecil & variabel ====== */
    * { -webkit-tap-highlight-color: transparent }
    :root { --ring: 2px; --blue-from:#2563eb; --blue-via:#3b82f6; --blue-to:#38bdf8; --blue-ring: rgba(59,130,246,.45) }

    /* ====== Scroll reveal ====== */
    .reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease }
    .reveal.in-view{ opacity:1; transform:translateY(0) }
    .reveal.delay-1{ transition-delay:.08s }
    .reveal.delay-2{ transition-delay:.16s }
    .reveal.delay-3{ transition-delay:.24s }

    /* ====== Header transparan -> sticky (tanpa shadow berat) ====== */
    header.site-header{
      position: fixed; inset:0 0 auto 0; z-index:60;
      background: transparent;
      transition: background .2s ease, backdrop-filter .2s ease, color .2s ease;
    }
    header.site-header.is-stuck{
      background: rgba(255,255,255,.88);
      backdrop-filter: blur(8px);
    }
    /* Warna link default sesuai state header */
    header .nav-link{ color:#fff }
    header.site-header.is-stuck .nav-link{ color:#1f2937 }

    /* ====== Nav atas: state aktif (konsisten dengan halaman Agen) ====== */
    header .nav-link[aria-current="page"]{
      background: rgba(255,255,255,.18);
      color:#fff;
      border-radius:.5rem;
    }
    header.site-header.is-stuck .nav-link[aria-current="page"]{
      background: rgba(15,23,42,.06);
      color:#1f2937;
    }
    header .nav-link:hover{
      background: rgba(255,255,255,.18);
      border-radius:.5rem;
    }
    header.site-header.is-stuck .nav-link:hover{
      background: rgb(241 245 249);
    }

    /* ====== Tombol gradien (tetap jika dipakai di section bawah) ====== */
    .btn-primary{
      background-image: linear-gradient(90deg,var(--blue-from),var(--blue-via),var(--blue-to));
      color:#fff;font-weight:600;border-radius:.75rem;
      transition:transform .12s ease,filter .2s ease,box-shadow .2s ease;
      box-shadow: 0 6px 20px -6px rgba(59,130,246,.35);
    }
    .btn-primary:hover{ filter:saturate(1.06) brightness(1.02) }
    .btn-primary:active{ transform:scale(.985) }

    /* ====== Back-to-top ====== */
    #backTop{
      opacity:0; pointer-events:none;
      background-image: linear-gradient(135deg,var(--blue-from),var(--blue-via),var(--blue-to));
      transition: opacity .2s ease, transform .12s ease;
    }
    #backTop.show{ opacity:1; pointer-events:auto }
    #backTop:active{ transform:scale(.96) }
