/* Web Fonts for Pixelated Empathy */

/* Inter Font Family - Primary Typeface */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/inter-regular.woff2') format('woff2');
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
    U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/inter-bold.woff2') format('woff2');
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
    U+FFFD;
}

/* DM Mono Font Family - Monospace */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/dm-mono-medium.woff2') format('woff2');
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
    U+FFFD;
}

/* Babies Playtime Font Family - Custom Brand Font */
/* @font-face {
  font-family: 'Babies Playtime';
  font-style: normal;
  font-weight: normal;
  font-display: swap;
  src: url('/fonts/FriendlyStranger.ttf') format('opentype');
} */

/* CSS Custom Properties */
:root {
  /* Primary font stack with proper fallbacks */
  --font-sans:
    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    'Helvetica Neue', Arial, sans-serif;
  --font-mono:
    'DM Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    'Liberation Mono', 'Courier New', monospace;
  --font-condensed: 'Inter', Arial Narrow, Arial, sans-serif;
  --font-brand:
    'Babies Playtime', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, sans-serif;

  /* Font weights */
  --font-weight-normal: 400;
  --font-weight-bold: 700;
}

/* Apply fonts to common elements */
body {
  font-family: var(--font-sans);
  font-weight: var(--font-weight-normal);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-sans);
  font-weight: var(--font-weight-bold);
}

code,
pre,
kbd,
samp {
  font-family: var(--font-mono);
}

/* Ensure font loading optimization */
.font-loading {
  font-display: swap;
}

/* Prevent layout shift during font loading */
.font-loading-fallback {
  font-family:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Loading state */
.fonts-loaded body {
  opacity: 1;
  transition: opacity 0.2s ease-in;
}

/* Hide until fonts load */
body {
  opacity: 0.95;
}

/* Brand title styling */
.brand-title {
  font-family: var(--font-brand);
  font-weight: normal;
}