/* ===== GLOBAL ===== */
html{
  scroll-behavior:smooth;
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:'Poppins',sans-serif;
}

body{
  font-family: 'Montserrat', sans-serif;
  margin:0;
  padding:0;
  overflow-x:hidden;
  line-height:1.6;
  color:#333;
}

/* ===== COMMON ===== */
section{
  padding:70px 8%;
}

h2{
  text-align:center;
  margin-bottom:30px;
  font-size:32px;
}
/* ===== HERO SECTION ===== */
.hero{
  position:relative;
  height:100vh;
  overflow:hidden;
}

/* SLIDER IMAGES */
.slides img{
  position:absolute;
  width:100%;
  height:100vh;
  object-fit:cover;
  opacity:0;
  transition:0.6s;
}

.slides img.active{
  opacity:1;
}

/* DARK OVERLAY */
.hero-overlay{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.55);
  z-index:5;
}

/* ===== TOP BAR ===== */
.hero-top{
  position:absolute;
  top:20px;
  left:0;
  width:100%;
  display:flex;
  justify-content:space-between;
  padding:0 40px;
  z-index:10;
}

/* SOCIAL ICONS */
.hero-social{
  color:white;
  display:flex;
  gap:15px;
  font-size:20px;
}

.hero-social i{
  cursor:pointer;
  transition:0.3s;
}

.hero-social i:hover{
  color:#ffcc00;
}

/* BOOKING */
.hero-booking{
  color:white;
  font-weight:600;
  background:#ff7b00c7;
  padding:8px 15px;
  border-radius:5px;
}

/* ===== CENTER CONTENT ===== */
.hero-center{
  position:absolute;
  width:100%;
  height:100%;
  z-index:10;
  top:25%;
}

/* LOGO */
.hero-logo{
  position:absolute;
  top: -230px;              
  left:50%;
  transform:translateX(-50%);
  height:270px;           
  z-index:10;
  width:auto;        
  display:block;
  margin:0 auto 12px; 
}

/* NAVBAR */
.hero-nav{
  position:absolute;
  top:-30px;           
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:35px;
  z-index:10;
  font-family:Georgia, 'Times New Roman', Times, serif
}

.hero-nav a{
  color:rgba(255, 255, 255, 0.823);
  text-decoration:none;
  font-size:25px;
  font-weight:500;
  position:relative;
  font-style:inherit;
}

/* HOVER LINE */
.hero-nav a::after{
  content:"";
  position:absolute;
  width:0;
  height:2px;
  background:#ffcc00;
  left:0;
  bottom:-5px;
  transition:0.3s;
}

.hero-nav a:hover::after{
  width:100%;
}

/* HERO TEXT */
.hero-center h2{
  position:absolute;
  top:210px;            
  left:50%;
  transform:translateX(-50%);
  font-size:38px;
  color:white;
  text-align:center;
  width:100%;
  font-family: Georgia, 'Times New Roman', Times, serif;
}

.hero-center p{
  position:absolute;
  top:290px;            
  left:50%;
  transform:translateX(-50%);
  font-size:18px;
  color:white;
}

/* FIX HERO ICON COLORS */
.hero-social a,
.mobile-social a {
  color: white;          
  text-decoration: none; 
}

/* VISITED */
.hero-social a:visited,
.mobile-social a:visited {
  color: white;
}

/* HOVER */
.hero-social a:hover,
.mobile-social a:hover {
  color: #ffcc00; 
}

/* ACTIVE */
.hero-social a:active,
.mobile-social a:active {
  color: #ffcc00;
}

/* ===== STICKY EFFECT ===== */

/* WHEN SCROLLED */
.hero.scrolled .hero-top,
.hero.scrolled .hero-center{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:90px;
  background:#7a3b12; 
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 50px;
  z-index:9999;
}

/* HIDE EXTRA THINGS */
.hero.scrolled .hero-social,
.hero.scrolled .hero-booking,
.hero.scrolled h2,
.hero.scrolled p{
  display:none;
}

/* LOGO LEFT */
.hero.scrolled .hero-logo{
  position:static;
  transform:none;
  height: 270px;
  width:auto;
  align-items:center; 
}

/* NAV RIGHT */
.hero.scrolled .hero-nav{
  position:static;
  transform:none;
  display:flex;
  gap:25px;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 30px;
}

/* NAV LINKS STYLE */
.hero.scrolled .hero-nav a{
  font-size:16px;
  color:white;
}

/* IMAGE FIX */ 
img{ 
  width:100%; 
  display:block; 
}

