:root {
    --transition: 1.7s cubic-bezier(0.020, 0.600, 0.000, 1.000);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  height: 100%;
  background-color: black;
}

.slider {
    height: 100%;
}

.slider-wrapper {
    will-change: transform;
    transform-style: preserve-3d;
    /* transition: var(--transition) !important; */
}

.slider-item {
    overflow: hidden;
}

.slider-layer {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    will-change: transform;
    /* transition: var(--transition) !important; */
}

.slider-layer::before{
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    box-shadow: inset 0 0 250px rgba(0, 0, 0, 0.3);
}