/* st-portfolio-detail v1 — карточка работы портфолио. Только стили. */
#content{--pd-slate:#2D3440;--pd-or:#FD8900;--pd-br:#E3E3E3;--pd-mut:#4A5260;--pd-grad:linear-gradient(90deg,#FE5248,#FD8507)}
#content .portfolio_detail{margin:0 0 40px}
#content .portfolio_detail .detail_wrap{display:grid!important;grid-template-columns:1.2fr 1fr;gap:0;background:#fff;border:1px solid var(--pd-br);border-radius:20px;overflow:hidden;box-shadow:0 8px 28px rgba(45,52,64,.08);margin:0 0 40px}
#content .portfolio_detail .detail-img__wrap{position:relative;float:none!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;min-height:340px;background:#f2f3f5}
#content .portfolio_detail .detail-img__wrap img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;display:block}
#content .portfolio_detail .detail-img__wrap>a.portfolio-item-gallery_btn{position:absolute!important;right:16px;bottom:16px;left:auto;top:auto;width:44px;height:44px;border-radius:50%;background-color:rgba(45,52,64,.78);transition:background-color .2s}
#content .portfolio_detail .detail-img__wrap>a.portfolio-item-gallery_btn:hover{background-color:var(--pd-or)}
#content .portfolio_detail .detail-info__wrap{float:none!important;width:auto!important;max-width:none!important;margin:0!important;padding:32px 32px 28px!important;display:flex;flex-direction:column;box-sizing:border-box}
#content .portfolio_detail .portfolio-detail-props{margin:0 0 24px;padding:0}
#content .portfolio_detail .portfolio-detail_prop-row{display:flex!important;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;margin:0!important;border-bottom:1px dashed var(--pd-br);font-size:16px;line-height:1.35}
#content .portfolio_detail .portfolio-detail_prop-row:first-child{padding-top:0}
#content .portfolio_detail .portfolio-detail_prop-row:last-child{border-bottom:0}
#content .portfolio_detail .portfolio-detail_prop-row .prop_name{float:none!important;width:auto!important;color:#6B7380;font-weight:400}
#content .portfolio_detail .portfolio-detail_prop-row .prop_value{float:none!important;width:auto!important;text-align:right;color:var(--pd-slate);font-weight:700}
#content .portfolio_detail .portfolio-detail_prop-row.att_price .prop_value{font-size:22px;font-weight:800;color:var(--pd-or)}
#content .portfolio_detail .portfolio-detail-btn__wrap{margin:0 0 20px}
#content .portfolio_detail .portfolio-detail-btn__wrap .button{display:block!important;width:100%!important;box-sizing:border-box;text-align:center;padding:16px 24px!important;border:0!important;border-radius:12px!important;background:var(--pd-grad)!important;color:#fff!important;font-size:16px;font-weight:700;box-shadow:0 6px 16px rgba(254,82,72,.28);transition:transform .2s,box-shadow .2s}
#content .portfolio_detail .portfolio-detail-btn__wrap .button:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(254,82,72,.36)}
#content .portfolio_detail .portfolio-detail-share{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--pd-br)}
#content .portfolio_detail .portfolio-detail-share .title{margin:0;font-size:14px;color:#6B7380}
#content .portfolio_detail .portfolio-detail-share .share_list{display:flex;gap:8px}
#content .portfolio_detail .portfolio-detail-share .share_icon{display:inline-block;border-radius:50%;transition:transform .2s,opacity .2s}
#content .portfolio_detail .portfolio-detail-share .share_icon:hover{transform:translateY(-2px);opacity:.85}

/* заголовок фотоотчёта */
#content .portfolio_detail>.content-block{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 20px!important}
#content .portfolio_detail>.content-block .page_title{margin:0!important;font-size:28px;font-weight:800;color:var(--pd-slate);position:relative;padding-bottom:12px}
#content .portfolio_detail>.content-block .page_title::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:4px;border-radius:2px;background:var(--pd-grad)}
#content .portfolio_detail .page_subtitle{display:inline-block;padding:4px 12px;border-radius:999px;background:#FFF7EC;border:1px solid #F0DEC6;color:var(--pd-slate);font-size:14px;font-weight:600}

