  * {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
         font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
         }
         body {
         background-color: #f2f4f5;
         overflow-x: hidden;
         }
         .mobile-logo img {
         width: 230px;
         height: auto;
         padding: 15px;
         }
         .desktop-logo img {
         width: 320px;
         height: auto;
         }
         .mobile-header-row-1 {
         position: relative;
         }
         .mobile-logo {
         position: absolute;
         left: 50%;
         transform: translateX(-50%);
         }
         .mobile-header-left {
         width: 100%;
         }
         .mobile-header-right {
         margin-left: auto;
         }
         /* ========== SIDEBAR OVERLAY (Mobile Only) ========== */
         .sidebar-overlay {
         position: fixed;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background: rgba(0, 0, 0, 0.5);
         z-index: 2000;
         opacity: 0;
         visibility: hidden;
         transition: all 0.3s ease;
         }
         .sidebar-overlay.active {
         opacity: 1;
         visibility: visible;
         }
         /* ========== SIDEBAR MENU (Mobile Only) ========== */
         .sidebar-menu {
         position: fixed;
         top: 0;
         left: -300px;
         width: 280px;
         height: 100%;
         background: white;
         z-index: 2001;
         transition: left 0.3s ease;
         overflow-y: auto;
         box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
         }
         .sidebar-menu.active {
         left: 0;
         }
         /* Close Button */
         .sidebar-close-btn {
         position: absolute;
         top: 12px;
         right: 12px;
         background: rgba(255, 255, 255, 0.2);
         border: none;
         color: white;
         width: 32px;
         height: 32px;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
         font-size: 18px;
         transition: background 0.2s;
         z-index: 10;
         }
         .sidebar-close-btn:hover {
         background: rgba(255, 255, 255, 0.3);
         }
         /* Sidebar Header with Profile */
         .sidebar-header {
         background: linear-gradient(135deg, #002f34 0%, #00454e 100%);
         padding: 20px 16px;
         color: white;
         position: relative;
         }
         .sidebar-profile {
         display: flex;
         align-items: center;
         gap: 12px;
         margin-bottom: 12px;
         }
         .sidebar-avatar {
         width: 50px;
         height: 50px;
         background: #ffce32;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 24px;
         color: #002f34;
         font-weight: bold;
         }
         .sidebar-user-info h4 {
         font-size: 16px;
         margin-bottom: 4px;
         }
         .sidebar-user-info p {
         font-size: 12px;
         opacity: 0.9;
         }
         .sidebar-login-btn {
         background: white;
         color: #002f34;
         border: none;
         padding: 8px 16px;
         border-radius: 20px;
         font-weight: 600;
         font-size: 13px;
         cursor: pointer;
         width: fit-content;
         text-decoration: none;
         }
         /* Sidebar Menu Items */
         .sidebar-section {
         padding: 16px 0;
         border-bottom: 1px solid #e0e0e0;
         }
         .sidebar-section-title {
         padding: 0 16px 8px;
         font-size: 12px;
         color: #6c7a7d;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         }
         .sidebar-item {
         display: flex;
         align-items: center;
         padding: 12px 16px;
         color: #002f34;
         cursor: pointer;
         transition: background 0.2s;
         gap: 12px;
         text-decoration: none;
         }
         .sidebar-item:hover {
         background: #f2f4f5;
         }
         .sidebar-item i {
         width: 24px;
         font-size: 18px;
         color: #406367;
         }
         .sidebar-item span {
         font-size: 14px;
         font-weight: 500;
         }
         .sidebar-item .badge {
         margin-left: auto;
         background: #ffce32;
         color: #002f34;
         padding: 2px 8px;
         border-radius: 12px;
         font-size: 11px;
         font-weight: 600;
         }
         .logout-item {
         color: #dc3545;
         }
         .logout-item i {
         color: #dc3545;
         }
         /* ========== DESKTOP HEADER ========== */
         .desktop-header {
         background-color: #f7f8f9;
         box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .1);
         padding: 8px 16px;
         position: sticky;
         top: 0;
         z-index: 1000;
         display: flex;
         align-items: center;
         justify-content: space-between;
         flex-wrap: wrap;
         }
         .desktop-logo-area {
         display: flex;
         align-items: center;
         margin-right: 16px;
         }
         .desktop-logo svg {
         width: 55px;
         height: 40px;
         }
         .desktop-location-picker {
         display: flex;
         align-items: center;
         background: white;
         padding: 8px 12px;
         border-radius: 4px;
         border: 1px solid #002f34;
         margin-left: 12px;
         cursor: pointer;
         white-space: nowrap;
         }
         .desktop-location-picker i {
         color: #002f34;
         margin-right: 6px;
         }
         .desktop-location-picker .arrow {
         margin-left: 8px;
         font-size: 14px;
         color: #002f34;
         }
         .desktop-search-container {
         flex: 1;
         min-width: 300px;
         margin: 0 16px;
         display: flex;
         }
         .desktop-search-wrapper {
         display: flex;
         width: 100%;
         background: white;
         border: 1px solid #002f34;
         border-radius: 4px;
         overflow: hidden;
         }
         .desktop-search-wrapper input {
         flex: 1;
         padding: 12px 16px;
         border: none;
         outline: none;
         font-size: 16px;
         }
         .desktop-search-btn {
         background-color: #002f34;
         border: none;
         padding: 0 20px;
         cursor: pointer;
         transition: 0.2s;
         }
         .desktop-search-btn i {
         color: white;
         font-size: 20px;
         }
         .desktop-search-btn:hover {
         background-color: #00464e;
         }
         .desktop-actions {
         display: flex;
         align-items: center;
         gap: 20px;
         }
         .desktop-lang-selector {
         display: flex;
         align-items: center;
         font-weight: 700;
         color: #002f34;
         cursor: pointer;
         }
         .desktop-lang-selector span {
         margin-right: 4px;
         }
         .desktop-chat-icon {
         display: flex;
         align-items: center;
         color: #002f34;
         font-size: 22px;
         cursor: pointer;
         position: relative;
         text-decoration: none;
         }
         .desktop-user-profile {
         display: flex;
         align-items: center;
         cursor: pointer;
         color: #002f34;
         font-weight: 600;
         border-bottom: 2px solid transparent;
         padding-bottom: 4px;
         text-decoration: none;
         }
         .desktop-user-profile i {
         margin-right: 6px;
         font-size: 20px;
         }
         .desktop-user-profile:hover {
         border-bottom: 2px solid #002f34;
         }
         .desktop-sell-btn {
         display: flex;
         align-items: center;
         background: white;
         border: 3px solid #ffce32;
         border-radius: 30px;
         padding: 5px 14px;
         cursor: pointer;
         box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
         text-decoration: none;
         }
         .desktop-sell-content {
         display: flex;
         align-items: center;
         gap: 6px;
         }
         .desktop-sell-icon {
         background: #ffce32;
         border-radius: 50%;
         width: 24px;
         height: 24px;
         display: flex;
         align-items: center;
         justify-content: center;
         font-weight: bold;
         color: #002f34;
         }
         .desktop-sell-text {
         font-weight: 700;
         color: #002f34;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         }
         /* ========== MOBILE HEADER ========== */
         .mobile-header {
         display: none;
         background-color: #f7f8f9;
         box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .1);
         padding: 10px 12px;
         position: sticky;
         top: 0;
         z-index: 1000;
         }
         .mobile-header-row-1 {
         display: flex;
         align-items: center;
         justify-content: space-between;
         margin-bottom: 20px;
         margin-top: 10px;
         }
         .mobile-header-left {
         display: flex;
         align-items: center;
         gap: 12px;
         }
         .mobile-menu-icon {
         font-size: 22px;
         color: #002f34;
         cursor: pointer;
         width: 24px;
         }
         .mobile-logo svg {
         width: 45px;
         height: 35px;
         }
         .mobile-header-right {
         display: flex;
         align-items: center;
         gap: 16px;
         }
         .mobile-location-selector {
         display: flex;
         align-items: center;
         gap: 4px;
         color: #002f34;
         cursor: pointer;
         font-size: 13px;
         font-weight: 500;
         }
         .mobile-location-selector i {
         font-size: 16px;
         }
         .mobile-header-row-2 {
         width: 100%;
         }
         .mobile-search-container {
         display: flex;
         width: 100%;
         }
         .mobile-search-wrapper {
         display: flex;
         width: 100%;
         background: white;
         border: 0px solid #002f34;
         border-radius: 4px;
         overflow: hidden;
         }
         .mobile-search-wrapper input {
         flex: 1;
         padding: 7px 14px;
         border: none;
         outline: none;
         font-size: 14px;
         }
         .mobile-search-wrapper input::placeholder {
         color: #8a9a9c;
         }
         .mobile-search-btn {
         background-color: #002f34;
         border: none;
         padding: 0 18px;
         cursor: pointer;
         }
         .mobile-search-btn i {
         color: white;
         font-size: 16px;
         }
         /* ========== CATEGORY BAR ========== */
         .category-bar {
         background-color: white;
         padding: 10px 16px;
         box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
         display: flex;
         gap: 24px;
         overflow-x: auto;
         white-space: nowrap;
         scrollbar-width: none;
         }
         .category-bar::-webkit-scrollbar {
         display: none;
         }
         .category-item {
         color: #002f34;
         font-weight: 500;
         font-size: 14px;
         text-transform: uppercase;
         cursor: pointer;
         padding-bottom: 4px;
         border-bottom: 2px solid transparent;
         text-decoration: none;
         }
         .category-item i {
         margin-right: 6px;
         }
         .category-item:hover {
         border-bottom: 2px solid #002f34;
         }
         .category-item.active {
         border-bottom: 2px solid #002f34;
         }
         /* ========== CONTENT AREA ========== */
         .content {
         padding: 20px 16px;
         min-height: 100vh;
         }
         .section-title {
         font-size: 20px;
         font-weight: 600;
         color: #002f34;
         margin-bottom: 16px;
         }
         .product-grid {
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         gap: 16px;
         }
         .product-card {
         background: white;
         border-radius: 8px;
         overflow: hidden;
         box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
         cursor: pointer;
         transition: transform 0.2s;
         }
         .product-card:hover {
         transform: translateY(-2px);
         box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
         }
         .product-img {
         height: 180px;
         background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
         position: relative;
         }
         .product-info {
         padding: 12px;
         }
         .product-price {
         font-weight: 700;
         color: #002f34;
         font-size: 18px;
         margin-bottom: 6px;
         }
         .product-title {
         font-size: 14px;
         color: #406367;
         margin-bottom: 6px;
         line-height: 1.4;
         }
         .product-location {
         font-size: 12px;
         color: #8a9a9c;
         display: flex;
         align-items: center;
         gap: 4px;
         }
         /* ========== RESPONSIVE BREAKPOINTS ========== */
         @media (max-width: 768px) {
         .desktop-header {
         display: none;
         }
         .mobile-header {
         display: block;
         }
         .category-bar {
         padding: 10px 12px;
         gap: 16px;
         }
         .category-item {
         font-size: 12px;
         }
         .product-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 10px;
         }
         .product-img {
         height: 130px;
         }
         .product-price {
         font-size: 16px;
         }
         .product-title {
         font-size: 13px;
         }
         .content {
         padding-bottom: 20px;
         }
         .section-title {
         font-size: 16px;
         }
         }
         @media (min-width: 769px) {
         .sidebar-overlay,
         .sidebar-menu,
         .mobile-sell-fab {
         display: none !important;
         }
         }
         @media (min-width: 769px) and (max-width: 1024px) {
         .product-grid {
         grid-template-columns: repeat(3, 1fr);
         }
         .desktop-actions {
         gap: 12px;
         }
         .desktop-lang-selector span {
         display: none;
         }
         }
         @media (min-width: 1200px) {
         .desktop-header {
         padding: 8px 32px;
         }
         .category-bar {
         padding: 10px 32px;
         }
         .desktop-search-container {
         max-width: 600px;
         margin: 0 auto;
         }
         }
         .desktop-logo a {
         display: inline-block;
         text-decoration: none;
         }
         
           .desktop-search-container {
      width: 100%;
      }
      .desktop-search-wrapper {
      display: flex;
      align-items: center;
      border: 2px solid #002f34;
      border-radius: 6px;
      overflow: hidden;
      background: #fff;
      max-width: 1000px;
      margin: 0 auto;
      }
      .desktop-search-input {
      flex: 1;
      position: relative;
      }
      .desktop-search-input input {
      width: 100%;
      border: none;
      outline: none;
      padding: 12px;
      font-size: 14px;
      box-sizing: border-box;
      }
      .category-box {
      border-left: 1px solid #ddd;
      }
      .desktop-search-btn {
      background: #002f34;
      color: #fff;
      border: none;
      padding: 12px 18px;
      cursor: pointer;
      }
      .desktop-search-btn:hover {
      background: #00a3ad;
      }
      .autocomplete-list {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      background: #fff;
      border: 1px solid #ddd;
      z-index: 1000;
      max-height: 200px;
      overflow-y: auto;
      display: none;
      }
      .autocomplete-item {
      padding: 8px 12px;
      cursor: pointer;
      font-size: 14px;
      }
      .autocomplete-item:hover {
      background: #f0f0f0;
      }
      .input-icon {
      position: relative;
      }
      .input-icon .icon {
      position: absolute;
      left: 12px;
      top: 50%;
      transform: translateY(-50%);
      color: #002f34;
      font-size: 14px;
      pointer-events: none;
      }
      .input-icon input {
      padding-left: 34px !important;
      }
         
        .footer {
   background: #002f34;
   color: #ffffff;
   padding: 60px 16px 0;
   margin-top: 0px;
   position: relative;
   }
   .footer::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 3px;
   background: linear-gradient(90deg, #ffce32, #00a3ad, #23e5db, #ffce32);
   }
   .footer-container {
   max-width: 1200px;
   margin: 0 auto;
   display: grid;
   grid-template-columns: 1.5fr 1fr 1fr 1.5fr;
   gap: 40px;
   padding-bottom: 40px;
   }
   /* Brand Section */
   .footer-brand {
   display: flex;
   flex-direction: column;
   }
   .footer-logo {
   margin-bottom: 16px;
   }
   .footer-logo img {
   width: 280px;
   height: auto;
   filter: brightness(0) invert(1);
   }
   .footer-logo svg {
   width: 70px;
   height: 50px;
   }
   .footer-description {
   font-size: 14px;
   color: rgba(255, 255, 255, 0.7);
   line-height: 1.8;
   margin-bottom: 20px;
   }
   .footer-app-buttons {
   display: flex;
   gap: 12px;
   margin-bottom: 20px;
   flex-wrap: wrap;
   }
   .app-btn {
   display: flex;
   align-items: center;
   gap: 8px;
   background: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.2);
   padding: 8px 16px;
   border-radius: 8px;
   cursor: pointer;
   transition: all 0.3s;
   text-decoration: none;
   color: white;
   }
   .app-btn:hover {
   background: rgba(255, 255, 255, 0.2);
   border-color: rgba(255, 255, 255, 0.4);
   transform: translateY(-2px);
   }
   .app-btn i {
   font-size: 24px;
   }
   .app-btn .btn-text {
   font-size: 11px;
   opacity: 0.8;
   }
   .app-btn .btn-title {
   font-size: 15px;
   font-weight: 600;
   }
   /* Footer Sections */
   .footer-section h4 {
   font-size: 16px;
   font-weight: 700;
   color: #ffce32;
   margin-bottom: 20px;
   text-transform: uppercase;
   letter-spacing: 1px;
   position: relative;
   padding-bottom: 12px;
   }
   .footer-section h4::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   width: 30px;
   height: 2px;
   background: #ffce32;
   border-radius: 2px;
   }
   .footer-section ul {
   list-style: none;
   }
   .footer-section ul li {
   margin-bottom: 12px;
   }
   .footer-section ul li a {
   color: rgba(255, 255, 255, 0.7);
   text-decoration: none;
   font-size: 14px;
   transition: all 0.3s;
   display: flex;
   align-items: center;
   gap: 8px;
   }
   .footer-section ul li a i {
   font-size: 8px;
   color: #ffce32;
   transition: transform 0.3s;
   }
   .footer-section ul li a:hover {
   color: #ffce32;
   padding-left: 5px;
   }
   .footer-section ul li a:hover i {
   transform: translateX(4px);
   }
   /* Contact Info */
   .footer-contact-item {
   display: flex;
   align-items: flex-start;
   gap: 12px;
   margin-bottom: 16px;
   }
   .footer-contact-item i {
   width: 36px;
   height: 36px;
   background: rgba(255, 255, 255, 0.1);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   color: #ffce32;
   flex-shrink: 0;
   }
   .footer-contact-item .contact-text {
   font-size: 14px;
   color: rgba(255, 255, 255, 0.7);
   line-height: 1.6;
   }
   .footer-contact-item .contact-text strong {
   color: white;
   display: block;
   margin-bottom: 2px;
   }
   /* Social Links */
   .footer-social {
   display: flex;
   gap: 12px;
   margin-top: 20px;
   }
   .footer-social a {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   color: white;
   text-decoration: none;
   transition: all 0.3s;
   position: relative;
   overflow: hidden;
   }
   .footer-social a::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(255, 255, 255, 0.1);
   border-radius: 50%;
   transition: all 0.3s;
   }
   .footer-social a:hover::before {
   transform: scale(1.2);
   }
   .footer-social a:hover {
   transform: translateY(-4px);
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
   }
   .footer-social a.facebook:hover {
   background: #1877f2;
   }
   .footer-social a.twitter:hover {
   background: #1da1f2;
   }
   .footer-social a.instagram:hover {
   background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
   }
   .footer-social a.youtube:hover {
   background: #ff0000;
   }
   /* Footer Bottom */
   .footer-bottom {
   border-top: 1px solid rgba(255, 255, 255, 0.1);
   padding: 20px 0;
   }
   .footer-bottom-container {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 16px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: 16px;
   }
   .copyright {
   font-size: 13px;
   color: rgba(255, 255, 255, 0.6);
   }
   .footer-bottom-links {
   display: flex;
   gap: 20px;
   flex-wrap: wrap;
   }
   .footer-bottom-links a {
   font-size: 13px;
   color: rgba(255, 255, 255, 0.6);
   text-decoration: none;
   transition: color 0.3s;
   }
   .footer-bottom-links a:hover {
   color: #ffce32;
   }
   /* Newsletter Section */
   .newsletter-section {
   background: rgba(255, 255, 255, 0.05);
   border-radius: 12px;
   padding: 15px;
   margin-bottom: 20px;
   text-align: center;
   border: 1px solid rgba(255, 255, 255, 0.1);
   }
   .newsletter-section h4 {
   color: #ffce32;
   font-size: 18px;
   margin-bottom: 8px;
   text-transform: none;
   letter-spacing: 0;
   }
   .newsletter-section h4::after {
   display: none;
   }
   .newsletter-section p {
   color: rgba(255, 255, 255, 0.7);
   font-size: 14px;
   margin-bottom: 20px;
   }
   .newsletter-form {
   display: flex;
   gap: 12px;
   max-width: 500px;
   margin: 0 auto;
   }
   .newsletter-input {
   flex: 1;
   padding: 14px 20px;
   border: 1px solid rgba(255, 255, 255, 0.2);
   border-radius: 30px;
   background: rgba(255, 255, 255, 0.1);
   color: white;
   font-size: 14px;
   outline: none;
   transition: all 0.3s;
   }
   .newsletter-input::placeholder {
   color: rgba(255, 255, 255, 0.5);
   }
   .newsletter-input:focus {
   border-color: #ffce32;
   background: rgba(255, 255, 255, 0.15);
   }
   .newsletter-btn {
   background: #ffce32;
   color: #002f34;
   border: none;
   padding: 14px 28px;
   border-radius: 30px;
   font-size: 14px;
   font-weight: 700;
   cursor: pointer;
   transition: all 0.3s;
   white-space: nowrap;
   display: flex;
   align-items: center;
   gap: 8px;
   }
   .newsletter-btn:hover {
   background: #ffc107;
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(255, 206, 50, 0.3);
   }
   /* Back to Top */
   .back-to-top {
   position: fixed;
   bottom: 100px;
   right: 20px;
   width: 44px;
   height: 44px;
   background: #002f34;
   color: white;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   z-index: 998;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
   border: 2px solid #ffce32;
   transition: all 0.3s;
   opacity: 0;
   visibility: hidden;
   }
   .back-to-top.show {
   opacity: 1;
   visibility: visible;
   }
   .back-to-top:hover {
   background: #ffce32;
   color: #002f34;
   transform: translateY(-4px);
   }
   /* Bottom Navigation (Mobile Only) */
   .mobile-bottom-nav {
   display: none;
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   background: white;
   box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
   padding: 8px 16px;
   z-index: 999;
   justify-content: space-around;
   align-items: center;
   border-top: 1px solid #e0e0e0;
   }
   .mobile-nav-item {
   display: flex;
   flex-direction: column;
   align-items: center;
   color: #6c7a7d;
   font-size: 11px;
   cursor: pointer;
   transition: all 0.2s;
   text-decoration: none;
   position: relative;
   }
   .mobile-nav-item i {
   font-size: 20px;
   margin-bottom: 3px;
   transition: all 0.3s;
   }
   .mobile-nav-item span {
   font-size: 10px;
   font-weight: 500;
   }
   .mobile-nav-item.active {
   color: #002f34;
   }
   .mobile-nav-item.active::before {
   content: '';
   position: absolute;
   top: -2px;
   width: 24px;
   height: 2px;
   background: #002f34;
   border-radius: 2px;
   }
   .mobile-nav-item:hover {
   color: #002f34;
   }
   .sell-fab {
   position: relative;
   top: -3px;
   background: linear-gradient(135deg, #002f34, #00454e);
   width: 55px;
   height: 55px;
   border-radius: 50%;
   color: white !important;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   font-weight: bold;
   box-shadow: 0 6px 16px rgba(0, 47, 52, 0.4);
   border: 3px solid #ffce32;
   }
   .sell-fab i {
   font-size: 18px;
   color: #ffce32 !important;
   }
   .sell-fab span {
   font-size: 9px !important;
   color: white !important;
   }
   .sell-fab.active::before {
   background: #ffce32;
   }
   /* Responsive */
   @media (max-width: 1024px) {
   .footer-container {
   grid-template-columns: repeat(2, 1fr);
   gap: 30px;
   }
   }
   @media (max-width: 768px) {
   .footer {
   padding: 40px 16px 0;
   }
   .footer-container {
   grid-template-columns: repeat(2, 1fr);
   gap: 30px 20px;
   padding-bottom: 30px;
   }
   .footer-bottom-container {
   flex-direction: column;
   text-align: center;
   }
   .footer-bottom-links {
   justify-content: center;
   }
   .newsletter-form {
   flex-direction: column;
   }
   .newsletter-btn {
   justify-content: center;
   }
   .mobile-bottom-nav {
   display: flex;
   }
   .footer {
   padding-bottom: 80px;
   }
   .back-to-top {
   bottom: 90px;
   }
   }
   @media (max-width: 480px) {
   .footer-container {
   grid-template-columns: 1fr;
   gap: 24px;
   }
   .footer-section h4 {
   font-size: 15px;
   }
   .app-buttons {
   justify-content: center;
   }
   }
   .mobile-nav-item.active::before {
   display: none;
   }    