
:root{
--pink:#ff5fa2;--blue:#1e88e5;--yellow:#ffd54f;--dark:#333;--light:#fff;
}
*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,Arial}
body{line-height:1.6;color:var(--dark)}
header{background:linear-gradient(90deg,var(--pink),var(--blue),var(--yellow))}
nav{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:15px 30px}
nav h1{color:#fff}
nav ul{display:flex;flex-wrap:wrap;gap:15px;list-style:none}
nav a{color:#fff;text-decoration:none;font-weight:600}
.hero{padding:80px 20px;text-align:center;background:#f9fbff}
.hero h2{font-size:36px;color:var(--blue)}
.section{padding:60px 20px}
.section h3{text-align:center;color:var(--pink);margin-bottom:30px;font-size:30px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.card{padding:25px;border-radius:15px;box-shadow:0 6px 18px rgba(0,0,0,.08);text-align:center}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}
.gallery img{width:100%;border-radius:12px}
form{max-width:500px;margin:30px auto}
input,select,button{width:100%;padding:12px;margin:10px 0;border-radius:8px;border:1px solid #ccc}
button{background:var(--pink);color:#fff;font-size:18px;border:none}
footer{background:var(--blue);color:#fff;text-align:center;padding:25px}
@media(max-width:600px){.hero h2{font-size:26px}}


/* ===== IMAGE SLIDER ===== */
.slider{
  position:relative;
  width:100%;
  height:70vh;
  overflow:hidden;
}
.slide{
  position:absolute;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 1s ease-in-out;
}
.slide img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.slide.active{opacity:1}

.slider-content{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
  background:rgba(0,0,0,.45);
  padding:30px;
  border-radius:15px;
  color:#fff;
}
.slider-content h2{font-size:38px}

/* ===== MEGA SECTION ===== */
.mega{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:30px;
  align-items:center;
}
.mega img{
  width:100%;
  border-radius:20px;
  animation:float 4s ease-in-out infinite;
}
@keyframes float{
  0%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
  100%{transform:translateY(0)}
}

/* ===== FLOATING WHATSAPP ===== */
.whatsapp-float{
  position:fixed;
  bottom:20px;
  right:20px;
  background:#25D366;
  color:#fff;
  padding:15px 18px;
  border-radius:50%;
  font-size:28px;
  z-index:999;
  text-decoration:none;
  box-shadow:0 6px 15px rgba(0,0,0,.3);
}
