:root {
  
    --clr-primary-dark: #09090A;
    --clr-primary-white: #fff;
    --clr-primary-light: #f5f7fb;

    --clr-accent: #1D2A1D;
  
    --fc-primary: #09090A;
    --fc-dark: #000;
    --fc-light: #fff;

    --ff-primary: 'GoogleSans', sans-serif;
  
    --ff-body: var(--ff-primary);
    --ff-heading: var(--ff-primary);
  
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
  
    --fs-300: calc(12px + 0 * (100dvw - 320px) / 1600);
    --fs-400: calc(14px + 0 * (100dvw - 320px) / 1600);
    --fs-500: calc(16px + 4 * (100dvw - 320px) / 1600);
    --fs-600: calc(24px + 0 * (100dvw - 320px) / 1600);
    --fs-700: 1.875rem;
    --fs-800: 1.9rem;
    --fs-900: 3rem;

    --br-primary: 15px;
    --br-button: 4px;
    
    --fs-h1: calc(24px + 8 * (100dvw - 320px) / 1600);
    --fs-h3: calc(24px + 8 * (100dvw - 320px) / 1600);

    --fs-body: var(--fs-400);
    --fs-primary-heading: var(--fs-800);
    --fs-secondary-heading: var(--fs-700);
    --fs-nav: var(--fs-500);
    --fs-button: var(--fs-300);
  
    --shadow: 0px 0px 14px rgb(0 0 0 / 15%); 

    --height-header: 46px;
    --fc-nav: var(--fc-primary);
    --p-button: 10px 15px;
    --clr-border: #09090A;
    --clr-border-light: #E3E3E3;
    --fc-white: #ffffff;
    --fc-black: #000000;
    --fc-grey: grey;

    --bg-header: var(--clr-primary-white); 
    --bg-footer: #002732; 
    --bg-corporate: #00181f; 

    /* Paddings */
    --p-m: 20px;

    /* Gradients */
    --gr-dark: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}
