/* mertech.uz / mertech.kz: страница статьи блога (перенос с tsd-mertech, 05.11.2026). Источник — блоки codex в app.min.css исходного сайта. */

/* codex: blog article figma 253-391 2026-10-13 */
.mt-article-author{display:flex;align-items:center;gap:2rem;margin:0 0 2rem}

.mt-article-author__photo{display:block;flex:0 0 auto;width:9rem;height:9rem;border-radius:50%;object-fit:cover}

.mt-article-author__desc{display:flex;flex-direction:column;gap:.3rem;min-width:0;max-width:30.2rem}

.mt-article-author__label{font-size:1.5rem;line-height:2.4rem;color:#bdc2d3}

.mt-article-author__name{font-size:1.8rem;line-height:3.42rem;color:#343434;text-decoration:underline;text-underline-position:from-font}

a.mt-article-author__name:hover{color:#e4003a}

.mt-article-author__position{font-size:1.2rem;line-height:1.6rem;color:#343434}

.article__info-item svg.mt-icon-clock{flex:0 0 auto;width:1.9rem;height:1.9rem;margin:0 .7rem 0 0;color:#fff}

.article__body.mt-article-layout{display:flex;align-items:flex-start;gap:8rem}

@media (min-width:1200px){.article__head.mt-article-head{margin-bottom:6rem}
}

.mt-article-aside{flex:0 0 29rem;width:29rem;font-size:1.6rem;line-height:1.5}

.mt-article-content{flex:1 1 auto;min-width:0;max-width:82rem}

.mt-article-content h2[id]{scroll-margin-top:12rem}

.mt-article-toc{margin:0}

.mt-article-toc__title{display:block;list-style:none;cursor:default;margin:0 0 1rem;font-size:2rem;line-height:3.4rem;font-weight:500;color:#343434}

.mt-article-toc__title::-webkit-details-marker{display:none}

.mt-article-toc__list{margin:0;padding:0 0 0 2.2rem;list-style:none;border-left:2px solid #bdc2d3}

.mt-article-toc__list>li{margin:0 0 2.1rem;padding:0}

.mt-article-toc__list>li:last-child{margin:0}

.mt-article-toc .mt-article-toc__link{display:block;border:0;font-size:1.5rem;line-height:2.1rem;color:#bdc2d3;transition:color .25s}

.mt-article-toc .mt-article-toc__link.is-active{color:#343434}

.mt-article-toc .mt-article-toc__link:hover{color:#e4003a;opacity:1}

.mt-article-lead{position:relative;margin:12.6rem 0 0;padding:0}

.mt-article-toc+.mt-article-lead{margin-top:12.6rem}

.mt-article-aside>.mt-article-lead:first-child{margin-top:6.6rem}

.mt-article-lead__media{position:absolute;z-index:2;top:-6.6rem;left:3.9rem;width:21.3rem;height:21.8rem;pointer-events:none}

.mt-article-lead__product{display:block;width:21.3rem;height:21.8rem}

.mt-article-lead__card{position:relative;overflow:hidden;background:#fff url(../images/mt/blog-article/form-background.jpg) no-repeat 0 0/100% 7.7rem;border:1px solid #f0f1f7;border-radius:10px;padding:16.9rem 2rem 2rem}

.mt-article-lead__card:before{content:"";position:absolute;z-index:1;top:1.8rem;left:0;width:100%;height:10.5rem;background:url(../images/mt/blog-article/form-graphic.svg) no-repeat 0 0/100% 100%}

.mt-article-lead__title{position:relative;z-index:3;display:block;margin:0 0 1.5rem;font-size:2rem;line-height:2.5rem;font-weight:500;color:#343434}

.article__body .mt-article-lead__text{margin:0 0 1.5rem;font-size:1.4rem;line-height:2rem;color:#343434}

.mt-article-lead__form{margin:0}

.mt-article-lead__form .ui-field{margin:0 0 1rem}

.mt-article-lead__form .ui-input{height:4.6rem;padding:0 1.6rem;background:#f7f8fb;border:1px solid #f7f8fb;border-radius:5px;font-size:1.6rem;line-height:normal;color:#343434}

.mt-article-lead__form .ui-input::placeholder{color:rgba(34,34,34,.5)}

.mt-article-lead__form .ui-input:focus{border-color:#bdc2d3}

.mt-article-lead__form .ui-field.is-error .ui-input{border-color:#e4003a}

.mt-article-lead__form .ui-error{display:block;white-space:normal;overflow:visible;text-overflow:clip;margin:.4rem 0 0;font-size:1.3rem;line-height:1.6rem;color:#e4003a}

.mt-article-lead__form .ui-check{display:flex;align-items:flex-start;margin:1.5rem 0;cursor:pointer}

.mt-article-lead__form .ui-check__checkbox{width:2rem;height:2rem;margin:0 1rem 0 0}

.mt-article-lead__form .ui-check__text{font-size:1.5rem;line-height:2rem;color:#343434}

.mt-article-lead__form .ui-check__text a{border:0;color:#4791ff}

.mt-article-lead__form .ui-btn{height:5rem;border-radius:5px;font-size:1.6rem;font-weight:500}

.mt-article-lead .alert{margin:0 0 1.5rem}

@media (max-width:1199.98px){
.article__body.mt-article-layout{display:block}

.mt-article-aside{width:auto;max-width:none;margin:0 0 4rem}

.mt-article-toc{background:#fff;border-radius:10px;padding:1.5rem 2rem}

.mt-article-toc__title{position:relative;margin:0;padding:0 3rem 0 0;cursor:pointer}

.mt-article-toc__title:after{content:"";position:absolute;right:.5rem;top:50%;width:.9rem;height:.9rem;margin:-.7rem 0 0;border:solid #343434;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .25s}

.mt-article-toc[open] .mt-article-toc__title{margin:0 0 1.5rem}

.mt-article-toc[open] .mt-article-toc__title:after{margin-top:-.2rem;transform:rotate(-135deg)}

.mt-article-toc__list>li{margin:0 0 1.5rem}

.mt-article-toc .mt-article-toc__link{color:#343434}

.mt-article-lead,.mt-article-toc+.mt-article-lead{max-width:40rem;margin:9rem auto 0}

.mt-article-lead__media{left:50%;margin-left:-10.65rem}

.mt-article-lead__card{background-size:100% 7.7rem}

}

@media (max-width:767.98px){
.mt-article-author{gap:1.5rem}

.mt-article-author__photo{width:7rem;height:7rem}

.mt-article-toc{padding:1.5rem}

.mt-article-lead{max-width:none}

}

@media (prefers-reduced-motion:reduce){
.mt-article-toc .mt-article-toc__link,.mt-article-toc__title:after{transition:none}

}

/* /codex: blog article figma 253-391 2026-10-13 */
/* codex: article sticky lead form 2026-10-14 */
@media (min-width:1199px) and (min-height:760px){
  .app:has(.mt-article-layout){overflow:clip}

  .mt-article-layout>.mt-article-aside{align-self:stretch}

  .mt-article-aside .mt-article-lead{position:sticky;top:16.5rem}

}

/* /codex: article sticky lead form 2026-10-14 */
/* codex: designer fixes blog article 2026-10-14 (только часть статьи) */
/* Article */
.mt-article-author .mt-article-author__name{text-decoration:none}

.article__body--blog .article-important{background:#fff}

.article__body--blog img{border-radius:1.5rem}

/* /codex: designer fixes blog article 2026-10-14 */

/* codex: blog article inline images spacing 2026-10-21 */
.article__body--blog img.img-responsive{display:block;margin:3rem 0}

@media (max-width:767.98px){.article__body--blog img.img-responsive{margin:2rem 0}
}

/* /codex: blog article inline images spacing 2026-10-21 */
/* codex: article toc rail 2026-10-21 */
.mt-toc-rail{display:none}

@media (min-width:1200px){
.mt-toc-rail{display:block;position:fixed;top:50%;z-index:20;transform:translateY(-50%);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}

.mt-toc-rail.is-visible{opacity:1;visibility:visible}

.mt-toc-rail__ticks{display:flex;flex-direction:column;align-items:flex-end;gap:.8rem;padding:1.2rem .8rem;cursor:pointer}

.mt-toc-rail__tick{display:block;width:1.4rem;height:2px;border-radius:1px;background:#bdc2d3;transition:width .2s,background-color .2s}

.mt-toc-rail__tick.is-passed{background:#68707b}

.mt-toc-rail__tick.is-active{width:2.2rem;background:#e4003a}

.mt-toc-rail__panel{position:absolute;left:0;top:50%;width:34rem;max-height:70vh;overflow:auto;padding:2rem 2.4rem;border-radius:10px;background:#fff;box-shadow:0 10px 26px rgba(32,34,40,.10);transform:translateY(-50%);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}

.mt-toc-rail:hover .mt-toc-rail__panel,.mt-toc-rail:focus-within .mt-toc-rail__panel{opacity:1;visibility:visible}

.mt-toc-rail__title{display:block;margin:0 0 1.2rem;font-size:1.6rem;line-height:2.2rem;font-weight:500;color:#343434}

.mt-toc-rail__list{margin:0;padding:0;list-style:none}

.mt-toc-rail__list>li{margin:0 0 1rem}

.mt-toc-rail__list>li:last-child{margin:0}

.mt-toc-rail .mt-toc-rail__link{display:block;font-size:1.4rem;line-height:1.9rem;color:#68707b;text-decoration:none;transition:color .25s}

.mt-toc-rail .mt-toc-rail__link.is-active{color:#343434;font-weight:500}

.mt-toc-rail .mt-toc-rail__link:hover{color:#e4003a;opacity:1}

}

@media (prefers-reduced-motion:reduce){.mt-toc-rail,.mt-toc-rail__tick,.mt-toc-rail__panel,.mt-toc-rail .mt-toc-rail__link{transition:none}
}

/* /codex: article toc rail 2026-10-21 */
/* codex: article faq like home 2026-10-21 */
.article__body--blog details.faq-item{margin:0 0 .8rem;border:0;border-radius:10px;background:#fff}

.article__body--blog details.faq-item>summary{position:relative;display:block;padding:2rem 6rem 2rem 2.4rem;font-size:1.7rem;line-height:1.4;font-weight:600;color:#343434;cursor:pointer;list-style:none;transition:color .25s}

.article__body--blog details.faq-item>summary::-webkit-details-marker{display:none}

.article__body--blog details.faq-item>summary:after{content:"";position:absolute;top:50%;right:2.4rem;width:1rem;height:1rem;margin-top:-.7rem;border-right:2px solid #e4003a;border-bottom:2px solid #e4003a;transform:rotate(45deg);transition:transform .2s}

.article__body--blog details.faq-item[open]>summary:after{margin-top:-.2rem;transform:rotate(-135deg)}

.article__body--blog details.faq-item>summary,.article__body--blog details.faq-item>summary:hover{background:transparent}

.article__body--blog details.faq-item>summary:hover{color:#e4003a}

.article__body--blog .faq-block h2{color:#343434}

.article__body--blog details.faq-item>summary:focus-visible{outline:2px solid #e4003a;outline-offset:-2px;border-radius:10px}

.article__body--blog details.faq-item .faq-answer{padding:0 2.4rem 2.2rem}

.article__body--blog details.faq-item .faq-answer p{margin:0 0 1rem;font-size:1.6rem;line-height:2.5rem;color:#5b6070}

.article__body--blog details.faq-item .faq-answer p:last-child{margin:0}

@media (max-width:767.98px){.article__body--blog details.faq-item>summary{padding:1.6rem 4.8rem 1.6rem 1.6rem;font-size:1.6rem}
.article__body--blog details.faq-item>summary:after{right:1.8rem}
.article__body--blog details.faq-item .faq-answer{padding:0 1.6rem 1.8rem}
}

@media (prefers-reduced-motion:reduce){.article__body--blog details.faq-item>summary,.article__body--blog details.faq-item>summary:after{transition:none}
}

/* /codex: article faq like home 2026-10-21 */
/* codex: article photo captions 2026-10-21 */
.article__body--blog figcaption{color:#BDC2D3}

/* /codex: article photo captions 2026-10-21 */
/* mertech.uz: FAQ в статьях свёрстан как <details style=...><summary><h3 style="display:inline">, приводим к виду faq-item */
.article__body--blog details:not(.faq-item){margin:0 0 .8rem!important;padding:0!important;border:0!important;border-radius:10px!important;background:#fff!important}
.article__body--blog details:not(.faq-item)>summary{position:relative;display:block;padding:2rem 6rem 2rem 2.4rem;cursor:pointer;list-style:none;color:#343434;transition:color .25s}
.article__body--blog details:not(.faq-item)>summary::-webkit-details-marker{display:none}
.article__body--blog details:not(.faq-item)>summary h3{display:inline;margin:0!important;font-size:1.7rem!important;line-height:1.4!important;font-weight:600;color:inherit}
.article__body--blog details:not(.faq-item)>summary:after{content:"";position:absolute;top:50%;right:2.4rem;width:1rem;height:1rem;margin-top:-.7rem;border-right:2px solid #e4003a;border-bottom:2px solid #e4003a;transform:rotate(45deg);transition:transform .2s}
.article__body--blog details:not(.faq-item)[open]>summary:after{margin-top:-.2rem;transform:rotate(-135deg)}
.article__body--blog details:not(.faq-item)>summary:hover{color:#e4003a}
.article__body--blog details:not(.faq-item)>summary:focus-visible{outline:2px solid #e4003a;outline-offset:-2px;border-radius:10px}
.article__body--blog details:not(.faq-item)>summary~*{padding:0 2.4rem 2.2rem;font-size:1.6rem;line-height:2.5rem;color:#5b6070}
.article__body--blog details:not(.faq-item)>summary~* p{margin:0 0 1rem}
.article__body--blog details:not(.faq-item)>summary~* p:last-child{margin:0}
@media (max-width:767.98px){.article__body--blog details:not(.faq-item)>summary{padding:1.6rem 4.8rem 1.6rem 1.6rem}
.article__body--blog details:not(.faq-item)>summary h3{font-size:1.6rem!important}
.article__body--blog details:not(.faq-item)>summary:after{right:1.8rem}
.article__body--blog details:not(.faq-item)>summary~*{padding:0 1.6rem 1.8rem}
}
@media (prefers-reduced-motion:reduce){.article__body--blog details:not(.faq-item)>summary,.article__body--blog details:not(.faq-item)>summary:after{transition:none}
}