/**

 * Единый фон страницы услуг: секции прозрачны, «блобы» других стилей отключены,

 * без искусственного 100vh на обёртке (иначе — огромные пустоты между блоками).

 * Hero не трогаем.

 *

 * Сцену why360 (.why360__scene / .why360__info) здесь не сжимаем: карточки позиционируются

 * абсолютно под min-height ~760px из why360-block.css; принудительный низкий min-height ломает вёрстку.

 */



/* Вместо service-page: 56px сверху / 8px снизу у каждой секции (давало плотный каскад + 100vh создавал «пропасть») */

body.page--service main.main > section:not(.intro--hero) {

  padding-top: 2.25rem;

  padding-bottom: 2.25rem;

  box-sizing: border-box;

}



body.page--service main.main > section:not(.intro--hero):last-of-type {

  padding-bottom: 3rem;

}



/* Секции без своей плёнки */

body.page--service .usecase,

body.page--service .workflow,

body.page--service .why360,

body.page--service .pricing,

body.page--service section.type.type-variants.variants,

body.page--service section.price,

body.page--service .services,

body.page--service .price {

  background: transparent;

}



/* Локальные «облака» отключены — движение/градиент только на body::after, без стыка между секциями */

body.page--service .usecase::before,

body.page--service .workflow::before,

body.page--service .pricing::before,

body.page--service section.type.type-variants.variants::before {

  content: none;

  display: none;

  animation: none;

}



body.page--service .why360__bg {

  opacity: 0.35;

}



@media (min-width: 900px) {

  body.page--service main.main {

    scroll-snap-type: y proximity;

  }

  body.page--service main.main > section {

    scroll-snap-align: start;

  }

}



/* На десктопе — плотнее по вертикали, чтобы блок укладывался в один экран (вместе со scroll-snap) */

@media (min-width: 1200px) and (min-height: 700px) {

  body.page--service .usecase,

  body.page--service .workflow,

  body.page--service .why360,

  body.page--service .pricing {

    padding: 2.5rem clamp(1rem, 2.2vw, 1.5rem) !important;

  }



  body.page--service .usecase__head,

  body.page--service .workflow__head,

  body.page--service .why360__head,

  body.page--service .pricing__head {

    margin-bottom: clamp(0.75rem, 2svh, 1.5rem);

    gap: 10px;

  }



  body.page--service .usecase__subtitle,

  body.page--service .workflow__subtitle,

  body.page--service .why360__subtitle,

  body.page--service .pricing__subtitle {

    font-size: clamp(0.8rem, 0.9vw, 0.95rem) !important;

  }



  body.page--service .usecase__layout,

  body.page--service .workflow__layout,

  body.page--service .why360__layout,

  body.page--service .pricing__layout {

    gap: clamp(12px, 1.8svh, 20px) !important;

  }



  /* Не трогаем padding у .workflow__step: в workflow-block.css задан большой padding-left под

     абсолютный .workflow__number; общий clamp() ломал вёрстку (заголовок наезжал на номер). */



  body.page--service section.type.type-variants.variants {

    padding: 2.5rem clamp(1rem, 2.2vw, 1.5rem) !important;

  }



  body.page--service .photo-event-gallery {

    padding-top: clamp(1.25rem, 2.4svh, 2.25rem) !important;

    padding-bottom: clamp(1.75rem, 3.2svh, 3rem) !important;

  }



  body.page--service .photo-event-gallery__header {

    margin-bottom: clamp(0.75rem, 2svh, 1.35rem);

  }



  body.page--service .related-services {

    padding: clamp(2rem, 3.8svh, 3.25rem) clamp(1rem, 2.2vw, 1.5rem) !important;

  }



  body.page--service .related-services__head {

    margin-bottom: clamp(1rem, 2.2svh, 2rem);

  }



  body.page--service .related-services-card {

    min-height: min(440px, 52svh);

  }



  body.page--service .platform-branding {

    padding: clamp(2rem, 3.8svh, 3.25rem) clamp(1rem, 2.2vw, 1.5rem) !important;

  }



  body.page--service .platform-branding__visual {

    height: min(58svh, 620px);

  }



  body.page--service .platform-branding__container {

    gap: clamp(28px, 3.5svh, 44px);

  }

}



@media (min-width: 600px) and (max-width: 899px) {

  body.page--service main.main > section:not(.intro--hero) {

    padding-top: 1.75rem;

    padding-bottom: 1.75rem;

  }

}



/* Мобильные заголовки — как у блока «Как проходит съёмка» (workflow) */

@media (max-width: 760px) {

  body.page--service .photo-event-gallery__title,

  body.page--service .related-services__title,

  body.page--service .video-reels-gallery__title,

  body.page--service .platform-branding__content h2,

  body.page--service .usecase__title,

  body.page--service .why360__title,

  body.page--service .pricing__title {

    font-size: clamp(34px, 10vw, 52px);

    line-height: 0.96;

  }



  body.page--service section.type.type-variants.variants .type-variants__title.variants__title.title_h2 {

    font-size: clamp(34px, 10vw, 52px);

    line-height: 0.96;

  }

}


/* CTA как <button> при lb:booking — сброс UA, стили блоков остаются по классу */
body.page--service button.why360__cta,
body.page--service button.related-services-card__btn,
body.page--service button.platform-branding__cta,
body.page--service button.pricing__cta,
body.page--service .intro--hero button.intro__hero-btn {
  font: inherit;
  font-family: inherit;
  text-align: inherit;
  box-sizing: border-box;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}