/* ===== SLIDER ===== */
.slider{
  width:100%;
  height:100vh;
  position:relative;
  overflow:hidden;
  z-index:0;
}

.slides{
 width:100%; 
 height:100%; 
}

.slider::after{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.55);
  top:0;
  left:0;
  z-index:5;
}

.slides img{
  position:absolute;
  top:0; 
  left:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:0.6s ease;
  z-index:0;
  animation:zoom 3s infinite;
}

.slides img.active{
  opacity:1;
}

@keyframes zoom{ 
 0%{transform:scale(1);}
 100%{transform:scale(1.1);}
}

/* BUTTONS */
.prev,.next{
  position:absolute;
  top:50%;
  transform:translateY(-60%);
  background:rgba(0, 0, 0, 0.64);
  border:none;
  width: 50px;
  height:50px;
  border-radius:50%;
  color:rgb(227, 222, 222);
  cursor:pointer;
  z-index:50;
  font-size:18px;
  align-items:center;
  justify-content:center;
  transition:0.3s;
}

.prev{left:20px;}
.next{right:20px;}

.prev:hover,.next:hover{
  background:#ffcc00;
  color:black;
}

/* HERO TEXT */
.hero.overlay{
  position:absolute;
  top:65%;
  left:50%;
  transform:translate(-50%, -50%);
  text-align:center;
  color:white;
  z-index:10;
  width:100%;
}

.hero.overlay h2{
  font-size:42px;
  font-weight:700;
  color:white;   
}

.hero.overlay p{
  font-size:20px;
  color:white;   
  margin-top:10px;
}

.menu-toggle{
  display:none;
  position:absolute;
  right:20px;
  top:20px;
  font-size:26px;
  color:white;
  cursor:pointer;
  z-index:1001;
}

/* ===== HERO CONTENT ===== */
.hero-content{
  text-align:center;
  background:antiquewhite;
}

.hero-content ol{
  list-style:none;
  margin:20px 0;
  padding-left: 20px;
}

.hero-content li{
  margin:10px 0;
  font-size:18px;
}

.highlight{
  font-size:20px;
  font-family: monospace;
  font-weight:600;
}

/* ===== EVENTS ===== */
.events-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.events h2{
  position:relative;
  padding-bottom:15px;
  font-family: 'Poppins', sans-serif;
  justify-content: center;
  text-align: center;
}

.event-card{
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 5px 15px rgba(0,0,0,0.1);
  cursor:pointer;
  transition:0.3s;
}

.event-card:hover{
  transform:translateY(-30px);
}

.event-card img{
  height:250px;
  object-fit:cover;
}

.event-card h3{
  padding:15px;
  text-align:center;
  background:beige;
}

/* ===== SERVICES SECTION (LIKE REFERENCE) ===== */
.services{
  position:relative;
  background:url("images/hall.jpg") center/cover no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  color:white;
  padding:80px 20px;
  width:100%;
  overflow:hidden;
}

/* DARK OVERLAY */
.services-overlay{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.6);
}

/* CONTAINER */
.services-container{
  position:relative;
  z-index:2;
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,1fr); 
  justify-content:center;
  align-items:center;
  gap:30px;
  flex-wrap:wrap; 
  max-width:1200px;
  margin:auto;
  text-align:center; 
}

/* EACH BOX */
.service-box{
  text-align:center;
  max-width:250px;
  padding:10px;
  display:flex;
  flex-direction:column;
  align-items:center;   
  justify-content:center;
}

/* ICON STYLE */
.service-box i{
  font-size:30px;
  color:#ffcc00;
  border:2px solid #ffcc00;
  padding:15px;
  border-radius:10px;
  margin-bottom:15px;
  box-shadow:0 0 15px #ffcc00;
  transition:0.3s;
}

/* TITLE */
.service-box h3{
  font-size:20px;
  margin-bottom:10px;
}

/* TEXT */
.service-box p{
  font-size:14px;
  line-height:1.7;
  color:#ddd;
  max-width:260px;   
  margin:0 auto; 
}

.service-box:hover{
  transform:translateY(-10px);
  transition:0.3s;
}

/* ===== GALLERY ===== */
.gallery-section{
  position:relative;
  padding:80px 20px;
  background-color:#fff ;
}

.gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:30px;
}

.gallery img{
  width:100%;
  height:250px;
  object-fit:cover;
  border-radius:10px;
  cursor:pointer;
  transition:0.3s;
}

.gallery-section::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

