:root {
  /** Colors **/
  --brand-primary-color: #FF8674;
  --brand-primary-medium-color: #FFE1DD;
  --brand-primary-light-color: #FFF2F1;
  --brand-secondary-color: #191E33;
  --brand-secondary-light-color: #F5F7FA;
  --brand-grey-medium: #5B6770;
  --brand-grey-light: #E7E8EA;
  --brand-white: #FFFFFF;

  --system-success-color: #31683A;
  --system-success-light-color: #EEF7EF;
  --system-fail-color: #DB3D3D;
  --system-fail-light-color: #FBE9E9;
  --system-warning-color: #C3830A;
  --system-warning-light-color: #FFE6B7;

  /** Font Size **/

  --paragraph-size-extra-large: 1.563rem;
  --paragraph-size-large: 1.25rem;
  --paragraph-size: 1rem;
  --paragraph-size-small: 0.813rem;
  --paragraph-size-extra-small: 0.625rem;

  --heading-size-extra-large: 1.938rem;
  --heading-size-large: 1.938rem;
  --heading-size: 1.562rem;
  --heading-size-small: 1.250rem;
  --heading-size-extra-small: 1.250rem;
}
@media all and (min-width: 1300px) {
  :root {
    /** Font Size **/

    --paragraph-size-extra-large: 1.556rem;
    --paragraph-size-large: 1.278rem;
    --paragraph-size: 1rem;
    --paragraph-size-small: 0.778rem;
    --paragraph-size-extra-small: 0.667rem;

    --heading-size-extra-large: 3.056rem;
    --heading-size-large: 2.444rem;
    --heading-size: 1.944rem;
    --heading-size-small: 1.556rem;
    --heading-size-extra-small: 1.278rem;
  }
}