/* Перенос design/picnic/ui_kits/site/site.css; поправки телефона: minmax(0,1fr) вместо 1fr (иначе контент карточек
   распирает колонку шире экрана) и узкий зазор в шапке. */
/* Лендинг: две раскладки — компьютер (от 1024 px) и телефон (до 1023 px). Промежуточных нет. */
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:80px}
body{padding-bottom:0!important}
.site-wrap{max-width:1440px!important;padding-left:48px!important;padding-right:48px!important}
/* Большие мониторы: макет тот же, но крупнее — не узкая колонка посреди экрана. */
@media (min-width: 1720px){ body{zoom:1.15} }
@media (min-width: 2100px){ body{zoom:1.3} }
@media (min-width: 2600px){ body{zoom:1.5} }
.site-burger{display:none}
@media (max-width: 1023px){
  .site-wrap{padding-left:20px!important;padding-right:20px!important}
  .site-nav,.site-login{display:none!important}
  .site-burger{display:inline-flex}
  .site-head{gap:12px!important}
  .site-steps{grid-template-columns:minmax(0,1fr)!important}
  .site-demo{grid-template-columns:minmax(0,1fr)!important}
  .site-sec{grid-template-columns:minmax(0,1fr)!important}
  .site-cta-card{padding:32px 24px!important}
}
@media (min-width: 1024px) and (max-width: 1200px){ .site-sec{grid-template-columns:repeat(2,minmax(0,1fr))!important} }
/* Телефон в демо: высота по экрану, а не 720 px — на ноутбуке он не помещался под шапкой.
   Экран, который не влез, прокручивается внутри телефона. */
.site-phone{height:clamp(540px, calc(100vh - 170px), 720px)}
.site-phone-scroll{scrollbar-width:none}
.site-phone-scroll::-webkit-scrollbar{display:none}
@media (min-width: 1024px){ .site-phone-wrap{position:sticky;top:84px;align-self:start} }