/* ===== HEADER STYLES (FINAL UPDATED) ===== */

/* Make header NOT fixed & reduce height */
.site_header,
.xb-header {
  position: relative !important;
  padding: 0px 0 !important;
  box-shadow: none !important;
}

/* Reduce logo size */
.site_logo img {
  max-height: 48px;
  width: auto;
}

/* Reduce menu link spacing */
.main_menu_list > li > a {
  padding: 6px 10px !important;
  font-size: 14px;
}

/* Reduce right-side button size */
.hotline_btn {
  padding: 6px 14px !important;
  font-size: 14px;
}

.hotline_btn .btn_icon img {
  height: 20px;
  width: 20px;
}

/* Remove extra spacing */
.btns_group {
  margin: 0 !important;
}

/* =====================================================
   FORCE DESKTOP HEADER INTO ONE ROW (NO WRAPPING)
===================================================== */
@media (min-width: 992px) {
  .xb-header .row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }

  .main_menu_inner {
    display: flex !important;
    justify-content: center;
  }

  .main_menu_list {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
  }

  .main_menu_list li {
    white-space: nowrap;
  }

  .col-lg-3,
  .col-lg-6 {
    flex: 0 0 auto;
  }

  .col-lg-6 { max-width: 60%; }
  .col-lg-3:first-child { max-width: 20%; }
  .col-lg-3:last-child { max-width: 20%; }
}

/* =====================================================
   DESKTOP MENU DROPDOWN ARROW ICON
===================================================== */

.main_menu_list .has_dropdown {
  position: relative;
  padding-right: 18px !important;
}

/* Down arrow */
.main_menu_list .has_dropdown::after {
  content: "\f107";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  transition: 0.3s ease;
}

/* Rotate arrow on hover */
.main_menu_list li:hover .has_dropdown::after {
  transform: translateY(-50%) rotate(180deg);
}

/* =====================================================
   MOBILE MENU STYLES
===================================================== */

.mobile_menu_overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  z-index: 998;
}
.mobile_menu_overlay.active { opacity: 1; visibility: visible; }

.mobile_menu_wrapper {
  position: fixed;
  top: 0;
  right: -100%;
  width: 280px;
  height: 100vh;
  background: #000;
  z-index: 999;
  transition: .3s;
  overflow-y: auto;
}
.mobile_menu_wrapper.active { right: 0; }

