:root{
  --slider-h: 880px;   /* фикс высота (одинаково на мобиле и десктопе) */
  --fade-duration: .15s;      /* скорость плавности */
  --hold: 4000ms; 
}

.slider-fade{
  position:relative; width:100vw; height:var(--slider-h); 
  overflow:hidden; isolation:isolate; padding-bottom:0px;  padding-top:0px; margin-bottom:0px; margin-top:-0px;
}

/* подложка под слайдами */
.slider-fade .fallback{
  position:absolute; inset:0; z-index:0; padding-bottom:0px;  padding-top:0px; margin-bottom:0px; margin-top:0px;
  background:#000 url('/imgs/slide_fallback.jpg') center/cover no-repeat;
}

/* стопка слайдов */
.slider-fade .stack{
  position:absolute; inset:0; z-index:1;
}
.slider-fade .stack img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:0;
  transition: opacity var(--fade-duration) ease-in-out;
  will-change: opacity;
}
.slider-fade .stack img.active{ opacity:1; }

.slider-fade .content{
  display:flex;              /* ← вместо grid */
  align-items:center;        /* по вертикали по центру */
  justify-dott:flex-start;/* по горизонтали слева */
  text-align:left;  	
  margin-left: 100px;
}
	
.slider-fade .content > *{
  max-width: min(100%, 820px);
	}
	
/* полупрозрачная пелена */
.slider-fade .shade{
  position:absolute; inset:0; z-index:2;
  background: rgba(0,0,0,.42);
  pointer-events:none;
}

/* текст поверх */
.slider-fade .content{
  position:absolute; inset:0; z-index:3;
  display:grid; place-content:center;
  text-align:center; color:#fff; gap:12px; padding:24px;
}

/* точки */
.slider-fade .dots{
  position:absolute; left:0; right:0; bottom:12px; z-index:4;
  display:flex; justify-content:center; gap:10px;
}
.slider-fade .dots button{
  width:10px; height:10px; border-radius:50%;
  background:#fcc500; border:1px solid #fcc500; cursor:pointer;
  padding:0; outline:none;
}
.slider-fade .dots button.active{ background:#fff; }

/* пауза при наведении (опционально) */
.slider-fade:hover .stack img{ transition-duration: var(--fade-duration); }