/* footer.css */

.site-footer {
    background-color: #222; /* Fondo oscuro, a juego con el header */
    color: #CCC;
    text-align: center;
    padding: calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 2);
    margin-top: calc(var(--spacing-unit) * 4); /* Espacio superior */
    border-top: 3px solid var(--primary-color); /* Borde de color primario */
    font-size: 0.9rem;
}

.site-footer a {
    color: var(--secondary-color);
}

.site-footer a:hover {
    color: var(--primary-color);
}

@media (max-width: 768px) {
    .site-footer {
        padding: calc(var(--spacing-unit) * 1.5) var(--spacing-unit);
        margin-top: calc(var(--spacing-unit) * 2);
    }
}