/* 3aclean.ru: подключать ПОСЛЕ aclean.css. Активируется классом ac-wash-visual на .t-slider. */
.ac-wash-visual {
  --ac-ink:#142e3e; --ac-muted:#3d5969; --ac-cta:#35773d;
  --ac-line:#adc3ca; --ac-radius:24px;
  min-height:520px; border-radius:var(--ac-radius); background:#e3edf0;
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) {
  padding:44px 38px 78px; justify-content:center; color:var(--ac-ink);
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before {
  background:linear-gradient(90deg,rgba(237,245,247,.92) 0%,rgba(237,245,247,.65) 42%,transparent 61%),var(--ac-image) center/cover no-repeat;
}
/* Фотография аппарата уже включена в новый фон — дублирующую картинку скрываем в четырёх подготовленных слайдах. */
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-art {display:none}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) h2 {
  color:var(--ac-ink); font-size:clamp(30px,3.2vw,44px); line-height:1.08;
  font-weight:800; letter-spacing:normal; max-width:48%; text-wrap:balance;
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) p {
  color:var(--ac-muted); opacity:1; font-size:16px; line-height:1.45;
  max-width:45%; margin:18px 0 24px;
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-tag {
  color:var(--ac-muted); background:rgba(255,255,255,.75); font-size:13px;
  border:1px solid rgba(173,195,202,.7); margin-bottom:20px;
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-btn-light {
  background:var(--ac-cta); color:white; min-height:48px; height:auto;
  padding:13px 22px; border-radius:12px; border:0; white-space:normal;
  font-weight:700; text-decoration:none; transition:background .18s ease;
}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-btn-light:hover {background:#285e30;color:white}
.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) a:focus-visible {outline:3px solid #142e3e;outline-offset:4px}
.ac-wash-visual .t-dots {left:28px;bottom:18px;top:auto;gap:0}
.ac-wash-visual .t-dots button {width:44px;height:44px;position:relative;background:transparent!important;border:0;padding:0}
.ac-wash-visual .t-dots button::after {content:'';position:absolute;left:17px;top:18px;width:8px;height:8px;border-radius:8px;background:#fff}
.ac-wash-visual .t-dots button.on::after {left:8px;width:28px}
.ac-wash-visual:has(:is(.s1,.s2,.s3,.s4).on) .t-dots button::after {background:#4b6877}
.ac-wash-visual .t-dots button:focus-visible {outline:2px solid currentColor;outline-offset:-4px}
@media (min-width:768px) and (max-width:1199px) {
  .ac-wash-visual {min-height:540px}
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before {
    background:linear-gradient(90deg,rgba(237,245,247,.88),rgba(237,245,247,.5) 42%,transparent 62%),var(--ac-image) center/cover no-repeat;
  }
}
@media (max-width:767px) {
  .ac-wash-visual {min-height:720px;border-radius:20px}
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) {justify-content:flex-start;padding:28px 24px 64px}
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before {
    background:linear-gradient(180deg,rgba(237,245,247,.4),transparent 55%),var(--ac-image) center/cover no-repeat;
  }
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) h2 {max-width:100%;font-size:34px;line-height:1.08}
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) p {max-width:100%;font-size:16px;margin:14px 0 18px}
  .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-tag {margin-bottom:16px}
  .ac-wash-visual .t-dots {left:16px;bottom:8px}
}
@media (max-width:374px) {
 .ac-wash-visual {min-height:760px}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) {padding:24px 20px 64px}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) h2 {font-size:30px}
}
/* Опционально: ac-photo-promos на существующий .t-promos. */
.ac-photo-promos .t-promo {position:relative;isolation:isolate;overflow:hidden;min-height:220px;background:#e7eef0;border-radius:24px;color:#142e3e}
.ac-photo-promos .t-promo::before {content:'';position:absolute;inset:0;z-index:-1;background-position:center;background-size:cover}
.ac-photo-promos .p1::before {background-image:linear-gradient(90deg,rgba(235,243,245,.97),rgba(235,243,245,.7) 47%,transparent 75%),url('../images/service.webp')}
.ac-photo-promos .p2::before {background-image:linear-gradient(90deg,rgba(235,243,245,.97),rgba(235,243,245,.7) 47%,transparent 75%),url('../images/delivery.webp')}
.ac-photo-promos .t-promo h3 {max-width:70%;color:#142e3e}
.ac-photo-promos .t-promo .sub {max-width:65%;color:#3d5969;line-height:1.4}
.ac-photo-promos .t-promo .big {color:#35773d}
.ac-photo-promos .t-promo:focus-visible {outline:3px solid #35773d;outline-offset:3px}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .ac-photo-promos .t-promo::before {transition:transform .25s ease}
 .ac-photo-promos .t-promo:hover::before {transform:scale(1.025)}
}
@media (max-width:600px) {.ac-photo-promos {grid-template-columns:1fr}.ac-photo-promos .t-promo {min-height:190px}}
@media (prefers-reduced-motion:reduce) {.ac-wash-visual .t-slide,.ac-wash-visual a,.ac-photo-promos .t-promo::before {transition:none!important}}

.ac-wash-visual .s1 { --ac-image:url('../images/comac-desktop.webp'); }
@media(min-width:768px) and (max-width:1199px) {.ac-wash-visual .s1 { --ac-image:url('../images/comac-tablet.webp'); } }
@media(max-width:767px) {.ac-wash-visual .s1 { --ac-image:url('../images/comac-mobile.webp'); } }
.ac-wash-visual .s2 { --ac-image:url('../images/tor-desktop.webp'); }
@media(min-width:768px) and (max-width:1199px) {.ac-wash-visual .s2 { --ac-image:url('../images/tor-tablet.webp'); } }
@media(max-width:767px) {.ac-wash-visual .s2 { --ac-image:url('../images/tor-mobile.webp'); } }
.ac-wash-visual .s3 { --ac-image:url('../images/vacuum-desktop.webp'); }
@media(min-width:768px) and (max-width:1199px) {.ac-wash-visual .s3 { --ac-image:url('../images/vacuum-tablet.webp'); } }
@media(max-width:767px) {.ac-wash-visual .s3 { --ac-image:url('../images/vacuum-mobile.webp'); } }
.ac-wash-visual .s4 { --ac-image:url('../images/hawk-desktop.webp'); }
@media(min-width:768px) and (max-width:1199px) {.ac-wash-visual .s4 { --ac-image:url('../images/hawk-tablet.webp'); } }
@media(max-width:767px) {.ac-wash-visual .s4 { --ac-image:url('../images/hawk-mobile.webp'); } }
/* Альтернатива: исходные фото без генеративного изменения товара. */
.ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4)::before {background-image:linear-gradient(90deg,rgba(237,245,247,.92),rgba(237,245,247,.65) 42%,transparent 61%),url('../images/background-desktop.webp')}
.ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4) .t-art {display:grid;right:3%;top:50%;transform:translateY(-50%);width:47%;max-width:none;background:none;border-radius:0;opacity:1;mix-blend-mode:multiply}
.ac-wash-visual.exact-product .t-art img {width:100%;height:100%;padding:0;border-radius:0;box-shadow:none;background:transparent;object-fit:contain}
@media(min-width:768px) and (max-width:1199px){.ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4)::before{background-image:url('../images/background-tablet.webp')}}
@media(max-width:767px){
.ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4)::before{background-image:url('../images/background-mobile.webp')}
.ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4) .t-art{top:auto;bottom:64px;right:10%;width:80%;height:300px;transform:none}
}

