/* TOKENS */
@import url('tokens.css');

/* LAYOUT */
@import url('../css/style.css');

/* COMPONENTS */
@import url('../js/components/banner/style.css');
@import url('../js/components/call-to-action/style.css');
@import url('../js/components/customer-bar/style.css');
@import url('../js/components/faq/style.css');
@import url('../js/components/footer/style.css');
@import url('../js/components/header/style.css');
@import url('../js/components/link/style.css');
@import url('../js/components/title-page/style.css');

/* RESPONSIVE */
@import url('../css/media-queries.css');


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

html {
  scroll-behavior: smooth;
  scroll-padding-top: 2.875rem;
}

body {
  font-family: "Open Sans", sans-serif;
  background-color: var(--neutral-0);
  color: var(--neutral-600);
  overflow-x: hidden;
  position: relative;
  transition: all .2s ease;
  animation: intro 1.5s ease;
}

@keyframes intro {
  0% {
    opacity: 0;
    transform: scale(.8) translateY(-8%);
  }

  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}