/* Страница услуги — «2.1 Упаковка» 2004-1333 (1440) и «2.1 Упаковка м» 2004-4342 (375). Числа из макета. */

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

/* Иллюстрация на сером поле: картинка в 1,48 раза шире рамки, по центру (FILL/CROP макета) */
.ill { position: relative; overflow: hidden; background: var(--c-soft); aspect-ratio: 1; }
.ill img { position: absolute; max-width: none; width: 148.5%; height: auto; left: -24.2%; top: 8.3%; }

.ibtn--40 { width: 40px; height: 40px; }
.btn--sm { min-height: 32px; padding: 6px 16px; border-radius: 4px; }
/* «+» ↔ «×» только у своих кнопок (окна и cookies не трогаем) */
.sv-adv__btn .i-close, .sv-faq__ic .i-close { display: none; }
.is-open > .sv-adv__btn .i-close, .is-open .sv-faq__ic .i-close { display: block; }
.is-open > .sv-adv__btn .i-plus, .is-open .sv-faq__ic .i-plus { display: none; }

/* ---------- Первый экран ---------- */
.sv-hero { padding-top: 27px; padding-bottom: 96px; }
.sv-crumbs { display: flex; align-items: center; gap: 16px; }
.sv-crumbs .i { width: 10px; height: 10px; color: var(--c-accent); }
.sv-hero__grid { display: grid; grid-template-columns: 888fr 34fr 438fr; margin-top: 51px; }
.sv-hero__main { grid-column: 1; display: flex; flex-direction: column; }
.sv-hero__body { flex: 1; display: flex; flex-direction: column; align-items: flex-start; margin-top: 34px; padding: 40px 0 0 39.19%; border-top: 1px solid var(--c-line); }
.sv-hero__lead { max-width: 444px; }
.sv-hero__btn { margin-top: auto; }
.sv-hero__ill { grid-column: 3; }

