// // Import Bootstrap
// @import "../node_modules/bootstrap/scss/bootstrap";
// @import "../node_modules/bootstrap-icons/font/bootstrap-icons.css";


// body {
//   font-family: "Ubuntu", serif;
//   font-style: normal;
// }
// html, body {
//   margin: 0;
//   padding: 0;
//   overflow-x: hidden;
// }
// .custom-navbar {
//   width: auto;
//   height: 80px;
//   box-sizing: border-box;
//   border-radius: 16px;
//   border-bottom: 0.5px;
//   background: #1B171FCC;
//   backdrop-filter: blur(10px)
// }
// .custom-navbar .nav-link {
//   color: #fff !important;   
// }
// .menubar {
//   gap: 20px;
// }
// #navbarNav {
//   padding-left: 60px;
//   font-size: 16px;
//   line-height: 18.38px;
// }
// #products {
//   width: 920px;
//   height: 500px;
//   border-radius: 16px;
//   img {
//     padding-right: 20px;
//   }
//   .dropdown-item {
//     font-size: 16px;
//     line-height: 18.38px;
//     color: #1d192b;
//     &:hover {
//       color: #ff2d55;
//     }
//        &.active,
//     &:focus,
//     &:active {
//       background-color: #f5f5f5;
//     }
//   }
//   .menu-text {
//     font-size: 14px;
//     line-height: 24px;
//     color: #625b71;
//     padding-left: 55px;
//     &:hover {
//       color: #ff2d55;
//     }
//     &.active,
//     &:focus,
//     &:active {
//       background-color: #f5f5f5;
//     }
//   }
// }
// #contr {
//   width: 400px;
//   height: 362px;
//   border-radius: 16px;
//   padding-left: 30px;
//   padding-top: 20px;
// img {
//     padding-right: 20px;
//   }
//   .dropdown-contr {
//     font-size: 16px;
//     line-height: 18.38px;
//     color: #1d192b;
//     &:hover {
//       color: #ff2d55;
//     }
//        &.active,
//     &:focus,
//     &:active {
//       background-color: #f5f5f5;
//     }
//   }
//   .menu-text {
//     font-size: 14px;
//     line-height: 24px;
//     color: #625b71;
//     padding-left: 55px;
//     &:hover {
//       color: #ff2d55;
//     }
//     &.active,
//     &:focus,
//     &:active {
//       background-color: #f5f5f5;
//     }
//   }
// }
// .footer-container {
//   display: grid;
//   grid-template-columns: repeat(6, 1fr);
//   justify-content: space-around;
//   background-color: #1d1b20;
//   width: 100%;
// }
// .footer-logo {
//   width: 50px;
//   height: 50px;
// }
// .desktop-icon {
//   display: block;
// }


// .mobile-icon {
//   display: none;
// }
// .footer-logo-text {
//   display: flex;
//   font-family: "Monda", sans-serif;
//   font-size: 24px;
//   line-height: 39.09px;
//   margin-top: -45px;
// }
// .footer-links li a {
//   font-size: 16px;
//   line-height: 24px;
//   color: #cac4d0;
//   text-decoration: none;
// }
// .footer-links li a:hover {
//   color: #ff516e;
// }


// .footer-section h3 {
//   color: #cec8d4;
//   font-family: "Inter", sans-serif;
//   font-size: 16px;
//   line-height: 19.36px;
// }


// .footer-links span {
//   font-size: 16px;
//   line-height: 18.38px;
//   color: #65558f;
// }
// .footer-divider {
//   width: 100%;
//   height: 2px;
//   background-color: #ccc;
// }
// .footer-bottom {
//   padding: 50px;
//   display: flex;
//   justify-content: space-around;
//   background-color: #1d1b20;
// }
// .footer-bottom p {
//   font-family: "Inter", sans-serif;
//   font-size: 16px;
//   line-height: 19.36px;
// }
// .custom-heart {
//   font-size: 20px;
//   color: #ff2d55;
// }
// .footer-bottom .social-icons {
//   display: flex;
//   justify-content: space-around;
// }
// .social-icons img {
//   width: 24px;
//   height: 24px;
// }
// @media (max-width: 768px) {
//   .custom-navbar {
//     height: 70px;
//     padding: 10px 20px 10px 10px !important;
//     margin: 10px !important;
//     border-radius: 16px;
//     background: #1b171fcc;
//   }
//   .menubar {
//     gap: 20px;
//   }
//   #navbarNav {
//     background-color: #ffffff;
//     height: 600px;
//     font-size: 16px;
//     line-height: 18.38px;
//     text-underline-position: from-font;
//     text-decoration-skip-ink: none;
//     border-radius: 28px;
//     overflow-y: auto;
//               margin-top: 5%;

