/* =============================================
   Страница «О компании»
   ============================================= */

/* ──────────────────────────────────────────────
   Общий лейаут страницы
────────────────────────────────────────────── */
.main__content.about-page {
  display: flex;
  flex-direction: column;
  gap: 120px;
  padding: 120px 0;
}

/* ──────────────────────────────────────────────
   1. Интро
────────────────────────────────────────────── */
.page-intro--about .page-intro__content {
  text-align: left;
  align-items: flex-start;
}

.page-intro--about h1,
.page-intro--about p {
  color: var(--primary-dark);
}

@media (max-width: 768px) {
  .main__content.about-page {
    gap: 80px;
    padding: 80px 0;
  }
}

/* ──────────────────────────────────────────────
   2. О компании
────────────────────────────────────────────── */
.about-company__inner {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.about-company__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.about-company__left {
  width: 100%;
}

.about-company__text {
  margin-top: 20px;
}

.about-company__right {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

/* ── Карточки — desktop: 2×2 grid ── */
.about-company__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.about-company__card {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  padding: 0px 20px;
  height: 140px;
  background: var(--primary-dark);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.about-company__card-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.about-company__number {
  color: var(--background);
  font-family: var(--font-heading);
}

.about-company__label {
  color: var(--background);
}

.about-company__card-title {
  color: var(--background);
}

.about-company__card-text {
  color: var(--background);
}

.about-company__card-img {
  position: absolute;
  bottom: 10px;
  right: 10px;
  height: 66px;
  width: auto;
  pointer-events: none;
}

/* ── Планшет / мобайл — snap scroll ── */
@media (max-width: 1080px) {
  .about-company__inner {
    gap: 40px;
  }

  .about-company__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .about-company__left {
    flex: unset;
    max-width: 100%;
  }

  .about-company__right {
    width: calc(100%);
  }

  .about-company__cards {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 20px;
  }

  .about-company__cards::-webkit-scrollbar {
    display: none;
  }

  .about-company__card {
    width: 200px;
    scroll-snap-align: start;
    min-height: 128px;
    justify-content: flex-start;
    padding: 10px;
    flex-shrink: 0;
    border-radius: 4px;
  }

  .about-company__card-img {
    height: 33px;
  }
  
  .about-company .section-group {
    text-align: center;
  }
}

@media (max-width: 768px) {
  .about-company__right {
    width: calc(100% );
  }

  .about-company__card {
    width: 147px;
    scroll-snap-align: start;
    min-height: 128px;
    justify-content: flex-start;
    padding: 10px;
    flex-shrink: 0;
    border-radius: 4px;
  }
}

/* ──────────────────────────────────────────────
   3. Аккредитованная лаборатория
────────────────────────────────────────────── */
.about-lab__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: center;
}

.about-lab__inner {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.about-lab__img img {
  width: calc(100% + ((100vw - 1200px) / 2));
  margin-left: calc((100vw - 1200px) / 2 * -1);
  height: 273px;
  object-fit: cover;
}

.about-lab__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-lab__content .text-l {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media (max-width: 1280px) {
  .about-lab__img img {
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 768px) {
  .about-lab__inner {
    gap: 40px;
  }

  .about-lab__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .about-lab__inner h2 {
    text-align: center;
  }
}

/* ──────────────────────────────────────────────
   6. Партнёры
────────────────────────────────────────────── */
.about-partners__inner {
  margin-bottom: 40px;
}

.about-partners__inner .section-badge {
  margin-bottom: 40px;
}

/* ──────────────────────────────────────────────
   7. Отзывы (галерея писем)
────────────────────────────────────────────── */
.about-reviews .section-group {
  margin-bottom: 40px;
}

.about-reviews .section-badge {
  margin-bottom: 40px;
}

.about-reviews .project-gallery__item {
  aspect-ratio: 3 / 4;
}
