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

body{
background:#111;
color:white;
}

header{

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

padding:20px 60px;

background:#000;

position:fixed;
width:100%;
z-index:100;

}

.logo{

font-size:30px;
font-weight:bold;
color:#ff0a0a;

}

nav a{

color:white;
text-decoration:none;
margin-left:25px;
transition:.3s;

}

nav a:hover{

color:#ff0a0a;

}

.hero{

height:100vh;

background:url("img/hero.jpg") center/cover;

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

}

.overlay{

background:rgba(0,0,0,.5);

padding:50px;

text-align:center;

}

.overlay h1{

font-size:60px;

margin-bottom:20px;

}

.overlay p{

font-size:22px;

margin-bottom:25px;

}

button{

padding:15px 35px;

background:#ff0a0a;

border:none;

color:white;

font-size:18px;

cursor:pointer;

transition:.3s;

}

button:hover{

background:#0062c4;

}

.models{

padding:120px 60px;

}

.models h2{

text-align:center;

margin-bottom:50px;

font-size:42px;

}

.grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

gap:30px;

}

.card{

background:#222;

border-radius:15px;

overflow:hidden;

transition:.4s;

}

.card:hover{

transform:translateY(-10px);

}

.card img{

width:100%;

height:220px;

object-fit:cover;

}

.card h3{

padding:20px;

}

.card p{

padding:0 20px 20px;

color:#ccc;

}

.card button{

margin:20px;

width:calc(100% - 40px);

}

footer{

background:#000;

padding:30px;

text-align:center;

margin-top:50px;

}