/*
 * LOCAL FONTS SYSTEM
 * ==================
 * 
 * Cara menambah font baru:
 * 1. Taruh file font (.ttf, .woff, .ttf) di folder /public/fonts/[nama-font]/
 * 2. Tambahkan @font-face di bawah ini
 * 3. Update FONT_FAMILIES di components/Editor.tsx
 * 
 * Format nama folder: gunakan lowercase dengan dash (e.g., "red-hat-display")
 * 
 * Contoh menambah font premium:
 * 1. Buat folder: public/fonts/agrandir/
 * 2. Taruh file: Agrandir-Regular.ttf, Agrandir-Bold.ttf, dll
 * 3. Tambahkan @font-face untuk setiap weight
 * 4. Tambahkan "Agrandir" ke FONT_FAMILIES array
 */

/* ============================================
   GOOGLE FONTS (Downloaded Locally)
   ============================================ */

/* Inter */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/inter/Inter-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/inter/Inter-Medium.ttf') format('truetype');

}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/inter/Inter-SemiBold.ttf') format('truetype');

}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/inter/Inter-Bold.ttf') format('truetype');

}

/* Poppins */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('/fonts/poppins/Poppins-Light.ttf') format('truetype');

}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/poppins/Poppins-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/poppins/Poppins-Medium.ttf') format('truetype');

}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/poppins/Poppins-SemiBold.ttf') format('truetype');

}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/poppins/Poppins-Bold.ttf') format('truetype');

}

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

}

/* Montserrat */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url('/fonts/montserrat/Montserrat-Thin.ttf') format('truetype');

}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/montserrat/Montserrat-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/montserrat/Montserrat-Medium.ttf') format('truetype');

}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/montserrat/Montserrat-SemiBold.ttf') format('truetype');

}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/montserrat/Montserrat-Bold.ttf') format('truetype');

}

/* Lato */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/lato/Lato-Regular.ttf') format('truetype');

}

/* Roboto */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/roboto/Roboto-Regular.ttf') format('truetype');

}

/* Oswald */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/oswald/Oswald-Regular.ttf') format('truetype');

}

/* Lora */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/lora/Lora-Regular.ttf') format('truetype');

}

/* Merriweather */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/merriweather/Merriweather-Regular.ttf') format('truetype');

}

/* Pacifico */
@font-face {
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/pacifico/Pacifico-Regular.ttf') format('truetype');

}

/* Lobster */
@font-face {
  font-family: 'Lobster';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/lobster/Lobster-Regular.ttf') format('truetype');

}

/* Outfit */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url('/fonts/outfit/Outfit-Thin.ttf') format('truetype');

}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/outfit/Outfit-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/outfit/Outfit-Medium.ttf') format('truetype');

}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/outfit/Outfit-SemiBold.ttf') format('truetype');

}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/outfit/Outfit-Bold.ttf') format('truetype');

}

/* Manrope */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('/fonts/manrope/Manrope-ExtraLight.ttf') format('truetype');

}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/manrope/Manrope-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/manrope/Manrope-Medium.ttf') format('truetype');

}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/manrope/Manrope-SemiBold.ttf') format('truetype');

}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/manrope/Manrope-Bold.ttf') format('truetype');

}

/* ============================================
   NEW FONTS (dari screenshot)
   ============================================ */

/* Public Sans */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/public-sans/PublicSans-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/public-sans/PublicSans-Bold.ttf') format('truetype');

}

/* Roboto Condensed */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/roboto-condensed/RobotoCondensed-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/roboto-condensed/RobotoCondensed-Bold.ttf') format('truetype');

}

/* Red Hat Display */
@font-face {
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/red-hat-display/RedHatDisplay-Regular.ttf') format('truetype');

}

@font-face {
  font-family: 'Red Hat Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/red-hat-display/RedHatDisplay-Bold.ttf') format('truetype');

}

/* Anton */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/anton/Anton-Regular.ttf') format('truetype');

}

/* ============================================
   PREMIUM FONTS (placeholder - add your own)
   ============================================ */

/* ============================================
   PREMIUM FONTS
   ============================================ */

/* Agrandir */
@font-face {
  font-family: 'Agrandir';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/agrandir/Agrandir-Regular.otf') format('opentype');
}

@font-face {
  font-family: 'Agrandir';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/agrandir/Agrandir-Bold.otf') format('opentype');
}

/* Agrandir Grand Heavy (Separate Family) */
@font-face {
  font-family: 'Agrandir Grand Heavy';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/agrandir/Agrandir-GrandHeavy.otf') format('opentype');
}

@font-face {
  font-family: 'Agrandir Grand Heavy';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/agrandir/Agrandir-GrandHeavy.otf') format('opentype');
}

/* TT Fors */
@font-face {
  font-family: 'TT Fors';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/tt-fors/TTFors-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'TT Fors';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/tt-fors/TTFors-Bold.ttf') format('truetype');
}

/* TT Norms */
@font-face {
  font-family: 'TT Norms';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/tt-norms/TTNorms-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'TT Norms';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/tt-norms/TTNorms-Bold.ttf') format('truetype');
}

/* Garet */
@font-face {
  font-family: 'Garet';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/garet/Garet-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Garet';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/garet/Garet-Bold.ttf') format('truetype');
}

/* Gotham Condensed */
@font-face {
  font-family: 'Gotham Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/gotham-condensed/GothamCondensed-Regular.otf') format('opentype');
}

@font-face {
  font-family: 'Gotham Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/gotham-condensed/GothamCondensed-Bold.otf') format('opentype');
}

/* Open Sauce */
@font-face {
  font-family: 'Open Sauce';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/open-sauce/OpenSauce-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Open Sauce';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/open-sauce/OpenSauce-Bold.ttf') format('truetype');
}

/* The Youngest Serif */
@font-face {
  font-family: 'The Youngest Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/the-youngest-serif/TheYoungestSerif-Regular.ttf') format('truetype');
}