.ate-gallery{
  width:100%;
  background:#E1D59F;
  padding:110px 20px;
  position:relative;
  overflow:hidden;
}

.ate-gallery-wrap{
  max-width:1200px;
  width:100%;
  margin:0 auto;
}

.ate-gallery-head{
  text-align:center;
  max-width:920px;
  margin:0 auto 55px;
}

.ate-gallery-head span{
  display:inline-flex;
  background:#2C061F;
  color:#E1D59F;
  padding:10px 20px;
  border-radius:999px;
  font-family:'Inter', sans-serif;
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:1px;
  margin-bottom:20px;
}

.ate-gallery-head h2{
  margin:0 0 20px;
  font-family:'Cinzel', serif;
  font-size:46px;
  line-height:1.08;
  color:#2C061F;
}

.ate-gallery-head p{
  margin:0 auto;
  max-width:820px;
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.7;
  color:#1E293B;
}

.ate-gallery-filter{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:16px;
  margin-bottom:36px;
}

.ate-gallery-btn{
  border:0;
  background:#FFFFFF;
  border-radius:14px;
  padding:18px 18px;
  text-align:left;
  cursor:pointer;
  box-shadow:0 14px 35px rgba(44,6,31,0.12);
  transition:0.3s ease;
}

.ate-gallery-btn span{
  display:block;
  font-family:'Inter', sans-serif;
  font-size:16px;
  font-weight:900;
  color:#2C061F;
  margin-bottom:5px;
}

.ate-gallery-btn small{
  display:block;
  font-family:'Inter', sans-serif;
  font-size:13px;
  font-weight:700;
  color:#374045;
}

.ate-gallery-btn:hover,
.ate-gallery-btn.active{
  background:#2C061F;
  transform:translateY(-4px);
}

.ate-gallery-btn:hover span,
.ate-gallery-btn.active span{
  color:#FFFFFF;
}

.ate-gallery-btn:hover small,
.ate-gallery-btn.active small{
  color:#D89216;
}

.ate-gallery-grid{
  position:relative;
  min-height:620px;
}

.ate-gallery-card{
  display:none;
  position:relative;
  width:100%;
  height:620px;
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 28px 80px rgba(44,6,31,0.25);
  animation:ateGalleryFade 0.45s ease;
}

.ate-gallery-card.active{
  display:block;
}

.ate-gallery-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:0.5s ease;
}

.ate-gallery-card:hover img{
  transform:scale(1.06);
}

.ate-gallery-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.72));
  z-index:1;
}

.ate-gallery-overlay{
  position:absolute;
  left:45px;
  bottom:42px;
  z-index:2;
  color:#FFFFFF;
}

.ate-gallery-overlay span{
  display:inline-flex;
  align-items:center;
  background:#D89216;
  color:#2C061F;
  padding:8px 14px;
  border-radius:999px;
  font-family:'Inter', sans-serif;
  font-size:14px;
  font-weight:900;
  margin-bottom:16px;
}

.ate-gallery-overlay h3{
  margin:0;
  font-family:'Cinzel', serif;
  font-size:36px;
  line-height:1.1;
  color:#FFFFFF;
  max-width:700px;
}

@keyframes ateGalleryFade{
  from{
    opacity:0;
    transform:translateY(15px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media(max-width:991px){
  .ate-gallery{
    padding:90px 18px;
  }

  .ate-gallery-head h2{
    font-size:42px;
  }

  .ate-gallery-filter{
    grid-template-columns:repeat(2, 1fr);
  }

  .ate-gallery-grid{
    min-height:520px;
  }

  .ate-gallery-card{
    height:520px;
  }
}

@media(max-width:767px){
  .ate-gallery{
    padding:75px 16px;
  }

  .ate-gallery-head h2{
    font-size:34px;
  }

  .ate-gallery-head p{
    font-size:16px;
  }

  .ate-gallery-filter{
    grid-template-columns:1fr;
  }

  .ate-gallery-grid{
    min-height:430px;
  }

  .ate-gallery-card{
    height:430px;
    border-radius:20px;
  }

  .ate-gallery-overlay{
    left:24px;
    right:24px;
    bottom:28px;
  }

  .ate-gallery-overlay h3{
    font-size:30px;
  }
}