/* ------------------- // ESTILOS GERAIS //------------------- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

body {
    padding: 0;
    margin: 0;
    width: 100vw;
    overflow-x: hidden;
}

.container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 0;
}

/* ------------------- // CABEÇALHO //------------------- */


header {
    background-image: url("assets/testedofundo.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 98.5vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    padding-bottom: 9vh;
    width: 100vw;
}

.mulher {
    position: absolute;
    margin-top: 99.2vh;
    left: 55vw;
}

.mulher img {
    height: 83vh;
    width: 45vw;
}

nav {
    width: 90vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2vh auto;
}

.logo {
    width: 22vw;
    margin-right: 5vw;
}

.menu {
    list-style: none;
    display: flex;
    gap: 2vw;
}

html {
    scroll-behavior: smooth;
}


.menu li a {
    text-decoration: none;
    font-size: 1.4vw;
    color: rgb(255, 255, 255);
}

.social-icons img {
    width: 2vw;
    margin-left: 0vw;
    margin-right: 2.2vw;
    vertical-align: middle;
}

.social-icons img[alt="WhatsApp"] {
    width: 2.8vw;
    margin-top: 0.2vw;
    vertical-align: middle;
}

.social-icons a {
    text-decoration: none;
}


.container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90vw;
    margin: auto;
    flex: 1;
}

/* TEXTO */
.text h1 {
    font-size: 6vw;
    color: #511c35;
    font-weight: 550;
    line-height: 1.1;
    margin-left: 10vw;
}

/* ------------------- // PRODUTOS //------------------- */
.grid-produtos {

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2vw;
    justify-content: center;
    max-width: 60vw;
    margin: auto;
    margin-bottom: 1vh;
    margin-top: 11vh;
}

h2 {
    text-align: center;
    font-size: 2.5vw;
    font-weight: bold;
    color: #511c35;
    text-transform: uppercase;
    margin-top: 14vh;
    letter-spacing: 1px;
}


.produtos {
    position: relative;
    text-align: center;
}


.produto img {
    width: 100%;
    height: auto;
    border-radius: 2.3vh;
    transition: transform 0.3s;
}

.produto:hover img {
    transform: scale(1.05);
}

.linha-galao {
    grid-column: span 2;
}

/* ------------------- // SOBRE A EMPRESA //------------------- */
.sobre {
    margin-top: 5vh;
    background: linear-gradient(to right, #d76a9e, #5f6cc3);
    padding: 6vh;
    border-radius: 0;
    display: flex;
    justify-content: center;
}

.sobre-container {
    display: flex;
    align-items: center;
    width: 10vw;
    width: 100%;
}

.sobre-img {
    width: 25vw;
    height: auto;
    margin-left: 5vw;
}

.sobre-text {
    font-size: 2.5vh;
    font-weight: 450;
    color: #ffffff;
    text-align: right;
    max-width: 60vw;
    margin-right: 16vh;
    margin-left: 7vw;
    line-height: 1.5;
}

/* ------------------- // DISTRIBUIDORES //------------------- */
.distribuidor-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4vw;
    padding: 5vh 5vw;
}

.distribuidor-img {
    width: 90vw;
    height: 60vh;
    display: flex;
    justify-content: center;
}

.distribuidor-img img {
    width: 70%;
    height: auto;
    vertical-align: top;
    margin-left: 19vw;
    margin-right: 4vw;
}

.distribuidor-text {
    width: 70vw;
    padding-right: 5vw;
   text-align: right;


}

.distribuidor-text h2 {
    font-size: 5vh;
    margin-bottom: 3vh;

    text-align: right;
    color: #423977;
}

.distribuidor-text p {
    font-size: 2.5vh;
    margin-bottom: 2vh;
    text-align: right;
}

.botao-contato {
    display: inline-block;
    background-color: #AD7FCB;
    color: white;
    padding: 2vh 4vw;
    font-size: 2vh;
    font-weight: bold;
    text-transform: uppercase;
    border: none;
    border-radius: 2vh;
    cursor: pointer;
    transition: 0.3s;
    width: 17vw;
    height: 8vh;

}

.botao-contato:hover {
    background-color: #8B5FBF;
}

.formulario-contato {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5vh;
    margin-top: 3vh;
}

.formulario-contato h3 {
    font-size: 3vh;

    color: #423977;
}

.formulario-contato input,
.formulario-contato textarea {
    width: 80%;
    padding: 1vh;
    border: 1px solid #AD7FCB;
    border-radius: 1vh;
    font-size: 1.8vh;
}

