@font-face {
  font-family: 'Yellowtail';
  src: url('/fonts/yellow-tail.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Waterfall';
  src: url('/fonts/waterfall.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sacramento';
  src: url('/fonts/sacramento.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Great Vibes';
  src: url('/fonts/great-vibes.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Boss Signature';
  src: url('/fonts/boss-signature.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Ms Madi';
  src: url('/fonts/ms-madi.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Fallback classes for when fonts are not loaded */
.yellowtail-fallback {
  font-family: 'Yellowtail', 'Brush Script MT', cursive;
}

.waterfall-fallback {
  font-family: 'Waterfall', 'Brush Script MT', cursive;
}

.sacramento-fallback {
  font-family: 'Sacramento', 'Lucida Handwriting', cursive;
}

.great-vibes-fallback {
  font-family: 'Great Vibes', 'Brush Script MT', cursive;
}

.boss-signature-fallback {
  font-family: 'Boss Signature', 'Impact', fantasy;
}

.ms-madi-fallback {
  font-family: 'Ms Madi', 'Brush Script MT', cursive;
}