/* Fonts */
:root {
  --default-font: "Poppins", sans-serif;
  --heading-font: "Poppins", sans-serif;
  --nav-font: "Poppins", sans-serif;
  --nav-banner:'Poppins', sans-serif;
}

body{
  margin:0;
  font-family:"Poppins", sans-serif;
  background:#f5f6f8;
}

.services-section{
  min-height:370vh;
  padding:1px 1%;
  padding-bottom: 50px;
}

.title{
  font-size:48px;
  color:#1e2a36;
}

.subtitle{
  color:#5a6773;
  margin-bottom:40px;
}

.slider{
  width: 100%;
  position:sticky;
  top:120px;
  overflow:hidden;

}

.slides{
  display:flex;
  align-items:stretch;
  gap:30px;
  will-change: transform;
}



.card{
  min-width:390px;
  height:350px;
  position:relative;
  border-radius:2px;
  border-color: #000;
  overflow:hidden;
  flex-shrink:0;
  cursor:pointer;
}

.card::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.35);
  z-index:1;
  transition:background .4s ease;
}

.card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s ease;
}

.card:hover img{
  transform:scale(1.15);
}

.card:hover::before{
  background:rgba(0,0,0,0.45);
}

.overlay{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  padding:20px;
  color:#fff;
  z-index:2;
}


.overlay h3{
  font-size:18px;
  margin-bottom:10px;
}


.services{
  list-style:none;
  padding:0;
  margin:0 0 0px 0;
  font-size:14px;
}

.services li{
  margin-bottom:3px;
}

.actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  font-size:16px;
  font-weight:700;
animation:fadeUp 2.5s ease;
}

@keyframes fadeUp{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}
.actions span{
  color:#D7A84A; /* verde elegante */

}


@media (max-width: 768px){

.services-section{
  min-height:260vh;
  padding:40px 5%;

}

.title{
  font-size:32px;
}

.slider{
  top:80px;
}

.slides{
  gap:20px;
}

.slides{
  will-change: transform;
}

.card{
  min-width:85vw; /* se adapta al ancho del teléfono */
  height:380px;
}

.overlay h3{
  font-size:16px;
}

.services{
  font-size:13px;
}

.actions{
  font-size:14px;
}

}

@media (max-width:768px){

.slider{
  overflow-x:auto;
  scroll-snap-type:x mandatory;
}

.card{
  scroll-snap-align:start;
}

}

@media (max-width:768px){

.services-section{
  padding:40px 16px;
}

.slider{
  top:70px;
}

.slides{
  gap:16px;
}

.card{
  min-width:calc(100vw - 32px); /* ocupa todo el ancho visible */
  height:250px;
}

}

.card{
  min-width:400px;
  height:450px;
  position:relative;
  border-radius:2px;
  overflow:hidden;
  flex-shrink:0;
  cursor:pointer;

  transition: transform .4s ease, opacity .4s ease;
  opacity:0.6;
  transform:scale(0.92);
}

.card.active{
  transform:scale(1);
  opacity:1;
}

.card.active{
  transform:scale(1);
  opacity:1;
  box-shadow:0 20px 50px rgba(0,0,0,0.25);
}

@media (max-width:768px){

.card{
  opacity:1;
  transform:scale(1);
}

}

@media (max-width:768px){

.card{
  min-width:calc(100vw - 32px);
  height:360px;

  opacity:1;
  transform:scale(1);
  transition:none;
}

.card.active{
  transform:none;
  opacity:1;
}

}