/* Optimization: gzip -9 -k -f css/fonts.css */
/* Font face declarations - WOFF2 for best compression, OTF fallback */
@font-face {
  font-family: 'Roc Grotesk';
  src: url('/fonts/fonnts.com-Roc_Grotesk_Wide.woff2') format('woff2'),
       url('/fonts/fonnts.com-Roc_Grotesk_Wide.otf') format('opentype');
  font-weight: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roc Grotesk';
  src: url('/fonts/fonnts.com-Roc_Grotesk_Wide_Medium.woff2') format('woff2'),
       url('/fonts/fonnts.com-Roc_Grotesk_Wide_Medium.otf') format('opentype');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'Roc Grotesk';
  src: url('/fonts/fonnts.com-Roc_Grotesk_Wide_Bold.woff2') format('woff2'),
       url('/fonts/fonnts.com-Roc_Grotesk_Wide_Bold.otf') format('opentype');
  font-weight: bold;
  font-display: swap;
}

@font-face {
  font-family: 'ABC Diatype';
  src: url('/fonts/ABCDiatype-Regular.woff2') format('woff2'),
       url('/fonts/ABCDiatype-Regular.otf') format('opentype');
  font-weight: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ABC Diatype';
  src: url('/fonts/ABCDiatype-Medium.woff2') format('woff2'),
       url('/fonts/ABCDiatype-Medium.otf') format('opentype');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'ABC Diatype';
  src: url('/fonts/ABCDiatype-Bold.woff2') format('woff2'),
       url('/fonts/ABCDiatype-Bold.otf') format('opentype');
  font-weight: bold;
  font-display: swap;
}

/* Typography variables */
:root {
  /* Font families */
  --font-heading: 'Roc Grotesk', sans-serif;
  --font-body: 'ABC Diatype', sans-serif;
  
  /* Font sizes */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 4.5rem;
  
  /* Line heights */
  --leading-tight: 1.1;
  --leading-snug: 1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --leading-loose: 2;
  
  /* Font weights */
  --font-normal: 400;
  --font-medium: 500;
  --font-bold: 700;
}