@import '_vars'
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700&display=swap')

html
    scroll-behavior: smooth

body
    background-color: $background

nav, main, footer
    max-width: $main-width
    margin: 0 auto

*, *::before, *::after
    box-sizing: border-box
    border: none
    color: $text
    font-family: 'Inter', sans-serif

a
    text-decoration: none

h1, h2, h3
    &, *
        font-weight: 700
        line-height: 4.8rem
        font-family: 'Syne', sans-serif

img
    display: block
    max-width: 100%

p
    line-height: 18px
    line-height: 32px

:focus:not(:focus-visible)
    outline: none

mark
    color: $text
    background: $primary-light
    padding: 5px 7px
    border-radius: 5px

@media (max-width: 900px)
    body
        margin: 0 2rem