*{ 
  margin:0; 
  padding:0; 
  box-sizing:border-box; 
  font-family:Arial; 
} 
 
body{ 
  background:#000; 
  color:#fff; 
} 
 
/* NAVBAR */ 
.navbar{ 
  display:flex; 
  justify-content:space-between; 
  align-items:center; 
  padding:15px 20px; 
  background:#000; 
  position:sticky; 
  top:0; 
  z-index:1000; 
} 
 
.logo{ 
  font-size:20px; 
} 
 
.nav-links{ 
  display:flex; 
  list-style:none; 
} 
 
.nav-links li{ 
  margin-left:20px; 
} 
 
.nav-links a{ 
  color:#fff; 
  text-decoration:none; 
} 
 
/* MENU ICON */ 
.menu-toggle{ 
  display:none; 
  font-size:26px; 
  cursor:pointer; 
} 
 
/* HERO */ 
.hero{ 
  height:90vh; 
  background:url('images/smtop.png') center/cover no-repeat; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  text-align:center; 
} 
 
.overlay{ 
  background:rgba(0,0,0,0.4); 
  padding:20px; 
} 
 
.overlay h2{ 
  font-size:clamp(22px,5vw,42px); 
} 
 
.overlay span{ 
  font-style:italic; 
} 
 
.overlay button{ 
  margin-top:15px; 
  padding:10px 20px; 
  border:none; 
  background:#fff; 
  cursor:pointer; 
} 
 
/* ABOUT */ 
.about{ 
  display:flex; 
  gap:30px; 
  padding:50px 20px; 
  flex-wrap:wrap; 
} 
 
.about-text{ 
  flex:1; 
} 
 
.about-img{ 
  flex:1; 
} 
 
.about img{ 
  width:100%; 
} 
 
/* GRID */ 
.grid{ 
  display:grid; 
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); 
  gap:20px; 
  padding:20px; 
} 
 
.card img, 
.news-card img{ 
  width:100%; 
} 
 
.card p, 
.news-card h3{ 
  margin-top:10px; 
} 
 
/* SECTIONS */ 
.collection, .news{ 
  padding:50px 20px; 
} 
 
.contact{ 
  text-align:center; 
  padding:50px 20px; 
} 
 
/* WHATSAPP */ 
.whatsapp{ 
  position:fixed; 
  bottom:20px; 
  right:20px; 
  background:green; 
  color:#fff; 
  padding:15px; 
  border-radius:50%; 
  font-size:22px; 
  text-decoration:none; 
} 
/* CONTACT */ 
.contact{ 
  background:url('images/smbot.png') center/cover no-repeat; 
} 
.btn{ 
  display:inline-block; 
  padding:10px 20px; 
  background:white; 
  color:black; 
  text-decoration:none; 
  margin-top:15px; 
} 
 
/* MOBILE */ 
@media(max-width:768px){ 
 
  .menu-toggle{ 
    display:block; 
  } 
 
  .nav-links{ 
    display:none; 
    flex-direction:column; 
    width:100%; 
    background:#000; 
    text-align:center; 
  } 
 
  .nav-links.active{ 
    display:flex; 
  } 
 
  .nav-links li{ 
    margin:15px 0; 
  }
   
}