/* ================= HERO SLIDER ================= */

/* Slider özü 960 qutu içində */
.hero-slide{
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  height: 420px;
  overflow: hidden;
  background: #000;
}

/* Şəkil artıq full çıxmayacaq */
.hero-slide__bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-size: cover;
  background-position: center;
}

/* Overlay */
.hero-slide__overlay{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: linear-gradient(
    to top,
    rgba(0,0,0,.70) 0%,
    rgba(0,0,0,.25) 55%,
    rgba(0,0,0,.05) 100%
  );
}

/* Mətn */
.hero-slide__content{
  position:absolute;
  left:20px;
  right:20px;
  bottom:20px;
  z-index:2;
}

/* Title */
.hero-slide__title{
  margin:0;
  color:#fff;
  font-weight:800;
  line-height:1.2;
  text-shadow:0 10px 30px rgba(0,0,0,.55);
  font-size: clamp(18px, 2vw, 34px);
}

/* Oxlar */
.hero-slide__nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  z-index:3;
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(0,0,0,.25);
  color:#fff;
  font-size:26px;
  display:grid;
  place-items:center;
  cursor:pointer;
}

.hero-slide__nav--left{
  left:10px;
}

.hero-slide__nav--right{
  right:10px;
}

/* Mobile */
@media (max-width:960px){
  .hero-slide{
    height:300px;
  }
}
/* ================= MOBILE OPTIMIZATION ================= */

@media (max-width: 768px){

  .hero-slide{
    height: 260px;
    border-radius: 12px;
  }

  /* Overlay daha yumşaq */
  .hero-slide__overlay{
    background: linear-gradient(
      to top,
      rgba(0,0,0,.65) 0%,
      rgba(0,0,0,.25) 60%,
      rgba(0,0,0,.05) 100%
    );
  }

  /* Mətn */
  .hero-slide__content{
    left:16px;
    right:16px;
    bottom:16px;
  }

  .hero-slide__title{
    font-size:18px;
    line-height:1.3;
  }

  /* Oxlar */
  .hero-slide__nav{
    width:36px;
    height:36px;
    font-size:20px;
    background:rgba(0,0,0,.35);
    border:1px solid rgba(255,255,255,.25);
  }

  .hero-slide__nav--left{ left:8px; }
  .hero-slide__nav--right{ right:8px; }
}
@media (max-width: 480px){

  .hero-slide{
    height: 220px;
  }

  .hero-slide__title{
    font-size:16px;
    line-height:1.35;
  }

  .hero-slide__content{
    bottom:12px;
  }

  /* Oxlar çox dominant olmasın */
  .hero-slide__nav{
    width:32px;
    height:32px;
    font-size:18px;
  }

}
@media (max-width: 480px){
  .hero-slide__nav{
    top:auto;
    bottom:50%;
    transform: translateY(50%);
  }
}