.faq-container{
  text-align: center;
}

.slider{
    display:flex;
    gap:1rem;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
}

.slider::-webkit-scrollbar{
  height:5px;
}

.slider::-webkit-scrollbar-thumb{
    background:var(--color-brown);
    border-radius:10px;
}
.packages-section{
  text-align: center;
  padding: 1em;
}
.packages-card{
    flex:0 0 75%;
    background:var(--color-white);
    border-radius:14px;
    overflow:hidden;
    scroll-snap-align:start;
    border: 5px solid var(--color-brown);
}

.packages-card img{
    width:100%;
    height:180px;
    object-fit:cover;
    
}

.packages-card-content{padding:1rem}


.packages-price{
    display:flex;
    align-items:center;
    gap:.4rem;
    color:var(--color-lightblue);
    justify-content: center;
    padding: 1em;
}

.packages-price img{
  width:2em;
  height:2em
}

.more-btn{
    background:var(--color-brown);
    color:#fff;
    border:none;
    padding:.5rem .9rem;
    border-radius:20px;
}

@media(min-width:900px){
    .packages-card{flex:0 0 28%} /* ~3.5 cards visible */
}

/* Modal */
.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:200;
  text-align: center;
}

.modal.active{display:flex}

.modal-content{
  background:#fff;
  width:90%;
  max-width:520px;
  padding:1.75rem;
  border-radius:18px;
  position:relative;
}

.modal-content p{
  padding: 1em;
}

.modal-close{
  position:absolute;
  top:12px;
  right:14px;
  border:none;
  background:none;
  cursor:pointer;
}