/* CONTENT ABOVE OVERLAY */
.gallery-section h2,
.gallery{
  position:relative;
  z-index:2;
}

/* OPTIONAL */
.gallery-section h2{
  color:#000000;
  font-family: 'Poppins', sans-serif;
  font-weight:600;
}

.gallery img:hover{
  transform:scale(1.05);
}

/* ===== LIGHTBOX ===== */
.lightbox{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.9);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:2000;
  padding: 20px;
}

.lightbox img{
  max-width:90%;
  max-height:90%;
  width:auto;         
  height:auto;         
  object-fit:contain; 
  border-radius:10px;
}

/* CLOSE BUTTON */
.lightbox-close{
  position:absolute;
  top:20px;
  right:30px;
  font-size:35px;
  color:white;
  cursor:pointer;
  z-index:2100;
  transition:0.3s;
}

.lightbox-close:hover{
  color:#ffcc00;
}


/* ===== TESTIMONIAL ===== */
.testimonials{
  position:relative;
  background:url("images/test-bg.jpg") center/cover no-repeat;
  height:420px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  color:white;
  font-style: oblique;
}

.testimonials::before{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.7);
}

.testimonial-slider{
  position:relative;
  z-index:2;
  max-width:800px;
  text-align:center;
}

.testimonial{
  display:none;
}

.testimonial.active{
  display:block;
}

.quote{
  font-size:50px;
  box-shadow: transparent;
}

.text{
  font-size:18px;
  margin:10px 0;
  max-height:120px;
  overflow:hidden;
}

.testimonial h4{
  color:#ffcc00;
}

/* ===== CONTACT FORM SECTION ===== */
.contact-form-section{
  display:flex;
  width:100%;
  min-height:500px;
  background-color:#7a3b12;
}

/* LEFT IMAGE */
.contact-left{
  flex:1;
}

.contact-left img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* RIGHT FORM */
.contact-right{
  flex:1;
  background:#e9e1d8;
  padding:60px 40px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

/* INPUT ROW */
.form-row{
  display:flex;
  gap:20px;
  margin-bottom:20px;
}

.form-row input{
  flex:1;
  padding:12px;
  border:1px solid #ccc;
  border-radius:5px;
  font-size:14px;
  outline:none;
}

/* TEXTAREA */
.contact-right textarea{
  width:100%;
  height:120px;
  padding:12px;
  border:1px solid #ccc;
  border-radius:5px;
  margin-bottom:20px;
  font-size:14px;
  resize:none;
  outline:none;
}

/* BUTTON */
.send-btn{
  width:160px;
  padding:12px;
  background:#7a3b12;
  color:white;
  border:none;
  border-radius:5px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
}

.send-btn:hover{
  background:#5c2c0d;
}

/* ===== ABOUT ===== */
.about-section{
  display:flex;
  align-items:normal;
  gap:10px;
  font-size: 18px;
  background-color:rgb(247, 247, 247)
}

.about-box, .address-box, .map-box{
  flex:1;
  padding:20px;
  border-radius:10px;
}

/* ABOUT LOGO BELOW TEXT */
.about-logo{
  display: block;
  max-width:180px;   
  width:100%;        
  height:auto; 
  margin-top:25px auto 0;
  filter:brightness(1.2) contrast(1.1);
  opacity:1;
}

/* CONTACT ICON STYLE */
.contact-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:15px;
  font-size:16px;
  line-height:1.6;
}

.contact-item i{
  color:#000000dd;
  font-size:18px;
  margin-top:4px;
}

.contact-item a{
  color:rgb(8, 0, 0);
  text-decoration:none;
}

.contact-item a:hover{
  color:#7a3b12;
}

/* EMAIL STYLE */
.email-item a{
  color:black;       
  font-weight:500;
  text-decoration:none;
  word-break:break-all;  
}

/* HOVER EFFECT */
.email-item a:hover{
  color:#7a3b12;
}

/* ICON ALIGNMENT */
.email-item i{
  color:#080400;
}

.map-box iframe{
  width:100%;
  height:200px;
}

.about-box p,
.address-box p,
.contact-item,
.contact-item a{
  font-family: 'Open Sans', sans-serif,'Times New Roman', Times, serif;
}

h2{
  margin-bottom:15px;   
}

/* ===== MOBILE EXTRA CONTENT (INSIDE TOGGLE) ===== */
.mobile-extra{
  margin-top:auto;
  width:100%;
  padding:20px;
  background:#7a3b12;   
  border-radius:10px;
}

