html, body {
    overflow-x: hidden;
    background-color: #16181D;
    padding: 0;
    margin: 0;
         /* Cobrir toda a tela */
    width: 100vw;

}

.container_vertical {
    display: flex;

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

    flex-direction: column;
    text-align: center;
    margin-top: 128px;
    margin-left: 25%;
    margin-right: 25%;
    color: white;

}

.profile_border{


    width: 96px;
    height: 96px;
}

.container_horizontal {
    display: flex;
    justify-content: center;
    align-items: center;

}

.border_gray{
    border-radius: 999px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 16px;
    padding-right: 16px;
    background-color: #292C34;

}

.container_horizontal :hover{
    background-color: #3A3F4B;
    cursor: pointer;
}

.marg_16{
    
    gap: 16px;
    margin: 16px;
}

h1{
    font-family: Asap;
    font-weight: 700;
    font-style: Bold;
    font-size: 56px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;

}

.subtitle_1{
    font-family: Inconsolata;
font-weight: 400;
font-style: Regular;
font-size: 20px;
line-height: 120%;
letter-spacing: 0%;
text-align: center;
}


.subtile_2{
    font-family: Maven Pro;
    font-weight: 400;
    font-style: Regular;
    line-height: 140%;
    letter-spacing: 0%;
    text-align: center;
    width: 680px;
      
}



.red_letter {
    color: #E3646E;
}

.marg_top_99{
    margin-top: 99px;
}


.grid_projetos {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 24px; 
}

.card_projeto {
    background: #212429; 
    border: 1px solid #2F333B;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.card_projeto:hover {
    transform: translateY(-5px);
    border-color: #E3646E; 
    cursor: pointer;
}

.card_projeto img {
    width: 100%;
    height: 180px;
    object-fit: cover;
}

.card_info {
    padding: 16px;
    text-align: left;
}

.card_info h3 {
    font-family: Asap;
    font-weight: 700;
    font-style: Bold;
    font-size: 16px;
    
    line-height: 120%;
    letter-spacing: 0%;
    
}

.card_info p {
    font-family: Maven Pro;
    font-weight: 400;
    font-style: Regular;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: 0%;
    
}

.title_page2_margin{
    
    margin-bottom: 64px;

}
.title_page2_margin span{

    font-family: Inconsolata;
    font-weight: 400;
    font-style: Regular;
    font-size: 20px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    color: #E3646E;

}

.title_page2_margin h3{

    font-family: Asap;
    font-weight: 700;
    font-style: Bold;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    color: #E2E4E9;
    

}


.container_750px{
    height: 800px;
    margin: 0 auto;

    overflow-x: hidden;
    background-color: #16181D;
    padding: 0;
    margin: 0;
    background-image: url('Assets/BACKGROUND_LANDING.png'); 
    background-repeat: no-repeat;       
    background-size: cover;            
    width: 100vw;
}

.margin_5p{
    margin-top: 10%;
    margin-bottom: 5%;

}

.bg_darkGray{
    background-color: #0D0E11;
    margin: auto;
    padding: 16px;
}



.grid_servicos {
    display: grid;

    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.card_servico {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #2F333B;
    border-radius: 16px;
    padding: 40px 24px;
    transition: all 0.3s ease;
    width: 280px;
}


.card_servico:hover {
    border-color: #E3646E;
    background: rgba(227, 100, 110, 0.05);
    transform: translateY(-8px);
    cursor: pointer;
}

.card_servico h3 {
    font-family: Asap;
    font-weight: 700;
    font-style: Bold;
    font-size: 16px;

    line-height: 120%;
    letter-spacing: 0%;
    
}

.card_servico span{
    font-family: Maven Pro;
    font-weight: 400;
    font-style: Regular;
    font-size: 14px;

    line-height: 140%;
    letter-spacing: 0%;

}


.container_contatos{
    height: 900px;
    margin: 0 auto;

    overflow-x: hidden;
    background-color: #16181D;
    padding: 0;
    margin: 0;
    background-image: url('Assets/BACKGROUND_END.png'); 
    background-repeat: no-repeat;       
    background-size: cover;            
    width: 100vw;
}

.info_contatos{
    margin-top: 128px;
}

.info_contatos h1{
    font-family: Inconsolata;
    font-weight: 400;
    font-style: Regular;
    font-size: 20px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    color: #BB72E9;

}

.info_contatos p{

    font-family: Maven Pro;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    color: #C0C4CE;
    line-height: 140%;
    letter-spacing: 0%;
    text-align: center;
    
}

.info_contatos h3{
    font-family: Asap;
    font-weight: 700;
    font-style: Bold;
    font-size: 24px;
    color: #E2E4E9;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    

}


.container_buttons{
    display: flex;

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

    flex-direction: column;
    text-align: center;
    gap: 16px;
    
}

.button_contato{
    display: flex;
    padding: 20px;
    border-radius: 4px;
    width: 400px;
    background-color: #292C34;
    gap: 12px;
    font-family: Maven Pro;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    color: #C0C4CE;
    line-height: 140%;
    letter-spacing: 0%;
}



.button_contato:hover{
    background-color: #3A3F4B;
    cursor: pointer;
}

.seta{
    margin-left: auto;
}


.heght_480{
    height: 480px;
    padding-bottom: 120px;
    padding-top: 120px;
}