/* Shared refinement loader + ID 17 catalog interaction semantics. */
.cont3_t5 .item > a.start{text-decoration:none;}
.cont3_t5 .item .button{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;}

@media (min-width:820px){
  .cont3_t5 .item .podr{position:relative;}
  .cont3_t5 .item .podr .thumbnail{position:relative;z-index:0;display:inline-block;width:auto;height:auto;border:0;padding:0;background:none;margin:0 auto;color:#7e7e7e;font:inherit;line-height:inherit;cursor:pointer;}
  .cont3_t5 .item .podr .thumbnail:hover,
  .cont3_t5 .item .podr .thumbnail:focus{background-color:transparent;z-index:50;text-decoration:underline;}
  .cont3_t5 .item .thumbnail-detail{position:absolute;z-index:40;width:170px;background-color:#fff;padding:5px;left:-1000px;border:1px solid #242424;font-size:16px;font-weight:400;visibility:hidden;color:#505050;text-decoration:none;border-radius:4px;font-style:normal;text-align:left;}
  .cont3_t5 .item .thumbnail:not(.catalog-detail-hover-suppressed):hover + .thumbnail-detail,
  .cont3_t5 .item .thumbnail[aria-expanded="true"] + .thumbnail-detail{visibility:visible;top:30px;left:50%;transform:translateX(-50%);}
}

/* Stage A responsive architecture: settle the shared breakpoint and fluidize the
   existing desktop composition before it reaches its fixed 960px layout. */
@media (width < 820px){
  .cont1,
  .cont3{width:min(640px,100%);max-width:640px;margin-left:auto;margin-right:auto;box-sizing:border-box;}
  .footer2{width:min(640px,100%);max-width:640px;box-sizing:border-box;}
  .footer2_t1 .item1,
  .footer2_t1 .item2{float:none;width:100%;box-sizing:border-box;text-align:center;}
}

/* Keep enlarged sketch sheets inside the viewport until their 960px frame fits with side margins. */
@media (min-width:820px) and (width < 984px){
  #callmen1.showw,
  #callmen2.showw,
  #callmen3.showw,
  #callmen4.showw{position:fixed!important;top:50%!important;left:50%!important;width:min(950px,calc(100vw - 34px));transform:translate(-50%,-50%);}
}

@media (min-width:820px) and (width < 960px){
  #callmes.sketches-popup{position:fixed!important;top:50%!important;left:50%!important;width:min(900px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);box-sizing:border-box;transform:translate(-50%,-50%);overflow:auto;}
  #callmes.sketches-popup > a#closed{top:10px;right:10px;}
  #callmes.sketches-popup .item{width:25%;box-sizing:border-box;padding:0 4px;}
  #callmes.sketches-popup .item img{width:100%;max-width:190px;box-sizing:border-box;}

  .cont1,
  .cont2,
  .cont3,
  .cont4,
  .cont5,
  .cont6,
  .cont7,
  .cont8,
  .cont9,
  .cont10,
  .footer,
  .footer2{width:calc(100% - 32px);max-width:none;box-sizing:border-box;}

  .cont2_t1{left:50%;transform:translateX(-50%);}
  .cont2_t2,
  .why-layout{width:100%;}
  .why-benefits{width:calc(100% - 60px);grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(8px,1.5vw,16px);}
  .why-benefit__text--desktop{width:min(210px,100%);}
  .why-yandex-desktop{width:min(700px,100%);}

  .cont4 .cont4_t1,
  .cont3_bg + .cont4_bg .cont4 .cont4_t1,
  .cont9_bg + .cont4_bg .cont4 .cont4_t1{left:2%;width:30%;box-sizing:border-box;padding-left:14px;padding-right:14px;}
  .cont4 .cont4_t2,
  .cont3_bg + .cont4_bg .cont4 .cont4_t2,
  .cont9_bg + .cont4_bg .cont4 .cont4_t2{left:35%;width:30%;box-sizing:border-box;padding-left:14px;padding-right:14px;}
  .cont4 .cont4_t3,
  .cont3_bg + .cont4_bg .cont4 .cont4_t3,
  .cont9_bg + .cont4_bg .cont4 .cont4_t3{left:67%;width:31%;box-sizing:border-box;}
  .cont3_bg + .cont4_bg .cont4 .pol74,
  .cont9_bg + .cont4_bg .cont4 .pol74{left:0!important;width:100%!important;}
  .cont4 form.forma .phone-field-error{left:35%;width:30%;}

  .cont10_t1{left:50%;width:min(540px,100%);transform:translateX(-50%);box-sizing:border-box;}
  .cont10_t2{left:5%;width:90%;}
  .cont10::before{left:auto;right:0;width:min(283px,36%);}
  .cont10_t2::after{left:auto;right:0;width:min(283px,40%);}
  .cont10_delivery_free{left:.5%;width:49%;box-sizing:border-box;}
  .cont10_delivery_standard{left:50.5%;width:49%;box-sizing:border-box;}
  .cont10_t4{left:.5%;width:49%;box-sizing:border-box;}
  .cont10_t5{left:50.5%;width:49%;box-sizing:border-box;}
  .cont10_t7{left:4%;width:57%;font-size:clamp(18px,2.15vw,21px);line-height:1.2;}
  .cont10_t9{left:50%;transform:translateX(-50%);}
  .cont10_t9:hover{transform:translateX(-50%) scale(1.02);}

  .cont9_t1{left:50%;width:min(540px,100%);transform:translateX(-50%);box-sizing:border-box;}
  .how-work-desktop{left:15px;width:calc(100% - 30px);grid-template-columns:repeat(4,minmax(0,1fr));column-gap:16px;}
  .how-work-desktop__item{grid-template-columns:30px minmax(0,104px);column-gap:7px;}
  .how-work-desktop__icon{width:94px;height:94px;max-width:100%;}
  .how-work-desktop__copy{grid-column:1 / -1;width:100%;max-width:185px;}
  .how-work-desktop__item:not(:last-child)::after{right:-17px;width:28px;font-size:30px;}

  .contacts-footer__main{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;}
  .contacts-footer__bar{flex-wrap:wrap;gap:14px 18px;}
  .footer2_t1 .item1{width:52%;box-sizing:border-box;padding-right:12px;}
  .footer2_t1 .item2{width:46%;box-sizing:border-box;}
}

/* f4.jpg contains obsolete input/button artwork. On both desktop request strips,
   paint over those baked controls at the image's native centered coordinates;
   the live controls stay above this layer and the seal remains visible around them. */
@media (min-width:820px){
  :is(.cont3_bg,.cont9_bg) + .cont4_bg::after{
    content:"";
    position:absolute;
    z-index:0;
    top:68px;
    left:calc(50% - 443px);
    width:277px;
    height:48px;
    background:#FEB63D;
    box-shadow:299px 0 0 #FEB63D,598px 0 0 #FEB63D;
    pointer-events:none;
  }
}