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


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    border: none;
    outline: none;
    scroll-behavior: smooth;

}

/* Variáveis de cores */
:root { 
    --bg-color: #F9FAFB;
    --snd-bg-color: #1E293B;
    --main-color: #3B82F6;
    --snd-main-color: #06B6D4;
    --elements: #E2E8F0;

    --text-color: ##1E293B;
}

html {
    font-size: 62,5%;
    overflow-x: hidden; /* Conteúdo horizontal que ultrapassa a área da página será escondido */
}


body {
    font-family: 'Inter', sans-serif;
    background: var(--bg-color);
    color: var(--text-color);
    scroll-behavior: smooth;
}

section{
    min-height: 100vh;
    padding: 7rem 9% 2rem;
    justify-content: center;
}

h1, h2, h3, h4, h5, h6{
    font-family: 'Outfit', sans-serif;
    color: var(--text-color);
}

span{
    color: var(--main-color);
}


.btn{
    display: inline-block;
    padding: 1rem 2.5rem;
    background: var(--main-color);
    border-radius: 4rem;
    box-shadow: none;
    font-size: 1.2rem;
    color: var(--text-color);
    letter-spacing: 0.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: 0.3s ease;
}

    .btn:hover,
    .btn:focus{
        background: var(--elements);
        color: var(--snd-main-color);
        box-shadow: 0 0 20px var(--snd-main-color);
        transform: scale(1.05);
    }