.yt-slider-slider{
  --gap: 22px;
  position:relative;
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding:8px 48px 38px;
  box-sizing:border-box;
}
.yt-slider-track-wrap{overflow:hidden}
.yt-slider-track{
  display:flex;
  gap:var(--gap);
  transition:transform .45s ease;
  will-change:transform;
}
.yt-slider-card{
  flex:0 0 calc((100% - (var(--gap) * 2)) / 3);
  min-width:0;
  box-sizing:border-box;
}
.yt-slider-open{
  display:block;
  width:100%;
  border:0;
  padding:0;
  margin:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
}
.yt-slider-image{
  display:block;
  position:relative;
  overflow:hidden;
  aspect-ratio:16/9;
  border-radius:0;
  background:#111;
  box-shadow:0 8px 25px rgba(0,0,0,.14);
}
.yt-slider-card.is-short .yt-slider-image{aspect-ratio:9/16}
.yt-slider-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  image-rendering:auto;
  transition:transform .35s ease;
}
.yt-slider-open:hover .yt-slider-image img{transform:scale(1.035)}
.yt-slider-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22));
}
.yt-slider-play{
  position:absolute;
  left:50%;
  top:50%;
  width:66px;
  height:66px;
  transform:translate(-50%,-50%);
  border:2px solid rgba(255,255,255,.9);
  border-radius:50%;
  background:rgba(0,0,0,.16);
  box-sizing:border-box;
}
.yt-slider-play:after{
  content:"";
  position:absolute;
  left:27px;
  top:20px;
  border-left:22px solid #fff;
  border-top:13px solid transparent;
  border-bottom:13px solid transparent;
}
.yt-slider-badge{
  position:absolute;
  left:12px;
  top:12px;
  padding:5px 8px;
  border-radius:4px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font:700 11px/1 Arial,sans-serif;
  letter-spacing:.6px;
}
.yt-slider-title{
  display:block;
  margin-top:10px;
  color:#1b1b1b;
  font:600 15px/1.4 Arial,sans-serif;
}
.yt-slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#fff;
  color:#111;
  box-shadow:0 4px 16px rgba(0,0,0,.18);
  cursor:pointer;
  font-size:22px;
  line-height:42px;
  padding:0;
}
.yt-slider-prev{left:2px}
.yt-slider-next{right:2px}
.yt-slider-arrow:disabled{opacity:.35;cursor:default}
.yt-slider-dots{
  position:absolute;
  bottom:5px;
  left:0;
  right:0;
  display:flex;
  justify-content:center;
  gap:7px;
}
.yt-slider-dot{
  width:8px;
  height:8px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#bbb;
  cursor:pointer;
}
.yt-slider-dot.is-active{background:#333}
.yt-slider-modal{
  display:none;
  position:fixed;
  z-index:999999;
  inset:0;
}
.yt-slider-modal.is-open{display:block}
.yt-slider-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.84);
}
.yt-slider-modal-dialog{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(92vw,1100px);
  max-height:92vh;
  aspect-ratio:16/9;
  background:#000;
  box-shadow:0 15px 60px rgba(0,0,0,.45);
}
.yt-slider-player,.yt-slider-player iframe{
  width:100%;
  height:100%;
  display:block;
  border:0;
}
.yt-slider-close{
  position:absolute;
  right:-42px;
  top:-8px;
  z-index:2;
  width:36px;
  height:36px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:34px;
  line-height:36px;
  cursor:pointer;
}
body.yt-slider-no-scroll{overflow:hidden}
@media (max-width:900px){
  .yt-slider-card{flex-basis:calc((100% - var(--gap)) / 2)}
}
@media (max-width:600px){
  .yt-slider-slider{padding-left:38px;padding-right:38px}
  .yt-slider-card{flex-basis:100%}
  .yt-slider-arrow{width:36px;height:36px;line-height:36px;font-size:19px}
  .yt-slider-prev{left:0}.yt-slider-next{right:0}
  .yt-slider-modal-dialog{width:94vw}
  .yt-slider-close{right:0;top:-44px}
}
