
.hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 25px;
  gap: 5px;               /* space between bars */
  height: 30px;
  cursor: pointer;
  background: transparent;
  z-index: 1000;
    /* Position at top-right */
  position: absolute; /* or 'fixed' if you want it to stay while scrolling */
  top: 32px;          /* distance from top edge */
  right: 28px;        /* distance from right edge */
}

.hamburger .bar {
  width: 25px;            /* standard visible width */
  height: 2px;            /* standard visible thickness */
  background-color: rgb(68, 68, 68); /* bar color */
  border-radius: 0.4px;
}


.sidebar-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.2);
  display: none;
  z-index: 999;
}


@media (max-width: 768px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .menu-toggle { display: block; }
  .sidebar-overlay.active { display: block; }
  .main-content { 
    margin-left: 0; 
    min-height: 100vh;
    height: 100%;
  }
  .hamburger { display: flex; }
  
  


  .logo-container { transform: translateX(-500%); }

   .logo-container_curtain {
    position: relative;
    top: 38%;
    left: 6%;
    z-index: 1001; /* above sidebar overlay */
    display: inline-block;
  }


  .text-container {
     width: 100%;
     position: relative;
     max-height: none; 
     display: block;       /* avoid flex stretching issues */
     max-height: none;
     padding-top: 0px;
    }


  .image-container,
  .gallery { 
     width: 100%;
     position: relative;
     max-height: none; 
     display: block;       /* avoid flex stretching issues */
     max-height: none;
     padding-top: 35px;
    }
      

.gallery img {
  position: absolute; 
  width: 100%;
  height: auto; /* preserves aspect ratio */
  padding: 0;
  display: block;       /* remove inline spacing */
  object-fit: contain;  /* ensures no distortion if container is smaller */
}




.menu-toggle { display: flex; }

.sidebar {
  left: auto;
  right: 0;
  transform: translateX(100%);
  width: 280px;
  height: 100%;
  box-shadow: -1px 0 6px rgba(0,0,0,0.08);
  background: #fff;
  top: 0;
  z-index: 1000;
  transition: transform 0.3s ease; /* Smooth slide */
  padding-top: 0;
}

.sidebar.open {
  transform: translateX(0);
}

.nav-item, 
.sub-link { 
  padding: 6px 32px;
  padding-right: 5px;
}

.sub-menu a {
  padding: 8px 50px;
  padding-right: 5px;
}


.main-content {
  margin-left: 0;
  width: 100%;
  padding: 20px;
  padding-top: 60px;   /* reduce from 60px to give more vertical space */
}


.sidetext {
  width: 100%;
  padding: 20px;
  position: relative;
  left: 0; 
  margin-top: 100px;
  margin: 0;
  height: 150px;
  line-height: 1.5;
   text-align: justify; /* Center the image horizontally */
  }

}



@media (min-width: 769px) {
.hide-on-desktop {
  display: none;
  }
}

@media (max-width: 768px) {
.hide-on-mobile {
  display: none;
  }
}


@media (max-width: 769px) {
  html, 
  body {
    overflow-y: auto; 
  }
}