.ac-wash-visual .t-slide.s3 h2 {font-size:clamp(26px,2.6vw,34px)}
@media(max-width:374px){.ac-wash-visual .t-slide.s3 h2{font-size:25px}}
/* Портреты показываются целиком по ширине: щётки, шланги и вал не обрезаются. */
@media(max-width:767px){
 .ac-wash-visual{min-height:max(720px,calc((100vw - 32px) * 1.6))}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before{
  background:linear-gradient(180deg,#eaf0f2 0px,rgba(234,240,242,.96) 230px,rgba(234,240,242,0) 380px),var(--ac-image) center bottom/100% auto no-repeat;
  background-color:#eaf0f2;
 }
}
@media(max-width:374px){.ac-wash-visual{min-height:760px}}
@media(min-width:768px){.ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before{background-position:right center}}
@media(max-width:767px){
 .ac-wash-visual{min-height:max(660px,calc((100vw - 32px) * 1.6))}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before{background-size:auto,110% auto}
}
@media(max-width:374px){.ac-wash-visual{min-height:700px}}

/* Компактный мобильный хиро: горизонтальная композиция вместо высокого портрета. */
@media(max-width:767px){
 .ac-wash-visual{
  min-height:0;
  height:clamp(300px,78vw,360px);
  border-radius:20px;
 }
 .ac-wash-visual .s1{--ac-image:url('../images/comac-desktop.webp')}
 .ac-wash-visual .s2{--ac-image:url('../images/tor-desktop.webp')}
 .ac-wash-visual .s3{--ac-image:url('../images/vacuum-desktop.webp')}
 .ac-wash-visual .s4{--ac-image:url('../images/hawk-desktop.webp')}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4){
  justify-content:center;
  padding:20px 18px 58px;
 }
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4)::before{
  background:
   linear-gradient(90deg,#eaf0f2 0%,rgba(234,240,242,.96) 42%,rgba(234,240,242,.48) 62%,rgba(234,240,242,0) 78%),
   var(--ac-image) right center/auto 100% no-repeat;
  background-color:#eaf0f2;
 }
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-tag{
  max-width:58%;
  margin-bottom:10px;
  padding:5px 9px;
  font-size:11px;
  line-height:1.2;
 }
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) h2,
 .ac-wash-visual .t-slide.s3 h2{
  max-width:58%;
  font-size:clamp(23px,6.5vw,29px);
  line-height:1.05;
  text-wrap:balance;
 }
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) p{display:none}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) .t-btn-light{
  max-width:56%;
  min-height:44px;
  margin-top:16px;
  padding:10px 14px;
  font-size:13px;
  line-height:1.2;
 }
 .ac-wash-visual .t-dots{left:10px;bottom:6px}
 .ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4)::before{
  background:
   linear-gradient(90deg,#eaf0f2 0%,rgba(234,240,242,.97) 48%,rgba(234,240,242,.2) 78%),
   url('../images/background-desktop.webp') right center/auto 100% no-repeat;
 }
 .ac-wash-visual.exact-product .t-slide:is(.s1,.s2,.s3,.s4) .t-art{
  display:grid;
  top:50%;
  right:-1%;
  bottom:auto;
  width:53%;
  height:88%;
  transform:translateY(-50%);
 }
}

@media(max-width:359px){
 .ac-wash-visual{height:300px}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4){padding-inline:16px}
 .ac-wash-visual .t-slide:is(.s1,.s2,.s3,.s4) h2,
 .ac-wash-visual .t-slide.s3 h2{font-size:22px}
}
