/* Glitchify Local Fonts - Comic Style System */

/* Fredoka One - Comic Heading Font */
@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Nunito - Comic Body Font */
@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-extrabold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Italic variants for Nunito */
@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-bolditalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-mediumitalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-semibolditalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-lightitalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

/* CSS Variables for Comic Font System */
:root {
  --font-comic-heading: 'Comic Sans MS', 'Fredoka One', cursive, sans-serif;
  --font-comic-body: 'Comic Sans MS', 'Nunito', cursive, sans-serif;
  --font-comic-fallback: 'Comic Sans MS', cursive, sans-serif;
}

/* Typography Classes */
.comic-heading {
  font-family: var(--font-comic-heading);
  font-weight: 400;
  letter-spacing: 0.5px;
}

.comic-text {
  font-family: var(--font-comic-body);
  font-weight: 400;
}

.comic-bold {
  font-family: var(--font-comic-body);
  font-weight: 700;
}

.comic-medium {
  font-family: var(--font-comic-body);
  font-weight: 500;
}

.comic-light {
  font-family: var(--font-comic-body);
  font-weight: 300;
}

/* Performance optimizations */
.font-loading {
  font-family: var(--font-comic-fallback);
}

.font-loaded {
  font-family: var(--font-comic-body);
}

/* Preload critical fonts */
@font-face {
  font-family: 'Fredoka One';
  src: url('../fonts/static/fredoka-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: block; /* Critical font - block rendering until loaded */
}

@font-face {
  font-family: 'Nunito';
  src: url('../fonts/static/nunito-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: block; /* Critical font - block rendering until loaded */
}
