*{

margin:0;
padding:0;
box-sizing:border-box;

}


body{

font-family:Arial;
line-height:1.6;

}



/* CONTAINER */

.container{

max-width:1200px;
margin:auto;
padding:20px;

}



/* HEADER */

header{

background:white;
box-shadow:0 2px 10px rgba(0,0,0,0.1);

}


.header-flex{

display:flex;
justify-content:space-between;
align-items:center;

}



.logo{

height:60px;

}



/* MENU */

nav a{

margin-left:20px;
text-decoration:none;
color:black;
font-weight:bold;

}


nav a:hover{

color:#ff6b00;

}



/* FLAGS */

.flags img{

width:32px;
cursor:pointer;
margin-left:10px;

}



/* MENU MOBILE */

.menu-mobile{

display:none;
font-size:28px;
cursor:pointer;

}




/* HERO */

.hero{

background:linear-gradient(135deg,#0f0f0f,#2b2b2b);

color:white;

}



.hero-grid{

display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:center;

}


.hero img{

max-width:500px;
width:100%;

}



/* BOTÃO */

.btn{

background:#ff6b00;
color:white;
padding:12px 25px;
text-decoration:none;
border-radius:5px;
display:inline-block;
margin-top:20px;

}




/* SOBRE */

.grid-3{

display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:30px;
text-align:center;

}


.grid-3 img{

width:100%;
max-width:300px;
height:200px;
object-fit:cover;
border-radius:10px;
margin-bottom:15px;

}



/* SERVICOS */

.grid-4{

display:grid;
grid-template-columns:1fr 1fr 1fr 1fr;
gap:30px;

}


.card{

background:white;
padding:30px;
border-radius:10px;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
text-align:center;

}



/* CONTATO */

.contato{

background:#f4f4f4;
text-align:center;

}



/* FOOTER */

footer{

background:#0f0f0f;
color:white;
text-align:center;
padding:20px;
margin-top:40px;

}



/* RESPONSIVO */

@media(max-width:900px){

.hero-grid{

grid-template-columns:1fr;

}


.grid-3{

grid-template-columns:1fr;

}


.grid-4{

grid-template-columns:1fr;

}


nav{

display:none;

}


.menu-mobile{

display:block;

}

}
