/* ESPINASSE · css/gravity-forms.css
   Markup di Gravity Forms (2.5+) con lo stile dei form del prototipo. Il CSS di Gravity Forms è disattivato (inc/gf-setup.php).
   .esp-gf        contenitore di tutti i form del tema
   .esp-gf--lead  form "Raccontaci cosa cerchi" (landing): sezioni numerate, chips, consenso
   .esp-gf--faq   form "Fai la tua domanda" (FAQ)
   Classi da assegnare ai campi in Gravity Forms (Aspetto → Classe CSS): esp-chips sui campi a scelta singola. */

/* ---------- Elementi di servizio di Gravity Forms ---------- */
.esp-gf .gform_validation_container,.esp-gf .gfield--type-honeypot,.esp-gf .gform_hidden,.esp-gf .gfield_visibility_hidden,
.esp-gf .gform_required_legend,.esp-gf .gform_heading,.esp-gf iframe[name^="gform_ajax_frame"]{display:none!important}
.esp-gf .screen-reader-text,.esp-gf .hidden_label>.gfield_label,.esp-gf .gfield--type-consent>.gfield_label{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0);white-space:nowrap;border:0!important;padding:0!important;margin:-1px!important}
/* contatore caratteri dei campi con lunghezza massima (CAP, P.IVA): il limite resta, il contatore no */
.esp-gf .ginput_counter{display:none!important}
.esp-gf .gform_ajax_spinner{width:22px;height:22px;margin-left:6px}

/* ---------- Griglia: due colonne, i campi "metà larghezza" (Aspetto → Larghezza) affiancati ---------- */
.esp-gf .gform_fields{display:grid;grid-template-columns:1fr 1fr;gap:22px 20px}
.esp-gf .gfield{grid-column:1/-1;min-width:0;margin:0;padding:0;border:0}
.esp-gf .gfield--width-half{grid-column:span 1}

/* ---------- Etichette dei campi di testo: come .field>span ---------- */
.esp-gf .gfield:not(fieldset)>.gfield_label{display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;font-weight:700;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--nero)}
.esp-gf .gfield:not(fieldset)>.gfield_label::before{content:'';width:7px;height:7px;background:var(--rosso);flex:0 0 auto}
.esp-gf .gfield_required{color:var(--rosso);margin-left:2px}
.esp-gf .gfield_required .gfield_required{margin:0}

/* ---------- Domande a scelta (fieldset + legend): come .q ---------- */
.esp-gf fieldset.gfield>.gfield_label{display:block;float:none;width:100%;padding:0;margin:0 0 12px;font-weight:700;font-size:17px;color:var(--nero)}

