/**
 * @file
 * Global variables
 *
 * Theme global variables.
 */

:root {
  font-size: 18px;
  --font-size-stylised: 2.222rem;  /* 40px */
  --font-size-xxxl    : 2rem;      /* 36px */
  --font-size-xxl     : 1.889rem;  /* 34px */
  --font-size-xl      : 1.778rem;  /* 32px */
  --font-size-subtitle: 1.778rem;  /* 32px */
  --font-size-l       : 1.278rem;  /* 23px */
  --font-size-m       : 1.222rem;  /* 22px */
  --font-size-s       : 1rem;      /* 18px */
  --font-size-xs      : 0.889rem;  /* 16px */

  --color-primary             : #B50B0B;
  --color-primary-grad: linear-gradient(180deg, #F6F7FA 0%, #E9ECF3 100%);
  --color-secondary           : #131313;
  --color-tertiary            : #130A0A;
  --color-neutral             : #FFFFFF;
  --color-grey-medium         : #ABABAB;
  --color-grey-dark           : #2F2F2F;
  --color-grey-dark-secondary : #4D5158;
  --color-grey-dark-tertiary  : #121111;
}
@media screen and (min-width: 800px) {
  :root {
    --font-size-stylised: 3.056rem;  /* 55px */
  }
}
@media all and (min-width: 1000px) {
  :root {
    --font-size-stylised: 3.889rem;  /* 70px */
    --font-size-xxxl    : 3.556rem;  /* 64px */
    --font-size-xxl     : 3rem;      /* 54px */
    --font-size-subtitle: 2.667rem;  /* 32px */
    --font-size-xl      : 2.5rem;    /* 45px */
    --font-size-l       : 1.444rem;  /* 26px */
    --font-size-xs      : 1rem;      /* 18px */
  }
}