/* Hallmark · tokens — SPK Santri Teladan (halaman masuk)
 * Sistem token custom-tuned dari brand madrasah (hijau #1B5E43 · emas #C9A227).
 * app.css (aplikasi dalam) belum memakai token ini; migrasi bertahap bila diminta.
 */

@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../vendor/fonts/cormorant-garamond-700.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../vendor/fonts/ibm-plex-sans-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../vendor/fonts/ibm-plex-sans-600.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../vendor/fonts/ibm-plex-mono-400.woff2") format("woff2");
}

:root {
  /* ---- Warna (OKLCH, anchor hijau madrasah ~163° · aksen emas ~92°) ---- */
  --color-paper:        oklch(97% 0.008 155);
  --color-paper-2:      oklch(94% 0.012 155);
  --color-ink:          oklch(23% 0.020 165);
  --color-ink-2:        oklch(35% 0.020 165);
  --color-muted:        oklch(44% 0.018 163);
  --color-rule:         oklch(85% 0.015 158);
  --color-rule-2:       oklch(89% 0.012 158);

  /* Permukaan hijau tua (panel kop-surat) + pasangan kontrasnya */
  --color-panel:        oklch(30% 0.050 165);
  --color-panel-hover:  oklch(25% 0.048 165);
  --color-panel-ink:    oklch(95% 0.012 150);
  --color-panel-muted:  oklch(80% 0.030 155);
  --color-panel-rule:   oklch(42% 0.040 165);

  /* Aksen emas — highlighter, bukan blok warna */
  --color-accent:       oklch(76% 0.130 92);   /* di atas panel gelap */
  --color-accent-deep:  oklch(48% 0.100 88);   /* di atas paper */
  --color-focus:        oklch(48% 0.110 163);
  --color-error:        oklch(46% 0.180 27);

  /* ---- Huruf (2+1: display serif · body sans · mono utk kode kriteria) ---- */
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-body:    "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, monospace;

  /* Skala 1.25 dari 16px */
  --text-xs:      0.75rem;
  --text-sm:      0.875rem;
  --text-base:    1rem;
  --text-md:      1.25rem;
  --text-lg:      1.5625rem;
  --text-xl:      1.9531rem;
  --text-display: clamp(2.4rem, 2.2vw + 1.4rem, 3.4rem);

  /* ---- Ruang (skala 4pt) ---- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 4.5rem;

  /* ---- Gerak ---- */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:   cubic-bezier(0.7, 0, 0.84, 0);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;

  /* ---- Bentuk ---- */
  --radius-input: 6px;
}