/* MBS FAI — Design tokens. Sumber kebenaran: .claude/MBS-FAI-website-spec.md §3 */
:root{
  /* Warna */
  --mbs-green:        #0B8A4E;
  --mbs-green-dark:   #0B6E3F;
  --mbs-teal:         #0A7A66;
  --mbs-blue:         #0A5BA8;
  --mbs-blue-light:   #2E86DE;
  --mbs-mint:         #7CD6AA;

  --mbs-ink:    #1D2B36;
  --mbs-muted:  #4A5B68;
  --mbs-bg:     #F4F8F6;
  --mbs-dark:   #0C2E3B;
  --mbs-white:  #FFFFFF;

  --mbs-grad-main: linear-gradient(135deg, var(--mbs-green) 0%, var(--mbs-teal) 48%, var(--mbs-blue) 100%);
  --mbs-grad-soft: linear-gradient(180deg, #EAF4EF, #EAF1F9);
  --mbs-grad-text: linear-gradient(135deg, var(--mbs-green) 0%, var(--mbs-blue) 100%);
  /* Navbar: hijau gelap -> hijau terang. Ujung terang berhenti di --mbs-green
     supaya teks putih tetap >=4.5:1 di seluruh bilah (#0B8A4E = 4.4:1 hanya di tepi kanan,
     tempat ikon dan tombol berlatar sendiri). */
  --mbs-grad-nav: linear-gradient(100deg, #053B24 0%, var(--mbs-green-dark) 50%, var(--mbs-green) 100%);
  --mbs-nav-line: rgba(255, 255, 255, .14);

  /* Blob dekoratif hero (tint dari palet MBS, bukan dari proyek lain) */
  --mbs-blob-1: rgba(11, 138, 78, .28);
  --mbs-blob-2: rgba(10, 91, 168, .24);
  --mbs-blob-3: rgba(124, 214, 170, .30);

  /* Radius */
  --r-xl:   40px;
  --r-lg:   30px;
  --r-md:   24px;
  --r-sm:   15px;
  --r-pill: 999px;

  /* Bayangan */
  --shadow-sm: 0 4px 14px rgba(13, 43, 54, .08);
  --shadow-md: 0 14px 34px rgba(13, 43, 54, .12);
  --shadow-lg: 0 24px 54px rgba(13, 43, 54, .16);
  --shadow-blue-hover: 0 18px 38px rgba(10, 91, 168, .22);
  --shadow-inset: inset 7px 7px 16px rgba(13, 43, 54, .12), inset -7px -7px 16px rgba(255, 255, 255, .85);

  /* Tipografi — Nunito dilayani sendiri lewat fonts-nunito.css */
  --font-display: "Nunito", "Noto Kufi Arabic", -apple-system, sans-serif;
  --font-body: "Nunito", "Noto Kufi Arabic", -apple-system, sans-serif;

  /* Spasi & transisi */
  --nav-h: 84px;
  --nav-h-scrolled: 68px;
  --ease: cubic-bezier(.22, .9, .35, 1);
  --dur: 320ms;
}