/* From fluid-type-scale.com */

/* For browsers that support clamp and container queries */
@supports (font-size: clamp(1rem, 1cqi, 1rem)) {
    :root {
          --fs-xsm: clamp(0.64rem, 0.12cqi + 0.61rem, 0.7rem);
          --fs-sm: clamp(0.8rem, 0.25cqi + 0.74rem, 0.94rem);
          --fs: clamp(1rem, 0.45cqi + 0.89rem, 1.25rem);
          --fs-md: clamp(1.25rem, 0.76cqi + 1.06rem, 1.67rem);
          --fs-lg: clamp(1.56rem, 1.2cqi + 1.26rem, 2.22rem);
          --fs-xlg: clamp(1.95rem, 1.83cqi + 1.5rem, 2.96rem);
          --fs-xxlg: clamp(2.44rem, 2.74cqi + 1.76rem, 3.95rem);
          --fs-xxxlg: clamp(3.05rem, 4.02cqi + 2.05rem, 5.26rem);
    }
  }
  /* For browsers that don't support clamp or container queries */
  @supports not (font-size: clamp(1rem, 1cqi, 1rem)) {
    :root {
          --fs-xsm: 0.64rem;
          --fs-sm: 0.8rem;
          --fs: 1rem;
          --fs-md: 1.25rem;
          --fs-lg: 1.56rem;
          --fs-xlg: 1.95rem;
          --fs-xxlg: 2.44rem;
          --fs-xxxlg: 3.05rem;
    }
    @media screen and (min-width: 1280px) {
      :root {
              --fs-xsm: 0.7rem;
              --fs-sm: 0.94rem;
              --fs: 1.25rem;
              --fs-md: 1.67rem;
              --fs-lg: 2.22rem;
              --fs-xlg: 2.96rem;
              --fs-xxlg: 3.95rem;
              --fs-xxxlg: 5.26rem;
      }
    }
  }

:root {
    --red: #f00;
    --black: #000;
    --white: #fff;
    
    /* MDLS -> Express */
    
    /* Color Theme Swatches in Hex */
    --xdk: #31353D;
    --blue: #445878;
    --green: #323738;
    --green-lt: #8AA8B0;
    --nearwhite: #EEEFF7;
    --greyish: #677174;
    --orange: #F26101;
       
    --red-dk: #994842;
    
    --grey: #777;
    --grey-xxlt: #f8f8f8;
    --grey-xlt: #eee;
    --grey-lt: #aaa;
    --grey-dk: #444;
    --grey-xdk: #222;
    
    --text-clr: var(--xdk);
    
    --ff-s: Inter, sans-serif;
    
    --lh: 1.4;
    --lh-form: 1.15;
    
    --spc-xsm: 0.25rem;
    --spc-sm: 0.5rem;
    --spc: 1rem;
    --spc-lg: 1.25rem;
    --spc-xlg: 1.5rem;
    --spc-xxlg: 2rem;
    
    --bkpt-sm: 40rem; /* 640px */
    --bkpt-md: 55rem; /* 880px */
    --bkpt-lg: 70rem; /* 1120px */
}