/* === Estilos TEMPORALES para fondo dinámico en #sec-servicios === */

  #fondo-container {
    position: fixed; /* CAMBIO CLAVE */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    overflow: hidden;
    pointer-events: none; /* por si hace interferencia */
  }

  .img-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    transition: opacity 1s ease;
    z-index: -2;
  }

  .overlay {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    /*background-color: rgba(0, 0, 0, 0.35);*/
    z-index: -1;
  }

  /* Contenido encima del fondo (por ejemplo los textos de servicios) */
  .contenido-servicios {
    position: relative;
    z-index: 10;
    padding: 40px;
    text-align: center;
    color: white;
  }

  .contenido-servicios h2 {
    font-size: 36px;
    margin-bottom: 20px;
  }

  .contenido-servicios p {
    font-size: 18px;
    line-height: 1.6;
    max-width: 700px;
    margin: 0 auto;
  }
 /* CENTRADO CORRECTO DEL VIDEO EN LA SECCIÓN SERVICIOS */
#sec-servicios video.video-centro {
  position: absolute;
  top: 44%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain; /* 🔄 CAMBIO CLAVE */
  z-index: 0;
  /*filter: brightness(0.6) saturate(1.05);*/
  transition: opacity 1s ease;
}
#sec-servicios::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('fondos/fondo1.jpg') center center / cover no-repeat;
  filter: blur(20px) brightness(0.4);
  z-index: -3;
}

  /* AJUSTE RESPONSIVE PARA MÓVILES */
  @media screen and (max-width: 768px) {
    #sec-servicios video.video-centro {
      max-height: 70vh;
    }
  }