/* ===========================================
   CRITICAL FONTS (loaded immediately with swap)
   These are the most commonly used weights
   =========================================== */

/* Plus Jakarta Sans - Regular (400) - PRIMARY FONT */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/plus-jakarta-sans/plus-jakarta-sans-400.ttf') format('truetype');
  font-display: swap;
}

/* Plus Jakarta Sans - Bold (700) - CRITICAL: used for headings */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/plus-jakarta-sans/plus-jakarta-sans-700.ttf') format('truetype');
  font-display: swap;
}

/* Noto Sans - Regular (400) - fallback font (optional: don't block paint for fallback font) */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/noto-sans/noto-sans-400.ttf') format('truetype');
  font-display: optional;
}

/* ===========================================
   OPTIONAL FONTS (loaded if cached, fallback to similar weight)
   These use font-display: optional to prevent layout shifts
   and reduce main thread blocking
   =========================================== */

/* Plus Jakarta Sans - Medium (500) */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/plus-jakarta-sans/plus-jakarta-sans-500.ttf') format('truetype');
  font-display: optional;
}

/* Plus Jakarta Sans - Semi Bold (600) */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/plus-jakarta-sans/plus-jakarta-sans-600.ttf') format('truetype');
  font-display: optional;
}

/* Plus Jakarta Sans - Extra Bold (800) - CRITICAL: used for main H1 heading */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  src: url('/fonts/plus-jakarta-sans/plus-jakarta-sans-800.ttf') format('truetype');
  font-display: swap;
}

/* Noto Sans - Medium (500) */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/noto-sans/noto-sans-500.ttf') format('truetype');
  font-display: optional;
}

/* Noto Sans - Bold (700) */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/noto-sans/noto-sans-700.ttf') format('truetype');
  font-display: optional;
}

/* Noto Sans - Black (900) */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/noto-sans/noto-sans-900.ttf') format('truetype');
  font-display: optional;
}

/* ===========================================
   CAPTION FONTS — used by CaptionOverlay for
   preview parity with burn-in render.
   Same TTF files as backend/fonts/.
   =========================================== */

/* Montserrat Black (900) — mrbeast-bold preset */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/Montserrat-Black.ttf') format('truetype');
  font-display: swap;
}

/* Inter Medium (500) — clean-minimal preset */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/Inter-Medium.ttf') format('truetype');
  font-display: swap;
}

/* Oswald Bold (700) — shorts-center preset */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/Oswald-Bold.ttf') format('truetype');
  font-display: swap;
}

/* Playfair Display Bold (700) — cinematic preset */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/PlayfairDisplay-Bold.ttf') format('truetype');
  font-display: swap;
}