/* ---------- О услуге ---------- */
.sv-about { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding-top: 41px; padding-bottom: 20px; }
.sv-about::after { content: ''; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 1px; background: var(--c-line); }
.sv-about__title { max-width: 389px; font-size: 24px; line-height: 34px; }
.sv-about__text { padding-left: 16px; max-width: 496px; color: #262626; display: flex; flex-direction: column; gap: 22px; }

/* ---------- Раздел с лентой: подпись + стрелки, лента ---------- */
.sv-intro { border-top: 1px solid var(--c-line); padding: 40px 0 48px; }
.sv-intro p { max-width: 452px; color: #262626; }
.sv-arrows { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin-top: 20px; }
.sv-count { display: none; }
.sv-sec [data-dots] { display: none; }

/* Фотогалерея */
.sv-gallery__track { gap: 32px; }
.sv-gallery__item { width: calc((100% - 32px) / 2); aspect-ratio: 664 / 442; overflow: hidden; background: var(--c-line); }
.sv-gallery__item img { width: 100%; height: 100%; object-fit: cover; }

/* Колонки с линиями: первая без левого поля, третья/четвёртая уходят за край на свои 40px поля */
.sv-cols { border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.sv-cols > * { padding-left: 40px; padding-right: 40px; border-left: 1px solid var(--c-line); }
.sv-cols > :first-child { padding-left: 0; border-left: 0; }
.sv-cols--4 > * { width: calc(25% + 20px); }
.sv-cols--4 > :first-child { width: calc(25% - 20px); }
.sv-cols--3 > * { width: calc(33.333% + 26.67px); }
.sv-cols--3 > :first-child { width: calc(33.333% - 13.33px); }

/* Цифры */
.sv-num { height: 383px; display: flex; flex-direction: column; justify-content: space-between; padding-top: 40px; padding-bottom: 72px; }
.sv-num__val { display: flex; align-items: flex-start; gap: 16px; color: var(--c-accent); white-space: nowrap; }
.sv-num__val .t-numtext { padding-top: 4px; }
.sv-num__plus { font-family: var(--f-head); font-weight: 300; font-size: 61px; line-height: 38px; padding-top: 3px; margin-left: 8px; }
.sv-num__text { max-width: 279px; }

/* Преимущества: «+» открывает текст вместо картинки */
.sv-adv__item { height: 399px; display: flex; flex-direction: column; padding-top: 40px; padding-bottom: 40px; }
.sv-adv__title { font-family: var(--f-head); font-weight: 300; font-size: 20px; line-height: 28px; text-transform: uppercase; max-width: 279px; }
.sv-adv__ill { width: 180px; height: 187px; margin: 24px auto 0; overflow: hidden; }
.sv-adv__ill img { width: 100%; height: 100%; object-fit: cover; }
.sv-adv__text { display: none; max-width: 278px; color: #262626; }
.sv-adv__btn { margin-top: auto; align-self: flex-end; }
.sv-adv__item.is-open .sv-adv__title, .sv-adv__item.is-open .sv-adv__ill { display: none; }
.sv-adv__item.is-open .sv-adv__text { display: block; }
.sv-adv__cta { display: flex; justify-content: center; padding-top: 49px; }

/* Проекты */
.sv-case { display: flex; flex-direction: column; align-items: flex-start; padding-top: 41px; padding-bottom: 48px; }
.sv-case__img { width: 100%; aspect-ratio: 400 / 266; overflow: hidden; background: var(--c-line); }
.sv-case__img img { width: 100%; height: 100%; object-fit: cover; }
.sv-case__title { margin: 48px 0 40px; font-family: var(--f-head); font-weight: 300; font-size: 20px; line-height: 28px; text-transform: uppercase; max-width: 340px; }
.sv-case .btn { margin-top: auto; }

/* Частые вопросы */
.sv-faq__item { border-top: 1px solid var(--c-line); }
.sv-faq__item:last-child { border-bottom: 1px solid var(--c-line); }
.sv-faq__head { width: 100%; display: grid; grid-template-columns: 25.59% 1fr 40px; align-items: start; padding: 48px 0 49px; text-align: left; }
.sv-faq__num { color: var(--c-accent); padding-top: 8px; }
.sv-faq__q { font-family: var(--f-head); font-weight: 300; font-size: 28px; line-height: 36px; text-transform: uppercase; max-width: 664px; transition: color .2s; }
@media (hover: hover) { .sv-faq__head:hover .sv-faq__q { color: var(--c-accent); } }
.sv-faq__a { margin-left: 25.59%; max-width: 664px; padding-bottom: 48px; color: #262626; }

/* ---------- Обратная связь (как на главной) ---------- */
.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) {
  .sv-hero__title.t-h72 { font-size: 60px; line-height: 74px; }
  .sv-cols > * { padding-left: 24px; padding-right: 24px; }
  .sv-cols > :first-child { padding-left: 0; }
  .sv-cols--4 > * { width: calc(25% + 12px); }
  .sv-cols--4 > :first-child { width: calc(25% - 12px); }
  .sv-cols--3 > * { width: calc(33.333% + 16px); }
  .sv-cols--3 > :first-child { width: calc(33.333% - 8px); }
  .sv-num .t-num { font-size: 72px; line-height: 80px; }
  .sv-num__val .t-numtext { font-size: 22px; line-height: 30px; }
}

/* ---------- Мобильная ---------- */
@media (max-width: 1023px) {
  .sv-hero { padding-top: 26px; padding-bottom: 0; }
  .sv-hero__grid { display: block; margin-top: 44px; }
  .sv-hero__title.t-h72 { font-size: 32px; line-height: 40px; }
  .sv-hero__body { margin: 50px 0 0; padding: 0; border: 0; }
  .sv-hero__lead { max-width: 360px; }
  .sv-hero__btn { display: none; }
  .sv-hero__ill { margin: 64px calc(-1 * var(--gutter)) 0; }

  .sv-about { display: block; padding-top: 64px; padding-bottom: 0; }
  .sv-about::after, .sv-about__title { display: none; }
  .sv-about__text { padding: 0; max-width: 480px; }

  .sv-sec .sec-head, .fb .sec-head { padding: 96px var(--gutter) 48px; }
  .sv-sec [data-slider] { padding: 0; display: flex; flex-direction: column; }
  .sv-intro { display: contents; }
  .sv-intro p { order: 1; padding: 0 var(--gutter) 64px; }
  .sv-arrows { display: none; }
  .sv-sec .js-track { order: 2; }
  .sv-sec [data-dots] { order: 3; display: flex; margin-top: 16px; }

  /* фотогалерея: квадрат на всю ширину, стрелки и счётчик под ним */
  .sv-gallery__track { gap: 0; }
  .sv-gallery__item { width: 100%; aspect-ratio: 1; max-height: 600px; }
  .sv-gallery .sv-arrows { order: 3; display: flex; justify-content: space-between; margin: 32px var(--gutter) 0; }
  .sv-gallery .ibtn--48 { width: 40px; height: 40px; }
  .sv-count { display: flex; align-items: center; gap: 12px; color: var(--c-text); }
  .sv-count i { width: 32px; height: 1px; background: var(--c-accent); }

  .sv-cols { border-top: 0; border-bottom: 0; }
  .sv-cols > *, .sv-cols > :first-child, .sv-cols--4 > *, .sv-cols--3 > *, .sv-cols--4 > :first-child, .sv-cols--3 > :first-child { width: 100%; border-left: 0; padding-left: var(--gutter); padding-right: var(--gutter); }

  .sv-num { height: 291px; padding-top: 40px; padding-bottom: 48px; border-top: 1px solid var(--c-line) !important; border-bottom: 1px solid var(--c-line); }
  .sv-num__plus { font-size: 54px; }

  .sv-adv__item { height: 405px; padding-top: 32px; padding-bottom: 24px; border-top: 1px solid var(--c-line) !important; border-bottom: 1px solid var(--c-line); }
  .sv-adv__title { font-size: 24px; line-height: 32px; max-width: 280px; }
  .sv-adv__ill { width: calc(100% + 2 * var(--gutter) - 6px); max-width: 420px; height: auto; aspect-ratio: 368 / 207; margin: 38px 0 0 calc(3px - var(--gutter)); }
  .sv-adv__text { max-width: 420px; }
  .sv-adv__btn { width: 28px; height: 28px; }
  .sv-adv__cta { display: none; }

  .sv-case { padding: 0 0 40px !important; border-bottom: 1px solid var(--c-line); }
  .sv-case__img { aspect-ratio: 375 / 249; max-height: 420px; }
  .sv-case__title { margin: 40px var(--gutter); }
  .sv-case .btn { margin: 0 var(--gutter); }

  .sv-faq__list { padding: 0; }
  .sv-faq__head { grid-template-columns: 1fr 24px; gap: 16px; padding: 24px var(--gutter); }
  .sv-faq__num { display: none; }
  .sv-faq__q { font-size: 20px; line-height: 28px; }
  .sv-faq__q br { display: none; }
  .sv-faq__ic { width: 24px; height: 24px; margin-top: 2px; }
  .sv-faq__a { margin: 0; padding: 40px var(--gutter) 48px; }

  .fb { padding-bottom: 96px; }
  .fb__intro p { padding: 0 0 64px; border: 0; }
  .fb__box { display: block; padding: 0; }
  .fb__photo { display: none; }
}