@layer tokens, ui-kit, layout, header, address, footer, slider, accordion, image-viewer, components, utilities;

@layer {
  *, *::before, *::after {
      box-sizing: border-box;
  }

  body {
    margin: 0;
    font-family: 'Onest', 'Onest Fallback', sans-serif;
    background: var(--dark);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  main {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 100%;
  }

  html {
    scroll-behavior: smooth;
    scroll-padding-top: 7em;
  }

  button, a, [role="button"] {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
  }
}