.formulario-contato textarea {
    resize: none;
    height: 15vh;
}



/* ------------------- // REDES SOCIAIS //------------------- */
.redes-sociais {
    text-align: center;
    color: #423977;
    font-size: 2.5vw;
}

.redes-sociais h4 {
    color: #000;
}

.instagram-feed {
    max-width: 100%;
    margin: 0 auto;
    overflow: hidden;
}



#curator-feed-default-feed-layout {
    width: 1000px;
    height: 500px;
    margin: 0 auto;

}


.crt-logo {
    display: none !important;
}


.crt-post-hover {
    display: none !important;
}


/* ------------------- // RODAPÉ //------------------- */
* {

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

body {
    background-color: #f4f4f4;
}

html {
    scroll-behavior: smooth;
}


.footer {
    margin-top: 13vh;
    background: linear-gradient(to right, #e76b8d, #6b69d6);
    color: white;
    padding: 5vh 0;
    text-align: center;
    width: 100vw;
}

.container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 85vw;
    margin-right: 11vw;
    flex-wrap: wrap;
}

.logo img {
    width: 24vw;
    height: auto;
}

.info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 45vw;
}

.links {
    list-style: none;
    text-align: left;
    margin-left: 5vw;
}

.links li {
    margin: 1.5vh 0;
    display: flex;
    align-items: center;

}

.contacts {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contacts img[alt="WhatsApp"] {
    width: 2.8vw;
}

.contacts li {
    display: flex;
    align-items: center;
    margin-right: 10vw;
}

.contacts a {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.8vh;
    color: white;
    text-decoration: none;
    border: none;
    background-color: transparent;
}

.contacts a:hover {
    color: #ddd;
}

.contacts i {
    font-size: 18px;
    color: white;
}

.contacts img {
    width: 2vw;
    margin-right: 1vw;
}

.links a {
    color: white;
    text-decoration: none;
    font-size: 1.8vh;
    padding-right: 8vh;

}

.divider {
    width: 70vw;
    height: 0.3vh;
    background: rgba(255, 255, 255, 0.5);
    margin: 3vh auto;
}

.copyright {
    font-size: 1.5vh;
}


/* ----------  // MOBILE REWORK  //---------*/
@media(max-width: 450px ) {
    body{
        overflow-x: hidden;
        max-width: 100% !important;
    }

    .logo {
    width: 15vw;
    margin-left: -2vw;
    }

    .menu li a{
        font-size: 1.15vh;
       
    }
    .menu{
        margin-left: -11vw;
        margin-top: -0.5vh;
    }

    .social-icons img{
        width: 3vw;
    }

    .social-icons img[alt="WhatsApp"] {
        width: 4vw !important;
    }

    .text h1{
        font-size: 7.5vw;
        margin-left: 4vw;
        margin-top: 3vh;
    }

    .mulher img{
        height: 30vh !important;
        width: 55vw;
        padding-top: 0 !important;
        margin-left: -8vw;
    }
    .mulher{
        margin-top: 50vh;
    }

    header{
        width: 100vw;
        height: 43vh !important;
    }

    h2{
        margin-top: 5vh;
     }
 
     .grid-produtos{
         margin-top: 5vh;
     }

     .sobre-text{
        font-size: 2vw;
        margin-left: 5vw;
        margin-right: 2vw;
     }

     .sobre-img{
        width: 26vw;
     }

     .distribuidor-img{
        height: 40vh;
        margin-left: -17vw;
     }

     .distribuidor-text h2{
        text-align: center;
        font-size: 5vw ;
        margin-left: 2vw;
     }

     .distribuidor-text p{
        text-align: justify;
        font-size: 3vw;
        margin-left: 2vw;
     }

     .distribuidor-text p strong{
        margin-left: 6.5vw;
     }

     .botao-contato {
        width: 50vw;
        font-size: 3vw;
        height: min-content;
        margin-right: 7vw;
    }

    .redes-sociais{
        margin-top: -5vh;
    }

    .distribuidor-container {
        flex-direction: column;
        text-align: center;
    } 

    #curator-feed-default-feed-layout{
        height: 273px;
        width: 35vw;
    }

    .footer{
        margin-top: 5vh;
        padding-left: 5vw;
    }

    .logo {
        width: 10vw !important;
        margin-left: -35vw;
    }

    .links{
        margin-left: -15vw;
    }
    
   

    .info{
        margin-left: -5vw;
    }

    .info ul li a{
        font-size: 2vw;
        margin-right: -15vw;
       
    }


}