/* Услуги — фреймы «Услуги» 2042-3049 (1440) и «Услуги м» 2042-3153 (375). Числа из макета. */

/* ---------- Заголовок страницы: H72 слева, подпись в правой колонке, по низу ---------- */
.us-head { display: grid; grid-template-columns: 664fr 148fr 548fr; align-items: end; padding-top: 88px; padding-bottom: 80px; }
.us-head__title { grid-column: 1; }
.us-head__lead { grid-column: 3; max-width: 430px; padding-bottom: 6px; }

/* ---------- Список услуг: линия — 48 — услуга — 48 — линия ---------- */
.us-item { display: grid; grid-template-columns: 664fr 148fr 548fr; padding: 48px 0; border-top: 1px solid var(--c-line); scroll-margin-top: 24px; }
.us-item:last-child { border-bottom: 1px solid var(--c-line); }
.us-item__media { grid-column: 1; display: grid; grid-template-columns: 258fr 32fr 374fr; }
.us-item__ph1, .us-item__ph2 { grid-column: 1; overflow: hidden; background: var(--c-line); }
.us-item__ph1 { grid-row: 1; aspect-ratio: 258 / 171; position: relative; }
.us-item__ph1::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.08)); }
.us-item__ph2 { grid-row: 2; align-self: end; justify-self: end; width: 66.28%; aspect-ratio: 1; }
.us-item__ill { grid-column: 3; grid-row: 1 / 3; aspect-ratio: 1; background: var(--c-soft); overflow: hidden; }
.us-item__media figure { position: relative; }
/* Кадрирование как в макете: картинка крупнее рамки и сдвинута (FILL/CROP со смещением) */
.us-item__media img { position: absolute; max-width: none; height: auto; width: var(--w); left: var(--x); top: var(--y); }
.us-item__ph1 img { --w: 115.1%; --x: -8.9%; --y: -10.5%; }
.us-item__ph2 img { --w: 171.9%; --x: -54.4%; --y: -5.8%; }
.us-item__ill img { --w: 148.5%; --x: -24.2%; --y: 8.3%; }
.us-item__text { grid-column: 3; display: flex; flex-direction: column; align-items: flex-start; color: var(--c-accent); }
.us-item__title { margin-top: 24px; }
.us-item__desc { margin-top: 40px; max-width: 464px; color: var(--c-text); }
.us-item__more { margin-top: auto; }

/* ---------- Обратная связь (как на главной) ---------- */
.fb { padding-bottom: 140px; }
.fb__intro p { border-top: 1px solid var(--c-line); padding: 28px calc(50% - 16px - 453px) 96px calc(50% + 16px); }
.fb__box { display: grid; grid-template-columns: 664fr 696fr; }
.fb__photo { overflow: hidden; background: #e9e9e9; }
.fb__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.fb__box .cform { border-left: 0; }

@media (min-width: 1024px) and (max-width: 1279px) {
  .us-item__media { grid-template-columns: 258fr 24fr 374fr; }
  .us-item__desc { margin-top: 24px; }
  .us-item__more { margin-top: 24px; }
}

/* ---------- Мобильная ---------- */
@media (max-width: 1023px) {
  .us-head { display: flex; flex-direction: column; align-items: flex-start; gap: 48px; padding-top: 32px; padding-bottom: 40px; }
  .us-head__lead { padding-bottom: 0; max-width: 327px; }

  .us-list { padding: 0; }
  .us-item { display: flex; flex-direction: column; padding: 24px var(--gutter) 32px; }
  .us-item:last-child { border-bottom: 0; padding-bottom: 0; }
  .us-item__media { order: 2; display: block; margin-top: 32px; }
  .us-item__ph1, .us-item__ph2, .us-item__count { display: none; }
  .us-item__ill { width: 100%; max-width: 480px; }
  .us-item__text { display: contents; }
  .us-item__title { order: 1; margin: 0; font-size: 28px; line-height: 38px; }
  .us-item__desc { order: 3; margin-top: 32px; max-width: 480px; }
  .us-item__more { order: 4; margin-top: 48px; width: 100%; max-width: 480px; }

  .fb { padding-bottom: 96px; }
  .fb .sec-head { padding: 96px var(--gutter) 48px; }
  .fb__intro p { padding: 0 0 64px; border: 0; }
  .fb__box { display: block; padding: 0; }
  .fb__photo { display: none; }
}

@media (min-width: 1024px) { .us-m { display: none; } }
@media (max-width: 1023px) { .us-d { display: none; } }
