.logo {
  font-weight: bold;
  color: #4b0082;
}

.d-flex {
  flex-wrap: wrap;
  gap: 16px;
}

.navbar-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  list-style: none;
}

.navbar-nav li {
  margin: 0 4px; /* Spacing between nav items */
}

.dropdown-menu {
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 0.5rem 0;
}

.dropdown-item {
  color: #1a1a1a;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  font-size: 15px;
  padding: 10px 20px;
  background-color: white;
  transition: background-color 0.3s ease, color 0.3s ease;
  min-width: 180px;
}

.navbar-nav .nav-link {
  font-size: 17px;
  font-weight: 600;
  color: #2f2f93;
  display: block;
  padding: 10px 0;
  transition: color 0.3s ease;
  position: relative;

  font-family: "Poppins", sans-serif;

  text-decoration: none;
}
.navbar-nav .nav-link:hover {
  color: #fc8939; /* Orange */
  text-decoration: none;
}
/* Force consistent color, remove hover effects */
.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item:active {
  background-color: #f9f9f9;
  color: #fc8939 !important; /* Orange text on hover */
  text-decoration: none;
}

.navbar-brand {
  margin-left: 0;
  padding-left: 0;
}

.navbar {
  border-bottom: 1px;
  width: 100%;
  height: auto;
}

.container {
  padding-left: 0;
  padding-right: 0;
}

.heading {
  font-family: Inter, sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 120%;
  color: rgba(46, 49, 146, 1);
  margin-bottom: 3rem;
}

.heading-mobile {
  font-family: Inter, sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 120%;
  color: rgba(46, 49, 146, 1);
}

.heading-black {
  font-family: Inter, sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 120%;
  color: #222222;
  margin-bottom: 3rem;
}

.heading-black-mobile {
  font-family: Inter, sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 120%;
  color: #222222;
}

.vb-banner {
  margin-top: 32px;
  background-image: url("../images/vijnatafinailbanner.svg"); /* Replace with your image path */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  /* height: 650px; */
  position: relative;
  aspect-ratio: 16/7;
}
.btn-phonenumber {
  /* background: linear-gradient(100.08deg, #9fa2e3 -35.1%, #5054c8 42.84%); */
  padding: 12px 14px;
  border-radius: 30px;
  font-size: 16px;
  font-weight: 650;
  /* background: linear-gradient(100.08deg, #9FA2E3 -35.1%, #5054C8 42.84%, #0E0F2C 162.24%); */
  color: aliceblue;
}
.btn-primary {
  background: linear-gradient(
    100.08deg,
    #9fa2e3 -35.1%,
    #5054c8 42.84%,
    #0e0f2c 162.24%
  );
  color: white;
  border-radius: 24px;
  padding: 12px 24px;
  font-family: Roboto, sans-serif;
  font-weight: 700;
  font-size: 16px;
  border: none;
}

.contact-section {
  text-align: center;
  padding: 0% 15% 0% 15%;
}

.contact-section h2 {
  font-family: Plus Jakarta Sans;
  font-weight: 700;
  font-size: 35px;
  line-height: 150%;
  letter-spacing: 0%;
  text-align: center;
  color: #222222;
  margin-bottom: 32px;
}

.contact-form {
  max-width: 700px;
  margin: auto;
  text-align: left;
  /* font-family: Plus Jakarta Sans; */
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0%;
  color: #222222;
}

.btn-submit {
  width: 105px;
  background: #262a90;
  color: white;
  border: none;
  display: block;
  gap: 8px;
  border-radius: 1000px;
  /* font-family: Plus Jakarta Sans; */
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0%;
  /* box-shadow: 0px 4px 4px 0px #0000000d; */
  margin: auto;
}

.btn-submit:hover {
  background: #262a90;
  color: white;
  border: none;
  display: block;
  gap: 8px;
  border-radius: 1000px;

  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0%;
  box-shadow: 0px 4px 4px 0px #0000000d;
}
@media (min-width: 350px) and (max-width: 767px) {
  .contact-section {
    padding: 15px 20px;
  }

  .contact-section h6 {
    font-size: 16px;
    line-height: 120%;
  }

  .contact-section h2 {
    font-size: 24px;
    line-height: 150%;
  }

  .contact-form {
    padding-top: 24px;
    color: #000000;
    font-size: 16px;
    line-height: 150%;
  }
}