//   }
//   .nav-item a:active,
//   .nav-item a:focus,
//   .nav-item a:visited,
//   .nav-item a:hover,
//   .nav-item a.show,
//   .nav-item .dropdown-toggle[aria-expanded="true"] {
//     color: #000000 !important;
//   }
//     #products.dropdown-menu,
//   #contr.dropdown-menu {
//     width: 100% !important;
//     height: auto !important;
//     border-radius: 0;
//     background: #fff;
//     position: static;   
//     display: none;      
//   }

//   #products.dropdown-menu.show,
//   #contr.dropdown-menu.show {
//     display: block;    
//   }
//   #products {
//     // width: auto;
//     // height: auto;
//     // border-radius: 0px;
//     // background: none;
//     img {
//       padding-right: 20px;
//     }
//  .dropdown-item {
//     font-size: 14px;
//     line-height: 18.38px;
//     color: #1d192b;
//     &:hover {
//       color: #ff2d55;
//     }
//   }
//     .menu-text {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .menu-text:hover {
//       color: #ff2d55;
//     }
//   }
//   #contr {
// //     width: auto;
// //     height: auto;
// margin: 0 auto;              
//   display: flex;
//   flex-direction: column;
//   align-items: center; 
//     img {
//       padding-right: 20px;
//     }
//     .dropdown-contr {
//       font-size: 14px;
//       line-height: 18.38px;
//       color: #1d192b;
//     }
//     .menu-text {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .dropdown-contr:hover {
//       color: #ff2d55;
//     }
//     .menu-text1:hover {
//       color: #ff2d55;
//     }
//   }
//   .footer-container {
//     display: grid;
//     grid-template-columns: repeat(2, 1fr);
//     justify-content: space-around;
//     padding-top: 50px;
//     background-color: #1d1b20;
//     padding-bottom: 50px;
//   }
//   .footer-section:nth-child(1) {
//     grid-column: span 2;
//   }
//   .footer-section:nth-child(n + 2) {
//     grid-column: span 1;
//   }
//   .footer-container {
//     grid-template-columns: repeat(2, 1fr);
//   }
//   .footer-logo {
//     width: 32px;
//     height: 32px;
//   }
//   .desktop-icon {
//     display: none;
//   }


//   .mobile-icon {
//     display: block;
//   }
//   .footer-logo-text {
//     font-family: "Monda", sans-serif;
//     font-size: 14px;
//     line-height: 39.09px;
//     margin-top: -35px;
//   }
//   .footer-links li a {
//     font-size: 16px;
//     line-height: 24px;
//     color: #cac4d0;
//     text-decoration: none;
//   }
//   .footer-links li a {
//     grid-column: span 1;
//   }
//   .footer-links li a:hover {
//     color: #ff516e;
//   }
//   #terms {
//     margin-left: -30px;
//   }
//   .footer-section h3 {
//     padding-top: 20px;
//     color: #cec8d4;
//     font-family: "Inter", sans-serif;
//     font-size: 16px;
//     line-height: 19.36px;
//   }
//   .footer-section .developers {
//     padding-top: 70px;
//   }
//   .footer-links span {
//     font-size: 16px;
//     line-height: 18.38px;
//     color: #65558f;
//   }
//   .footer-divider {
//     width: 100%;
//     height: 2px;
//     background-color: #ccc;
//   }
//   .footer-bottom {
//     padding: 50px;
//     flex-direction: column;
//     justify-content: space-around;
//     background-color: #1d1b20;
//     white-space: nowrap;
//   }
//   .footer-bottom p {
//     font-family: "Inter", sans-serif;
//     font-size: 15px;
//     line-height: 19.36px;
//     margin-left: -30px;
//   }
//   .footer-bottom .p2 {
//     color: #65558f;
//   }
//   .social-icons {
//     display: flex;
//     justify-content: space-around;
//   }
//   .social-icons img {
//     width: 20px;
//     height: 20px;
//   }
  
