/* RESET */

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

/* COLORI */

:root {
    --background-color: #D7D4CE;
    --text-color: #D0021B;
}

/* PAGINA */

html,
body {
    width: 100%;
    min-height: 100%;
}

body {
    min-height: 100vh;
    min-height: 100svh;

    background-color: var(--background-color);
    color: var(--text-color);

    font-family: "Archivo Black", Arial, sans-serif;

    overflow: hidden;
}

/* CONTENITORE */

.homepage {
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;
}

/* LOGO */

.logo {
    font-size: clamp(70px, 17.5vw, 380px);
    font-weight: 400;

    line-height: 0.85;
    letter-spacing: 0.02em;

    text-transform: uppercase;
    white-space: nowrap;

    user-select: none;

    transform: translateY(-2vh);
}

/* INVERSIONE COLORE AL PASSAGGIO DEL MOUSE */

@media (hover: hover) {

    body:hover {
        background-color: var(--text-color);
        color: var(--background-color);
    }

}

/* VERSIONE MOBILE */

@media (max-width: 600px) {

    .homepage {
        padding: 16px;
    }

    .logo {
        font-size: 15.5vw;
        letter-spacing: 0.01em;
        transform: translateY(-1vh);
    }

}