/* CONTACT TEXT */
.mobile-contact p{
  color:#fff;
  font-size:14px;
  margin-bottom:10px;
  display:flex;
  align-items:center;
  gap:10px;
}

/* ICONS */
.mobile-contact i{
  color:#ffcc00;
}

/* SOCIAL ICONS */
.mobile-social{
  display:flex;
  gap:15px;
  margin-top:10px;
}

.mobile-social i{
  color:#fff;
  font-size:18px;
  cursor:pointer;
  transition:0.3s;
}

.mobile-social i:hover{
  color:#ffcc00;
}

/* ===== WHATSAPP ===== */
.whatsapp{
  position:fixed;
  bottom:20px;
  right:20px;
  background:#25D366;
  color:white;
  padding:20px;
  width:50px;
  height:50px;
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius:50%;
  font-size:25px;
  z-index:1000;
  box-shadow:0 0 15px rgba(0,0,0,0.3);
  transition:0.3s;
}

.whatsapp:hover{
  transform:scale(1.1);
}

/* CALL BUTTON (LEFT SIDE) */
.call-btn{
  position:fixed;
  bottom:20px;
  left:20px;
  background:#007bff;
  color:white;
  width:50px;
  height:50px;
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius:50%;
  font-size:24px;
  z-index:1000;
  box-shadow:0 0 15px rgba(0,0,0,0.3);
  transition:0.3s;
}

.call-btn:hover{
  transform:scale(1.1);
}

/* SCROLL TO TOP (ABOVE WHATSAPP) */
#scrollTopBtn{
  position:fixed;
  bottom:90px;
  right:20px;
  background:#ffcc00;
  color:black;
  width:50px;
  height:50px;
  border:none;
  border-radius:50%;
  font-size:20px;
  cursor:pointer;
  display:none;
  z-index:1000;
  box-shadow:0 0 10px rgba(0,0,0,0.3);
  transition:0.3s;
}

#scrollTopBtn:hover{
  transform:scale(1.1);
}

/* ===== FOOTER ===== */
.footer{
  background:#7a3b12;   
  color:#fff;
  text-align:center;
  padding:15px 10px;
  font-size:14px;
}

/* UPDATED LINK STYLE */
.footer a{
  color:#ffcc00;   
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  transition:0.3s;
}

.footer a:hover{
  color:#fff;
}

/* ================= FULL RESPONSIVE ================= */

/* ===== LARGE LAPTOP (1200px ↓) ===== */
@media(max-width:1200px){
 .hero-center h2{
    top:200px;
    font-size:32px;
    width:90%;
  }

  .hero-center p{
    top:260px;
    font-size:17px;
  }
  .services-container{
    grid-template-columns:repeat(3,1fr);
  }

  .events-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .gallery{
    grid-template-columns:repeat(3,1fr);
  }
}


/* ===== LAPTOP (992px ↓) ===== */
 @media(max-width:992px){

/* Reduce logo size */
  .hero-logo{
    height:200px;
    top:-160px;
  }

   .hero-nav{
    gap:20px;
  }

  .hero-center h2{
    top:190px;
    font-size:28px;
    width:90%;
    line-height:1.4;
  }

/* TEXT */
  .hero-center p{
    top:250px;
    font-size:16px;
  }

/* Reduce nav size */
  .hero-nav a{
    font-size:18px;
  }

/* NAVBAR */
  .nav-links{
    gap:20px;
  }

  .logo-center img{
    height:90px;
  }

/* SERVICES */
  .services-container{
    grid-template-columns:repeat(2,1fr);
  }

/* EVENTS */
  .events-grid{
    grid-template-columns:repeat(2,1fr);
  }

/* GALLERY */
  .gallery{
    grid-template-columns:repeat(2,1fr);
  }

/* ABOUT */
  .about-section{
    flex-direction:column;
  }

/* TESTIMONIAL */
  .testimonial-slider{
    max-width:90%;
  }
  .contact-section{
    flex-direction:column;
    gap:30px;
  }
}


