/* ✅ Navbar absolute & transparent */
 .navbar {
     position: absolute;
     top: 0;
     left: 50%;
     transform: translateX(-50%);
     width: 100%;
     background: transparent !important;
     z-index: 9999;
 }




 @media (max-width: 991px) {
     .desktop-nav {
         display: none;
     }
 }

 .hero {
     position: relative;
     width: 100%;
     height: 100vh;
 }

 .gallery-item {
     position: absolute;
     width: 50%;
     height: 50%;
     overflow: hidden;
 }

 .gallery-item img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     filter: grayscale(100%);
 }

 .overlay-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-size: 24px;
     color: #fff;
     text-transform: uppercase;

 }

 .menu-toggle {
     display: none;
     flex-direction: column;
     height: 24px;
     justify-content: space-between;
     cursor: pointer;
     z-index: 1001;
 }

 .menu-toggle .bar {
     height: 3px;
     width: 30px;
     background-color: #fff;
     border-radius: 2px;
     transition: all 0.3s ease;
 }

 .menu-toggle.open .bar:nth-child(1) {
     transform: rotate(45deg) translate(5px, 5px);
 }

 .menu-toggle.open .bar:nth-child(2) {
     opacity: 0;
 }

 .menu-toggle.open .bar:nth-child(3) {
     transform: rotate(-45deg) translate(6px, -6px);
 }

 @media (max-width: 991px) {
     .menu-toggle {
         display: flex;
     }
 }