.mobile_menu_header {
  padding: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.mobile_menu_logo { max-width: 110px; }

.mobile_menu_close {
  background: rgba(255,255,255,.1);
  border-radius: 50%;
  width: 34px;
  height: 34px;
  border: none;
  color: #fff;
  cursor: pointer;
}

.mobile_menu_list { list-style: none; padding: 0; margin: 0; }
.mobile_menu_list li a {
  display: block;
  padding: 14px 18px;
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.05);
  font-size: 14px;
}
.mobile_menu_list li a:hover { background: #0d2821; color: #00ff87; }

.mobile_menu_footer { padding: 18px; font-size: 13px; color: #bbb; }

/* Hamburger */
.mobile_hamburger {
  background: #012a2b;
  border-radius: 8px;
  padding: 8px;
  border: none;
  cursor: pointer;
}
.mobile_hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  margin: 4px 0;
}

/* Responsive */
@media (min-width: 992px) {
  .mobile_hamburger,
  .mobile_menu_wrapper,
  .mobile_menu_overlay { display: none !important; }
}
@media (max-width: 991px) {
  .main_menu { display: none !important; }
}












/* ================================
   REVIEW / TESTIMONIAL SECTION
================================ */

/* Section spacing */
.review_section {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}

/* Heading */
.heading_block {
  margin-bottom: 60px;
}

.heading_text {
  font-size: 42px;
  font-weight: 700;
  color: #ffffff;
}

.heading_description {
  font-size: 17px;
  color: #cfe7e7;
  margin-top: 15px;
  margin-bottom: 40px;
  line-height: 1.7;
}

/* ================================
   SWIPER FIXES
================================ */

.review_carousel,
.review_carousel .swiper,
.review_carousel .swiper-wrapper,
.review_carousel .swiper-slide {
  overflow: visible !important;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: stretch;
  height: auto;
}

/* ================================
   REVIEW CARD
================================ */

.review_block {
  position: relative;
  background: linear-gradient(145deg, #0d3b3b, #0a2e2e);
  border-radius: 20px;
  padding: 80px 30px 35px;
  text-align: center;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);
  transition: transform 0.3s ease;
  overflow: visible;
  width: 100%;
  max-width: 420px;
}

.review_block:hover {
  transform: translateY(-8px);
}

/* ================================
   AVATAR (FLOATING CIRCLE IMAGE)
================================ */

.review_avatar {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95px;
  height: 95px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #0f2e2e;
  background: #ffffff;
  z-index: 5;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.review_avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ================================
   REVIEW TEXT
================================ */

.review_comment {
  font-size: 18px;
  line-height: 1.8;
  color: #ffffff;
  margin-bottom: 25px;
}

.review_author_name {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 5px;
}

.review_author_designation {
  font-size: 14px;
  color: #9bd3d3;
}

/* ================================
   PAGINATION DOTS
================================ */

.review_pagination {
  margin-top: 40px;
  text-align: center;
}

.review_pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #7fbfbf;
  opacity: 0.5;
  transition: 0.3s;
}

.review_pagination .swiper-pagination-bullet-active {
  background: #ffffff;
  opacity: 1;
}

/* ================================
   DECORATION SHAPES
================================ */

.decoration_item {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}

.shape_circle {
  top: 10%;
  left: 5%;
}

.shape_dollar_1 {
  bottom: 15%;
  left: 10%;
}

.shape_dollar_2 {
  top: 20%;
  right: 8%;
}

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

@media (max-width: 991px) {
  .heading_text {
    font-size: 34px;
  }

  .review_block {
    padding: 75px 25px 30px;
  }
}

@media (max-width: 576px) {
  .review_avatar {
    width: 75px;
    height: 75px;
  }

  .review_block {
    padding-top: 60px;
  }

  .review_comment {
    font-size: 16px;
  }
}

/* ================================
   REVIEW / TESTIMONIAL SECTION
================================ */

.review_section {
  position: relative;
  overflow: hidden;
  padding: 110px 0 100px;
}

/* ================================
   HEADING
================================ */

.heading_block {
  margin-bottom: 110px; /* EXTRA SPACE so avatars don't touch text */
}

.heading_text {
  font-size: 42px;
  font-weight: 700;
  color: #ffffff;
}

.heading_description {
  font-size: 17px;
  color: #cfe7e7;
  margin-top: 15px;
  line-height: 1.7;
}

/* ================================
   SWIPER FIXES
================================ */

.review_carousel,
.review_carousel .swiper,
.review_carousel .swiper-wrapper,
.review_carousel .swiper-slide {
  overflow: visible !important;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: stretch;
  height: auto;
}

/* ================================
   REVIEW CARD
================================ */

.review_block {
  position: relative;
  background: linear-gradient(145deg, #0d3b3b, #0a2e2e);
  border-radius: 20px;
  padding: 95px 30px 35px; /* extra top space for avatar */
  text-align: center;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);
  transition: transform 0.3s ease;
  overflow: visible;
  width: 100%;
  max-width: 420px;
}

.review_block:hover {
  transform: translateY(-8px);
}

/* ================================
   AVATAR (FLOATING IMAGE)
================================ */

.review_avatar {
  position: absolute;
  top: 15px; /* PUSHED DOWN so it doesn't touch heading */
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95px;
  height: 95px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #0f2e2e;
  background: #ffffff;
  z-index: 5;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.review_avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ================================
   REVIEW TEXT
================================ */

.review_comment {
  font-size: 18px;
  line-height: 1.8;
  color: #ffffff;
  margin-bottom: 25px;
}

.review_author_name {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 5px;
}

.review_author_designation {
  font-size: 14px;
  color: #9bd3d3;
}

/* ================================
   PAGINATION DOTS
================================ */

.review_pagination {
  margin-top: 40px;
  text-align: center;
}

.review_pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #7fbfbf;
  opacity: 0.5;
  transition: 0.3s;
}

.review_pagination .swiper-pagination-bullet-active {
  background: #ffffff;
  opacity: 1;
}

/* ================================
   DECORATION SHAPES
================================ */

.decoration_item {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}

.shape_circle {
  top: 10%;
  left: 5%;
}

.shape_dollar_1 {
  bottom: 15%;
  left: 10%;
}

.shape_dollar_2 {
  top: 20%;
  right: 8%;
}

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

@media (max-width: 991px) {
  .heading_text {
    font-size: 34px;
  }

  .heading_block {
    margin-bottom: 90px;
  }

  .review_block {
    padding: 85px 25px 30px;
  }
}

@media (max-width: 576px) {
  .review_avatar {
    width: 75px;
    height: 75px;
    top: 18px;
  }

  .review_block {
    padding-top: 70px;
  }

  .review_comment {
    font-size: 16px;
  }
}

.heading_description {
    margin-bottom: 40px;
}