.faq {
   scroll-margin-top: 208px;
   width: calc(100% - 40px);
   max-width: 1073px;
   margin: 208px auto 100px;
}

header .wrapper nav ul li a {
   text-decoration: none;
}

footer {
   background: none;
}

.tabla {
   width: 100%;
   margin-bottom: 1rem;
   color: #212529;
   border-collapse: collapse;
}

.tabla th,
.tabla td {
   padding: 0.75rem;
   vertical-align: top;
   border-top: 1px solid #dee2e6;
}

.tabla thead th {
   vertical-align: bottom;
   border-bottom: 2px solid #dee2e6;
}

.tabla tbody+tbody {
   border-top: 2px solid #dee2e6;
}

/* Bordes en todos los lados (similar a .table-bordered) */
.tabla-borde {
   border: 1px solid #dee2e6;
}

.tabla-borde th,
.tabla-borde td {
   border: 1px solid #dee2e6;
}

.tabla-borde thead th,
.tabla-borde thead td {
   border-bottom-width: 2px;
}

/* Tabla responsiva (similar a .tabla-responsiva) */
.tabla-responsiva {
   display: block;
   width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
}

/* Versión responsiva con diferentes breakpoints (como Bootstrap) */
/* Para móviles (<576px) */
.tabla-responsiva-sm {
   display: block;
   width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
}

/* Para tablets (<768px) */
@media (max-width: 767.98px) {
   .tabla-responsiva-md {
      display: block;
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
   }
}

/* Para desktop pequeño (<992px) */
@media (max-width: 991.98px) {
   .tabla-responsiva-lg {
      display: block;
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
   }
}

/* Para desktop grande (<1200px) */
@media (max-width: 1199.98px) {
   .tabla-responsiva-xl {
      display: block;
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
   }
}

/* Estilos adicionales útiles */
/* Filas con rayas (como .table-striped) */
.tabla-rayas tbody tr:nth-of-type(odd) {
   background-color: rgba(0, 0, 0, 0.05);
}

/* Hover sobre filas (como .table-hover) */
.tabla-hover tbody tr:hover {
   background-color: rgba(0, 0, 0, 0.075);
}

/* Tablas más compactas (como .table-sm) */
.tabla-compacta th,
.tabla-compacta td {
   padding: 0.3rem;
}

footer .footer-gasco {
   background: url("assets/img/2025/f-Medidor-1920-8.png");
   background-repeat: no-repeat;
   background-position: center -38px;
   /* Corregido para mejor posicionamiento */
   background-size: cover;
   width: 100%;
   height: 370px;
   display: flex;
   align-items: flex-end;
   /* Alinea el contenido hacia abajo */
   padding-bottom: 20px;
   /* Espacio en la parte inferior */
}

footer .legal-011 {
   color: #fff;
   font-size: 13px;
   padding-left: 38px;
   padding-top: 20px;
}

footer .legal-011 a {
   color: #fff;
   text-decoration: underline;
}

footer .logo-granel {
   margin-bottom: 30px;
   /* Ajusta según necesites para alinear con el texto */
}

@media screen and (max-width: 1366px) {
   footer .footer-gasco {
      background-position: center 0;
      height: auto;
      min-height: 351px;
   }

   footer .legal-011 {
      padding-left: 20px;
      /* Un poco de padding en lugar de 0 */
      padding-top: 30px;
      /* Reducido pero no eliminado completamente */
      font-size: 12px;
      /* Letra ligeramente más pequeña */
   }
}

@media screen and (max-width: 768px) {
   footer .footer-gasco {
      min-height: 200px;
   }

   footer .legal-011 {
      padding-left: 15px;
      padding-top: 150px;
      font-size: 11px;
      text-align: justify;
   }

   footer .legal-011 a {
      color: #fff;
      text-decoration: underline;
   }


   footer .logo-granel {
      display: none;
   }
}

@media screen and (max-width: 499px) {
   footer .footer-gasco {
      min-height: 200px;
   }

   footer .legal-011 {
      padding-left: 0;
      padding-top: 192px;
      font-size: 11px;
      text-align: justify;
   }

   footer .logo-granel {
      margin-bottom: 20px;
      max-width: 80px;
      /* Ajustar tamaño del logo en móviles */
      margin-left: auto;
      margin-right: 15px;
   }
}