/* ============================================================================
   hotspotsatu — TOKEN DESAIN PORTAL (Refined Brand: navy · emas · hijau)
   ----------------------------------------------------------------------------
   HANYA design tokens. Pisah dari struktur (portal.css). Semua aset SELF-HOST.
   Font = system stack (nol unduhan). Ganti --sans ke @font-face woff2 self-host
   bila mau font display. Identitas brand: biru "hotspot" + hijau "satu".
   ============================================================================ */
:root{
  /* ---- Teks ---- */
  --ink:#0C2333;
  --muted:#5C7488;
  --ink-on-navy:#EAF2FB;
  --muted-on-navy:#A9C2DC;

  /* ---- Brand: navy (utama) ---- */
  --navy:#103A63;
  --navy-deep:#0B2E4F;
  --navy-2:#16538C;

  /* ---- Brand: logo ---- */
  --logo-blue:#1466B5;
  --logo-green:#2BA84A;

  /* ---- Emas (banner / sorot) ---- */
  --gold:#F6C544;
  --gold-2:#FFD968;
  --gold-deep:#E8A317;

  /* ---- Hijau (CTA / sukses) ---- */
  --green:#16A34A;
  --green-2:#22C55E;
  --green-press:#128A3E;

  /* ---- Permukaan & garis ---- */
  --surface:#FFFFFF;
  --surface-2:#F2F6FB;
  --bg:#EEF3F9;
  --line:#E0E8F1;
  --line-soft:#EDF2F8;

  /* ---- Status ---- */
  --locked:#9DB0C2;
  --ok:#16A34A;
  --ok-soft:#EFFaf3;
  --ok-line:#BCE6CC;

  /* ---- Gradien signature ---- */
  --grad-gold:linear-gradient(118deg,#FFE07A 0%,#F6C544 45%,#EFAE1F 100%);
  --grad-navy:linear-gradient(160deg,#1A4E82 0%,#0B2E4F 90%);
  --grad-green:linear-gradient(135deg,#2BD46B 0%,#16A34A 100%);
  --mesh-bg:
     radial-gradient(1200px 560px at 50% -10%, rgba(22,83,140,.08), transparent 60%),
     radial-gradient(720px 420px at 102% 4%, rgba(246,197,68,.12), transparent 55%);

  /* ---- Bentuk & radius ---- */
  --r-sm:12px;
  --r:16px;
  --r-lg:22px;
  --r-xl:34px;

  /* ---- Glass (frosted) ---- */
  --glass:rgba(255,255,255,.74);
  --glass-strong:rgba(255,255,255,.86);
  --glass-brd:rgba(13,46,79,.07);
  --glass-blur:saturate(170%) blur(16px);

  /* ---- Bayangan ---- */
  --shadow-sm:0 1px 2px rgba(11,46,79,.06);
  --shadow:0 2px 6px rgba(11,46,79,.06), 0 14px 30px rgba(11,46,79,.09);
  --shadow-lg:0 10px 28px rgba(11,46,79,.14), 0 30px 64px rgba(11,46,79,.18);
  --glow-green:0 10px 26px rgba(22,163,74,.40);
  --glow-gold:0 10px 26px rgba(232,163,23,.35);
  --ring-navy:0 0 0 3px rgba(22,83,140,.18);

  /* ---- Tipografi ----
     Default = system stack (nol unduhan). Untuk font modern membulat (mis.
     Plus Jakarta Sans), aktifkan font self-host:
       1) taruh file di public/portal/fonts/PlusJakartaSans-{400,600,700,800}.woff2
       2) hapus komentar blok @font-face di bawah token ini
       3) tambahkan "Plus Jakarta Sans" di DEPAN --sans.
     Contoh: --sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,... */
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI Variable","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  /* ---- Layout (full-width fluid) ---- */
  --maxw:1760px;       /* batas atas saja; praktis full-width di laptop */
  --content:980px;     /* lebar baca konten landing (di dalam seksi) */
  --gutter:clamp(18px, 3.6vw, 64px);

  /* ---- Easing ---- */
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ============================================================================
   FONT SELF-HOST (opsional) — aktifkan untuk rasa modern membulat .id
   Hapus komentar, sediakan file di public/portal/fonts/, lalu set --sans.
   ----------------------------------------------------------------------------
@font-face{font-family:"Plus Jakarta Sans"; font-weight:400; font-display:swap;
  src:url("fonts/PlusJakartaSans-400.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans"; font-weight:600; font-display:swap;
  src:url("fonts/PlusJakartaSans-600.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans"; font-weight:700; font-display:swap;
  src:url("fonts/PlusJakartaSans-700.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans"; font-weight:800; font-display:swap;
  src:url("fonts/PlusJakartaSans-800.woff2") format("woff2")}
============================================================================ */