.button-holder {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.button-holder .moved-nav-btn {
  padding: 10px 45px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  border-radius: 50px;
  border: 1px solid #002C52;
  width: auto;
  cursor: pointer;
  font-weight: 500;
}

/* Back button */
.button-holder .btn-back {
  background: #fff;
  color: #002C52;
}

/* Next button */
.button-holder .btn-next {
  background: #004D90;
  color: #fff;
}


ul.wsf-group-tabs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 100%;
    padding-left: 0!important;
    /* reset the UA/WSF defaults */
  padding-inline-start: 0 !important; /* ← not padding-left */
  margin: 0;                           /* remove top/bottom margins */
  list-style: none;                     /* remove bullets */
}

.title-holder h2 {
  display: block!important;
  color: #002C52;
font-family: "Lexend Giga";
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: 50px; /* 166.667% */
text-transform: uppercase;
  margin-bottom: 20px;
  margin-top: 50px;
}

.wsf-group-tabs a {
  color: #002C52;
  font-family: "Lexend Giga";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px; /* 187.5% */
}


/* Container layout + resets */
.tabs-holder ul.wsf-group-tabs.wsf-tabs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 48px;                          /* adjust spacing */
  margin: 0;
  padding-inline-start: 0;            /* not padding-left */
  list-style: none;
  counter-reset: step;                 /* start numbering at 0 */
}

/* Each tab */
.tabs-holder .wsf-group-tabs .wsf-group-tab {
  counter-increment: step;             /* 1,2,3... */
}

/* Link layout */
.tabs-holder .wsf-group-tabs .wsf-group-tab > a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  font-weight: 700;
  color: #0C2A3F;                      /* lit text */
  white-space: nowrap;
}

/* Number circle (lit state by default) */
.tabs-holder .wsf-group-tabs .wsf-group-tab > a::before {
  content: counter(step);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #0A4E8E;                 /* lit circle bg */
  color: #fff;                         /* lit circle text */
  font-weight: 700;
  line-height: 1;
  flex: 0 0 32px;
  transition: background .2s, color .2s, opacity .2s;
}

/* DULL state: every tab AFTER the active one */
.tabs-holder .wsf-group-tabs .wsf-group-tab.wsf-tab-active ~ .wsf-group-tab > a {
  color: #9eb0bf;                      /* dull text */
  font-weight: 600;
  opacity: .7;
}
.tabs-holder .wsf-group-tabs .wsf-group-tab.wsf-tab-active ~ .wsf-group-tab > a::before {
  background: #E3ECF4;                 /* dull circle bg */
  color: #9eb0bf;                      /* dull number */
}

/* Optional: highlight the active one slightly differently (still "lit") */
.tabs-holder .wsf-group-tabs .wsf-group-tab.wsf-tab-active > a {
  color: #072946;
  text-underline-offset: 4px;
}

/* Small screens (optional) */
@media (max-width: 640px) {
  .tabs-holder ul.wsf-group-tabs.wsf-tabs {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .tabs-holder .wsf-group-tabs .wsf-group-tab > a::before {
    width: 28px; height: 28px; flex-basis: 28px;
  }
}

