:root {
  --cv-primary: #0d3b7d;
  --cv-primary-2: #1565c0;
  --cv-accent: #00a884;
  --cv-ink: #102338;
  --cv-muted: #5f7188;
  --cv-soft: #f4f8fd;
  --cv-line: #d9e6f4;
  --cv-radius: 18px;
  --cv-shadow: 0 22px 55px rgba(13, 59, 125, .16);
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Manrope", Arial, sans-serif !important;
  color: var(--cv-ink);
  background:
    radial-gradient(circle at 8% 0%, rgba(21, 101, 192, .10), transparent 34%),
    linear-gradient(180deg, #f7fbff 0%, #ffffff 42%, #f6fbf8 100%);
}

h1, h2, h3, h4,
.main-slider-wrapper .tp-banner h2,
.main-slider-wrapper .tp-banner h4,
.main-slider-wrapper .tp-banner h5 {
  font-family: "Sora", "Manrope", Arial, sans-serif !important;
  letter-spacing: 0;
}

a {
  transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.preloader {
  background: rgba(255, 255, 255, .88) !important;
}

.main-header .top-bar {
  background: linear-gradient(135deg, var(--cv-primary), #102338) !important;
  color: rgba(255, 255, 255, .88) !important;
  border: 0 !important;
  font-size: 13px;
}

.main-header .top-bar a,
.main-header .top-bar span {
  color: #fff !important;
  font-weight: 700;
}

.main-header .top-bar img {
  filter: drop-shadow(0 5px 12px rgba(0, 0, 0, .15));
}

.main-header .nav-container {
  background: rgba(255, 255, 255, .94) !important;
  border: 0 !important;
  box-shadow: 0 14px 32px rgba(16, 35, 56, .09);
  backdrop-filter: blur(12px);
}

.main-header .nav-container .auto-box {
  min-height: 78px;
  display: flex;
  align-items: center;
}

.main-header .logo img {
  max-height: 58px;
  width: auto;
  object-fit: contain;
}

.main-menu > ul {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 5px;
}

.main-menu > ul > li {
  margin: 0 !important;
}

.main-menu > ul > li > a {
  color: #183653 !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: none !important;
  border-radius: 999px;
  padding: 10px 12px !important;
  line-height: 1.1 !important;
}

.main-menu > ul > li.current > a,
.main-menu > ul > li > a:hover {
  background: linear-gradient(135deg, var(--cv-primary-2), var(--cv-accent));
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(21, 101, 192, .22);
}

.toggle-icon {
  border-radius: 12px;
  background: var(--cv-soft);
  border: 1px solid var(--cv-line);
}

.mobile-menu .nav-box {
  background: #fff;
  border-radius: 0 0 var(--cv-radius) var(--cv-radius);
  box-shadow: var(--cv-shadow);
}

.mobile-menu .nav-box ul li a {
  color: var(--cv-ink) !important;
  font-weight: 700;
}

.main-slider-wrapper {
  position: relative;
  background:
    linear-gradient(135deg, rgba(13, 59, 125, .92), rgba(21, 101, 192, .70), rgba(0, 168, 132, .58)),
    #0d3b7d !important;
  overflow: hidden;
}

.main-slider-wrapper:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 70px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), #f7fbff);
  pointer-events: none;
  z-index: 25;
}

.main-slider-wrapper .tp-banner h2,
.main-slider-wrapper .tp-banner h4,
.main-slider-wrapper .tp-banner h5 {
  text-shadow: 0 14px 35px rgba(0, 0, 0, .28);
}

.main-slider-wrapper .tp-banner h2 {
  font-weight: 800 !important;
}

.main-slider-wrapper .tp-banner .btn-theme,
.dark-btn,
.btn-border-wht,
.more a,
.contact-us input[type="submit"] {
  border-radius: 999px !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--cv-primary-2), var(--cv-accent)) !important;
  color: #fff !important;
  box-shadow: 0 16px 30px rgba(13, 59, 125, .22);
  font-weight: 800 !important;
}

.main-slider-wrapper .tp-banner .btn-theme:hover,
.dark-btn:hover,
.btn-border-wht:hover,
.more a:hover,
.contact-us input[type="submit"]:hover {
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 22px 40px rgba(13, 59, 125, .28);
}

