.site-header {
  background: rgba(0, 0, 0, 0.72);
}

.header-action {
  border: 0;
}

.menu-toggle {
  background: transparent;
  border: 0;
}

.hero-section {
  min-height: 100vh;
  overflow: hidden;
  position: relative;
}

.hero-video,
.hero-overlay {
  height: 100%;
  inset: 0;
  position: absolute;
  width: 100%;
}

.hero-video {
  object-fit: cover;
}

.hero-overlay {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.82), rgba(0, 0, 0, 0.42));
}

.hero-content {
  position: relative;
  z-index: 2;
}

.hero-content h1 {
  max-width: 920px;
}

.home-slider .swiper,
.home-slider .swiper-wrapper,
.home-slider .swiper-slide {
  height: 100%;
}

.home-slider .swiper {
  overflow: hidden;
}

.home-slider .swiper-wrapper {
  display: flex;
  transition: transform 700ms ease;
  width: 100%;
}

.home-slider .swiper-slide {
  flex: 0 0 100%;
  max-width: 100%;
  min-width: 100%;
}

.home-slider .swiper-inner {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

.home-slider .sw-caption {
  padding-top: 90px;
}

.home-slider .sw-text-wrapper {
  margin-left: auto;
  margin-right: auto;
  max-width: 980px;
  overflow-wrap: anywhere;
}

.home-slider .anim-order-1,
.home-slider .anim-order-2,
.home-slider .anim-order-3,
.home-slider .anim-order-4 {
  animation-fill-mode: both;
  opacity: 1;
}

.home-slider .swiper-slide:not(.swiper-slide-active) .anim-order-1,
.home-slider .swiper-slide:not(.swiper-slide-active) .anim-order-2,
.home-slider .swiper-slide:not(.swiper-slide-active) .anim-order-3,
.home-slider .swiper-slide:not(.swiper-slide-active) .anim-order-4 {
  animation: none;
}

.home-slider .swiper-button-next,
.home-slider .swiper-button-prev {
  background: transparent;
  border: 0;
  color: #fff;
}

.home-slider .swiper-pagination {
  bottom: 28px;
}

.home-slider .swiper-pagination-bullet {
  background: #fff;
  opacity: 0.45;
}

.home-slider .swiper-pagination-bullet-active {
  background: var(--primary-color);
  opacity: 1;
}

.page-subheader {
  min-height: 380px;
  overflow: hidden;
  padding-top: 170px;
}

.page-subheader .jarallax-img {
  filter: brightness(0.45);
}

.feature-card,
.quote-card,
.contact-panel {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  height: 100%;
  padding: 24px;
}

.feature-card img {
  aspect-ratio: 16 / 10;
  border-radius: 6px;
  margin-bottom: 18px;
  object-fit: contain;
  width: 100%;
}

.feature-card.tall img {
  aspect-ratio: 4 / 3;
}

.cms-richtext {
  margin-top: 28px;
}

.cms-richtext h1,
.cms-richtext h2,
.cms-richtext h3 {
  color: #111;
  letter-spacing: 0;
  margin: 24px 0 12px;
}

.cms-richtext h1 {
  font-size: 42px;
}

.cms-richtext h2 {
  font-size: 34px;
}

.cms-richtext h3 {
  font-size: 24px;
}

.cms-richtext p,
.cms-richtext li {
  color: #4b5563;
}

.cms-richtext strong {
  color: #111;
  font-weight: 800;
}

.cms-richtext ul {
  margin: 0 0 18px;
  padding-left: 22px;
}

.dynamic-page-section {
  margin-top: 32px;
}

.blog-filter-bar {
  display: grid;
  gap: 12px;
  grid-template-columns: 2fr 1fr 1fr;
  margin-bottom: 28px;
}

.blog-filter-bar input,
.blog-filter-bar select {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  min-height: 52px;
  padding: 0 14px;
}

.blog-card-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.blog-card {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  overflow: hidden;
}

.blog-card img {
  aspect-ratio: 16 / 10;
  object-fit: cover;
  width: 100%;
}

.blog-card div {
  padding: 20px;
}

.blog-card span {
  color: var(--primary-color);
  font-weight: 700;
}

.blog-card h3 {
  font-size: 22px;
  margin: 8px 0;
}

.blog-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
}

.blog-tags button,
.blog-tags span {
  background: rgba(0, 0, 0, 0.06);
  border: 0;
  border-radius: 999px;
  color: #111;
  font-size: 13px;
  font-weight: 700;
  padding: 7px 11px;
}

.blog-side-link {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  color: #111;
  display: block;
  font-weight: 700;
  padding: 12px 0;
}

.home-pattern-section {
  padding: 90px 0;
}

.section-intro {
  margin-left: auto;
  margin-right: auto;
  max-width: 760px;
}

.home-cta-strip {
  padding: 36px 0;
}

