/* --- Roboto (from /phantom/assets/fonts/roboto) --- */
/* Optional WOFF2: Uncomment the .woff2 src lines once files exist.
   Place at /phantom/assets/fonts/roboto/*.woff2 and prefer woff2 first. */
@font-face {
  font-family: 'Roboto';
  /* src: url('/phantom/assets/fonts/roboto/Roboto-Regular.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/roboto/Roboto-Regular.woff') format('woff'),
       url('/phantom/assets/fonts/roboto/Roboto-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Medium';
  /* src: url('/phantom/assets/fonts/roboto/Roboto-Medium.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/roboto/Roboto-Medium.woff') format('woff'),
       url('/phantom/assets/fonts/roboto/Roboto-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Bold';
  /* src: url('/phantom/assets/fonts/roboto/Roboto-Bold.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/roboto/Roboto-Bold.woff') format('woff'),
       url('/phantom/assets/fonts/roboto/Roboto-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Light';
  /* src: url('/phantom/assets/fonts/roboto/Roboto-Light.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/roboto/Roboto-Light.woff') format('woff'),
       url('/phantom/assets/fonts/roboto/Roboto-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto-Thin';
  /* src: url('/phantom/assets/fonts/roboto/Roboto-Thin.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/roboto/Roboto-Thin.woff') format('woff'),
       url('/phantom/assets/fonts/roboto/Roboto-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

/* --- FNB Sans (from /phantom/assets/fonts/fnb_sans) --- */
/* Optional WOFF2: Uncomment the .woff2 src lines once files exist.
   Place at /phantom/assets/fonts/fnb_sans/*-webfont.woff2 and prefer woff2 first. */
@font-face {
  font-family: 'FNB-Sans';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-regular-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-regular-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-regular-webfont.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'FNB-Sans-Bold';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-bold-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-bold-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-bold-webfont.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'FNB-Sans-Light';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-light-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-light-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-light-webfont.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'FNB-Sans-Thin';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-thin-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-thin-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-thin-webfont.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'FNB-Sans-Italic';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-italic-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-italic-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-italic-webfont.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'FNB-Sans-Thin-Italic';
  /* src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-thinitalic-webfont.woff2') format('woff2'), */
  src: url('/phantom/assets/fonts/fnb_sans/fnb_sans-thinitalic-webfont.woff') format('woff'),
       url('/phantom/assets/fonts/fnb_sans/fnb_sans-thinitalic-webfont.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}


/* ------------------------------------------------------------------
   Typography scale only
   - Font faces and type scale live here
   - Utility classes (colors, alignment, font weights, transforms,
     letter-spacing) were moved to utilities.css to centralize
     generic utilities. Keep this file focused on semantic type sizes.
------------------------------------------------------------------- */

/* === Small/Display 1 === */
.d-1 { font-size: 57px; /* 57px */
  font-family: 'FNB-Sans', sans-serif;
  line-height: 71px; /* 71px */
}

/* === Small/Display 2 === */
.d-2 {
  font-size: 50px; /* 50px */
  font-family: 'FNB-Sans', sans-serif;
  line-height: 62px; /* 62px */
}

/* === Small/Display 3 === */
.d-3 {
  font-size: 46px; /* 46px */
  font-family: 'FNB-Sans', sans-serif;
  line-height: 57px; /* 57px */
}

/* === Small/Display 4 === */
.d-4 {
  font-size: 40px; /* 40px */
  font-family: 'FNB-Sans', sans-serif;
  line-height: 50px; /* 50px */
}

/* === Small/Heading 1 === */
.h-1 {
  font-size: 42px; /* 42px */
  font-family: 'Roboto', sans-serif;
  line-height: 50px; /* 50px */
}

/* === Small/Heading 2 === */
.h-2 {
  font-size: 37px; /* 37px */
  font-family: 'Roboto', sans-serif;
  line-height: 43px; /* 43px */
}

/* === Small/Heading 3 === */
.h-3 {
  font-size: 32px; /* 32px */
  font-family: 'Roboto', sans-serif;
  line-height: 38px; /* 38px */
}

/* === Small/Heading 4 === */
.h-4 {
  font-size: 28px; /* 28px */
  font-family: 'Roboto', sans-serif;
  line-height: 33px; /* 33px */
}

/* === Small/Heading 5 === */
.h-5 {
  font-size: 24px; 
  font-family: 'Roboto', sans-serif;
  line-height: 28px; 
}

/* === Small/Heading 6 === */
.h-6 {
  font-size: 22px; /* 22px */
  font-family: 'Roboto', sans-serif;
  line-height: 26px; /* 26px */
}

/* === Small/Body 1 === */
.b-1 {
  font-size: 18px; /* 18px */
  font-family: 'Roboto', sans-serif;
  line-height: 24px; /* 24px */
}

/* === Small/Body 2 === */
.b-2 {
  font-size: 16px; /* 16px */
  font-family: 'Roboto', sans-serif;
  line-height: 24px; 
}

/* === Small/Body 3 === */
.b-3 {
  font-size: 14px; /* 14px */
  font-family: 'Roboto', sans-serif;
  line-height: 18px; /* 18px */
}

/* === Small/Subtext === */
.subtext {
  font-size: 12px; /* 12px */
  font-family: 'Roboto', sans-serif;
  line-height: 16px; /* 16px */
}

.b-point:hover {
   text-decoration: underline;
}