/* ============================================================
   About — «Bajor Clinic» (фото со статистикой + панель с текстом)
   Full-bleed секция: контент от края до края (макс. 1920).
   ============================================================ */

.about__inner {
  max-width: var(--container);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;                   /* mobile: стек */
}
@media (min-width: 1000px) {
  .about__inner { grid-template-columns: 670fr 770fr; }
  .about__media, .about__panel { min-height: 640px; }
  .about__panel { padding-inline: var(--space-xl); }
  .about__cta { margin-inline: calc(-1 * var(--space-xl)); }
}

/* ---- Левая часть: фото + статистика ---- */
.about__media {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 360px;
  overflow: hidden;
}
.about__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.about__stats {
  position: relative;
  z-index: 1;
  display: flex;
  gap: var(--space-3xs);                         /* 6px */
}
.about__stat {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-sm);
  min-height: 140px;
  padding: var(--space-md);
  background: rgba(36, 76, 81, .8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  color: var(--c-bg);
}
.about__stat-num {
  font-weight: 600;
  font-size: 2rem;                               /* 32px */
  line-height: 1;
  letter-spacing: -0.02em;
}
.about__stat-label { font-size: var(--fs-base); line-height: 1.3; }

/* ---- Правая часть: панель ---- */
.about__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-2xl);
  padding: var(--space-xl) var(--pad-inline) 0;  /* инлайн-поля как у .container */
  background: var(--c-bg);
  overflow: hidden;
  /* декоративный орнамент-ветка (imgVector) добавим из ассетов темы позже */
}
.about__heading { display: flex; flex-direction: column; gap: var(--space-2xs); color: var(--c-primary); }
.about__title {
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: clamp(2.25rem, 1.8rem + 2vw, 3.375rem);  /* 36 → 54 */
  line-height: 1;
  letter-spacing: -0.02em;
}
.about__subtitle {
  font-weight: 600;
  font-size: var(--fs-lg);                       /* 20px */
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.about__lower { display: flex; flex-direction: column; gap: var(--space-lg); }
.about__text { color: var(--c-primary-soft); font-size: var(--fs-base); line-height: 1.3; }
.about__text p + p { margin-top: var(--space-xs); }

.about__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  height: 80px;
  margin-inline: calc(-1 * var(--pad-inline));   /* на всю ширину панели */
  padding-inline: 1.625rem;                      /* 26px */
  background: var(--c-accent);
  color: var(--c-white);
  font-size: var(--fs-md);                       /* 18px */
  font-weight: 500;
  transition: opacity .2s ease;
}
.about__cta:hover { opacity: .92; }
.about__cta svg { flex-shrink: 0; width: 20px; height: 14px; }

/* ---- Мобилка: плашки-статистика в свайп-слайдер, одинаковой ширины ---- */
.about__stats {
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.about__stats::-webkit-scrollbar { display: none; }
.about__stat { flex: 0 0 60%; scroll-snap-align: start; }

@media (min-width: 1000px) {
  .about__stats { overflow: visible; }
  .about__stat { flex: 1; }
}
