/* ===========================================================================
   CONTATTI — impaginazione della sola pagina contatti.php
   ---------------------------------------------------------------------------
   Qui dentro c e SOLO cio che riguarda questa pagina: la griglia (modulo a
   sinistra, sedi a destra) e i blocchi delle sedi. Il vocabolario dei moduli
   — campi, etichette, errori, esito d invio — NON e piu qui: e stato portato
   in `impaginato.css` fra i componenti condivisi, perche lo usano cinque
   pagine (questa e le quattro dell area riservata) e questo foglio, col nome
   di una pagina sola, era il posto sbagliato per tenerlo.

   Va caricato dopo `impaginato.css` e dopo `interne.css`.

   Le mappe incorporate (due iframe Google Maps) sono state rimosse: erano un
   embed di terzi che avrebbe richiesto un banner di consenso cookie, per un
   contenuto che il link "Indicazioni" — gia presente, verso Google Maps in
   una scheda nuova — copre gia senza inserire nulla di terze parti.
   =========================================================================== */

.impaginato .pg-contact { padding-block: var(--s1) var(--s3); }

.impaginato .pg-contact-form {
  grid-column: col 1 / col 8;
  grid-row: 1;
}
.impaginato .pg-contact-form h2 { margin-bottom: 28px; }

/* ---------------------------------------------------------------------------
   SEDI — aside, non un'altra colonna di card. Tre blocchi, un filetto sopra
   ciascuno tranne il primo: stesso principio delle righe altrove nel sito.
   --------------------------------------------------------------------------- */
.impaginato .pg-contact-aside {
  grid-column: col 9 / c-end;
  grid-row: 1;
}
.impaginato .contact-block { padding-block: 22px; border-top: 1px solid var(--rule); }
.impaginato .contact-block:first-child { padding-top: 0; border-top: 0; }
.impaginato .contact-block h3 { font-size: var(--fs-sottotitolo); margin-bottom: 10px; }
.impaginato .contact-block p { font-size: var(--fs-corpo); color: var(--imp-text-mid); line-height: 1.6; }
.impaginato .contact-block p + p { margin-top: 6px; }
.impaginato .contact-role {
  display: block;
  font-size: var(--fs-etichetta) !important;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--imp-orange-ink) !important;
  margin-bottom: 8px;
}
.impaginato .contact-block .lnk { margin-top: 10px; }

/* ===========================================================================
   RESPONSIVE
   =========================================================================== */
@media (max-width: 1080px) {
  .impaginato .pg-contact-form  { grid-column: col 1 / col 8; }
  .impaginato .pg-contact-aside { grid-column: col 8 / c-end; }
}

@media (max-width: 720px) {
  .impaginato .pg-contact { padding-block: var(--s1) var(--s2); }
  .impaginato .pg-contact-form,
  .impaginato .pg-contact-aside { grid-column: col 1 / c-end; }
  .impaginato .pg-contact-aside { grid-row: 2; margin-top: var(--s2); }
}