/**
 * About lab — overrides só onde o lab precisa.
 * Secção TOPO (who / team / crosses / textos): deixa o CSS original do motor
 * (about.CNa9RfUh.css) mandar — sem 2vw forçado nem fotos 70%×90%.
 * Secção CLIENTES e abaixo: logos em px (já aprovado).
 */

/* ── Team photos: tamanho original wescctech (não faces 70×90) ── */
#wescctech-team-photos {
  position: absolute !important;
  left: 2% !important;
  bottom: 6% !important;
  top: auto !important;
  right: auto !important;
  width: min(38%, 400px) !important;
  height: min(66%, 60vh) !important;
  z-index: 5 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}
@media (max-width: 812px) {
  #wescctech-team-photos {
    left: 50% !important;
    width: min(70%, 310px) !important;
    height: min(48%, 42vh) !important;
    bottom: 24% !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }
}
#about-who-team {
  overflow: visible !important;
  position: relative !important;
}
#about-who-subsection-team {
  overflow: visible !important;
}
#about-who-team-faces {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/*
 * "Somos um time..." (canto sup. esq. + inf. dir.)
 * Original motor: 4vw — pedido: bem mais pequeno.
 */
#about-who-subsection-details,
#about-who-desc-top,
#about-who-desc-bottom {
  font-size: 1.15vw !important;
  line-height: 1.3 !important;
}
@media (min-aspect-ratio: 21/9) {
  #about-who-subsection-details,
  #about-who-desc-top,
  #about-who-desc-bottom {
    font-size: 0.85vw !important;
  }
}
@media (max-width: 812px) {
  #about-who-subsection-details,
  #about-who-desc-top,
  #about-who-desc-bottom {
    font-size: 2.4vw !important;
  }
}
@media (max-width: 560px) {
  #about-who-subsection-details,
  #about-who-desc-top,
  #about-who-desc-bottom {
    font-size: 3.2vw !important;
  }
}

/* Cruzes + — reforço do motor (não herdar overrides de home) */
#about-crosses {
  position: absolute !important;
  width: calc(100vw - var(--base-padding-x) * 2 - var(--cross-size)) !important;
  height: 10px !important;
  left: calc(var(--base-padding-x) + var(--cross-size) / 2) !important;
  top: 50% !important;
  margin-top: -1px !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
.about-cross {
  position: absolute !important;
  width: calc(0.125 * var(--cross-size)) !important;
  height: calc(0.125 * var(--cross-size)) !important;
  top: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}
.about-cross:before,
.about-cross:after {
  position: absolute !important;
  content: "" !important;
  width: var(--cross-size) !important;
  height: calc(0.125 * var(--cross-size)) !important;
  margin-left: calc(var(--cross-size) / -2) !important;
  margin-top: calc(var(--cross-size) / -2) !important;
  background: #999 !important;
  left: 0 !important;
  top: 0 !important;
}
.about-cross:after {
  transform: rotate(90deg) !important;
}
/* igual about.CNa9RfUh.css */
.about-cross:nth-child(1) {
  left: 25% !important;
}
.about-cross:nth-child(2) {
  left: 50% !important;
}
.about-cross:nth-child(3) {
  left: 75% !important;
}
.about-cross:nth-child(4) {
  left: 100% !important;
}
@media (max-width: 380px) {
  #about-crosses {
    display: none !important;
  }
}

/*
 * Barra de progresso sob o título TEAM.
 * O motor anima scaleX em #about-who-team-indicator (-inner).
 * Preenche ao rolar para a próxima secção.
 */
#about-who-team-right {
  position: relative !important;
}
#about-who-team-title {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  flex-shrink: 0 !important;
}
/* escondida por defeito — só com o título TEAM (classe is-on / JS) */
#about-who-team-progress {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 3px !important;
  margin: 0.85em 0 1.1em 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  z-index: 3 !important;
  display: block !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.2s ease;
}
#about-who-team-progress.is-on {
  visibility: visible !important;
}
#about-who-team-indicator {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform-origin: 0 0 !important;
  background-color: transparent !important;
  display: block !important;
}
#about-who-team-indicator-inner {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: #fff !important;
  transform-origin: 0 0 !important;
  border-radius: 999px !important;
  display: block !important;
}

/* ── Empresas que confiam (abaixo — já ok; manter) ── */
#about-clients-carousel img,
.about-clients-carousel-line img,
#about-clients .about-clients-carousel-line img,
#about-clients-carousel .about-clients-carousel-line img {
  height: 120px !important;
  width: auto !important;
  max-height: 120px !important;
  max-width: 220px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 28px !important;
  object-fit: contain !important;
  object-position: center !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  display: block !important;
  filter: grayscale(1) brightness(0) invert(1) !important;
  opacity: 0.85 !important;
}

#about-clients-carousel img:hover,
.about-clients-carousel-line img:hover {
  opacity: 1 !important;
}

#about-clients-title {
  font-size: 2.4em !important;
}
@media (min-aspect-ratio: 21/9) {
  #about-clients-title {
    font-size: 3.2em !important;
  }
}
@media (max-width: 812px) {
  #about-clients-title {
    font-size: 9vw !important;
  }
}

#about-clients-desc {
  font-size: 0.72em !important;
}
@media (min-aspect-ratio: 21/9) {
  #about-clients-desc {
    font-size: 0.82em !important;
  }
}
@media (max-width: 812px) {
  #about-clients-desc {
    font-size: 1em !important;
  }
}

#about-clients-carousel {
  overflow: hidden !important;
  margin-top: clamp(2.75rem, 5.5vh, 4.5rem) !important;
}

.about-clients-carousel-line-wrapper:not(:first-child) {
  margin-top: 56px !important;
}

.about-clients-carousel-line {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
}

@media (max-width: 812px) {
  #about-clients-carousel img,
  .about-clients-carousel-line img,
  #about-clients .about-clients-carousel-line img {
    height: 90px !important;
    max-height: 90px !important;
    max-width: 170px !important;
    margin: 0 20px !important;
  }
  .about-clients-carousel-line-wrapper:not(:first-child) {
    margin-top: 40px !important;
  }
}