/* Asegúrate de que el HTML y Body tengan 100% de altura */
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
/* El 'pusher' debe ser un contenedor flex que ocupe toda la altura */
.pusher {
  display: flex;
  flex-direction: column;
  /* Organiza los elementos hijos en columna */
  min-height: 100%;
  /* Asegura que el pusher tenga al menos el 100% de la altura del padre (body) */
}
/* El 'header' fijo puede necesitar un padding en el .section para no superponerse */
.header {
  /* Si es fijo, su altura no afectará directamente el flex-grow del .section */
  /* Asegúrate de que no tenga un height fijo que genere un espacio extra indeseado */
}
/* La 'section' es el contenedor principal del contenido y el footer */
.section {
  flex-grow: 1;
  /* Esto es CLAVE: hace que la sección crezca y ocupe todo el espacio restante */
  display: flex;
  flex-direction: column;
  /* Para que el article y el footer se apilen */
  /* Calcula el alto de la sección para compensar el header superior */
  /* Ajusta '60px' a la altura real de tu .ui.top.fixed.inverted.menu */
  min-height: calc(100vh - 52.6px);
  background-color: #e6f7ff !important;
}
/* El 'article' debe crecer para ocupar el espacio ANTES del footer */
.article {
  flex-grow: 1;
  /* Esto hace que el artículo ocupe todo el espacio vertical disponible */
  display: flex;
  /* Para centrar el contenido del 404 dentro de este artículo */
  align-items: center;
  /* Centrado vertical */
  justify-content: center;
  /* Centrado horizontal */
}
/* El footer se posicionará automáticamente al final del .section */
.footer {
  /* Tus estilos de footer existentes. No necesita cambios específicos de flexbox aquí */
  flex-shrink: 0;
  /* Asegura que el footer no se encoja si hay poco espacio */
}
/* Finalmente, el contenedor del 404 dentro del article */
.ui.vertical.masthead.center.aligned.segment {
  min-height: auto;
  /* Permite que su altura sea determinada por su contenido y el flexbox de su padre */
  padding: 2em 0;
  /* Asegura un buen padding superior e inferior si el contenido es pequeño */
}