/* -----------------------------------------------------------------------------

# Base - Genral & Typography

----------------------------------------------------------------------------- */
html {  font-size: 14px;  font-weight: 400;  line-height: 28px;  height: 100%;}

body {  font-family: "Open Sans", sans-serif;  font-weight: 400;  font-size: 1rem;  letter-spacing: 0.1px;  line-height: 1.8;  color: #051922;  overflow-x: hidden;}

body img {  max-width: 100%;}

a {  cursor: pointer;  text-decoration: none;  -webkit-transition: all 0.2s ease-in-out;  -o-transition: all 0.2s ease-in-out;  transition: all 0.2s ease-in-out;}

a:hover {  color: #F28123;  text-decoration: none;}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {  font-family: "Poppins", sans-serif;  font-weight: 700;  margin: 0 0 1.25rem 0;  color: #051922;}

h1:last-child, .h1:last-child,
h2:last-child, .h2:last-child,
h3:last-child, .h3:last-child,
h4:last-child, .h4:last-child,
h5:last-child, .h5:last-child,
h6:last-child, .h6:last-child {  margin: 0;}

h1, .h1 {  font-size: 4rem;  font-weight: 700;  line-height: 4rem;}





@media only screen and (max-width: 767.96px) {  h1, .h1 {   font-size: 3rem;  line-height: 3.25rem;  }}

@media only screen and (max-width: 575.96px) {  h1, .h1 {    font-size: 2.5rem;    line-height: 2.75rem;  }}

h2, .h2 {  font-size: 3rem;  font-weight: 700;  line-height: 3.25rem;}

@media only screen and (max-width: 767.96px) {  h2, .h2 {    font-size: 2.5rem;    line-height: 2.75rem;  }}

@media only screen and (max-width: 575.96px) {  h2, .h2 {    font-size: 2rem;    line-height: 2.25rem;  }}

h3, .h3 {  font-size: 2rem;  font-weight: 700;  line-height: 2.25rem;}

@media only screen and (max-width: 575.96px) {
  h3, .h3 {   font-size: 1.75rem;    line-height: 2rem;  }}

h4, .h4 {  font-size: 1.5rem;  font-weight: 700;  line-height: 1.75rem;}

@media only screen and (max-width: 575.96px) {  h4, .h4 {    font-size: 1.25rem;    line-height: 1.5rem;  }}




h5, .h5 {  font-size: 1.25rem;  font-weight: 700;  line-height: 1.5rem;}

h6, .h6 {  font-size: 1rem;  font-weight: 700;  line-height: 1.5rem;}

p {  font-family: "Open Sans", sans-serif;  font-weight: 400;  font-size: 1rem;  letter-spacing: 0.1px;  line-height: 1.8;  color: #051922;  margin: 0 0 1.25rem 0;}

p:last-child {  margin: 0;}



/* -----------------------------------------------------------------------------

# All Common Styles

----------------------------------------------------------------------------- */

.loader {  bottom: 0;  height: 100%;  left: 0;  position: fixed;  right: 0;  top: 0;  width: 100%;  z-index: 1111; background: #fff;  overflow-x: hidden;}

.loader-inner {  position: absolute;  left: 50%;  top: 50%;  -webkit-transform: translate(-50%, -50%);  -ms-transform: translate(-50%, -50%);  -o-transform: translate(-50%, -50%);  transform: translate(-50%, -50%);  height: 50px;  width: 50px;}

.circle {  width: 8vmax;  height: 8vmax;  border-right: 4px solid #000; border-radius: 50%;  -webkit-animation: spinRight 800ms linear infinite;  animation: spinRight 800ms linear infinite;}

.circle:before {  content: '';  width: 6vmax;  height: 6vmax; display: block;  position: absolute; top: calc(50% - 3vmax);  left: calc(50% - 3vmax);  border-left: 3px solid #F28123;  border-radius: 100%;  -webkit-animation: spinLeft 800ms linear infinite;  animation: spinLeft 800ms linear infinite;}

.circle:after {  content: '';  width: 6vmax;  height: 6vmax;  display: block;  position: absolute;  top: calc(50% - 3vmax);  left: calc(50% - 3vmax);  border-left: 3px solid #F28123;  border-radius: 100%;  -webkit-animation: spinLeft 800ms linear infinite;  animation: spinLeft 800ms linear infinite;  width: 4vmax;  height: 4vmax;  top: calc(50% - 2vmax); left: calc(50% - 2vmax);  border: 0;  border-right: 2px solid #000;  -webkit-animation: none;  animation: none;}




@-webkit-keyframes spinLeft {  from {    -webkit-transform: rotate(0deg);    transform: rotate(0deg);  }  to {    -webkit-transform: rotate(720deg);    transform: rotate(720deg);  }}

@keyframes spinLeft {  from {    -webkit-transform: rotate(0deg);   transform: rotate(0deg);  }  to {    -webkit-transform: rotate(720deg);    transform: rotate(720deg);  }}

@-webkit-keyframes spinRight {  from {    -webkit-transform: rotate(360deg);    transform: rotate(360deg);  }  to {    -webkit-transform: rotate(0deg);    transform: rotate(0deg);  }}

@keyframes spinRight {  from {    -webkit-transform: rotate(360deg);    transform: rotate(360deg);  }  to {    -webkit-transform: rotate(0deg);    transform: rotate(0deg);  }}

.mt-80 {  margin-top: 80px;}

@media only screen and (max-width: 767.96px) {  .mt-80 {    margin-top: 50px;  }}

.mb-80 {  margin-bottom: 80px;}

@media only screen and (max-width: 767.96px) {  .mb-80 {    margin-bottom: 50px;  }}

.mt-100 {  margin-top: 100px;}

@media only screen and (max-width: 767.96px) {  .mt-100 {    margin-top: 80px;  }}

.mb-100 {  margin-bottom: 100px;}

@media only screen and (max-width: 767.96px) {  .mb-100 {    margin-bottom: 80px;  }}

.mt-150 {  margin-top: 150px;}

@media only screen and (max-width: 767.96px) {  .mt-150 {    margin-top: 100px;  }}

.mb-150 {  margin-bottom: 150px;}

@media only screen and (max-width: 767.96px) {  .mb-150 {    margin-bottom: 100px;  }}

.pt-80 {  padding-top: 80px;}

@media only screen and (max-width: 767.96px) {  .pt-80 {    padding-top: 50px;  }}

.pb-80 {  padding-bottom: 80px;}

@media only screen and (max-width: 767.96px) {  .pb-80 {    padding-bottom: 50px;  }}

.pt-100 {  padding-top: 100px;}

@media only screen and (max-width: 767.96px) {  .pt-100 {    padding-top: 80px;  }}

.pb-100 {  padding-bottom: 100px;}

@media only screen and (max-width: 767.96px) {  .pb-100 {    padding-bottom: 80px; }}

.pt-150 {  padding-top: 150px;}

@media only screen and (max-width: 767.96px) {  .pt-150 {    padding-top: 100px;  }}

.pb-150 {  padding-bottom: 150px;}

@media only screen and (max-width: 767.96px) {  .pb-150 {    padding-bottom: 100px;  }}



.gray-bg {  background-color: #f5f5f5;}

.orange-text {  color: #F28123;}

.blue-bg {  background-color: #162133;}

a.boxed-btn {  font-family: 'Poppins', sans-serif;  display: inline-block;  background-color: #F28123;  color: #fff;  padding: 10px 20px;}

a.bordered-btn {  font-family: 'Poppins', sans-serif;  display: inline-block;  color: #fff; border: 2px solid #F28123;  padding: 7px 20px; }

a.read-more-btn {  display: inline-block;  margin-top: 15px;  color: #051922;  -webkit-transition: 0.3s;  -o-transition: 0.3s;  transition: 0.3s;  font-weight: 700;}

a.read-more-btn:hover {  color: #F28123;}

a.boxed-btn, a.bordered-btn, a.cart-btn {  border-radius: 50px;}

.section-title h3 {  font-size: 40px;  position: relative;  padding-bottom: 15px;}

.section-title h3:after {  position: absolute;  content: '';  left: 0px;  right: 0px;  bottom: 0px;  width: 50px;  height: 2px;  background-color: #F28123;  margin: 0 auto;}

.section-title p {  font-size: 15px;  width: 530px;  margin: 0 auto;  color: #555;  margin-top: 10px;  line-height: 1.8;}

.section-title {  margin-bottom: 80px;}


/* -----------------------------------------------------------------------------

# Header Styles

----------------------------------------------------------------------------- */

ul.navbar-nav li.nav-item a.nav-link, ul.navbar-nav li.nav-item.active a.nav-link {  color: #051922; }

.top-header-area {  position: absolute;  z-index: 999;  width: 100%;  padding: 25px 0; }

.top-header-area.white ul.navbar-nav li.nav-item a.nav-link, .top-header-area.white ul.navbar-nav li.nav-item.active a.nav-link {  color: #fff;}

ul.navbar-nav li.nav-item a.nav-link, ul.navbar-nav li.nav-item.active a.nav-link {  color: #fff;  font-weight: 700;  margin-right: 14px;}

a.navbar-brand img {  max-width: 150px;}

nav.main-menu ul {  margin: 0;  padding: 0;  list-style: none;}

nav.main-menu ul li {  display: inline-block;}

nav.main-menu ul li a {  color: #fff;  font-weight: 700;  display: block;  padding: 15px; }

nav.main-menu ul > li {  position: relative;}

nav.main-menu ul ul.sub-menu {  position: absolute;  background-color: #fff;  width: 220px;  padding: 15px 15px;  margin: 0;  left: 0;  top: 50px;  border-radius: 3px;  -webkit-transition: 0.3s;  -o-transition: 0.3s;  transition: 0.3s;  opacity: 0;  visibility: hidden;  -webkit-box-shadow: 0 0 20px #555555;  box-shadow: 0 0 20px #555555;}

nav.main-menu ul ul.sub-menu li {  display: block;  text-align: left;}

nav.main-menu ul ul.sub-menu li a {  color: #555;  font-weight: 600;  padding: 7px 10px;  font-size: 13px;}

nav.main-menu ul > li:hover ul {  opacity: 1;  visibility: visible;}

nav.main-menu ul li:last-child a {  display: inline-block;}

nav.main-menu > ul li:last-child {  float: right;}


/*---- Logo ------*/
.site-logo {  float: left;  max-width: 40px; }
.site-logo {  padding: 6px 0;}
.site-logo img {  width: 100%;  height: auto;  display: block;}
/*---- Logo ------*/



ul.sub-menu li:last-child {  float: none !important;}

.mean-container .mean-bar {  background-color: transparent;  position: absolute;  right: 0;  top: 15px;}

.mean-bar a.meanmenu-reveal {  background-color: #F28123;}

.main-menu-wrap {  position: relative;}

.mean-container a.meanmenu-reveal {  color: #051922;}

.mean-container a.meanmenu-reveal span {  background-color: #051922;}

.mean-container .mean-nav ul li a {  padding: 0.5em 5%;}

.mean-container .mean-nav ul li li a {  padding: 0.5em 10%;}

.mean-container .mean-nav ul li a.mean-expand {  font-size: 16px;  height: 10px;  line-height: 10px;  width: 15px;}

.mean-container a.meanmenu-reveal {  padding: 8px 8px 6px;}

nav.mean-nav > ul > li:first-child > a {  border-top: none;}

.header-icons a {  color: #fff;  display: inline-block;  padding: 10px;}

.top-header-area.sepherate-header ul li > a, .top-header-area.sepherate-header .header-icons a {  color: #051922;}

nav.main-menu ul ul.sub-menu li {  display: block;}

nav.main-menu ul ul.sub-menu li a {  color: #555;  padding: 8px;  font-size: 13px;  font-weight: 600; }

nav.main-menu ul li.current-list-item > a {  color: #F28123; }

nav.main-menu li:hover > a {  color: #F28123; }

nav.main-menu li a {  -webkit-transition: 0.3s;  -o-transition: 0.3s;  transition: 0.3s; }

.top-header-area .header-icons a {  -webkit-transition: 0.3s;  -o-transition: 0.3s;  transition: 0.3s; }

.top-header-area .header-icons a:hover {  color: #F28123; }

.sticky-wrapper {  position: absolute;  left: 0;  top: 0;  width: 100%;  z-index: 999 !important; }

.sticky-wrapper.is-sticky .top-header-area {  background-color: #051922;  padding: 15px 0; }

.top-header-area {  -webkit-transition: 0.3s;  -o-transition: 0.3s;  transition: 0.3s; }

ul.navbar-nav {  margin: 0 auto; }

a.mobile-show {  display: none; }



/* ===========================
   FOOTER
=========================== */

.gsbd-footer {    background-color: #051922;    color: #ffffff;    padding: 30px 0 30px; }

.gsbd-footer-logo {    text-align: center;    margin-bottom: 26px;}

.gsbd-footer-logo img {    width: 250px;    max-width: 90%;}

.gsbd-footer-columns {    max-width: 1300px;    margin: 0 auto;    padding: 0 40px;    display: flex;    justify-content: space-between;    gap: 60px;}

.gsbd-footer-about,
.gsbd-footer-contact {    flex: 1;}

.gsbd-footer-about {    text-align: left;}

.gsbd-footer-contact {    text-align: right;}

.gsbd-footer-title {    font-size: 20px;    font-weight: 700;    margin-bottom: 12px;    color: #ffffff;    position: relative;    display: inline-block;}

.gsbd-footer-title::after {    content: "";    position: absolute;    left: 0;    bottom: -5px;    width: 32px;    height: 2px;    background-color: #F28123;}

.gsbd-footer-description {    color: #ffffff !important;    font-size: 15px;    line-height: 1.8;    opacity: 0.9;    max-width: 520px;}

.gsbd-footer-contact-list {    list-style: none;    margin: 0;    padding: 0;}

.gsbd-footer-contact-list li {    font-size: 15px;    line-height: 1.8;    opacity: 0.9;    margin-bottom: 6px;}

.gsbd-footer-contact-list a {    color: #ffffff !important;      font-size: 15px;    text-decoration: none !important;    line-height: 1.7;    display: inline-block;}


.gsbd-footer-social {    display: flex;    justify-content: center;    gap: 26px;    margin: 26px 0;}

.gsbd-icon {    width: 46px;    height: 46px;    border-radius: 50%;    border: 1px solid #ffffff90;    display: flex;    align-items: center;    justify-content: center;    color: #ffffff;    font-size: 18px;    transition: 0.3s;}

.gsbd-icon:hover {    background-color: #F28123;    border-color: #F28123;    color: #ffffff;}

.gsbd-footer-bottom {    border-top: 1px solid #2a3b48;    padding-top: 12px;    text-align: center;    margin-top: 18px;}

.gsbd-footer-bottom p { color: #ffffff;   margin: 0;    font-size: 14px;    opacity: 0.8;}


/* ===========================
   BACK TO TOP BUTTON
=========================== */

#backToTopBtn {    position: fixed;    right: 16px;    bottom: 22px;    width: 40px;    height: 40px;    border-radius: 50%;    background: #F28123;    color: #ffffff;    border: none;    cursor: pointer;    display: none;    align-items: center;    justify-content: center;    z-index: 999;}


@media (max-width: 992px) {
 .gsbd-footer-columns {  padding: 0 30px;  gap: 40px;    }  
}

@media (max-width: 768px) {
  .gsbd-footer-columns {  flex-direction: column;  text-align: center;  padding: 0 20px;  }

  .gsbd-footer-about,.gsbd-footer-contact {  text-align: center;  }

  .gsbd-footer-title::after {  left: 50%;  transform: translateX(-50%);  }   
}



/* -----------------------------------------------------------------------------

# Hero Styles Home Page

----------------------------------------------------------------------------- */
.hero-text {  display: table;  height: 100%; }

.hero-text-tablecell {  display: table-cell; }

.hero-area {  height: 100%;  position: relative;  z-index: 1; }

html, body {  height: 100%; }

.hero-area:after {  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  content: "";  background-color: #07212e;  z-index: -1;  opacity: 0.6; }

.hero-text p.subtitle {  color: #F28123;  font-weight: 700;  text-transform: uppercase;  letter-spacing: 7px;  font-size: 15px; }

.hero-text h1 {  font-size: 64px;  font-weight: 700;  line-height: 1.3;  color: #fff; }

.hero-area div {  height: 100%; }

.hero-area div.hero-text {  height: 100%;  width: 100%;}

.hero-area div.hero-text-tablecell {  height: auto;  vertical-align: middle;}

.hero-area div.hero-text-tablecell div {  height: auto;  vertical-align: middle;}

.hero-btns {  margin-top: 35px;}

.hero-btns a.bordered-btn {  margin-left: 15px;}

.hero-area div.hero-form {  background-color: #fff;  text-align: center;  width: 380px;  margin: 0 auto;  margin-right: 0;  border-radius: 5px;  -webkit-box-shadow: 0 0 15px #2d2d2d;  box-shadow: 0 0 15px #2d2d2d;  position: absolute;  right: 30px;  bottom: -15%;  height: 600px;}

input[type="submit"] {  background-color: #F28123;  color: #051922;  font-weight: 700;  text-transform: uppercase;  font-size: 15px;  border: none !important;  cursor: pointer;  padding: 15px 25px;  border-radius: 3px;}

.homepage-bg-1 {
  background-image: url(../images/banner/banner-1.jpg);
}

.homepage-bg-2 {
  background-image: url(../images/banner/banner-2.jpg);
}

.homepage-bg-3 {
  background-image: url(../images/banner/banner-3.jpg);
}

.homepage-slider {  height: 100%;}

.homepage-slider div {  height: 100%;}

.homepage-slider div.hero-text {  display: table;  width: 100%;}

.homepage-slider div.hero-text-tablecell {  height: auto;  vertical-align: middle;  display: table-cell;}

.homepage-slider div.hero-text-tablecell div {  height: auto;}

.single-homepage-slider {  background-size: cover;  background-position: center;  background-color: #020C0E;  position: relative;  z-index: 1;}

.single-homepage-slider:after {  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  background-color: #051922;  content: "";  z-index: -1;  opacity: 0.7; }

div.owl-controls, .owl-controls div {  height: auto;  top: 50%;  color: #F28123;  font-size: 48px; }

.homepage-slider {  position: relative; }

.owl-prev {  position: absolute;  left: 60px;  margin-top: -30px; }

.owl-next {  position: absolute;  right: 60px;  margin-top: -30px; }

.overview {  max-width: 90%;  margin: 60px auto;  display: flex;  align-items: center;  gap: 40px;  padding: 20px; }

.text-section h3 {  text-align: center;  font-size: 32px;  font-weight: 800;  margin-bottom: 20px; }

.overview-image {  max-width: 90%;  margin: 60px auto;  display: grid;  align-items: center; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));  gap: 20px;  padding: 20px; margin-top: 20px; }

.overview-image img {  width: 100%;  height: auto; max-width: 500px;  border-radius: 10px; object-fit: cover; }


@media only screen and (max-width: 991.98px) {
  .overview-image {  grid-template-columns: repeat(2, 1fr);  }
}

@media only screen and (max-width: 767.96px) {
  .overview-image {  grid-template-columns: 1fr;  }
}



.home-Project {  display: flex;  justify-content: center;  margin-top: 20px; padding: 60px 15px; }

.slide-container {    position: relative;    width: 100%;  max-width: 1100px;  margin: 0 auto; }

.slide-container .slides {  position: relative;  width: 100%;    padding-top: 56.25%;  overflow: hidden;  border-radius: 12px; }

.slide-container .slides img {  position: absolute;  inset: 0;  width: 100%;  height: 100%;  object-fit: cover; opacity: 0;  transition: opacity 0.5s ease; }

.slide-container .slides img.active {  opacity: 1; }

.slide-container .buttons {  position: absolute;  top: 50%;  left: 0;  right: 0;  transform: translateY(-50%);  display: flex;  justify-content: space-between;  padding: 0 15px; }

.dotsContainer {  margin-top: 15px;  display: flex;  justify-content: center;  gap: 8px; }

.home-pro {  margin: 10px auto;  width: 80%;  border-radius: 10px;  text-align: center;  padding: 10px 0;}

@media (max-width: 768px) {
    .slide-container {  max-width: 100%;  }
    .slide-container .slides {  padding-top: 65%;   }
}

@media(max-width: 500px) {
    .slides {  flex-direction: column;  }
}




/* -------------------Testimonial Styles------------------ */
.client-avater {  margin-bottom: 20px; }

.client-meta h3 {  font-size: 20px;  font-weight: 600; }

.client-meta h3 span {  display: block;  font-size: 70%;  margin-top: 10px;  color: #051922;  font-weight: 600;  opacity: 0.5; }

p.testimonial-body {  font-size: 17px;  font-style: italic;  width: 700px;  margin: 0 auto;  line-height: 1.8;  color: #999999;  margin-top: 20px; }

.client-avater img {  max-width: 100px;  border-radius: 50%;  margin: 0 auto; }




/* ----------------------- List Styles -------------------- */
.list-section {  background-color: #f5f5f5; }

.list-box {  overflow: hidden;  letter-spacing: 0.5px; }

.list-box .content h3 {  display: block;  line-height: 22px;  font-size: 18px;  margin-bottom: 4px; }

.list-box .content p {  margin-bottom: 0px;  opacity: 0.75; }

.list-box .list-icon i {  display: block;  font-size: 24px;  margin-right: 15px;  color: #F28123;  width: 65px;  height: 65px;  text-align: center;  line-height: 60px;  border: 2px #F28123 dotted;  border-radius: 999px; }


/* ------------ Finish Home ---------------*/






/* -----------------------------------------------------------------------------

# About Page Styles

----------------------------------------------------------------------------- */

.breadcrumb-bg {  background-image: url(../images/about/about.jpg);}

.breadcrumb-text p {  color: #F28123;  font-weight: 700;  text-transform: uppercase;  letter-spacing: 7px;}

.breadcrumb-text h1 {  font-size: 50px;  font-weight: 900;  color: #fff;  margin: 0;  margin-top: 20px;}

.breadcrumb-section {  padding: 150px 0;  background-size: cover;  background-position: center center;  position: relative;  z-index: 1;  background-attachment: fixed;  padding-top: 200px;}

.breadcrumb-section:after {  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  content: "";  background-color: #07212e;  z-index: -1;  opacity: 0.8; }



:root{
  --gap: 28px;
  --radius: 12px;
  --shadow: 0 10px 26px rgba(0,0,0,.08);
}

.chapter{  max-width: 1180px;  margin: 0 auto;  padding: 0 16px;  }

.row-flex{  display: flex;  align-items: center;  gap: var(--gap);  flex-wrap: wrap;  margin-top: 48px;  }

.vision-block{  flex: 1 1 520px;  min-width: 280px;  }

.vision-block p{  margin: 0;  text-align: justify;  }

.media-block{  flex: 1 1 520px;  min-width: 280px;  max-width: 640px;  }

.media-ratio{  position: relative;  width: 100%;  overflow: hidden;  border-radius: var(--radius);  box-shadow: var(--shadow);  }

.media-ratio::before{ content:""; display:block; padding-top:56.25%; } 

.media-ratio > img{  position: absolute; inset: 0;  width: 100%; height: 100%;  object-fit: cover;   }

.reverse .vision-block{ order: 2; }
.reverse .media-block{  order: 1; }

@media (max-width: 991px){
  .reverse .vision-block,
  .reverse .media-block{ order: initial; }
}



.team-bg-1 {
  background-image: url(../images/about/mushfiq.jpg);
}

.team-bg-2 {
  background-image: url(../images/about/rashid.jpg);
}

.team-bg-3 {
  background-image: url(../images/about/tazul.jpg);
}

.team-bg {  height: 400px;  background-size: cover;  background-position: center;  border-radius: 5px;  background-color: #ddd;}

.single-team-item {  position: relative;}

.single-team-item h4 {  font-size: 20px;  font-weight: 600;  text-align: center;  margin-top: 15px;  margin-bottom: 10px;}

.single-team-item h4 span {  font-size: 70%;  display: block;  margin-top: 10px;  opacity: 0.7;}

ul.social-link-team {  position: absolute;  bottom: 80px;  left: 0;  right: 0;  margin: 0;  padding: 0;  list-style: none;  text-align: center;}

ul.social-link-team li {  display: inline-block;}

ul.social-link-team li a {  color: #fff;  background-color: #F28123;  width: 32px;  height: 32px;  line-height: 32px;  text-align: center;  border-radius: 50%;  display: block;  margin: 5px;}

.org-section{ padding: clamp(16px, 3vw, 48px) 0; }

.organogram{    max-width: min(1400px, 96vw);    margin: 0 auto;  }

.organogram img{    display:block;    width:100%;    max-width:100%;    height:auto;    border-radius:12px;    box-shadow:0 10px 28px rgba(0,0,0,.10);  }

.organogram-frame{    padding: clamp(8px, 1.5vw, 16px);    background: #fff;    border-radius: 14px;  }

/* ------------ Finish About ---------------*/



/* -----------------------------------------------------------------------------

# team page

----------------------------------------------------------------------------- */

.gsbd-team-bg { background-image: url(../images/team/1-team-bg.jpg);}

.gsbd-team-section {    padding: 150px 0 10px;    background-size: cover;    background-position: center;    background-attachment: fixed;    position: relative;    z-index: 1;  }

.gsbd-team-section:after {    content: "";    position: absolute;    inset: 0;    background: rgba(7, 33, 46, 0.85);    z-index: -1;}

.gsbd-team-text h1 {    margin-top: 18px;    margin-bottom: 0;    font-size: 42px;    font-weight: 900;    color: #ffffff;}

.gsbd-team-area {  padding: 60px 0 80px;  background: #f5f5f5; }

.gsbd-team-area .about-content {    max-width: 1200px;    margin: 0 auto;    display: grid;    grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);    gap: 30px; }

.gsbd-team-area .sidebar {    background: #abc08c;    padding: 18px 18px 14px;    border-radius: 12px;    color: #ffffff;    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);  }

.gsbd-team-area .sidebar button {
    display: block;    width: 100%;    margin-bottom: 8px;    padding: 9px 12px;    background: #0d2d3c;    color: #ffffff;    border: none;    text-align: left;    cursor: pointer;    border-radius: 8px;    font-size: 14px;    font-weight: 500;    letter-spacing: 0.2px;    transition: background 0.25s ease, transform 0.15s ease, box-shadow 0.2s ease;  }

.gsbd-team-area .sidebar .opacity {    opacity: 0.6;    margin-right: 4px;}

.gsbd-team-area .sidebar button:hover {    background: #F28123;    transform: translateY(-1px);    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);}

.gsbd-team-area .sidebar button.active {    background: #F28123;    font-weight: 600;}

.gsbd-team-area .content {    padding: 4px 0;}

.team-content-section {    display: none;}

.team-content-section.active {    display: block;}

.profile {    display: flex;    gap: 22px;    padding: 18px 20px;    margin-bottom: 22px;    border-radius: 14px;    background: #ffffff;    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.06);    border: 1px solid rgba(5, 25, 34, 0.04);    align-items: flex-start; }

.profile img {    width: 150px;    height: 180px;    border-radius: 12px;    object-fit: cover;    object-position: center;    flex-shrink: 0;  }

.profile h2 {    margin: 0 0 4px 0;    font-size: 20px;    color: #051922;}

.profile > div > p:first-of-type {    margin: 0 0 6px 0;    color: #F28123;    font-weight: 600;    font-size: 14px;}

.profile-des {    margin-top: 6px;    color: #202020 !important;    font-weight: 400 !important;    font-size: 14px;    text-align: justify;    line-height: 1.8;}


/* Medium screens */
@media (max-width: 1024px) {
  .gsbd-team-area {        padding: 40px 0 60px;    }

  .gsbd-team-area .about-content {        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);        gap: 18px;    }

  .profile {        gap: 18px;        padding: 16px 16px;    }

  .profile img {      width: 120px;    }
}

/* Tablets & small devices */
@media (max-width: 768px) {
  .gsbd-team-area .about-content {        display: block;    }

  .gsbd-team-area .sidebar {      margin-bottom: 20px;      display: grid;      grid-template-columns: repeat(3, minmax(0, 1fr));      gap: 10px;    }

  .gsbd-team-area .sidebar button {        font-size: 13px;        padding: 8px 6px;        text-align: center;    }

  .profile {      flex-direction: column;      align-items: center;      text-align: center;    }

  .profile img {      width: 150px;    }

  .profile-des {      font-size: 13px;    }
}

/* Extra small devices */
@media (max-width: 480px) {
  .gsbd-team-area .sidebar {      grid-template-columns: repeat(2, minmax(0, 1fr));  }

  .gsbd-team-area .sidebar button {      font-size: 11px;      padding: 7px 4px;    }

  .profile img {      width: 150px;    }
}

@media (max-width: 360px) {
  .gsbd-team-area .sidebar button {      font-size: 10px;    }
}


/* ------------ Finish GSBD Team ---------------*/



/* -----------------------------------------------------------------------------

GSBD Project

----------------------------------------------------------------------------- */

.project-bg { background-image: url(../images/project/project-bg.jpg);}

.project-section {    padding: 150px 0 10px;    background-size: cover;    background-position: center;    background-attachment: fixed;    position: relative;    z-index: 1;  }

.project-section:after {    content: "";    position: absolute;    inset: 0;    background: rgba(7, 33, 46, 0.85);    z-index: -1;}

.project-text h1 {    margin-top: 18px;    margin-bottom: 0;    font-size: 42px;    font-weight: 900;    color: #ffffff;}

/*-------------GSBD PROJECT SYSTEM--------------*/

.gsbd-project-wrapper { padding: 60px 0; }

.project-layout {  max-width: 1400px;  margin: auto;  display: grid;  grid-template-columns: 270px 1fr;  gap: 20px;}

.project-sidebar {  background: #8cc0d8;  padding: 15px;  border-radius: 10px;}

.project-sidebar button {  width: 100%;  background: #064124;  border: none;  padding: 12px;  margin-bottom: 8px;  color: #fff;  cursor: pointer;  border-radius: 6px;  text-align: left;  font-size: 14px;  transition: 0.25s;}

.project-sidebar button:hover,
.project-sidebar button.active {    background: #F28123;    color: #fff;}

.project-content {    background: #fff;    padding: 20px;    border-radius: 10px;}

.project-box { display: none; }
.project-box.active { display: block; }

/* SLIDER */
.slide-container {    position: relative;    width: 100%;    margin-top: 20px;}

.slides img {    width: 100%;    height: 460px;    object-fit: cover;    border-radius: 10px;    display: none;}

.slides img.active { display: block; }

.prev, .next {    position: absolute;    top: 50%;    transform: translateY(-50%);    font-size: 26px;    padding: 8px 14px;    color: white;    background: rgba(0,0,0,0.5);    cursor: pointer;    border-radius: 6px;    user-select: none;}

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

.dots {    display: flex;    justify-content: center;    margin-top: 12px;    gap: 8px;}

.dots span {    width: 12px;    height: 12px;    border-radius: 50%;    background: #bbb;    cursor: pointer;}

.dots span.active {    background: #F28123;}

/* Responsive */
@media (max-width: 992px) {
  .project-layout {  grid-template-columns: 1fr;    }
}

@media (max-width: 768px) {
  .slides img {  height: 260px;    }
}

/* ------------ Finish Project Page ---------------*/



/* -----------------------------------------------------------------------------

# Services Page

----------------------------------------------------------------------------- */


.service-bg { background-image: url(../images/services/service-bg.jpg);}

.service-section {    padding: 150px 0 10px;    background-size: cover;    background-position: center;    background-attachment: fixed;    position: relative;    z-index: 1;  }

.service-section:after {    content: "";    position: absolute;    inset: 0;    background: rgba(7, 33, 46, 0.85);    z-index: -1;}

.service-text p {  color: #F28123;  font-weight: 700;  text-transform: uppercase;  letter-spacing: 7px;}

.service-text h1 {    margin-top: 18px;    margin-bottom: 0;    font-size: 42px;    font-weight: 900;    color: #ffffff;}



/* -------------SERVICE CARDS GRID--------------- */

.service-card-section {  padding: 60px 0 80px;}

.card-container {  max-width: 1180px;  margin: 0 auto;  padding: 0 16px;  display: grid;  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));  gap: 26px;}

.card-container .card {  background: #ffffff;  border-radius: 14px;  border: 1px solid #d7e9d2;  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.06);  overflow: hidden;  display: flex;  flex-direction: column;  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;  cursor: pointer;}

.card-container .card:hover {  transform: translateY(-6px);  box-shadow: 0 18px 32px rgba(0, 0, 0, 0.12);  border-color: #21a551;}

.card-container .card-image {  position: relative;  width: 100%;  overflow: hidden;}

.card-container .card-image img {  display: block;  width: 100%;  height: 100%;  object-fit: cover;  aspect-ratio: 3 / 4;  background: #f5f5f5;}

.card-overlay {  position: absolute;  left: 0;  right: 0;  bottom: 0;  padding: 14px 16px;  text-align: center;  background: linear-gradient(    to top,    rgba(0, 0, 0, 0.65),    rgba(0, 0, 0, 0.0)  );}

.card-container .card-title {  font-size: 18px;  font-weight: 800;  margin: 0;  letter-spacing: 0.5px;  text-transform: uppercase;  color: #ffffff;}

.card-container .card-content {  display: none;}

.modal-backdrop.show {  opacity: 0.65;}

.service-modal .modal-dialog {  max-width: 900px;}

.service-modal .modal-content {  border-radius: 12px;  border: none;  overflow: hidden;}

.service-modal-body {  padding: 30px 40px;}

.service-modal-img {  background: #f5f5f5;  border-radius: 8px;  overflow: hidden;}

.service-modal-img img {  width: 100%;  height: 100%;  object-fit: cover;}

.service-card {  border-radius: 14px;}

@media (max-width: 991px) {
  .service-card-section {    padding: 40px 0 60px;  }

  .card-container {    gap: 20px;  }
}

@media (max-width: 575px) {
  .card-container {    grid-template-columns: 1fr;    max-width: 480px;  }

  .card-container .card-title {    font-size: 16px;  }
}

/* ------------ Finish Service Page ---------------*/





/* -----------------------------------------------------------------------------

# Contact Page Styles

----------------------------------------------------------------------------- */
.contact-bg {  background-image: url(../images/contact-bg.jpg);}

.contact-text p {  color: #F28123;  font-weight: 700;  text-transform: uppercase;  letter-spacing: 7px;}

.contact-text h1 {  font-size: 50px;  font-weight: 900;  color: #fff;  margin: 0;  margin-top: 20px;}

.contact-section {  padding: 150px 0;  background-size: cover;  background-position: center center;  position: relative;  z-index: 1;  background-attachment: fixed;  padding-top: 200px;}

.contact-section:after {  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  content: "";  background-color: #07212e;  z-index: -1;  opacity: 0.8; }


.form-title {  margin-bottom: 25px;}

.form-title h2 {  font-size: 25px;}

.form-title p {  font-size: 15px;  line-height: 1.8;}

.contact-form form p input[type=text], .contact-form form p input[type=tel], .contact-form form p input[type=email] {
  width: 49%;  padding: 15px;  border: 1px solid #ddd;  border-radius: 3px;
}

.contact-form form p textarea {  border: 1px solid #ddd;  padding: 15px;  height: 200px;  border-radius: 3px;  width: 100%;  resize: none;}

.contact-form-wrap {  background-color: #FBFBFB;  padding: 45px 30px;  border-radius: 5px;}

.contact-form-box {  padding-left: 40px;  margin-bottom: 30px;}

.contact-form-box h4 {  font-size: 20px;  font-weight: 600;  position: relative;  margin-bottom: 10px;}

.contact-form-box h4 i {  position: absolute;  left: -13%;  color: #F28123;  top: 2px;}

.contact-form-box p {  line-height: 1.8;  opacity: 0.8;}

.contact-form-wrap .contact-form-box:last-child {  margin: 0;}

.find-location p {  color: #fff;  font-size: 40px;  margin: 0;  font-weight: 600;  padding: 95px 0;}

.find-location p i {  margin-right: 10px;  color: #F28123;}

#form_status span {  color: #fff;  font-size: 14px;  font-weight: normal;  background: #E74C3C;  width: 100%;  text-align: center;  display: inline-block;  padding: 10px 0px;  border-radius: 3px;  margin-bottom: 18px;}

#form_status span.loading {  color: #333;  background: #eee;  border-radius: 3px;  padding: 18px 0px;}

#form_status span.notice {  color: yellow;}

#form_status .success {  color: #fff;  text-align: center;  background: #2ecc71;  border-radius: 3px;  padding: 30px 0px;}

#form_status .success i {  color: #fff;  font-size: 45px;  margin-bottom: 14px;}

#form_status .success h3 {  color: #fff;  margin-bottom: 10px;}

/* ------------ Finish Contact Page ---------------*/



/* -----------------------------------------------------------------------------
# Career Page
----------------------------------------------------------------------------- */

.career-bg { background-image: url(../images/career-bg.jpg);}

.career-section {    padding: 150px 0 50px;    background-size: cover;    background-position: center;    background-attachment: fixed;    position: relative;    z-index: 1;  }

.career-section:after {    content: "";    position: absolute;    inset: 0;    background: rgba(7, 33, 46, 0.85);    z-index: -1;}

.career-wrapper {  padding: 60px 16px 80px;  background: #f5f5f5;  }

.career {  max-width: 960px;  margin: 0 auto;  }

.career-col {  max-width: 900px;  margin: 0 auto;  }

.apply-box {  
  max-width: 700px;  margin: 0 auto;  padding: 20px 40px 40px 40px;  border-radius: 20px;  background: #19657e;  
  border: 1px solid rgba(255, 255, 255, 0.3);  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);  
  background-image: linear-gradient(rgba(4, 9, 30, 0.7),  rgba(4, 9, 30, 0.7)),  url(../images/career.jpg);  
  background-size: cover;  background-position: center;  
}

.apply-box h1 {  padding-top: 2rem;  color: #e2edef;  font-size: 28px;  margin-bottom: 10px;  }

.career-title-small {  font-size: 18px;  }

.career-form-grid {  margin-top: 20px;  display: grid;  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));  gap: 20px;  }

.career-form-group {  display: flex;  flex-direction: column;  color: #e0edef;  }

.career-form-group label {  font-size: 15px;  margin-bottom: 5px;  }

.career-form-group input,
.career-form-group select,
.career-form-group textarea {  padding: 8px 10px;  border-radius: 4px;  border: 1px solid #ccc;  font-size: 15px;  width: 100%;   }

.career-form-group input:focus,
.career-form-group select:focus,
.career-form-group textarea:focus {  outline: none;  border-color: #F28123;  box-shadow: 0 0 0 1px rgba(242, 129, 35, 0.4);  }

.career-form-group.full-width {  grid-column: 1 / -1;  }

.career-form-group textarea {  resize: vertical;  min-height: 110px;  }

.career-button-container {  display: flex;  justify-content: flex-end;  margin-top: 10px;  }

.career-button-container button[type="submit"] {  background-color: #e2edef;  border: transparent solid 8px;  color: red;  border-radius: 12px;  font-weight: 600;  padding: 8px 24px;  cursor: pointer;  transition: 0.25s;  }

.career-button-container button[type="submit"]:hover {  background-color: #ffffff;  transform: translateY(-1px);  }

@media (max-width: 700px) {  .apply-box {  padding: 20px 20px 30px 20px;  }  }

/* ------------ Finish Career Page ---------------*/




/* -----------------------------------------------------------------------------
# faqs Page
----------------------------------------------------------------------------- */

.faqs-bg { background-image: url(../images/);}

.faqs-section {    padding: 150px 0 50px;    background-size: cover;    background-position: center;    background-attachment: fixed;    position: relative;    z-index: 1;  }

.faqs-text h1 {  font-size: 50px;  font-weight: 900;  color: #fff;  margin: 0;  margin-top: 20px;}

.faqs-section:after {    content: "";    position: absolute;    inset: 0;    background: rgba(7, 33, 46, 0.85);    z-index: -1;}


/* ---------- FAQ SECTION ---------- */

.faq-section {	padding: 80px 0 100px;	background-color: #f5f5f5;	}

.faq-wrapper {  max-width: 900px;	margin: 0 auto;	}

.faq-header-title {	font-size: 26px;	font-weight: 800;	text-transform: uppercase;	margin-bottom: 30px;	}

.faq-card {	background-color: #ffffff;	border-radius: 10px;	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);	overflow: hidden;	}

.faq-item {	border-bottom: 1px solid #e5e5e5;	}

.faq-item:last-child {	border-bottom: none;	}

.faq-question {	width: 100%;	padding: 18px 20px;	display: flex;	align-items: center;	background: transparent;	border: none;	outline: none;	font-family: "Poppins", sans-serif;	font-size: 16px;	font-weight: 600;	color: #051922;	cursor: pointer;	text-align: left;	}

.faq-question-text {	flex: 1;	}

.faq-icon {	width: 28px;	height: 28px;	border-radius: 50%;	border: 1px solid #F28123;	display: flex;	align-items: center;	justify-content: center;	font-size: 18px;	margin-right: 14px;	color: #F28123;	flex-shrink: 0;	transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;	}

.faq-item.active .faq-icon {	background-color: #F28123;	color: #ffffff;	transform: rotate(90deg);	}

.faq-answer {	padding: 0 56px 0 56px;	font-size: 15px;	line-height: 1.8;	color: #555;	max-height: 0;	overflow: hidden;	transition: max-height 0.3s ease, padding-bottom 0.3s ease;	}

.faq-item.active .faq-answer {	padding-bottom: 16px;	}

@media (max-width: 575.98px) {
	.faq-answer {	padding: 0 20px 0 20px;	}

	.faq-item.active .faq-answer {	padding-bottom: 14px;	}	
}

/* ------------ Finish faqs Page ---------------*/


/* -----------------------------------------------------------------------------
# Gallery Page
----------------------------------------------------------------------------- */

.gallery0-bg {  background-image: url(../images/gallery.jpg);}

.gallery0-text h1 {  font-size: 50px;  font-weight: 900;  color: #fff;  margin: 0;  margin-top: 20px;}

.gallery0-section {  padding: 150px 0;  background-size: cover;  background-position: center center;  position: relative;  z-index: 1;  background-attachment: fixed;  padding-top: 200px;}

.gallery0-section:after {  position: absolute;  left: 0;  top: 0;  width: 100%;  height: 100%;  content: "";  background-color: #07212e;  z-index: -1;  opacity: 0.8; }

/* ---------- Gallery Section ---------- */
.gsbd-gallery-section {  padding: 80px 0 100px;  background-color: #f5f5f5;  }

.gsbd-gallery-title {  font-size: 26px;  font-weight: 800;  text-transform: uppercase;  margin-bottom: 35px;  }

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

@media (max-width: 991.98px) {
  .gsbd-gallery-grid {  grid-template-columns: repeat(2, 1fr);  }
}

@media (max-width: 575.98px) {
  .gsbd-gallery-grid {  grid-template-columns: 1fr;  }
}

.gsbd-gallery-item {  position: relative;  overflow: hidden;  border-radius: 10px;  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);  cursor: zoom-in;  }

.gsbd-gallery-item img {  width: 100%;  height: 100%;  object-fit: cover;  transition: transform 0.4s ease;  display: block;  }

.gsbd-gallery-overlay {  position: absolute;  inset: 0;  background: linear-gradient(135deg, rgba(5, 25, 34, 0.8), rgba(242, 129, 35, 0.75));  opacity: 0;  display: flex;  align-items: center;  justify-content: center;  color: #ffffff;  font-size: 18px;  font-weight: 600;  letter-spacing: 1px;  text-transform: uppercase;  transition: opacity 0.3s ease;  }

.gsbd-gallery-item:hover img {  transform: scale(1.08);  }

.gsbd-gallery-item:hover .gsbd-gallery-overlay {  opacity: 1;  }


/* ------------ Finish Gallery Page ---------------*/