/*========================================================================
 * Header & Offcanvas styles extracted from assets/css2/main.css
 * Only includes styles needed for the header, offcanvas, preloader,
 * back-to-top, meanmenu and button — does NOT override global typography.
 ==========================================================================*/

/* ── CSS variables (theme colours) ─────────────────────────────── */
:root {
  --theme-color: #3c72fc;
  --theme-color-1: #0f0d1d;
  --primary-font: 'Inter', sans-serif;
  --secondary-font: 'Roboto', sans-serif;
  --white: #ffffff;
}

/* ── Minimal resets scoped to header components ─────────────────── */
header ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

header a {
  text-decoration: none;
  color: inherit;
}

.header-action .header-link-1 .content h6 a {
  text-decoration: none;
  color: inherit;
  font-size: large;
  font-weight: 600;
}

header a:hover,
header a:focus {
  text-decoration: none;
  color: inherit;
}

header button {
  outline: none;
  border: none;
  background: transparent;
  cursor: pointer;
}

header button:focus {
  outline: 0;
}

header img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.offcanvas__info ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.offcanvas__info a {
  text-decoration: none;
  color: inherit;
}

/* ── Utility classes used by header/offcanvas ───────────────────── */
.fix {
  overflow: hidden;
}

.p-relative {
  position: relative;
}

.bg-color-1 {
  background: var(--theme-color-1);
}

.cursor-pointer {
  cursor: pointer;
}

.z-3 {
  z-index: 3;
}

.mr-15 {
  margin-right: 15px;
}

/* ── Preloader ──────────────────────────────────────────────────── */
#preloader {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: #121212;
  z-index: 9999;
}

.bd-loader-inner {
  position: fixed;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.bd-loader {
  margin-left: 92px;
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 575px) {
  .bd-loader {
    transform: scale(0.8);
    margin-left: 66px;
  }
}

.bd-loader-item {
  position: absolute;
  width: 6px;
  height: 80px;
  margin-top: -45px;
  border-radius: 0;
  background-color: var(--theme-color);
  animation: bd-loader-aim 0.8s infinite;
  animation-direction: alternate-reverse;
}

.bd-loader .bd-loader-item:nth-child(1) {
  margin-left: 0px;
}

.bd-loader .bd-loader-item:nth-child(2) {
  margin-left: -14px;
  animation-delay: 0.1s;
}

.bd-loader .bd-loader-item:nth-child(3) {
  margin-left: -28px;
  animation-delay: 0.2s;
}

.bd-loader .bd-loader-item:nth-child(4) {
  margin-left: -42px;
  animation-delay: 0.3s;
}

.bd-loader .bd-loader-item:nth-child(5) {
  margin-left: -56px;
  animation-delay: 0.4s;
}

.bd-loader .bd-loader-item:nth-child(6) {
  margin-left: -70px;
  animation-delay: 0.5s;
}

.bd-loader .bd-loader-item:nth-child(7) {
  margin-left: -84px;
  animation-delay: 0.6s;
}

.bd-loader .bd-loader-item:nth-child(8) {
  margin-left: -98px;
  animation-delay: 0.7s;
}

@keyframes bd-loader-aim {
  0% {
    height: 2px;
    margin-top: 0;
    transform: rotate(0deg);
  }

  100% {
    height: 80px;
    transform: rotate(0deg);
  }
}

/* ── Sticky header slide-in animation (from animate.css) ────────── */
@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* ── Back to top ────────────────────────────────────────────────── */
.backtotop-wrap {
  position: fixed;
  bottom: 35px;
  right: 30px;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 400ms linear;
  color: #151515;
  justify-content: center;
  background-color: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3);
}

.backtotop-wrap:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 50px 0 rgba(0, 0, 0, .2);
}

.backtotop-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.backtotop-wrap::after {
  position: absolute;
  font-family: "Font Awesome 6 Pro";
  content: "\f062";
  text-align: center;
  line-height: 44px;
  font-size: 16px;
  font-weight: 900;
  left: 0;
  top: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  z-index: 1;
  transition: all 400ms linear;
}

.backtotop-wrap svg path {
  fill: none;
}

.backtotop-wrap svg.backtotop-circle path {
  stroke: #ccc;
  stroke-width: 0;
  box-sizing: border-box;
  transition: all 400ms linear;
}

/* ── Offcanvas overlay ──────────────────────────────────────────── */
.offcanvas__overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #151515;
  z-index: 99998;
  top: 0;
  opacity: 0;
  visibility: hidden;
  right: 0;
  transition: all 0.3s 0s ease-out;
}

.offcanvas__overlay.overlay-open {
  opacity: 0.8;
  visibility: visible;
}

.offcanvas__overlay-white {
  display: none;
}

/* ── Offcanvas panel ────────────────────────────────────────────── */
.offcanvas__close button {
  height: 45px;
  width: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  background-color: var(--theme-color-1);
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  transition: all 0.3s ease-out;
  border: 1px solid #271b1b;
}

.offcanvas__close button i {
  color: #fff;
}

.offcanvas__info {
  background: #191919;
  border-left: 2px solid var(--theme-color);
  position: fixed;
  right: 0;
  top: 0;
  width: 400px;
  height: 100%;
  transform: translateX(calc(100% + 80px));
  transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  z-index: 99999;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}

.offcanvas__info::-webkit-scrollbar {
  display: none;
}

@media (max-width: 450px) {
  .offcanvas__info {
    width: 300px;
  }
}

.offcanvas__info.info-open {
  opacity: 1;
  transform: translateX(0);
}

.offcanvas__logo a img {
  width: 180px;
}

.offcanvas__wrapper {
  position: relative;
  height: 100%;
  padding: 30px;
}

@media (max-width: 575px) {
  .offcanvas__wrapper {
    padding: 20px;
  }
}

.offcanvas__top {
  padding-bottom: 0;
}

.offcanvas__search {
  position: relative;
}

.offcanvas__search p.text-white {
  color: #fff;
  margin: 40px 0px 30px 0px;
}

.offcanvas__contact {
  margin-top: 30px;
}

.offcanvas__contact h4 {
  font-size: 22px;
  margin-bottom: 20px;
  color: #fff;
  font-weight: 400;
}

.offcanvas__contact ul li:not(:last-child) {
  margin-bottom: 20px;
}

.offcanvas__contact-icon {
  margin-inline-end: 15px;
}

.offcanvas__contact-icon i {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  overflow: hidden;
  color: #fff;
  position: relative;
  z-index: 5;
  transition: all 0.3s ease-out;
}

.offcanvas__contact-text a {
  font-size: 14px;
  font-weight: 500;
  color: #fff;
}

.offcanvas__contact-text a:hover {
  color: var(--theme-color);
}

.offcanvas__social {
  margin: 60px 0px;
}

.offcanvas__social ul li {
  display: inline-block;
}

.offcanvas__social ul li:not(:last-child) {
  margin-right: 5px;
}

.offcanvas__social ul li a {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid #fff;
  color: #fff;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  z-index: 5;
  transition: all 0.3s ease-out;
}

.offcanvas__social ul li a:hover {
  color: #fff;
  background-color: var(--theme-color);
  border-color: var(--theme-color);
}

/* ── Sidebar toggle (hamburger) ─────────────────────────────────── */
.sidebar__toggle {
  cursor: pointer;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 500ms ease-in-out;
}

.sidebar__toggle:hover {
  color: var(--theme-color);
}

.bar-icon {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  font-size: 40px;
  transform: scaleX(-1);
}

/* ── Mean menu (mobile nav) ─────────────────────────────────────── */
.mean-container a.meanmenu-reveal {
  display: none !important;
}

.mean-container .mean-nav {
  background: none;
  margin-top: 0;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
}

.mean-container .mean-nav>ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}

.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: #fff;
  font-size: 15px;
  line-height: 1.5;
  font-weight: 500;
  text-transform: capitalize;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  transition: color 0.3s;
}

.mean-container .mean-nav ul li a:hover {
  color: var(--theme-color);
}

.mean-container .mean-nav ul li a.mean-expand {
  margin-top: 5px;
  padding: 0 !important;
  height: 30px;
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  border-radius: 50%;
  font-weight: 400;
}

.mean-container .mean-nav ul li>a>i {
  display: none;
}

.mean-container .mean-nav ul li>a.mean-expand i {
  display: inline-block;
}

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

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  transform: rotate(45deg);
}

/* ── Desktop nav (main menu) ────────────────────────────────────── */
.main-menu ul {
  margin-bottom: 0;
}

.main-menu ul li {
  position: relative;
  list-style: none;
  display: inline-block;
  margin-inline-end: 30px;
}

.main-menu ul li:last-child {
  margin-inline-end: 0;
}

.main-menu ul li a {
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: #151515;
  padding: 30px 0;
  text-align: left;
  position: relative;
  transition: color 0.3s;
}

.main-menu ul li:hover>a {
  color: var(--theme-color);
}

.main-menu ul li.active>a {
  color: var(--theme-color);
}

.main-menu ul li:has(> .submenu)>a::after {
  content: "▽";
  display: inline-block;
  margin-left: 6px;
  font-size: 12px;
  line-height: 1;
  transform: translateY(-1px);
}

.main-menu ul li.has-dropdown>a {
  position: relative;
}

.main-menu ul li.has-mega-menu {
  position: static;
}

.main-menu ul li .submenu {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  min-width: 240px;
  background: #fff;
  z-index: 1001;
  visibility: hidden;
  opacity: 0;
  transform-origin: top center;
  color: var(--theme-color);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
}

.main-menu ul li .submenu li {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}

.main-menu ul li .submenu li.has-dropdown>a::after {
  position: absolute;
  top: 50%;
  inset-inline-end: 25px;
  transform: translateY(-50%);
  color: #151515;
}

.main-menu ul li .submenu li a {
  position: relative;
  z-index: 11;
  color: #151515;
  font-weight: 600;
  font-size: 14px;
  padding: 11px 25px;
  width: 100%;
  border-bottom: 1px solid #eeeeee;
}

.main-menu ul li .submenu li:last-child a {
  border: none;
}

.main-menu ul li .submenu li .submenu {
  inset-inline-start: 100%;
  top: 0;
  visibility: hidden;
  opacity: 0;
}

.main-menu ul li .submenu li:hover>a {
  background: #ECECEC;
}

.main-menu ul li .submenu li.sub-active>a {
  color: var(--theme-color);
}

.main-menu ul li .submenu li:hover>a::after {
  color: #fff;
}

.main-menu ul li .submenu li:hover>.submenu {
  transform: translateY(1);
  visibility: visible;
  opacity: 1;
}