/* --------------------------------------------------------------------------------------------- */
/* body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: #f4f7ff;
    margin: 0;
    padding: 0;
  } */
html,
body {
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  width: 100%;
}

.btn-button {
  padding: 12px 24px;
  border-radius: 30px;
  font-size: 16px;
  font-weight: bold;
  /* background: linear-gradient(100.08deg, #9FA2E3 -35.1%, #5054C8 42.84%, #0E0F2C 162.24%); */
  color: white;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.btnchange {
  padding: 12px 24px;
  border-radius: 30px;
  font-size: 16px;
  font-weight: bold;
  border: 2px solid white;

  background: white;
  color: black;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}
.btn-ok {
  background: #aaaaaa;
  color: #000000;
  border-radius: 1000px;
  font-family: Arial, sans-serif;
  border: none;
}

.bg-dark-blue {
  background: linear-gradient(225.22deg, #262a90 53.87%, #577eb9 138.32%);
  color: white;
}

.footer p {
  font-size: 14.5px;
  font-family: "Poppinsmedium", sans-serif;
}

.footer-links a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}

.footer-links a:hover {
  text-decoration: underline;
}

.divider {
  color: #fff;
  margin: 0 8px;
}

.text-pink {
  color: white;
}

.text-orange {
  color: white;
}

/* validation */
.error {
  color: red;
  font-size: 0.875rem;
  margin-top: 4px;
}

/* ------------------------------------------------------------------------------------------------- */

/* actual change */
.adaptive-learning {
  background: url("../images/bluebanner-finial.png") no-repeat center center;
  padding: 35px 10px;
  background-size: cover;
  color: #fff;
}
@media (min-width: 350px) and (max-width: 767px) {
  .hero-section {
    padding: 48px 20px;
  }
}
/*  */

/* ========== TABLE STRUCTURE ========== */

.learning-comparison-section {
  padding: 0% 10% 0% 10%;
}

.wrapper {
  /* padding: 25px; */
  max-width: 100%;
  max-height: 100%;
}

/* Common table cell styles */
table th,
table td {
  vertical-align: middle !important;
  line-height: 2.1;

  /* border-spacing: 0 10px; */
}

/* Emphasize feature names */
table td strong {
  color: #2c2c8a;
  font-weight: bold;
}

/* ========== VIDYABUDDHI COLUMN STYLES ========== */

/* Top-right and top-left rounded header cell */
.vidyabuddhi-column {
  background: linear-gradient(to top left, #ff6600, #ff9966);
  color: white;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-left: 8px solid #fef0e3;
  border-right: 8px solid #fef0e3;
  border-top: 8px solid #fef0e3;
}

/* Middle cells */
.vidyabuddhi {
  background: linear-gradient(to top left, #ff6600, #ff9966);
  color: white;
  border-left: 8px solid #fef0e3;
  border-right: 8px solid #fef0e3;
  border-top: 2px solid #fef0e3;
}

/* Bottom cell with rounded corners */
.table {
  border-collapse: separate !important;
  border-spacing: 0;
}

.vidyabuddhi-column-end {
  background: linear-gradient(to top left, #ff6600, #ff9966);
  color: white;
  border-left: 8px solid #fef0e3;
  border-right: 8px solid #fef0e3;
  /* remove border-bottom here if using after */
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 16px 8px;
  position: relative;
  z-index: 1;
}

.vidyabuddhi-column-end::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 8px;
  width: 100%;
  background-color: #fef0e3;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  pointer-events: none;
}

/* Make sure gradient cells override tbody blue */
.vidyabuddhi,
.vidyabuddhi-column,
.vidyabuddhi-column-end {
  background: linear-gradient(to top left, #ff6600, #ff9966) !important;
  color: white !important;
}
.table {
  border-collapse: separate !important;
  border-spacing: 0;
}

/*  */

/* .vijnata-section .section-title {
  font-size: 2rem;
  font-weight: 700;
  color: #262e9c;
  margin-bottom: 30px;
} */

.vijnata-box {
  background-color: #f7f7fb;
  padding: 30px 40px;
  border-radius: 10px;
  max-width: 1000px;
}

.vijnata-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.vijnata-list li {
  position: relative;
  padding-left: 30px;
  font-size: 1rem;
  font-weight: bold;
  color: #1c1c1c;
  margin-bottom: 15px;
  line-height: 1.6;
}

.vijnata-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3em;
  width: 17px; /* small tick size */
  height: 17px;
  background-image: url(../images/tick.svg); /* update path if needed */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ===== Our Impact Section ===== */

.impact-card {
  border: 1px solid #d1d9e6; /* soft bluish-gray border */

  border-radius: 15px;
  /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-align: left;
}

.impact-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.impact-card h5 {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 12px;
  color: #333;
}

.impact-card ul {
  list-style-type: disc;
  padding-left: 20px;
  margin: 0;
}

.impact-card ul li {
  font-size: 16px;
  color: black;
  margin-bottom: 6px;
  line-height: 1.5;
}

@media (min-width: 350px) and (max-width: 767px) {
  .impact-card {
    text-align: center;
  }

  .impact-card ul {
    padding-left: 0;
    list-style: none;
  }
}

/* link for source */
/* keep anchor white in all states */
.white-link,
.white-link:visited {
  color: #fff;
}
.white-link:hover,
.white-link:focus {
  color: #e0e0e0; /* optional hover tint */
  text-decoration: underline;
}
/* content sources impact */
.custom-card {
  background-color: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  height: 100%;
}

.custom-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.custom-card-body {
  padding: 20px;
}

.icon-text-wrap {
  gap: 15px;
}

.icon-wrap {
  width: 40px;
  height: 40px;
}

.icon-img {
  width: 100%;
  height: auto;
}

.custom-card-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #222;
  margin: 0;
}

.custom-card-text {
  font-size: 0.95rem;
  color: black;
  margin-top: 12px;
}

/* end */

.content-source {
  padding: 0% 5% 0% 5%;
}
/*  */
/* courasol */

.testimonials-section {
  text-align: center;
  /* padding: 112px 64px; */
  width: 100%;
  /* max-width: 1920px; */
}

.testimonials-section h2 {
  /* font-family: Plus Jakarta Sans; */
  font-weight: 700;
  font-size: 48px;
  line-height: 1.2;
  letter-spacing: 0%;
  text-align: center;
  color: #222222;
}

.carousel-item {
  height: 100%;
  padding: 20px;
}
.testimonial-box {
  background: white;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border: 3px solid transparent; /* Initially set to transparent */
  border-top: 3px solid #fd9a57; /* Top border with color FD9A57 */
  border-bottom: 3px solid #fd9a57; /* Bottom border with color FD9A57 */
  border-left: 3px solid #6267ff; /* Left border with color FD9A57 */
  border-right: 3px solid #6267ff; /* Right border with color 6267FF */
  margin: auto;
  width: 75%;
  height: 240px;
  gap: 20px;
}
.testimonial-logo {
  width: 100px;
  margin-bottom: 10px;
}
.testimonial-text {
  color: black;
  height: 100px;

  font-size: 16px;
  line-height: 1.2;
  text-align: center;
}

.testimonial-person p {
  /* font-family: Roboto; */
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0%;
  text-align: center;
  color: black;
}
.testimonial-person img {
  width: 50px;
  border-radius: 50%;
}
.carousel-control-prev,
.carousel-control-next {
  filter: invert(1);
}

@media (min-width: 350px) and (max-width: 767px) {
  .testimonials-section {
    padding: 15px 20px;
  }

  .testimonials-section h2 {
    font-size: 24px;
    line-height: 150%;
  }

  .testimonial-box {
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
  }

  .testimonial-text {
    font-size: 18px;
    line-height: 140%;
  }

  .carousel-control-next {
    right: -25px;
  }

  .carousel-control-prev {
    left: -25px;
  }
}
/* mobile view */
/* mobile start */
@media (min-width: 350px) and (max-width: 767px) {
  .navbar {
    background-color: #ffffff !important;
    height: auto !important;
    padding: 0.75rem 1rem;
    width: 100%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  }

  .navbar-brand .logo {
    height: 35px !important;
  }

  .navbar-nav {
    flex-direction: column;
    align-items: stretch;
    padding-top: 1rem;
  }

  .navbar-nav .nav-item {
    margin: 4px 0;
  }

  .navbar-nav .btn-phonenumber,
  .navbar-nav .btn-primary {
    width: 100%;
    margin-bottom: 10px;
    border-radius: 30px;
    padding: 12px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
  }

  .navbar-nav .btn-phonenumber {
    color: black;
  }

  .navbar-nav .btn-primary {
    background-color: #fc8939;
    border: none;
  }

  .navbar-right {
    display: none !important;
  }
}
/* mobile end */
/* Default: show table, hide mobile image outside 375–430px */
.vijnata-mobile-image {
  display: none;
}
/* Hide table and show image ONLY on devices between 375px and 430px */
@media (min-width: 350px) and (max-width: 767px) {
  .vijnata-table {
    display: none !important;
  }

  .vijnata-mobile-image {
    display: block !important;
  }
  /* vijnita box */
  .vijnata-box {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  /* imopact */
  .impact-card {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .custom-card-title{
    font-size: 18px !important;
  }
  /* testmonial */

   .testimonial-box {
    height: 400px; 
    width: 280px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .testimonial-text {
    margin: 0px, 10px,0 10px;
    /* height: 30px; */
    color: #000;
    font-size: 13px;
    line-height: 1.0;
    text-align: center;
   
  }

  .testimonial-person p {
    font-size: 16px;
    text-align: center;
    margin-top: 100px;
  }
.testimonial-logo {
  max-width: 80px;
  height: auto;
  margin: 0 auto 10px auto; /* centers horizontally */
  display: block; /* required for margin auto to work */
}
.testimonials-section{
  margin: 0px !important;
}
/* contact us */
.contact-section{
    margin: 0px !important;
}
/* blue banner */
.adaptive-learning h3 {
font-size: 20px !important;
}
.adaptive-learning h5 {
font-size: 17px !important;
}
.adaptive-learning h6 {
font-size: 16px !important;
}
.adaptive-learning p {
font-size: 14px !important;
}

}

/* start */

/* ==================================================================
   HOME PAGE  (Section 1 - Section 4)
   ================================================================== */

/* shared heading / paragraph styles */
.section-title {
  color: #2e3083;
  font-size: 35px;
}

.section-text {
  font-size: 16px;
  line-height: 1.7;
  color: #222222;
}

.section-text strong {
  color: #222222;
  font-weight: 700;
}

/* ---------- Section 1 : Home banner ---------- */
.home-banner {
  position: relative;
  overflow: hidden;
  background-color: #ffffff;
  margin-top: 100px; /* clears the fixed navbar */
  min-height: calc(100vh - 100px);
  display: flex;
  align-items: center;
  padding: 40px 0 50px 0;
  box-sizing: border-box;
}

.home-element {
  position: absolute;
  height: auto;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}

.home-element-tl {
  top: 0;
  left: 0;
  width: 24%;
}

.home-element-tr {
  top: 0;
  right: 0;
  width: 32%;
}

.home-element-bl {
  bottom: 0;
  left: 0;
  width: 17%;
}

.home-element-br {
  bottom: 0;
  right: 0;
  width: 22%;
}

.home-banner-inner {
  position: relative;
  z-index: 1;
  width: 100%;
}

.home-banner-logo {
  height: 40px;
  width: auto;
}

/* colours and spacing follow the main Sambhuti Learning site (.hero-title) */
.home-banner-title {
  font-family: 'PT Sans Caption', sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 1.2;
  color: #0e1d75;
  margin-bottom: 24px;
}

.home-banner-text {
  font-family: 'PT Sans', sans-serif;
  font-size: 20px;
  line-height: 1.6;
  color: #222222;
  max-width: 620px;
  margin-bottom: 32px;
}

.btn-learnmore {
  display: inline-block;
  background: #f47b20;
  color: #ffffff;
  border: none;
  border-radius: 30px;
  padding: 10px 26px;
  font-size: 16px;
  font-weight: 600;
  transition: all 0.3s ease-in-out;
}

.btn-learnmore:hover,
.btn-learnmore:focus {
  background: #fc8939;
  color: #ffffff;
}

.home-banner-picture {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
}

/* placeholder notice shown in place of the Learn more button */
.under-construction {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff6ef;
  border: 1px dashed #f47b20;
  border-radius: 10px;
  padding: 14px 22px;
  font-size: 16px;
  font-weight: 600;
  color: #222222;
}

.under-construction i {
  font-size: 18px;
  color: #f47b20;
}

/* ---------- Section 2 : The Gap In Higher Education ---------- */
/* kept close to the paragraph block size, as per the design */
.gap-section-image {
  width: 100%;
  max-width: 420px;
  height: auto;
}

/* ---------- Section 3 & 4 : gray cards ---------- */
.gray-card {
  background-color: #f7f7f9;
  border: 1px solid #e6e6ee;
  border-radius: 12px;
  padding: 24px;
}

.gray-card-title {
  font-size: 18px;
  font-weight: 700;
  color: #f47b20;
  margin-bottom: 14px;
}

.gray-card-title i {
  color: #f47b20;
  margin-right: 6px;
}

.gray-card-lead {
  font-size: 15px;
  font-weight: 700;
  color: #222222;
  margin-bottom: 10px;
}

.gray-card-text {
  font-size: 15px;
  line-height: 1.7;
  color: #222222;
}

/* plain image, no card around it */
.pie-wrap img {
  max-width: 100%;
  height: auto;
}

/* ---------- Home page : mobile / tablet ---------- */
@media (max-width: 991.98px) {
  .home-banner-title {
    font-size: 40px;
  }

  .home-banner-text {
    font-size: 18px;
    max-width: 100%;
  }

  .home-banner-picture {
    margin-top: 20px;
  }
}

@media (max-width: 767.98px) {
  .section-title {
    font-size: 24px !important;
    line-height: 1.4;
  }

  .home-banner {
    margin-top: 80px;
    min-height: calc(100vh - 80px);
    padding: 24px 0 30px 0;
    text-align: center;
  }

  .home-element-tl {
    width: 38%;
  }

  .home-element-tr {
    width: 45%;
  }

  .home-element-bl {
    width: 30%;
  }

  .home-element-br {
    width: 38%;
  }

  .home-banner-logo {
    height: 32px;
  }

  .home-banner-title {
    font-size: 30px;
  }

  .home-banner-text {
    font-size: 17px;
    margin-bottom: 20px;
  }

  .btn-learnmore {
    padding: 10px 22px;
    font-size: 15px;
  }

  .under-construction {
    padding: 12px 16px;
    font-size: 14px;
    text-align: left;
  }

  .section-text {
    font-size: 14px;
  }

  .gray-card {
    padding: 18px;
  }

  .gray-card-title {
    font-size: 16px;
  }

  .gray-card-lead,
  .gray-card-text {
    font-size: 14px;
  }

  .pie-wrap {
    padding: 0;
  }
}

/* ---------- Section 5 : The Vijnata Advantage ---------- */
.advantage-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.2fr 1.2fr;
  column-gap: 24px;
}

/* card backgrounds sitting behind the cells */
.adv-bg {
  grid-row: 1 / 6;
  border-radius: 16px;
  z-index: 0;
}

.adv-bg-white {
  grid-column: 2;
  background: #ffffff;
  border: 1px solid #ececf3;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.adv-bg-orange {
  grid-column: 3;
  background: #f47b20;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.adv-col1 {
  grid-column: 1;
}
.adv-col2 {
  grid-column: 2;
}
.adv-col3 {
  grid-column: 3;
}

.adv-r1 {
  grid-row: 1;
}
.adv-r2 {
  grid-row: 2;
}
.adv-r3 {
  grid-row: 3;
}
.adv-r4 {
  grid-row: 4;
}
.adv-r5 {
  grid-row: 5;
}

.adv-head {
  position: relative;
  z-index: 1;
  font-size: 18px;
  font-weight: 700;
  color: #222222;
  padding: 24px 24px 18px 24px;
}

.adv-head.adv-col1 {
  padding-left: 0;
  padding-right: 0;
}

.adv-head.adv-col3 {
  color: #ffffff;
}

.adv-label {
  position: relative;
  z-index: 1;
  /* sit at the top of the row so the label lines up with the first line of
     the point beside it, instead of drifting to the middle of a tall row */
  align-self: start;
  font-size: 14px;
  font-weight: 700;
  /* same line box as .adv-point p, so the first lines align exactly */
  line-height: 1.65;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #2e3083;
  padding: 0;
}

.adv-label.adv-r3,
.adv-label.adv-r4,
.adv-label.adv-r5 {
  /* matches the padding-top on .adv-item for these rows */
  padding-top: 18px;
  border-top: 1px solid #e6e6ee;
}

.adv-item {
  position: relative;
  z-index: 1;
  padding: 0 24px 18px 24px;
}

/* separators between points - these sit on the same grid rows as the
   labels in column 1, so all three columns line up. Drawn inset from the
   card edges rather than edge to edge, to match the design. */
.adv-item.adv-r3,
.adv-item.adv-r4,
.adv-item.adv-r5 {
  padding-top: 18px;
}

.adv-item.adv-r3::before,
.adv-item.adv-r4::before,
.adv-item.adv-r5::before {
  content: "";
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  height: 1px;
  background: #e6e6ee;
}

.adv-item.adv-col3.adv-r3::before,
.adv-item.adv-col3.adv-r4::before,
.adv-item.adv-col3.adv-r5::before {
  background: rgba(255, 255, 255, 0.4);
}

.adv-item.adv-r5 {
  padding-bottom: 26px;
}

.adv-point {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.adv-point i {
  flex-shrink: 0;
  font-size: 15px;
  line-height: 1.7;
  color: #9aa0a6;
}

.adv-point p {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: #333333;
}

.adv-point strong {
  font-weight: 700;
  color: #222222;
}

.adv-item.adv-col3 .adv-point i,
.adv-item.adv-col3 .adv-point p,
.adv-item.adv-col3 .adv-point strong {
  color: #ffffff;
}

.adv-mobile-tag {
  display: none;
}

@media (max-width: 991.98px) {
  .advantage-grid {
    grid-template-columns: 0.8fr 1.2fr 1.2fr;
    column-gap: 14px;
  }

  .adv-head {
    font-size: 16px;
    padding: 18px 16px 14px 16px;
  }

  .adv-label {
    font-size: 13px;
  }

  .adv-item {
    padding: 0 16px 16px 16px;
  }

  .adv-point p {
    font-size: 13px;
  }
}

/* stacked, feature by feature, on phones */
@media (max-width: 767.98px) {
  .advantage-grid {
    display: block;
  }

  .adv-bg,
  .adv-head {
    display: none;
  }

  .adv-label,
  .adv-label.adv-r3,
  .adv-label.adv-r4,
  .adv-label.adv-r5 {
    display: block;
    padding: 0;
    margin: 24px 0 10px 0;
    border-top: none !important;
    font-size: 13px;
  }

  .adv-item {
    padding: 16px;
    margin-bottom: 12px;
    border-radius: 12px;
  }

  /* stacked cards on phones - the row separators don't apply */
  .adv-item::before {
    display: none;
  }

  .adv-item.adv-col2 {
    background: #ffffff;
    border: 1px solid #e6e6ee;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  }

  .adv-item.adv-col3 {
    background: #f47b20;
  }

  .adv-mobile-tag {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #666666;
  }

  .adv-item.adv-col3 .adv-mobile-tag {
    color: rgba(255, 255, 255, 0.9);
  }
}


/* ---------- Section 6 : Features And Values Delivered ---------- */
.feature-card {
  background: #ffffff;
  border: 1px solid #f0f0f5;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  padding: 20px;
}

.feature-icon {
  width: 58px;
  height: auto;
  margin-bottom: 10px;
}

.feature-card-title {
  font-size: 19px;
  font-weight: 700;
  color: #222222;
  margin-bottom: 10px;
}

.feature-list {
  margin: 0;
  padding-left: 18px;
}

.feature-list li {
  font-size: 14px;
  line-height: 1.6;
  color: #333333;
  margin-bottom: 6px;
}

.feature-list li::marker {
  color: #2e3083;
}

/* course cards */
.course-card {
  background: #ffffff;
  border: 1px solid #f0f0f5;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  padding: 16px 10px;
  text-align: center;
}

.course-icon {
  width: 58px;
  height: auto;
  margin-bottom: 8px;
}

.course-card-title {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
  color: #222222;
}

/* ---------- Section 8 : Delivery workflow diagram ---------- */
.workflow-diagram {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.workflow-diagram-inner {
  min-width: 100%;
}

.workflow-row {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 14px;
}

.workflow-row-cycle {
  position: relative;
}

.workflow-row-cycle img:first-child {
  display: block;
  width: 100%;
  height: auto;
}

/* sits on the dashed return arrow inside row 3 */
.workflow-cycle-label {
  position: absolute;
  left: 38%;
  bottom: 3%;
  width: 14%;
  height: auto;
  transform: translateX(-50%);
  background: #ffffff;
  padding: 0 6px;
}

.workflow-hint {
  display: none;
  margin: 0 0 10px 0;
  font-size: 13px;
  color: #777777;
  text-align: center;
}

/* ---------- Section 9 : Case study ---------- */
.case-card {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #ececf3;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  padding: 24px;
}

.case-card-title {
  font-size: 19px;
  font-weight: 700;
  color: #2e3083;
  margin-bottom: 14px;
}

.case-card-title i {
  color: #f47b20;
  margin-right: 6px;
}

.case-list {
  margin: 0;
  padding-left: 18px;
}

.case-list li {
  font-size: 14px;
  line-height: 1.6;
  color: #333333;
  margin-bottom: 10px;
}

.case-solution {
  font-size: 15px;
  font-weight: 700;
  color: #222222;
}

.case-solution-light {
  font-weight: 400;
}

.case-used {
  margin: 0;
  padding: 0;
  list-style: none;
}

.case-used li {
  font-size: 14px;
  line-height: 1.6;
  color: #333333;
  padding: 12px 0;
  border-bottom: 1px solid #ececf3;
}

.case-used li:first-child {
  padding-top: 0;
}

.case-used li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.case-used strong {
  font-weight: 700;
  color: #222222;
}

/* orange outcome card with the diagonal highlight */
.case-card-orange {
  background: #eb6405;
  border-color: #eb6405;
}

/* lighter wedge sitting in the top-right corner: right angle at the corner,
   one point on the top edge and one down the right edge, so the hypotenuse
   runs diagonally down-right. Points are  top-edge / corner / right-edge. */
.case-card-orange::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.12);
  clip-path: polygon(25% 0, 100% 0, 100% 50%);
  pointer-events: none;
}

.case-card-orange .case-card-title,
.case-card-orange .case-card-title i,
.case-card-orange .case-list li {
  color: #ffffff;
  position: relative;
  z-index: 1;
}

.case-card-orange .case-list li {
  font-weight: 600;
}

.case-usedby {
  font-size: 16px;
  font-weight: 700;
  color: #222222;
}

@media (max-width: 991.98px) {
  /* the workflow rows are wide diagrams - let them scroll instead of shrink */
  .workflow-diagram-inner {
    min-width: 900px;
  }

  .workflow-hint {
    display: block;
  }
}

@media (max-width: 767.98px) {
  .feature-card,
  .case-card {
    padding: 18px;
  }

  .feature-card-title {
    font-size: 17px;
  }

  .feature-list li,
  .case-list li,
  .case-used li {
    font-size: 13px;
  }

  .feature-icon,
  .course-icon {
    width: 52px;
  }

  .course-card-title {
    font-size: 15px;
  }

  .case-card-title {
    font-size: 17px;
  }

  .case-usedby {
    font-size: 14px;
    text-align: center;
  }
}

/* ---------- Footer : Excellence Awards badge ---------- */
.footer-award {
  position: relative;
  display: block;
  width: 110px;
  margin: 14px 15px 0 0;
}

.footer-award-wreath {
  display: block;
  width: 100%;
  height: auto;
}

.footer-award-text {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #ffffff;
  line-height: 1.25;
}

.footer-award-title {
  font-size: 11px;
  font-weight: 700;
}

.footer-award-sub {
  font-size: 9px;
  margin-top: 3px;
}

@media (max-width: 767.98px) {
  .footer-award {
    margin: 12px auto 0 auto;
  }
}

/* ---------- Section 10 : Frequently Asked Questions ---------- */
.faq-accordion {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  --bs-accordion-border-color: transparent;
  --bs-accordion-btn-focus-box-shadow: none;
  --bs-accordion-btn-icon-width: 1.5rem;
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23f47b20'%3e%3ccircle cx='8' cy='8' r='7' stroke-width='1'/%3e%3cpath d='M5 6.6 8 9.6 11 6.6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23f47b20'%3e%3ccircle cx='8' cy='8' r='7' stroke-width='1'/%3e%3cpath d='M5 6.6 8 9.6 11 6.6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}

.faq-accordion .accordion-item {
  background: #ffffff;
  border: 1px solid #ececf3;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  margin-bottom: 12px;
  overflow: hidden;
}

.faq-accordion .accordion-button {
  background: #ffffff;
  padding: 18px 20px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: #222222;
  box-shadow: none;
}

/* keep the header looking the same once it is open */
.faq-accordion .accordion-button:not(.collapsed) {
  background: #ffffff;
  color: #222222;
  box-shadow: none;
}

.faq-accordion .accordion-body {
  padding: 0 20px 18px 20px;
  font-size: 14px;
  line-height: 1.7;
  color: #444444;
}

@media (max-width: 767.98px) {
  .faq-accordion .accordion-button {
    padding: 14px 16px;
    font-size: 15px;
  }

  .faq-accordion .accordion-body {
    padding: 0 16px 14px 16px;
    font-size: 13px;
  }
}
