/* Footer — componente riusabile.
   Consuma solo variabili neutre (--footer-*, --font-*): per riusarlo basta
   copiare questo file, rispettare il markup (vedi assets/README.md) e
   definire le variabili. Include l'ancoraggio al fondo della viewport. */

/* Ancoraggio: il footer resta al fondo anche su pagine corte */
body {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

main { flex: 1 0 auto; }

.site-footer {
  position: relative;
  z-index: 1;
  margin-top: auto;
  background: var(--footer-bg);
  color: var(--footer-fg);
  padding: clamp(2rem, 6vw, 4rem) clamp(1rem, 4vw, 3rem) 2rem;
  overflow: hidden;
}

/* Riga superiore del footer: wordmark a sinistra, colofone in alto a destra */

.site-footer__top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem 2.5rem;
  margin-bottom: clamp(1.5rem, 4vw, 3rem);
}

.site-footer__wordmark {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 0.8;
  font-size: clamp(4rem, 19vw, 17rem);
  color: var(--footer-accent);
  margin: 0;
  user-select: none;
}

.site-footer__cols {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1.5rem;
  border-top: 1px solid var(--footer-divider);
  padding-top: 1.5rem;
}

.site-footer__menu {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__menu a {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.78rem;
  color: var(--footer-fg);
  text-decoration: none;
}

.site-footer__menu a:hover,
.site-footer__menu a:focus-visible { color: var(--footer-accent); }

.site-footer__copy {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0;
  opacity: 0.7;
}

/* Colofone (alto a destra) + riga sviluppatore */

.site-footer__org {
  margin: 0.4rem 0 0;
  text-align: right;
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.03em;
  line-height: 1.8;
  color: var(--footer-fg);
  opacity: 0.72;
}

.site-footer__org dt {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.68rem;
  color: var(--footer-accent);
  margin-bottom: 0.5rem;
}

.site-footer__org dt span {
  opacity: 0.6;
  color: var(--footer-fg);
}

.site-footer__org dd {
  margin: 0;
}

.site-footer__org strong {
  font-weight: 500;
  color: var(--footer-fg);
}

.site-footer__meta {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.site-footer__legal {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  opacity: 0.7;
}

.site-footer__legal a {
  color: var(--footer-fg);
  text-decoration: none;
}

.site-footer__legal a:hover,
.site-footer__legal a:focus-visible { color: var(--footer-accent); }

.site-footer__dev {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--footer-fg);
  opacity: 0.45;
}

/* Su schermi stretti il colofone si allinea a sinistra sotto il wordmark */
/* stylelint-disable-next-line media-feature-range-notation */
@media (max-width: 640px) {
  .site-footer__org,
  .site-footer__meta { text-align: left; }
}