body{
  margin:0;
  font-family:Arial;
  background:#fff8f0;
}

header{
  background:gold;
  text-align:center;
  padding:20px;
}

header h1{
  margin:0;
  font-size:40px;
}

nav{
  background:#111;
  padding:15px;
  text-align:center;
}

nav a{
  color:white;
  text-decoration:none;
  margin:15px;
  font-size:18px;
}

.hero{
  text-align:center;
  padding:80px 20px;
  background:linear-gradient(to right,#f9d976,#f39f86);
  color:white;
}

.hero h2{
  font-size:50px;
}

button{
  padding:12px 25px;
  border:none;
  background:black;
  color:white;
  font-size:18px;
  cursor:pointer;
}

.products{
  display:flex;
  justify-content:center;
  gap:20px;
  padding:40px;
  flex-wrap:wrap;
}

.card{
  background:white;
  width:300px;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 0 10px rgba(0,0,0,0.2);
}

.card img{
  width:100%;
  height:300px;
  object-fit:cover;
}

.card h3,p{
  text-align:center;
}

footer{
  background:black;
  color:white;
  text-align:center;
  padding:15px;
}