.home-cta-content {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  display: flex;
  gap: 22px;
  justify-content: space-between;
  padding: 22px 26px;
}

.home-cta-content img {
  height: 76px;
  object-fit: contain;
  width: 76px;
}

.home-cta-content h3 {
  flex: 1;
  margin: 0;
}

.home-metric {
  align-items: center;
  display: flex;
  gap: 16px;
  margin: 18px 0;
}

.home-metric strong {
  color: var(--primary-color);
  font-size: 52px;
  line-height: 1;
}

.home-metric span {
  font-weight: 700;
}

.home-check-list {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
}

.home-check-list li::before {
  color: var(--primary-color);
  content: "+";
  font-weight: 700;
  margin-right: 8px;
}

.home-image-pair {
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr 1fr;
}

.home-image-pair img {
  aspect-ratio: 4 / 5;
  border-radius: 8px;
  object-fit: cover;
  width: 100%;
}

.home-image-pair img:nth-child(2) {
  margin-top: 44px;
}

.mini-stat {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  color: #fff;
  font-weight: 600;
  padding: 18px;
}

.home-why-section {
  background: #f6f8fb;
  color: #263238;
  padding: 90px 0;
}

.home-why-section h2,
.home-why-section p {
  color: #263238;
}

.home-why-section .mini-stat {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.08);
  color: #111;
}

.home-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.home-tags span,
.home-tech-list span {
  background: rgba(0, 0, 0, 0.06);
  border-radius: 999px;
  display: inline-flex;
  font-weight: 700;
  padding: 8px 13px;
}

.home-counter {
  display: grid;
  gap: 4px;
}

.home-counter strong {
  color: var(--primary-color);
  font-size: 30px;
  line-height: 1;
}

.home-card-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-service-card,
.home-case-card {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  height: 100%;
  overflow: hidden;
}

.home-service-card {
  padding: 24px;
}

.home-service-card img {
  background: var(--primary-color);
  border-radius: 8px;
  height: 64px;
  margin-bottom: 18px;
  object-fit: contain;
  padding: 12px;
  width: 64px;
}

.home-service-card a,
.home-case-card a {
  color: var(--primary-color);
  font-weight: 700;
}

.home-tech-section {
  background: #07111f;
  padding: 90px 0;
}

.home-tech-section h2,
.home-tech-section p {
  color: #fff;
}

.home-tech-section p {
  opacity: 0.88;
}