/* ===== TABLET (768px ↓) ===== */
@media(max-width:768px){
/* OVERLAY (BACKGROUND DARK) */
 .menu-overlay{
   position:fixed;
   top:0;
   left:0;
   width:100%;
   height:100%;
   background:rgba(0,0,0,0.6);
   backdrop-filter: blur(5px);
   opacity:0;
   visibility:hidden;
   transition:0.4s ease;
   z-index:999;
 }

/* SHOW OVERLAY */
 .menu-overlay.active{
   opacity:1;
   visibility:visible;
 }

/* FULL SCREEN MENU */
 .hero-nav{
   position:fixed;
   top:0;
   right:-100%;
   width:100%;
   height:100vh;
   background:#632801;
   flex-direction:column;
   padding:80px 25px;
   transition:0.5s ease;
  z-index:1000;
 }

/* ACTIVE MENU */
 .hero-nav.active{
   right:0;
 }

/* MENU LINKS ANIMATION */
 .hero-nav a{
   opacity:0;
   transform:translateX(30px);
   transition:0.4s ease;
 }

/* SHOW LINKS ONE BY ONE */
 .hero-nav.active a{
   opacity:1;
   transform:translateX(0);
 }

/* STAGGER EFFECT */
 .hero-nav.active a:nth-child(1){ transition-delay:0.1s; }
 .hero-nav.active a:nth-child(2){ transition-delay:0.2s; }
 .hero-nav.active a:nth-child(3){ transition-delay:0.3s; }
 .hero-nav.active a:nth-child(4){ transition-delay:0.4s; }
 .hero-nav.active a:nth-child(5){ transition-delay:0.5s; }
 .hero-nav.active a:nth-child(6){ transition-delay:0.6s; }

/* CLOSE BUTTON */
 .close-menu{
   position:absolute;
   top:20px;
   right:20px;
   font-size:28px;
   color:#fff;
   cursor:pointer;
 }

/* BODY LOCK */
 .no-scroll{
   overflow:hidden;
 }

  .hero-logo{
    height:180px;
    top:-150px;
  }

/* TOP BAR */
  .hero-top{
    padding:0 20px;
  }

  .hero-social{
    font-size:16px;
    gap:10px;
  }

  .hero-booking{
    display:none; 
  }

  .hero.scrolled .hero-nav{
    position:fixed;
    right:-100%;   
    top:0;
  }

   .hero.scrolled .hero-nav.active{
    right:0;      
  }

/* NAVBAR MOBILE */
  .menu-toggle{
    display:block;
    position:fixed;
    right:20px;
    top:20px;
    z-index:10001;
    font-size:26px;
    color:white;
    z-index:10001;
  }

/* NAV → MOBILE MENU */
  .hero-nav{
    position:fixed;
    top:0;
    right:-100%;
    width:80%;
    height:100vh;
    background:#632801;
    flex-direction:column;
    align-items:flex-start;
    display:flex;
    justify-content:flex-start;
    gap:15px;
    
    transition:0.4s ease;
    z-index:9999;
    padding:60px 20px 20px;

    overflow-y: auto;
    
    left:auto !important;
    transform:none !important;
  }

/* SHOW MENU */
  .hero-nav.active{
    right:0;
  }

  .hero-nav::before{
   content:"";
   position:absolute;
   top:0;
   left:0;
   width:100%;
   height:100%;
   background:rgba(0,0,0,0.4);
   z-index:-1;
  }

  .hero-nav a{
   color:#fff;
   padding:8px 0;
   border:none;
   margin: 0;
   font-size: 18px;
   width:100%;
   text-align:left;
   line-height:1.2;
   border-bottom:1px solid rgba(255,255,255,0.1); 
  }

 .hero-nav a:last-of-type{
   margin-bottom:20px;  
 }

 .mobile-extra{
   width:100%;
    margin-top:10px;
    padding:15px;
    background:#7a3b12;
    border-radius:10px;
  }

 .mobile-extra h3{
   color:#fff;
   font-size:20px;
   margin:10px 0 10px;
 }

 .mobile-social{
   display:flex;
   gap:15x;
   margin-top:10px;
 }

 .mobile-social a{
   color:white;
   text-decoration:none;
 }

 .mobile-social a:visited{
   color:white;
 }

 .mobile-social a:hover{
   color:#ffcc00;
 }

 .mobile-social i{
   color:#fff;
   font-size:16px;
   cursor:pointer;
 }

 .mobile-contact p{
   color:#fff;
   font-size:14px;
   margin-top:320px;
   line-height:initial;
  
   gap:8px;
   align-items:flex-start;
 }

 .mobile-contact i{
   color:#ffcc00;
   margin-top:127px;
 }

.mobile-contact a{
   color:#fff;
   text-decoration:none;
   margin-top:120px;
 }

 .mobile-contact a:hover{
   color:#ffcc00;
 }

/* STOP BACKGROUND SCROLL */
 .no-scroll{
   overflow: hidden;
   height: 100vh;
 }

/* ACTIVE MENU */
 .hero-nav.active{
   right:0;
 }

/* NAV LINKS STYLE */
/* LOGO CENTER */
 .hero-logo{
  top:-180px;
  height:250px;
 }

/* REMOVE ABSOLUTE NAV  */
 .hero-nav{
   top:0;
 }

/* HERO TEXT */
 .hero-center h2{
   top:180px;
   font-size:24px;
   width:90%;
  text-align:center;
  line-height:1.4;
 }

.hero-center p{
    top:250px;
    font-size:15px;
    text-align:center;
  }

  /* SERVICES */
  .services-container{
    grid-template-columns:repeat(2,1fr);
    gap:20px;
  }

  .service-box i{
    font-size:24px;
    padding:12px;
  }

  .service-box h3{
    font-size:18px;
  }

  .service-box p{
    font-size:13px;
  }

  /* EVENTS */
  .events-grid{
    grid-template-columns:1fr;
  }

  /* GALLERY */
  .gallery{
    grid-template-columns:repeat(2,1fr);
  }

 .lightbox-close{
    font-size:28px;
    top:15px;
    right:20px;
  }

  /* TESTIMONIAL */
  .text{
    font-size:16px;
    max-height:100px;
  }

  .contact-form-section{
    flex-direction:column;
  }

  .form-row{
    flex-direction:column;
  }

  .contact-left img{
    height:250px;
  }

  .contact-right{
    padding:30px 20px;
  }

  .about-section{
    flex-direction:column;
  }

  .map-box iframe{
    width:100%;
  }
/* ===== MOBILE CONTACT ===== */

  .contact-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    font-size:14px;
    line-height:1.5;
  }

