/* Css For Quill */

/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header/style-one/style-two
5. Main Slider/style-one/style-two
6. Intro Section
7. Welcome Section
9. Cta Section
8. Research Fields
10. Testimonial Section
11. Researches Section
12. Team Section
14. Video
15. Fact Counter
16. News Section
19. Clients Section
20. Main Footer
21. Footer Bottom
22. Research Style Two
23. Innovative Solution
24. Discover Section
25. Testimonial Section
26. Chooseus Section
27. News Style Two
28. Page Title
29. Research Page Section
30. Research Details
31. Professor Page Section
32. Professor Details
33. About Section
34. Error Section
35. Blog Page Section
36. Blog Details
37. Blog Sidebar
38. Contact Section
39. Google Map


**********************************************/



/*** 

====================================================================
  Reset
====================================================================

 ***/
* {
  margin:0px;
  padding:0px;
  border:none;
  outline:none;
}


/*** 

====================================================================
  Global Settings
====================================================================

 ***/


:root{
  --theme-color: #FC8A29;
  --secondary-color: #1D1D1D;
  --text-color: #515151;
  --title-color: #1D1D1D;
  --text-font: "Plus Jakarta Sans", sans-serif;
  --title-font: "Plus Jakarta Sans", sans-serif;
}



body {
  font-size:17px;
  color: var(--text-color);
  line-height:31px;
  font-weight:400;
  background:#ffffff;
  font-family: var(--text-font);
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center top;
  -webkit-font-smoothing: antialiased;
}

  @media (min-width:1200px) {
  .container {
    max-width: 1200px;
    padding: 0px 15px;
  }
}

.large-container{
  max-width: 1705px;
  padding: 0px 15px;
  margin: 0 auto;
}

.container-fluid{
  padding: 0px;
}

.auto-container{
  position:static;
  max-width:1320px;
  padding:0px 15px;
  margin:0 auto;
}

.small-container{
  max-width:680px;
  margin:0 auto;
}

.boxed_wrapper{
  position: relative;
  margin: 0 auto;
  overflow: hidden !important;
  width: 100%;
  min-width: 300px;
}