// }
// @media (min-width: 768px) and (max-width: 1024px) {
//   .nav-item a {
//     font-size: 14px;
//   }
//   .navbar-brand{
//     font-size: 16px;
//   }
//   .custom-navbar {
// background: #1B171FCC !important;
//     height: 80px;
//     box-shadow: none !important; 
//     backdrop-filter: blur(10px);
//   }
//   .custom-navbar .nav-link {
//   color: #fff !important;   
// }
//   .custom-navbar .navbar-collapse {
//     background: transparent !important;   
//   }

//   .custom-navbar .dropdown-item {
//     color: hsl(0, 0%, 98%) !important;
//   }
//     .custom-navbar .nav-link,
//   .custom-navbar .dropdown-item {
//     color: #ffffff !important;   
//   }
//      #navbarNav {
//     background-color: #ffffff !important;
//         height: 450px;
//     font-size: 18px;
//     line-height: 18.38px;
//     text-underline-position: from-font;
//     text-decoration-skip-ink: none;
//     border-radius: 28px;
//     overflow-y: auto;
//         padding-left: 30px;
//         width: 100%;
//           margin-top: 5%;
//   }
//   .nav-item a:active,
//   .nav-item a:focus,
//   .nav-item a:visited,
//   .nav-item a:hover,
//   .nav-item a.show,
//   .nav-item .dropdown-toggle[aria-expanded="true"] {
//     color: #000000 !important;
//   }
//   #products {
//   //   width: 700px;
//   //   height: 600px;
//   //   border-radius: 16px;
//   //   background:none;
//   //   display: flex;
//   // flex-direction: column;
//   // align-items: center;              
//   // justify-content: center;          
//   // margin: 0 auto;    
//     img {
//       padding-right: 20px;
//     }
//   .dropdown-item {
//     font-size: 14px;
//     line-height: 18.38px;
//     color: #1d192b;
//     &:hover {
//       color: #ff2d55;
//     }
//   }
//     .menu-text {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .menu-text:hover {
//       color: #ff2d55;
//     }
//   }
// #contr {
//     // width: 100%;
//     // height: 100%;
//     margin-left: 35%;
//       // padding-bottom: 20px;


//     img {
//       padding-right: 20px;
//     }
//     .dropdown-contr {
//       font-size: 14px;
//       line-height: 18.38px;
//       color: #1d192b;
//     }
//     .menu-text1 {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .dropdown-contr:hover {
//       color: #ff2d55;
//     }
//     .menu-text1:hover {
//       color: #ff2d55;
//     }
//   }
//   #products.dropdown-menu,
//   #contr.dropdown-menu {
//     width: 100% !important;
//     height: auto !important;
//     border-radius: 0;
//     background: #fff;
//     position: static;  
//     display: none;      
//   }

//   #products.dropdown-menu.show,
//   #contr.dropdown-menu.show {
//     display: block;     
//   }
//   .footer-container {
//     display: grid;
//     grid-template-columns: repeat(3, 1fr);
//     justify-content: space-around;
//     background-color: #1d1b20;
//     width: 100%;
//   }
//   .footer-logo {
//     width: 50px;
//     height: 50px;
//   }
//   .desktop-icon {
//     display: block;
//   }
  
//   .mobile-icon {
//     display: none;
//   }
//   .footer-logo-text {
//     display: flex;
//     font-family: "Monda", sans-serif;
//     font-size: 24px;
//     line-height: 39.09px;
//     margin-top: -45px;
//   }
//   .footer-links li a {
//     font-size: 16px;
//     line-height: 24px;
//     color: #cac4d0;
//     text-decoration: none;
//   }
//   .footer-links li a:hover {
//     color: #ff516e;
//   }
  
//   .footer-section h3 {
//     color: #cec8d4;
//     font-family: "Inter", sans-serif;
//     font-size: 16px;
//     line-height: 19.36px;
//   }
  
