/* Первый экран всех трёх сайтов. 05.11.2026. Подключается после ses-header; цвета не меняет.
   Телефон и планшет (до 1024 px) — как на клопах: крошки, заголовок, фото, цена, текст, две кнопки.
   Фото занимает оставшееся место, поэтому две кнопки всегда заканчиваются на первом экране.
   Компьютер: пункты в одну строку (пояснения видны на телефоне), чтобы блок помещался в окно. */

@media (max-width:1023px){
  main :is([data-mobile-first-hero="v1"],#ses-hero){
    --hero-top:118px;
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto minmax(150px,1fr) auto auto auto auto!important;
    align-content:start!important;align-items:start!important;
    min-height:0!important;height:auto!important;padding:12px 16px 32px!important;background-image:none!important
  }
  /* Высота первого экрана: под шапкой до низа окна. Фото растягивается до неё */
  main :is([data-mobile-first-hero="v1"],#ses-hero)::before{content:""!important;display:block!important;position:static!important;inset:auto!important;grid-column:1;grid-row:1/7;width:0;height:calc(100svh - var(--hero-top) - 12px - 14px);background:none!important;pointer-events:none}
  main :is([data-mobile-first-hero="v1"],#ses-hero) :is(.wrap,.owner-hero-grid,.owner-hero-copy,.owner-hero-media),
  main :is([data-mobile-first-hero="v1"],#ses-hero)>.wrap>div:not(.hero-price-card){display:contents!important}
  /* Декоративные заливки и пятна первого экрана рассчитаны на фото во весь экран — на телефоне их нет */
  main :is([data-mobile-first-hero="v1"],#ses-hero)::after,
  main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-media::after,main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-media::before{content:none!important;display:none!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .hero-price-card{display:none!important}

  main :is([data-mobile-first-hero="v1"],#ses-hero) :is(.crumbs,.breadcrumbs){grid-column:1;grid-row:1;margin:0!important;padding:0!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) :is(.crumbs,.breadcrumbs) a{min-height:32px!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) h1{grid-column:1;grid-row:2;margin:6px 0 0!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) picture{grid-column:1;grid-row:3;align-self:stretch!important;position:relative!important;inset:auto!important;display:block!important;width:auto!important;height:auto!important;min-height:0!important;margin:14px 0 0!important;border-radius:20px;overflow:hidden;contain:size}
  main :is([data-mobile-first-hero="v1"],#ses-hero) picture img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:var(--hero-focus,50% 50%)!important;transform:none!important}
  /* Цена — строка под фото, как на клопах */
  main :is([data-mobile-first-hero="v1"],#ses-hero) .hero-price-chip{grid-column:1;grid-row:4;position:static!important;inset:auto!important;display:block!important;margin:14px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .hero-price-chip>span{display:block;font-size:12px!important;font-weight:800!important;line-height:1.3;letter-spacing:.12em!important;text-transform:uppercase}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .hero-price-chip strong{display:block;margin-top:2px;font-size:clamp(30px,8.4vw,40px)!important;font-weight:900!important;line-height:1.05!important;letter-spacing:-.03em;white-space:nowrap}
  main :is([data-mobile-first-hero="v1"],#ses-hero) :is(.lede,.intro){grid-column:1;grid-row:5;margin:10px 0 0!important;max-width:40em;font-size:17px!important;line-height:1.5!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-actions--copy{grid-column:1;grid-row:6;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:18px 0 0!important;max-width:none!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-actions--copy>a{min-height:56px!important;padding:8px 12px!important;font-size:15px!important;line-height:1.25!important;text-align:center;white-space:normal}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledges{grid-column:1;grid-row:7;margin:28px 0 0!important}
  /* Всё остальное в первом экране — после пунктов, чтобы не вклиниться между фото и ценой */
  main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-copy>:not(.crumbs,.breadcrumbs,h1,.lede,.intro,.owner-hero-actions,.pledges){grid-column:1;grid-row:8;margin-top:24px!important}
}
/* Точка фокуса фото, где главное не в центре кадра */
main [data-hero-page="service-ants"]{--hero-focus:76% 62%}
@media (min-width:480px) and (max-width:1023px){main :is([data-mobile-first-hero="v1"],#ses-hero){--hero-top:112px}}
@media (min-width:768px) and (max-width:1023px){
  main :is([data-mobile-first-hero="v1"],#ses-hero){--hero-top:114px;padding:16px 32px 40px!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .owner-hero-actions--copy{max-width:520px!important}
}

/* Нижняя панель «Позвонить / Заявка» появляется только после того, как кнопки первого экрана ушли вверх.
   На 768–900 px она висела сразу и закрывала первый экран */
@media (min-width:768px) and (max-width:900px){
  .sticky,.sticky-bar,.mobile-call{transition:transform .24s ease,opacity .24s ease}
  .sticky:not(.is-active),.sticky-bar:not(.is-active),.mobile-call:not(.is-active){transform:translateY(110%);opacity:0;pointer-events:none}
}

/* Компьютер: пункты в одну строку, как на клопах */
@media (min-width:1024px){
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledge-more{display:none}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledges{margin-top:22px!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledges li{padding-block:9px!important}
}
/* Узкая колонка текста на 1024–1279 px: длинный заголовок шёл в пять строк */
@media (min-width:1024px) and (max-width:1279px){
  main :is([data-mobile-first-hero="v1"],#ses-hero) h1{font-size:clamp(2rem,3.6vw,2.75rem)!important;line-height:1.08!important}
}
/* Невысокое окно (ноутбук, браузер с панелями): заголовок по высоте окна, плотнее отступы */
@media (min-width:1024px) and (max-height:820px){
  main :is([data-mobile-first-hero="v1"],#ses-hero) h1{font-size:clamp(2rem,min(3.4vw,6.4svh),3.25rem)!important;line-height:1.06!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) :is(.lede,.intro){margin-top:12px!important;font-size:1.0625rem!important;line-height:1.5!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledges{margin-top:14px!important}
  main :is([data-mobile-first-hero="v1"],#ses-hero) .pledges li{padding-block:7px!important}
}