/* ---------- Input ---------- */
.esp-gf input[type=text],.esp-gf input[type=email],.esp-gf input[type=tel],.esp-gf input[type=number],.esp-gf textarea{font-family:var(--body);font-size:17px;font-weight:400;letter-spacing:0;text-transform:none;background:#fff;border:1.5px solid rgba(27,27,27,.28);border-radius:14px;padding:0 18px;height:58px;color:var(--nero);outline:none;width:100%;transition:border-color .2s,box-shadow .2s,background .2s}
.esp-gf textarea{resize:vertical;min-height:150px;height:auto;padding:16px 18px;line-height:1.5}
.esp-gf input::placeholder,.esp-gf textarea::placeholder{color:var(--grigio-l)}
.esp-gf input:hover,.esp-gf textarea:hover{border-color:rgba(27,27,27,.55)}
.esp-gf input:focus,.esp-gf textarea:focus{border-color:var(--rosso);box-shadow:0 0 0 4px rgba(209,0,0,.12)}
.esp-gf .gfield_description:not(.validation_message){margin-top:8px;font-size:14px;color:var(--grigio)}

/* ---------- Errori ---------- */
.esp-gf .gfield_error input,.esp-gf .gfield_error textarea{border-color:var(--rosso);background:#FFF6F6}
.esp-gf .gfield_validation_message,.esp-gf .validation_message{margin-top:8px;font-size:14px;font-weight:600;color:var(--rosso)}
.esp-gf .gform_validation_errors{margin-bottom:24px;padding:16px 18px;border-radius:14px;background:#FFF6F6;color:var(--rosso)}
.esp-gf .gform_validation_errors h2,.esp-gf .gform_submission_error{font-family:var(--body);font-size:15px;font-weight:700;line-height:1.4;text-transform:none;letter-spacing:0;margin:0}
.esp-gf .gform_validation_errors ol{margin:8px 0 0 1.2em;font-size:14px}
.esp-gf .gform_validation_errors a{color:inherit}

/* ---------- Chips (campi a scelta singola con classe esp-chips): come .leadform .chip ---------- */
.esp-gf .esp-chips .gfield_radio{display:flex;flex-wrap:wrap;gap:10px}
.esp-gf .esp-chips .gchoice{position:relative}
.esp-gf .esp-chips .gchoice input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer;z-index:1}
.esp-gf .esp-chips .gchoice label{display:inline-block;font-weight:600;font-size:16px;padding:12px 20px;border-radius:999px;background:var(--card);cursor:pointer;user-select:none;line-height:1.2;transition:background .2s,color .2s}
.esp-gf .esp-chips .gchoice:hover label{background:var(--bordo)}
.esp-gf .esp-chips .gchoice input:checked+label{background:var(--rosso);color:#fff}
.esp-gf .esp-chips .gchoice input:focus-visible+label{outline:2px solid var(--nero);outline-offset:2px}
.esp-gf .esp-chips.gfield_error .gfield_radio{outline:2px solid var(--rosso);outline-offset:8px;border-radius:16px}
.esp-gf .esp-chips.gfield_error .gfield_validation_message{margin-top:16px}

/* ---------- Consenso privacy: come .consent ---------- */
.esp-gf .ginput_container_consent{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.5;font-weight:400;color:var(--grigio);padding:16px 18px;background:var(--campo);border-radius:14px}
.esp-gf .ginput_container_consent input{width:20px;height:20px;accent-color:var(--rosso);flex:0 0 auto;margin-top:2px;cursor:pointer}
.esp-gf .ginput_container_consent label{cursor:pointer}
.esp-gf .ginput_container_consent a{color:var(--nero);text-decoration:underline;text-underline-offset:2px}
.esp-gf .ginput_container_consent a:hover{color:var(--rosso)}
.esp-gf .gfield_error .ginput_container_consent{color:var(--rosso);background:#FFF6F6}

/* ---------- Invio ---------- */
.esp-gf .gform_footer{margin-top:28px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.esp-gf .gform_footer .btn{width:100%}
.esp-gf .gform_footer .btn:disabled,.esp-gf .gform_footer .btn[disabled]{opacity:.6;cursor:progress}

/* ---------- Form lead (landing): sezioni 01 / 02 / 03 / Privacy come i fieldset del prototipo ---------- */
.esp-gf--lead .gform_fields{gap:18px 20px}
/* filetto solo tra una sezione e l'altra (il primo figlio della griglia può essere il campo honeypot) */
.esp-gf--lead .gsection~.gsection{margin-top:clamp(12px,1.6vw,26px);padding-top:clamp(26px,3vw,36px);border-top:1px solid rgba(27,27,27,.25)}
.esp-gf--lead .gsection_title{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.3vw,34px);line-height:1;text-transform:uppercase;letter-spacing:0;margin:0}
.esp-gf--lead .gsection_description:empty{display:none}
.esp-gf--lead .gfield--type-html .q.sub{margin:6px 0 0}
.esp-gf--lead .gform_footer{margin-top:clamp(28px,3vw,40px)}
.esp-gf--lead .gform_footer .btn{width:auto;min-width:320px}
.esp-gf--lead .gform_footer .micro{flex-basis:auto;text-align:left}

/* ---------- Form FAQ ---------- */
.qcard h3+.esp-gf{margin-top:22px}
.esp-gf--faq .gform_footer .micro{flex-basis:100%;text-align:center}

/* ---------- Conferma: il messaggio usa il blocco .thanks del prototipo ---------- */
.esp-gf .gform_confirmation_message{font-size:inherit}

@media(max-width:900px){
  .esp-gf .gform_fields{grid-template-columns:1fr}
  .esp-gf .gfield--width-half{grid-column:1/-1}
  .esp-gf--lead .gform_footer .btn{width:100%;min-width:0}
}
