/* ============================================
   SELF-HOSTED FONTS
   Place font files in a /fonts/ folder
   next to your HTML files.
   
   Download from Google Fonts:
   https://fonts.google.com/specimen/Syne
   https://fonts.google.com/specimen/DM+Mono
   
   Or use: https://gwfh.mranftl.com/fonts
   (select woff2 + woff, all weights needed)
   ============================================ */

/* Syne — weights 400, 700, 800 */
@font-face {
  font-family: 'Syne';
  src: url('fonts/syne-400.woff2') format('woff2'),
       url('fonts/syne-400.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('fonts/syne-700.woff2') format('woff2'),
       url('fonts/syne-700.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('fonts/syne-800.woff2') format('woff2'),
       url('fonts/syne-800.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* DM Mono — weights 300, 400, 500 */
@font-face {
  font-family: 'DM Mono';
  src: url('fonts/dm-mono-300.woff2') format('woff2'),
       url('fonts/dm-mono-300.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'DM Mono';
  src: url('fonts/dm-mono-400.woff2') format('woff2'),
       url('fonts/dm-mono-400.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'DM Mono';
  src: url('fonts/dm-mono-500.woff2') format('woff2'),
       url('fonts/dm-mono-500.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}