/* ==========================================================================
   CISL SIENA — CSS PAGINA: CONTATTI
   File: wp-content/mu-plugins/cisl-siena/pages/contatti/style.css
   Dipende da cisl-global, cisl-layout, cisl-pages. I campi (.cisl-field)
   riusano gli stili del popup Iscriviti (assets/css/cisl-iscriviti.css);
   scheda, modulo ed esito stanno in cisl-pages.css (sezione "Moduli").
   ========================================================================== */

/* Contatti rapidi */
.cisl-quickc {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--cisl-sp-4);
  margin: clamp(32px, 4vw, 56px) 0 0;
  padding: 0;
  list-style: none;
}
.cisl-quickc__card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  height: 100%;
  padding: var(--cisl-sp-5);
  border-radius: var(--cisl-r-md);
  background: var(--cisl-white);
  border: 1px solid var(--cisl-line);
  color: var(--cisl-ink);
  text-decoration: none;
  transition: transform 0.3s var(--cisl-ease), box-shadow 0.3s var(--cisl-ease);
}
a.cisl-quickc__card:hover { transform: translateY(-4px); box-shadow: var(--cisl-shadow-md); }
a.cisl-quickc__card:focus-visible { outline: 3px solid var(--cisl-red); outline-offset: 3px; }
.cisl-quickc__ico {
  display: grid;
  place-items: center;
  width: 46px; height: 46px;
  margin-bottom: var(--cisl-sp-2);
  border-radius: 14px;
  background: var(--cisl-green-soft);
  color: var(--cisl-green);
}
.cisl-quickc__ico .cisl-icon { width: 22px; height: 22px; }
.cisl-quickc__title { font-size: var(--cisl-fs-xs); font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cisl-muted); }
.cisl-quickc__value { font-size: var(--cisl-fs-lg); font-weight: 800; color: var(--cisl-green); word-break: break-word; }
.cisl-quickc__value a { color: var(--cisl-green); text-decoration: none; }
.cisl-quickc__value a:hover { text-decoration: underline; }
.cisl-quickc__text { font-size: var(--cisl-fs-sm); color: var(--cisl-ink-2); }

/* Prenotazione: intro a sinistra, modulo a destra */
.cisl-booking {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.cisl-booking__intro { position: sticky; top: 110px; }
.cisl-booking__intro > * + * { margin-top: var(--cisl-sp-4); }
.cisl-booking__steps { display: grid; gap: var(--cisl-sp-3); margin: var(--cisl-sp-6) 0 0; padding: 0; list-style: none; }
.cisl-booking__steps li { display: flex; align-items: center; gap: var(--cisl-sp-3); font-weight: 700; color: var(--cisl-ink-2); }
.cisl-booking__steps span,
.cisl-form__step legend span {
  display: inline-grid;
  place-items: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--cisl-red);
  color: var(--cisl-white);
  font-size: var(--cisl-fs-sm);
  font-weight: 800;
  flex: 0 0 auto;
}

/* Numeri nei titoli dei passi del modulo (verdi e più piccoli di quelli dell'introduzione) */
.cisl-form__step legend span { width: 28px; height: 28px; background: var(--cisl-green); }

/* Scheda del modulo, campi, esito: condivisi con la fascia "Hai una domanda?"
   della home → spostati in assets/css/cisl-pages.css (sezione "Moduli"). */

@media (max-width: 1000px) { .cisl-quickc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .cisl-booking { grid-template-columns: 1fr; }
  .cisl-booking__intro { position: static; }
  .cisl-booking__steps { display: none; }
}
@media (max-width: 560px) { .cisl-quickc { grid-template-columns: 1fr; } }