/** Сторінка «Про компанію» — макет MacBook Pro - 7 (1728×3021). Контент 1425px. */

.page--pro-nas { position: relative; z-index: 0; }
.page--pro-nas .container { width: min(1425px, 100% - var(--pad) * 2); }

/* Два великі фонові фото з макета: верхнє (до 1193) і за картками (з 1128) */
.about-bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.about-bg > div { position: absolute; left: 0; right: 0; }
.about-bg img { width: 100%; height: 100%; object-fit: cover; }
/* Точні розміри й зсув фото з макета: 2157×1438 при x=-99, y=-245 */
.about-bg__top { top: -245px; left: -99px; right: auto; width: max(2157px, calc(100% + 99px)); height: 1438px; }
.about-bg__mid { top: 1128px; left: 0; right: 0; width: auto; height: 2100px; }
.about-bg__mid img { object-position: center bottom; }
/* Накладки з макета: суцільне затемнення 0.65 + розтяжки #1D1D1D по краях */
.about-bg__top::after,
.about-bg__mid::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
}
.about-hero { padding-top: 340px; }
.about-hero .page-hero__media { display: none; }

.about-hero__title {
  max-width: 1023px;
  font-weight: 100;
  font-size: var(--fs-h1);
  line-height: 104.5px;
  text-transform: uppercase;
}
.about-hero__title .accent {
  font-weight: 300;
  color: var(--accent);
}

.about-body { position: relative; padding-top: 308px; }

.about-lead { max-width: 684px; }

.about-lead__title {
  color: var(--accent);
  font-weight: 300;
  font-size: var(--fs-h3);
  line-height: 35px;
  text-transform: uppercase;
}

.about-lead__text {
  margin-top: 30px;
  font-weight: 100;
  font-size: 30px;
  line-height: 36px;
}

/* Розкидані картки: 3 колонки × 3 ряди, як у макеті */
.about-cards {
  display: grid;
  grid-template-columns: repeat(3, 458px);
  gap: 22px 24px;
  margin-top: -218px;
}

.about-card {
  display: grid;
  grid-template-rows: auto 1fr;
  height: 458px;
  padding: 45px;
  background: rgba(29, 29, 29, 0.01);
  border: 2.49px solid rgba(184, 115, 51, 0.65);
  border-radius: var(--r);
  backdrop-filter: blur(35.7px);
  -webkit-backdrop-filter: blur(35.7px);
}

.about-card__title {
  font-weight: 300;
  font-size: var(--fs-lg);
  line-height: 18px;
  text-transform: uppercase;
}

.about-card__text {
  align-self: end;
  max-width: 368px;
  font-weight: 100;
  font-size: var(--fs-lg);
  line-height: 32.5px;
}

.about-card--1 { grid-column: 3; grid-row: 1; }
.about-card--2 { grid-column: 2; grid-row: 2; }
.about-card--3 { grid-column: 3; grid-row: 2; }
.about-card--4 { grid-column: 1; grid-row: 3; }
.about-card--5 { grid-column: 3; grid-row: 3; }

.page--pro-nas .page-outro { padding-top: 298px; padding-bottom: 242px; }


/* ---------------------------------------------------------------------
   Затемнювальні шари сторінки «Про компанію» — 1:1 з Figma (MacBook Pro - 7).
   Чотири розтяжки #1D1D1D і дві розмиті смуги #22160B на стику двох фото.
   --------------------------------------------------------------------- */
.veils--about .veil--1,
.veils--about .veil--2,
.veils--about .veil--3,
.veils--about .veil--4 { display: none; }  /* у макеті ці розтяжки лежать ПІД фото */

/* Три розмиті смуги #22160B на стику двох фото — єдине, що лежить зверху */
.veils--about .veil--5 { left: -203px; top: 1061px; width: max(2639px, calc(100% + 203px)); height: 264px;
  background: #22160B; filter: blur(132px); }
.veils--about .veil--6 { left: -272px; top: 1105px; width: max(2271px, calc(100% + 272px)); height: 82px;
  background: #22160B; filter: blur(132px); }
.veils--about .veil--7 { left: -245px; top: 1070px; width: max(2126px, calc(100% + 245px)); height: 327px;
  background: #22160B; filter: blur(132px); }