/*Write Css*/



/* ===== NAVBAR FIX ===== */
.header-style-01 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 10000 !important; 
    background: transparent !important;
}
.headerwrapper header.header-style-01{
    /*background: #8490C3 !important;*/

}
  
.agency_topbar{
    display: none;
}
  
.header-style-01 .navbar {
    background: transparent !important;
}

/* Navbar text */
.header-style-01 .navbar-nav li a {
    /*color: #ffffff !important;*/
    font-weight: 500 !important;
}

/* Navbar button */
.header-style-01 .navbar-right-btn a {
    background: #f7a600 !important;
    color: #fff !important;
    border-radius: 10px !important;
}

/* ===== BANNER FIX ===== */
.common-banner {
    position: relative !important;
    padding-top: 0 !important; /* navbar space */
    z-index: 1 !important;
}

/* Banner image */
.common-banner .banner-image img {
    width: 100% !important;
    height: 100vh !important;
    object-fit: cover !important;
}

/* Overlay ONLY on banner (navbar not covered) */
.common-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    /*background: rgb(132 144 195 / 65%)!important;*/
    z-index: 1 !important;
}

/* Banner text above overlay */
.slider-contents,
.slider-contentswrap {
    position: relative !important;
    z-index: 2 !important;
}

/* Change navbar color from transparent to blue */
/* these codes are not working  */
/* 1. Define the Background Color Animation */
@keyframes navBackgroundChange {
    from {
        background-color: transparent !important;
    }
    to {
        background-color: blue !important;
    }
}

/* 2. Define the Text/Arrow Color Animation */
@keyframes navTextChange {
    from {
        color: blue !important;
    }
    to {
        color: white !important;
    }
}

/* 3. Apply to the Navbar Container (Image 3) */
.header-style-01 .navbar-area {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;

    /* Link animation to the scroll progress */
    animation: navBackgroundChange linear both;
    animation-timeline: scroll();
    animation-range: 0px 100px; 
}

/* 4. Apply to the Link/Text (Image 3 - class="menuArrow") */
.navbar-area .menuArrow {
    /* Link color animation to the scroll progress */
    animation: navTextChange linear both;
    animation-timeline: scroll();
    animation-range: 0px 100px;
    
    /* Optional: ensures link takes up space correctly */
    display: inline-block;
    text-decoration: none;
}

/* Above codes are not working  */

/* */
.headerwrapper {
    position: relative !important;
    width: 100% !important;
    z-index: 999 !important;
}


/* Make header sticky */
.headerwrapper header.header-style-01 {
    position: fixed !important;   
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 10000 !important;    
    /*background-color: #6B7DCA !important; */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important; 
}

/* Keep logo on the left */
.headerwrapper .responsive-mobile-menu .logo-wrapper {
    position: relative !important; 
    left: 0 !important;
    transform: none !important;   
    text-align: left !important;
    z-index: 10001 !important;
    padding: 0 !important;
}

/* Logo image */
.headerwrapper .logo-wrapper img {
    max-height: 60px !important;
    width: auto !important;
}

/* Push banner down so it doesn’t overlap navbar */
.services-thumb.agro .parallax-contentservice {
    padding-top: 80px !important; /* adjust based on navbar height */
}

/* Optional: shrink logo on scroll */
.headerwrapper.sticky-shrink .logo-wrapper img {
    max-height: 50px !important;
    transition: max-height 0.3s ease;
}



/* */
/* ===============================
   NAVBAR OVER BANNER (TRANSPARENT)
//* 1. Banner ko main container reset garne */
.common-banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    line-height: 0 !important; 
}

/* 2. Bootstrap row and slider  margin removing */
.common-banner .row {
    margin: 0 !important;
    padding: 0 !important;
}

/*.slider-active, */
/*.slick-list, */
/*.slick-track, */
.slider-items, 
.banner-image {
    height: 100vh !important; 
    margin-bottom: 0 !important;
}

