/** Copyright (c) 2026 Protocol-Z. All rights reserved. Proprietary and Confidential. **/

/*
    IL PIEDE DI PAGINA, IN UN FOGLIO SUO.

    Stava dentro corporate.css, che la dashboard non carica: per avere lo stesso piede li'
    bisognava ricopiarne le regole, e due copie divergono sempre. Qui e' un foglio solo, che
    caricano sia le pagine pubbliche sia la dashboard.

    Le regole si appoggiano ai soliti gettoni del sito. La dashboard, che ha i suoi, li fa
    corrispondere in un blocco limitato a `footer`: e' l'unico punto in cui i due sistemi si
    toccano, e il resto dell'applicazione non se ne accorge.
*/

/* --- Piede di pagina ---------------------------------------------------------------- */
/*
    Il contenitore segue i gettoni del sito dove ci sono, e ha i suoi dove non ci sono: sulle
    pagine pubbliche `--gutter` e `--maxw` cambiano ai punti di rottura e il piede li segue da
    solo, sulla dashboard non esistono e restano i valori di ripiego, che sono quelli di base.
*/
footer .wrap { width: min(100% - var(--gutter, 40px), var(--maxw, 1200px)); margin-inline: auto; }
footer { border-top: 1px solid var(--border); padding: var(--sp-3) 0 var(--sp-2); color: var(--text-tertiary); font-size: 14.5px; }
.footer-griglia {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) repeat(3, minmax(0, 1fr));
    gap: var(--sp-2);
    padding-bottom: var(--sp-3);
}
/* Sotto le tre colonne di collegamenti non ci stanno in fila, ma a due per riga la terza
   resta sola in un angolo: si passa direttamente a una, che e' l'unica ripartizione senza
   avanzi con tre elementi. */
@media (max-width: 900px) {
    .footer-griglia { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .footer-marchio { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .footer-griglia { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
}
/*
    La marca dentro il piede si veste qui.

    Le regole di `.brand` stanno in corporate.css insieme all'intestazione, e la dashboard
    quel foglio non lo carica: li' il marchio del piede restava senza allineamento, senza
    spazio fra segno e nome e con l'immagine larga quanto capitava. Sono gli stessi valori,
    limitati al piede, quindi sulle pagine pubbliche non cambia niente.
*/
footer .brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.02em;
    white-space: nowrap;
    color: var(--text);
}
/* Il file ha rapporto 2,28: si fissa l'altezza e la larghezza segue. */
footer .brand img { height: 24px; width: auto; display: block; }

.footer-marchio p { margin: 12px 0 18px; max-width: 34ch; color: var(--text-tertiary); font-size: 14px; }
.footer-col h2 {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-secondary);
    margin: 0 0 12px;
}
.footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
footer a { text-decoration: none; color: var(--text-tertiary); transition: color 0.25s var(--ease); }
footer a:hover { color: var(--text); }
footer a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }

.social { display: flex; gap: 8px; }
.social a {
    display: grid;
    place-items: center;
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--surface);
    transition: color 0.25s var(--ease), border-color 0.25s var(--ease), background 0.25s var(--ease);
}
.social a:hover { color: var(--text); border-color: var(--border-strong); background: var(--surface-strong); }
.social svg { width: 16px; height: 16px; fill: currentColor; }

/* La bandiera si allinea al centro del testo, non alla sua linea di base. */
.coda-sede { display: inline-flex; align-items: center; gap: 8px; }
.coda-sede img { display: block; border-radius: 2px; }
.footer-coda {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    align-items: center;
    justify-content: space-between;
    padding-top: var(--sp-2);
    border-top: 1px solid var(--border);
    font-size: 13.5px;
}
/* Le pagine legali usano ancora un piede su una riga: sono pagine di servizio. */
footer .wrap > nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