a{
  text-decoration:none;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

a:hover{
  text-decoration:none;
  outline:none;
}

input,button,select,textarea{
  font-family: var(--text-font);
  font-weight: 400;
  font-size: 18px;
  background: transparent;
}

::-webkit-input-placeholder {
  color: inherit;
}

::-moz-input-placeholder {
  color: inherit;
}

::-ms-input-placeholder {
  color: inherit;
}

ul,li{
  list-style:none;
  padding:0px;
  margin:0px; 
}

input{
  transition: all 500ms ease;
}

button:focus,
input:focus,
textarea:focus{
  outline: none;
  box-shadow: none;
  transition: all 500ms ease;
}

p{
  position: relative;
  font-family: var(--text-font);
  color: var(--text-color);
  font-weight: 400;
  margin: 0px;
}

h1,h2,h3,h4,h5,h6{
  position:relative;
  font-family: var(--title-font);
  font-weight: 700;
  color: var(--title-color);
  margin: 0px;
}


/* Preloader */

.handle-preloader {
  align-items: center;
  -webkit-align-items: center;
  display: flex;
  display: -ms-flexbox;
  height: 100%;
  justify-content: center;
  -webkit-justify-content: center;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 9999999;
  background: #fff;
}

.handle-preloader .animation-preloader {
  position: absolute;
  z-index: 100;
}

.handle-preloader .animation-preloader .spinner{
  animation: spinner 1s infinite linear;
  border-radius: 50%;
  height: 150px;
  margin: 0 auto 45px auto;
  width: 150px;
}

.handle-preloader .animation-preloader .txt-loading {
  text-align: center;
  user-select: none;
}

.handle-preloader .animation-preloader .txt-loading .letters-loading:before{
  animation: letters-loading 4s infinite;
  content: attr(data-text-preloader);
  left: 0;
  opacity: 0;
  top:0;
  position: absolute;
}

.handle-preloader .animation-preloader .txt-loading .letters-loading{
  font-family: var(--title-font);
  font-weight: 500;
  letter-spacing: 15px;
  display: inline-block;
  position: relative;
  font-size: 70px;
  line-height: 70px;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: rgba(0, 0, 0, 0.30);
}

.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {animation-delay: 0.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {animation-delay: 0.4s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {animation-delay: 0.6s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {animation-delay: 0.8s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before { animation-delay: 1s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before { animation-delay: 1.2s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before { animation-delay: 1.4s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(9):before { animation-delay: 1.6s;}
.handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(10):before { animation-delay: 1.8s;}
.handle-preloader .loader-section {
  background-color: #000;
  height: 100%;
  position: fixed;
  top: 0;
  width: calc(50% + 1px);
}

.preloader .loaded .animation-preloader {
  opacity: 0;
  transition: 0.3s ease-out;
}

.handle-preloader .animation-preloader .txt-loading .letters-loading:before{
  color: #000;
}

.handle-preloader .animation-preloader .spinner{
  border: 3px solid #000;
  border-top-color: rgba(0, 0, 0, 0.3); 
}

/* Animación del preloader */
@keyframes spinner {
  to {
    transform: rotateZ(360deg);
  }
}
@keyframes letters-loading {
  0%,
  75%,
  100% {
    opacity: 0;
    transform: rotateY(-90deg);
  }

  25%,
  50% {
    opacity: 1;
    transform: rotateY(0deg);
  }
}

@media screen and (max-width: 767px) {
  .handle-preloader .animation-preloader .spinner {
    height: 8em;
    width: 8em;
  }
}
@media screen and (max-width: 500px) {
  .handle-preloader .animation-preloader .spinner {
    height: 7em;
    width: 7em;
  }
  .handle-preloader .animation-preloader .txt-loading .letters-loading {font-size: 30px; letter-spacing: 5px;}
}


.centred{
  text-align: center;
}

.pull-left{
  float: left;
}

.pull-right{
  float: right;
}


figure{
  margin: 0px;
}

img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  transition-delay: .1s;
  transition-timing-function: ease-in-out;
  transition-duration: .7s;
  transition-property: all;
}

.row{
  --bs-gutter-x: 30px;
}


/** button **/


.theme-btn{
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: middle;
  font-size: 18px;
  line-height: 30px;
  font-weight: 700;
  font-family: var(--title-font);
  color: #fff !important;
  text-align: center;
  border-radius: 12px;
  padding: 15px 36px;
  text-transform: capitalize;
  z-index: 1;
  transition: all 0.5s ease-in-out 0.0s;
}

.theme-btn.btn-one{
  background: var(--theme-color);
}

.theme-btn.btn-one:hover{

}

.theme-btn:before{
  position: absolute;
  content: '';
  width: 0%;
  height: 100%;
  left: 0px;
  top: 0px;
  transform: translateX(0);
  transform-origin: left center;
  z-index: -1;
  background: var(--secondary-color);
  transition: all 500ms ease;
}

.theme-btn:after{
  position: absolute;
  content: '';
  width: 0%;
  height: 100%;
  right: 0px;
  top: 0px;
  transform: translateX(0);
  transform-origin: right center;
  z-index: -1;
  background: var(--secondary-color);
  transition: all 500ms ease;
}

.theme-btn:hover:before,
.theme-btn:hover:after{
  transform: translateX(1);
  width: 51%;
}

.theme-btn.btn-two{
  border: 1px solid #E5E5E5;
  color: var(--text-color) !important;
  padding: 9px 30px;
}

.theme-btn.btn-two:hover{
  color: #fff !important;
}


.parallax-bg{
  position: absolute;
  left: 0px;
  top: -30%;
  width: 100%;
  height: calc(100% + 30%);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}


/** styled-pagination */

.pagination{
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
}

.pagination li{
  position: relative;
  display: inline-block;
}

.pagination li a{
  position: relative;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #0F0F0F;
  height: 42px;
  width: 40px;
  line-height: 42px;
  text-align: center;
  border-radius: 6px;
  border: 1px solid #D9D9D9;
  z-index: 1;
  transition: all 500ms ease;
}

.pagination li a:hover,
.pagination li a.current{
  color: #fff;
  background: #9680EF;
  border-color: #9680EF;
}

.sec-pad{
  padding: 142px 0px 150px 0px;
}

.mr-0{
  margin: 0px !important;
}

/** scroll-to-top **/

.scroll-to-top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  height: 50px;
  width: 50px;
  cursor: pointer;
  display: block;
  box-shadow: inset 0 0 0 2px rgba(0,46,65,0.2);
  border-radius: 50%;
  z-index: 90000;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(15px);
  -ms-transform: translateY(15px);
  transform: translateY(15px);
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

.scroll-to-top.scroll-top-active {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0)
}

.scroll-to-top::after {
  position: absolute;
  content: "\e929";
  font-family: 'icomoon';
  text-align: center;
  line-height: 50px;
  font-size: 14px;
  color: var(--theme-color);
  left: 0;
  top: 0;
  height: 50px;
  width: 50px;
  cursor: pointer;
  display: block;
  z-index: 2;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear
}

.scroll-to-top:hover::after {
  
}

.scroll-to-top:hover::before {
  opacity: 1
}

.scroll-to-top .scroll-top-inner path {
  stroke-width: 4;
  fill: transparent;
  box-sizing: border-box;
  stroke: var(--theme-color);
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}



@-webkit-keyframes ripple {
  70% {
    -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes ripple {
  70% {
    -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
            box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}



.sec-title{
  position: relative;
  display: block;
}

.sec-title h2{
  position: relative;
  display: block;
  font-size: 48px;
  line-height: 60px;
  text-transform: capitalize;
}

.sec-title.light h2{
  color: #fff;
}





/*** 

====================================================================
                        Home-Page-One
====================================================================

***/


/** main-header **/

.main-header{
  position:relative;
  left:0px;
  top:0px;
  right: 0px;
  z-index:999;
  width:100%;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

.sticky-header{
  position:fixed;
  opacity:0;
  visibility:hidden;
  left:0px;
  top:0px;
  width:100%;
  z-index:0;
  background-color: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.10);
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

.fixed-header .sticky-header{
  z-index:999;
  opacity:1;
  visibility:visible;
  -ms-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -op-animation-name: fadeInDown;
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -ms-animation-duration: 500ms;
  -moz-animation-duration: 500ms;
  -op-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -ms-animation-timing-function: linear;
  -moz-animation-timing-function: linear;
  -op-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -ms-animation-iteration-count: 1;
  -moz-animation-iteration-count: 1;
  -op-animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.owl-nav button{
  background: transparent;
}

.float-bob-y {
  animation-name: float-bob-y;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: float-bob-y;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: float-bob-y;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob-y;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob-y;
  -o-animation-duration: 2s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.float-bob-x{
  animation-name: float-bob-x;
  animation-duration: 15s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: float-bob-x;
  -webkit-animation-duration: 15s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: float-bob-x;
  -moz-animation-duration: 15s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob-x;
  -ms-animation-duration: 15s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob-x;
  -o-animation-duration: 15s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}


/** rtl-switcher **/

.demo-rtl{
  position: fixed;
  top: 390px;
  left: 10px;
  z-index: 9999;
}

button.rtl{
  background: var(--theme-color);
  display: block;
  text-indent: inherit;
  font-size: 12px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-weight: 700;
  margin: 0px;
  color: #fff !important;
  border-radius: 50%;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);
  transition: all 500ms ease;
}

.demo-ltr{
  position: fixed;
  top: 390px;
  left: auto;
  right: 10px;
  z-index: 9999;
}

button.ltr {
  background: var(--theme-color);
  display: block;
  text-indent: inherit;
  font-size: 12px;
  font-weight: 700;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  margin: 0px;
  color: #fff !important;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 1.0);
  transition: all 500ms ease;
}

.boxed_wrapper.ltr .demo-rtl{
  display: block;
}

.boxed_wrapper.ltr .demo-ltr{
  display: none;
}

.boxed_wrapper.rtl .demo-rtl{
  display: none;
}

.boxed_wrapper.rtl .demo-ltr{
  display: block;
}

.accordion-box .block .acc-content {
  position: relative;
  display: none;
}

.accordion-box .block .acc-content.current {
  display: block;
}

.tabs-box .tab{
  position:relative;
  display:none;
  transition: all 900ms ease;
  -moz-transition: all 900ms ease;
  -webkit-transition: all 900ms ease;
  -ms-transition: all 900ms ease;
  -o-transition: all 900ms ease;
}

.tabs-box .tab.active-tab{
  display:block;  
}

.tabs-box .tab{
  transform:scale(0.9,0.9) translateY(0px);
}

.tabs-box .tab.active-tab{
  transform:scale(1) translateY(0px);
}

.image-hov-one{
  position: relative;
  display: block;
  overflow: hidden;
}

.image-hov-one::before {
  background: rgba(255, 255, 255, 0.5);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0%;
  height: 100%;
  opacity: 1;
  z-index: 1;
  pointer-events: none;
}

.image-hov-one:hover::before {
  width: 100%;
  opacity: 0;
  -webkit-transition: all 400ms linear;
  transition: all 400ms linear;
}

.image-hov-two{
  position: relative;
  display: block;
  overflow: hidden;
}

.image-hov-two::before {
  background: rgba(255, 255, 255, 0.5);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1000%;
  height: 0%;
  opacity: 1;
  z-index: 1;
  pointer-events: none;
}

.image-hov-two:hover::before {
  height: 100%;
  opacity: 0;
  -webkit-transition: all 400ms linear;
  transition: all 400ms linear;
}

/*** chat popup ***/

.chat-popup {
  position: fixed;
  right: -100%;
  bottom: 0px;
  width: 350px;
  z-index: 99999;
  visibility: hidden;
  opacity: 0;
  background: #fff;
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);
  border-radius: 10px;
  transition: all 0.5s ease-in-out 0.1s;
}

.chat-popup.popup-visible {
  right: 0px;
  visibility: visible;
  opacity: 1;
}

.chat-popup .popup-inner{
  position: relative;
  display: block;
  padding: 40px 30px;
  padding-top: 32px;
}

.chat-popup .close-chat{
  position: absolute;
  display: inline-block;
  left: 0px;
  top: -65px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  font-size: 30px;
  color: #fff;
  background: var(--theme-color);
  cursor: pointer;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);
}

.chat-popup .popup-inner p{
  position: relative;
  display: block;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  margin-bottom: 40px;
}

.chat-popup .chat-form .form-group{
  position: relative;
  display: block;
  margin-bottom: 20px;
}

.chat-popup .chat-form .form-group:last-child{
  margin-bottom: 0px;
}

.chat-popup .chat-form .form-group input[type='text'],
.chat-popup .chat-form .form-group input[type='email'],
.chat-popup .chat-form .form-group textarea{
  position: relative;
  display: block;
  width: 100%;
  height: 40px;
  border: 1px solid #e5e5e5;
  border-radius: 5px;
  font-size: 13px;
  color: var(--text-color);
  padding: 10px 20px;
  transition: all 500ms ease;
}

.chat-popup .chat-form .form-group textarea{
  height: 120px;
  resize: none;
}

.chat-popup .chat-form .form-group input:focus,
.chat-popup .chat-form .form-group textarea:focus{
  border-color: var(--theme-color);
}

.chat-popup .chat-form .form-group .theme-btn{
  width: 100%;
}

.chat-icon{
  position: fixed;
  display: inline-block;
  right: 30px;
  bottom: 100px;
  z-index: 99;
}

.chat-icon button{
  position: relative;
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 26px;
  color: #fff;
  border-radius: 50%;
  background: var(--theme-color);
}

.list-style-one li{
  position: relative;
  display: block;
  font-size: 17px;
  line-height: 31px;
  color: var(--title-color);
  padding-left: 40px;
  margin-bottom: 13px;
}

.list-style-one li:before{
  position: absolute;
  content: '\e901';
  font-family: 'icomoon';
  font-size: 22px;
  left: 0px;
  top: 1px;
  color: var(--theme-color);
}

.owl-dots-none .owl-dots,
.owl-nav-none .owl-nav{
  display: none !important;
}

.theme-btn.radius_50{
  border-radius: 50px;
}

.bg-color-1{
  background-color: #F8F8F8;
}

.nav-style-one .owl-nav button{
  position: relative;
  display: inline-block;
  font-size: 35px;
  color: var(--title-color);
  cursor: pointer;
  transition: all 500ms ease;
}

.nav-style-one .owl-nav button:hover{
  color: var(--theme-color);
}

.nav-style-one .owl-nav button.owl-prev{
  margin-right: 40px;
}

.sec-title.light p{
  color: #fff;
}

.saas-home .sec-title h2 span{
  color: #654DFF;
}

.bg-color-2{
  background: #F8F7FF !important;
}

.sec-title h2 span{
  color: var(--theme-color);
}

.main-footer .contact-widget .widget-content h2.theme-color{
  color: var(--theme-color);
}

.white_bg{
  background: #ffffff !important;
}

.pb_225{
  padding-bottom: 225px;
}

.bg-color-3{
  background-color: #F9F9FF;
}

.main-header.blog-header .theme-btn.btn-one{
  background: #9680EF;
}

/*what we offer*/
.list-style-one li {
    margin-bottom: 20px; /* Adds spacing between list items */
    line-height: 1.8; /* Makes text more readable */
    text-align: justify; /* Aligns text neatly */
    font-size: 16px; /* Slightly larger for readability */
}

    .list-style-one li strong {
        color: #fc8a29; /* Highlights the key part in orange */
    }

/** Logo and menu bar in mobile 
@media only screen and (max-width: 767px) {
    .main-header .header-lower .outer-box {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 10px 20px !important;
    }

    /* Adjusted logo size — no shrinking 
    .main-header .logo-box img {
        width: auto !important;
        max-width: 180 !important;
        height: auto !important;
    }

    /* Proper menu toggle placement 
    .menu-area .mobile-nav-toggler {
        display: block !important;
        position: relative !important;
        z-index: 10 !important;
        margin-left: auto !important;
        font-size: 24px !important;
    }

    /* Hide CTA button if present 
    .main-header .btn-box {
        display: none !important;
    }
}
/** Logo and menu bar in mobile **/
@media only screen and (max-width: 767px) {
    .main-header .header-lower .outer-box {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        padding: 10px 20px !important;
        width: 100% !important;
    }

    .main-header .logo-box {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
    }

        /* Fix: Add px unit to max-width */
        .main-header .logo-box img {
            width: auto !important;
            max-width: 220px !important; /* you missed px earlier */
            height: auto !important;
            display: block !important;
        }

    .menu-area {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

        .menu-area .mobile-nav-toggler {
            display: block !important;
            position: relative !important;
            z-index: 10 !important;
            font-size: 24px !important;
            margin-left: 15px !important;
        }

    .main-header .btn-box {
        display: none !important;
    }
}

/* ==============================================
   Always visible header (mobile fix)
   ============================================== */
@media only screen and (max-width: 767px) {
    .main-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 9999 !important;
        background: #ffffff !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    }

    /* Prevent content from hiding behind header */
    body {
        padding-top: 80px !important; /* adjust based on your header height */
    }

    /* Logo and menu layout */
    .main-header .header-lower .outer-box {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 10px 20px !important;
        width: 100% !important;
    }

    .main-header .logo-box img {
        width: auto !important;
        max-width: 220px !important;
        height: auto !important;
        display: block !important;
    }

    .menu-area .mobile-nav-toggler {
        display: block !important;
        position: relative !important;
        z-index: 10 !important;
        font-size: 26px !important;
        margin-left: 15px !important;
    }

    .main-header .btn-box {
        display: none !important;
    }
}

/* ===== Banner full-bleed breakout + centered content ===== */

/* Remove any page-level horizontal padding for the banner area */
.banner-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

    /* Make outer-container break out to full viewport width */
    .banner-section .outer-container {
        width: 100vw !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        margin-left: -50vw !important;
        box-sizing: border-box !important;
        padding: 90px 0 150px 0; /* ★ Professional top & bottom space */
        overflow: visible !important;
    }

    /* Keep the inner auto-container centered for text readability */
    .banner-section .auto-container {
        max-width: 1200px !important;
        width: 100%;
        margin: 0 auto;
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    /* Center the content and improve spacing */
    .banner-section .content-box {
        max-width: 1000px !important;
        margin: 0 auto;
        text-align: center;
    }

        .banner-section .content-box h2 {
            font-size: 48px;
            line-height: 1.25;
            margin-bottom: 40px; /* ★ perfect title spacing */
        }

        .banner-section .content-box p {
            font-size: 25px;
            line-height: 1.6;
            margin-bottom: 60px; /* ★ beautiful spacing below paragraph */
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
        }

/* Responsive tweaks */
@media (max-width: 1200px) {
    .banner-section .auto-container {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .banner-section .content-box h2 {
        font-size: 40px;
    }
}

@media (max-width: 767px) {
    .banner-section .outer-container {
        padding-top: 60px;
        padding-bottom: 100px;
    }

    .banner-section .auto-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .banner-section .content-box h2 {
        font-size: 32px;
    }

    .banner-section .content-box p {
        font-size: 18px;
    }

    .banner-section .image-layer {
        display: none; /* Hide big right-side image on small screens */
    }
}


/* --- HERO HEIGHT REDUCED --- */

.banner-section {
    min-height: 78vh !important; /* reduced from 95vh */
    display: flex !important;
    align-items: center !important;
}

    .banner-section .content-box {
        max-width: 800px !important;
        text-align: center !important;
        margin: 0 auto !important;
        padding-top: 80px !important; /* reduced from 120px */
        padding-bottom: 80px !important; /* reduced from 120px */
    }

        /* spacing between elements */
        .banner-section .content-box h2 {
            font-size: 46px !important;
            margin-bottom: 40px !important; /* spacing reduced slightly */
        }

        .banner-section .content-box p {
            font-size: 25px !important;
            margin-bottom: 50px !important;
        }

/* mobile */
@media (max-width: 768px) {
    .banner-section {
        min-height: 65vh !important; /* mobile-friendly */
    }

        .banner-section .content-box {
            padding-top: 60px !important;
            padding-bottom: 60px !important;
        }

            .banner-section .content-box h2 {
                font-size: 30px !important;
                margin-bottom: 20px !important;
            }

            .banner-section .content-box p {
                font-size: 17px !important;
                margin-bottom: 26px !important;
            }
}

.loader-wrap {
    display: none !important;
}