/* resetando configurações padrões do navegador  */
@import url("./reset.css");

/* arquivo separado com estilos responsivos em css realizando um "Bundle" entre arquivos css chamando apenas um no HTML5 */
@import url("./responsive.css");


/*importando fontes google do projeto  */
@import url("./fonts.css");



/* seção de elementos generalizados */

body{
    position:relative;
    background-color: #FFFFFF;
    max-width: 95rem;
    min-height: 160rem;
    ;
}



/*  seção de estilização do cabeçalho */

/* tela 1440pc e 1024px de largura  */

header{
    position: absolute;
    width: 90rem;
    height: 28.675rem;
    left: 0px;
    top: 0px;
    
}
header img{
    position: absolute;
    width: 151.90rem;
    height: 28.6875rem;
    left: 0px;
    top: 0px;
}

header .conteudo{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0px;
    gap: 24px;
    margin:0 2rem;
    position: relative;
    max-width: 50.4375rem;
    height: 16.875rem;
    left:18.125rem;
    top: 5.875rem;
}

header .conteudo h1{
    position:relative;
    color:#FFFFFF;
    text-transform: uppercase;
    font-family: 'Luckiest Guy',cursive;
    font-weight: 400;
    font-size: 3rem;
    max-width: 14.875rem;
    min-width: 16.375rem;
    height:7rem;
    text-align: center;
    

}

header .conteudo p{
width:40.1875rem;
height: 4.125rem;

font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.125rem;
text-align: center;
color: #FFFFFF;
flex: none;
order: 1;
flex-grow: 0;

}

header .conteudo .conteudo-botao{
    display: flex;
    flex-direction: row;
    justify-content: center;
    order:2;
    flex-grow:0;
    align-items: center;
}


header .conteudo button{
    background-color: #FFFFFF;
    border-radius:1.75rem;
    font-size:1rem;
    font-style:normal;
    font-weight: 400;
    text-transform:capitalize;
    margin:0.5rem 1rem;
    border:0.0625rem transparent #FFFFFF;
    cursor: pointer;
    -webkit-border-radius:1.75rem;
    -moz-border-radius:1.75rem;
    -ms-border-radius:1.75rem;
    -o-border-radius:1.75rem;
    
}
header .conteudo button.preto{
    width:17.5625rem;
    height:2.75rem;
    background:#23272A;
    color:#FFFFFF;
    font-size:1rem;
    line-height:1.375rem;
    font-family:"Open Sans";
    
}

header .conteudo button.branco{
    background-color: #FFFFFF;
    font-size:1rem;
    font-style:normal;
    text-align:center;
    line-height: 22px;
    width:12.8125rem;
    height:2.75rem;
    font-family:"Open Sans";
    
}



/* seção do conteudo principal da página */
main section{
    width:100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0px;
    gap: 16px;
    
}



/* seção um  */



main section .seçao-um {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
position: absolute;
width:250vh;
height: 24.625rem;
flex-grow: 1;
top: 31.1875rem;

}
main section .seçao-um img{
    max-width:30rem;
    height:22rem;
    flex: none;
    position: absolute;
    left: 22rem;
    bottom: 3.3rem;
    order: 0;
    flex-grow: 0;
}

main section .seçao-um .descricao-um h1{
    display: flex;
    font-family:"Open Sans";
    position: absolute;
    font-style: bold;
    font-weight:800;
    font-size:2.5rem;
    line-height:3.375rem;
    text-align: left;
    width:16.875rem;
    height: 23.125rem;
    left: 51.9375rem;
    top: 0.625rem;
    margin:0;
    order:0;
    
}
main section .seçao-um .descricao-um p{
    font-family:"Open Sans";
    font-style: normal;
    line-height:22px;
    font-weight:400;
    font-size:18px;
    position: absolute;
    width: 348px;
    height: 88px;
    left: 800px;
    top: 296px;
    margin:0 2rem;
    order:0;
}


/* seção dois */

main section .seçao-dois{
    background:#F6F6F6;
    display:flex;
    flex-direction:row;
   flex-grow:1;
   position:absolute;
   width:250vh;
   height:448px;
   left:0px;
   top:950px;

}

main section .seçao-dois img{
    order:1;
    align-items: center;
    display: flex;
    flex-direction: row;
    position:absolute;
    left:28rem; 
    margin:0 13rem;
    max-width: 607px;
    height: 394px;
}
main section .seçao-dois .descricao-dois h1{
    position: absolute;
    width: 329px;
    height: 108px;
    left: 290px;
    top: 118px;
    order:0;
    
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    font-size: 40px;
    line-height: 54px;
}

main section .seçao-dois .descricao-dois p{
    position: absolute;
    width: 348px;
    height: 88px;
    left: 290px;
    top: 242px;

    font-family: 'Open Sans';
    font-style: bold;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
}

/* seção três */
main section .seçao-três{
  display:flex;
  flex-direction: row;
  justify-content:center;
  align-items:center;
  padding:0;
  flex-grow: 1;
  gap:16px;
  position:absolute;
  width:250vh;
  height:28rem;
  left:0px;
  top:88.8125rem;


}
main section .seçao-três img{
    max-width:37.9375rem;
    height:24.625rem;
    flex:none;
    position:absolute;
    left:15rem;
}
main section .seçao-três .descricao-três h1{
    font-family: 'Open Sans';
    font-style:bold;
    position:absolute;
    width:19.3125rem;
    height:6.75rem;
    left:51.625rem;
    top:6.6875rem;
    font-weight: 800;
    font-size:2.5rem;
    line-height:3.375rem;

}

main section .seçao-três .descricao-três p{
    position:absolute;
    width:20.5rem;
    left:51.625rem;
    top:231px;
    font-family: "Opens Sans";
    font-style:normal;
    font-weight:400;
    font-size:1.125rem;
    line-height: 1.375rem;
}

/* seção quatro */


main section .seçao-quatro{
    display:flex;
    flex-direction:column;
    position:absolute;
    width:250vh;
    height:48rem;
    left:0;
    justify-content: center;
    align-items: center;
    top:119.3125rem;
    background-color:#F6F6F6;

}
main section .seçao-quatro img{
    max-width:46.5rem;
    height:31.75rem;
    order:2;

}
main section .seçao-quatro .descricao-quatro h1{
    width:608px;
    height:80px;
    font-family:"Luckiest Guy";
    font-style:bold;
    font-weight:400;
    font-size:40px;
    text-align:center;
    margin-bottom: 2rem;
    margin-left: 5rem;
    order:0;
    flex:none;
    flex-grow:0;

}

main section .seçao-quatro .descricao-quatro p{
    width:780px;
    height:44px;
    order:1;
    font-family:"Opens Sans";
    font-style:normal;
    font-weight:400;
    font-size:18px;
    line-height:22px;
    text-align:center;


}

/* seção footer (rodapé da página */


footer{
    position:relative;
    width:101.25rem;
    height:8.375rem;
    left:0px;
    top:166.125rem;
    background-color:#23272A;
    
}
footer figure{
    margin:1rem 35rem;
}

footer figure img{
   width:230px;
   height:63px;
}