/* ===== RESET ===== */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:#f8fafc;
color:#1e293b;
line-height:1.6;
}

/* ===== LINK ===== */
a{
color:#15803d;
text-decoration:none;
transition:0.3s;
}

a:hover{
color:#eab308;
}

/* ===== HEADER ===== */
.header{
text-align:center;
padding:12px;
background:#ffffff;
border-bottom:1px solid #eee;
}

.logo{
height:60px;
}

/* ===== MENU (GREEN + GOLD) ===== */
.menu{
display:flex;
justify-content:center;
gap:30px;
padding:16px;
background:linear-gradient(90deg,#22c55e,#15803d);
position:sticky;
top:0;
z-index:999;
box-shadow:0 4px 12px rgba(0,0,0,0.1);
}

.menu a{
color:#ffffff;
font-weight:600;
font-size:15px;
position:relative;
}

/* hover underline */
.menu a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:#eab308;
transition:0.3s;
}

.menu a:hover{
color:#fff7cc;
}

.menu a:hover::after{
width:100%;
}

/* ===== HERO ===== */
.hero{
height:60vh;
min-height:280px;
max-height:500px;
position:relative;
overflow:hidden;
}

.hero-slides img{
position:absolute;
width:100%;
height:100%;
object-fit:cover;
opacity:0;
transition:1s;
}

.hero-slides img.active{
opacity:1;
}

.hero-content{
position:absolute;
bottom:25px;
left:50%;
transform:translateX(-50%);
background:rgba(0,0,0,0.4);
padding:20px;
border-radius:12px;
color:#fff;
text-align:center;
max-width:90%;
}

/* ===== BUTTON ===== */
.hero-buttons{
margin-top:10px;
display:flex;
gap:10px;
justify-content:center;
flex-wrap:wrap;
}

.btn-main{
background:#eab308;
color:#000;
padding:10px 18px;
border-radius:6px;
font-weight:700;
}

.btn-main:hover{
background:#ca8a04;
color:#fff;
}

.btn-sub{
background:#ffffff;
color:#15803d;
padding:10px 18px;
border-radius:6px;
font-weight:600;
}

.btn-sub:hover{
background:#22c55e;
color:#fff;
}

/* ===== TRUST ===== */
.trust{
text-align:center;
padding:15px;
background:#ecfdf5;
color:#065f46;
font-weight:500;
}

/* ===== SECTION ===== */
.section{
padding:45px 15px;
text-align:center;
}

.section h2{
margin-bottom:25px;
font-size:24px;
color:#15803d;
}

/* ===== GRID ===== */
.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
}

/* ===== CARD ===== */
.card{
background:#fff;
border-radius:12px;
overflow:hidden;
transition:0.3s;
border:1px solid #e5e7eb;
}

.card:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.1);
}

.card img{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
transition:0.4s;
}

.card:hover img{
transform:scale(1.08);
}

.card h3{
margin:12px 0;
}

.card p{
color:#eab308;
font-weight:700;
}

/* ===== GALLERY ===== */
.bg{
background:#f0fdf4;
}

.gallery{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
gap:12px;
}

.gallery img{
width:100%;
aspect-ratio:1/1;
object-fit:cover;
border-radius:8px;
transition:0.3s;
}

.gallery img:hover{
transform:scale(1.05);
}

/* ===== FOOTER ===== */
footer{
background:linear-gradient(135deg,#15803d,#22c55e);
color:#ecfdf5;
text-align:center;
padding:35px 15px;
margin-top:40px;
}

footer p{
margin:6px 0;
}

/* footer link */
footer a{
color:#fde047;
font-weight:600;
}

footer a:hover{
color:#ffffff;
}

/* ===== WHATSAPP ===== */
.wa{
position:fixed;
right:18px;
bottom:18px;
width:55px;
height:55px;
background:#25D366;
border-radius:50%;
box-shadow:0 6px 15px rgba(0,0,0,0.3);
z-index:999;
}

.wa::before{
content:"";
display:block;
width:28px;
height:28px;
margin:13px;
background:url("https://cdn-icons-png.flaticon.com/512/733/733585.png") no-repeat center;
background-size:cover;
}

/* ===== IMAGE GLOBAL ===== */
img{
max-width:100%;
display:block;
}

/* ===== MOBILE ===== */
@media(max-width:768px){

.hero{
height:45vh;
}

.menu{
gap:15px;
flex-wrap:wrap;
}

.card img{
aspect-ratio:1/1;
}

}