body { margin:0; font-family:'Roboto',sans-serif; background:#f4f4f4; line-height:1.6;}
a {text-decoration:none;}

/* ===== Navbar ===== */
.navbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#0d6efd;
  padding:10px 20px;
  position:sticky;
  top:0;
  z-index:1000;
}
.navbar .logo { color:#fff; font-size:20px; font-weight:bold; }
.navbar ul { list-style:none; display:flex; margin:0; padding:0; }
.navbar ul li { margin:0 15px; }
.navbar ul li a { color:#fff; font-size:16px; transition:color 0.3s; }
.navbar ul li a:hover { color:#ffc107; }

/* Mobile Menu */
.menu-toggle { display:none; flex-direction:column; cursor:pointer; }
.menu-toggle span { background:#fff; height:3px; width:25px; margin:4px 0; border-radius:2px; }
@media (max-width:768px){
  .menu-toggle { display:flex; }
  .navbar ul { display:none; flex-direction:column; width:100%; background:#0d6efd; position:absolute; top:55px; left:0; padding:10px 0; z-index:1001; }
  .navbar ul li { margin:10px 0; text-align:center; }
  .navbar.show-menu ul { display:flex; }
}

/* ===== Header ===== */
header { text-align:center; padding:30px 20px; background:#f8f9fa; }
header h1 { margin:0; font-size:32px; color:#128c7e; }
header p { margin:10px 0 0; font-size:18px; color:#555; }

/* ===== Slider ===== */
.slider { background: linear-gradient(90deg,#198754,#25d366); color:#fff; padding:10px 0; overflow:hidden; position:relative; }
.slider .slide-track { display:flex; width:max-content; animation:scroll 40s linear infinite; }
.slider .slide { flex:0 0 auto; padding:0 15px; font-weight:bold; white-space:nowrap; font-size:16px; line-height:1.4; text-align:center; }
@keyframes scroll { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
@media (max-width:768px){
  .slider .slide-track { animation:scroll 60s linear infinite; }
  .slider .slide { font-size:14px; padding:0 10px; }
}
@media (max-width:480px){
  .slider .slide { font-size:12px; padding:0 8px; }
}

/* ===== Packages ===== */
.packages-wrapper { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; padding:40px 20px; }
.card { background:#fff; border-radius:16px; box-shadow:0 8px 20px rgba(0,0,0,0.15); padding:30px 25px; width:300px; border-top:5px solid #25d366; text-align:center; transition:transform 0.3s, box-shadow 0.3s; }
.card:hover { transform:translateY(-10px); box-shadow:0 15px 25px rgba(0,0,0,0.25); }
.card h2 { font-size:24px; color:#128c7e; margin-bottom:15px; }
.price { font-size:22px; font-weight:bold; color:#25d366; margin-bottom:20px; }
.features { list-style:none; padding:0; line-height:1.6; color:#444; margin-bottom:20px; text-align:left; }
.features li::before { content:'✅ '; color:#25d366; }
.order-btn { display:inline-block; background:linear-gradient(135deg,#25d366,#128c7e); color:white; padding:12px 25px; font-weight:bold; border-radius:10px; transition:0.3s; }
.order-btn:hover { background:linear-gradient(135deg,#128c7e,#25d366); }

/* ===== Footer ===== */
footer { background:#222; color:white; text-align:center; padding:20px; font-size:0.9em; }
.powered { margin-top:10px; color:#25d366; }

/* ===== Responsive ===== */
@media (max-width:1024px) { .packages-wrapper { flex-direction:column; align-items:center; } }
@media (max-width:480px) { header h1{font-size:24px;} header p{font-size:16px;} }

/* ===== Image Row (Right Aligned + Responsive) ===== */
.image-row-wrapper {
  display: flex;
  justify-content: flex-end; /* ডানপাশে align */
  align-items: center;       /* vertical center */
  height: 100vh;
  margin: 0;
}
.image-row {
  display: flex;
  gap: 5px;       /* spacing between images */
  flex-wrap: wrap;
  place-content: center;
}
.image-row img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 8px;
}
/* Mobile view → center */
@media (max-width:600px) {
  .image-row-wrapper {
    justify-content: center;
  }
}