/* ICON FIX */
  .contact-item i{
    font-size:16px;
    margin-top:3px;
    flex-shrink:0;   
  }

/* TEXT WRAP */
  .contact-item a{
    word-break:break-word;   
  }

/* EMAIL BELOW PHONE */
  .contact-item.email{
    margin-top:1px;
  }

/* PHONE LINKS */
  .contact-item.phone a{
    display:inline-block;
    margin-right:6px;
  }
}

:target{
  animation: highlight 1s ease;
}

@keyframes highlight{
  from{ background:#fff3cd; }
  to{ background:transparent; }
}

/* ===== HIDE MOBILE CONTENT IN DESKTOP ===== */
@media(min-width:769px){
  .mobile-extra{
    display:none;
  }

  .menu-toggle{
    display:none;
  }

   .hero.scrolled .hero-nav{
    position:static;
    transform:none;
    display:flex;
    gap:25px;
  }
}

/* ===== MOBILE (480px ↓) ===== */
@media(max-width:480px){

  /* LOGO */
   .hero-logo{
    top:-130px;
    height:220px;
  }

  .hero-center h2{
    font-size:20px;
    top:180px;
    width:90%;
    line-height:1.4;
  }

  .hero-center p{
    font-size:14px;
    top:250px;
  }

  .hero-nav a{
    font-size:16px;
  }

  /* HERO CONTENT */
  .hero-content h2{
    font-size:22px;
  }

  .hero-content li{
    font-size:14px;
  }

  /* SERVICES */
  .services{
    padding:60px 15px;
  }

  .services-container{
    grid-template-columns:1fr;
    gap:25px;
  }

  .service-box{
    padding:15px;
  }

  .service-box i{
    font-size:22px;
    padding:10px;
    width:100%;
    text-align:center;
  }

  .service-box h3{
    font-size:16px;
    text-align:center;
  }

  .service-box p{
    font-size:12px;
    text-align:center;
  }

  /* EVENTS */
  .events-grid{
    grid-template-columns:1fr;
  }

  /* GALLERY */
  .gallery{
    grid-template-columns:repeat(2,1fr);
  }

  /* TESTIMONIAL */
  .text{
    font-size:14px;
    max-height:90px;
  }

  /* FLOAT BUTTONS */
  .whatsapp,
  .call-btn{
    width:50px;
    height:50px;
    font-size:20px;
  }

  #scrollTopBtn{
    width:45px;
    height:45px;
  }
}

@media(max-width:360px){

  /* LOGO */
  .hero-logo{
    height:170px;
    top:-100px;
  }

  /* HEADING */
  .hero-center h2{
    top:150px;
    font-size:18px;
    width:92%;
    line-height:1.4;
  }

  /* TEXT */
  .hero-center p{
    top:200px;
    font-size:13px;
  }

  /* NAV MENU LINKS */
  .hero-nav a{
    font-size:15px;
  }

}