/* v103 — точечная коррекция первого блока после v102.
   Не меняет фотографии, тексты, этапы, видео и админку. */

.sp-v102-hero{
  overflow-x:hidden!important;
}

/* Возвращаем блоку нормальный центральный контейнер.
   v102 снимал max-width у сетки, из-за чего она растягивалась за экран. */
.sp-v102-hero .sp-v102-hero-grid{
  width:min(1480px,calc(100% - clamp(40px,7vw,120px)))!important;
  max-width:1480px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  gap:clamp(42px,4.4vw,72px)!important;
}

/* Квартира: текст слева, фотография справа. */
.sp-v102-hero--apartment-renovation .sp-v102-hero-grid{
  grid-template-columns:minmax(360px,.84fr) minmax(0,1.16fr)!important;
}

/* Дом: фотография слева, текст справа — с теми же пропорциями. */
.sp-v102-hero--house-finishing .sp-v102-hero-grid{
  grid-template-columns:minmax(0,1.16fr) minmax(360px,.84fr)!important;
}

.sp-v102-hero .sp-v102-hero-copy{
  min-width:0!important;
  max-width:100%!important;
}

.sp-v102-hero .sp-v102-hero-media{
  min-width:0!important;
  max-width:110%!important;
  width:111%!important;
  overflow:hidden!important;
}

/* Фото занимает всю свою колонку, но не весь экран. */
.sp-v102-hero .sp-v102-hero-media img,
.sp-v102-hero .sp-v102-hero-media picture img{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:clamp(500px,38vw,650px)!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Стрелки остаются внутри изображения. */
.sp-v102-hero .sp-v102-hero-media .v97-hero-arrow.is-prev{
  left:18px!important;
}
.sp-v102-hero .sp-v102-hero-media .v97-hero-arrow.is-next{
  right:18px!important;
}

@media(max-width:1200px){
  .sp-v102-hero .sp-v102-hero-grid{
    width:min(1120px,calc(100% - 48px))!important;
    gap:36px!important;
  }
  .sp-v102-hero--apartment-renovation .sp-v102-hero-grid,
  .sp-v102-hero--house-finishing .sp-v102-hero-grid{
    grid-template-columns:minmax(320px,.88fr) minmax(0,1.12fr)!important;
  }
  .sp-v102-hero--house-finishing .sp-v102-hero-grid{
    grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr)!important;
  }
  .sp-v102-hero .sp-v102-hero-media img,
  .sp-v102-hero .sp-v102-hero-media picture img{
    height:clamp(460px,44vw,590px)!important;
  }
}

@media(max-width:1000px){
  .sp-v102-hero .sp-v102-hero-grid,
  .sp-v102-hero--apartment-renovation .sp-v102-hero-grid,
  .sp-v102-hero--house-finishing .sp-v102-hero-grid{
    width:min(760px,calc(100% - 32px))!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  .sp-v102-hero .sp-v102-hero-media img,
  .sp-v102-hero .sp-v102-hero-media picture img{
    height:clamp(390px,72vw,580px)!important;
  }
}

@media(max-width:640px){
  .sp-v102-hero .sp-v102-hero-grid,
  .sp-v102-hero--apartment-renovation .sp-v102-hero-grid,
  .sp-v102-hero--house-finishing .sp-v102-hero-grid{
    width:calc(100% - 24px)!important;
  }
  .sp-v102-hero .sp-v102-hero-media img,
  .sp-v102-hero .sp-v102-hero-media picture img{
    height:clamp(320px,105vw,500px)!important;
  }
  .sp-v102-hero .sp-v102-hero-media .v97-hero-arrow.is-prev{left:10px!important}
  .sp-v102-hero .sp-v102-hero-media .v97-hero-arrow.is-next{right:10px!important}
}