//   .footer-links span {
//     font-size: 16px;
//     line-height: 18.38px;
//     color: #65558f;
//   }
//   .footer-divider {
//     width: 100%;
//     height: 2px;
//     background-color: #ccc;
//   }
//   .footer-bottom {
//     padding: 50px;
//     display: flex;
//     justify-content: space-around;
//     background-color: #1d1b20;
//   }
//   .footer-bottom p {
//     font-family: "Inter", sans-serif;
//     font-size: 16px;
//     line-height: 19.36px;
//   }
//   .custom-heart {
//     font-size: 20px;
//     color: #ff2d55;
//   }
//   .footer-bottom .social-icons {
//     display: flex;
//     justify-content: space-around;
//   }
//   .social-icons img {
//     width: 24px;
//     height: 24px;
//   }
// }
// @media (min-width: 1025px) and (max-width:1199px){
// .nav-item a {
//     font-size: 14px;
//   }
//   .navbar-brand{
//     font-size: 16px;
//   }
//   .custom-navbar {
// background: #1B171FCC !important;
//     height: 80px;
//     box-shadow: none !important; 
//     backdrop-filter: blur(10px);
//   }
//   .custom-navbar .nav-link {
//   color: #fff !important;   
// }
//   .custom-navbar .navbar-collapse {
//     background: transparent !important;   
//   }

//   .custom-navbar .dropdown-item {
//     color: hsl(0, 0%, 98%) !important;
//   }
//     .custom-navbar .nav-link,
//   .custom-navbar .dropdown-item {
//     color: #ffffff !important;   
//   }
//      #navbarNav {
//     background-color: #ffffff !important;
//         height: 450px;
//     font-size: 18px;
//     line-height: 18.38px;
//     text-underline-position: from-font;
//     text-decoration-skip-ink: none;
//     border-radius: 28px;
//     overflow-y: auto;
//         padding-left: 30px;
//         width: 100%;
//           margin-top: 5%;
//   }
//   .nav-item a:active,
//   .nav-item a:focus,
//   .nav-item a:visited,
//   .nav-item a:hover,
//   .nav-item a.show,
//   .nav-item .dropdown-toggle[aria-expanded="true"] {
//     color: #000000 !important;
//   }
//     #products.dropdown-menu,
//   #contr.dropdown-menu {
//     width: 100% !important;
//     height: auto !important;
//     border-radius: 0;
//     background: #fff;
//     position: static;   
//     display: none;      
//   }

//   #products.dropdown-menu.show,
//   #contr.dropdown-menu.show {
//     display: block;     
//   }
//   #products {
//     img {
//       padding-right: 20px;
//     }
//   .dropdown-item {
//     font-size: 14px;
//     line-height: 18.38px;
//     color: #1d192b;


//     &:hover {
//       color: #ff2d55;
//     }
//   }
//     .menu-text {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .menu-text:hover {
//       color: #ff2d55;
//     }
//   }
// #contr {
//     margin-left: 35%;

//     img {
//       padding-right: 20px;
//     }
//     .dropdown-contr {
//       font-size: 14px;
//       line-height: 18.38px;
//       color: #1d192b;
//     }
//     .menu-text1 {
//       font-size: 14px;
//       line-height: 24px;
//       color: #625b71;
//       padding-left: 55px;
//     }
//     .dropdown-contr:hover {
//       color: #ff2d55;
//     }
//     .menu-text1:hover {
//       color: #ff2d55;
//     }
//   }
//   .footer-container {
//     display: grid;
//     grid-template-columns: repeat(4, 1fr);
//     justify-content: space-around;
//     background-color: #1d1b20;
//     width: 100%;
//   }
//   .footer-logo {
//     width: 50px;
//     height: 50px;
//   }
//   .desktop-icon {
//     display: block;
//   }
  
//   .mobile-icon {
//     display: none;
//   }
//   .footer-logo-text {
//     display: flex;
//     font-family: "Monda", sans-serif;
//     font-size: 24px;
//     line-height: 39.09px;
//     margin-top: -45px;
//   }
//   .footer-links li a {
//     font-size: 16px;
//     line-height: 24px;
//     color: #cac4d0;
//     text-decoration: none;
//   }
//   .footer-links li a:hover {
//     color: #ff516e;
//   }
  