/* 3. */
.banner-image img {
    height: 100vh !important;
    width: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 4. Navbar overlay */
.header-style-01 {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    background: transparent !important;
}
/*##### */
/* 1. Animation  */
@keyframes navColorChange {
    from {
        background-color: transparent !important;
        backdrop-filter: blur(0px);
    }
    to {
        background-color: #002147 !important; /* Navy Blue Color */
        backdrop-filter: blur(10px); 
        box-shadow: 0 2px 10px rgba(0,0,0,0.3);
    }
}

/* 2. Animation in Header */
.header-style-01 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 10000 !important;
    
    /* Scroll animation logic */
    animation: navColorChange linear both;
    animation-timeline: scroll();
    animation-range: 0px 150px;
}


.header-style-01 .navbar-nav li a {
    animation: textColorChange linear both;
    animation-timeline: scroll();
    animation-range: 0px 100px;
}

@keyframes textColorChange {
    from { color: inherit; }
    to { color: #ffffff !important; }
}


/* ## aboutus of homepage ###*/
.section-tittle .tittle {
    font-size: 44px !important;
}


/*  ### how can we help */

.agency_section__title .title { 
        text-align: center !important;
}

.agency_section__title p {
      text-align: center !important;
      color: #032254 !important;
}




.agency_work_area {
    background-color: #e8f2ff !important;
}

.agency_work_area .first-bg,
.agency_work_area .last-bg {
    display: none !important; /* images hide */
}

/* services section */

.agency_section__title h4 {
    display: none !important;
}
.agency_work_area .agency_work .agency_work__contents {
    height: 250px !important;
}

.agency_section__title .title {
    font-size: 44px !important;
}






/* */
/* Our Reach B Section */
.services-thumb.agro .parallax-contentservice {
    position: relative !important;
    padding: 60px 0 !important; /* top & bottom spacing */
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Optional dark overlay to make text readable */
.services-thumb.agro .parallax-contentservice::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.5) !important; /* adjust transparency */
    z-index: 1 !important;
}

/* Text container above overlay */
.services-thumb.agro .container {
    position: relative !important;
    z-index: 2 !important;
}

/*### Section title #### */
.services-thumb.agro .section-tittle h2.tittle {
    color: #032254  !important; /* white text */
    font-size: 44px !important;
    margin-bottom: 10px !important;
}

.services-thumb.agro .section-tittle p {
    color: #032254 !important;
    font-size: 18px !important;
}

/* Box icons */
.services-thumb.agro .box-icon-modern {
    text-align: center !important;
    margin-bottom: 30px !important;
}

.services-thumb.agro .box-icon-modern img {
    max-width: 80px !important;
    margin-bottom: 15px !important;
}

.services-thumb.agro .box-icon-modern-title {
    color: #032254  !important;
    font-size: 18px !important;
    margin-bottom: 5px !important;
}

.services-thumb.agro .box-icon-modern-text {
    color: #032254  !important;
    font-size: 14px !important;
}

.services-thumb.agro .parallax-contentservice::before {
    background: white !important;
    color: #032254 !important;
}

/* #####Trusted by thousand section ####*/
.partners-agni .partners-title .sub-title {
    display: none !important;
}

/* ###Removing gap of trusted section ###*/

./* Remove bottom gap of Partners section */
.partners-agni .global-slick-init,
.partners-agni .slick-list,
.partners-agni .slick-track,
.partners-agni .slick-slide {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
}

