/* ===================== Client Tabs (client.php) ===================== */
.client-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  margin: 0 0 50px;
  padding: 0;
}

.client-tabs__nav .tab-btn-item {
  cursor: pointer;
  padding: 14px 34px;
  border: 2px solid var(--builza-base);
  border-radius: 50px;
  font-family: var(--builza-font-two);
  font-weight: 600;
  font-size: 16px;
  color: var(--builza-black);
  background: transparent;
  transition: all 300ms ease;
  user-select: none;
}

.client-tabs__nav .tab-btn-item:hover {
  background: var(--builza-base);
  color: #fff;
}

.client-tabs__nav .tab-btn-item.active-btn {
  background: var(--builza-base);
  color: #fff;
}

.client-tabs .tabs-content-box .tab {
  display: none;
}

.client-tabs .tabs-content-box .tab.tab-active {
  display: block;
  animation: clientTabFade 500ms ease;
}

@keyframes clientTabFade {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 767px) {
  .client-tabs__nav {
    gap: 10px;
    margin-bottom: 30px;
  }

  .client-tabs__nav .tab-btn-item {
    padding: 10px 20px;
    font-size: 14px;
  }
}

/* ===================== Client Item Card ===================== */
.client-tabs__item {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 10px 18px;
  border: 1px solid #ececec;
  border-radius: 8px;
  background: #fff;
  transition: all 300ms ease;
  margin-bottom: 12px;
}

.client-tabs__item:hover {
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
  border-color: transparent;
}

.client-tabs__item-title {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--builza-font-two);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--builza-black);
  margin: 0;
}

.client-tabs__download {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  border: 1.5px solid var(--builza-base);
  border-radius: 50px;
  font-family: var(--builza-font-two);
  font-weight: 600;
  font-size: 12px;
  color: var(--builza-base);
  background: transparent;
  transition: all 300ms ease;
}

.client-tabs__download:hover {
  background: var(--builza-base);
  color: #fff;
}

@media (max-width: 575px) {
  .client-tabs__item {
    flex-wrap: wrap;
  }

  .client-tabs__item-title {
    white-space: normal;
  }
}

/* ===================== Government Clients Numbering ===================== */
#govt-clients .team-one__inner .row {
  counter-reset: govt-client;
}

#govt-clients .client-tabs__item-title::before {
  counter-increment: govt-client;
  content: counter(govt-client) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Private Clients Numbering ===================== */
#private-clients .team-one__inner .row {
  counter-reset: private-client;
}

#private-clients .client-tabs__item-title::before {
  counter-increment: private-client;
  content: counter(private-client) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Building Sector Numbering ===================== */
#building-sector .team-one__inner .row {
  counter-reset: building-sector-item;
}

#building-sector .client-tabs__item-title::before {
  counter-increment: building-sector-item;
  content: counter(building-sector-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Industrial Sector Numbering ===================== */
#industrial-sector .team-one__inner .row {
  counter-reset: industrial-sector-item;
}

#industrial-sector .client-tabs__item-title::before {
  counter-increment: industrial-sector-item;
  content: counter(industrial-sector-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Infrastructural Sector Numbering ===================== */
#infrastructural-sector .team-one__inner .row {
  counter-reset: infrastructural-sector-item;
}

#infrastructural-sector .client-tabs__item-title::before {
  counter-increment: infrastructural-sector-item;
  content: counter(infrastructural-sector-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Recreational & Sports Sector Numbering ===================== */
#recreational-sports-sector .team-one__inner .row {
  counter-reset: recreational-sports-sector-item;
}

#recreational-sports-sector .client-tabs__item-title::before {
  counter-increment: recreational-sports-sector-item;
  content: counter(recreational-sports-sector-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== RCC Type Numbering ===================== */
#rcc-type .team-one__inner .row {
  counter-reset: rcc-type-item;
}

#rcc-type .client-tabs__item-title::before {
  counter-increment: rcc-type-item;
  content: counter(rcc-type-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}

/* ===================== Structural Steel Type Numbering ===================== */
#structural-steel-type .team-one__inner .row {
  counter-reset: structural-steel-type-item;
}

#structural-steel-type .client-tabs__item-title::before {
  counter-increment: structural-steel-type-item;
  content: counter(structural-steel-type-item) ". ";
  color: var(--builza-base);
  font-weight: 700;
}