.main-menu ul li .mega-menu {
  position: absolute;
  top: 100%;
  left: 0;
  padding: 40px 225px;
  background: #fff;
  box-shadow: 0px 20px 30px rgba(3, 4, 28, 0.1);
  visibility: hidden;
  opacity: 0;
  transform-origin: top center;
  border: 1px solid #d9d9d9;
  border-bottom: 0;
  z-index: 1001;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .main-menu ul li .mega-menu {
    padding: 40px 150px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu ul li .mega-menu {
    padding: 25px 25px;
    padding-inline-start: 80px;
  }
}

.main-menu ul li .mega-menu li {
  float: left;
  width: 25%;
  margin-inline-end: 0;
  text-align: left;
}

[dir=rtl] .main-menu ul li .mega-menu li {
  float: right;
  margin-left: 0;
  text-align: right;
}

.main-menu ul li .mega-menu li .mega-menu-title {
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #151515;
  cursor: text;
  padding: 0 0 5px;
  display: inline-block;
  margin-bottom: 15px;
  border-bottom: 1px solid #d9d9d9;
}

.main-menu ul li .mega-menu li .mega-menu-title::before {
  display: none;
}

.main-menu ul li .mega-menu li ul li {
  width: 100%;
  float: none;
  margin-bottom: 5px;
}

.main-menu ul li .mega-menu li ul li:last-child {
  margin-bottom: 0;
}

.main-menu ul li .mega-menu li ul li a {
  font-weight: 500;
  font-size: 15px;
  color: #5D636A;
  padding: 0;
  position: relative;
}

.main-menu ul li .mega-menu li ul li a::before {
  position: absolute;
  content: "";
  left: 0;
  right: auto;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 1.2px;
  background-color: var(--theme-color-1);
}

[dir=rtl] .main-menu ul li .mega-menu li ul li a::before {
  right: 0;
  left: auto;
}

.main-menu ul li .mega-menu li ul li:hover>a {
  color: var(--theme-color-1);
}

.main-menu ul li .mega-menu li ul li:hover>a::before {
  background-color: var(--theme-color-1);
}

.main-menu ul li .mega-menu li:hover>.mega-menu-title {
  color: var(--theme-color-1);
  padding-inline-start: 0;
}

.main-menu ul li .mega-menu li:hover>a {
  color: var(--theme-color-1);
}

.main-menu ul li .mega-menu li a:hover {
  padding-inline-start: 18px;
}

[dir=rtl] .main-menu ul li .mega-menu li a:hover {
  padding-inline-start: 18px;
  padding-inline-end: 0px;
}

.main-menu ul li .mega-menu li a:hover::before {
  width: 12px;
}

.main-menu ul li:hover>a::after {
  color: var(--theme-color-1);
}

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

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

/* ── Header layout ──────────────────────────────────────────────── */
.header-area {
  position: relative;
  z-index: 1000;
  padding: 0 50px;
  overflow-x: clip;
  box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
}

@media (max-width: 991px) {
  .header-area {
    padding: 20px 15px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area {
    padding: 0 15px;
  }
}

.header-logo {
  max-width: 240px;
}

@media (max-width: 575px),
only screen and (min-width: 576px) and (max-width: 767px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-logo {
    max-width: 145px;
  }
}

@media (max-width: 450px) {
  .header-logo {
    max-width: 200px;
  }
}

.header-logo img {
  width: 100%;
}

.header-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-left {
  display: flex;
  align-items: center;
  gap: 80px;
}

.header-right {
  gap: 40px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-left {
    gap: 45px;
  }

  .header-right {
    gap: 20px;
  }
}

@media (max-width: 991px) {
  .header-right {
    gap: 15px;
  }

  .header-main {
    flex-wrap: nowrap;
  }
}

.header-action {
  display: flex;
  align-items: center;
}

/* Hide Call-Us widget on screens narrower than 1400px (matches main.css) */
@media only screen and (max-width: 1399px) {
  .header-action .header-link-1 {
    display: none;
  }
}

/* Top bar */
.header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 150px;
  background: var(--theme-color-1);
}

@media (max-width: 991px) {
  .header-top {
    display: none;
  }
}

.header-top-contact-info {
  display: inline-flex;
  gap: 50px;
}

.header-top-contact-info span {
  color: #fff;
  display: flex;
  justify-content: center;
  font-size: 14px;
}

.header-top-contact-info span a {
  color: #fff;
}

.header-top-contact-info span a:hover {
  color: var(--theme-color);
}

.header-top-contact-info span.email {
  position: relative;
}

.header-top-contact-info span.email:before {
  content: "\e90a";
  font-family: 'icomoon';
  position: absolute;
  top: 0;
  left: -25px;
}

.header-top-contact-info span.time {
  position: relative;
}

.header-top-contact-info span.time:before {
  content: "\e92b";
  font-family: 'icomoon';
  position: absolute;
  top: 0;
  left: -25px;
}

.header-top-socials {
  color: #fff;
  display: inline-flex;
  gap: 20px;
  font-size: 14px;
}

.header-top-socials span>a {
  color: #fff;
}

.header-top-socials span:hover>a {
  color: var(--theme-color);
}

/* Call info widget */
.header-link-1 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-link-1 .icon {
  position: relative;
  height: 47px;
  width: 47px;
  border-radius: 50%;
  background: black;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  transform: rotate(-45deg);
}

.header-link-1 .icon:before {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  height: 57px;
  width: 57px;
  border: 1px solid black;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header-link-1 .content span {
  color: var(--theme-color-1);
  font-family: var(--primary-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 26px;
}

.header-link-1 .content h6 {
  color: var(--theme-color-1);
  margin: 0;
  font-family: var(--primary-font);
}

.header-link-1:hover .content h6 {
  color: var(--theme-color);
}

/* Sticky header */
.sticky {
  position: fixed !important;
  top: 0;
  z-index: 111;
  inset-inline-end: 0;
  inset-inline-start: 0;
  width: 100%;
  animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  background: #fff;
  box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
}

/* ── GET A QUOTE button ─────────────────────────────────────────── */
.primary-btn-1 {
  color: #fff;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
  background-color: var(--theme-color);
  border: 1px solid var(--theme-color);
  display: inline-flex;
  align-items: center;
  line-height: normal;
  white-space: nowrap;
  padding: 15px 22px;
  border-radius: 10px;
  gap: 10px;
  overflow: hidden;
  position: relative;
  z-index: 1;
  transition: all .6s;
}

.primary-btn-1 span {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  background-color: var(--theme-color-1);
  transition: all .6s;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.primary-btn-1:hover {
  color: #fff;
  border: 1px solid var(--theme-color-1);
}

.primary-btn-1:hover span {
  width: 225%;
  height: 1000.5px;
}

/* ── Large container ────────────────────────────────────────────── */
.large-container {
  max-width: 1620px;
  margin: 0 auto;
  padding: 0 15px;
}

/* ── Mega menu wrapper ──────────────────────────────────────────── */
.mega-menu-wrapper {
  position: relative;
}

/* ── icomoon icon helpers (used in header icons) ────────────────── */
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* ======================================================================== 
                              Custom CSS
==========================================================================*/
.d-title {
  font-size: 22px;
  margin: 15px 400px;
  padding: 5px 5px;
  border: 2px solid rgba(255, 208, 208, 0.233);
  border-radius: 25px;
  background-color: rgba(119, 178, 255, 0.075);
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.d-documents {
  text-align: center;
}

.d-documents object {
  width: 60%;
  height: 900px
}

.d-documents object {
  border: 3px solid rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

@media (max-width: 969px) {
  .d-title {
      margin: 15px 50px;
      padding: 2px 5px;
  }

  .d-documents object {
    width: 98%;
    height: 500px
  }
}

.header .topbar .contact-info i a {
    text-decoration: none !important;
}
.contact-map-panel {
    width: 100%;
    margin-top: 30px;
}
.carousel-item div h2 {
    color: #bff0ff;
}
.carousel-item div p {
    color: #ffff;
    font-size: 20px;
}
.service-period {
    margin-top: 15px;
    padding: 0px;
    display: block;
    background: #f1f5f9;
    border: 2px solid #e6ebef;
    border-radius: 15px;
}
.sb-container {
    padding: 3rem;
    background-color: color-mix(in srgb, var(--heading-color), transparent 90%);
    border-radius: 10px;
}
.sb-container .btn-cta, .sb-button .btn-cta {
    background-color: var(--accent-color);
    color: var(--contrast-color);
    padding: 0.75rem 2rem;
    font-weight: 600;
    border-radius: 50px;
    transition: all 0.3s ease;
}
.sb-container .btn-cta:hover, .sb-button .btn-cta:hover {
    background-color: color-mix(in srgb, var(--accent-color), #000 15%);
    transform: translateY(-3px);
}
.pricing .spricing-card {
    margin-bottom: 15px !important;
}
.pricing .splan-header {
    padding: 30px 30px 10px !important;
}
.pricing .splan-pricing {
    padding: 10px 30px 10px !important;
}
.pricing .splan-pricing .amount {
    font-size: 34px !important;
    overflow-wrap: anywhere;
}
.pricing .splan-features {
    padding: 20px 0px !important;
}
.pricing .splan-features ul li {
    padding: 8px 0 !important;
}
.message-header {
  display: flex;
  align-items: end;
  gap: 15px;
}
.message-header img{
  width: 8%;
  border-radius: 20px;
  box-shadow: rgb(194 204 215 / 50%) 0px 0px 0px 3px;
}
.message-title {
  font-size: 17px !important;
}

.cert-preview {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  margin-bottom: 24px;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: #f5f7fa;
}

.cert-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 12px;
  transition: transform 0.35s ease;
}

.cert-preview span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 26px;
  background: rgba(0, 0, 0, 0.46);
  opacity: 0;
  transition: opacity 0.35s ease;
}

.cert-preview:hover img {
  transform: scale(1.03);
}

.cert-preview:hover span {
  opacity: 1;
}


    /* PHP Email Form Messages */
    .php-email-form .error-message {
      display: none;
      background: #df1529;
      color: #ffffff;
      text-align: left;
      padding: 15px;
      margin-bottom: 24px;
      font-weight: 600;
    }

    .php-email-form .sent-message {
      display: none;
      color: #ffffff;
      background: #059652;
      text-align: center;
      padding: 15px;
      margin-bottom: 24px;
      font-weight: 600;
    }

    .php-email-form .loading {
      display: none;
      background: var(--surface-color);
      text-align: center;
      padding: 15px;
      margin-bottom: 24px;
    }

    .php-email-form .loading:before {
      content: "";
      display: inline-block;
      border-radius: 50%;
      width: 24px;
      height: 24px;
      margin: 0 10px -6px 0;
      border: 3px solid var(--accent-color);
      border-top-color: var(--surface-color);
      animation: php-email-form-loading 1s linear infinite;
    }

    @keyframes php-email-form-loading {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }
    
    /* Builder General CSS */
    :root {
      --default-font: Roboto, system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
      --heading-font: Ubuntu;
      --nav-font: Lato;
      --background-color: #f9fafb;
      --default-color: #333333;
      --heading-color: #102a49;
      --accent-color: #14529d;
      --surface-color: #ffffff;
      --contrast-color: #ffffff;
      --nav-color: #333333;
      --nav-hover-color: #14529d;
      --nav-mobile-background-color: #ffffff;
      --nav-dropdown-background-color: #ffffff;
      --nav-dropdown-color: #333333;
      --nav-dropdown-hover-color: #14529d;
      scroll-behavior: smooth;
    }

    body {
      color: var(--default-color);
      background-color: var(--background-color);
      font-family: var(--default-font);
    }

    a {
      color: var(--accent-color);
      text-decoration: none;
      transition: 0.3s;
    }

    a:hover {
      color: color-mix(in srgb, var(--accent-color), transparent 25%);
      text-decoration: none;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
      color: var(--heading-color);
      font-family: var(--heading-font);
    }

    section,
    .section {
      color: var(--default-color);
      background-color: var(--background-color);
      padding: 60px 0;
      scroll-margin-top: 90px;
      overflow: clip;
    }

    @media (max-width: 1199px) {

      section,
      .section {
        scroll-margin-top: 66px;
      }
    }

    .section-title {
      padding-bottom: 50px;
      position: relative;
    }

    .section-title h2 {
      font-size: 24px;
      font-weight: 700;
      padding: 0;
      line-height: 25px;
      margin: 0;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      position: relative;
    }

    .section-title h2::after {
      content: "";
      width: 120px;
      height: 1px;
      display: inline-block;
      background: var(--accent-color);
      margin: 4px 10px;
    }

    .section-title p {
      color: color-mix(in srgb, var(--default-color), transparent 50%);
      margin: 5px 0 0 0;
      font-size: 16px;
      font-weight: 500;
      font-family: var(--heading-font);
    }

    .page-title {
      color: var(--default-color);
      background-color: var(--background-color);
      padding: 25px 0;
      position: relative;
    }

    .page-title h1 {
      font-size: 24px;
      font-weight: 700;
    }

    .page-title .breadcrumbs ol {
      display: flex;
      flex-wrap: wrap;
      list-style: none;
      padding: 0;
      margin: 0;
      font-size: 14px;
      font-weight: 400;
    }

    .page-title .breadcrumbs ol li+li {
      padding-left: 10px;
    }

    .page-title .breadcrumbs ol li+li::before {
      content: "/";
      display: inline-block;
      padding-right: 10px;
      color: color-mix(in srgb, var(--default-color), transparent 70%);
    }

    .widgets-container {
      background-color: var(--surface-color);
      padding: 30px;
      margin: 60px 0 30px 0;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    }

    .widget-title {
      color: var(--heading-color);
      font-size: 20px;
      font-weight: 700;
      padding: 0;
      margin: 0 0 20px 0;
    }

    .widget-item {
      margin-bottom: 40px;
    }

    .widget-item:last-child {
      margin-bottom: 0;
    }
    
    /* Builder color presets */
    [data-colorpreset="cp-light-background"],
    .light-background {
      --background-color: #eff1f3;
      --surface-color: #ffffff;
    }

    [data-colorpreset="cp-dark-background"],
    .dark-background {
      --background-color: #14529d;
      --default-color: #ffffff;
      --heading-color: #ffffff;
      --accent-color: #ffffff;
      --surface-color: #252525;
      --contrast-color: #ffffff;
    }

    /* Header style */
    .header {
      color: var(--default-color);
      transition: all 0.5s;
      z-index: 997;
      background-color: var(--background-color);
    }

    .header .topbar {
      background-color: var(--background-color);
      height: 40px;
      padding: 0;
      font-size: 14px;
      transition: all 0.5s;
    }

    .header .topbar .contact-info i {
      font-style: normal;
      color: var(--contrast-color);
    }

    .header .topbar .contact-info i a,
    .header .topbar .contact-info i span {
      padding-left: 5px;
      color: var(--contrast-color);
    }

    @media (max-width: 575px) {

      .header .topbar .contact-info i a,
      .header .topbar .contact-info i span {
        font-size: 13px;
      }
    }

    .header .topbar .contact-info i a {
      line-height: 0;
      transition: 0.3s;
    }

    .header .topbar .contact-info i a:hover {
      color: var(--contrast-color);
      text-decoration: underline;
    }

    .header .topbar .social-links a {
      color: color-mix(in srgb, var(--contrast-color), transparent 40%);
      line-height: 0;
      transition: 0.3s;
      margin-left: 20px;
    }

    .header .topbar .social-links a:hover {
      color: var(--contrast-color);
    }

    .header .branding {
      min-height: 60px;
      padding: 10px 0;
    }

    .header .logo {
      line-height: 1;
    }

    .header .logo img {
      max-height: 60px;
      margin-right: 8px;
    }

    .header .logo h1 {
      font-size: 30px;
      margin: 0;
      font-weight: 700;
      color: var(--heading-color);
    }

    .scrolled .header {
      box-shadow: 0px 0 18px rgba(0, 0, 0, 0.1);
    }

    .scrolled .header .topbar {
      height: 0;
      visibility: hidden;
      overflow: hidden;
    }

    /* Header colors */
    .header {
      --background-color: #ffffff;
      --nav-color: #333333;
      --nav-hover-color: #14529d;
      --nav-mobile-background-color: #ffffff;
      --nav-dropdown-background-color: #ffffff;
      --nav-dropdown-color: #333333;
      --nav-dropdown-hover-color: #14529d;
    }
    
    /* Nav style */
    /* Navmenu - Desktop */
    @media (min-width: 1200px) {
      .navmenu {
        padding: 0;
      }

      .navmenu ul {
        margin: 0;
        padding: 0;
        display: flex;
        list-style: none;
        align-items: center;
      }

      .navmenu li {
        position: relative;
      }

      .navmenu a,
      .navmenu a:focus {
        color: var(--nav-color);
        padding: 18px 15px;
        font-size: 16px;
        font-family: var(--nav-font);
        font-weight: 600;
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: nowrap;
        transition: 0.3s;
      }

      .navmenu a i,
      .navmenu a:focus i {
        font-size: 12px;
        line-height: 0;
        margin-left: 5px;
        transition: 0.3s;
      }

      .navmenu li:last-child a {
        padding-right: 0;
      }

      .navmenu li:hover>a,
      .navmenu .active,
      .navmenu .active:focus {
        color: var(--nav-hover-color);
      }

      .navmenu .dropdown ul {
        margin: 0;
        padding: 10px 0;
        background: var(--nav-dropdown-background-color);
        display: block;
        position: absolute;
        visibility: hidden;
        left: 14px;
        top: 130%;
        opacity: 0;
        transition: 0.3s;
        border-radius: 4px;
        z-index: 99;
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
      }

      .navmenu .dropdown ul li {
        min-width: 200px;
      }

      .navmenu .dropdown ul a {
        padding: 10px 20px;
        font-size: 15px;
        text-transform: none;
        color: var(--nav-dropdown-color);
      }

      .navmenu .dropdown ul a i {
        font-size: 12px;
      }

      .navmenu .dropdown ul a:hover,
      .navmenu .dropdown ul .active:hover,
      .navmenu .dropdown ul li:hover>a {
        color: var(--nav-dropdown-hover-color);
      }

      .navmenu .dropdown:hover>ul {
        opacity: 1;
        top: 100%;
        visibility: visible;
      }

      .navmenu .dropdown .dropdown ul {
        top: 0;
        left: -90%;
        visibility: hidden;
      }

      .navmenu .dropdown .dropdown:hover>ul {
        opacity: 1;
        top: 0;
        left: -100%;
        visibility: visible;
      }
    }

    /* Navmenu - Mobile */
    @media (max-width: 1199px) {
      .mobile-nav-toggle {
        color: var(--nav-color);
        font-size: 28px;
        line-height: 0;
        margin-right: 10px;
        cursor: pointer;
        transition: color 0.3s;
      }

      .navmenu {
        padding: 0;
        z-index: 9997;
      }

      .navmenu ul {
        display: none;
        list-style: none;
        position: absolute;
        inset: 60px 20px 20px 20px;
        padding: 10px 0;
        margin: 0;
        border-radius: 6px;
        background-color: var(--nav-mobile-background-color);
        overflow-y: auto;
        transition: 0.3s;
        z-index: 9998;
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
      }

      .navmenu a,
      .navmenu a:focus {
        color: var(--nav-dropdown-color);
        padding: 10px 20px;
        font-family: var(--nav-font);
        font-size: 17px;
        font-weight: 500;
        display: flex;
        align-items: center;
        justify-content: space-between;
        white-space: nowrap;
        transition: 0.3s;
      }

      .navmenu a i,
      .navmenu a:focus i {
        font-size: 12px;
        line-height: 0;
        margin-left: 5px;
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        transition: 0.3s;
        background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      }

      .navmenu a i:hover,
      .navmenu a:focus i:hover {
        background-color: var(--accent-color);
        color: var(--contrast-color);
      }

      .navmenu a:hover,
      .navmenu .active,
      .navmenu .active:focus {
        color: var(--nav-dropdown-hover-color);
      }

      .navmenu .active i,
      .navmenu .active:focus i {
        background-color: var(--accent-color);
        color: var(--contrast-color);
        transform: rotate(180deg);
      }

      .navmenu .dropdown ul {
        position: static;
        display: none;
        z-index: 99;
        padding: 10px 0;
        margin: 10px 20px;
        background-color: var(--nav-dropdown-background-color);
        border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
        box-shadow: none;
        transition: all 0.5s ease-in-out;
      }

      .navmenu .dropdown ul ul {
        background-color: rgba(33, 37, 41, 0.1);
      }

      .navmenu .dropdown>.dropdown-active {
        display: block;
        background-color: rgba(33, 37, 41, 0.03);
      }

      .mobile-nav-active {
        overflow: hidden;
      }

      .mobile-nav-active .mobile-nav-toggle {
        color: #fff;
        position: absolute;
        font-size: 32px;
        top: 15px;
        right: 15px;
        margin-right: 0;
        z-index: 9999;
      }

      .mobile-nav-active .navmenu {
        position: fixed;
        overflow: hidden;
        inset: 0;
        background: rgba(33, 37, 41, 0.8);
        transition: 0.3s;
      }

      .mobile-nav-active .navmenu>ul {
        display: block;
      }
    }
    
    /* Footer style */
    .footer {
      color: var(--default-color);
      background-color: #17405c;
      font-size: 14px;
      position: relative;
    }

    .footer .footer-top {
      padding-top: 40px;
      border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .footer .footer-about .logo {
      line-height: 1;
      margin-bottom: 25px;
    }

    .footer .footer-about .logo img {
      max-height: 70px;
      margin-right: 6px;
    }

    .footer .footer-about .logo span {
      color: var(--heading-color);
      font-size: 30px;
      font-weight: 700;
      letter-spacing: 1px;
      font-family: var(--heading-font);
    }

    .footer .footer-about p {
      font-size: 14px;
      font-family: var(--heading-font);
    }

    .footer .social-links a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 50%);
      font-size: 16px;
      color: color-mix(in srgb, var(--default-color), transparent 50%);
      margin-right: 10px;
      transition: 0.3s;
    }

    .footer .social-links a:hover {
      color: var(--accent-color);
      border-color: var(--accent-color);
    }

    .footer h4 {
      font-size: 16px;
      font-weight: bold;
      position: relative;
      padding-bottom: 12px;
    }

    .footer .footer-links {
      margin-bottom: 30px;
    }

    .footer .footer-links ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .footer .footer-links ul i {
      padding-right: 2px;
      font-size: 12px;
      line-height: 0;
    }

    .footer .footer-links ul li {
      padding: 10px 0;
      display: flex;
      align-items: center;
    }

    .footer .footer-links ul li:first-child {
      padding-top: 0;
    }

    .footer .footer-links ul a {
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      display: inline-block;
      line-height: 1;
    }

    .footer .footer-links ul a:hover {
      color: var(--accent-color);
    }

    .footer .footer-contact p {
      margin-bottom: 5px;
    }

    .footer .copyright {
      padding-top: 15px;
      padding-bottom: 15px;
      background-color: color-mix(in srgb, var(--default-color), transparent 95%);
    }

    .footer .copyright p {
      margin-bottom: 0;
    }

    .footer .credits {
      margin-top: 6px;
      font-size: 13px;
    }
    
    /* Scroll to top style */
    .scroll-top {
      position: fixed;
      visibility: hidden;
      opacity: 0;
      right: 15px;
      bottom: 15px;
      z-index: 99999;
      background-color: var(--accent-color);
      width: 40px;
      height: 40px;
      border-radius: 4px;
      transition: all 0.4s;
    }

    .scroll-top i {
      font-size: 24px;
      color: var(--contrast-color);
      line-height: 0;
    }

    .scroll-top:hover {
      background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
      color: var(--contrast-color);
    }

    .scroll-top.active {
      visibility: visible;
      opacity: 1;
    }
    
    /* Section 84YXerFvX5 */
    .about {
      position: relative;
    }

    .about .about-content h2 {
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: 1.5rem;
      position: relative;
    }

    .about .about-content h2:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -0.5rem;
      width: 80px;
      height: 4px;
      background-color: var(--accent-color);
    }

    .about .about-content .lead {
      font-size: 1.15rem;
      margin-bottom: 1.5rem;
      color: color-mix(in srgb, var(--heading-color), transparent 10%);
    }

    .about .about-content p {
      margin-bottom: 1rem;
      line-height: 1.7;
    }

    .about .achievement-boxes .achievement-box {
      background-color: var(--surface-color);
      border-left: 4px solid var(--accent-color);
      padding: 1.2rem;
      height: 100%;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
      transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
      border-radius: 10px;
    }

    .about .achievement-boxes .achievement-box:hover {
      transform: translateY(-8px);
      border-left-color: color-mix(in srgb, var(--accent-color), #000 15%);
      box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1);
    }

    .about .achievement-boxes .achievement-box h3,
    .about .achievement-boxes .achievement-box p {
      transition: transform 0.3s ease, color 0.3s ease;
    }

    .about .achievement-boxes .achievement-box:hover h3 {
      transform: translateY(-2px) scale(1.04);
    }

    .about .achievement-boxes .achievement-box:hover p {
      color: var(--heading-color);
    }

    .about .achievement-boxes .achievement-box h3 {
      font-size: 2rem;
      font-weight: 700;
      margin-bottom: 0.3rem;
      color: var(--accent-color);
    }

    .about .achievement-boxes .achievement-box p {
      margin-bottom: 0;
      font-size: 0.9rem;
      font-weight: 500;
    }

    .about .certifications h5 {
      font-size: 1.1rem;
      margin-bottom: 1rem;
      font-weight: 600;
    }

    .about .certifications img {
      transition: transform 0.3s ease;
      filter: grayscale(100%);
      opacity: 0.7;
    }

    .about .certifications img:hover {
      filter: grayscale(0);
      opacity: 1;
      transform: scale(1.05);
    }

    .about .cta-container .btn-primary {
      background-color: var(--accent-color);
      border-color: var(--accent-color);
      color: var(--contrast-color);
      padding: 0.75rem 1.5rem;
      font-weight: 500;
      border-radius: 10px;
      transition: all 0.3s ease;
    }

    .about .cta-container .btn-primary:hover {
      background-color: color-mix(in srgb, var(--accent-color), #000 10%);
      border-color: color-mix(in srgb, var(--accent-color), #000 10%);
      transform: translateY(-3px);
      box-shadow: 0 5px 15px color-mix(in srgb, var(--accent-color), transparent 70%);
    }

    .about .about-image {
      position: relative;
    }

    .about .about-image .main-image {
      border-radius: 8px;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
      width: 100%;
      transition: transform 0.45s ease, box-shadow 0.45s ease, filter 0.45s ease;
    }

    .about .about-image:hover .main-image {
      transform: translateY(-8px) scale(1.015);
      filter: saturate(1.05);
      box-shadow: 0 22px 42px rgba(0, 0, 0, 0.14);
    }

    .about .about-image .image-overlay {
      position: absolute;
      bottom: -60px;
      right: -30px;
      width: 50%;
      z-index: 2;
      border-radius: 8px;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
      transition: transform 0.45s ease, box-shadow 0.45s ease;
    }

    .about .about-image:hover .image-overlay {
      transform: translate(-8px, -8px) scale(1.03);
      box-shadow: 0 20px 38px rgba(0, 0, 0, 0.18);
    }

    .about .about-image .image-overlay img {
      border: 5px solid var(--background-color);
    }

    .about .about-image .experience-badge {
      position: absolute;
      top: 30px;
      left: -30px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      padding: 1.5rem;
      border-radius: 50%;
      width: 130px;
      height: 130px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      box-shadow: 0 10px 25px color-mix(in srgb, var(--accent-color), transparent 60%);
      transition: transform 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
    }

    .about .about-image:hover .experience-badge {
      transform: rotate(-5deg) scale(1.06);
      background-color: color-mix(in srgb, var(--accent-color), #000 10%);
      box-shadow: 0 16px 32px color-mix(in srgb, var(--accent-color), transparent 52%);
    }

    .about .about-image .experience-badge span {
      font-size: 1.3rem;
      font-weight: 700;
      line-height: 1;
    }

    .about .about-image .experience-badge p {
      font-size: 0.8rem;
      margin-bottom: 0;
      margin-top: 0.3rem;
    }

    @media (max-width: 991.98px) {
      .about .about-image {
        margin-top: 3rem;
      }

      .about .about-image .image-overlay {
        bottom: -40px;
        right: -20px;
      }

      .about .about-image .experience-badge {
        width: 100px;
        height: 100px;
        padding: 1rem;
        left: -20px;
      }

      .about .about-image .experience-badge span {
        font-size: 1rem;
      }

      .about .about-image .experience-badge p {
        font-size: 0.7rem;
      }
    }

    @media (max-width: 767.98px) {
      .about .achievement-boxes .achievement-box {
        padding: 1rem;
      }

      .about .achievement-boxes .achievement-box h3 {
        font-size: 1.8rem;
      }

      .about .achievement-boxes .achievement-box p {
        font-size: 0.8rem;
      }

      .about .about-image .image-overlay {
        bottom: -30px;
        right: 0;
        width: 40%;
      }
    }
    
    /* Section akhuivJo6L */
    .services {
      position: relative;
    }

    .services .service-card {
      background-color: var(--surface-color);
      padding: 2.5rem;
      border-radius: 8px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
      height: 100%;
      position: relative;
      transition: all 0.3s ease;
      overflow: hidden;
    }

    .services .service-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    }

    .services .service-card.featured {
      border: 2px solid var(--accent-color);
    }

    .services .service-card.featured .service-icon {
      background-color: color-mix(in srgb, var(--accent-color), transparent 85%);
    }

    .services .service-card .service-badge {
      position: absolute;
      top: 0;
      right: 0;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      font-size: 0.75rem;
      font-weight: 600;
      padding: 0.25rem 1rem;
      border-radius: 0 0 0 8px;
    }

    .services .service-card .service-icon {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.5rem;
      background-color: color-mix(in srgb, var(--heading-color), transparent 90%);
      transition: all 0.3s ease;
    }

    .services .service-card .service-icon i {
      font-size: 2rem;
      color: var(--accent-color);
    }

    .services .service-card h3 {
      font-size: 1.5rem;
      margin-bottom: 1rem;
      font-weight: 700;
    }

    .services .service-card p {
      margin-bottom: 1.5rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .services .service-card .service-features {
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
      margin-bottom: 1.5rem;
    }

    .services .service-card .service-features span {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      font-size: 0.9rem;
    }

    .services .service-card .service-features span i {
      color: var(--accent-color);
    }

    .services .service-card .service-link {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      font-weight: 600;
      color: var(--accent-color);
      transition: all 0.3s ease;
    }

    .services .service-card .service-link:hover {
      gap: 0.75rem;
    }

    .services .service-image-block {
      height: 100%;
      border-radius: 8px;
      overflow: hidden;
      /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); */
    }

    .services .service-image-block img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .services .service-list-block {
      height: 100%;
      padding: 2rem;
      display: flex;
      flex-direction: column;
    }

    .services .service-list-block h3 {
      font-size: 1.75rem;
      margin-bottom: 1rem;
      font-weight: 700;
    }

    .services .service-list-block p {
      margin-bottom: 2rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .services .service-list {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }

    .services .service-list-item {
      display: flex;
      gap: 1rem;
      padding-bottom: 1.5rem;
      border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .services .service-list-item:last-child {
      border-bottom: none;
      padding-bottom: 0;
    }

    .services .service-list-item .service-list-icon {
      flex-shrink: 0;
      width: 50px;
      height: 50px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: color-mix(in srgb, var(--accent-color), transparent 85%);
    }

    .services .service-list-item .service-list-icon i {
      font-size: 1.5rem;
      color: var(--accent-color);
    }

    .services .service-list-item .service-list-content h4 {
      font-size: 1.2rem;
      margin-bottom: 0.5rem;
      font-weight: 600;
    }

    .services .service-list-item .service-list-content p {
      margin-bottom: 0;
      font-size: 0.95rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .services .cta-container {
      margin-top: 5rem;
      padding: 3rem;
      background-color: color-mix(in srgb, var(--heading-color), transparent 90%);
      border-radius: 10px;
    }

    .services .cta-container h3 {
      font-size: 1.75rem;
      margin-bottom: 1rem;
      color: var(--heading-color);
    }

    .services .cta-container p {
      max-width: 700px;
      margin: 0 auto 2rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .services .cta-container .btn-cta {
      background-color: var(--accent-color);
      color: var(--contrast-color);
      padding: 0.75rem 2rem;
      font-weight: 600;
      border-radius: 50px;
      transition: all 0.3s ease;
    }

    .services .cta-container .btn-cta:hover {
      background-color: color-mix(in srgb, var(--accent-color), #000 15%);
      transform: translateY(-3px);
    }

    @media (max-width: 992px) {
      .services .service-list-block {
        margin-top: 2rem;
      }

      .services .service-card {
        padding: 2rem;
      }

      .services .cta-container {
        padding: 2rem;
      }

      .services .cta-container h3 {
        font-size: 1.5rem;
      }
    }

    @media (max-width: 768px) {
      .services .service-list-item {
        flex-direction: column;
        gap: 1rem;
      }

      .services .service-list-item .service-list-icon {
        margin-bottom: 0.5rem;
      }
    }
    
    /* Section fHBdmv3qfa */
    .projects .projects-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
      gap: 40px;
    }

    @media (max-width: 992px) {
      .projects .projects-grid {
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 30px;
      }
    }

    @media (max-width: 576px) {
      .projects .projects-grid {
        grid-template-columns: 1fr;
        gap: 25px;
      }
    }

    .projects .project-item {
      display: flex;
      background: var(--surface-color);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 8px 32px color-mix(in srgb, var(--default-color), transparent 92%);
      transition: all 0.4s ease;
      min-height: 280px;
    }

    .projects .project-item:hover {
      transform: translateY(-5px);
      box-shadow: 0 20px 60px color-mix(in srgb, var(--default-color), transparent 85%);
    }

    .projects .project-item:hover .project-visual img {
      transform: scale(1.08);
    }

    .projects .project-item:hover .project-link {
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .projects .project-item:hover .project-link i {
      transform: translateX(5px);
    }

    @media (max-width: 768px) {
      .projects .project-item {
        flex-direction: column;
        min-height: auto;
      }
    }

    .projects .project-content {
      flex: 1;
      padding: 30px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    @media (max-width: 768px) {
      .projects .project-content {
        padding: 25px;
      }
    }

    .projects .project-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 15px;
    }

    .projects .project-category {
      background: color-mix(in srgb, var(--accent-color), transparent 85%);
      color: var(--accent-color);
      padding: 6px 14px;
      border-radius: 20px;
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.8px;
    }

    .projects .project-status {
      padding: 4px 10px;
      border-radius: 12px;
      font-size: 10px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .projects .project-status.completed {
      background: #22c55e;
      color: #ffffff;
    }

    .projects .project-status.in-progress {
      background: var(--accent-color);
      color: #ffffff;
    }

    .projects .project-status.planning {
      background: #f59e0b;
      color: #ffffff;
    }

    .projects .project-title {
      font-size: 22px;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 15px;
      line-height: 1.3;
    }

    @media (max-width: 768px) {
      .projects .project-title {
        font-size: 20px;
      }
    }

    .projects .project-details {
      margin-bottom: 25px;
    }

    .projects .project-info {
      margin-bottom: 20px;
    }

    .projects .project-info p {
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      font-size: 14px;
      line-height: 1.6;
      margin-bottom: 15px;
    }

    .projects .project-specs {
      display: flex;
      gap: 20px;
      margin-bottom: 15px;
    }

    @media (max-width: 576px) {
      .projects .project-specs {
        flex-direction: column;
        gap: 8px;
      }
    }

    .projects .spec-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 12px;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      font-weight: 500;
    }

    .projects .spec-item i {
      color: var(--accent-color);
      font-size: 14px;
    }

    .projects .project-location {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 0;
      border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .projects .project-location i {
      color: var(--accent-color);
      font-size: 14px;
    }

    .projects .project-location span {
      font-size: 13px;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-weight: 500;
    }

    .projects .project-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      color: var(--accent-color);
      padding: 12px 20px;
      border-radius: 25px;
      text-decoration: none;
      font-weight: 600;
      font-size: 13px;
      transition: all 0.3s ease;
      align-self: flex-start;
    }

    .projects .project-link i {
      font-size: 12px;
      transition: transform 0.3s ease;
    }

    .projects .project-visual {
      flex: 0 0 200px;
      position: relative;
      overflow: hidden;
    }

    @media (max-width: 768px) {
      .projects .project-visual {
        flex: none;
        height: 200px;
      }
    }

    .projects .project-visual img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.4s ease;
    }

    .projects .project-badge {
      position: absolute;
      top: 15px;
      right: 15px;
      width: 40px;
      height: 40px;
      background: color-mix(in srgb, var(--surface-color), transparent 10%);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      backdrop-filter: blur(10px);
    }

    .projects .project-badge i {
      color: var(--accent-color);
      font-size: 16px;
    }
    
    /* Section XP2F4BZzNE */
    .certifications {
      padding: 100px 0;
      background: linear-gradient(135deg, var(--background-color) 0%, color-mix(in srgb, var(--accent-color), transparent 95%) 100%);
    }

    .certifications .content h2 {
      font-size: 2.75rem;
      font-weight: 600;
      margin-bottom: 1.5rem;
      color: var(--heading-color);
      line-height: 1.2;
    }

    .certifications .content p {
      font-size: 1.1rem;
      line-height: 1.8;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      margin-bottom: 0;
    }

    .certifications .badge-highlight {
      display: flex;
      align-items: center;
      background: var(--surface-color);
      padding: 2rem;
      border-radius: 16px;
      box-shadow: 0 10px 40px color-mix(in srgb, var(--accent-color), transparent 85%);
      border: 1px solid color-mix(in srgb, var(--accent-color), transparent 80%);
    }

    .certifications .badge-highlight img {
      width: 80px;
      height: 80px;
      object-fit: contain;
      margin-right: 1.5rem;
      flex-shrink: 0;
    }

    .certifications .badge-highlight .badge-content h4 {
      font-size: 1.4rem;
      font-weight: 600;
      color: var(--heading-color);
      margin-bottom: 0.5rem;
    }

    .certifications .badge-highlight .badge-content p {
      font-size: 0.95rem;
      margin-bottom: 0;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .certifications .certification-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
      gap: 2rem;
      margin: 4rem 0;
    }

    .certifications .certification-grid .cert-card {
      background: var(--surface-color);
      border-radius: 12px;
      padding: 2rem;
      box-shadow: 0 8px 30px color-mix(in srgb, var(--default-color), transparent 90%);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
      display: flex;
      align-items: flex-start;
      gap: 1.5rem;
      transition: all 0.4s ease;
      position: relative;
      overflow: hidden;
    }

    .certifications .certification-grid .cert-card::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 4px;
      height: 100%;
      background: var(--accent-color);
      transform: scaleY(0);
      transform-origin: bottom;
      transition: transform 0.4s ease;
    }

    .certifications .certification-grid .cert-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 15px 50px color-mix(in srgb, var(--accent-color), transparent 75%);
    }

    .certifications .certification-grid .cert-card:hover::before {
      transform: scaleY(1);
    }

    .certifications .certification-grid .cert-card:hover .cert-icon img {
      transform: scale(1.1);
    }

    .certifications .certification-grid .cert-card .cert-icon {
      width: 70px;
      height: 70px;
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      padding: 0.8rem;
    }

    .certifications .certification-grid .cert-card .cert-icon img {
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      transition: transform 0.4s ease;
    }

    .certifications .certification-grid .cert-card .cert-details {
      flex: 1;
    }

    .certifications .certification-grid .cert-card .cert-details h5 {
      font-size: 1.3rem;
      font-weight: 600;
      color: var(--heading-color);
      margin-bottom: 0.3rem;
    }

    .certifications .certification-grid .cert-card .cert-details .cert-category {
      display: inline-block;
      background: var(--accent-color);
      color: var(--contrast-color);
      font-size: 0.75rem;
      padding: 0.3rem 0.8rem;
      border-radius: 20px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 1rem;
    }

    .certifications .certification-grid .cert-card .cert-details p {
      font-size: 0.9rem;
      line-height: 1.6;
      color: color-mix(in srgb, var(--default-color), transparent 35%);
      margin-bottom: 0;
    }

    .certifications .achievements-banner {
      background: var(--surface-color);
      border-radius: 16px;
      padding: 3rem 2rem;
      box-shadow: 0 12px 40px color-mix(in srgb, var(--default-color), transparent 88%);
      border: 2px solid color-mix(in srgb, var(--accent-color), transparent 85%);
      margin-top: 3rem;
    }

    .certifications .achievements-banner .achievement-item {
      padding: 1rem;
    }

    .certifications .achievements-banner .achievement-item i {
      font-size: 2.5rem;
      color: var(--accent-color);
      margin-bottom: 1rem;
      display: block;
    }

    .certifications .achievements-banner .achievement-item h3 {
      font-size: 2.8rem;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 0.5rem;
      line-height: 1;
    }

    .certifications .achievements-banner .achievement-item p {
      font-size: 0.95rem;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      margin-bottom: 0;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      font-weight: 500;
    }

    @media (max-width: 992px) {
      .certifications .certification-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
      }

      .certifications .certification-grid .cert-card {
        padding: 1.5rem;
        gap: 1rem;
      }

      .certifications .certification-grid .cert-card .cert-icon {
        width: 60px;
        height: 60px;
      }
    }

    @media (max-width: 768px) {
      .certifications {
        padding: 80px 0;
      }

      .certifications h2 {
        font-size: 2.2rem;
      }

      .certifications .badge-highlight {
        flex-direction: column;
        text-align: center;
        padding: 1.5rem;
      }

      .certifications .badge-highlight img {
        margin-right: 0;
        margin-bottom: 1rem;
      }

      .certifications .cert-card {
        flex-direction: column;
        text-align: center;
      }

      .certifications .cert-card .cert-icon {
        margin: 0 auto;
      }

      .certifications .achievements-banner {
        padding: 2rem 1rem;
      }

      .certifications .achievements-banner .achievement-item {
        margin-bottom: 2rem;
      }

      .certifications .achievements-banner .achievement-item:last-child {
        margin-bottom: 0;
      }

      .certifications .achievements-banner .achievement-item h3 {
        font-size: 2.2rem;
      }
    }
    
    /* Section Fr5a8SsVT9 */
    .call-to-action {
      position: relative;
    }

    .call-to-action::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(45deg, color-mix(in srgb, var(--accent-color), transparent 98%) 0%, color-mix(in srgb, var(--heading-color), transparent 97%) 100%);
      z-index: 1;
    }

    .call-to-action .container {
      position: relative;
      z-index: 2;
    }

    .call-to-action .cta-hero-content .badge-wrapper {
      margin-bottom: 2rem;
    }

    .call-to-action .cta-hero-content .badge-wrapper .cta-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--accent-color);
      color: var(--contrast-color);
      padding: 8px 20px;
      border-radius: 25px;
      font-size: 0.9rem;
      font-weight: 600;
    }

    .call-to-action .cta-hero-content .badge-wrapper .cta-badge i {
      font-size: 1rem;
    }

    .call-to-action .cta-hero-content h2 {
      font-size: 3.2rem;
      font-weight: 800;
      line-height: 1.1;
      margin-bottom: 1.5rem;
      color: var(--heading-color);
    }

    @media (max-width: 992px) {
      .call-to-action .cta-hero-content h2 {
        font-size: 2.8rem;
      }
    }

    @media (max-width: 768px) {
      .call-to-action .cta-hero-content h2 {
        font-size: 2.2rem;
      }
    }

    .call-to-action .cta-hero-content p {
      font-size: 1.1rem;
      line-height: 1.7;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      margin-bottom: 2.5rem;
    }

    .call-to-action .cta-hero-content .feature-highlights {
      display: flex;
      flex-direction: column;
      gap: 15px;
    }

    .call-to-action .cta-hero-content .feature-highlights .highlight-item {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .call-to-action .cta-hero-content .feature-highlights .highlight-item i {
      color: var(--accent-color);
      font-size: 1.1rem;
      flex-shrink: 0;
    }

    .call-to-action .cta-hero-content .feature-highlights .highlight-item span {
      font-size: 1rem;
      color: var(--default-color);
      font-weight: 500;
    }

    .call-to-action .cta-form-section .form-container {
      background: var(--surface-color);
      border-radius: 20px;
      padding: 40px;
      box-shadow: 0 25px 80px color-mix(in srgb, var(--default-color), transparent 88%);
      border: 1px solid color-mix(in srgb, var(--accent-color), transparent 90%);
    }

    @media (max-width: 768px) {
      .call-to-action .cta-form-section .form-container {
        padding: 30px 25px;
      }
    }

    .call-to-action .cta-form-section .form-header {
      text-align: center;
      margin-bottom: 2rem;
    }

    .call-to-action .cta-form-section .form-header h3 {
      font-size: 1.8rem;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 0.5rem;
    }

    .call-to-action .cta-form-section .form-header p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 1rem;
      margin: 0;
    }

    .call-to-action .cta-form-section .form-group {
      margin-bottom: 1rem;
    }

    .call-to-action .cta-form-section .form-group input,
    .call-to-action .cta-form-section .form-group select,
    .call-to-action .cta-form-section .form-group textarea {
      width: 100%;
      padding: 15px 20px;
      border: 2px solid color-mix(in srgb, var(--default-color), transparent 85%);
      border-radius: 10px;
      font-size: 1rem;
      transition: all 0.3s ease;
      color: var(--default-color);
      background-color: var(--surface-color);
    }

    .call-to-action .cta-form-section .form-group input:focus,
    .call-to-action .cta-form-section .form-group select:focus,
    .call-to-action .cta-form-section .form-group textarea:focus {
      outline: none;
      border-color: var(--accent-color);
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color), transparent 90%);
    }

    .call-to-action .cta-form-section .form-group input::placeholder,
    .call-to-action .cta-form-section .form-group select::placeholder,
    .call-to-action .cta-form-section .form-group textarea::placeholder {
      color: color-mix(in srgb, var(--default-color), transparent 60%);
    }

    .call-to-action .cta-form-section .form-group select {
      cursor: pointer;
    }

    .call-to-action .cta-form-section .form-group textarea {
      resize: vertical;
      min-height: 100px;
    }

    .call-to-action .cta-form-section .form-actions {
      margin-top: 2rem;
      text-align: center;
    }

    .call-to-action .cta-form-section .form-actions .btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: var(--accent-color);
      color: var(--contrast-color);
      border: none;
      padding: 15px 35px;
      border-radius: 10px;
      font-size: 1.1rem;
      font-weight: 600;
      transition: all 0.3s ease;
      text-decoration: none;
      width: 100%;
      justify-content: center;
      margin-bottom: 1.5rem;
    }

    .call-to-action .cta-form-section .form-actions .btn-primary:hover {
      background: color-mix(in srgb, var(--accent-color), black 15%);
      transform: translateY(-2px);
      box-shadow: 0 8px 25px color-mix(in srgb, var(--accent-color), transparent 60%);
    }

    .call-to-action .cta-form-section .form-actions .btn-primary i {
      font-size: 1.2rem;
    }

    .call-to-action .cta-form-section .form-actions .contact-alternative {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
    }

    .call-to-action .cta-form-section .form-actions .contact-alternative span {
      font-size: 0.9rem;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
    }

    .call-to-action .cta-form-section .form-actions .contact-alternative .phone-link {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--accent-color);
      font-weight: 600;
      font-size: 1.1rem;
      text-decoration: none;
      transition: all 0.3s ease;
    }

    .call-to-action .cta-form-section .form-actions .contact-alternative .phone-link:hover {
      color: color-mix(in srgb, var(--accent-color), black 15%);
    }

    .call-to-action .cta-form-section .form-actions .contact-alternative .phone-link i {
      font-size: 1rem;
    }

    .call-to-action .cta-form-section .trust-indicators {
      margin-top: 2rem;
      padding-top: 2rem;
      border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item {
      text-align: center;
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item .trust-icon {
      margin-bottom: 10px;
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item .trust-icon i {
      font-size: 1.5rem;
      color: var(--accent-color);
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item .trust-content {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item .trust-content .trust-number {
      font-size: 1.2rem;
      font-weight: 700;
      color: var(--heading-color);
      line-height: 1;
    }

    .call-to-action .cta-form-section .trust-indicators .trust-item .trust-content .trust-label {
      font-size: 0.8rem;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      font-weight: 500;
    }

    @media (max-width: 992px) {
      .call-to-action .cta-hero-content {
        margin-bottom: 3rem;
        text-align: center;
      }
    }
    
    /* Section 0HLDVH7q2w */
    .contact .container {
      max-width: 1280px;
    }

    .contact .contact-wrapper {
      display: grid;
      grid-template-columns: 1fr;
      gap: 40px;
    }

    @media (min-width: 992px) {
      .contact .contact-wrapper {
        grid-template-columns: 38% 62%;
        gap: 30px;
      }
    }

    .contact .contact-info-panel {
      background: linear-gradient(145deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #1a4372 40%));
      color: var(--contrast-color);
      border-radius: 20px;
      padding: 40px 30px;
      height: 100%;
      display: flex;
      flex-direction: column;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    }

    .contact .contact-info-panel .contact-info-header {
      margin-bottom: 30px;
    }

    .contact .contact-info-panel .contact-info-header h3 {
      font-size: 28px;
      font-weight: 700;
      margin-bottom: 15px;
      color: var(--contrast-color);
    }

    .contact .contact-info-panel .contact-info-header p {
      font-size: 15px;
      opacity: 0.85;
      line-height: 1.6;
    }

    .contact .contact-info-cards {
      display: grid;
      grid-template-columns: 1fr;
      gap: 20px;
      margin-bottom: auto;
    }

    @media (min-width: 576px) and (max-width: 991px) {
      .contact .contact-info-cards {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    .contact .info-card {
      background-color: rgba(255, 255, 255, 0.1);
      border-radius: 12px;
      padding: 20px;
      display: flex;
      align-items: center;
      gap: 15px;
      backdrop-filter: blur(5px);
      transition: all 0.3s ease;
    }

    .contact .info-card:hover {
      background-color: rgba(255, 255, 255, 0.2);
      transform: translateY(-5px);
    }

    .contact .info-card .icon-container {
      width: 45px;
      height: 45px;
      flex-shrink: 0;
      background-color: rgba(255, 255, 255, 0.25);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .contact .info-card .icon-container i {
      font-size: 20px;
      color: var(--contrast-color);
    }

    .contact .info-card .card-content h4 {
      font-size: 16px;
      font-weight: 600;
      margin-bottom: 5px;
      color: var(--contrast-color);
    }

    .contact .info-card .card-content p {
      font-size: 14px;
      margin-bottom: 0;
      opacity: 0.8;
    }

    .contact .social-links-panel {
      margin-top: 35px;
    }

    .contact .social-links-panel h5 {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 15px;
      color: var(--contrast-color);
    }

    .contact .social-links-panel .social-icons {
      display: flex;
      gap: 12px;
    }

    .contact .social-links-panel .social-icons a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background-color: rgba(255, 255, 255, 0.15);
      color: var(--contrast-color);
      font-size: 18px;
      transition: all 0.3s ease;
    }

    .contact .social-links-panel .social-icons a:hover {
      background-color: rgba(255, 255, 255, 0.3);
      transform: translateY(-5px);
    }

    .contact .contact-form-panel {
      display: flex;
      flex-direction: column;
      gap: 30px;
    }

    .contact .map-container {
      width: 100%;
      height: 280px;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    }

    .contact .form-container {
      background-color: var(--surface-color);
      border-radius: 20px;
      padding: 35px;
      box-shadow: 0 5px 25px rgba(0, 0, 0, 0.06);
    }

    .contact .form-container h3 {
      font-size: 26px;
      font-weight: 700;
      margin-bottom: 15px;
      color: var(--heading-color);
      background: linear-gradient(120deg, var(--heading-color), color-mix(in srgb, var(--heading-color), var(--accent-color) 30%));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .contact .form-container p {
      font-size: 15px;
      color: color-mix(in srgb, var(--default-color), transparent 15%);
      margin-bottom: 25px;
    }

    .contact .form-container .form-floating {
      margin-bottom: 20px;
    }

    .contact .form-container .form-floating .form-control {
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 80%);
      padding: 24px 20px 8px 20px;
      height: calc(3.5rem + 3px);
      background-color: var(--surface-color);
      color: var(--default-color);
      transition: all 0.3s ease;
    }

    .contact .form-container .form-floating .form-control:focus {
      box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-color), transparent 85%);
      border-color: color-mix(in srgb, var(--accent-color), transparent 40%);
      background-color: var(--surface-color);
    }

    .contact .form-container .form-floating .form-control::placeholder {
      color: transparent;
    }

    .contact .form-container .form-floating label {
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      padding: 1rem 1.25rem 2.5rem 1.25rem;
    }

    .contact .form-container .form-floating label::after {
      background-color: transparent;
    }

    .contact .form-container .btn-submit {
      background: linear-gradient(145deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #1a4372 30%));
      color: var(--contrast-color);
      border: none;
      padding: 15px 25px;
      border-radius: 12px;
      font-weight: 600;
      font-size: 16px;
      transition: all 0.3s ease;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .contact .form-container .btn-submit:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 20px color-mix(in srgb, var(--accent-color), transparent 75%);
    }

    .contact .form-container .btn-submit i {
      transition: transform 0.3s ease;
    }

    .contact .form-container .btn-submit:hover i {
      transform: translateX(5px);
    }

    @media (max-width: 768px) {
      .contact .contact-info-panel {
        padding: 30px 25px;
      }

      .contact .form-container {
        padding: 30px 25px;
      }
    }

    @media (max-width: 576px) {
      .contact .social-links-panel .social-icons {
        flex-wrap: wrap;
      }
    }
    
    /* Section tj2mjhLcI1 */
    .contact-2 {
      margin-top: 80px;
    }

    @media only screen and (max-width: 480px) {
      .contact-2 {
        margin-top: 20px;
      }
    }

    .contact-link {
      color: white;
      font-size: 14px;
    }
    
    .contact-link:hover {
      color: rgb(220, 242, 255)
    }

    .contact-2 .container {
      max-width: 1280px;
    }

    .contact-2 .contact-wrapper {
      display: grid;
      grid-template-columns: 1fr;
      gap: 40px;
    }

    @media (min-width: 992px) {
      .contact-2 .contact-wrapper {
        grid-template-columns: 38% 60%;
        gap: 30px;
      }
    }

    .contact-2 .contact-info-panel {
      background: linear-gradient(145deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #1a4372 40%));
      color: var(--contrast-color);
      border-radius: 20px;
      padding: 40px 30px;
      height: 100%;
      display: flex;
      flex-direction: column;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    }

    .contact-2 .contact-info-panel .contact-info-header {
      margin-bottom: 30px;
    }

    .contact-2 .contact-info-panel .contact-info-header h3 {
      font-size: 28px;
      font-weight: 700;
      margin-bottom: 15px;
      color: var(--contrast-color);
    }

    .contact-2 .contact-info-panel .contact-info-header p {
      font-size: 15px;
      opacity: 0.85;
      line-height: 1.6;
    }

    .contact-2 .contact-info-cards {
      display: grid;
      grid-template-columns: 1fr;
      gap: 20px;
      margin-bottom: auto;
    }

    @media (min-width: 576px) and (max-width: 991px) {
      .contact-2 .contact-info-cards {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    .contact-2 .info-card {
      background-color: rgba(255, 255, 255, 0.1);
      border-radius: 12px;
      padding: 20px;
      display: flex;
      align-items: center;
      gap: 15px;
      backdrop-filter: blur(5px);
      transition: all 0.3s ease;
    }

    .contact-2 .info-card:hover {
      background-color: rgba(255, 255, 255, 0.2);
      transform: translateY(-5px);
    }

    .contact-2 .info-card .icon-container {
      width: 45px;
      height: 45px;
      flex-shrink: 0;
      background-color: rgba(255, 255, 255, 0.25);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .contact-2 .info-card .icon-container i {
      font-size: 20px;
      color: var(--contrast-color);
    }

    .contact-2 .info-card .card-content h4 {
      font-size: 16px;
      font-weight: 600;
      margin-bottom: 5px;
      color: var(--contrast-color);
    }

    .contact-2 .info-card .card-content p {
      font-size: 14px;
      margin-bottom: 0;
      opacity: 0.8;
    }

    .contact-2 .social-links-panel {
      margin-top: 35px;
    }

    .contact-2 .social-links-panel h5 {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 15px;
      color: var(--contrast-color);
    }

    .contact-2 .social-links-panel .social-icons {
      display: flex;
      gap: 12px;
    }

    .contact-2 .social-links-panel .social-icons a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background-color: rgba(255, 255, 255, 0.15);
      color: var(--contrast-color);
      font-size: 18px;
      transition: all 0.3s ease;
    }

    .contact-2 .social-links-panel .social-icons a:hover {
      background-color: rgba(255, 255, 255, 0.3);
      transform: translateY(-5px);
    }

    .contact-2 .contact-form-panel {
      display: flex;
      flex-direction: column;
      gap: 30px;
    }

    .contact-2 .map-container {
      width: 100%;
      height: 280px;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    }

    .contact-2 .form-container {
      background-color: var(--surface-color);
      border-radius: 20px;
      padding: 35px;
      box-shadow: 0 5px 25px rgba(0, 0, 0, 0.06);
    }

    .contact-2 .form-container h3 {
      font-size: 26px;
      font-weight: 700;
      margin-bottom: 15px;
      color: var(--heading-color);
      background: linear-gradient(120deg, var(--heading-color), color-mix(in srgb, var(--heading-color), var(--accent-color) 30%));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .contact-2 .form-container p {
      font-size: 15px;
      color: color-mix(in srgb, var(--default-color), transparent 15%);
      margin-bottom: 25px;
    }

    .contact-2 .form-container .form-floating {
      margin-bottom: 20px;
    }

    .contact-2 .form-container .form-floating .form-control {
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 80%);
      padding: 24px 20px 8px 20px;
      height: calc(3.5rem + 3px);
      background-color: var(--surface-color);
      color: var(--default-color);
      transition: all 0.3s ease;
    }

    .contact-2 .form-container .form-floating .form-control:focus {
      box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-color), transparent 85%);
      border-color: color-mix(in srgb, var(--accent-color), transparent 40%);
      background-color: var(--surface-color);
    }

    .contact-2 .form-container .form-floating .form-control::placeholder {
      color: transparent;
    }

    .contact-2 .form-container .form-floating label {
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      padding: 1rem 1.25rem 2.5rem 1.25rem;
    }

    .contact-2 .form-container .form-floating label::after {
      background-color: transparent;
    }

    .contact-2 .form-container .btn-submit {
      background: linear-gradient(145deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #1a4372 30%));
      color: var(--contrast-color);
      border: none;
      padding: 15px 25px;
      border-radius: 12px;
      font-weight: 600;
      font-size: 16px;
      transition: all 0.3s ease;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .contact-2 .form-container .btn-submit:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 20px color-mix(in srgb, var(--accent-color), transparent 75%);
    }

    .contact-2 .form-container .btn-submit i {
      transition: transform 0.3s ease;
    }

    .contact-2 .form-container .btn-submit:hover i {
      transform: translateX(5px);
    }

    @media (max-width: 768px) {
      .contact-2 .contact-info-panel {
        padding: 30px 25px;
      }

      .contact-2 .form-container {
        padding: 30px 25px;
      }
    }

    @media (max-width: 576px) {
      .contact-2 .social-links-panel .social-icons {
        flex-wrap: wrap;
      }
    }
    
    /* Section DHRSTgJ5B7 */
    .team-4 .team-header {
      margin-bottom: 50px;
    }

    .team-4 .team-header h2 {
      position: relative;
      font-size: 36px;
      font-weight: 700;
      margin-bottom: 20px;
      padding-bottom: 20px;
    }

    .team-4 .team-header h2:before {
      content: "";
      position: absolute;
      width: 70px;
      height: 4px;
      background: var(--accent-color);
      bottom: 0;
      left: 0;
    }

    .team-4 .team-header p {
      font-size: 17px;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      max-width: 600px;
    }

    @media (max-width: 991px) {
      .team-4 .team-header {
        margin-bottom: 30px;
        text-align: center;
      }

      .team-4 .team-header h2:before {
        left: 50%;
        transform: translateX(-50%);
      }

      .team-4 .team-header p {
        margin: 0 auto;
      }

      .team-4 .team-header .team-controls {
        margin-top: 30px;
        justify-content: center;
      }
    }

    .team-4 .team-controls {
      display: flex;
      gap: 12px;
    }

    .team-4 .team-controls .team-control-btn {
      width: 46px;
      height: 46px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent;
      border: 2px solid var(--accent-color);
      border-radius: 50%;
      color: var(--accent-color);
      font-size: 18px;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .team-4 .team-controls .team-control-btn:hover {
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .team-4 .team-slider {
      padding: 10px 5px 40px;
    }

    .team-4 .team-slider .swiper-wrapper {
      height: auto !important;
    }

    .team-4 .team-member {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      background: var(--surface-color);
      box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
      transition: all 0.4s ease;
      height: 100%;
    }

    .team-4 .team-member:hover {
      transform: translateY(-10px);
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
    }

    .team-4 .team-member:hover .member-image .member-social {
      opacity: 1;
      bottom: 20px;
    }

    .team-4 .team-member:hover .member-image:before {
      opacity: 0.8;
    }

    .team-4 .team-member .member-image {
      position: relative;
      overflow: hidden;
    }

    .team-4 .team-member .member-image:before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 60%;
      background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
      opacity: 0;
      transition: all 0.4s ease;
      z-index: 1;
    }

    .team-4 .team-member .member-image img {
      width: 100%;
      aspect-ratio: 1/1;
      object-fit: cover;
      transition: transform 0.6s ease;
    }

    .team-4 .team-member .member-image .member-social {
      position: absolute;
      z-index: 2;
      display: flex;
      gap: 8px;
      justify-content: center;
      width: 100%;
      bottom: -30px;
      opacity: 0;
      transition: all 0.4s ease;
    }

    .team-4 .team-member .member-image .member-social a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      background: var(--contrast-color);
      border-radius: 50%;
      color: var(--accent-color);
      font-size: 15px;
      transition: all 0.3s ease;
    }

    .team-4 .team-member .member-image .member-social a:hover {
      background: var(--accent-color);
      color: var(--contrast-color);
      transform: translateY(-3px);
    }

    .team-4 .team-member .member-content {
      padding: 25px;
    }

    .team-4 .team-member .member-content h3 {
      font-size: 20px;
      font-weight: 700;
      margin-bottom: 5px;
    }

    .team-4 .team-member .member-content span {
      display: block;
      font-size: 14px;
      font-weight: 600;
      color: var(--accent-color);
      margin-bottom: 15px;
    }

    .team-4 .team-member .member-content p {
      font-size: 14px;
      line-height: 1.6;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      margin-bottom: 0;
    }
    
    /* Section upER6OJKVp */
    .team-6 .team-member {
      background-color: var(--surface-color);
      box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
      position: relative;
      border-radius: 5px;
      transition: 0.5s;
      padding: 30px;
      height: 100%;
    }

    @media (max-width: 468px) {
      .team-6 .team-member {
        flex-direction: column;
        justify-content: center !important;
        align-items: center !important;
      }
    }

    .team-6 .team-member .pic {
      overflow: hidden;
      width: 150px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .team-6 .team-member .pic img {
      transition: ease-in-out 0.3s;
    }

    .team-6 .team-member:hover {
      transform: translateY(-10px);
    }

    .team-6 .team-member .member-info {
      padding-left: 30px;
    }

    @media (max-width: 468px) {
      .team-6 .team-member .member-info {
        padding: 30px 0 0 0;
        text-align: center;
      }
    }

    .team-6 .team-member h4 {
      font-weight: 700;
      margin-bottom: 5px;
      font-size: 20px;
    }

    .team-6 .team-member span {
      display: block;
      font-size: 15px;
      padding-bottom: 10px;
      position: relative;
      font-weight: 500;
    }

    .team-6 .team-member span::after {
      content: "";
      position: absolute;
      display: block;
      width: 50px;
      height: 1px;
      background: color-mix(in srgb, var(--default-color), transparent 85%);
      bottom: 0;
      left: 0;
    }

    @media (max-width: 468px) {
      .team-6 .team-member span::after {
        left: calc(50% - 25px);
      }
    }

    .team-6 .team-member p {
      margin: 10px 0 0 0;
      font-size: 14px;
    }

    .team-6 .team-member .social {
      margin-top: 12px;
      display: flex;
      align-items: center;
      justify-content: start;
      width: 100%;
    }

    @media (max-width: 468px) {
      .team-6 .team-member .social {
        justify-content: center;
      }
    }

    .team-6 .team-member .social a {
      background: color-mix(in srgb, var(--default-color), transparent 94%);
      transition: ease-in-out 0.3s;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50px;
      width: 36px;
      height: 36px;
    }

    .team-6 .team-member .social a i {
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      font-size: 16px;
      margin: 0 2px;
    }

    .team-6 .team-member .social a:hover {
      background: var(--accent-color);
    }

    .team-6 .team-member .social a:hover i {
      color: var(--contrast-color);
    }

    .team-6 .team-member .social a+a {
      margin-left: 8px;
    }
    
    /* Section Pw0LnP6ebg */
    .hero-2 {
      padding: 0;
    }

    .hero-2 .carousel {
      width: 100%;
      min-height: 70vh;
      padding: 0;
      margin: 0;
      position: relative;
    }

    @media (max-height: 500px),
    (max-width: 580px) {
      .hero-2 .carousel {
        min-height: 100vh;
      }
    }

    .hero-2 img {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 1;
    }

    .hero-2 .carousel-item {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .hero-2 .carousel-item:before {
      content: "";
      background: color-mix(in srgb, #446a8d78, #00000000 30%);
      position: absolute;
      inset: 0;
      z-index: 2;
    }

    .hero-2 .container {
        position: absolute;
        left: 10px;
        width: 50%;
        text-align: center;
        padding: 30px 65px 30px 65px;
        margin-right: 10px;
        z-index: 3;
    }

    @media (max-width: 1200px) {
      .hero-2 .container {
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
      }
    }

    .hero-2 h2 {
      margin-bottom: 20px;
      font-size: 36px;
      font-weight: 700;
    }

    @media (max-width: 768px) {
      .hero-2 h2 {
        font-size: 30px;
      }
    }

    .hero-2 .btn-get-started {
      font-weight: 500;
      font-size: 16px;
      letter-spacing: 1px;
      display: inline-block;
      padding: 8px 32px;
      transition: 0.5s;
      margin: 10px;
      border-radius: 50px;
      color: var(--contrast-color);
      background: var(--accent-color);
    }

    .hero-2 .btn-get-started:hover {
      background: var(--surface-color);
      color: var(--accent-color);
    }

    .hero-2 .carousel-control-prev {
      justify-content: start;
    }

    @media (min-width: 640px) {
      .hero-2 .carousel-control-prev {
        padding-left: 15px;
      }
    }

    .hero-2 .carousel-control-next {
      justify-content: end;
    }

    @media (min-width: 640px) {
      .hero-2 .carousel-control-next {
        padding-right: 15px;
      }
    }

    .hero-2 .carousel-control-next-icon,
    .hero-2 .carousel-control-prev-icon {
      background: none;
      font-size: 26px;
      line-height: 0;
      background: color-mix(in srgb, var(--default-color), transparent 90%);
      border-radius: 50px;
      color: var(--contrast-color);
      transition: 0.3s;
      width: 54px;
      height: 54px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .hero-2 .carousel-control-prev,
    .hero-2 .carousel-control-next {
      transition: 0.3s;
      opacity: 0.5;
    }

    .hero-2 .carousel-control-prev:focus,
    .hero-2 .carousel-control-next:focus {
      opacity: 0.5;
    }

    .hero-2 .carousel-control-prev:hover,
    .hero-2 .carousel-control-next:hover {
      opacity: 0.9;
    }

    .hero-2 .carousel-control-prev:hover .carousel-control-next-icon,
    .hero-2 .carousel-control-prev:hover .carousel-control-prev-icon,
    .hero-2 .carousel-control-next:hover .carousel-control-next-icon,
    .hero-2 .carousel-control-next:hover .carousel-control-prev-icon {
      background: rgba(255, 255, 255, 0.075);
      color: white;
    }

    .hero-2 .carousel-indicators li {
      cursor: pointer;
      background: var(--default-color);
      overflow: hidden;
      border: 0;
      width: 12px;
      height: 12px;
      border-radius: 50px;
      opacity: 0.6;
      transition: 0.3s;
    }

    .hero-2 .carousel-indicators li.active {
      opacity: 1;
      background: var(--accent-color);
    }
    
    /* Section aZIwn9L24z */
    .pricing {
      --card-border-radius: 20px;
    }

    .pricing .row {
      justify-content: center;
    }
    .cards .feature-card .scard-content h3 {
      font-size: 22px !important;
    }
    .pricing .pricing-card {
      height: 100%;
      background: var(--surface-color);
      border-radius: var(--card-border-radius);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
      overflow: hidden;
      position: relative;
      transition: all 0.4s;
      margin-bottom: 30px;
      display: flex;
      flex-direction: column;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .pricing .pricing-card:hover {
      transform: translateY(-10px);
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    }

    .pricing .pricing-card.popular {
      border: 2px solid var(--accent-color);
    }

    .pricing .pricing-card.popular .plan-cta .btn-plan {
      background-color: var(--accent-color);
      color: var(--contrast-color);
    }

    .pricing .pricing-card.popular .plan-cta .btn-plan:hover {
      background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
    }

    .pricing .pricing-card .popular-tag {
      position: absolute;
      top: 20px;
      right: -35px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      font-size: 13px;
      font-weight: 600;
      padding: 8px 40px;
      transform: rotate(45deg);
    }

    .pricing .plan-header {
      padding: 30px 30px 20px;
      text-align: center;
    }

    .pricing .plan-header .plan-icon {
      width: 70px;
      height: 70px;
      margin: 0 auto 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
    }

    .pricing .plan-header .plan-icon i {
      font-size: 28px;
      color: var(--accent-color);
    }

    .pricing .plan-header h3 {
      font-size: 24px;
      font-weight: 700;
      margin-bottom: 10px;
    }

    .pricing .plan-header p {
      font-size: 15px;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .pricing .plan-pricing {
      text-align: center;
      padding: 10px 30px 20px;
      position: relative;
    }

    .pricing .plan-pricing .currency {
        font-size: 25px;
        vertical-align: top;
        line-height: 1;
        color: var(--heading-color);
        font-weight: 900;
    }

    .pricing .plan-pricing .amount {
      font-size: 45px;
      font-weight: 700;
      color: var(--heading-color);
      line-height: 1;
    }

    .pricing .plan-pricing .period {
      font-size: 16px;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
    }

    .pricing .plan-features {
      padding: 20px 30px;
      flex: 1;
    }

    .pricing .plan-features ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .pricing .plan-features ul li {
      padding: 12px 0;
      font-size: 15px;
      display: flex;
      align-items: center;
      gap: 10px;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .pricing .plan-features ul li.disabled {
      color: color-mix(in srgb, var(--default-color), transparent 60%);
    }

    .pricing .plan-features ul li i {
      font-size: 18px;
    }

    .pricing .plan-features ul li i.bi-check-circle-fill {
      color: var(--accent-color);
    }

    .pricing .plan-features ul li i.bi-x-circle-fill {
      color: color-mix(in srgb, var(--default-color), transparent 60%);
    }

    .pricing .plan-cta {
      padding: 10px 30px 30px;
      text-align: center;
    }

    .pricing .plan-cta .btn-plan {
      display: inline-block;
      width: 100%;
      padding: 14px 32px;
      background-color: color-mix(in srgb, var(--default-color), transparent 95%);
      color: var(--default-color);
      border-radius: 50px;
      font-size: 16px;
      font-weight: 600;
      transition: all 0.3s;
    }

    .pricing .plan-cta .btn-plan:hover {
      background-color: color-mix(in srgb, var(--default-color), transparent 80%);
    }

    @media (max-width: 992px) {
      .pricing .pricing-card {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
      }
    }

    @media (max-width: 768px) {
      .pricing .plan-pricing .amount {
        font-size: 48px;
      }

      .pricing .plan-header {
        padding: 25px 20px 15px;
      }

      .pricing .plan-features,
      .pricing .plan-pricing,
      .pricing .plan-cta {
        padding-left: 20px;
        padding-right: 20px;
      }
    }
    
    /* Section MqdMjdLPdd */
    .cards .feature-card {
      position: relative;
      background: var(--surface-color);
      border-radius: 20px;
      padding: 32px 28px 28px;
      height: 100%;
      display: flex;
      flex-direction: column;
      box-shadow: 0 2px 12px color-mix(in srgb, var(--default-color), transparent 92%);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 95%);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      overflow: hidden;
    }

    .cards .feature-card::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--accent-color), color-mix(in srgb, var(--accent-color), transparent 40%));
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cards .feature-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 12px 32px color-mix(in srgb, var(--accent-color), transparent 88%);
      border-color: color-mix(in srgb, var(--accent-color), transparent 80%);
    }

    .cards .feature-card:hover::after {
      transform: scaleX(1);
    }

    .cards .feature-card:hover .icon-wrapper {
      transform: scale(1.1) rotate(-5deg);
    }

    .cards .feature-card:hover .card-visual img {
      transform: scale(1.08);
    }

    .cards .feature-card:hover .link-action {
      background: var(--accent-color);
      color: var(--contrast-color);
      padding-right: 24px;
    }

    .cards .feature-card:hover .link-action i {
      transform: translateX(4px);
    }

    .cards .feature-card.highlight {
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 96%), var(--surface-color));
      border-color: var(--accent-color);
      box-shadow: 0 8px 24px color-mix(in srgb, var(--accent-color), transparent 85%);
    }

    .cards .feature-card.highlight::after {
      transform: scaleX(1);
      height: 4px;
    }

    .cards .feature-card.highlight .icon-wrapper {
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .cards .feature-card.highlight .icon-wrapper i {
      color: var(--contrast-color);
    }

    .cards .feature-card.highlight .link-action {
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .cards .feature-card .icon-wrapper {
      width: 56px;
      height: 56px;
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      transition: all 0.3s ease;
    }

    .cards .feature-card .icon-wrapper i {
      font-size: 28px;
      color: var(--accent-color);
    }

    .cards .feature-card .badge-popular {
      position: absolute;
      top: 16px;
      right: 16px;
      background: var(--accent-color);
      color: var(--contrast-color);
      padding: 4px 14px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      box-shadow: 0 4px 12px color-mix(in srgb, var(--accent-color), transparent 70%);
    }

    .cards .feature-card .card-content {
      flex: 0 0 auto;
      margin-bottom: 24px;
    }

    .cards .feature-card .card-content h3 {
      font-size: 19px;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 12px;
      line-height: 1.3;
    }

    .cards .feature-card .card-content p {
      font-size: 14px;
      line-height: 1.65;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      margin: 0;
    }

    .cards .feature-card .card-visual {
      flex: 1;
      margin-bottom: 24px;
      border-radius: 12px;
      overflow: hidden;
      background: color-mix(in srgb, var(--accent-color), transparent 97%);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }

    .cards .feature-card .card-visual img {
      width: 100%;
      height: auto;
      max-height: 140px;
      object-fit: contain;
      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cards .feature-card .link-action {
      display: inline-flex;
      align-items: center;
      align-self: flex-start;
      padding: 10px 18px;
      background: color-mix(in srgb, var(--accent-color), transparent 92%);
      color: var(--accent-color);
      border-radius: 10px;
      text-decoration: none;
      font-size: 14px;
      font-weight: 600;
      transition: all 0.3s ease;
    }

    .cards .feature-card .link-action span {
      margin-right: 6px;
    }

    .cards .feature-card .link-action i {
      font-size: 16px;
      transition: transform 0.3s ease;
    }

    .cards .feature-card .link-action:hover {
      text-decoration: none;
    }

    @media (max-width: 992px) {
      .cards .feature-card {
        padding: 28px 24px 24px;
      }

      .cards .feature-card .icon-wrapper {
        width: 52px;
        height: 52px;
        margin-bottom: 16px;
      }

      .cards .feature-card .icon-wrapper i {
        font-size: 26px;
      }

      .cards .feature-card .card-content {
        margin-bottom: 20px;
      }

      .cards .feature-card .card-content h3 {
        font-size: 18px;
      }

      .cards .feature-card .card-visual {
        margin-bottom: 20px;
        padding: 12px;
      }

      .cards .feature-card .card-visual img {
        max-height: 120px;
      }
    }

    @media (max-width: 576px) {
      .cards .feature-card {
        padding: 24px 20px 20px;
      }

      .cards .feature-card .badge-popular {
        top: 12px;
        right: 12px;
        padding: 3px 12px;
        font-size: 11px;
      }

      .cards .feature-card .icon-wrapper {
        width: 48px;
        height: 48px;
        border-radius: 14px;
      }

      .cards .feature-card .icon-wrapper i {
        font-size: 24px;
      }

      .cards .feature-card .card-content h3 {
        font-size: 17px;
      }

      .cards .feature-card .card-content p {
        font-size: 13px;
      }

      .cards .feature-card .card-visual img {
        max-height: 100px;
      }

      .cards .feature-card .link-action {
        padding: 9px 16px;
        font-size: 13px;
      }
    }
    
  /* <style id="section-8GvX98IWp8-style"> */
    .cards-1 .card {
      background-color: var(--surface-color);
      color: var(--default-color);
      padding: 30px;
      box-shadow: 0px 0 10px rgba(0, 0, 0, 0.1);
      text-align: center;
      transition: 0.3s;
      height: 100%;
      border: 0;
    }

    .cards-1 .card img {
      padding: 30px 50px;
      transition: 0.5s;
      transform: scale(1.1);
    }

    .cards-1 .card h3 {
      font-size: 24px;
      font-weight: 700;
      margin-bottom: 18px;
    }

    .cards-1 .card:hover {
      box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1);
    }

    .cards-1 .card:hover img {
      transform: scale(1);
    }

    .services-profile {
      width: 100%;
    }

    .service-info-panel {
      height: 100%;
      padding: 30px;
      background: var(--surface-color);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      border-radius: 8px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
      transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    }

    .service-info-panel:hover {
      transform: translateY(-6px);
      border-color: color-mix(in srgb, var(--accent-color), transparent 70%);
      box-shadow: 0 16px 34px rgba(0, 0, 0, 0.08);
    }

    .service-info-panel h3 {
      font-size: 24px;
      line-height: 1.35;
      margin-bottom: 16px;
      color: var(--heading-color);
      font-weight: 700;
    }

    .service-info-panel p {
      color: color-mix(in srgb, var(--default-color), transparent 22%);
      line-height: 1.7;
      margin-bottom: 14px;
    }

    .service-info-panel p:last-child {
      margin-bottom: 0;
    }

    .service-kicker {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
      color: var(--accent-color);
      font-size: 13px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .service-kicker i {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--accent-color), transparent 88%);
      color: var(--accent-color);
      font-size: 20px;
      transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease;
    }

    .about .service-info-panel .service-kicker {
      font-size: 18px;
      font-weight: 900;
      line-height: 1.25;
      margin-bottom: 16px;
    }

    .about .service-info-panel:hover .service-kicker i {
      transform: rotate(-7deg) scale(1.08);
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .service-stat-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin: 20px 0;
    }

    .service-stat-row div {
      padding: 16px;
      border-radius: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 94%);
    }

    .service-stat-row strong {
      display: block;
      font-size: 24px;
      color: var(--heading-color);
      line-height: 1;
      margin-bottom: 8px;
    }

    .service-stat-row span {
      display: block;
      font-size: 13px;
      line-height: 1.35;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
    }

    .service-subtitle {
      padding-bottom: 26px;
    }

    .service-subtitle h2 {
      font-size: 32px;
    }

    .service-process-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .process-step {
      padding: 24px;
      background: var(--surface-color);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      border-radius: 8px;
      min-height: 100%;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
      transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    }

    .process-step:hover {
      transform: translateY(-6px);
      border-color: color-mix(in srgb, var(--accent-color), transparent 68%);
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    }

    .process-step span {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      margin-bottom: 16px;
      border-radius: 50%;
      background: var(--accent-color);
      color: var(--contrast-color);
      font-weight: 800;
      font-size: 14px;
      transition: transform 0.3s ease, background-color 0.3s ease;
    }

    .process-step:hover span {
      transform: rotate(-7deg) scale(1.08);
      background: color-mix(in srgb, var(--accent-color), #000 12%);
    }

    .process-step h4 {
      font-size: 18px;
      margin-bottom: 10px;
      color: var(--heading-color);
      font-weight: 700;
    }

    .process-step p {
      margin: 0;
      font-size: 14px;
      line-height: 1.65;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
    }

    .sector-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      margin-top: 18px;
    }

    .sector-grid span {
      display: flex;
      align-items: center;
      min-height: 46px;
      padding: 10px 14px;
      border-radius: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 94%);
      color: color-mix(in srgb, var(--heading-color), transparent 10%);
      font-weight: 600;
      font-size: 14px;
      line-height: 1.35;
      transition: transform 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
    }

    .sector-grid span:hover {
      transform: translateX(6px);
      background: color-mix(in srgb, var(--accent-color), transparent 88%);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
    }

    .service-check-list {
      list-style: none;
      padding: 0;
      margin: 18px 0;
    }

    .service-check-list li {
      display: flex;
      gap: 10px;
      padding: 10px 0;
      color: color-mix(in srgb, var(--default-color), transparent 18%);
      line-height: 1.45;
      transition: transform 0.25s ease, color 0.25s ease;
    }

    .service-check-list li:hover {
      transform: translateX(6px);
      color: var(--heading-color);
    }

    .service-check-list i {
      color: var(--accent-color);
      margin-top: 2px;
      flex: 0 0 auto;
      transition: transform 0.25s ease;
    }

    .service-check-list li:hover i {
      transform: scale(1.12);
    }

    .compliance-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }

    .compliance-grid > div {
      padding: 24px;
      background: var(--surface-color);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      border-radius: 8px;
      min-height: 100%;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
      transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    }

    .compliance-grid > div:hover {
      transform: translateY(-6px);
      border-color: color-mix(in srgb, var(--accent-color), transparent 68%);
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    }

    .compliance-grid i {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 46px;
      height: 46px;
      margin-bottom: 16px;
      border-radius: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 88%);
      color: var(--accent-color);
      font-size: 24px;
      transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
    }

    .compliance-grid > div:hover i {
      transform: rotate(-6deg) scale(1.08);
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .compliance-grid h4 {
      font-size: 18px;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 10px;
    }

    .compliance-grid p {
      margin: 0;
      font-size: 14px;
      line-height: 1.65;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
    }

    @media (max-width: 992px) {
      .service-process-grid,
      .compliance-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .service-stat-row {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 576px) {
      .service-info-panel,
      .process-step,
      .compliance-grid > div {
        padding: 22px;
      }

      .service-process-grid,
      .compliance-grid,
      .sector-grid {
        grid-template-columns: 1fr;
      }

      .service-subtitle h2 {
        font-size: 26px;
      }
    }
    
  /* <style id="section-7sFrzzmEzP-style"> */
    .gallery {
      overflow: hidden;
      padding-bottom: 0px;
    }

    .gallery .gallery-container {
      padding: 20px 0 40px;
      position: relative;
    }

    .gallery .swiper-wrapper {
      height: auto !important;
      align-items: center;
      padding: 30px 0;
    }

    .gallery .gallery-item {
      position: relative;
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
      transition: all 0.4s ease;
    }

    .gallery .gallery-img {
      position: relative;
      overflow: hidden;
    }

    .gallery .gallery-img img {
      transition: transform 0.6s ease;
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
    }

    .gallery .gallery-img .gallery-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: color-mix(in srgb, var(--accent-color), transparent 70%);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: all 0.4s ease;
    }

    .gallery .gallery-img .gallery-overlay i {
      color: var(--contrast-color);
      font-size: 3rem;
      transform: scale(0.5);
      transition: all 0.3s ease;
    }

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

    .gallery .gallery-img:hover .gallery-overlay {
      opacity: 1;
    }

    .gallery .gallery-img:hover .gallery-overlay i {
      transform: scale(1);
    }

    .gallery .swiper-pagination {
      position: relative;
      margin-top: 20px;
    }

    .gallery .swiper-pagination .swiper-pagination-bullet {
      width: 12px;
      height: 12px;
      background: transparent;
      border: 2px solid var(--accent-color);
      opacity: 0.7;
      transition: all 0.3s ease;
    }

    .gallery .swiper-pagination .swiper-pagination-bullet-active {
      background: var(--accent-color);
      opacity: 1;
      transform: scale(1.2);
    }

    .gallery .swiper-button-next,
    .gallery .swiper-button-prev {
      color: var(--accent-color);
      background: var(--surface-color);
      width: 40px;
      height: 40px;
      border-radius: 50%;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      opacity: 0;
      transition: all 0.3s ease;
    }

    .gallery .swiper-button-next:after,
    .gallery .swiper-button-prev:after {
      font-size: 16px;
      font-weight: bold;
    }

    .gallery:hover .swiper-button-next,
    .gallery:hover .swiper-button-prev {
      opacity: 0.9;
    }

    .gallery:hover .swiper-button-next:hover,
    .gallery:hover .swiper-button-prev:hover {
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    @media (max-width: 991px) {
      .gallery .gallery-item {
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
      }

      .gallery .swiper-button-next,
      .gallery .swiper-button-prev {
        display: none;
      }
    }

    @media (max-width: 767px) {
      .gallery .swiper-wrapper {
        padding: 15px 0;
      }

      .gallery .gallery-img .gallery-overlay i {
        font-size: 2rem;
      }
    }
    
  /* <style id="section-8IDREvMShl-style"> */
    .gallery-8 .gallery-carousel {
      margin-bottom: 2rem;
    }

    .gallery-8 .gallery-carousel .swiper-wrapper {
      height: auto !important;
    }

    .gallery-8 .gallery-item {
      position: relative;
      overflow: hidden;
      border-radius: 12px;
      box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
      transition: all 0.3s ease;
      cursor: pointer;
    }

    .gallery-8 .gallery-item:hover {
      transform: translateY(-5px);
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
    }

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

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

    .gallery-8 .gallery-item img {
      width: 100%;
      height: 250px;
      object-fit: cover;
      transition: transform 0.3s ease;
    }

    @media (max-width: 576px) {
      .gallery-8 .gallery-item img {
        height: 200px;
      }
    }

    .gallery-8 .gallery-item .gallery-overlay {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color), transparent 60%));
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .gallery-8 .gallery-item .gallery-overlay i {
      color: var(--contrast-color);
      font-size: 2rem;
    }

    .gallery-8 .btn-gallery {
      background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #000000 20%));
      color: var(--contrast-color);
      border: none;
      padding: 15px 35px;
      font-size: 1.1rem;
      font-weight: 600;
      border-radius: 50px;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      transition: all 0.3s ease;
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    }

    .gallery-8 .btn-gallery:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 35px rgba(0, 0, 0, 0.2);
      color: var(--contrast-color);
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), #000000 10%), color-mix(in srgb, var(--accent-color), #000000 30%));
    }

    .gallery-8 .btn-gallery i {
      font-size: 1.2rem;
    }

    @media (max-width: 576px) {
      .gallery-8 .btn-gallery {
        padding: 12px 28px;
        font-size: 1rem;
      }
    }
    
  /* <style id="section-kw1Q70LXG8-style"> */
    .gallery-2 {
      padding-top: 60px;
      padding-bottom: 60px;
    }

    .gallery-2 .isotope-filters {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 10px;
      margin-bottom: 30px;
      padding: 0;
      list-style: none;
    }

    .gallery-2 .isotope-filters li {
      cursor: pointer;
      padding: 8px 16px;
      font-size: 15px;
      font-weight: 500;
      line-height: 1;
      color: var(--default-color);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 80%);
      border-radius: 50px;
      transition: all 0.3s ease;
    }

    .gallery-2 .isotope-filters li:hover {
      color: var(--accent-color);
      border-color: var(--accent-color);
    }

    .gallery-2 .isotope-filters li.filter-active {
      color: var(--contrast-color);
      background-color: var(--accent-color);
      border-color: var(--accent-color);
    }

    @media (max-width: 576px) {
      .gallery-2 .isotope-filters li {
        margin-bottom: 5px;
      }
    }

    .gallery-2 .gallery-item {
      margin-bottom: 30px;
    }

    .gallery-2 .gallery-card {
      position: relative;
      overflow: hidden;
      border-radius: 8px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      transition: all 0.3s ease;
    }

    .gallery-2 .gallery-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    }

    .gallery-2 .gallery-card:hover .gallery-overlay {
      opacity: 1;
      visibility: visible;
    }

    .gallery-2 .gallery-card:hover .gallery-info {
      opacity: 1;
      transform: translateY(0);
    }

    .gallery-2 .gallery-img {
      position: relative;
      overflow: hidden;
    }

    .gallery-2 .gallery-img img {
      transition: transform 0.6s ease;
      width: 100%;
      height: auto;
      aspect-ratio: 4/3;
      object-fit: cover;
    }

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

    .gallery-2 .gallery-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0.1) 100%);
      display: flex;
      align-items: flex-end;
      padding: 20px;
      opacity: 0;
      visibility: hidden;
      transition: all 0.4s ease;
    }

    .gallery-2 .gallery-info {
      width: 100%;
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.4s ease 0.1s;
    }

    .gallery-2 .gallery-info h4 {
      color: var(--contrast-color);
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 8px;
    }

    .gallery-2 .gallery-info p {
      color: color-mix(in srgb, var(--contrast-color), transparent 20%);
      font-size: 14px;
      margin-bottom: 15px;
    }

    .gallery-2 .gallery-link {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      border-radius: 50%;
      transition: all 0.3s ease;
    }

    .gallery-2 .gallery-link i {
      font-size: 20px;
    }

    .gallery-2 .gallery-link:hover {
      background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
      transform: scale(1.1);
    }

    @media (max-width: 992px) {
      .gallery-2 .gallery-info h4 {
        font-size: 16px;
      }

      .gallery-2 .gallery-info p {
        font-size: 13px;
      }
    }

    @media (max-width: 768px) {
      .gallery-2 .isotope-filters li {
        padding: 6px 14px;
        font-size: 14px;
      }
    }

    @media (max-width: 576px) {
      .gallery-2 .gallery-overlay {
        padding: 15px;
      }

      .gallery-2 .gallery-info h4 {
        font-size: 15px;
        margin-bottom: 5px;
      }

      .gallery-2 .gallery-info p {
        font-size: 12px;
        margin-bottom: 10px;
      }

      .gallery-2 .gallery-link {
        width: 35px;
        height: 35px;
      }

      .gallery-2 .gallery-link i {
        font-size: 18px;
      }
    }
    
  /* <style id="section-VerhTcinbP-style"> */
    .testimonials-4 .testimonial-wrap {
      padding-left: 50px;
    }

    .testimonials-4 .testimonials-carousel,
    .testimonials-4 .testimonials-slider {
      overflow: hidden;
    }

    .testimonials-4 .testimonial-item {
      background-color: var(--surface-color);
      box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
      box-sizing: content-box;
      padding: 30px 30px 30px 60px;
      margin: 30px 15px;
      min-height: 200px;
      position: relative;
    }

    .testimonials-4 .testimonial-item .testimonial-img {
      width: 90px;
      border-radius: 10px;
      border: 6px solid var(--background-color);
      position: absolute;
      left: -45px;
    }

    .testimonials-4 .testimonial-item h3 {
      font-size: 18px;
      font-weight: bold;
      margin: 10px 0 5px 0;
    }

    .testimonials-4 .testimonial-item h4 {
      color: color-mix(in srgb, var(--default-color), transparent 50%);
      font-size: 14px;
      margin: 0;
    }

    .testimonials-4 .testimonial-item .stars {
      margin: 10px 0;
    }

    .testimonials-4 .testimonial-item .stars i {
      color: #ffc107;
      margin: 0 1px;
    }

    .testimonials-4 .testimonial-item .quote-icon-left,
    .testimonials-4 .testimonial-item .quote-icon-right {
      color: color-mix(in srgb, var(--accent-color), transparent 60%);
      font-size: 26px;
      line-height: 0;
    }

    .testimonials-4 .testimonial-item .quote-icon-left {
      display: inline-block;
      left: -5px;
      position: relative;
    }

    .testimonials-4 .testimonial-item .quote-icon-right {
      display: inline-block;
      right: -5px;
      position: relative;
      top: 10px;
      transform: scale(-1, -1);
    }

    .testimonials-4 .testimonial-item p {
      font-style: italic;
      margin: 15px auto 15px auto;
    }

    .testimonials-4 .swiper-wrapper {
      height: auto;
    }

    .testimonials-4 .swiper-pagination {
      margin-top: 20px;
      position: relative;
    }

    .testimonials-4 .swiper-pagination .swiper-pagination-bullet {
      width: 12px;
      height: 12px;
      background-color: var(--background-color);
      opacity: 1;
      border: 1px solid var(--accent-color);
    }

    .testimonials-4 .swiper-pagination .swiper-pagination-bullet-active {
      background-color: var(--accent-color);
    }

    @media (max-width: 767px) {
      .testimonials-4 .testimonial-wrap {
        padding-left: 0;
      }

      .testimonials-4 .testimonials-carousel,
      .testimonials-4 .testimonials-slider {
        overflow: hidden;
      }

      .testimonials-4 .testimonial-item {
        padding: 30px;
        margin: 15px;
      }

      .testimonials-4 .testimonial-item .testimonial-img {
        position: static;
        left: auto;
      }
    }
    
  /* <style id="section-lFXBhfWzAI-style"> */
    .clients-3 .swiper {
      padding: 10px 0;
    }

    .clients-3 .swiper-wrapper {
      height: auto;
    }

    .clients-3 .swiper-slide img {
      transition: 0.3s;
    }

    .clients-3 .swiper-slide img:hover {
      transform: scale(1.1);
    }
    
  /* <style id="section-suJVN3CRvN-style"> */
    .about-2 {
      position: relative;
    }

    .about-2 .about-content h2 {
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: 1.5rem;
      position: relative;
    }

    .about-2 .about-content h2:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -0.5rem;
      width: 80px;
      height: 4px;
      background-color: var(--accent-color);
    }

    .about-2 .about-content .lead {
      font-size: 1.15rem;
      margin-bottom: 1.5rem;
      color: color-mix(in srgb, var(--heading-color), transparent 10%);
    }

    .about-2 .about-content p {
      margin-bottom: 1rem;
      line-height: 1.7;
    }

    .about-2 .achievement-boxes .achievement-box {
      background-color: var(--surface-color);
      border-left: 4px solid var(--accent-color);
      padding: 1.2rem;
      height: 100%;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
      transition: all 0.3s ease;
    }

    .about-2 .achievement-boxes .achievement-box:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    }

    .about-2 .achievement-boxes .achievement-box h3 {
      font-size: 2rem;
      font-weight: 700;
      margin-bottom: 0.3rem;
      color: var(--accent-color);
    }

    .about-2 .achievement-boxes .achievement-box p {
      margin-bottom: 0;
      font-size: 0.9rem;
      font-weight: 500;
    }

    .about-2 .certifications h5 {
      font-size: 1.1rem;
      margin-bottom: 1rem;
      font-weight: 600;
    }

    .about-2 .certifications img {
      transition: transform 0.3s ease;
      filter: grayscale(100%);
      opacity: 0.7;
    }

    .about-2 .certifications img:hover {
      filter: grayscale(0);
      opacity: 1;
      transform: scale(1.05);
    }

    .about-2 .cta-container .btn-primary {
      background-color: var(--accent-color);
      border-color: var(--accent-color);
      color: var(--contrast-color);
      padding: 0.75rem 1.5rem;
      font-weight: 500;
      border-radius: 4px;
      transition: all 0.3s ease;
    }

    .about-2 .cta-container .btn-primary:hover {
      background-color: color-mix(in srgb, var(--accent-color), #000 10%);
      border-color: color-mix(in srgb, var(--accent-color), #000 10%);
      transform: translateY(-3px);
      box-shadow: 0 5px 15px color-mix(in srgb, var(--accent-color), transparent 70%);
    }

    .about-2 .about-image {
      position: relative;
    }

    .about-2 .about-image .main-image {
      border-radius: 8px;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
      width: 100%;
    }

    .about-2 .about-image .image-overlay {
      position: absolute;
      bottom: -60px;
      right: -30px;
      width: 50%;
      z-index: 2;
      border-radius: 8px;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
    }

    .about-2 .about-image .image-overlay img {
      border: 5px solid var(--background-color);
    }

    .about-2 .about-image .experience-badge {
      position: absolute;
      top: 30px;
      left: -30px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      padding: 1.5rem;
      border-radius: 50%;
      width: 130px;
      height: 130px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      box-shadow: 0 10px 25px color-mix(in srgb, var(--accent-color), transparent 60%);
    }

    .about-2 .about-image .experience-badge span {
      font-size: 2rem;
      font-weight: 700;
      line-height: 1;
    }

    .about-2 .about-image .experience-badge p {
      font-size: 0.8rem;
      margin-bottom: 0;
      margin-top: 0.3rem;
    }

    @media (max-width: 991.98px) {
      .about-2 .about-image {
        margin-top: 3rem;
      }

      .about-2 .about-image .image-overlay {
        bottom: -40px;
        right: -20px;
      }

      .about-2 .about-image .experience-badge {
        width: 100px;
        height: 100px;
        padding: 1rem;
        left: -20px;
      }

      .about-2 .about-image .experience-badge span {
        font-size: 1.5rem;
      }

      .about-2 .about-image .experience-badge p {
        font-size: 0.7rem;
      }
    }

    @media (max-width: 767.98px) {
      .about-2 .achievement-boxes .achievement-box {
        padding: 1rem;
      }

      .about-2 .achievement-boxes .achievement-box h3 {
        font-size: 1.8rem;
      }

      .about-2 .achievement-boxes .achievement-box p {
        font-size: 0.8rem;
      }

      .about-2 .about-image .image-overlay {
        bottom: -30px;
        right: 0;
        width: 40%;
      }
    }

    /* Section XP2F4BZzNE */
    .portfolio {
      padding: 60px 0;
      background: linear-gradient(135deg, var(--background-color) 0%, color-mix(in srgb, var(--accent-color), transparent 95%) 100%);
    }

    .portfolio .content h2 {
      font-size: 2.75rem;
      font-weight: 600;
      margin-bottom: 1.5rem;
      color: var(--heading-color);
      line-height: 1.2;
    }

    .portfolio .content p {
      font-size: 1.1rem;
      line-height: 1.8;
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      margin-bottom: 0;
    }

    .portfolio .badge-highlight {
      display: flex;
      align-items: center;
      background: var(--surface-color);
      padding: 2rem;
      border-radius: 16px;
      box-shadow: 0 10px 40px color-mix(in srgb, var(--accent-color), transparent 85%);
      border: 1px solid color-mix(in srgb, var(--accent-color), transparent 80%);
    }

    .portfolio .badge-highlight img {
      width: 80px;
      height: 80px;
      object-fit: contain;
      margin-right: 1.5rem;
      flex-shrink: 0;
    }

    .portfolio .badge-highlight .badge-content h4 {
      font-size: 1.4rem;
      font-weight: 600;
      color: var(--heading-color);
      margin-bottom: 0.5rem;
    }

    .portfolio .badge-highlight .badge-content p {
      font-size: 0.95rem;
      margin-bottom: 0;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .portfolio .portfolio-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
      gap: 2rem;
      margin: 1rem 0rem 2rem 0rem;
    }
    
    .portfolio .portfolio-grid2 {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 2rem;
      margin: 1rem 0rem 8rem 0rem;
    }

    .portfolio .portfolio-grid .conc-card {
      background: var(--surface-color);
      border-radius: 12px;
      padding: 2rem;
      box-shadow: 0 8px 30px color-mix(in srgb, var(--default-color), transparent 90%);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
      display: flex;
      align-items: center;
      gap: 1.5rem;
      transition: all 0.4s ease;
      position: relative;
      overflow: hidden;
    }

    .portfolio .portfolio-grid .conc-card::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 4px;
      height: 100%;
      background: var(--accent-color);
      transform: scaleY(0);
      transform-origin: bottom;
      transition: transform 0.4s ease;
    }

    .portfolio .portfolio-grid .conc-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 15px 50px color-mix(in srgb, var(--accent-color), transparent 75%);
    }

    .portfolio .portfolio-grid .conc-card:hover::before {
      transform: scaleY(1);
    }

    .portfolio .portfolio-grid .conc-card:hover .conc-icon img {
      transform: scale(1.1);
    }

    .portfolio .portfolio-grid .conc-card .conc-icon {
      width: 70px;
      height: 70px;
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      padding: 0.8rem;
    }

    .portfolio .portfolio-grid .conc-card .conc-icon img {
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      transition: transform 0.4s ease;
    }

    .portfolio .portfolio-grid .conc-card .conc-details {
      flex: 1;
    }

    .portfolio .portfolio-grid .conc-card .conc-details h5 {
      font-size: 1.3rem;
      font-weight: 600;
      color: var(--heading-color);
      margin-bottom: 0.3rem;
    }

    .portfolio .portfolio-grid .conc-card .conc-details .conc-category {
      display: inline-block;
      background: var(--accent-color);
      color: var(--contrast-color);
      font-size: 0.75rem;
      padding: 0.3rem 0.8rem;
      border-radius: 20px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 1rem;
    }

    .portfolio .portfolio-grid .conc-card .conc-details p {
      font-size: 0.9rem;
      line-height: 1.6;
      color: color-mix(in srgb, var(--default-color), transparent 35%);
      margin-bottom: 0;
    }

    .portfolio .achievements-banner {
      background: var(--surface-color);
      border-radius: 16px;
      padding: 3rem 2rem;
      box-shadow: 0 12px 40px color-mix(in srgb, var(--default-color), transparent 88%);
      border: 2px solid color-mix(in srgb, var(--accent-color), transparent 85%);
      margin-top: 3rem;
    }

    .portfolio .achievements-banner .achievement-item {
      padding: 1rem;
    }

    .portfolio .achievements-banner .achievement-item i {
      font-size: 2.5rem;
      color: var(--accent-color);
      margin-bottom: 1rem;
      display: block;
    }

    .portfolio .achievements-banner .achievement-item h3 {
      font-size: 2.8rem;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 0.5rem;
      line-height: 1;
    }

    .portfolio .achievements-banner .achievement-item p {
      font-size: 0.95rem;
      color: color-mix(in srgb, var(--default-color), transparent 40%);
      margin-bottom: 0;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      font-weight: 500;
    }

    @media (max-width: 992px) {
      .portfolio .portfolio-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
      }

      .portfolio .portfolio-grid .conc-card {
        padding: 1.5rem;
        gap: 1rem;
      }

      .portfolio .portfolio-grid .conc-card .conc-icon {
        width: 60px;
        height: 60px;
      }
    }

    @media (max-width: 768px) {
      .portfolio {
        padding: 80px 0;
      }

      .portfolio h2 {
        font-size: 24px;
      }

      .portfolio .badge-highlight {
        flex-direction: column;
        text-align: center;
        padding: 1.5rem;
      }

      .portfolio .badge-highlight img {
        margin-right: 0;
        margin-bottom: 1rem;
      }

      .portfolio .conc-card {
        flex-direction: column;
        text-align: center;
      }

      .portfolio .conc-card .conc-icon {
        margin: 0 auto;
      }

      .portfolio .achievements-banner {
        padding: 2rem 1rem;
      }

      .portfolio .achievements-banner .achievement-item {
        margin-bottom: 2rem;
      }

      .portfolio .achievements-banner .achievement-item:last-child {
        margin-bottom: 0;
      }

      .portfolio .achievements-banner .achievement-item h3 {
        font-size: 2.2rem;
      }
    }
    
  /* <style id="section-hNOY2geYsC-style"> */
    .tabs-2 .tab-controls {
      position: relative;
      z-index: 10;
      border-radius: 50px;
      display: inline-flex;
      background-color: color-mix(in srgb, var(--accent-color), transparent 92%);
      padding: 8px;
    }

    .tabs-2 .tab-controls .nav-item {
      margin: 0 5px;
    }

    .tabs-2 .tab-controls .nav-item:first-child {
      margin-left: 0;
    }

    .tabs-2 .tab-controls .nav-item:last-child {
      margin-right: 0;
    }

    .tabs-2 .tab-controls .nav-item .nav-link {
      display: flex;
      align-items: center;
      border-radius: 30px;
      padding: 12px 24px;
      background-color: transparent;
      color: var(--heading-color);
      font-weight: 600;
      transition: all 0.3s ease;
      border: none;
    }

    .tabs-2 .tab-controls .nav-item .nav-link i {
      font-size: 18px;
      margin-right: 8px;
      transition: all 0.3s ease;
    }

    .tabs-2 .tab-controls .nav-item .nav-link:hover {
      color: var(--accent-color);
      background-color: rgba(255, 255, 255, 0.1);
    }

    .tabs-2 .tab-controls .nav-item .nav-link.active {
      background-color: var(--surface-color);
      color: var(--accent-color);
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    }

    .tabs-2 .tab-content {
      position: relative;
    }

    .tabs-2 .tab-content .tab-pane {
      transition: all 0.35s ease-in-out;
    }

    .tabs-2 .tab-content .tab-pane.fade {
      opacity: 0;
      transform: translateY(20px);
    }

    .tabs-2 .tab-content .tab-pane.show {
      opacity: 1;
      transform: translateY(0);
    }

    .tabs-2 .tab-content .tab-wrapper {
      background-color: var(--surface-color);
      border-radius: 20px;
      overflow: hidden;
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image {
      height: 100%;
      position: relative;
      overflow: hidden;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image img {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image:hover img {
      transform: scale(1.05);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image .experience-badge {
      position: absolute;
      bottom: 30px;
      right: 30px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      border-radius: 12px;
      padding: 16px 24px;
      text-align: center;
      box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image .experience-badge .number {
      display: block;
      font-size: 24px;
      font-weight: 800;
      line-height: 1.2;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-image .experience-badge .text {
      display: block;
      font-size: 14px;
      font-weight: 500;
      opacity: 0.9;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner {
      padding: 50px;
      height: 100%;
      display: flex;
      flex-direction: column;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .tab-header {
      margin-bottom: 24px;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .tab-header .tab-subtitle {
      display: inline-block;
      font-size: 14px;
      text-transform: uppercase;
      font-weight: 700;
      letter-spacing: 1.5px;
      color: var(--accent-color);
      margin-bottom: 12px;
      position: relative;
      padding-left: 22px;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .tab-header .tab-subtitle:before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 14px;
      height: 2px;
      background-color: var(--accent-color);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .tab-header h3 {
      font-size: 32px;
      font-weight: 700;
      color: var(--heading-color);
      margin-bottom: 0;
      line-height: 1.3;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner p {
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      font-size: 16px;
      line-height: 1.7;
      margin-bottom: 30px;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item {
      display: flex;
      align-items: flex-start;
      margin-bottom: 24px;
      transition: all 0.3s ease;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item:last-child {
      margin-bottom: 0;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item:hover {
      transform: translateX(6px);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item:hover .benefit-icon {
      background-color: var(--accent-color);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item:hover .benefit-icon i {
      color: var(--contrast-color);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-icon {
      width: 52px;
      height: 52px;
      flex-shrink: 0;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 18px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      transition: all 0.3s ease;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-icon i {
      color: var(--accent-color);
      font-size: 22px;
      transition: all 0.3s ease;
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-content h4 {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 8px;
      color: var(--heading-color);
    }

    .tabs-2 .tab-content .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-content p {
      font-size: 15px;
      margin-bottom: 0;
      line-height: 1.5;
    }

    @media (max-width: 1199px) {
      .tabs-2 .tab-wrapper .tab-content-inner {
        padding: 40px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .tab-header h3 {
        font-size: 28px;
      }
    }

    @media (max-width: 991px) {
      .tabs-2 .tab-controls .nav-item .nav-link {
        padding: 10px 18px;
        font-size: 14px;
      }

      .tabs-2 .tab-controls .nav-item .nav-link i {
        font-size: 16px;
      }

      .tabs-2 .tab-wrapper .tab-image .experience-badge {
        bottom: 20px;
        right: 20px;
        padding: 12px 18px;
      }

      .tabs-2 .tab-wrapper .tab-image .experience-badge .number {
        font-size: 20px;
      }

      .tabs-2 .tab-wrapper .tab-image .experience-badge .text {
        font-size: 12px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner {
        padding: 30px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .tab-header h3 {
        font-size: 24px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-icon {
        width: 45px;
        height: 45px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-icon i {
        font-size: 18px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-content h4 {
        font-size: 16px;
      }

      .tabs-2 .tab-wrapper .tab-content-inner .benefits-list .benefit-item .benefit-content p {
        font-size: 14px;
      }
    }

    @media (max-width: 767px) {
      .tabs-2 .tab-controls {
        flex-wrap: wrap;
        justify-content: center;
        border-radius: 15px;
        padding: 6px;
      }

      .tabs-2 .tab-controls .nav-item {
        margin: 4px;
      }

      .tabs-2 .tab-controls .nav-item .nav-link {
        padding: 8px 14px;
        font-size: 13px;
      }

      .tabs-2 .tab-wrapper .row {
        flex-direction: column-reverse;
      }

      .tabs-2 .tab-wrapper .tab-image {
        height: 300px;
      }
    }
    
  /* <style id="section-bt7MT5DSXZ-style"> */
    .stats .section-headline {
      color: var(--heading-color);
      font-family: var(--heading-font);
      font-size: 2.75rem;
      font-weight: 300;
      line-height: 1.2;
      letter-spacing: -0.02em;
    }

    .stats .section-description {
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      font-size: 1.125rem;
      line-height: 1.7;
      font-weight: 300;
      max-width: 600px;
      margin: 0 auto;
    }

    .stats .stats-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      border-radius: 8px;
      overflow: hidden;
      background: var(--surface-color);
    }

    .stats .stat-item {
      padding: 3rem 2.5rem;
      position: relative;
      transition: all 0.4s ease;
    }

    .stats .stat-item:nth-child(1) {
      border-right: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .stats .stat-item:nth-child(2) {
      border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .stats .stat-item:nth-child(3) {
      border-right: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .stats .stat-item:hover {
      background: color-mix(in srgb, var(--accent-color), transparent 97%);
      transform: translateY(-2px);
    }

    .stats .stat-item .stat-content {
      text-align: center;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .stats .stat-item .stat-number {
      color: var(--accent-color);
      font-family: var(--heading-font);
      font-size: 3.5rem;
      font-weight: 200;
      line-height: 1;
      margin-bottom: 1rem;
      letter-spacing: -0.03em;
    }

    .stats .stat-item .stat-number .purecounter {
      font-size: inherit;
      color: inherit;
    }

    .stats .stat-item .stat-divider {
      width: 40px;
      height: 1px;
      background: var(--accent-color);
      margin: 0 auto 1.5rem auto;
      opacity: 0.6;
    }

    .stats .stat-item .stat-label {
      color: var(--heading-color);
      font-family: var(--heading-font);
      font-size: 1.25rem;
      font-weight: 400;
      margin-bottom: 1rem;
      letter-spacing: 0.01em;
    }

    .stats .stat-item .stat-description {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 0.95rem;
      line-height: 1.6;
      font-weight: 300;
      margin: 0;
      max-width: 200px;
    }

    .stats .achievement-badge {
      background: var(--surface-color);
      border: 1px solid color-mix(in srgb, var(--accent-color), transparent 80%);
      border-radius: 8px;
      padding: 2.5rem 2rem;
      text-align: center;
      transition: all 0.4s ease;
    }

    .stats .achievement-badge:hover {
      border-color: color-mix(in srgb, var(--accent-color), transparent 60%);
      transform: translateY(-3px);
    }

    .stats .achievement-badge .badge-icon {
      font-size: 2.5rem;
      color: var(--accent-color);
      margin-bottom: 1.5rem;
      opacity: 0.8;
    }

    .stats .achievement-badge .badge-title {
      color: var(--heading-color);
      font-family: var(--heading-font);
      font-size: 1.5rem;
      font-weight: 400;
      margin-bottom: 1rem;
      letter-spacing: 0.01em;
    }

    .stats .achievement-badge .badge-text {
      color: color-mix(in srgb, var(--default-color), transparent 25%);
      font-size: 1rem;
      line-height: 1.6;
      font-weight: 300;
      margin: 0;
      max-width: 400px;
      margin: 0 auto;
    }

    @media (max-width: 992px) {
      .stats .section-headline {
        font-size: 2.25rem;
      }

      .stats .stats-container {
        gap: 0;
      }

      .stats .stat-item {
        padding: 2.5rem 2rem;
      }

      .stats .stat-item .stat-number {
        font-size: 3rem;
      }

      .stats .stat-item .stat-description {
        font-size: 0.9rem;
      }
    }

    @media (max-width: 768px) {
      .stats .section-headline {
        font-size: 1.875rem;
      }

      .stats .section-description {
        font-size: 1rem;
      }

      .stats .stats-container {
        grid-template-columns: 1fr;
      }

      .stats .stat-item {
        padding: 2rem 1.5rem;
      }

      .stats .stat-item:nth-child(1) {
        border-right: none;
        border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      }

      .stats .stat-item:nth-child(2) {
        border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      }

      .stats .stat-item:nth-child(3) {
        border-right: none;
        border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      }

      .stats .stat-item:nth-child(4) {
        border-bottom: none;
      }

      .stats .stat-item .stat-number {
        font-size: 2.75rem;
      }

      .stats .stat-item .stat-description {
        max-width: 300px;
      }

      .stats .achievement-badge {
        padding: 2rem 1.5rem;
      }

      .stats .achievement-badge .badge-icon {
        font-size: 2rem;
      }

      .stats .achievement-badge .badge-title {
        font-size: 1.25rem;
      }

      .stats .achievement-badge .badge-text {
        font-size: 0.95rem;
      }
    }
    
  /* <style id="section-XN6Dh8sJ7L-style"> */
    .privacy-3 .privacy-hero {
      text-align: center;
      margin-bottom: 70px;
      padding: 80px 0;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 97%) 0%, color-mix(in srgb, var(--accent-color), transparent 85%) 100%);
      border-radius: 40px;
      position: relative;
    }

    .privacy-3 .privacy-hero .hero-badge {
      display: inline-flex;
      padding: 10px 25px;
      background-color: var(--surface-color);
      border-radius: 30px;
      color: var(--accent-color);
      font-weight: 500;
      margin-bottom: 25px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    }

    .privacy-3 .privacy-hero h2 {
      font-size: 3.5rem;
      margin-bottom: 15px;
      background: linear-gradient(45deg, var(--heading-color), var(--accent-color));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .privacy-3 .privacy-hero p {
      font-size: 1.2rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      max-width: 600px;
      margin: 0 auto 40px;
    }

    .privacy-3 .privacy-hero .hero-stats {
      display: flex;
      justify-content: center;
      gap: 40px;
    }

    @media (max-width: 576px) {
      .privacy-3 .privacy-hero .hero-stats {
        flex-direction: column;
        gap: 20px;
      }
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item {
      display: flex;
      align-items: center;
      gap: 15px;
      padding: 15px 30px;
      background-color: var(--surface-color);
      border-radius: 20px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item .stat-icon {
      width: 45px;
      height: 45px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item .stat-icon i {
      font-size: 1.4rem;
      color: var(--accent-color);
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item .stat-text {
      text-align: left;
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item .stat-text .stat-value {
      display: block;
      font-size: 1.2rem;
      font-weight: 600;
      color: var(--heading-color);
      line-height: 1;
      margin-bottom: 5px;
    }

    .privacy-3 .privacy-hero .hero-stats .stat-item .stat-text .stat-label {
      font-size: 0.9rem;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .privacy-3 .data-collection {
      margin-bottom: 70px;
    }

    .privacy-3 .data-collection .section-intro {
      text-align: center;
      margin-bottom: 40px;
    }

    .privacy-3 .data-collection .section-intro .intro-icon {
      width: 70px;
      height: 70px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
    }

    .privacy-3 .data-collection .section-intro .intro-icon i {
      font-size: 2rem;
      color: var(--accent-color);
    }

    .privacy-3 .data-collection .section-intro h3 {
      font-size: 2.5rem;
      margin-bottom: 15px;
    }

    .privacy-3 .data-collection .section-intro p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 1.1rem;
    }

    .privacy-3 .data-collection .data-boxes {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
    }

    @media (max-width: 991px) {
      .privacy-3 .data-collection .data-boxes {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 576px) {
      .privacy-3 .data-collection .data-boxes {
        grid-template-columns: 1fr;
      }
    }

    .privacy-3 .data-collection .data-boxes .data-box {
      background-color: var(--surface-color);
      border-radius: 25px;
      padding: 30px;
      height: 100%;
      transition: transform 0.3s;
    }

    .privacy-3 .data-collection .data-boxes .data-box:hover {
      transform: translateY(-5px);
    }

    .privacy-3 .data-collection .data-boxes .data-box .data-type {
      font-size: 1.3rem;
      font-weight: 600;
      color: var(--heading-color);
      margin-bottom: 20px;
      padding-bottom: 15px;
      border-bottom: 2px solid color-mix(in srgb, var(--accent-color), transparent 90%);
    }

    .privacy-3 .data-collection .data-boxes .data-box .data-list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .privacy-3 .data-collection .data-boxes .data-box .data-list li {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 0;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      font-size: 1rem;
    }

    .privacy-3 .data-collection .data-boxes .data-box .data-list li i {
      color: var(--accent-color);
      font-size: 1.1rem;
    }

    .privacy-3 .data-usage {
      margin-bottom: 70px;
    }

    .privacy-3 .data-usage .usage-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
    }

    @media (max-width: 991px) {
      .privacy-3 .data-usage .usage-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 576px) {
      .privacy-3 .data-usage .usage-grid {
        grid-template-columns: 1fr;
      }
    }

    .privacy-3 .data-usage .usage-card {
      background-color: var(--surface-color);
      border-radius: 25px;
      padding: 40px;
      text-align: center;
      transition: all 0.3s;
    }

    .privacy-3 .data-usage .usage-card:hover {
      transform: translateY(-5px);
    }

    .privacy-3 .data-usage .usage-card:hover .usage-icon {
      transform: scale(1.1);
    }

    .privacy-3 .data-usage .usage-card .usage-icon {
      width: 70px;
      height: 70px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 25px;
      transition: transform 0.3s;
    }

    .privacy-3 .data-usage .usage-card .usage-icon i {
      font-size: 2rem;
      color: var(--accent-color);
    }

    .privacy-3 .data-usage .usage-card h4 {
      font-size: 1.4rem;
      margin-bottom: 15px;
    }

    .privacy-3 .data-usage .usage-card p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      margin-bottom: 25px;
      font-size: 0.95rem;
    }

    .privacy-3 .data-usage .usage-card .usage-list {
      list-style: none;
      padding: 0;
      margin: 0;
      text-align: left;
      height: 300px;
      overflow-y: auto;
    }

    .privacy-3 .data-usage .usage-card .usage-list li {
      position: relative;
      padding-left: 20px;
      margin-bottom: 12px;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      font-size: 0.95rem;
    }

    .privacy-3 .data-usage .usage-card .usage-list li:last-child {
      margin-bottom: 0;
    }

    .privacy-3 .data-usage .usage-card .usage-list li::before {
      content: "→";
      position: absolute;
      left: 0;
      color: var(--accent-color);
    }

    .privacy-3 .privacy-controls {
      margin-bottom: 70px;
    }

    .privacy-3 .privacy-controls .controls-wrapper {
      background-color: var(--surface-color);
      border-radius: 30px;
      padding: 60px;
    }

    @media (max-width: 576px) {
      .privacy-3 .privacy-controls .controls-wrapper {
        padding: 40px 20px;
      }
    }

    .privacy-3 .privacy-controls .controls-wrapper h3 {
      text-align: center;
      font-size: 2.5rem;
      margin-bottom: 50px;
    }

    .privacy-3 .privacy-controls .controls-wrapper .controls-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px;
    }

    @media (max-width: 767px) {
      .privacy-3 .privacy-controls .controls-wrapper .controls-grid {
        grid-template-columns: 1fr;
      }
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item {
      display: flex;
      gap: 25px;
      padding: 30px;
      background-color: var(--background-color);
      border-radius: 20px;
      transition: transform 0.3s;
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item:hover {
      transform: translateY(-5px);
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item:hover .control-number {
      background-color: var(--accent-color);
      color: var(--contrast-color);
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item .control-number {
      flex-shrink: 0;
      width: 50px;
      height: 50px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      color: var(--accent-color);
      border-radius: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      font-size: 1.2rem;
      transition: all 0.3s;
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item .control-content h4 {
      font-size: 1.3rem;
      margin-bottom: 10px;
    }

    .privacy-3 .privacy-controls .controls-wrapper .control-item .control-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 0.95rem;
      margin: 0;
    }

    .privacy-3 .privacy-contact .contact-wrapper {
      max-width: 800px;
      margin: 0 auto;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card {
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 95%) 0%, color-mix(in srgb, var(--accent-color), transparent 98%) 100%);
      border-radius: 30px;
      overflow: hidden;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content {
      padding: 50px;
      text-align: center;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content h4 {
      font-size: 2rem;
      margin-bottom: 15px;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      margin-bottom: 30px;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 20px;
    }

    @media (max-width: 576px) {
      .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods {
        flex-direction: column;
      }
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-email {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 25px;
      background-color: var(--surface-color);
      color: var(--heading-color);
      border-radius: 30px;
      text-decoration: none;
      font-weight: 500;
      transition: all 0.3s;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-email:hover {
      transform: translateY(-2px);
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-email i {
      font-size: 1.2rem;
      color: var(--accent-color);
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .divider {
      color: color-mix(in srgb, var(--default-color), transparent 50%);
    }

    @media (max-width: 576px) {
      .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .divider {
        display: none;
      }
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-form {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 25px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      border-radius: 30px;
      text-decoration: none;
      font-weight: 500;
      transition: all 0.3s;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-form:hover {
      transform: translateY(-2px);
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-form i {
      font-size: 1.2rem;
      transition: transform 0.3s;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-content .contact-methods .contact-form:hover i {
      transform: translateX(5px);
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-footer {
      padding: 20px;
      background-color: var(--surface-color);
      text-align: center;
    }

    .privacy-3 .privacy-contact .contact-wrapper .contact-card .card-footer .update-text {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 0.9rem;
      margin: 0;
    }
    
  /* <style id="section-iFlpm2YVOF-style"> */
    .paymnt-methods .payments-hero {
      text-align: center;
      margin-bottom: 70px;
      position: relative;
      padding: 60px 0;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 95%) 0%, color-mix(in srgb, var(--accent-color), transparent 98%) 100%);
      border-radius: 30px;
    }

    .paymnt-methods .payments-hero .hero-content {
      max-width: 700px;
      margin: 0 auto;
    }

    .paymnt-methods .payments-hero .hero-content h2 {
      font-size: 3rem;
      margin-bottom: 15px;
    }

    .paymnt-methods .payments-hero .hero-content p {
      font-size: 1.2rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      margin-bottom: 30px;
    }

    .paymnt-methods .payments-hero .hero-content .security-badges {
      display: flex;
      justify-content: center;
      gap: 20px;
    }

    .paymnt-methods .payments-hero .hero-content .security-badges .badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 20px;
      background-color: var(--surface-color);
      border-radius: 30px;
      font-weight: 500;
      color: var(--accent-color);
    }

    .paymnt-methods .payments-hero .hero-content .security-badges .badge i {
      font-size: 1.2rem;
    }

    .paymnt-methods .payment-cards {
      margin-bottom: 70px;
    }

    .paymnt-methods .payment-cards .cards-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
    }

    @media (max-width: 991px) {
      .paymnt-methods .payment-cards .cards-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 576px) {
      .paymnt-methods .payment-cards .cards-grid {
        grid-template-columns: 1fr;
      }
    }

    .paymnt-methods .payment-cards .payment-method {
      background-color: var(--surface-color);
      border-radius: 20px;
      padding: 40px 30px;
      position: relative;
      overflow: hidden;
      transition: transform 0.3s;
    }

    .paymnt-methods .payment-cards .payment-method::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, var(--accent-color) 0%, color-mix(in srgb, var(--accent-color), transparent 80%) 100%);
      opacity: 0;
      transition: opacity 0.3s;
    }

    .paymnt-methods .payment-cards .payment-method:hover {
      transform: translateY(-10px);
    }

    .paymnt-methods .payment-cards .payment-method:hover::before {
      opacity: 1;
    }

    .paymnt-methods .payment-cards .payment-method .method-icon {
      width: 70px;
      height: 70px;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 90%) 0%, color-mix(in srgb, var(--accent-color), transparent 95%) 100%);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 25px;
    }

    .paymnt-methods .payment-cards .payment-method .method-icon i {
      font-size: 2rem;
      color: var(--accent-color);
    }

    .paymnt-methods .payment-cards .payment-method .method-content h4 {
      font-size: 1.4rem;
      margin-bottom: 10px;
    }

    .paymnt-methods .payment-cards .payment-method .method-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      margin-bottom: 20px;
    }

    .paymnt-methods .payment-cards .payment-method .method-content .supported-cards {
      display: flex;
      gap: 10px;
    }

    .paymnt-methods .payment-cards .payment-method .method-content .supported-cards img {
      height: 25px;
      width: auto;
    }

    .paymnt-methods .payment-cards .payment-method .method-content .method-features {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .paymnt-methods .payment-cards .payment-method .method-content .method-features span {
      padding: 6px 12px;
      background-color: color-mix(in srgb, var(--default-color), transparent 95%);
      border-radius: 6px;
      font-size: 0.9rem;
      color: var(--heading-color);
    }

    .paymnt-methods .payment-cards .payment-method .method-footer {
      position: absolute;
      top: 20px;
      right: 20px;
    }

    .paymnt-methods .payment-cards .payment-method .method-footer .tag {
      padding: 6px 12px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      color: var(--accent-color);
      border-radius: 20px;
      font-size: 0.85rem;
      font-weight: 500;
    }

    .paymnt-methods .payment-features {
      margin-bottom: 70px;
    }

    .paymnt-methods .payment-features .features-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
    }

    @media (max-width: 991px) {
      .paymnt-methods .payment-features .features-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 576px) {
      .paymnt-methods .payment-features .features-grid {
        grid-template-columns: 1fr;
      }
    }

    .paymnt-methods .payment-features .feature-item {
      display: flex;
      gap: 20px;
      padding: 30px;
      background-color: var(--surface-color);
      border-radius: 20px;
      transition: transform 0.3s;
    }

    .paymnt-methods .payment-features .feature-item:hover {
      transform: translateY(-5px);
    }

    .paymnt-methods .payment-features .feature-item:hover .feature-icon {
      background-color: var(--accent-color);
    }

    .paymnt-methods .payment-features .feature-item:hover .feature-icon i {
      color: var(--contrast-color);
    }

    .paymnt-methods .payment-features .feature-item .feature-icon {
      flex-shrink: 0;
      width: 50px;
      height: 50px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
      border-radius: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s;
    }

    .paymnt-methods .payment-features .feature-item .feature-icon i {
      font-size: 1.5rem;
      color: var(--accent-color);
      transition: color 0.3s;
    }

    .paymnt-methods .payment-features .feature-item .feature-content h5 {
      font-size: 1.2rem;
      margin-bottom: 8px;
    }

    .paymnt-methods .payment-features .feature-item .feature-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      margin: 0;
      font-size: 0.95rem;
    }

    .paymnt-methods .payment-process {
      margin-bottom: 70px;
      text-align: center;
    }

    .paymnt-methods .payment-process .process-header {
      margin-bottom: 40px;
    }

    .paymnt-methods .payment-process .process-header h3 {
      font-size: 2rem;
      margin-bottom: 10px;
    }

    .paymnt-methods .payment-process .process-header p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .paymnt-methods .payment-process .process-timeline {
      display: flex;
      justify-content: space-between;
      position: relative;
      max-width: 900px;
      margin: 0 auto;
      padding: 40px 0;
    }

    .paymnt-methods .payment-process .process-timeline::before {
      content: "";
      position: absolute;
      top: 60px;
      left: 40px;
      right: 40px;
      height: 2px;
      background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
    }

    @media (max-width: 768px) {
      .paymnt-methods .payment-process .process-timeline {
        flex-direction: column;
        gap: 40px;
      }

      .paymnt-methods .payment-process .process-timeline::before {
        display: none;
      }
    }

    .paymnt-methods .payment-process .process-timeline .timeline-item {
      flex: 1;
      position: relative;
      z-index: 1;
    }

    .paymnt-methods .payment-process .process-timeline .timeline-item .timeline-marker {
      width: 40px;
      height: 40px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
      font-weight: 600;
    }

    .paymnt-methods .payment-process .process-timeline .timeline-item .timeline-content h5 {
      font-size: 1.2rem;
      margin-bottom: 8px;
    }

    .paymnt-methods .payment-process .process-timeline .timeline-item .timeline-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      font-size: 0.95rem;
      margin: 0;
    }

    .paymnt-methods .payment-faq {
      margin-bottom: 70px;
      background-color: var(--surface-color);
      border-radius: 30px;
      padding: 60px;
    }

    @media (max-width: 767px) {
      .paymnt-methods .payment-faq {
        padding: 40px 20px;
      }
    }

    .paymnt-methods .payment-faq .faq-image img {
      max-width: 100%;
      height: auto;
    }

    .paymnt-methods .payment-faq .faq-content h3 {
      font-size: 2rem;
      margin-bottom: 30px;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item {
      border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      margin-bottom: 20px;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item:last-child {
      border-bottom: none;
      margin-bottom: 0;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item .faq-header {
      margin: 0;
      padding: 15px 0;
      font-size: 1.1rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;
      color: var(--heading-color);
      font-weight: 600;
      transition: color 0.3s;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item .faq-header i {
      color: var(--accent-color);
      transition: transform 0.3s;
      font-size: 1.2rem;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item .faq-answer {
      display: none;
      padding: 0 0 15px;
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item .faq-answer p {
      margin: 0;
      color: color-mix(in srgb, var(--default-color), transparent 30%);
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item.faq-active .faq-header {
      color: var(--accent-color);
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item.faq-active .faq-header i {
      transform: rotate(180deg);
    }

    .paymnt-methods .payment-faq .faq-content .faq-items .faq-item.faq-active .faq-answer {
      display: block;
    }

    .paymnt-methods .payment-help .help-box {
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 95%) 0%, color-mix(in srgb, var(--accent-color), transparent 98%) 100%);
      border-radius: 30px;
      padding: 40px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
    }

    @media (max-width: 767px) {
      .paymnt-methods .payment-help .help-box {
        flex-direction: column;
        text-align: center;
      }
    }

    .paymnt-methods .payment-help .help-box .help-icon {
      flex-shrink: 0;
      width: 60px;
      height: 60px;
      background-color: var(--accent-color);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .paymnt-methods .payment-help .help-box .help-icon i {
      font-size: 2rem;
      color: var(--contrast-color);
    }

    .paymnt-methods .payment-help .help-box .help-content {
      flex: 1;
    }

    .paymnt-methods .payment-help .help-box .help-content h4 {
      font-size: 1.5rem;
      margin-bottom: 8px;
    }

    .paymnt-methods .payment-help .help-box .help-content p {
      color: color-mix(in srgb, var(--default-color), transparent 30%);
      margin: 0;
    }

    .paymnt-methods .payment-help .help-box .help-action .help-button {
      display: inline-block;
      padding: 12px 30px;
      background-color: var(--accent-color);
      color: var(--contrast-color);
      border-radius: 30px;
      text-decoration: none;
      font-weight: 500;
      transition: all 0.3s;
    }

    .paymnt-methods .payment-help .help-box .help-action .help-button:hover {
      transform: translateY(-3px);
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    }
    
  /* <style id="section-tfHDu7M9Ht-style"> */
    .mission-values {
      background: color-mix(in srgb, var(--accent-color), transparent 97%);
    }

    .mission-feature {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
      gap: 36px;
      align-items: stretch;
    }

    .mission-copy,
    .mission-image-panel,
    .vision-panel,
    .governance-panel,
    .values-panel {
      border-radius: 8px;
      background: var(--surface-color);
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      box-shadow: 0 14px 34px rgba(0, 0, 0, 0.05);
    }

    .mission-copy {
      padding: 42px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .mission-label {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: var(--accent-color);
      font-size: 18px;
      font-weight: 900;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      margin-bottom: 16px;
      line-height: 1.2;
    }

    .mission-label i {
      width: 42px;
      height: 42px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      background: color-mix(in srgb, var(--accent-color), transparent 88%);
      color: var(--accent-color);
      font-size: 22px;
      transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
    }

    .mission-copy h2 {
      font-size: 38px;
      line-height: 1.2;
      margin-bottom: 18px;
      color: var(--heading-color);
      font-weight: 800;
    }

    .mission-copy p,
    .vision-panel p,
    .governance-list p,
    .values-intro p,
    .values-grid p {
      color: color-mix(in srgb, var(--default-color), transparent 22%);
      line-height: 1.7;
    }

    .mission-points {
      display: grid;
      gap: 10px;
      margin-top: 18px;
    }

    .mission-points span {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 14px;
      border-radius: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 96%);
      color: color-mix(in srgb, var(--heading-color), transparent 10%);
      font-weight: 600;
      transition: transform 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
    }

    .mission-points span:hover {
      transform: translateX(6px);
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.06);
    }

    .mission-points i {
      color: #1f9d72;
      font-size: 20px;
    }

    .mission-image-panel {
      min-height: 430px;
      padding: 18px;
      background: linear-gradient(135deg, #f7f9fb 0%, #eef3f8 100%);
      /* display: flex;
      justify-content: center;
      align-items: center; */
    }

    .blank-image {
      width: 100%;
      height: 100%;
      min-height: 394px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      border: 1px dashed color-mix(in srgb, var(--default-color), transparent 70%);
      border-radius: 8px;
      color: color-mix(in srgb, var(--default-color), transparent 45%);
      background: rgba(255, 255, 255, 0.72);
      transition: transform 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
      overflow: hidden;
    }

    .mission-image-panel:hover .blank-image {
      transform: scale(0.985);
      border-color: color-mix(in srgb, var(--accent-color), transparent 35%);
      background: rgba(255, 255, 255, 0.9);
    }

    .mvc-img {
      max-width: 100%;
      height: auto;
      object-fit: contain;
    }

    .vision-panel {
      height: 100%;
      padding: 34px;
      background: #1c3c7e;
      color: #ffffff;
    }

    .vision-panel .mission-label {
      color: #92c5ff;
    }

    .vision-panel .mission-label i {
      background: rgba(146, 197, 255, 0.16);
      color: #92c5ff;
    }

    .mission-copy:hover .mission-label i,
    .vision-panel:hover .mission-label i,
    .values-panel:hover .mission-label i {
      transform: rotate(-8deg) scale(1.08);
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .vision-panel h3 {
      color: #ffffff;
      font-size: 30px;
      line-height: 1.25;
      margin-bottom: 16px;
      font-weight: 800;
    }

    .vision-panel p {
      color: rgba(255, 255, 255, 0.78);
      margin-bottom: 0;
    }

    .governance-panel {
      height: 100%;
      padding: 34px;
    }

    .panel-heading h3,
    .values-intro h3 {
      font-size: 28px;
      line-height: 1.25;
      font-weight: 800;
      margin-bottom: 20px;
      color: var(--heading-color);
    }

    .governance-list {
      display: grid;
      gap: 18px;
    }

    .governance-list > div {
      display: grid;
      grid-template-columns: 48px 1fr;
      gap: 16px;
      padding-top: 18px;
      border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
      transition: transform 0.25s ease, border-color 0.25s ease;
    }

    .governance-list > div:hover {
      transform: translateX(6px);
      border-color: color-mix(in srgb, var(--accent-color), transparent 60%);
    }

    .governance-list i {
      width: 48px;
      height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
      background: color-mix(in srgb, var(--accent-color), transparent 90%);
      color: var(--accent-color);
      font-size: 23px;
      transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease;
    }

    .governance-list > div:hover i {
      transform: scale(1.08);
      background: var(--accent-color);
      color: var(--contrast-color);
    }

    .governance-list h4,
    .values-grid h4 {
      font-size: 18px;
      font-weight: 800;
      color: var(--heading-color);
      margin-bottom: 6px;
    }

    .governance-list p,
    .values-grid p {
      margin-bottom: 0;
      font-size: 14px;
    }

    .values-panel {
      padding: 34px;
      display: grid;
      grid-template-columns: minmax(240px, 0.75fr) minmax(0, 1.25fr);
      gap: 28px;
      align-items: start;
    }

    .values-intro p {
      margin-bottom: 0;
    }

    .values-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
    }

    .values-grid > div {
      min-height: 100%;
      padding: 22px;
      border-radius: 8px;
      background: #f8fafc;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 92%);
      transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .values-grid > div:hover {
      transform: translateY(-6px);
      border-color: color-mix(in srgb, var(--accent-color), transparent 68%);
      box-shadow: 0 14px 28px rgba(0, 0, 0, 0.08);
    }

    .values-grid i {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      border-radius: 8px;
      margin-bottom: 16px;
      background: #fff4df;
      color: #a86500;
      font-size: 22px;
      transition: transform 0.25s ease;
    }

    .values-grid > div:hover i {
      transform: rotate(-6deg) scale(1.08);
    }

    .values-grid > div:nth-child(2) i {
      background: #eaf7ef;
      color: #1f7a4d;
    }

    .values-grid > div:nth-child(3) i {
      background: #edf3ff;
      color: #2d60b8;
    }

    .values-grid > div:nth-child(4) i {
      background: #f4efff;
      color: #6940a5;
    }

    @media (max-width: 992px) {
      .mission-feature,
      .values-panel {
        grid-template-columns: 1fr;
      }

      .mission-copy h2 {
        font-size: 32px;
      }

      .mission-image-panel {
        min-height: 320px;
        display: none;
      }

      .vision-feature {
        margin-top: 0.1rem !important;
      }

      .blank-image {
        min-height: 284px;
      }
    }

    @media (max-width: 576px) {
      .mission-copy,
      .vision-panel,
      .governance-panel,
      .values-panel {
        padding: 24px;
      }

      .mission-copy h2 {
        font-size: 28px;
      }

      .vision-panel h3,
      .panel-heading h3,
      .values-intro h3 {
        font-size: 24px;
      }

      .governance-list > div {
        grid-template-columns: 1fr;
      }

      .values-grid {
        grid-template-columns: 1fr;
      }
    }

    .services-3 {
      background: linear-gradient(135deg, var(--background-color) 0%, color-mix(in srgb, var(--accent-color), transparent 95%) 100%);
      position: relative;
      overflow: hidden;
    }

    .services-3::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: url("https://builder.bootstrapmade.com/static/img/abstract-bg-3.webp") center/cover;
      opacity: 0.03;
      z-index: 1;
    }

    .services-3 .container {
      position: relative;
      z-index: 2;
    }

    .services-3 .service-card {
      background: var(--surface-color);
      border-radius: 20px;
      padding: 40px 30px;
      height: 100%;
      position: relative;
      overflow: hidden;
      transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      border: 1px solid color-mix(in srgb, var(--accent-color), transparent 90%);
      box-shadow: 0 10px 40px color-mix(in srgb, var(--heading-color), transparent 90%);
    }

    .services-3 .service-card:hover {
      transform: translateY(-15px);
      box-shadow: 0 25px 60px color-mix(in srgb, var(--accent-color), transparent 80%);
    }

    .services-3 .service-card:hover .service-bg {
      opacity: 1;
      transform: scale(1.2) rotate(15deg);
    }

    .services-3 .service-card:hover .service-icon {
      transform: scale(1.1) rotate(5deg);
      background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #ff6b35 30%));
    }

    .services-3 .service-card:hover .btn-cta {
      background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #ff6b35 30%));
      transform: translateX(5px);
    }

    .services-3 .service-card.featured {
      background: linear-gradient(135deg, var(--surface-color), color-mix(in srgb, var(--accent-color), transparent 95%));
      border: 2px solid var(--accent-color);
      transform: scale(1.02);
    }

    .services-3 .service-card.featured .service-icon {
      background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color), #ff6b35 20%));
      width: 80px;
      height: 80px;
    }

    .services-3 .service-card.featured .service-icon i {
      font-size: 40px;
    }

    .services-3 .service-card.featured .service-content h3 {
      font-size: 28px;
      margin-bottom: 20px;
    }

    .services-3 .service-card.featured .service-meta {
      margin: 25px 0;
    }

    .services-3 .service-card.compact {
      padding: 30px 25px;
    }

    .services-3 .service-card.compact .service-icon {
      width: 60px;
      height: 60px;
    }

    .services-3 .service-card.compact .service-icon i {
      font-size: 28px;
    }

    .services-3 .service-card .service-bg {
      position: absolute;
      top: -50%;
      right: -30%;
      width: 200px;
      height: 200px;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 85%), color-mix(in srgb, var(--accent-color), transparent 95%));
      border-radius: 50%;
      opacity: 0;
      transition: all 0.5s ease;
      z-index: 1;
    }

    .services-3 .service-card .service-icon {
      width: 70px;
      height: 70px;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 10%), var(--accent-color));
      border-radius: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 25px;
      transition: all 0.3s ease;
      position: relative;
      z-index: 2;
      box-shadow: 0 8px 25px color-mix(in srgb, var(--accent-color), transparent 70%);
    }

    .services-3 .service-card .service-icon i {
      font-size: 32px;
      color: var(--contrast-color);
      transition: all 0.3s ease;
    }

    .services-3 .service-card .service-content {
      position: relative;
      z-index: 2;
    }

    .services-3 .service-card .service-content h3 {
      font-size: 24px;
      font-weight: 700;
      margin-bottom: 15px;
      line-height: 1.3;
    }

    .services-3 .service-card .service-content h3 a {
      color: var(--heading-color);
      text-decoration: none;
      transition: all 0.3s ease;
    }

    .services-3 .service-card .service-content h3 a:hover {
      color: var(--accent-color);
    }

    .services-3 .service-card .service-content p {
      color: color-mix(in srgb, var(--default-color), transparent 20%);
      line-height: 1.6;
      margin-bottom: 25px;
      font-size: 15px;
    }

    .services-3 .service-card .service-meta {
      display: flex;
      align-items: center;
      gap: 15px;
      margin: 20px 0 25px;
      flex-wrap: wrap;
    }

    .services-3 .service-card .service-meta .badge {
      background: linear-gradient(135deg, #ff6b35, #f7931e);
      color: var(--contrast-color);
      padding: 5px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    .services-3 .service-card .service-meta .badge.popular {
      background: linear-gradient(135deg, #28a745, #20c997);
    }

    .services-3 .service-card .service-meta .price {
      color: var(--accent-color);
      font-weight: 700;
      font-size: 16px;
    }

    .services-3 .service-card .btn-cta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color), transparent 10%), var(--accent-color));
      color: var(--contrast-color);
      padding: 12px 25px;
      border-radius: 50px;
      text-decoration: none;
      font-weight: 600;
      font-size: 14px;
      transition: all 0.3s ease;
      box-shadow: 0 5px 20px color-mix(in srgb, var(--accent-color), transparent 70%);
    }

    .services-3 .service-card .btn-cta:hover {
      color: var(--contrast-color);
      box-shadow: 0 8px 30px color-mix(in srgb, var(--accent-color), transparent 60%);
    }

    .services-3 .service-card .btn-cta i {
      transition: all 0.3s ease;
    }

    .services-3 .stats-highlight {
      background: var(--accent-color);
      border-radius: 25px;
      padding: 50px 30px;
      margin-top: 60px;
      position: relative;
      overflow: hidden;
    }

    .services-3 .stats-highlight::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(135deg, transparent, color-mix(in srgb, var(--accent-color), transparent 90%));
      z-index: 1;
    }

    .services-3 .stats-highlight .row {
      position: relative;
      z-index: 2;
    }

    .services-3 .stats-highlight .stat-item {
      text-align: center;
      color: var(--contrast-color);
    }

    .services-3 .stats-highlight .stat-item .stat-number {
      font-size: 48px;
      font-weight: 900;
      color: var(--contrast-color);
      margin-bottom: 10px;
      background: linear-gradient(135deg, var(--contrast-color), color-mix(in srgb, var(--accent-color), var(--contrast-color) 70%));
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    @media (max-width: 768px) {
      .services-3 .stats-highlight .stat-item .stat-number {
        font-size: 36px;
      }
    }

    .services-3 .stats-highlight .stat-item .stat-label {
      font-size: 16px;
      font-weight: 500;
      opacity: 0.9;
    }

    @media (max-width: 768px) {
      .services-3 .stats-highlight .stat-item .stat-label {
        font-size: 14px;
      }
    }

    @media (max-width: 768px) {
      .services-3 .service-card {
        padding: 30px 25px;
        margin-bottom: 30px;
      }

      .services-3 .service-card.featured {
        transform: none;
        margin-bottom: 30px;
      }

      .services-3 .service-card.featured .service-content h3 {
        font-size: 24px;
      }

      .services-3 .service-card .service-icon {
        width: 60px;
        height: 60px;
      }

      .services-3 .service-card .service-icon i {
        font-size: 28px;
      }

      .services-3 .service-card .service-content h3 {
        font-size: 20px;
      }

      .services-3 .stats-highlight {
        padding: 40px 20px;
        margin-top: 40px;
      }
    }
    
  /* <style id="section-x03Q07x34A-style"> */
    .gallery-3 {
      padding: 70px 0;
    }

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

    @media (min-width: 576px) {
      .gallery-3 .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (min-width: 992px) {
      .gallery-3 .gallery-grid {
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 20px;
      }
    }

    .gallery-3 .gallery-item {
      position: relative;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      transform: translateY(0);
      transition: all 0.4s ease;
    }

    .gallery-3 .gallery-item.featured {
      grid-row: span 2;
    }

    @media (min-width: 768px) {
      .gallery-3 .gallery-item.featured {
        grid-column: span 2;
      }
    }

    .gallery-3 .gallery-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.6s ease;
    }

    .gallery-3 .gallery-item .gallery-overlay {
      position: absolute;
      inset: 0;
      background: color-mix(in srgb, var(--accent-color), transparent 70%);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.4s ease;
    }

    .gallery-3 .gallery-item .gallery-overlay i {
      color: var(--contrast-color);
      font-size: 2rem;
      transform: scale(0.5);
      transition: transform 0.4s ease;
    }

    .gallery-3 .gallery-item:hover {
      transform: translateY(-5px);
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
    }

    .gallery-3 .gallery-item:hover img {
      transform: scale(1.1);
    }

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

    .gallery-3 .gallery-item:hover .gallery-overlay i {
      transform: scale(1);
    }

    .gallery-3 .btn-view-more {
      display: inline-block;
      background-color: transparent;
      color: var(--accent-color);
      font-weight: 600;
      padding: 12px 30px;
      border: 2px solid var(--accent-color);
      border-radius: 50px;
      text-transform: uppercase;
      letter-spacing: 1px;
      transition: all 0.3s ease;
    }

    .gallery-3 .btn-view-more i {
      transition: transform 0.3s ease;
      margin-left: 5px;
    }

    .gallery-3 .btn-view-more:hover {
      background-color: var(--accent-color);
      color: var(--contrast-color);
    }

    .gallery-3 .btn-view-more:hover i {
      transform: translateX(5px);
    }

  /* <style id="section-ShIWAkA84u-style"> */
    .hero-7 {
      position: relative;
      overflow: hidden;
    }

    .hero-7 .hero-title {
      font-size: 3.5rem;
      font-weight: 700;
      margin-bottom: 1.5rem;
      background: linear-gradient(45deg, var(--heading-color), var(--accent-color));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .hero-7 .hero-desc {
      font-size: 1.2rem;
      margin-bottom: 2rem;
      color: color-mix(in srgb, var(--default-color), transparent 20%);
    }

    .hero-7 .btn {
      padding: 0.75rem 2.5rem;
      font-weight: 500;
      transition: all 0.3s ease;
      border-radius: 50px;
    }

    .hero-7 .btn-primary {
      background-color: var(--accent-color);
      border-color: var(--accent-color);
      color: var(--contrast-color);
    }

    .hero-7 .btn-primary:hover {
      background-color: color-mix(in srgb, var(--accent-color), transparent 15%);
      border-color: color-mix(in srgb, var(--accent-color), transparent 15%);
    }

    .hero-7 .btn-outline-primary {
      color: var(--accent-color);
      border-color: var(--accent-color);
    }

    .hero-7 .btn-outline-primary:hover {
      background-color: var(--accent-color);
      color: var(--contrast-color);
    }

    .hero-7 .hero-image {
      position: relative;
      z-index: 1;
      margin: 0 auto;
      padding: 0 20px;
    }

    .hero-7 .hero-image img {
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    }

    .hero-7 .floating-card {
      position: absolute;
      background-color: var(--surface-color);
      border-radius: 10px;
      padding: 15px 20px;
      display: flex;
      align-items: center;
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    }

    .hero-7 .floating-card i {
      font-size: 1.5rem;
      margin-right: 10px;
      color: var(--accent-color);
    }

    .hero-7 .floating-card span {
      font-weight: 600;
      color: var(--heading-color);
    }

    .hero-7 .floating-card.card-1 {
      top: -20px;
      left: 0;
    }

    .hero-7 .floating-card.card-2 {
      bottom: -20px;
      right: 0;
    }

    .hero-7 .shape {
      position: absolute;
      opacity: 0.1;
    }

    .hero-7 .shape-1 {
      width: 300px;
      height: 300px;
      background-color: var(--accent-color);
      border-radius: 50%;
      top: -150px;
      left: -150px;
    }

    .hero-7 .shape-2 {
      width: 200px;
      height: 200px;
      background-color: var(--heading-color);
      border-radius: 50%;
      bottom: -100px;
      right: -100px;
    }

    .hero-7 .shape-3 {
      width: 150px;
      height: 150px;
      background-color: var(--accent-color);
      border-radius: 50%;
      top: 20%;
      right: 5%;
      transform: translate(-50%, -50%);
    }

    @media (max-width: 991.98px) {
      .hero-7 .hero-title {
        font-size: 2.5rem;
      }

      .hero-7 .hero-image {
        max-width: 100%;
      }

      .hero-7 .floating-card {
        padding: 10px 15px;
      }

      .hero-7 .floating-card i {
        font-size: 1.2rem;
      }

      .hero-7 .floating-card span {
        font-size: 0.9rem;
      }
    }
  
/*--------------------------------------------------------------
# Team Section
--------------------------------------------------------------*/
.team .team-card {
  height: 100%;
}

.team .team-card .card-inner {
  background: var(--surface-color);
  border-radius: 20px;
  padding: 40px 30px;
  text-align: center;
  height: 100%;
  position: relative;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 92%);
}

.team .team-card .card-inner:hover {
  transform: translateY(-10px);
  box-shadow: 0 25px 60px color-mix(in srgb, var(--accent-color), transparent 85%);
  border-color: color-mix(in srgb, var(--accent-color), transparent 70%);
}

.team .team-card .card-inner:hover .avatar-container .avatar-ring {
  transform: scale(1.1);
  opacity: 1;
}

.team .team-card .card-inner:hover .avatar-container img {
  transform: scale(1.05);
}

.team .team-card .card-inner:hover .social-links a {
  background: var(--accent-color);
  color: var(--contrast-color);
}

.team .team-card .avatar-container {
  position: relative;
  width: 130px;
  height: 130px;
  margin: 0 auto 25px;
}

.team .team-card .avatar-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  position: relative;
  z-index: 2;
  transition: transform 0.4s ease;
}

.team .team-card .avatar-container .avatar-ring {
  position: absolute;
  top: -8px;
  left: -8px;
  right: -8px;
  bottom: -8px;
  border: 3px solid var(--accent-color);
  border-radius: 50%;
  opacity: 0.5;
  transition: all 0.4s ease;
}

.team .team-card .member-info {
  margin-bottom: 15px;
}

.team .team-card .member-info h4 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 8px 0;
  color: var(--heading-color);
}

.team .team-card .member-info .position {
  display: inline-block;
  font-size: 0.8rem;
  color: var(--accent-color);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 4px 12px;
  background: color-mix(in srgb, var(--accent-color), transparent 90%);
  border-radius: 20px;
}

.team .team-card .member-bio {
  font-size: 0.9rem;
  line-height: 1.7;
  color: color-mix(in srgb, var(--default-color), transparent 30%);
  margin-bottom: 20px;
}

.team .team-card .social-links {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.team .team-card .social-links a {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--default-color), transparent 92%);
  color: var(--default-color);
  font-size: 1rem;
  transition: all 0.3s ease;
}

.team .team-card .social-links a:hover {
  background: color-mix(in srgb, var(--accent-color), black 15%);
  color: var(--contrast-color);
  transform: translateY(-3px);
}

.team .stats-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-top: 60px;
  padding: 0;
}

@media (max-width: 992px) {
  .team .stats-row {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

@media (max-width: 576px) {
  .team .stats-row {
    grid-template-columns: 1fr;
  }
}

.team .stats-row .stat-item {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 30px;
  background: var(--surface-color);
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
  transition: all 0.3s ease;
}

.team .stats-row .stat-item:hover {
  border-color: var(--accent-color);
  transform: translateY(-5px);
  box-shadow: 0 15px 40px color-mix(in srgb, var(--accent-color), transparent 88%);
}

.team .stats-row .stat-item:hover .stat-icon {
  background: var(--accent-color);
  color: var(--contrast-color);
}

.team .stats-row .stat-item .stat-icon {
  width: 60px;
  height: 60px;
  min-width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent-color), transparent 88%);
  color: var(--accent-color);
  font-size: 1.5rem;
  transition: all 0.3s ease;
}

.team .stats-row .stat-item .stat-data {
  display: flex;
  flex-direction: column;
}

.team .stats-row .stat-item .stat-data .stat-value {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--heading-color);
  line-height: 1.2;
}

.team .stats-row .stat-item .stat-data .stat-label {
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--default-color), transparent 30%);
  margin-top: 4px;
}

.team .join-team-banner {
  margin-top: 60px;
  background: linear-gradient(120deg, var(--accent-color) 0%, color-mix(in srgb, var(--accent-color), black 25%) 100%);
  border-radius: 24px;
  padding: 60px;
  position: relative;
  overflow: hidden;
}

@media (max-width: 768px) {
  .team .join-team-banner {
    padding: 40px 30px;
  }
}

.team .join-team-banner .banner-bg-pattern {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: radial-gradient(circle at 20% 80%, color-mix(in srgb, var(--contrast-color), transparent 90%) 0%, transparent 50%), radial-gradient(circle at 80% 20%, color-mix(in srgb, var(--contrast-color), transparent 92%) 0%, transparent 40%);
  pointer-events: none;
}

.team .join-team-banner .banner-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

@media (max-width: 992px) {
  .team .join-team-banner .banner-content {
    flex-direction: column;
    text-align: center;
  }
}

.team .join-team-banner .banner-text {
  flex: 1;
}

.team .join-team-banner .banner-text .badge-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: color-mix(in srgb, var(--contrast-color), transparent 85%);
  color: var(--contrast-color);
  padding: 8px 18px;
  border-radius: 30px;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 20px;
}

.team .join-team-banner .banner-text .badge-label i {
  font-size: 1rem;
}

.team .join-team-banner .banner-text h3 {
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--contrast-color);
  margin: 0 0 15px 0;
}

@media (max-width: 768px) {
  .team .join-team-banner .banner-text h3 {
    font-size: 1.75rem;
  }
}

.team .join-team-banner .banner-text p {
  font-size: 1rem;
  color: color-mix(in srgb, var(--contrast-color), transparent 15%);
  line-height: 1.7;
  margin: 0;
  max-width: 550px;
}

@media (max-width: 992px) {
  .team .join-team-banner .banner-text p {
    max-width: none;
  }
}

.team .join-team-banner .banner-actions {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

@media (max-width: 992px) {
  .team .join-team-banner .banner-actions {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
}

@media (max-width: 576px) {
  .team .join-team-banner .banner-actions {
    flex-direction: column;
    width: 100%;
  }
}

.team .join-team-banner .banner-actions .btn-primary-action,
.team .join-team-banner .banner-actions .btn-secondary-action {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 30px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.team .join-team-banner .banner-actions .btn-primary-action i,
.team .join-team-banner .banner-actions .btn-secondary-action i {
  font-size: 1.1rem;
}

.team .join-team-banner .banner-actions .btn-primary-action {
  background: var(--contrast-color);
  color: var(--accent-color);
}

.team .join-team-banner .banner-actions .btn-primary-action:hover {
  background: var(--surface-color);
  transform: translateY(-3px);
  box-shadow: 0 10px 30px color-mix(in srgb, black, transparent 70%);
}

.team .join-team-banner .banner-actions .btn-secondary-action {
  background: transparent;
  border: 2px solid color-mix(in srgb, var(--contrast-color), transparent 50%);
  color: var(--contrast-color);
}

.team .join-team-banner .banner-actions .btn-secondary-action:hover {
  background: color-mix(in srgb, var(--contrast-color), transparent 85%);
  border-color: var(--contrast-color);
  transform: translateY(-3px);
}

/*----------------------------------------*/
/* Terms and Conditions
/*----------------------------------------*/
.terms-of-service .header-block {
  margin-bottom: 16px;
}
.terms-of-service .header-block .update-badge {
  display: inline-block;
  padding: 6px 18px;
  background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 80%, #6366f1));
  border-radius: 24px;
  color: var(--contrast-color);
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 20px;
  letter-spacing: -0.01em;
}
.terms-of-service .header-block h2 {
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-bottom: 12px;
}
.terms-of-service .header-block p {
  color: color-mix(in srgb, var(--default-color), transparent 35%);
  font-size: 1.1rem;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.6;
}
.terms-of-service .sidebar-nav {
  position: sticky;
  top: 100px;
  background: var(--surface-color);
  border-radius: 16px;
  padding: 28px 24px;
  border: 1px solid color-mix(in srgb, var(--default-color) 10%, transparent);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--default-color) 6%, transparent);
}
.terms-of-service .sidebar-nav h5 {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: color-mix(in srgb, var(--default-color), transparent 40%);
  margin-bottom: 16px;
  font-weight: 700;
}
.terms-of-service .sidebar-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.terms-of-service .sidebar-nav ul li {
  margin-bottom: 4px;
}
.terms-of-service .sidebar-nav ul li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 0.88rem;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  transition: all 0.3s ease;
  text-decoration: none;
}
.terms-of-service .sidebar-nav ul li a i {
  font-size: 1rem;
  color: color-mix(in srgb, var(--accent-color), transparent 30%);
}
.terms-of-service .sidebar-nav ul li a:hover {
  background: color-mix(in srgb, var(--accent-color) 8%, transparent);
  color: var(--accent-color);
}
.terms-of-service .sidebar-nav ul li a:hover i {
  color: var(--accent-color);
}
@media (max-width: 992px) {
  .terms-of-service .sidebar-nav {
    display: none;
  }
}
.terms-of-service .terms-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.terms-of-service .term-card {
  background: var(--surface-color);
  border-radius: 16px;
  padding: 32px;
  border: 1px solid color-mix(in srgb, var(--default-color) 8%, transparent);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--default-color) 4%, transparent);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.terms-of-service .term-card:hover {
  box-shadow: 0 8px 24px color-mix(in srgb, var(--default-color) 10%, transparent);
  border-color: color-mix(in srgb, var(--accent-color) 20%, transparent);
}
.terms-of-service .term-card .term-card-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.terms-of-service .term-card .term-card-header .term-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 80%, #6366f1));
  color: var(--contrast-color);
  font-size: 0.9rem;
  font-weight: 700;
  flex-shrink: 0;
}
.terms-of-service .term-card .term-card-header h3 {
  font-size: 1.35rem;
  font-weight: 600;
  margin: 0;
  letter-spacing: -0.01em;
}
.terms-of-service .term-card p {
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  line-height: 1.7;
  margin-bottom: 0;
  font-size: 0.95rem;
}
.terms-of-service .highlight-callout {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px;
  background: color-mix(in srgb, var(--accent-color) 6%, transparent);
  border-radius: 12px;
  margin-top: 20px;
  border: 1px solid color-mix(in srgb, var(--accent-color) 15%, transparent);
}
.terms-of-service .highlight-callout .callout-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent-color) 15%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.terms-of-service .highlight-callout .callout-icon i {
  font-size: 1.1rem;
  color: var(--accent-color);
}
.terms-of-service .highlight-callout p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.6;
}
.terms-of-service .check-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: color-mix(in srgb, var(--accent-color) 5%, transparent);
  border-radius: 10px;
  transition: all 0.3s ease;
}
.terms-of-service .check-item i {
  font-size: 1.1rem;
  color: var(--accent-color);
  flex-shrink: 0;
}
.terms-of-service .check-item span {
  font-size: 0.9rem;
  color: color-mix(in srgb, var(--default-color), transparent 15%);
}
.terms-of-service .check-item:hover {
  background: color-mix(in srgb, var(--accent-color) 10%, transparent);
}
.terms-of-service .warning-banner {
  display: flex;
  gap: 16px;
  padding: 24px;
  background: var(--surface-color);
  border-radius: 12px;
  margin-top: 20px;
  border: 1px solid color-mix(in srgb, var(--accent-color) 25%, transparent);
  border-left: 4px solid var(--accent-color);
}
.terms-of-service .warning-banner .warning-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 80%, #6366f1));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.terms-of-service .warning-banner .warning-icon-wrap i {
  font-size: 1.3rem;
  color: var(--contrast-color);
}
.terms-of-service .warning-banner .warning-text h5 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 6px;
}
.terms-of-service .warning-banner .warning-text p {
  margin: 0;
  font-size: 0.9rem;
}
@media (max-width: 576px) {
  .terms-of-service .warning-banner {
    flex-direction: column;
  }
}
.terms-of-service .restrict-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: color-mix(in srgb, #dc3545, transparent 94%);
  border-radius: 10px;
  transition: all 0.3s ease;
}
.terms-of-service .restrict-item i {
  font-size: 1.1rem;
  color: #dc3545;
  flex-shrink: 0;
}
.terms-of-service .restrict-item span {
  font-size: 0.9rem;
  color: color-mix(in srgb, var(--default-color), transparent 15%);
}
.terms-of-service .restrict-item:hover {
  background: color-mix(in srgb, #dc3545, transparent 88%);
}
.terms-of-service .disclaimer-panel {
  background: color-mix(in srgb, var(--default-color) 4%, transparent);
  padding: 24px;
  border-radius: 12px;
  margin-top: 20px;
}
.terms-of-service .disclaimer-panel .panel-lead {
  font-weight: 600;
  margin-bottom: 12px !important;
  font-size: 0.95rem;
  color: var(--heading-color);
}
.terms-of-service .disclaimer-panel ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.terms-of-service .disclaimer-panel ul li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 10px;
  font-size: 0.9rem;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  line-height: 1.6;
}
.terms-of-service .disclaimer-panel ul li:last-child {
  margin-bottom: 0;
}
.terms-of-service .disclaimer-panel ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 80%, #6366f1));
}
.terms-of-service .support-banner {
  margin-top: 32px;
  padding: 32px 40px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--accent-color), color-mix(in srgb, var(--accent-color) 80%, #6366f1));
  color: var(--contrast-color);
}
.terms-of-service .support-banner .banner-icon {
  width: 52px;
  height: 52px;
  background: color-mix(in srgb, var(--contrast-color) 20%, transparent);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.terms-of-service .support-banner .banner-icon i {
  font-size: 1.5rem;
  color: var(--contrast-color);
}
.terms-of-service .support-banner h4 {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 4px;
  color: var(--contrast-color);
}
.terms-of-service .support-banner p {
  margin: 0;
  font-size: 0.9rem;
  color: color-mix(in srgb, var(--contrast-color), transparent 15%);
}
.terms-of-service .support-banner .support-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--contrast-color);
  color: var(--accent-color);
  border-radius: 24px;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--default-color) 15%, transparent);
}
.terms-of-service .support-banner .support-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px color-mix(in srgb, var(--default-color) 25%, transparent);
}
@media (max-width: 768px) {
  .terms-of-service .support-banner {
    padding: 28px 24px;
  }
}
@media print {
  .terms-of-service .support-banner {
    display: none;
  }
  .terms-of-service .sidebar-nav {
    display: none;
  }
  .terms-of-service .term-card {
    page-break-inside: avoid;
  }
} 

/*----------------------------------------*/
/* TEAM ORGANOGRAM
/*----------------------------------------*/
.organogram-section {
  padding: 70px 0 90px;
  background: #ffffff;
}

.organogram-frame {
  --org-scale: 1;
  margin: 0 auto;
  max-width: 1180px;
  padding: 28px;
  background: #ffffff;
  overflow: hidden;
}

.organogram-chart {
  position: relative;
  width: calc(1040px * var(--org-scale));
  height: calc(1010px * var(--org-scale));
  margin: 0 auto;
  font-family: "Roboto", Arial, sans-serif;
  color: #062272;
}

.organogram-canvas {
  position: absolute;
  left: 0;
  top: 0;
  width: 1040px;
  height: 1010px;
  transform: scale(var(--org-scale));
  transform-origin: top left;
}

.org-node {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 76px;
  padding: 10px 22px 10px 14px;
  border: 2px solid #ffffff;
  border-radius: 9px;
  background: linear-gradient(135deg, #008df2 0%, #0054c5 55%, #022571 100%);
  box-shadow: 0 4px 0 rgba(4, 34, 108, 0.25);
  color: #ffffff;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}

.org-node.dark {
  background: linear-gradient(135deg, #09378e 0%, #061a62 100%);
}

.org-node.sm {
  min-height: 64px;
  gap: 14px;
  padding: 9px 18px 9px 12px;
}

.org-node.white {
  min-height: 70px;
  padding: 10px 18px;
  border: 2px solid #0b43b5;
  background: #ffffff;
  box-shadow: none;
  color: #062272;
  font-size: 15px;
  font-weight: 800;
  justify-content: center;
  text-align: center;
}

.org-node.dept {
  display: flex;
  flex-direction: column;
  gap: 0px;
  min-height: 142px;
  padding: 12px 16px 14px;
  text-align: center;
  border-color: #0b43b5;
  background: #ffffff;
  box-shadow: none;
  color: #062272;
  font-size: 18px;
}

.org-node.sub {
  min-height: 68px;
  padding: 10px 15px;
  border: 2px solid #0b43b5;
  background: #ffffff;
  box-shadow: none;
  color: #062272;
  font-size: 14px;
  gap: 12px;
}

/* .org-node.sub.small-text {
  font-size: 13px;
} */

.org-icon {
  flex: 0 0 auto;
  width: 64px;
  height: 64px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #ffffff;
  color: #092d86;
  font-size: 37px;
}

.org-node.sm .org-icon {
  width: 54px;
  height: 54px;
  font-size: 31px;
}

.org-node.white .org-icon,
.org-node.sub .org-icon {
  width: 44px;
  height: 44px;
  border-radius: 4px;
  background: transparent;
  color: #0b3a9a;
  font-size: 36px;
}

.org-node.dept .org-icon {
  width: 66px;
  height: 66px;
  margin: 0 auto 10px;
  border: 3px solid #8fc2ff;
  background: #ffffff;
  color: #0b3a9a;
  font-size: 38px;
}

.org-line {
  position: absolute;
  z-index: 1;
  background: #07358f;
  border-radius: 2px;
}

.org-line.v {
  width: 3px;
}

.org-line.h {
  height: 3px;
}

.org-arrow::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -8px;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 9px solid #07358f;
}

.node-board { left: 330px; top: 40px; width: 380px; font-size: 20px; }
.node-md { left: 350px; top: 170px; width: 340px; font-size: 20px; }
.node-ops { left: 70px; top: 330px; width: 280px; font-size: 19px; }
.node-finance { left: 395px; top: 330px; width: 250px; font-size: 19px; }
.node-marketing { left: 710px; top: 330px; width: 290px; font-size: 18px; }
.node-accountant { left: 425px; top: 450px; width: 190px; }
.node-client { left: 740px; top: 450px; width: 223px; }
.node-recruitment { left: 0px; top: 590px; width: 160px; }
.node-documentation { left: 175px; top: 590px; width: 180px; }
.node-training { left: 370px; top: 590px; width: 216px; }
.node-medical { left: 601px; top: 590px; width: 218px; }
.node-travel { left: 834px; top: 590px; width: 206px; }
.node-rec { left: 0px; top: 760px; width: 160px; }
.node-cv { left: 0px; top: 849px; width: 160px; }
.node-visa { left: 175px; top: 760px; width: 193px; }
.node-passport { left: 175px; top: 849px; width: 180px; }
.node-embassy { left: 175px; top: 943px; width: 180px; }
.node-language { left: 393px; top: 760px; width: 170px; }
.node-predeparture { left: 393px; top: 849px; width: 170px; }
.node-ticketing { left: 860px; top: 760px; width: 160px; }
.node-deployment { left: 860px; top: 849px; width: 160px; }
.line-board-md { left: 520px; top: 132px; height: 30px; }
.line-md-down { left: 520px; top: 262px; height: 32px; }
.line-top-branch { left: 210px; top: 293px; width: 640px; }
.line-ops { left: 210px; top: 293px; height: 29px; }
.line-finance { left: 520px; top: 293px; height: 29px; }
.line-marketing { left: 850px; top: 293px; height: 29px; }
.line-finance-accountant { left: 520px; top: 410px; height: 30px; }
.line-marketing-client { left: 850px; top: 410px; height: 30px; }
.line-ops-down { left: 210px; top: 410px; height: 140px; }
.line-bottom-branch { left: 80px; top: 550px; width: 858px; }
.line-b1 { left: 80px; top: 550px; height: 30px; }
.line-b2 { left: 265px; top: 550px; height: 30px; }
.line-b3 { left: 476px; top: 550px; height: 30px; }
.line-b4 { left: 708px; top: 550px; height: 30px; }
.line-b5 { left: 935px; top: 550px; height: 30px; }
.line-rec-1, .line-doc-1, .line-train-1, .line-travel-1 { top: 738px; height: 13px; }
.line-rec-1, .line-rec-2 { left: 80px; }
.line-doc-1, .line-doc-2, .line-doc-3 { left: 265px; }
.line-train-1, .line-train-2 { left: 475px; }
.line-travel-1, .line-travel-2 { left: 935px; }
.line-rec-2, .line-doc-2, .line-train-2, .line-travel-2 { top: 827px; height: 13px; }
.line-doc-3 { top: 922px; height: 12px; }

@media (max-width: 767.98px) {
  .organogram-section {
    padding: 50px 0 70px;
  }

  .organogram-frame {
    --org-scale: 0.66;
    padding: 16px;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .organogram-frame {
    --org-scale: 0.72;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .organogram-frame {
    --org-scale: 0.86;
  }
}

@media (max-width: 575.98px) {
  .organogram-frame {
    --org-scale: 0.48;
    padding: 12px;
  }
}

@media (max-width: 430px) {
  .organogram-frame {
    --org-scale: 0.36;
    padding: 8px;
  }
}

@media (max-width: 360px) {
  .organogram-frame {
    --org-scale: 0.31;
  }
}

/*--------------------------------------------------------------
# Associates
--------------------------------------------------------------*/
.associates-network {
  padding: 70px 0 90px;
  background: #ffffff;
  overflow: hidden;
}

.network-board {
  max-width: 1180px;
  margin: 0 auto;
  padding: 22px 22px 34px;
  background:
    radial-gradient(circle at 16% 8%, rgba(34, 134, 235, 0.08), transparent 16%),
    linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
}

.network-header {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 20px;
  align-items: center;
  margin-bottom: 28px;
}

.network-globe {
  position: relative;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  background: radial-gradient(circle at 35% 30%, #8fd1ff 0%, #1a7ed5 42%, #003f9d 78%);
  box-shadow: inset 0 0 0 8px rgba(255, 255, 255, 0.8), 0 0 0 2px rgba(32, 125, 217, 0.18);
}

.network-globe::before,
.network-globe::after {
  content: "";
  position: absolute;
  inset: -11px;
  border: 1px solid rgba(34, 126, 217, 0.25);
  border-radius: 50%;
}

.network-globe::after {
  inset: -22px;
  border-right-color: transparent;
  transform: rotate(-18deg);
}

.network-globe i {
  font-size: 84px;
  filter: drop-shadow(0 4px 5px rgba(0, 31, 92, 0.24));
}

.network-heading h2 {
  font-size: 58px;
  line-height: 1.05;
  margin: 0 0 8px;
  color: #082b86;
  font-weight: 900;
  letter-spacing: -1px;
}

.network-heading p {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin: 0;
  color: #0d55b8;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.2px;
}

.network-heading p::after {
  content: "";
  width: 380px;
  height: 3px;
  background: linear-gradient(90deg, #75bfff, #1d75d6);
}

.network-heading p::before {
  content: "";
  position: absolute;
  right: -24px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2c8ce8;
}

.company-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: start;
}

.company-card {
  min-height: 100%;
  padding: 0 20px 20px;
  border: 1px solid #c9ddfb;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 5px 12px rgba(24, 85, 168, 0.09);
}

.company-card.fiji {
  grid-row: span 3;
}

.company-card.wide {
  grid-column: span 1;
}

.country-ribbon {
  position: relative;
  height: 49px;
  margin: 14px 0 16px -13px;
  display: inline-flex;
  align-items: center;
  min-width: 282px;
  padding-left: 84px;
  padding-right: 42px;
  color: #ffffff;
  font-size: 22px;
  font-weight: 900;
  text-transform: uppercase;
  background: linear-gradient(90deg, #032171 0%, #004bb8 52%, #007ef0 100%);
  clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 100%, 0 100%);
  border-radius: 4px 0 0 4px;
}

.country-ribbon::before {
  content: "";
  position: absolute;
  left: 14px;
  top: -8px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #0b3a99;
  border: 4px solid #ffffff;
  box-shadow: 0 0 0 1px #92bbef;
  z-index: 1;
}

.country-ribbon::after {
  content: "";
  position: absolute;
  right: -13px;
  top: 0;
  width: 75px;
  height: 49px;
  background: linear-gradient(239deg, rgb(187 222 255 / 95%) 0 50%, transparent 74% 50%, rgb(72 177 255 / 50%) 50% 50%, transparent 72%);
}

.country-icon {
  position: absolute;
  left: 27px;
  top: 8px;
  z-index: 2;
  color: #ffffff;
  font-size: 31px;
  line-height: 1;
}

.company-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.company-card li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 7px;
  color: #111111;
  font-size: 16px;
  line-height: 1.28;
  font-weight: 500;
}

.company-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0c4aad;
}

@media (max-width: 1199.98px) {
  .network-heading h2 {
    font-size: 48px;
  }

  .network-heading p::after {
    width: 260px;
  }
}

@media (max-width: 991.98px) {
  .network-header {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }

  .network-heading p::after,
  .network-heading p::before {
    display: none;
  }

  .company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .company-card.fiji {
    grid-row: auto;
  }
}

@media (max-width: 767.98px) {
  .associates-network {
    padding: 50px 0 70px;
  }

  .network-board {
    padding: 8px 0 20px;
  }

  .network-globe {
    width: 118px;
    height: 118px;
  }

  .network-globe i {
    font-size: 62px;
  }

  .network-heading h2 {
    font-size: 36px;
  }

  .network-heading p {
    font-size: 21px;
  }

  .company-grid {
    grid-template-columns: 1fr;
  }

  .country-ribbon {
    min-width: min(282px, calc(100% - 28px));
    font-size: 19px;
  }
}
/*----------------------------------------*/
/* Employment Sectors
/*----------------------------------------*/
.employment-sector-section {
  padding: 70px 0 90px;
  background: #f7f9fc;
}

.sector-intro {
  max-width: 900px;
  margin: 0 auto 36px;
  text-align: center;
}

.sector-intro .sector-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--accent-color);
  font-size: 16px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.sector-intro .sector-kicker i {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent-color), transparent 88%);
  color: var(--accent-color);
  font-size: 21px;
}

.sector-intro h2 {
  margin-bottom: 14px;
  color: var(--heading-color);
  font-size: 38px;
  font-weight: 800;
  line-height: 1.2;
}

.sector-intro p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 25%);
  font-size: 16px;
  line-height: 1.75;
}

.sector-card {
  height: 100%;
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 13, 29, 0.05);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.sector-card:hover {
  transform: translateY(-7px);
  border-color: color-mix(in srgb, var(--accent-color), transparent 68%);
  box-shadow: 0 18px 38px rgba(15, 13, 29, 0.1);
}

.sector-card-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.sector-icon {
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent-color), transparent 90%);
  color: var(--accent-color);
  font-size: 30px;
  transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.sector-card:hover .sector-icon {
  transform: rotate(-6deg) scale(1.08);
  background: var(--accent-color);
  color: var(--contrast-color);
}

.sector-card h3 {
  margin: 0;
  color: var(--heading-color);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.25;
}

.sector-card p {
  color: color-mix(in srgb, var(--default-color), transparent 22%);
  line-height: 1.68;
  margin-bottom: 16px;
}

.sector-image-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.sector-image-slot {
  min-height: 118px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px dashed color-mix(in srgb, var(--accent-color), transparent 45%);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-color), transparent 96%);
  color: color-mix(in srgb, var(--heading-color), transparent 28%);
  text-align: center;
  overflow: hidden;
}

.sector-image-slot i {
  color: var(--accent-color);
  font-size: 26px;
}

.sector-image-slot span {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}

.sector-image-slot img {
  width: 100%;
  height: 100%;
  min-height: 118px;
  object-fit: cover;
  display: block;
}

@media (max-width: 767.98px) {
  .employment-sector-section {
    padding: 50px 0 70px;
  }

  .sector-intro h2 {
    font-size: 30px;
  }

  .sector-image-options {
    grid-template-columns: 1fr 1fr;
  }
}
/*----------------------------------------*/
/* Appointment Formalities
/*----------------------------------------*/
.appointment-formalities-section {
  padding: 70px 0 90px;
  background:
    radial-gradient(circle at 12% 8%, rgba(60, 114, 252, 0.12), transparent 24%),
    linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
}

.formalities-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
  margin-bottom: 70px;
  padding: 0 8px;
}

.formalities-intro {
  max-width: 900px;
  margin: 0 auto 42px;
  text-align: center;
}

.formalities-intro span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: #3c72fc;
  font-size: 15px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.formalities-intro span i {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(60, 114, 252, 0.12);
  color: #3c72fc;
  font-size: 20px;
}

.formalities-intro h2 {
  margin: 0 0 12px;
  color: #082b86;
  font-size: 38px;
  font-weight: 900;
  line-height: 1.18;
}

.formalities-intro p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 25%);
  font-size: 16px;
  line-height: 1.75;
}

.formalities-timeline::before {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: 19px;
  height: 3px;
  background: linear-gradient(90deg, rgba(60, 114, 252, 0.05), #3c72fc, rgba(60, 114, 252, 0.05));
  z-index: 0;
}

.timeline-step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.timeline-bubble {
  position: relative;
  width: 100%;
  min-height: 124px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 22px 26px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 26px;
  background: linear-gradient(130deg, #adbde7 0%, #4e76d1 58%, #1d50d3 100%);
  color: #ffffff;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.35;
  text-transform: uppercase;
  box-shadow: 0 16px 32px rgba(36, 91, 214, 0.22);
  transition: transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease;
}

.timeline-bubble::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -14px;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 18px solid #4371d9;
}

.timeline-code {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 31px;
  border: 2px solid #ffffff;
  border-radius: 12px;
  background: #082b86;
  color: #ffffff;
  font-size: 17px;
  font-weight: 800;
  box-shadow: 0 10px 22px rgba(8, 43, 134, 0.25);
}

.timeline-step:hover .timeline-bubble {
  transform: translateY(-6px);
  filter: brightness(1.05);
  box-shadow: 0 20px 38px rgba(36, 91, 214, 0.3);
}

.formalities-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.formality-card {
  height: 100%;
  min-height: 378px;
  padding: 42px 44px;
  border: 1px solid rgba(60, 114, 252, 0.14);
  border-radius: 14px;
  background: linear-gradient(145deg, rgb(126 147 203 / 96%) 0%, rgb(101 129 179 / 98%) 48%, rgb(28 66 169 / 98%) 100%);
  color: #ffffff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
  box-shadow: 0 18px 36px rgba(8, 43, 134, 0.12);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.formality-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.28), transparent 28%);
  pointer-events: none;
}

.formality-card.dark {
  background: linear-gradient(145deg, #839acb 0%, #161d2a 100%);
}

.formality-card:hover {
  transform: translateY(-8px);
  border-color: rgba(60, 114, 252, 0.35);
  box-shadow: 0 24px 46px rgba(8, 43, 134, 0.2);
}

.formality-icon {
  width: 72px;
  height: 72px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  font-size: 42px;
  line-height: 1;
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.formality-card:hover .formality-icon {
  transform: scale(1.08) rotate(-5deg);
  background: rgba(255, 255, 255, 0.2);
}

.formality-card h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 16px;
  color: #ffffff;
  font-size: 29px;
  font-weight: 900;
  line-height: 1.18;
  text-transform: uppercase;
}

.formality-card p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: rgba(255, 255, 255, 0.95);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.85;
}

.formality-card.half {
  min-height: 330px;
}

.formalities-bottom {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 22px;
}

@media (max-width: 991.98px) {
  .formalities-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .formalities-timeline::before {
    display: none;
  }

  .formalities-grid,
  .formalities-bottom {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .appointment-formalities-section {
    padding: 50px 0 70px;
  }

  .formalities-timeline {
    grid-template-columns: 1fr;
    margin-bottom: 36px;
  }

  .formalities-intro h2 {
    font-size: 29px;
  }

  .timeline-bubble {
    min-height: 96px;
  }

  .timeline-code {
    margin-top: 26px;
  }

  .formality-card {
    min-height: auto;
    padding: 34px 24px;
  }

  .formality-card h3 {
    font-size: 24px;
  }
}

/*----------------------------------------*/
/* PAGE TITLE BANNER CSS START
/*----------------------------------------*/

.page-title-banner {
  position: relative;
  background: linear-gradient(135deg, #0f0d1d 0%, #1a1640 40%, #3c72fc 100%);
  padding: 140px 0 100px;
  overflow: hidden;
  z-index: 2;
  clip-path: ellipse(100% 100% at 50% 0%);
  margin-bottom: -90px;
}

.page-title-banner + .builder-section-wrap {
  position: relative;
  z-index: 1;
}

.page-title-banner + .builder-section-wrap > section {
  padding-top: 160px; /* Extends the background UP to cover the gap, pushing content down */
}

.page-title-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.page-title-shapes {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  overflow: hidden;
}

.shape-circle {
  position: absolute;
  border-radius: 50%;
  opacity: 0.08;
}

.shape-circle-1 {
  width: 300px;
  height: 300px;
  background: #3c72fc;
  top: -80px;
  right: -60px;
  animation: floatCircle1 8s ease-in-out infinite;
}

.shape-circle-2 {
  width: 200px;
  height: 200px;
  background: #ffffff;
  bottom: -40px;
  left: 10%;
  animation: floatCircle2 10s ease-in-out infinite;
}

.shape-circle-3 {
  width: 150px;
  height: 150px;
  background: #3c72fc;
  top: 30%;
  left: 60%;
  animation: floatCircle3 12s ease-in-out infinite;
}

@keyframes floatCircle1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-30px, 20px) scale(1.1); }
}

@keyframes floatCircle2 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(20px, -25px) scale(1.05); }
}

@keyframes floatCircle3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-15px, 15px) scale(0.95); }
}

