.main-footer {
  background-color: #0b0b0b;   /* Un tono negro más profundo para marcar el fin de la página */
  padding: 32px 24px;
  border-top: 1px solid #222;  /* Una sutil línea divisoria oscura */
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.footer-container {
  max-width: 1200px;
  width: 100%;
  display: flex;
  justify-content: space-between; /* Créditos a la izquierda, enlaces a la derecha */
  align-items: center;
  flex-wrap: wrap;             /* Si la pantalla es pequeña (celular), los elementos se apilan solos */
  gap: 16px;
}

.footer-credits {
  color: #63ddb23b;            /* Un color grisáceo apagado para los derechos de autor */
  color: #718096;
  font-size: 14px;
}

.footer-links {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* El diseño de tus links legales */
.footer-link {
  color: #a0aec0;              /* Color gris suave por defecto */
  font-size: 14px;
  text-decoration: none;       /* Sin subrayado inicial */
  transition: color 0.2s ease;
}

/* Efecto hover elegante al pasar el cursor */
.footer-link:hover {
  color: #c49a00;              /* Se ilumina con el dorado característico de Finzaly */
  text-decoration: underline;  /* Se subraya para denotar que es cliqueable */
}

.footer-separator {
  color: #4a5568;              /* Color tenue para la barra separadora "|" */
  font-size: 12px;
  user-select: none;           /* Evita que el usuario seleccione la barra por error al copiar texto */
}