/* services herosection */

.servicesherosection {
  margin-top: 7%;
  min-height: 200px;
}
.serviceheroheading {
  background: linear-gradient(90deg, #34339b 0%, #121237 100%);
  height: 300px;
}
.serviceheroheading a {
  color: rgba(209, 209, 255, 1);
  text-decoration: none;
}
.custom-breadcrumb {
  color: red;
}

.serviceherosectionmain {
  max-width: 50%;
}
.serviceherosectionmain h2 {
  font-family: "Urbanist", sans-serif;
  font-weight: 400;
  color: white;
  font-size: 70px;
}
.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  font-size: 17px;
  padding-right: var(--bs-breadcrumb-item-padding-x);
  color: #f8f9fa;
  content: var(--bs-breadcrumb-divider, "/");
}
.servicebreadhead a {
  font-family: "Urbanist", sans-serif;
  font-size: 17px;
}
.servicebreadpara {
  font-family: "Urbanist", sans-serif;
  font-size: 17px;
}

/* overview section */
.overviewsection h2 {
  font-family: "Urbanist", sans-serif;
  font-weight: 400;
  font-size: 50px;
  color: rgba(41, 50, 122, 1);
}

.overviewsection p {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 30px;
  color: rgba(7, 20, 86, 1);
}

.secondaryparagraph p {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-size: 18px;
  color: rgb(113, 112, 112);
}

/* accordian section */
.accordianheading h3 {
  font-family: "Urbanist", sans-serif;
  font-weight: 400;
  font-size: 50px;
  color: rgba(7, 20, 86, 1);
}

.accordion-button {
  background: transparent;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  font-size: 1.2rem;
  border-bottom: 1px solid #ccc;
}

/* Remove default Bootstrap icon */
.accordion-button::after {
  display: none !important;
}

/* Custom number style */
.step-number {
  font-size: 4rem;
  font-family: "Urbanist", sans-serif;
  color: #101062;
  width: 80px;
  text-align: center;
}

/* Accordion title */
.step-title {
  flex-grow: 1;
  font-weight: 500;
}

.accordion-body {
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  color: rgba(152, 151, 151, 1);
}

/* Custom plus/minus icon */
.accordion-icon {
  font-size: 1.5rem;
  transition: transform 0.3s ease-in-out;
}

/* Rotate icon on open */
.accordion-button:not(.collapsed) .accordion-icon {
  transform: rotate(135deg);
}

/* Responsive for small screens */
@media (max-width: 576px) {
  .step-number {
    font-size: 2rem;
    width: 60px;
  }
  .accordion-button {
    font-size: 1rem;
  }

  .servicesherosection h2 {
    font-size: 40px;
  }
  .overviewsection h2 {
    font-size: 30px;
  }
  .overviewsection p {
    font-size: 15px;
  }
  .secondaryparagraph p {
    font-size: 12px;
  }
  .accordianheading h3 {
    font-size: 30px;
  }
  .tech-section h2 {
    font-size: 30px;
  }
  .accordion-body {
    font-size: 12px;
  }
}
/* remove the blue border */
/* Remove blue outline and blue border */
.accordion-button:focus {
  box-shadow: none !important; /* Removes blue glow */
  outline: none !important; /* Removes default focus outline */
  border-color: inherit !important; /* Resets border color */
}

/* Ensure the underline stays black (or any color you prefer) */
.accordion-button:not(.collapsed) {
  border-bottom: 1px solid #000 !important; /* Keep black underline when open */
}

.accordion-button.collapsed {
  border-bottom: 1px solid #000 !important; /* Keep black underline when closed */
}

.accordion-button {
  border-bottom: 1px solid #000; /* Keeps the underline */
}

/* tech section */
.tech-section {
  padding: 50px 0;
  text-align: center;
}
.tech-heading {
  font-size: 50px;
  font-weight: 400;
  font-family: "Urbanist", sans-serif;
  color: rgba(7, 20, 86, 1);
  margin-bottom: 30px;
}
.tech-card {
  background: white;
  padding: 20px;
  border: 1px solid rgba(223, 223, 223, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
}
.tech-card img {
  width: 100%;
  height: 100%;
}
.tech-section {
  background: linear-gradient(180deg, #f5f6ff 0%, #ffffff 100%);
}

@media (max-width: 728px) {
  .servicesherosection {
    margin-top: 11%;
    height:auto;
  }

  .serviceherosectionmain {
    max-width: 100%; /* Allow full width on small screens */
  }

  .serviceheroheading {
    max-height: 200px; /* Reduce height dynamically */
    display: flex;
    justify-content: center; /* Horizontally center content */
  }
}