.page-title-content {
  position: relative;
  z-index: 2;
  text-align: center;
}

.page-title-content h1 {
  color: #ffffff;
  font-size: 45px;
  font-weight: 700;
  margin-bottom: 18px;
  letter-spacing: -0.5px;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  font-family: 'Poppins', sans-serif;
}

.page-title-breadcrumb ol {
  display: flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 8px;
  flex-wrap: wrap;
}

.page-title-breadcrumb ol li {
  font-size: 15px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  font-family: 'Poppins', sans-serif;
}

.page-title-breadcrumb ol li a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.3s ease;
}

.page-title-breadcrumb ol li a:hover {
  color: #ffffff;
}

.page-title-breadcrumb ol li + li::before {
  content: "\f105";
  font-family: "Font Awesome 5 Pro", "Font Awesome 6 Pro", "FontAwesome";
  font-weight: 300;
  display: inline-block;
  padding-right: 10px;
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
}

.page-title-breadcrumb ol li.active {
  color: #3c72fc;
  font-weight: 600;
}

/* Curved bottom edge */
.page-title-curve {
  display: none;
}

/* Responsive adjustments */
@media only screen and (max-width: 1024px) {
  .page-title-banner {
    padding: 120px 0 80px;
  }

  .page-title-content h1 {
    font-size: 36px;
  }
}

