/* 
 * Footer Spacing Fix - SIMPLIFIED
 * Sistema de espaciado consistente y profesional
 * Elimina valores manuales y usa espaciado fluido
 * 
 * @version 2.0.0
 * @date 2026-01-27
 */

/* ============================================
   ESPACIADO CONSISTENTE CON CUSTOM PROPERTIES
   ============================================ */

:root {
  --content-footer-gap: clamp(2rem, 8vh, 4rem);
  --content-footer-gap-mobile: clamp(1.5rem, 6vh, 3rem);
}

/* ============================================
   ESPACIADO PRINCIPAL DEL FOOTER
   ============================================ */

#footer-container,
.footer-placeholder {
  margin-top: var(--content-footer-gap);
}

.footer,
footer {
  margin-top: 0; /* El espaciado lo maneja el contenedor */
}

/* ============================================
   ESPACIADO PARA CONTENIDO PRINCIPAL
   ============================================ */

main {
  margin-bottom: var(--content-footer-gap);
}

/* Secciones específicas que necesitan espaciado */
.main__tabs,
.section--3,
.gober_asg_content {
  margin-bottom: clamp(1rem, 4vh, 2rem);
}

/* ============================================
   RESPONSIVE CON CONTAINER QUERIES
   ============================================ */

@container (max-width: 768px) {
  #footer-container,
  .footer-placeholder {
    margin-top: var(--content-footer-gap-mobile);
  }
  
  main {
    margin-bottom: var(--content-footer-gap-mobile);
  }
}

/* ============================================
   FALLBACK MEDIA QUERIES
   ============================================ */

@supports not (container-type: inline-size) {
  @media (max-width: 768px) {
    #footer-container,
    .footer-placeholder {
      margin-top: var(--content-footer-gap-mobile);
    }
    
    main {
      margin-bottom: var(--content-footer-gap-mobile);
    }
  }
}

/* ============================================
   CORRECCIONES ESPECÍFICAS PARA PÁGINAS PROBLEMÁTICAS
   ============================================ */

/* Lo que hacemos - elementos con position absolute */
.loque__bg {
  position: relative;
  z-index: -1;
  margin-bottom: var(--content-footer-gap);
}

/* Páginas con elementos flotantes */
.lo-que-hacemos-page #footer-container,
.lo-que-hacemos-page .footer-placeholder {
  margin-top: clamp(4rem, 12vh, 8rem);
  position: relative;
  z-index: 10;
}

/* ============================================
   ELIMINACIÓN DE ESTILOS PROBLEMÁTICOS
   ============================================ */

/* Remover clases específicas que causaban problemas */
.footer--nosotros,
.footer--equipo,
.footer--portfolio,
.footer--historia,
.footer--contacto,
.footer--loque {
  margin-top: 0 !important; /* Resetear valores manuales */
}