.slider{position:relative;width:100%;overflow:hidden;}
.slides{height:100%;position:relative;}
.slide{
  position:absolute;top:0;left:0;width:100%;height:100%;
  opacity:0;transition:opacity 1s ease;
}
.slide.active{opacity:1;z-index:1;}
.slide img{width:100%;height:100%;object-fit:cover;filter:brightness(.75);}

/* Animated Text */
.content{
  position:absolute;top:50%;left:10%;
  transform:translateY(-50%);
  max-width:600px;
  opacity:0;
  transform:translateY(30px);
  transition:all 1s ease;
}
.slide.active .content{
  opacity:1;
  transform:translateY(-50%);
}
.content h5{color:#00c46b;letter-spacing:2px;margin-bottom:10px;text-transform:uppercase;}
.content h1{color:#fff;font-size:2.8rem;line-height:1.3;margin-bottom:20px;}
.content p{color:rgba(255,255,255,.85);margin-bottom:25px;}
.content a{background-color: #00a05a;color: #fff;}
.content a:hover{background-color: #008f4c; color: #fff;}
.btn{
  display:inline-block;background:#00c46b;color:#000;
  padding:12px 25px;border-radius:25px;font-weight:600;text-decoration:none;
  transition:all .3s ease;opacity:0;transform:translateY(20px);
}
.slide.active .btn{
  opacity:1;
  transform:translateY(0);
  transition-delay:0.4s;
}
.btn:hover{background:#00a05a;transform:translateY(-2px);}

/* Arrows */
.nav-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(255, 255, 255, 0.048);border:none;color:#fff;
  padding:10px 15px;border-radius:50%;
  cursor:pointer;transition:.3s;z-index:2;
}
.nav-btn:hover{background:rgba(255,255,255,0.4);}
.prev{left:20px;}
.next{right:20px;}

/* Dots */
.dots{
  position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
  display:flex;gap:10px;z-index:5;
}
.dot{
  width:12px;height:12px;border-radius:50%;
  background:rgba(255,255,255,0.4);cursor:pointer;transition:.3s;
}
.dot.active{background:#00c46b;}