.partners-agni .slick-slide img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}
/* ###Remove all gaps under the slider ####*/
.partners-agni {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.partners-agni .global-slick-init,
.partners-agni .slick-list,
.partners-agni .slick-track {
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
}

.partners-agni .slick-slide {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.partners-agni .slick-slide img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}
.partners-agni .partners-title h2 {
    color: #032254 !important;
}
.section-tittle h2,
.section-tittle p {
    margin-bottom: 30px !important;
}


.partners-agni .partners-title h2 {
    font-size: 44px !important;
}

/* ###blog section of homepage ### */

.construction_sectionTitle__two .title {
    font-size: 44px !important;
}
/* */



/* navbar header background */

/* aboutus section */
.link-lists .listItem span {
    font-weight: bold !important;
}
.agency_and_newspaper_class_condition {
    padding: 120px 0 50px !important;
}
.wedding_sectionTitle .title {
    font-size: 44px !important;
}



/* Mobile Responsive */
@media (max-width: 576px) {

  /* ===== HEADER / NAVBAR ===== */
  .header-style-01 {
    padding: 10px 0 !important;
  }

  .logo-wrapper img {
    max-height: 42px !important;
  }

  .navbar-nav {
    text-align: center !important;
  }

  .navbar-nav li {
    padding: 6px 0 !important;
  }

  .navbar-nav li a {
    font-size: 14px !important;
  }

  .navbar-right-content {
    display: none !important;
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }

  

  /* ===== BANNER ===== */
  .common-banner {
    height: auto !important;
    overflow: hidden !important;
    position: relative !important;
  }
  .banner-image,
  .banner-image img {
    height: 100% !important;
    width: 100% !important;
  }

  .banner-image img {
    height: 65vh !important;
    object-fit: cover !important;
  }

  .common-banner .slider-contents {
    padding: 60px 15px 0 !important;
  }

  .common-banner .slider-contents h2 {
    font-size: 26px !important;
    margin: 1rem 0 !important;
  }

  .common-banner .slider-contents p {
    font-size: 16px !important;
  }

  .common-banner .slider-contents img.mouse-animation {
    display: none !important;
  }

  /* ===== ABOUT SECTION ===== */
  .aboutArea .row {
    flex-direction: column !important;
  }

  .aboutArea .about-caption h1 {
    font-size: 28px !important;
    text-align: center !important;
  }

  .aboutArea .about-caption p {
    font-size: 16px !important;
    text-align: center !important;
  }

  .aboutArea .about-thumbnails {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  /* ===== SERVICES ===== */
  .agency_section__title h2 {
    font-size: 28px !important;
  }
  .agency_section__title .title{
      font-size: 28px !important;
  }

  .agency_work_area .agency_work__thumb img {
    height: 200px !important;
  }

  .agency_work_area .agency_work__contents h4 {
    font-size: 16px !important;
  }

  .agency_work_area .agency_work__contents p {
    font-size: 16px !important;
  }
  /* Our Reach */
  .services-thumb.agro .section-tittle h2.tittle {
      font-size: 28px !important;
  }
  .services-thumb.agro .section-tittle p {
      font-size: 16px !important;
  }
  
  /* Trusted by */
  .partners-agni .partners-title h2 {
      font-size: 28px !important;
  }
  .construction_sectionTitle__two .title {
      font-size: 28px !important;
  }
  /* Aboutus page */
  .link-lists .listItem span {
      font-size: 11px !important;
  }
  
  .wedding_sectionTitle .title {
      font-size: 28px !important;
  }
  .wedding_make__quality__title {
      font-size: 22px !important;
  }
  /* Default: hide contact on mobile */


  /* Default hide */
  .navbar-right-content {
    display: none !important;
  }

  /* 3-dot click after */
  .navbar-right-content.show-nav-content {
    display: block !important;
    position: absolute !important;
    top: 110% !important;   
    right: 0 !important;
    width: 140px !important;
    background: #f5f5f5 !important;
    padding: 8px !important;
    border-radius: 4px !important;
    z-index: 9999 !important;
  }

  .navbar-right-btn a {
    display: block !important;
    color: #fff !important;
    text-align: center !important;
  }
  .aboutArea .about-caption .about-thumbnails {
    display: flex !important;
    flex-wrap: wrap !important; /* next row ma move garna */
    gap: 20px !important;
  }

  .aboutArea .about-caption .about-thumbnails > * {
    flex: 0 0 calc(50% - 10px) !important; /* 2 per row */
    box-sizing: border-box !important;
  }

}