/* st-examples.css v1 — «Примеры выполненных работ» (.examples_main_wrapper).
   Только стили. Подключать после adaptiv.css. Ширины слайдов (slick) и иконки шаблона не трогаем. */

#content .examples_main_wrapper{--ex-ink:#2D3440;--ex-mut:#4A5260;--ex-line:#E3E3E3;--ex-or:#FD8900;--ex-cream:#FFF7EC;--ex-cream-line:#F0DEC6}

/* v4: фон секции (на мобильной шаблон даёт серо-голубую подложку на весь блок, вместе с абзацем под слайдером) */
#content .examples_main_wrapper,
#content .examples_main_wrapper .examples_main_slider,
#content .examples_main_wrapper .slick-list,
#content .examples_main_wrapper .slick-track{background:transparent!important;background-image:none!important;box-shadow:none!important}

/* равная высота карточек */
#content .examples_main_wrapper .slick-track{display:flex!important}
#content .examples_main_wrapper .slick-list{height:auto!important}

/* карточка (класс .slick-slide стоит на самой .examples_main_slider_item) */
#content .examples_main_wrapper .examples_main_slider_item{
  box-sizing:border-box;display:flex!important;flex-direction:column;height:auto!important;
  background:#fff!important;border:1px solid var(--ex-line)!important;border-radius:16px!important;overflow:hidden;
  box-shadow:none!important;transition:border-color .2s ease,box-shadow .2s ease;
}
@media (hover:hover){
  #content .examples_main_wrapper .examples_main_slider_item:hover{border-color:var(--ex-cream-line)!important;box-shadow:0 10px 28px rgba(45,52,64,.10)!important}
  #content .examples_main_wrapper .examples_main_slider_item:hover .examples_main_slider_item_img{transform:scale(1.04)}
}

/* фото: единая пропорция, zoom внутри рамки */
#content .examples_main_wrapper .examples_main_slider_item_img{
  display:block;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;
  aspect-ratio:3/2;background-size:cover!important;background-position:50% 50%!important;background-repeat:no-repeat!important;
  border-radius:0!important;transition:transform .5s ease;
}
/* фото в обёртке, чтобы zoom не вылезал: обрезает сама карточка (overflow:hidden) */

/* общие боковые отступы контента карточки */
#content .examples_main_wrapper .examples_main_slider_item_title,
#content .examples_main_wrapper .examples_main_slider_item_img_info,
#content .examples_main_wrapper .examples_main_slider_item_price,
#content .examples_main_wrapper .examples_main_slider_item_btns_wrapper{
  box-sizing:border-box;width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important;
  padding-left:20px!important;padding-right:20px!important;
}

/* заголовок */
#content .examples_main_wrapper .examples_main_slider_item_title{
  display:block;margin-top:0!important;margin-bottom:0!important;padding-top:18px!important;
  color:var(--ex-ink)!important;font-size:18px!important;font-weight:800!important;line-height:1.3!important;text-decoration:none!important;
}
@media (hover:hover){#content .examples_main_wrapper .examples_main_slider_item_title:hover{color:var(--ex-or)!important}}

/* параметры (иконки — из шаблона, не трогаем) */
#content .examples_main_wrapper .examples_main_slider_item_img_info{margin-top:auto!important;margin-bottom:0!important;padding-top:14px!important;padding-bottom:0!important;min-height:0!important;height:auto!important}
#content .examples_main_wrapper .examples_main_slider_item_img_info>div{color:var(--ex-mut)!important;font-size:15px!important;font-weight:600!important}

/* цена */
#content .examples_main_wrapper .examples_main_slider_item_price{
  margin-top:0!important;margin-bottom:0!important;padding-top:12px!important;padding-bottom:0!important;min-height:0!important;height:auto!important;color:var(--ex-or)!important;font-size:21px!important;font-weight:800!important;line-height:1.2!important;
}

/* кнопки внизу карточки */
#content .examples_main_wrapper .examples_main_slider_item_btns_wrapper{
  display:flex!important;align-items:stretch;gap:10px;margin-top:0!important;margin-bottom:0!important;padding-top:18px!important;padding-bottom:20px!important;
}
#content .examples_main_wrapper .examples_main_slider_item_btn_want{
  flex:1 1 auto;display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;min-height:48px;height:auto!important;margin:0!important;
  border:0!important;border-radius:12px!important;color:#fff!important;font-size:16px!important;font-weight:800!important;text-decoration:none!important;
  background-image:linear-gradient(90deg,#FE5248,#FD8507)!important;background-color:#FD8507!important;
  box-shadow:0 6px 16px rgba(253,133,7,.28)!important;transition:filter .2s ease,transform .2s ease;
}
#content .examples_main_wrapper .examples_main_slider_item_btn_calc{
  display:flex!important;align-items:center;justify-content:center;
  flex:0 0 48px;box-sizing:border-box;width:48px!important;min-height:48px;height:auto!important;margin:0!important;padding:0!important;
  border:1px solid var(--ex-cream-line)!important;border-radius:12px!important;background-color:var(--ex-cream)!important;background-position:50% 50%!important;background-repeat:no-repeat!important;box-shadow:none!important;
  transition:background-color .2s ease,border-color .2s ease;
}
/* иконка калькулятора — ::before шаблона (22×22, inline-block): центрируем flex-ом кнопки */
#content .examples_main_wrapper .examples_main_slider_item_btn_calc::before{flex:0 0 auto;margin:0!important;top:0!important;left:0!important;vertical-align:middle}
@media (hover:hover){
  #content .examples_main_wrapper .examples_main_slider_item_btn_want:hover{filter:brightness(1.05);transform:translateY(-1px)}
  #content .examples_main_wrapper .examples_main_slider_item_btn_calc:hover{background-color:#FFEBD0!important;border-color:var(--ex-or)!important}
}
#content .examples_main_wrapper .examples_main_slider_item_btn_want:focus-visible,
#content .examples_main_wrapper .examples_main_slider_item_btn_calc:focus-visible,
#content .examples_main_wrapper .examples_main_slider_item_title:focus-visible{outline:3px solid var(--ex-ink);outline-offset:2px}

@media (max-width:560px){
  #content .examples_main_wrapper .examples_main_slider_item_img{aspect-ratio:16/10}
  #content .examples_main_wrapper .examples_main_slider_item_title{font-size:17px!important}
  #content .examples_main_wrapper .examples_main_slider_item_price{font-size:20px!important}
}
@media (prefers-reduced-motion:reduce){#content .examples_main_wrapper *{transition:none!important}}