#services {

  background-color: #BD0016  !important; /* Rojo */

  padding: 60px 15px !important;

}



.fullscreen-section {

  min-height: 100vh;         /* altura mínima igual al alto del navegador */

  display: flex;

  flex-direction: column;

  justify-content: center;   /* centra verticalmente */

  align-items: center;       /* centra horizontalmente si lo deseas */

  padding: 40px 20px;        /* espacio interior */

  box-sizing: border-box;

}



.serv-grid {

  display: grid !important;

  grid-template-columns: repeat(2, 1fr) !important;

  gap: 20px !important;

  max-width: 900px !important;

  margin: -10px auto !important;

  font-family: 'Segoe UI', sans-serif !important;

}



.serv-card {

  position: relative !important;

  overflow: hidden !important;

  border-radius: 10px !important;

  height: 300px !important;

}



.serv-card img {

  width: 100% !important;

  height: 100% !important;

  object-fit: cover !important;

  vertical-align: middle !important;

}



.serv-overlay {

  position: absolute !important;

  bottom: 0 !important;

  background: rgba(255, 255, 255, 0.95) !important;

  width: 100% !important;

  color: #BD0016 !important;

  padding: 15px !important;

  text-align: center !important;

  transition: all 0.3s ease !important;

  height: 50px !important;

  overflow: hidden !important;

}



.serv-card:hover .serv-overlay {

  height: 100% !important;

  display: flex !important;

  flex-direction: column !important;

  justify-content: center !important;

}



.serv-overlay h3 {

  margin: 0 !important;

  font-size: 14px !important;

  font-weight: bold !important;

  color: #BD0016 !important;

}



.serv-overlay p {

  margin: 0;

  line-height: 1.4;

  margin-top: 10px !important;

  font-size: 15px !important;

  display: none !important;

  color: #BD0016 !important; 

  max-height: 100%; /* evita que crezca más que el contenedor */

  overflow-y: auto; /* agrega scroll interno si es necesario */

}



.serv-card:hover .serv-overlay p {

  display: block !important;

}



@media (max-width: 600px) {

  .serv-grid {

    grid-template-columns: 1fr !important;

  }

}