:root {
  /* Global Color Variables */
  --primary-dark-blue: #141b4d;
  --primary-bright-blue: #006ac6;
  --primary-grellow: #e0e721;
  --primary-grafton-black: #2c2a29;
  --secondary-green: #9cbf2b;
  --secondary-stone: #b7bb9c;
  --secondary-magenta: #d10073;
  --secondary-concrete: #9ca99e;
  --secondary-orange: #ee732c;
  --secondary-slate: #52646d;
  --dark-grey: #343434;
  --grey: #f4f4f4;
  --grey1: #f3f3f4;
  --black: #000;
  --white: #fff;
  --table-border-color: #e7e7e7;
  --tab-color: #7C7F1A;
  --history-dark-blue: #092546;
  /* Global Typography */
  --large-text-fs: clamp(5.4rem, -5.16rem + 17.6vw, 23rem);
  --stats-fs: clamp(5.6rem, 3.2rem + 4vw, 9.6rem);
  --h1-fs: clamp(4rem, 1.6rem + 4vw, 8rem);
  --h2-plus-fs: clamp(3.2rem, 1.76rem + 2.4vw, 5.6rem);
  --h2-fs: clamp(2.8rem, 1.6rem + 2vw, 4.8rem);
  --h3-fs: clamp(2.4rem, 1.44rem + 1.6vw, 4rem);
  --h4-fs: clamp(2rem, 1.28rem + 1.2vw, 3.2rem);
  --h5-fs: clamp(1.8rem, 1.44rem + 0.6vw, 2.4rem);
  --h6-fs: clamp(1.4rem, 1.04rem + 0.6vw, 2rem);
  --body-large-fs: clamp(1.6rem, 1.48rem + 0.2vw, 1.8rem);
  --body-small-fs: clamp(1.4rem, 1.28rem + 0.2vw, 1.6rem);
  --quote-fs: clamp(2rem, 1.76rem + 0.4vw, 2.4rem);
  --intro-fs: clamp(1.8rem, 1.56rem + 0.4vw, 2.2rem);
  --tags-fs: clamp(1.4rem, 1.28rem + 0.2vw, 1.6rem);
  --button-fs: clamp(1.6rem, 1.36rem + 0.4vw, 2rem);
  --nav-fs: clamp(1.6rem, 1.48rem + 0.2vw, 1.8rem);
  /* Font Family */
  --font-heading: "Poppins", sans-serif;
  --font-body: "Roboto", sans-serif;
  /* Font weight */
  --fw-extra-light: 100;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extra-bold: 800;
  /* Line heights (Mobile) */
  --large-text-lh: 86px;
  --stats-lh: 64px;
  --h1-lh: 48px;
  --h2-plus-lh: 40px;
  --h2-lh: 36px;
  --h3-lh: 32px;
  --h4-lh: 28px;
  --h5-lh: 24px;
  --h6-lh: 24px;
  --body-large-lh: 22px;
  --body-small-lh: 20px;
  --quote-lh: 28px;
  --intro-lh: 28px;
  --tags-lh: 20px;
  --button-lh: 24px;
  --nav-lh: 24px;
}

@media (min-width: 576px) {
  :root {
    /* Line heights (Tablet) */
    --large-text-lh: 112px;
    --stats-lh: 88px;
    --h1-lh: 72px;
    --h2-plus-lh: 56px;
    --h2-lh: 48px;
    --h3-lh: 44px;
    --h4-lh: 32px;
    --h5-lh: 30px;
    --h6-lh: 24px;
    --body-large-lh: 24px;
    --body-small-lh: 20px;
    --quote-lh: 30px;
    --intro-lh: 28px;
    --tags-lh: 24px;
  }
}
.clamp-test {
  font-size: var(--h5-font-size);
}

@media (min-width: 1200px) {
  :root {
    /* Line heights (Desktop) */
    --large-text-lh: 264px;
    --stats-lh: 80px;
    --h1-lh: 96px;
    --h2-plus-lh: 64px;
    --h2-lh: 56px;
    --h3-lh: 48px;
    --h4-lh: 40px;
    --h5-lh: 32px;
    --h6-lh: 28px;
    --body-large-lh: 24px;
    --body-small-lh: 24px;
    --quote-lh: 32px;
    --intro-lh: 32px;
    --tags-lh: 24px;
    --button-lh: 28px;
  }
}