/**
 * Font Optimization CSS
 * Provides fallback fonts and reduces layout shift during font loading
 */

/* Font fallback system with size-adjust for better font swapping */
@font-face {
  font-family: 'Poppins Fallback';
  src: local('Arial'), local('Helvetica'), local('system-ui');
  font-display: swap;
  size-adjust: 107%; /* Adjust to match Poppins metrics */
}

@font-face {
  font-family: 'Montserrat Alternates Fallback';
  src: local('Arial'), local('Helvetica'), local('system-ui');
  font-display: swap;
  size-adjust: 105%; /* Adjust to match Montserrat Alternates metrics */
}

@font-face {
  font-family: 'Manrope Fallback';
  src: local('Arial'), local('Helvetica'), local('system-ui');
  font-display: swap;
  size-adjust: 103%; /* Adjust to match Manrope metrics */
}

/* Enhanced font loading with fallbacks */
body {
  font-family: 'Poppins', 'Poppins Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-display: swap;
}

/* Specific font assignments with fallbacks */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Poppins Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-display: swap;
}

/* Alternative font families with fallbacks */
.montserrat-font {
  font-family: 'Montserrat Alternates', 'Montserrat Alternates Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-display: swap;
}

.manrope-font {
  font-family: 'Manrope', 'Manrope Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-display: swap;
}

/* Prevent invisible text during font swap */
.font-loading {
  font-display: swap;
  visibility: visible;
}

/* Critical text that should be visible immediately */
.critical-text {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Font loading optimization for specific elements */
.navbar, .hero-title, .main-heading {
  font-display: swap;
}

/* Reduce layout shift by setting consistent line heights */
p, div, span {
  line-height: 1.6;
}

h1 { line-height: 1.2; }
h2 { line-height: 1.3; }
h3 { line-height: 1.4; }
h4, h5, h6 { line-height: 1.5; }

/* Font weight optimization - use only loaded weights */
.fw-light { font-weight: 300; }
.fw-normal { font-weight: 400; }
.fw-medium { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.fw-bold { font-weight: 700; }

/* Remove unused font weights to prevent loading */
.fw-100, .fw-200, .fw-800, .fw-900 {
  font-weight: 400; /* Fallback to loaded weight */
}

/* Performance hint for font rendering */
* {
  text-rendering: optimizeSpeed;
}

/* High-priority text elements */
.hero-text, .main-title, .primary-heading {
  text-rendering: optimizeLegibility;
}

/* Font loading states */
.fonts-loading body {
  visibility: hidden;
}

.fonts-loaded body {
  visibility: visible;
}

/* Smooth font transition */
body, h1, h2, h3, h4, h5, h6 {
  transition: font-family 0.1s ease-in-out;
}

/* Prevent font-related layout shifts */
.text-content {
  min-height: 1.2em; /* Prevent height collapse during font loading */
}

/* Optimize font rendering for different screen densities */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}
