/* --- Titanium: correzioni strutturali comuni a tutto il sito --- */
/*
   Foglio caricato da TUTTE le pagine pubbliche: home, 12 hub silo,
   57 landing territoriali e 10 pagine di servizio .php.

   Contiene solo correzioni di struttura che valgono ovunque, cosi' restano
   in un punto solo invece di essere ripetute foglio per foglio. Qui NON
   vivono colori, spaziature di design o componenti: quelle restano nei
   rispettivi fogli (titanium-base, titanium-ux, titanium-landing, footer).

   Deve essere caricato DOPO bootstrap.min.css: corregge regole di Bootstrap
   con selettori piu' specifici, quindi l'ordine non e' puramente estetico.
*/

/* ---------------------------------------------------------------------------
   Scorrimento orizzontale sotto i 768 px
   ---------------------------------------------------------------------------
   Il gutter orizzontale di Bootstrap (.g-5 = 3rem) si trasforma in margini
   negativi di -1,5rem per lato sulla .row. Dentro un .container, che ha solo
   12 px di padding, la riga sborda di 12 px: la pagina si lascia trascinare
   di lato e sul telefono compare una striscia vuota sul bordo destro.

   Sotto i 768 px il gutter torna a 1,5rem, quindi il margine negativo e'
   di -0,75rem = esattamente il padding del container e lo sbordamento
   sparisce. Da 768 px in su la regola non agisce: il layout desktop,
   che su .g-5 e' gia' corretto e verificato, resta identico.

   Segno 1: scrollWidth - clientWidth = 12px su tutte le pagine.
   Segno 2: barra di scorrimento orizzontale in fondo alla finestra.
--------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    .row.g-5,
    .row.gx-5,
    .gx-5 {
        --bs-gutter-x: 1.5rem;
    }
}

/* ---------------------------------------------------------------------------
   Sbordamento di 4 px sui caroselli (.swipe-container)
   ---------------------------------------------------------------------------
   Il carosello su mobile esce dal .container con padding per far intrare la
   prima card a meta' schermo: usa margin-left: -1rem (16 px) contro i 12 px
   di padding del container. Il lato sinistro e' voluto, quello destro
   pero' restava 4 px oltre il bordo dello schermo e faceva scorrere la
   pagina di lato anche qui.

   Si pareggia il lato destro al gutter della riga (12 px = 0.75rem): il
   carosello arriva esattamente al bordo, che e' l'effetto voluto, e la
   pagina non si trascina piu'. Solo sotto i 768 px, dove vale la regola.
--------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    .swipe-container {
        margin-right: -0.75rem !important;
    }
}