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

/* jost-latin-wght-normal */
@font-face {
    font-family: 'Jost Variable';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url(https://cdn.jsdelivr.net/fontsource/fonts/jost:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

body, html {
    background-color: var(--white);
    /* Grid Pattern Sutil */
    background-image: 
        linear-gradient(var(--gris3) 1px, transparent 1px),
        linear-gradient(90deg, var(--gris3) 1px, transparent 1px);
    background-size: 40px 40px;
    background-position: center top;
    
    font-family: 'Jost Variable', system-ui, sans-serif;
    margin: 0;
    padding: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

header {
    background-color: var(--azul-marginlab);
    background-image: var(--gradient-header);
    background-size: 200%;
    background-position: center;
    height: 110px;
    padding: 20px;
    display: flex;
    align-items: center;
    padding: 0 15%;
    position: relative;
    justify-content: center;
    transition-duration: 500ms;
}

header a {
    height: 65%;
    overflow: visible;
    color: white;
}

header a .logo {
  height: 100%;
  width: 100%;
}

footer {
    background-color: #D9D9D9;
    width: 100%;
    height: 30px;
    font-size: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

footer a {
  text-decoration: none;
  color: var(--azul-marginlab);

}