/*
 * Hub typography — load this on every hub page to get identical rendering
 * across Safari, Chrome, Firefox, Edge, and on iOS/Android mobile.
 *
 * Loaded by services.php, systems.php and any other buy/admin page that
 * needs consistent type.
 */

/* Variable Inter — one file, weights 100-900 ----------------------------- */
@font-face {
  font-family: 'Inter';
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url('/hub/shared/fonts/InterVariable.woff2') format('woff2-variations'),
       url('/hub/shared/fonts/InterVariable.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
  src: url('/hub/shared/fonts/InterVariable-Italic.woff2') format('woff2-variations'),
       url('/hub/shared/fonts/InterVariable-Italic.woff2') format('woff2');
}

/* Cross-browser font rendering normalization ----------------------------- */
:root {
  /* Inter renders crisp at any size; opt into its tabular figures */
  font-feature-settings: 'cv11', 'ss01', 'ss03';
  font-variant-numeric: tabular-nums;
}

html {
  /* Same baseline rendering across all browsers */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html, body, button, input, select, textarea {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               'Helvetica Neue', Arial, sans-serif !important;

  /* Force consistent anti-aliasing across Safari / Chrome / Firefox */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;

  /* Synthesize weight + italic if asked for a variant we don't have.
     With variable Inter, this is a safety net only. */
  font-synthesis: weight style;
}

/* Mobile sizing — ensure font sizes don't get auto-bumped on iOS landscape */
@media screen and (max-width: 768px) {
  html, body {
    -webkit-text-size-adjust: 100%;
  }
}

/* Headings + bold text — make weight 900 actually render at 900, not "as bold as
   the system can manage". Inter has true 900 so this is consistent. */
strong, b, h1, h2, h3, h4, h5, h6, .bold, [class*="bold"] {
  font-synthesis: weight style;
}