//   .footer-section h3 {
//     color: #cec8d4;
//     font-family: "Inter", sans-serif;
//     font-size: 16px;
//     line-height: 19.36px;
//   }
  
//   .footer-links span {
//     font-size: 16px;
//     line-height: 18.38px;
//     color: #65558f;
//   }
//   .footer-divider {
//     width: 100%;
//     height: 2px;
//     background-color: #ccc;
//   }
//   .footer-bottom {
//     padding: 50px;
//     display: flex;
//     justify-content: space-around;
//     background-color: #1d1b20;
//   }
//   .footer-bottom p {
//     font-family: "Inter", sans-serif;
//     font-size: 16px;
//     line-height: 19.36px;
//   }
//   .custom-heart {
//     font-size: 20px;
//     color: #ff2d55;
//   }
//   .footer-bottom .social-icons {
//     display: flex;
//     justify-content: space-around;
//   }
//   .social-icons img {
//     width: 24px;
//     height: 24px;
//   }
// }

// Import Bootstrap
@import "../node_modules/bootstrap/scss/bootstrap";
@import "../node_modules/bootstrap-icons/font/bootstrap-icons.css";
body {
font-family: "Ubuntu", serif;
font-style: normal;
}
html, body {
margin: 0;
padding: 0;
overflow-x: hidden;
}
.custom-navbar {
width: auto;
height: 80px;
box-sizing: border-box;
border-radius: 16px;
border-bottom: 0.5px;
background: #1B171FCC;
backdrop-filter: blur(10px)
}
.custom-navbar .nav-link {
color: #fff !important;   
}
.menubar {
gap: 20px;
}
#navbarNav {
padding-left: 60px;
font-size: 16px;
line-height: 18.38px;
}
#products {
width: 920px;
height: 500px;
border-radius: 16px;
img {
padding-right: 20px;
  }
.dropdown-item {
font-size: 16px;
line-height: 18.38px;
color: #1d192b;
&:hover {
color: #ff2d55;
    }
&.active,
&:focus,
&:active {
background-color: #f5f5f5;
    }
  }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #625b71;
padding-left: 55px;
&:hover {
color: #ff2d55;
    }
&.active,
&:focus,
&:active {
background-color: #f5f5f5;
    }
  }
}
#contr {
width: 400px;
height: 362px;
border-radius: 16px;
padding-left: 30px;
padding-top: 20px;
img {
padding-right: 20px;
  }
.dropdown-contr {
font-size: 16px;
line-height: 18.38px;
color: #1d192b;
&:hover {
color: #ff2d55;
    }
&.active,
&:focus,
&:active {
background-color: #f5f5f5;
    }
  }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #625b71;
padding-left: 55px;
&:hover {
color: #ff2d55;
    }
&.active,
&:focus,
&:active {
background-color: #f5f5f5;
    }
  }
}
.footer-container {
display: grid;
grid-template-columns: repeat(6, 1fr);
justify-content: space-around;
background-color: #1d1b20;
width: 100%;
}
.footer-logo {
width: 50px;
height: 50px;
}
.desktop-icon {
display: block;
}
.mobile-icon {
display: none;
}
.footer-logo-text {
display: flex;
font-family: "Monda", sans-serif;
font-size: 24px;
line-height: 39.09px;
margin-top: -45px;
}
.footer-links li a {
font-size: 16px;
line-height: 24px;
color: #cac4d0;
text-decoration: none;
}
.footer-links li a:hover {
color: #ff516e;
}
.footer-section h3 {
color: #cec8d4;
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
}
.footer-links span {
font-size: 16px;
line-height: 18.38px;
color: #65558f;
}
.footer-divider {
width: 100%;
height: 2px;
background-color: #ccc;
}
.footer-bottom {
padding: 50px;
display: flex;
justify-content: space-around;
background-color: #1d1b20;
}
.footer-bottom p {
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
}
.custom-heart {
font-size: 20px;
color: #ff2d55;
}
.footer-bottom .social-icons {
display: flex;
justify-content: space-around;
}
.social-icons img {
width: 24px;
height: 24px;
}