.bg-banner.dark-banner {
  margin: -28px auto 38px;
  width: min(1180px, calc(100% - 32px));
  border-radius: var(--cv-radius);
  background: linear-gradient(135deg, var(--cv-primary), #123f68 48%, var(--cv-accent)) !important;
  box-shadow: var(--cv-shadow);
  border: 1px solid rgba(255, 255, 255, .35);
  position: relative;
  z-index: 40;
}

.bg-banner.dark-banner .auto-box {
  padding: 22px 26px !important;
}

.bg-banner h1 {
  color: #fff !important;
  font-size: clamp(22px, 2.5vw, 34px) !important;
  line-height: 1.2 !important;
}

.bg-banner h1 span {
  color: rgba(255, 255, 255, .80) !important;
}

.services,
.meet-the-team,
.latest-blog,
.sidebar-page {
  background: transparent !important;
}

.auto-box {
  max-width: 1180px;
}

.border-line-center,
.border-line-left {
  color: var(--cv-ink) !important;
  border: 0 !important;
  position: relative;
}

.border-line-center:after,
.border-line-left:after {
  content: "";
  display: block;
  width: 76px;
  height: 4px;
  border-radius: 999px;
  margin: 14px auto 0;
  background: linear-gradient(90deg, var(--cv-primary-2), var(--cv-accent));
}

.border-line-left:after {
  margin-left: 0;
}

.services .auto-box > h1,
.meet-the-team .auto-box > h2 {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  padding: 26px;
  border-radius: var(--cv-radius);
  background: rgba(255, 255, 255, .86);
  border: 1px solid var(--cv-line);
  box-shadow: 0 12px 34px rgba(13, 59, 125, .08);
  color: #24415f !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: clamp(18px, 2.2vw, 25px) !important;
  line-height: 1.55 !important;
}

.meet-the-team .row,
.latest-blog .row {
  display: flex;
  flex-wrap: wrap;
}

.meet-the-team .member,
.latest-blog .blog-post {
  margin-bottom: 28px;
}

.meet-the-team .member figure,
.latest-blog .blog-post {
  border-radius: var(--cv-radius);
  background: #fff;
  border: 1px solid var(--cv-line);
  box-shadow: 0 16px 38px rgba(13, 59, 125, .10);
  overflow: hidden;
}

.meet-the-team .member figure {
  padding: 10px;
}

.meet-the-team .member figure img,
.latest-blog .blog-post .image img {
  width: 100% !important;
  height: 245px !important;
  object-fit: cover;
  border-radius: 14px;
}

.latest-blog .blog-post {
  height: calc(100% - 28px);
  padding: 12px 12px 18px;
}

.latest-blog .blog-post .image {
  border-radius: 14px;
  overflow: hidden;
  background: var(--cv-soft);
}

.latest-blog .blog-post h1 {
  font-size: 21px !important;
  color: var(--cv-primary) !important;
  margin: 16px 6px 10px !important;
}

.latest-blog .blog-post .desc {
  color: var(--cv-muted);
  font-size: 14px;
  line-height: 1.65;
  padding: 0 6px;
}

.latest-blog .blog-post .more {
  padding: 0 6px;
}

.latest-blog .blog-post:hover {
  transform: translateY(-4px);
  box-shadow: var(--cv-shadow);
}

.main-footer .upper {
  background: linear-gradient(145deg, #102338, var(--cv-primary)) !important;
  color: rgba(255, 255, 255, .86);
  border: 0 !important;
}

.main-footer .upper h2,
.main-footer .upper a,
.main-footer .upper li {
  color: #fff !important;
}

.main-footer .widget-contact li {
  border-color: rgba(255, 255, 255, .12) !important;
}

.main-footer .bottom {
  background: #071827 !important;
  color: rgba(255, 255, 255, .72) !important;
}

.jmgmodal {
  background: rgba(7, 24, 39, .64) !important;
  backdrop-filter: blur(4px);
}

.jmgmodal .panel {
  border-radius: 20px !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, .30);
  border: 1px solid rgba(255, 255, 255, .45);
}

.jmgmodal .title,
.jmgmodal .panel .footer {
  background: linear-gradient(135deg, var(--cv-primary-2), var(--cv-accent)) !important;
  color: #fff !important;
}

.page-title {
  background: linear-gradient(135deg, var(--cv-primary), var(--cv-primary-2)) !important;
}

.sidebar-page .box,
.contact-us,
.table {
  border-radius: var(--cv-radius);
  background: #fff;
  border: 1px solid var(--cv-line);
  box-shadow: 0 14px 34px rgba(13, 59, 125, .08);
}

@media (max-width: 991px) {
  .main-header .nav-container .auto-box {
    display: block;
    min-height: 0;
  }

  .bg-banner.dark-banner {
    margin-top: 18px;
  }

  .bg-banner h1,
  .bg-banner .pull-left,
  .bg-banner .pull-right {
    float: none !important;
    display: block;
    text-align: center;
  }

  .bg-banner .btn-border-wht {
    margin-top: 16px;
  }
}

@media (max-width: 767px) {
  .main-header .top-bar {
    font-size: 12px;
    line-height: 1.65;
  }

  .services .auto-box > h1,
  .meet-the-team .auto-box > h2 {
    padding: 18px;
  }

  .latest-blog .blog-post,
  .meet-the-team .member {
    width: 100% !important;
  }

  .jmgmodal .panel {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }
}