@media only screen and (max-width: 768px) {
  .page-title-banner {
    padding: 100px 0 70px;
    margin-bottom: -60px;
  }

  .page-title-banner + .builder-section-wrap > section {
    padding-top: 120px;
  }

  .page-title-content h1 {
    font-size: 28px;
  }

  .page-title-breadcrumb ol li {
    font-size: 13px;
  }

  .shape-circle-1 {
    width: 180px;
    height: 180px;
  }

  .shape-circle-2 {
    width: 120px;
    height: 120px;
  }

  .shape-circle-3 {
    width: 90px;
    height: 90px;
  }

  .message-header img {
    width: 30%;
  }

  .tabs-2 .tab-content .tab-wrapper .tab-content-inner {
    padding: 25px;
  }

  .tabs-2 .tab-content .tab-wrapper .tab-content-inner .tab-header .tab-subtitle {
    font-size: 14px;
    letter-spacing: 0.8px;
  }

  .tabs-2 .tab-content .tab-wrapper .tab-content-inner p {
    font-size: 15px;
  }

  .message-title {
    font-size: 15px !important;
  }
}

@media only screen and (max-width: 480px) {
  .page-title-banner {
    padding: 80px 0 60px;
    margin-bottom: -50px;
  }

  .page-title-banner + .builder-section-wrap > section {
    padding-top: 100px;
  }

  .page-title-content h1 {
    font-size: 24px;
    margin-bottom: 12px;
  }

  .page-title-breadcrumb ol li {
    font-size: 12px;
  }
}

/* Serving Destination Section */
.destination-card {
    transition: all 0.3s ease-in-out;
    border-bottom: 3px solid transparent;
    cursor: default;
}

.destination-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08) !important;
    border-bottom: 3px solid var(--theme-color);
}
.destination-card img {
    width: 85px;
    height: 50px;
    border-radius: 4px;
    object-fit: cover;
}