/* ─── MOBILE (max-width: 768px) ─────────────────────────────────────────────── */
@media (max-width: 768px) {
.custom-navbar {
height: 70px;
padding: 10px 20px 10px 10px !important;
margin: 10px !important;
border-radius: 16px;
background: #1b171fcc;
  }
.menubar {
gap: 20px;
  }

/* CHANGED: dark background so white text is visible */
#navbarNav {
background-color: #1b171f;
height: 600px;
font-size: 16px;
line-height: 18.38px;
text-underline-position: from-font;
text-decoration-skip-ink: none;
border-radius: 28px;
overflow-y: auto;
margin-top: 5%;
  }

/* ADDED: white nav links on dark background */
#navbarNav .nav-link,
#navbarNav .nav-item a {
color: #ffffff !important;
  }

/* ADDED: white hamburger icon on dark navbar */
.navbar-toggler {
border-color: rgba(255, 255, 255, 0.3);
  }
.navbar-toggler-icon {
filter: invert(1);
  }

.nav-item a:active,
.nav-item a:focus,
.nav-item a:visited,
.nav-item a:hover,
.nav-item a.show,
.nav-item .dropdown-toggle[aria-expanded="true"] {
color: #ff2d55 !important;         /* CHANGED: red on interaction */
  }

/* CHANGED: dark dropdown background */
#products.dropdown-menu,
#contr.dropdown-menu {
width: 100% !important;
height: auto !important;
border-radius: 0;
background: #2a2230;
position: static;   
display: none;      
  }
#products.dropdown-menu.show,
#contr.dropdown-menu.show {
display: block;    
  }

#products {
img {
padding-right: 20px;
    }
.dropdown-item {
font-size: 14px;
line-height: 18.38px;
color: #e0dce6;                    /* CHANGED: light text on dark bg */
&:hover {
color: #ff2d55;
      }
    }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #9e98a8;                    /* CHANGED: muted light subtext */
padding-left: 55px;
    }
.menu-text:hover {
color: #ff2d55;
    }
  }

#contr {
margin: 0 auto;              
display: flex;
flex-direction: column;
align-items: center; 
img {
padding-right: 20px;
    }
.dropdown-contr {
font-size: 14px;
line-height: 18.38px;
color: #e0dce6;                    /* CHANGED: light text on dark bg */
    }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #9e98a8;                    /* CHANGED: muted light subtext */
padding-left: 55px;
    }
.dropdown-contr:hover {
color: #ff2d55;
    }
.menu-text1:hover {
color: #ff2d55;
    }
  }

.footer-container {
display: grid;
grid-template-columns: repeat(2, 1fr);
justify-content: space-around;
padding-top: 50px;
background-color: #1d1b20;
padding-bottom: 50px;
  }
.footer-section:nth-child(1) {
grid-column: span 2;
  }
.footer-section:nth-child(n + 2) {
grid-column: span 1;
  }
.footer-container {
grid-template-columns: repeat(2, 1fr);
  }
.footer-logo {
width: 32px;
height: 32px;
  }
.desktop-icon {
display: none;
  }
.mobile-icon {
display: block;
  }
.footer-logo-text {
font-family: "Monda", sans-serif;
font-size: 14px;
line-height: 39.09px;
margin-top: -35px;
  }
.footer-links li a {
font-size: 16px;
line-height: 24px;
color: #cac4d0;
text-decoration: none;
  }
.footer-links li a {
grid-column: span 1;
  }
.footer-links li a:hover {
color: #ff516e;
  }
#terms {
margin-left: -30px;
  }
.footer-section h3 {
padding-top: 20px;
color: #cec8d4;
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
  }
.footer-section .developers {
padding-top: 70px;
  }
.footer-links span {
font-size: 16px;
line-height: 18.38px;
color: #65558f;
  }
.footer-divider {
width: 100%;
height: 2px;
background-color: #ccc;
  }
.footer-bottom {
padding: 50px;
flex-direction: column;
justify-content: space-around;
background-color: #1d1b20;
white-space: nowrap;
  }
