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


body{
color:#222;
}


.container{
width:1200px;
max-width:90%;
margin:auto;
}


/* HEADER */


header{

height:80px;
background:white;
display:flex;
align-items:center;

}


.nav{

display:flex;
align-items:center;
justify-content:space-between;

}


.logo img{

height:45px;

}


nav a{

margin:0 18px;
text-decoration:none;
color:#333;
font-size:16px;

}


.quote{

background:#0066ff;
color:white;
padding:12px 25px;
border-radius:5px;
text-decoration:none;

}




/* HERO */


.hero{

height:650px;
background:
url("assets/hero.jpg")
center/cover;

}


.hero-overlay{

height:100%;
background:rgba(0,0,0,.45);

}


.hero-content{

padding-top:150px;
color:white;

}


.hero h1{

font-size:48px;
max-width:700px;

}


.hero h2{

margin:25px 0;
font-size:28px;

}


.hero p{

font-size:20px;
max-width:700px;
line-height:1.7;

}



.btn{

display:inline-block;
background:#0066ff;
color:white;
padding:15px 35px;
margin-top:30px;
text-decoration:none;
border-radius:5px;

}


.white{

background:white;
color:#0066ff;
margin-left:15px;

}



/* SECTION */


.section{

padding:80px 0;

}


h2{

text-align:center;
font-size:38px;
margin-bottom:30px;

}


.desc{

text-align:center;
margin-bottom:50px;

}




.cards{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}



.card{

border:1px solid #eee;
padding-bottom:25px;
background:white;

}


.card img{

width:100%;
height:220px;
object-fit:cover;

}


.card h3,
.card p,
.card a{

margin:15px;
display:block;

}



.card a{

color:#0066ff;
text-decoration:none;

}





.dark{

background:#101820;
color:white;
padding:80px 0;

}


.applications{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;

}



.applications div{

padding:30px;
background:#182633;

}





.factory{

display:flex;
align-items:center;
gap:60px;

}


.factory img{

width:50%;

}



.factory li{

margin:15px 0;

}





.cta{

background:#0066ff;
color:white;
text-align:center;
padding:70px;

}


footer{

padding:30px;
text-align:center;

}