/**
 * @file
 * The variables.
 *
 * It includes styles variables for colors.
 */

/**
 * Global variables
 */

:root {

  /** Colors **/

  --color-primary--1: #2F2D3F;
  --color-primary--2: #5B577A;
  --color-primary--3: #8F8BAC;
  --color-primary--4: #C8C6D7;
  --color-primary--5: #F6F6FA;

  --color-secondary--gradiant-1: linear-gradient(91.81deg, #9F7F2D 0%, #D1B15E 100%);
  --color-secondary--gradiant-2: linear-gradient(94.14deg, #5B577A 3.22%, #8F8BAC 96.66%);
  --color-secondary--1: #F8F5F0;

  --color-neutral: #FFFFFF;


  /** Font Size **/

  --paragraph-size: 1rem;
  --paragraph-size-small: 0.8rem;

  --heading-size-extra-large: 2.067rem;
  --heading-size-large: 1.867rem;
  --heading-size: 1.467rem;
  --heading-size-small: 1.267rem;

}
@media all and (min-width: 1300px) {
  :root {
    --paragraph-size-small: 0.875rem;

    --heading-size-extra-large: 2.312rem;
    --heading-size-large: 2rem;
    --heading-size: 1.750rem;
    --heading-size-small: 1.312rem;
  }
}