.bannerhead {
  font-size: 44px;
  text-align: start;
}

.bannerbtn {
  border-radius: 39px;
  border: 2px solid #89847e;
  padding: 18px 30px;
  background-color: transparent;
  width: fit-content;
  color: #88837d;
}
.bannerbtn2 {
  border-radius: 39px;
  border: none;
  padding: 18px 30px;
  background-color: #5a2142;
  width: fit-content;
  font-size: 14px;
  color: #fff;
  animation: color 2s infinite;
}
.btnhover {
  background-color: #5a2142 !important;
}
.bannerbtn2:hover,
.btnhover:hover {
  background-color: #40142d !important;
}
.btnsechover:hover {
  background-color: #f6e7d8;
}
.bannertext {
  color: #454545;
  font-family: 'Plus Jakarta Sans';
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px; /* 200% */
}

.home-section-2 .card {
  background-color: #f6e7d8;
  padding: 32px 28px;
  border: 1px solid #d9d9d9;
  border-radius: 12px;
  box-shadow: 0px 166px 47px 0px rgba(204, 204, 204, 0),
    0px 107px 43px 0px rgba(204, 204, 204, 0.01),
    0px 60px 36px 0px rgba(204, 204, 204, 0.05),
    0px 27px 27px 0px rgba(204, 204, 204, 0.09),
    0px 7px 15px 0px rgba(204, 204, 204, 0.1);
}

.home-section-2 .card-img-container {
  height: 200px;
  width: 200px;
}

.home-section-2 p {
  color: #454545;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}
.home-section-3 p {
  color: #595959;
  font-family: 'Plus Jakarta Sans';
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px; /* 175% */
}

.home-section-3 {
  padding: 103px 150.441px 103.212px 150px;
}

.home-section-3 .playbutton {
  width: 50px;
  height: 50px;
  background-color: #fff;
  border-radius: 50%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.home-section-4 .sec4whitebox p {
  font-size: 12px;
}
.home-section-4 .sec4whitebox h6 {
  font-size: 16px;
}
.home-section-4 .sec4whitebox h1 {
  font-size: 36px;
  color: #262626;
  text-align: left;
  line-height: 40px;
}

.home-section-4 .sec4whitebox h1 span {
  font-size: 20px;
}

.home-section-4 .sec4whitebox {
  border: 2px solid transparent; /* Default border */
  transition: border-color 0.3s ease;
}

.home-section-4 .sec4whitebox.active {
  border-color: #88837d; /* Change this to your desired border color */
}

.home-section-4 button {
  padding: 17px 60px;
  justify-content: center;
  align-items: center;
  border-radius: 30px;
  background-color: #5a2142;
  color: #fff;
  border: none;
}

.bannerdesktopscreen {
  display: block;
}
.bannermobilescreen {
  display: none;
}

.sec4imgh {
  height: 34rem;
}

.swiper-container {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.swiper-slide {
  display: flex;
  border-radius: 10px;
}

.swiper-slide {
  transition: transform 0.3s ease;
}

.swiper-slide-active {
  z-index: 10000;
}

.custom-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background-color: #d3d3d3; /* Default grey color */
  border-radius: 50%;
  margin: 0 3px;
  opacity: 1;
}

.custom-pagination .swiper-pagination-bullet-active {
  background-color: #a9a39c; /* Active blue color */
  width: 40px; /* Wider for active bullet */
  border-radius: 25px; /* Rounded rectangle */
  transition: all 0.3s ease;
}

/* Hide the default radio button */
input[type='radio'] {
  display: none;
}

/* Create a custom radio button */
input[type='radio'] + label::before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  vertical-align: middle;
  border: 2px solid #ccc; /* Border color */
  border-radius: 50%;
  background-color: #fff; /* Background color */
  transition: background-color 0.2s, border-color 0.2s; /* Smooth transition */
}

/* Change the appearance when the radio button is checked */
input[type='radio']:checked + label::before {
  background-color: #5a2142; /* Background color when checked */
}

/* Add a dot inside the radio button when checked */
input[type='radio']:checked + label::after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  background-color: #fff; /* Dot color */
  border-radius: 50%;
  position: absolute;
  top: 6px;
  left: 6px;
}

/* Style the label */
label {
  position: relative;
  cursor: pointer;
  line-height: 16px; /* Align text vertically */
}

@media (max-width: 860px) {
  .bannerdesktopscreen {
    display: none;
  }
  .bannermobilescreen {
    display: block;
  }
}
@media (max-width: 480px) {
  .home-section-3 {
    padding: 42px 20px !important;
  }
  .sec4imgh {
    height: 24rem;
  }
  .plansec {
    flex-wrap: wrap;
    width: 100%;
  }
}