/* =========================================================
   WHO WE ARE
   1440px = Figma pixel-perfect (padding 80px, gap 80px,
   eyebrow 20px, mətn 28px, rəqəm 80px, label 32px)
   Aşağı ölçülərdə bütün blok proporsional kiçilir.
   ========================================================= */

.who-we-are {
  padding: clamp(48px, 5.5556vw, 80px);
}

.who-we-are__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(40px, 5.5556vw, 80px); /* 1440 → 80px */
  max-width: 1280px; /* header-in kontent sahəsi ilə eyni */
  margin: 0 auto;
}

.who-we-are__intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(16px, 2.7778vw, 40px); /* 1440 → 40px */
  width: 100%;
}

.who-we-are__eyebrow {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: clamp(16px, 1.3889vw, 20px); /* 1440 → 20px */
  line-height: 120%;
  letter-spacing: 0.04em;
  color: var(--color-nav-active);
  text-transform: uppercase;
}

.who-we-are__text {
  font-family: var(--font-family);
  font-weight: 400;
  font-size: clamp(14px, 1.9444vw, 28px);
  line-height: 150%;
  color: var(--color-text-secondary);
  max-width: 1280px;
  text-wrap: pretty;
}

.who-we-are__text strong {
  font-weight: 600;
  color: var(--color-heading);
}

/* =========================================================
   STATS
   Bütün ölçülər .stats-in font-size-ına bağlı em-lərdir,
   ona görə blok bütövlükdə, nisbətləri pozulmadan kiçilir.
   1440-da font-size = 80px → rəqəm 80px, label 32px,
   label offset 216/117/163px, item hündürlüyü 137px.
   ========================================================= */

.stats {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5em; /* minimum ara; real ara space-between ilə hesablanır */
  width: 100%;
  font-size: clamp(34px, 5.5556vw, 80px); /* 1440 → 80px */
}

.stats__item {
  position: relative;
  flex-shrink: 0;
  height: 1.7125em; /* 137px */
}

.stats__number {
  position: absolute;
  left: 0;
  top: 0.4875em; /* 39px */
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 1em; /* 80px */
  line-height: 1.225; /* 98px */
  color: var(--color-nav-active);
  white-space: nowrap;
}

.stats__label {
  position: absolute;
  top: 0;
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 0.4em; /* 32px */
  line-height: 1.21875; /* 39px */
  letter-spacing: 0.01em;
  color: var(--color-text-secondary);
  white-space: nowrap;
}

.stats__item--partners {
  width: 4.4625em; /* 357px */
}
.stats__item--partners .stats__label {
  left: 6.75em; /* 216px (label-in öz font-size-ında) */
}

.stats__item--years {
  width: 3.4em; /* 272px */
}
.stats__item--years .stats__label {
  left: 3.65625em; /* 117px */
}

.stats__item--meetings {
  width: 4.3125em; /* 345px */
}
.stats__item--meetings .stats__label {
  left: 5.09375em; /* 163px */
}

/* =========================================================
   ≤768px — stats sütun şəklində
   ========================================================= */
@media (max-width: 768px) {
  .stats {
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    font-size: 16px; /* em zənciri sıfırlanır */
  }

  .stats__item {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column-reverse; /* label yuxarıda, rəqəm aşağıda */
    align-items: flex-start;
    gap: 4px;
  }

  .stats__number,
  .stats__label {
    position: static;
    left: auto;
    top: auto;
  }

  .stats__number {
    font-size: clamp(40px, 12vw, 56px);
    line-height: 1.1;
  }

  .stats__label {
    font-size: clamp(18px, 5vw, 22px);
    line-height: 1.3;
  }
}

/* =========================================================
   ≤480px
   ========================================================= */
@media (max-width: 480px) {
  .who-we-are {
    padding: 40px 20px 56px;
  }

  .stats {
    gap: 24px;
  }
}
/* =========================================================
   ≤600px — Figma mobil (390px) dizaynı:
   stats 3 bərabər sütunda yan-yana, rəqəm üstdə, label altda
   ========================================================= */
@media (max-width: 600px) {
  .who-we-are {
    padding: 40px 20px 56px;
  }

  .who-we-are__inner {
    gap: 40px;
  }

  .who-we-are__intro {
    gap: 16px;
  }

  .who-we-are__eyebrow {
    font-size: 16px;
    line-height: 20px;
    color: #2386c8;
  }

  .who-we-are__text {
    font-size: 14px;
    line-height: 150%;
  }

  .stats {
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
  }

  .stats__item {
    flex: 1 1 0;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }

  .stats__number {
    font-weight: 600;
    font-size: 28px;
    line-height: 34px;
    color: #2386c8;
  }

  .stats__label {
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0;
    text-align: center;
    color: #4a5565;
  }
}
