@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-VariableFont_opsz,wght.ttf") format("truetype");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf") format("truetype");
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
}

:root {
  --color-primary: #2870e4;
  --color-secondary: #131727;
  --color-text: #6d7792;
  --color-site-background: #f2f2f9;
  --font-family-base: Inter, sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--font-family-base);
  color: var(--color-text);
  background: var(--color-site-background);
  overflow-x: hidden;
}

html {
  scrollbar-gutter: stable;
  overflow-y: scroll;
  overflow-x: hidden;
}

html.is-initializing .site-header,
html.is-initializing .site-header::before,
html.is-initializing .header-top,
html.is-initializing .header-main {
  transition: none !important;
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary) #fff;
}

*::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

*::-webkit-scrollbar-track {
  background: #fff;
}

*::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 7px;
}
