/* =========================
   RESET GERAL
   ========================= */

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

html, body {
    overflow-x: hidden;
    background-color: #50207A;
}


/* =========================
   HEADER
   ========================= */

header {
    background-color: #50207A;
    height: 80px;
    width: 100%;
    display: flex;
    align-items: center;
}


/* =========================
   LOGO
   ========================= */

.logo-grid {
    display: flex;
    align-items: center;
    padding-left: 5%;
    height: 80px;
    flex: 1;
    cursor: pointer;
}

.logo-grid img {
    height: 60px;
}


/* =========================
   MENU
   ========================= */

.sections-grid {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 80px;
    flex: 1;
    padding-right: 5%;
    gap: 40px;
}

.sections-grid a {
    font-family: "Inter", "Arial", sans-serif;
    font-size: 20px;
    color: #FFF;
    text-decoration: none;
    font-weight: 700;
}


/* =========================
   MAIN
   ========================= */

main {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100vh - 80px);
}


/* =========================
   SECTION
   ========================= */

section {
    display: flex;
    min-height: 100vh;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 0 5%;
    gap: 44px;
}


/* =========================
   TEXTO
   ========================= */

.title-grid {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;

}

.title-grid h3 {
    font-family: "Inter", "Arial", sans-serif;
    font-size: 22px;
    color: #FFF;
    font-weight: 700;
}

.title-grid h1 {
    font-family: "Poppins", "Inter", "Arial", sans-serif;
    font-size: 52px;
    color: #FFF;
    font-weight: 700;
}


/* =========================
   FOTO DE PERFIL
   ========================= */

.perfil-grid {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.perfil-grid img {
    width: 100%;
    max-width: 400px;
    height: auto;
    border-radius: 5%;
}