* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(135deg, #f5eded, #f0ebf7);
    max-width: 1400px;
    margin: 0 auto;
}

/* ডেক্সটপ বা বড় স্ক্রিনের স্টাইল */
.menubar ul li a {
    color: black;
    padding: 5px 10px;
    transition: color 0.3s ease;
    text-decoration: none;
}

.menubar ul li a:hover {
    color: rgb(240, 96, 96);
}

.menubar ul li a.active {
    color: rgb(189, 76, 72) !important;
    font-weight: bold !important;
}

@media screen and (min-width: 350px) and (max-width: 550px) {

    /* নাবারকে এক লাইনেই রাখা হলো */
    .navbar {
        flex-direction: row !important;
        /* জোর করে এক লাইনে রাখা হলো */
        padding: 4px 5px !important;
        /* স্পেস বাঁচানোর জন্য প্যাডিং খুব কম করা হলো */
        justify-content: space-between !important;
    }

    /* লোগো অংশ */
    .navbar .logo {
        margin-left: 5px !important;
        /* বামের মার্জিন কমানো হলো */
        flex: 0 0 auto !important;
    }

    .navbar #logo {
        max-width: 30px !important;
        /* লোগো ছোট করে ৩০ পিক্সেল করা হলো */
    }

    /* কোম্পানির নাম */
    .navbar .name {
        font-size: large !important;
        /* এক লাইনে আটকাতে ফন্ট সাইজ ছোট করা হলো */
        font-weight: 700 !important;
        flex: 1 !important;
        /* মাঝখানের বাকি সব জায়গা নাম নিবে */
        text-align: center !important;
        padding: 0 5px !important;
    }

    /* সার্চ বক্স */
    .navbar .search-box {
        margin-right: 5px !important;
        /* ডানের মার্জিন কমানো হলো */
        gap: 3px !important;
        /* ইনপুট ও বাটনের মাঝের দূরত্ব কমানো হলো */
        flex: 0 0 auto !important;
    }

    /* ইনপুট ফিল্ড ও বাটনকে আরও স্লিম ও ছোট করা হলো */
    .navbar .search-box #search-input {
        width: 80px !important;
        /* ইনপুট বক্সের প্রস্থ কমানো হলো */
        height: 22px !important;
        font-size: 11px !important;
    }

    .navbar .search-box #submit-search {
        width: 40px !important;
        /* বাটনের প্রস্থ কমানো হলো */
        height: 22px !important;
        font-size: 11px !important;
    }

    /* মেনু বার */
    .menubar ul {
        gap: 5px !important;
        /* মেনুর ভেতরের ফাঁকা জায়গা কমানো হলো */
        padding: 5px !important;
    }

    .menubar ul li a {
        margin-left: 0 !important;
        padding: 4px 5px !important;
        font-size: 12px !important;
        /* মেনুর লেখার সাইজ ছোট করা হলো */
    }
}





















.footer-container {
  width: 100%;
  background-color: #2c3e50;
  color: white;
  padding: 30px 20px 20px;
  text-align: center;
  max-width: 1400px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.footer-logo {
  font-size: 1.5em;
  font-weight: bold;
  color: #f39c12;
}

.footer-links {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.footer-links a {
  color: white;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s ease;
}

.footer-links a:hover {
  color: #f39c12;
}

.footer-socials {
  font-size: 1.5em;
  display: flex;
  gap: 15px;
}

.footer-copy {
  font-size: 0.9em;
  color: #ccc;
}

/* Mobile Responsive Footer */
@media screen and (min-width: 350px) and (max-width: 550px)  {

  .footer-links,
  .footer-socials {
    flex-direction: column;
    align-items: center;
  }
}