/* галерея */
#content .photo-gallery_wrap{margin:0 0 40px}
#content .photo-gallery-slider{position:relative}
#content .photo-gallery-item{padding:0 10px;box-sizing:border-box}
#content .photo-gallery-item>a{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:4/3;background:#f2f3f5;box-shadow:0 4px 14px rgba(45,52,64,.1)}
#content .photo-gallery-item img{width:100%!important;height:100%!important;object-fit:cover;display:block;transition:transform .4s}
#content .photo-gallery-item .portfolio-item-gallery_btn{position:absolute;inset:0;width:auto;height:auto;border-radius:0;background-color:transparent;transition:background-color .25s}
@media (hover:hover){
#content .photo-gallery-item>a:hover img{transform:scale(1.06)}
#content .photo-gallery-item>a:hover .portfolio-item-gallery_btn{background-color:rgba(45,52,64,.25)}}
#content .photo-gallery-slider .last_work_arrow{background-color:#fff;border-radius:50%;box-shadow:0 4px 14px rgba(45,52,64,.2);z-index:3}

/* таблица данных */
#content .portfolio_detail>table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--pd-br);border-radius:16px;overflow:hidden;margin:0 0 40px;background:#fff}
#content .portfolio_detail>table td{padding:14px 20px!important;border:0!important;border-bottom:1px solid var(--pd-br)!important;font-size:16px;color:var(--pd-mut);vertical-align:middle}
#content .portfolio_detail>table tr:last-child td{border-bottom:0!important}
#content .portfolio_detail>table tr:nth-child(even) td{background:#FAFAFB}
#content .portfolio_detail>table td:first-child{width:60%}
#content .portfolio_detail>table td:last-child{text-align:right;font-weight:700;color:var(--pd-slate);white-space:nowrap}

/* похожие ремонты */
#content .portfolio_detail_works{margin:0 0 40px}
#content .portfolio_detail_works .title_flex_wrap{margin:0 0 20px}
#content .portfolio_detail_works .title_flex_wrap h2{margin:0;font-size:28px;font-weight:800;color:var(--pd-slate);position:relative;padding-bottom:12px}
#content .portfolio_detail_works .title_flex_wrap h2::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:4px;border-radius:2px;background:var(--pd-grad)}
#content .portfolio_detail_works .list_works-slider>div{padding:0 10px;box-sizing:border-box;height:auto}
#content .portfolio_detail_works .slick-track{display:flex!important}
#content .portfolio_detail_works .slick-slide{height:auto!important}
#content .portfolio_detail_works .slick-slide>div{height:100%}
#content .portfolio_detail_works .portfolio-list-item{display:flex!important;flex-direction:column;height:100%;box-sizing:border-box;background:#fff;border:1px solid var(--pd-br);border-radius:16px;overflow:hidden;box-shadow:0 4px 14px rgba(45,52,64,.06);transition:transform .25s,box-shadow .25s}
@media (hover:hover){#content .portfolio_detail_works .portfolio-list-item:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(45,52,64,.14)}}
#content .portfolio_detail_works .portfolio-list-item__img-wrap{aspect-ratio:4/3;overflow:hidden;margin:0}
#content .portfolio_detail_works .portfolio-list-item__img-wrap a{display:block;height:100%}
#content .portfolio_detail_works .portfolio-list-item__img-wrap img{width:100%!important;height:100%!important;object-fit:cover;display:block}
#content .portfolio_detail_works .portfolio-item__content-wrap{display:flex;flex-direction:column;flex:1;padding:18px 20px 20px}
#content .portfolio_detail_works .portfolio-item_title{font-size:18px;font-weight:800;line-height:1.3;color:var(--pd-slate);margin:0 0 12px}
#content .portfolio_detail_works .portfolio-item_prop-row{padding:6px 0;border-bottom:1px dashed var(--pd-br);font-size:14px}
#content .portfolio_detail_works .portfolio-item_prop-row:last-child{border-bottom:0}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name>div{display:flex;justify-content:space-between;gap:10px}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name span:first-child{color:#6B7380}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name span:last-child{font-weight:700;color:var(--pd-slate);text-align:right}
#content .portfolio_detail_works .portfolio-item__content-wrap .price{margin:12px 0 14px;font-size:20px;font-weight:800;color:var(--pd-or)}
#content .portfolio_detail_works .portfolio-item__content-wrap>div:last-child{margin-top:auto}
#content .portfolio_detail_works .portfolio-item__content-wrap .button{display:block!important;width:100%;box-sizing:border-box;text-align:center;padding:13px 18px!important;border:0!important;border-radius:12px!important;background:var(--pd-grad)!important;color:#fff!important;font-weight:700}
#content .portfolio_detail_works .btn_holder{text-align:center;margin-top:24px}
#content .portfolio_detail_works .btn_holder .btn{display:inline-block;min-width:240px;box-sizing:border-box;padding:13px 28px;border:2px solid var(--pd-or);border-radius:12px;background:#fff;color:var(--pd-or);font-weight:700;text-align:center;transition:background-color .2s,color .2s}
#content .portfolio_detail_works .btn_holder .btn:hover{background:var(--pd-or);color:#fff}

/* комментарии */
#content .khayr_main_comment{margin-top:8px;padding:24px;border:1px solid var(--pd-br);border-radius:16px;background:#fff}
#content .khayr_main_comment .comments_title{margin:0 0 16px;font-size:22px;font-weight:800;color:var(--pd-slate)}
#content .khayr_main_comment .comments_title span{display:inline-block;min-width:26px;padding:0 8px;border-radius:999px;background:#FFF7EC;border:1px solid #F0DEC6;font-size:14px;text-align:center;vertical-align:middle}
#content .khayr_main_comment .comments_form_row{display:grid;grid-template-columns:220px 1fr;gap:12px}
#content .khayr_main_comment .field_wrap{display:flex;gap:12px;margin:0!important;width:auto!important}
#content .khayr_main_comment .comments_input{box-sizing:border-box;width:100%!important;height:48px;padding:0 16px;border:1px solid var(--pd-br)!important;border-radius:12px!important;background:#fff;font-size:15px;outline:0;transition:border-color .2s,box-shadow .2s}
#content .khayr_main_comment .comments_input:focus{border-color:var(--pd-or)!important;box-shadow:0 0 0 3px rgba(253,137,0,.18)}
#content .khayr_main_comment .comments_btn{flex:0 0 auto;height:48px;padding:0 24px;border:0;border-radius:12px;background:var(--pd-grad);color:#fff;font-weight:700;cursor:pointer}

@media (max-width:900px){
#content .portfolio_detail .detail_wrap{grid-template-columns:1fr}
#content .portfolio_detail .detail-img__wrap{min-height:0;aspect-ratio:3/2}
#content .portfolio_detail .detail-info__wrap{padding:22px 18px!important}
#content .khayr_main_comment .comments_form_row{grid-template-columns:1fr}
}
@media (max-width:600px){
#content .portfolio_detail>.content-block .page_title,#content .portfolio_detail_works .title_flex_wrap h2{font-size:23px}
#content .portfolio_detail>table td{padding:12px 14px!important;font-size:15px}
#content .portfolio_detail>table td:first-child{width:auto}
#content .portfolio_detail>table td:last-child{white-space:normal}
#content .khayr_main_comment{padding:16px}
#content .khayr_main_comment .field_wrap.btns_wrap{flex-direction:column}
#content .khayr_main_comment .comments_btn{width:100%}
}
#content .portfolio_detail .button,#content .portfolio_detail_works .button,#content .portfolio_detail_works .btn_holder .btn{text-decoration:none!important}

/* ===== v2: защита от правил шаблона (иконки, фикс. высоты, отступы слайдов) ===== */
/* главное фото: заполняет всю высоту карточки */
#content .portfolio_detail .detail-img__wrap{position:relative!important;align-self:stretch!important;height:auto!important;min-height:340px!important;overflow:hidden}
#content .portfolio_detail .detail-img__wrap>img{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:cover!important}
/* строки параметров: сбрасываем высоты шаблона, иконки оставляем */
#content .portfolio_detail .portfolio-detail_prop-row{box-sizing:border-box!important;height:auto!important;min-height:0!important;padding-top:14px!important;padding-bottom:14px!important;margin:0!important;align-items:center!important;line-height:1.3!important}
#content .portfolio_detail .portfolio-detail_prop-row:first-child{padding-top:0!important}
#content .portfolio_detail .portfolio-detail_prop-row:last-child{padding-bottom:0!important}
#content .portfolio_detail .portfolio-detail_prop-row .prop_name{flex:1 1 auto;min-width:0}
#content .portfolio_detail .portfolio-detail_prop-row .prop_value{flex:0 0 auto}
#content .portfolio_detail .portfolio-detail-btn__wrap{margin:8px 0 18px!important}
#content .portfolio_detail .portfolio-detail-share{justify-content:flex-start!important;margin-top:auto!important}
#content .portfolio_detail .portfolio-detail-share .title{font-weight:400!important}
/* галерея: слайд без белой подложки/тени/фикс. высоты, фото на всю плитку */
#content .photo-gallery-slider .photo-gallery-item{height:auto!important;min-height:0!important;padding:0 10px!important;background:transparent!important;box-shadow:none!important;border:0!important;border-radius:0!important;box-sizing:border-box!important}
#content .photo-gallery-slider .photo-gallery-item>a{position:relative!important;top:auto!important;bottom:auto!important;left:auto!important;right:auto!important;display:block!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important;aspect-ratio:4/3!important;border-radius:14px!important;overflow:hidden!important;box-shadow:0 4px 14px rgba(45,52,64,.12)!important}
#content .photo-gallery-slider .photo-gallery-item>a>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;border-radius:0!important;object-fit:cover!important}
#content .photo-gallery-slider .photo-gallery-item .portfolio-item-gallery_btn{z-index:2}
/* похожие ремонты: фото всегда видно, строки не выходят за карточку */
#content .portfolio_detail_works .portfolio-list-item__img-wrap{display:block!important;position:relative!important;width:100%!important;height:0!important;padding:0 0 75%!important;aspect-ratio:auto!important;margin:0!important;overflow:hidden}
#content .portfolio_detail_works .portfolio-list-item__img-wrap>a{position:absolute!important;inset:0!important;display:block!important}
#content .portfolio_detail_works .portfolio-list-item__img-wrap img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important}
#content .portfolio_detail_works .portfolio-item_props{width:100%!important;max-width:100%!important;box-sizing:border-box!important;margin:0!important;padding:0!important}
#content .portfolio_detail_works .portfolio-item_prop-row{box-sizing:border-box!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;margin:0!important;padding-top:9px!important;padding-bottom:9px!important;overflow:hidden}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name{box-sizing:border-box!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;overflow:visible!important}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name>div{display:flex!important;justify-content:space-between!important;align-items:center;gap:8px;width:100%!important;min-width:0}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name span{width:auto!important;margin:0!important;min-width:0;white-space:normal}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name span:first-child{flex:0 0 auto}
#content .portfolio_detail_works .portfolio-item_prop-row .prop_name span:last-child{flex:1 1 auto;text-align:right}
#content .portfolio_detail_works .portfolio-item__content-wrap{box-sizing:border-box!important;width:100%!important;min-width:0}

/* ===== v3: псевдоэлемент шаблона резервировал 68% высоты над плиткой ===== */
#content .photo-gallery_wrap .photo-gallery-item:before,
#content .photo-gallery-slider .photo-gallery-item:before,
#content .photo-gallery-slider .photo-gallery-item:after{display:none!important;content:none!important;padding:0!important}

/* ===== v4: комментарии — шрифт и подпись кнопки ===== */
#content .khayr_main_comment,#content .khayr_main_comment *{font-family:inherit}
#content .khayr_main_comment .comments_title{font-family:Arial,"Helvetica Neue",sans-serif!important;font-size:22px!important;font-weight:800!important}
#content .khayr_main_comment .comments_input{font-family:Arial,"Helvetica Neue",sans-serif!important;color:var(--pd-slate)}
#content .khayr_main_comment .comments_btn{display:inline-flex!important;align-items:center;justify-content:center;min-width:140px;font-family:Arial,"Helvetica Neue",sans-serif!important;font-size:15px!important;line-height:1!important;color:#fff!important}
#content .khayr_main_comment .comments_btn span{display:inline!important;position:static!important;color:#fff!important;font-size:15px!important;font-weight:700!important;line-height:1!important;text-indent:0!important;opacity:1!important;visibility:visible!important;width:auto!important;height:auto!important}
@media (max-width:600px){#content .khayr_main_comment .comments_btn{width:100%}}

/* ===== v5: галерея без зависимости от абсолютного img, отступы, мобильные поправки ===== */
#content .photo-gallery_wrap{padding:0!important;margin:0 0 32px!important;min-height:0!important;height:auto!important}
#content .photo-gallery-slider{margin:0!important;padding:0!important;min-height:0!important}
#content .photo-gallery-slider .slick-list{padding:0!important;margin:0!important}
#content .photo-gallery-slider .photo-gallery-item>a{aspect-ratio:auto!important;height:auto!important;min-height:0!important}
#content .photo-gallery-slider .photo-gallery-item>a>img{position:static!important;inset:auto!important;display:block!important;width:100%!important;height:auto!important;aspect-ratio:4/3!important;object-fit:cover!important}
#content .photo-gallery-slider .photo-gallery-item .portfolio-item-gallery_btn{position:absolute!important;inset:0!important}
/* подписи свойств всегда слева */
#content .portfolio_detail .portfolio-detail_prop-row .prop_name{text-align:left!important}
#content .portfolio_detail .portfolio-detail_prop-row .prop_value{text-align:right!important}
@media (max-width:600px){
#content .khayr_main_comment .field_wrap.btns_wrap{display:flex!important;flex-direction:column!important;gap:12px}
#content .khayr_main_comment .comments_input{flex:0 0 auto!important;height:48px!important;min-height:48px!important;width:100%!important}
#content .khayr_main_comment .comments_btn{flex:0 0 auto!important;height:48px!important}
}
@media (max-width:767px){
#content .portfolio_detail_works .title_flex_wrap{display:flex!important}
#content .portfolio_detail_works .btn_holder{display:block!important}
}
#content .portfolio_detail .detail_wrap{align-items:stretch!important}
#content .portfolio_detail .detail-img__wrap:before{display:none!important;content:none!important;padding:0!important}