/*

----01TYPOGRAPHY SYSTEM

-FONT SIZE (px)
10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98

-FONT WEIGHT (px)
Default:400
Medium: 500
semi-bold: 600
Bold: 700


-LINE HEIGHT
Default: 1
small: 1.05
Medium: 1.2
Paragraph default: 1.6
large: 1.8

-LETTER SPACING
-0.5px

    

-------03-Shadows


-------04-Border radius


-------5-White space

SPACING SYSTEM (px)
2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128

*/

/*=============================*/
/*=General reusable components=*/
/*=============================*/

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: sans-serif !important;
  font-size: 62.5%;
  overflow-x: hidden;
  scroll-behavior: smooth;

  /* Tab-port 900px */

  @media only screen and (max-width: 56.25em) {
    font-size: 50% !important;
  }

  /* Tab-land 1200px */

  @media only screen and (max-width: 75em) {
    font-size: 56.25%;
  }

  /* Big desktop 1800px */

  @media only screen and (min-width: 112.5em) {
    font-size: 75%;
  }
}

body {
  font-family: sans-serif !important;
  line-height: 1;
  font-weight: 400;
  color: var(--color-black);

  overflow-x: hidden;
}

::selection {
  background-color: var(--color-primary-tint-1);
  color: var(--color-black);
}

:focus {
  color: var(--color-primary-tint-1, 0.1);
}

.container {
  max-width: 120rem;
  margin: 0 auto;
  padding: 0 3.2rem;
}