/* ============================================
   CUSTOM FONT: PF Highway Sans Pro
   ============================================ */

@font-face {
    font-family: 'PF Highway Sans Pro';
    src: url('../fonts/PFHighwaySansPro-Regular.woff2') format('woff2'),
         url('../fonts/PFHighwaySansPro-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ============================================
   GOOGLE FONTS
   ============================================ */
/* Thin - 100 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Thin.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

/* Extra Light - 200 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

/* Light - 300 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* Regular - 400 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Medium - 500 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* SemiBold - 600 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* Bold - 700 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ExtraBold - 800 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* Black - 900 */
@font-face {
    font-family: 'Geologica';
    src: url('../fonts/Geologica-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* ============================================
   FONT VARIABLES
   ============================================ */

:root {
    /* Font Families */
    --font-primary: 'PF Highway Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-secondary: 'Geologica', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Font Weights */
    --font-thin: 100;
    --font-extralight: 200;
    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;

    /* Font Sizes */
    --fs-16: 1rem;        /* 16px */
    --fs-18: 1.125rem;    /* 18px */
    --fs-22: 1.375rem;    /* 22px */
    --fs-24: 1.5rem;      /* 24px */
    --fs-30: 1.875rem;    /* 30px */
    --fs-40: 2.5rem;      /* 40px */
    --fs-48: 3rem;        /* 48px */
    --fs-72: 4.5rem;      /* 72px */

    /* Line Heights */
    --lh-24: 24px;
    --lh-32: 32px;
    --lh-40: 40px;
    --lh-48: 48px;
    --lh-56: 56px;
    --lh-80: 80px;


    /*gia to mobile (<768px) */
    --mob-fs-Max: 20px;
    --mob-fs-Hi: 18px;
    --mob-fs-Lo: 16px;

    --mob-lh: 24px;
}