/* Article Slider (Arrows Only) */
.el-article-slider{
  position:relative;
  width:100%;
  max-width:1100px;
  margin:0 auto
}

/* squared corners */
.el-as-viewport{
  overflow:hidden;
  border:1px solid #eee;
  border-radius:0;
  background:#fff
}

.el-as-track{
  display:flex;
  transition:transform .35s ease;
  will-change:transform
}

.el-as-slide{min-width:100%;display:block}

/* image area */
.el-as-img{
  display:block;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:0;
}

.el-as-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block
}

.el-as-img-fallback{
  height:100%;
  background:linear-gradient(135deg,#e9eef5,#f7f9fc)
}

.el-as-content{padding:18px 20px}

/* Typography requirements */
.el-as-title{
  margin:0 0 10px;
  font-size:24px; /* H2 24px */
  line-height:1.25
}

.el-as-content h3{
  font-size:20px; /* H3 20px if used */
  line-height:1.25
}

.el-as-title a{text-decoration:none}

.el-as-excerpt{
  font-size:15px;
  line-height:1.6;
  opacity:.9
}

/* arrows inside slider - more subtle */
.el-as-nav{
  position:absolute;
  top:42%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:999px;

  border:1px solid rgba(0,0,0,.10);
  background:rgba(255,255,255,.65);
  backdrop-filter: blur(4px);

  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;

  box-shadow:none;
  opacity:.55;
  transition:opacity .2s ease, background .2s ease, border-color .2s ease;
  z-index:5;
}

.el-as-nav:hover,
.el-as-nav:focus{
  opacity:.95;
  background:rgba(255,255,255,.92);
  border-color: rgba(0,0,0,.18);
  outline:none;
}

.el-as-prev{left:10px}
.el-as-next{right:10px}

/* reset theme button styles */
.el-article-slider .el-as-nav{
  padding:0 !important;
  line-height:1 !important;
}

/* Mobile - arrows still visible */
@media (max-width:768px){
  .el-as-nav{
    width:34px;
    height:34px;
    top:40%;
    opacity:.75;
    background:rgba(255,255,255,.75);
  }
  .el-as-title{font-size:24px}
}