.home-tech-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.home-tech-list span {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.home-rating-panel {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  padding: 28px;
}

.home-rating-panel strong {
  color: var(--primary-color);
  display: block;
  font-size: 72px;
  line-height: 1;
}

.home-rating-panel img {
  aspect-ratio: 16 / 10;
  border-radius: 8px;
  margin-top: 22px;
  object-fit: cover;
  width: 100%;
}

.home-case-card img {
  aspect-ratio: 16 / 11;
  object-fit: cover;
  width: 100%;
}

.home-case-card div {
  padding: 22px;
}

.home-testimonial-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-testimonial-slider {
  overflow: hidden;
}

.home-testimonial-card {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  box-shadow: 0 12px 35px rgba(7, 17, 31, 0.07);
  display: flex;
  flex-direction: column;
  gap: 18px;
  height: 100%;
  padding: 24px;
}

.home-testimonial-person {
  align-items: center;
  display: flex;
  gap: 14px;
}

.home-testimonial-person img {
  border-radius: 50%;
  height: 68px;
  object-fit: cover;
  width: 68px;
}

.home-testimonial-person h4 {
  font-size: 19px;
  margin: 0 0 4px;
}

.home-testimonial-person span {
  color: #6d7480;
  font-size: 14px;
}

.home-testimonial-rating {
  align-items: center;
  display: flex;
  gap: 10px;
}

.home-testimonial-rating img {
  height: 28px;
  object-fit: contain;
  width: 28px;
}

.home-testimonial-rating strong {
  color: var(--primary-color);
  font-size: 24px;
}

.home-testimonial-card p {
  color: #333;
  margin: 0;
}

.home-testimonial-controls {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: center;
  margin-top: 28px;
}

.home-testimonial-controls > button {
  align-items: center;
  background: #07111f;
  border: 0;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-size: 20px;
  font-weight: 700;
  height: 42px;
  justify-content: center;
  line-height: 1;
  width: 42px;
}

.home-testimonial-dots {
  display: flex;
  gap: 8px;
}

.home-testimonial-dots button {
  background: rgba(7, 17, 31, 0.22);
  border: 0;
  border-radius: 50%;
  height: 10px;
  padding: 0;
  width: 10px;
}

.home-testimonial-dots button.active,
.home-testimonial-dots button[aria-current="true"] {
  background: var(--primary-color);
}

.home-video-section {
  background: #f6f8fb;
  padding: 90px 0;
}

.home-video-frame {
  aspect-ratio: 16 / 9;
  background: #07111f;
  border-radius: 8px;
  box-shadow: 0 18px 48px rgba(7, 17, 31, 0.16);
  margin: 0 auto;
  max-width: 980px;
  overflow: hidden;
}

.home-video-frame iframe {
  border: 0;
  display: block;
  height: 100%;
  width: 100%;
}

.logo-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.logo-tile {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  display: flex;
  height: 110px;
  justify-content: center;
  padding: 18px;
}

.logo-tile img {
  max-height: 72px;
  max-width: 100%;
  object-fit: contain;
}

.course-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.courses-intro-section,
.courses-modules-section,
.course-form-section {
  padding: 90px 0;
}

.courses-intro-image {
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  object-fit: cover;
  width: 100%;
}

.courses-facts {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 24px 0;
}

.courses-facts div,
.courses-feature,
.courses-module-card {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
}

.courses-facts div {
  padding: 16px;
}

.courses-facts strong {
  color: var(--primary-color);
  display: block;
}

.courses-feature-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.courses-feature {
  color: #111;
  font-weight: 700;
  padding: 16px;
}

.courses-modules-section {
  background: #f6f8fb;
}

.courses-module-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.courses-module-card {
  overflow: hidden;
}

.courses-module-card img {
  aspect-ratio: 16 / 10;
  object-fit: contain;
  width: 100%;
}

.courses-module-card div {
  padding: 22px;
}

.courses-module-card ul {
  margin: 0;
  padding-left: 18px;
}

.course-form-section {
  background: #07111f;
}

.course-chip {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  display: flex;
  gap: 14px;
  min-height: 86px;
  padding: 12px;
}

.course-chip img {
  border-radius: 6px;
  height: 58px;
  object-fit: cover;
  width: 74px;
}

.form-card {
 /* background: #bfbfbf; */
  border-radius: 8px;
  padding: 28px;
}

.form-card .logo-small {
  display: block;
  margin: 0 auto 12px;
  max-height: 78px;
}

.form-title {
  color: #111;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  text-align: center;
}

.custom,
.custom-input {
  min-height: 52px;
}

.enroll-modal {
  display: block;
  z-index: 1055;
}

.enroll-modal .modal-dialog {
  position: relative;
  z-index: 1060;
}

.modal-backdrop-button {
  border: 0;
  inset: 0;
  position: fixed;
  z-index: 1050;
}

.legal-copy {
  max-width: 900px;
}

.whatsapp-float {
  z-index: 1030;
}

@media (max-width: 991px) {
  /* Force a SOLID dark header bar on mobile. The theme's `header.transparent`
     otherwise makes the bar see-through, so a white hamburger would land on
     whatever light content is behind it. `header.site-header` matches the
     theme's specificity and wins on source order. Also lifts the header (and
     its dropdown) above high z-index sections like the hero (z-index: 1000). */
  header.site-header {
    position: relative;
    z-index: 1040;
    background: rgba(0, 0, 0, 0.9);
  }

  /* White hamburger, now guaranteed to sit on the dark bar above. */
  #menu-btn {
    color: #fff;
  }

  #mainmenu {
    display: none;
  }

  .mobile-menu-open #mainmenu {
    background: #111;
    display: block;
    left: 0;
    padding: 12px 18px;
    position: absolute;
    right: 0;
    top: 100%;
    width: auto;
    z-index: 1040;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
    /* The theme pins #mainmenu to height:100% + overflow:auto, which clips the
       dropdown to the header height (only ~2 items show). Let it grow to fit all
       items, scrolling only if it would exceed the screen. */
    height: auto;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
  }

  /* Comfortable, evenly tall tap targets for each menu item. */
  .mobile-menu-open #mainmenu a.menu-item {
    display: block;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .menu_side_area {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
  }

  .hero-content h1 {
    font-size: 42px;
  }

  .home-slider .mh-700 {
    min-height: 620px;
  }

  .home-slider .sw-caption {
    padding-top: 70px;
  }

  .home-slider h2.slider-title {
    font-size: 38px;
    letter-spacing: 0;
  }

  .home-slider h3.slider-teaser {
    font-size: 19px;
  }

  .home-pattern-section,
  .home-why-section,
  .home-tech-section,
  .home-video-section {
    padding: 60px 0;
  }

  .home-cta-content,
  .home-metric {
    align-items: flex-start;
    flex-direction: column;
  }

  .home-check-list,
  .home-image-pair,
  .home-card-grid,
  .home-testimonial-grid,
  .courses-facts,
  .courses-feature-grid,
  .courses-module-grid,
  .blog-filter-bar,
  .blog-card-grid {
    grid-template-columns: 1fr;
  }

  .home-image-pair img:nth-child(2) {
    margin-top: 0;
  }
}
