/* Fonts */
@import url("/assets/fonts/fonts.css");
/* Base */
@import url("base/reset.css");
@import url("base/normalize.css");
/* Utils */
@import url("utils/variables.css");

/* Components */
@import url("components/hero.css");
@import url("components/benefits.css");
@import url("components/products.css");
@import url("components/our-partners.css");
@import url("components/about-us.css");

/* Layouts */
@import url("layout/header.css");
@import url("layout/footer.css");
@import url("layout/modal.css");

/* Containers */
@import url("utils/container.css");

:root {
  font-family: var(--base-font);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--main-color);
  transition: var(--transition-time) var(--transition-effect);
  overflow-x: hidden;
}

.visually-hidden {
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  margin: -1px;
}

.is-hidden {
  visibility: hidden;
  pointer-events: none;
}