.checkmark-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 30px;
  background: linear-gradient(to bottom, #4cd964, #34c759);
  border-radius: 50%;
  box-shadow: 
    inset 0 5px 10px rgba(255,255,255,0.5),
    inset 0 -5px 10px rgba(0,0,0,0.2),
    0 8px 15px rgba(0,0,0,0.3);
  position: relative;
  transition: all 0.2s ease;
}

.checkmark-button:active {
  box-shadow: 
    inset 0 5px 10px rgba(0,0,0,0.3),
    inset 0 -2px 5px rgba(255,255,255,0.4),
    0 4px 8px rgba(0,0,0,0.2);
  transform: translateY(2px);
}

.checkmark-button .bx {
  font-size: 25px;
  color: white;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4);
}


.bg-primary{
  background-color: #6c70dc;
}

.mega-dropdown .bx-chevron-down {
  transition: transform 0.3s ease;
}
.mega-dropdown .collapsed .bx-chevron-down {
  transform: rotate(0deg);
}
.mega-dropdown [aria-expanded="true"] .bx-chevron-down {
  transform: rotate(180deg);
}

body.offcanvas-open {
  overflow: hidden !important;
}

.fs-3rem{
    font-size: 2.5rem !important;
}

.why-card{
  max-width: 600px;
}

/* Carousel indicators (dots) */
.carousel-indicators [data-bs-target] {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #a39cb6; /* light grayish purple */
  opacity: 1;
  margin: 0 5px;
  transition: background-color 0.3s ease;
  border: none;
}

.carousel-indicators .active {
  background-color: #3d2157; /* dark purple */
}


.free-trial-btn {
    font-size: 1.5rem; /* default size for desktop (≈24px, since fs-4 is 1.5rem) */
}

/* Hide mobile text by default */
.free-trial-btn .mobile-text {
    display: none;
}
.check-img{
  width: 45px;
  height: 45px;
}

/* Show different text + resize font on mobile */
@media (max-width: 767.98px) {
    .free-trial-btn {
        font-size: 16px; /* shrink button text on mobile */
    }

    .free-trial-btn .desktop-text {
        display: none;
    }

    .free-trial-btn .mobile-text {
        display: inline;
    }
    .check-img{
      width: 35px;
      height: 35px;
    }
}

.mw-600px{
  max-width: 600px;
}