/* kanit-200 - latin_thai */
@font-face {
  font-display: swap;
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 200;
  src: url('./fonts/kanit-v17-latin_thai/kanit-v17-latin_thai-200.woff2') format('woff2');
}
/* kanit-300 - latin_thai */
@font-face {
  font-display: swap;
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/kanit-v17-latin_thai/kanit-v17-latin_thai-300.woff2') format('woff2');
}
/* kanit-regular - latin_thai */
@font-face {
  font-display: swap;
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/kanit-v17-latin_thai/kanit-v17-latin_thai-regular.woff2') format('woff2');
}
/* kanit-600 - latin_thai */
@font-face {
  font-display: swap;
  font-family: 'Kanit';
  font-style: normal;
  font-weight: 600;
  src: url('./fonts/kanit-v17-latin_thai/kanit-v17-latin_thai-600.woff2') format('woff2');
}

/* ─────────────────────────────────────────────────────────────
 * Zero-CLS fallback font · metric-matched to Kanit
 * Maps to the local Arial/Helvetica (identical metrics) so Latin text
 * (brand names, Smart Film, PDLC, numbers) reserves the same box as Kanit
 * before the web font loads → no reflow on font-swap.
 * Overrides computed from Kanit-300 real metrics (upm 1000 · asc 1100 ·
 * desc -395 · gap 0) vs Arial weighted avg width. Recompute if Kanit changes.
 * NOTE: Thai glyphs fall through to the OS Thai font (Arial has no Thai),
 * so this normalises the Latin runs; preload covers the rest.
 * ───────────────────────────────────────────────────────────── */
@font-face {
  font-family: 'Kanit Fallback';
  src: local('Arial'), local('Helvetica Neue'), local('Roboto');
  size-adjust: 101.35%;
  ascent-override: 108.54%;
  descent-override: 38.97%;
  line-gap-override: 0%;
}

/* ─────────────────────────────────────────────────────────────
 * Global a11y · respect prefers-reduced-motion (WCAG 2.3.3)
 * Default: all Tailwind animate-* classes play normally
 * User preference: reduced motion → stop infinite loops (bounce/pulse/ping/spin)
 * Does NOT affect one-shot animations (transitions, fade-in, etc.)
 * ───────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .animate-bounce,
  .animate-pulse,
  .animate-ping,
  .animate-spin {
    animation: none !important;
  }
}