.footer-bottom p {
font-family: "Inter", sans-serif;
font-size: 15px;
line-height: 19.36px;
margin-left: -30px;
  }
.footer-bottom .p2 {
color: #65558f;
  }
.social-icons {
display: flex;
justify-content: space-around;
  }
.social-icons img {
width: 20px;
height: 20px;
  }
}

/* ─── TABLET (768px – 1024px) ───────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1024px) {
.nav-item a {
font-size: 14px;
  }
.navbar-brand{
font-size: 16px;
  }
.custom-navbar {
background: #1B171FCC !important;
height: 80px;
box-shadow: none !important; 
backdrop-filter: blur(10px);
  }
.custom-navbar .nav-link {
color: #fff !important;   
  }
.custom-navbar .navbar-collapse {
background: transparent !important;   
  }
.custom-navbar .dropdown-item {
color: hsl(0, 0%, 98%) !important;
  }
.custom-navbar .nav-link,
.custom-navbar .dropdown-item {
color: #ffffff !important;   
  }

/* ADDED: white hamburger icon */
.navbar-toggler {
border-color: rgba(255, 255, 255, 0.3);
  }
.navbar-toggler-icon {
filter: invert(1);
  }

/* CHANGED: dark background so white text is visible */
#navbarNav {
background-color: #1b171f !important;
height: 450px;
font-size: 18px;
line-height: 18.38px;
text-underline-position: from-font;
text-decoration-skip-ink: none;
border-radius: 28px;
overflow-y: auto;
padding-left: 30px;
width: 100%;
margin-top: 5%;
  }

/* ADDED: white nav links on dark background */
#navbarNav .nav-link,
#navbarNav .nav-item a {
color: #ffffff !important;
  }

.nav-item a:active,
.nav-item a:focus,
.nav-item a:visited,
.nav-item a:hover,
.nav-item a.show,
.nav-item .dropdown-toggle[aria-expanded="true"] {
color: #ff2d55 !important;         /* CHANGED: red on interaction */
  }

#products {
img {
padding-right: 20px;
    }
.dropdown-item {
font-size: 14px;
line-height: 18.38px;
color: #e0dce6;                    /* CHANGED: light text on dark bg */
&:hover {
color: #ff2d55;
      }
    }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #9e98a8;                    /* CHANGED: muted light subtext */
padding-left: 55px;
    }
.menu-text:hover {
color: #ff2d55;
    }
  }

#contr {
margin-left: 0 !important;        /* CHANGED: removed broken 35% offset */
img {
padding-right: 20px;
    }
.dropdown-contr {
font-size: 14px;
line-height: 18.38px;
color: #e0dce6;                    /* CHANGED: light text on dark bg */
    }
.menu-text1 {
font-size: 14px;
line-height: 24px;
color: #9e98a8;                    /* CHANGED: muted light subtext */
padding-left: 55px;
    }
.dropdown-contr:hover {
color: #ff2d55;
    }
.menu-text1:hover {
color: #ff2d55;
    }
  }

/* CHANGED: dark dropdown background */
#products.dropdown-menu,
#contr.dropdown-menu {
width: 100% !important;
height: auto !important;
border-radius: 12px;
background: #2a2230;
position: static;  
display: none;      
  }
#products.dropdown-menu.show,
#contr.dropdown-menu.show {
display: block;     
  }

.footer-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-content: space-around;
background-color: #1d1b20;
width: 100%;
  }
.footer-logo {
width: 50px;
height: 50px;
  }
.desktop-icon {
display: block;
  }
.mobile-icon {
display: none;
  }
.footer-logo-text {
display: flex;
font-family: "Monda", sans-serif;
font-size: 24px;
line-height: 39.09px;
margin-top: -45px;
  }
.footer-links li a {
font-size: 16px;
line-height: 24px;
color: #cac4d0;
text-decoration: none;
  }
.footer-links li a:hover {
color: #ff516e;
  }
.footer-section h3 {
color: #cec8d4;
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
  }
.footer-links span {
font-size: 16px;
line-height: 18.38px;
color: #65558f;
  }
.footer-divider {
width: 100%;
height: 2px;
background-color: #ccc;
  }
