@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

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

html {
    scroll-behavior: smooth;
    max-width: 1920px;
    margin: auto;
    overflow-x: hidden;
    font-family: "Inter", serif;
    font-optical-sizing: auto;
    font-style: normal;
}

html.active {
    overflow: hidden !important;
}

body {
    overflow-x: hidden;
}



:root {
    /* Colors */
    --white: #fff;
    --black: #272523;
    --accent: #93503C;
    --grey: #9D9D9D;
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
}


/* Loader */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.loader {
    --size: 70px;
    width: var(--size);
    height: var(--size);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
}

.loader span {
    width: 100%;
    height: 100%;
    background-color: var(--accent);
    animation: keyframes-blink 0.6s alternate infinite linear;
}

.loader span:nth-child(1) {
    animation-delay: 0ms;
}

.loader span:nth-child(2) {
    animation-delay: 200ms;
}

.loader span:nth-child(3) {
    animation-delay: 300ms;
}

.loader span:nth-child(4) {
    animation-delay: 400ms;
}

.loader span:nth-child(5) {
    animation-delay: 500ms;
}

.loader span:nth-child(6) {
    animation-delay: 600ms;
}

@keyframes keyframes-blink {
    0% {
        opacity: 0.3;
        transform: scale(0.5) rotate(5deg);
    }

    50% {
        opacity: 1;
        transform: scale(1);
    }
}