.feature-section-two {
  position: relative;
  padding: 50px 0 0;
  background: #0a192f;
  overflow: hidden;
}

.banner {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.arc {
  width: 50%;
  /* adjust arc width */
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  transform: rotate(180deg);
  transform-origin: center;
}

.feature-section-two .auto-container {
  position: relative;
  z-index: 5;
}

@media (max-width: 350px) {
  .arc {
    width: 100% !important;
    height: 65%;
    /* arc height on mobile */
    right: 0;
    top: 49%;
    bottom: 0;
    left: 0;
    transform: rotate(-90deg);
    /* optional, to flip the curve */
    transform-origin: center;
  }
}

@media (min-width: 351px) and (max-width: 767px) {
  .arc {
    width: 100% !important;
    height: 62%;
    /* arc height on mobile */
    right: 0;
    top: 42%;
    bottom: 0;
    left: 0;
    transform: rotate(-90deg);
    /* optional, to flip the curve */
    transform-origin: center;
  }
}

strong {
  font-weight: bold;
  color: #64b5f6;
  text-decoration: underline;
}

/* Ribbon Tail Effect */

/* Must be visible for sticky */
.choose-section,
.choose-section .auto-container,
.choose-section .row {
  overflow: visible !important;
}

/* Sticky left */
@media (min-width: 992px) {
  .sticky-col {
    position: sticky;

    align-self: flex-start;
    /* important */
    z-index: 5;
  }

  /* Make right side taller so sticky has scroll space */
  .right-wrapper {
    position: relative;
  }
}

.page-wrapper {
  overflow: visible;
}

.main-footer .pattern-layer.style-two {
  background-position: left bottom;
  bottom: 0px;
}

.main-footer {
  margin-top: 0px;
}

.cta-box {
  border: solid 1px rgba(0, 0, 0, 0.2);
  padding: 30px 0px;
  background-color: #0a192f;
  margin-top: -100px;
}

/* Timeline wrapper */
.timeline {
  position: relative;

  margin: 0 auto;
  padding-left: 0px;
}

.timeline::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 0;
  height: calc(100% - 220px);
  /* 120px = space of last item */
  width: 2px;
  background: #3a8bff;
}

/* Stage 1 Color */
.timeline-item:nth-child(1),
.timeline-item:nth-child(1) .timeline-icon,
.timeline-item:nth-child(1)::before {
  border-color: #3a8bff;
}

/* Stage 2 Color */
.timeline-item:nth-child(2),
.timeline-item:nth-child(2) .timeline-icon,
.timeline-item:nth-child(2)::before {
  border-color: #b2d924;
}

/* Stage 3 Color */
.timeline-item:nth-child(3),
.timeline-item:nth-child(3) .timeline-icon,
.timeline-item:nth-child(3)::before {
  border-color: #ff5ca7;
}

/* Stage 4 Color */
.timeline-item:nth-child(4),
.timeline-item:nth-child(4) .timeline-icon,
.timeline-item:nth-child(4)::before {
  border-color: #39ca9c;
}

/* Each item */
.timeline-item {
  position: relative;
  padding: 20px 0 40px 60px;
  /* left = space between line & text */
}

/* Icon circle */
.timeline-icon {
  position: absolute;
  left: -10px;
  /* centers circle on the line */
  top: 0px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 2px solid #27c0b5;
  background: #faf9f6;
  display: flex;
  align-items: center;
  justify-content: center;

  /* soft outer ring */
}

@media (min-width: 992px) {
  .sticky-col {
    position: sticky;
    top: 120px;
    align-self: flex-start;
    /* important */
    z-index: 5;
  }

  /* Make right side taller so sticky has scroll space */
  .right-wrapper {
    position: relative;
  }
}

.page-wrapper {
  overflow: visible;
}

.timeline-icon i {
  font-size: 14px;
  color: #27c0b5;
}

/* Text block */
.timeline-content {
  margin-left: 40px;
  background: transparent;
}

.timeline-content h4 {
  margin-bottom: 6px;
}

.timeline-content p {
  margin-bottom: 6px;
}

.innovation-icon {
  width: 50px;
}

/* Small screen adjustments */
@media (max-width: 576px) {
  .timeline {
    padding-left: 0px;
  }

  .timeline::before {
    left: 2px;
  }

  .innovation-icon {
  width: 30px;
}

  .timeline-icon {
    left: -30px;

    width: 60px;
    height: 60px;

    /* soft outer ring */
  }

  .timeline-item {
    padding-left: 5px;
  }
}

.zigzag-row {
  display: flex;
  align-items: stretch !important;
  /* force equal height */
}

.zig-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: solid 1px rgba(0, 0, 0, 0.5);
  padding: 25px 30px;
  border-radius: 10px;
  position: relative;
}

/* ICON CIRCLE */
.zig-icon {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #faf9f6;
  border: 1px solid rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 38%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 10;
}

.zig-icon i {
  font-size: 20px;
  color: #27c0b5;
}

/* LEFT SIDE — icon on right edge of the card */

.left-icon {
  top: 0px;
}

.zig-card h4 {
  margin-top: 30px;
  margin-bottom: 10px;
}

.zigzag-row .col-lg-4 {
  margin-bottom: 70px;
}