.footer-bottom {
padding: 50px;
display: flex;
justify-content: space-around;
background-color: #1d1b20;
  }
.footer-bottom p {
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
  }
.custom-heart {
font-size: 20px;
color: #ff2d55;
  }
.footer-bottom .social-icons {
display: flex;
justify-content: space-around;
  }
.social-icons img {
width: 24px;
height: 24px;
  }
}

/* ─── SMALL DESKTOP (1025px – 1199px) ──────────────────────────────────────── */
@media (min-width: 1025px) and (max-width:1199px){
.nav-item a {
font-size: 14px;
  }
.navbar-brand{
font-size: 16px;
  }
.custom-navbar {
background: #1B171FCC !important;
height: 80px;
box-shadow: none !important; 
backdrop-filter: blur(10px);
  }
.custom-navbar .nav-link {
color: #fff !important;   
  }
.custom-navbar .navbar-collapse {
background: transparent !important;   
  }
.custom-navbar .dropdown-item {
color: hsl(0, 0%, 98%) !important;
  }
.custom-navbar .nav-link,
.custom-navbar .dropdown-item {
color: #ffffff !important;   
  }
#navbarNav {
background-color: #ffffff !important;
height: 450px;
font-size: 18px;
line-height: 18.38px;
text-underline-position: from-font;
text-decoration-skip-ink: none;
border-radius: 28px;
overflow-y: auto;
padding-left: 30px;
width: 100%;
margin-top: 5%;
  }
.nav-item a:active,
.nav-item a:focus,
.nav-item a:visited,
.nav-item a:hover,
.nav-item a.show,
.nav-item .dropdown-toggle[aria-expanded="true"] {
color: #000000 !important;
  }
#products.dropdown-menu,
#contr.dropdown-menu {
width: 100% !important;
height: auto !important;
border-radius: 0;
background: #fff;
position: static;   
display: none;      
  }
#products.dropdown-menu.show,
#contr.dropdown-menu.show {
display: block;     
  }
#products {
img {
padding-right: 20px;
    }
.dropdown-item {
font-size: 14px;
line-height: 18.38px;
color: #1d192b;
&:hover {
color: #ff2d55;
      }
    }
.menu-text {
font-size: 14px;
line-height: 24px;
color: #625b71;
padding-left: 55px;
    }
.menu-text:hover {
color: #ff2d55;
    }
  }
#contr {
margin-left: 35%;
img {
padding-right: 20px;
    }
.dropdown-contr {
font-size: 14px;
line-height: 18.38px;
color: #1d192b;
    }
.menu-text1 {
font-size: 14px;
line-height: 24px;
color: #625b71;
padding-left: 55px;
    }
.dropdown-contr:hover {
color: #ff2d55;
    }
.menu-text1:hover {
color: #ff2d55;
    }
  }
.footer-container {
display: grid;
grid-template-columns: repeat(4, 1fr);
justify-content: space-around;
background-color: #1d1b20;
width: 100%;
  }
.footer-logo {
width: 50px;
height: 50px;
  }
.desktop-icon {
display: block;
  }
.mobile-icon {
display: none;
  }
.footer-logo-text {
display: flex;
font-family: "Monda", sans-serif;
font-size: 24px;
line-height: 39.09px;
margin-top: -45px;
  }
.footer-links li a {
font-size: 16px;
line-height: 24px;
color: #cac4d0;
text-decoration: none;
  }
.footer-links li a:hover {
color: #ff516e;
  }
.footer-section h3 {
color: #cec8d4;
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
  }
.footer-links span {
font-size: 16px;
line-height: 18.38px;
color: #65558f;
  }
.footer-divider {
width: 100%;
height: 2px;
background-color: #ccc;
  }
.footer-bottom {
padding: 50px;
display: flex;
justify-content: space-around;
background-color: #1d1b20;
  }
.footer-bottom p {
font-family: "Inter", sans-serif;
font-size: 16px;
line-height: 19.36px;
  }
.custom-heart {
font-size: 20px;
color: #ff2d55;
  }
.footer-bottom .social-icons {
display: flex;
justify-content: space-around;
  }
.social-icons img {
width: 24px;
height: 24px;
  }
}