@font-face {
  font-family: 'smFont';
  src: url('../../fonts/HENRYSANS-REGULAR.woff2') format('woff2');
  font-display: swap;
}

@font-face {
    font-family: 'smFontLight';
    src: url('./assets/fonts/HENRYSANS-LIGHT.woff2') format('woff2');
    font-display: swap; /* FIXES AUDIT */
}

@font-face {
    font-family: 'smFontMedium';
    src: url('./assets/fonts/HENRYSANS-MEDIUM.woff2') format('woff2');
    font-display: swap; /* FIXES AUDIT */
}

@font-face {
    font-family: 'smFontBold';
    src: url('./assets/fonts/HENRYSANS-BOLD.woff2') format('woff2');
    font-display: swap; /* FIXES AUDIT */
}

@font-face {
    font-family: 'smFontBlack';
    src: url('./assets/fonts/HENRYSANS-BLACK.woff2') format('woff2');
    font-display: swap; /* FIXES AUDIT */
}


@font-face {
    font-family: 'SansCondFont';
    src: url('./assets/fonts/OpenSans_Condensed-SemiBold.TTF') format('truetype');
    font-display: swap; /* FIXES AUDIT */
}

:root {
  /* Colors */
  --color-primary-white: #F5F7FA;
  --color-secondary-white: #ECEBEA;
  --color-primary-blue: #0B1427;
  --color-secondary-blue: #001845;
  --color-tertiary-blue: #002349;
}


/* ===== Desktop (PC) ===== */
h1 { font-size: 48px; font-weight: 700; line-height: 1.2; }
h2 { font-size: 36px; font-weight: 600; line-height: 1.3; }
h3 { font-size: 30px; font-weight: 600; line-height: 1.3; }
h4 { font-size: 24px; font-weight: 600; line-height: 1.4; }
h5 { font-size: 20px; font-weight: 600; line-height: 1.4; }
h6 { font-size: 16px; font-weight: 600; line-height: 1.5; }

/* ===== Tablet ===== */
@media (max-width: 1024px) {
  h1 { font-size: 36px; font-weight: 700; line-height: 1.2; }
  h2 { font-size: 30px; font-weight: 600; line-height: 1.3; }
  h3 { font-size: 24px; font-weight: 600; line-height: 1.3; }
  h4 { font-size: 20px; font-weight: 600; line-height: 1.4; }
  h5 { font-size: 18px; font-weight: 600; line-height: 1.4; }
  h6 { font-size: 16px; font-weight: 600; line-height: 1.5; }
}

/* ===== Mobile ===== */
@media (max-width: 767px) {
  h1 { font-size: 30px; font-weight: 700; line-height: 1.2; }
  h2 { font-size: 24px; font-weight: 600; line-height: 1.3; }
  h3 { font-size: 20px; font-weight: 600; line-height: 1.3; }
  h4 { font-size: 18px; font-weight: 600; line-height: 1.4; }
  h5 { font-size: 16px; font-weight: 600; line-height: 1.4; }
  h6 { font-size: 14px; font-weight: 600; line-height: 1.5; }
}