:root{
  --khaki:#C3B091;
  --dark:#A08D6F;
  --deep:#4B463C;
  --light:#F7F4ED;
}

*{box-sizing:border-box;}

body{
  margin:0;
  font-family:Segoe UI, sans-serif;
  background:var(--light);
  color:#333;
}

header{
  background:var(--deep);
  color:white;
  padding:18px 60px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

header h1{
  margin:0;
  letter-spacing:1px;
}

nav a{
  color:white;
  margin-left:30px;
  text-decoration:none;
  font-weight:600;
}

nav a.active,
nav a:hover{
  color:var(--khaki);
}

.container{
  display:flex;
  padding:40px 60px;
  gap:40px;
}

.main{flex:1;}

.section h2{
  margin-bottom:25px;
  color:var(--deep);
}

.grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:35px;
}

.card{
  background:white;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,0.08);
  display:flex;
  flex-direction:column;
  transition:0.3s;
  height:100%;
}

.card:hover{
  transform:translateY(-5px);
  box-shadow:0 14px 40px rgba(0,0,0,0.12);
}

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

.content{
  padding:20px;
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:150px;
  box-sizing:border-box;
}

.content h3{
  margin:0 0 10px;
  color:var(--deep);
  font-size:1rem;
  line-height:1.3;
  word-wrap:break-word;
}

.price{
  font-weight:bold;
  margin:10px 0;
  font-size:1.1rem;
}

.whatsapp-btn{
  margin-top:auto;
  background:#25D366;
  color:white;
  text-align:center;
  padding:10px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
}

footer{
  background:var(--deep);
  color:white;
  text-align:center;
  padding:40px;
  margin-top:60px;
}

/* Responsive */
@media(max-width:1100px){
  .grid{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:800px){
  .container{flex-direction:column; gap:25px;}
  .grid{grid-template-columns:1fr;}
}