/* ==========================================================================
   Integrazioni al blocco "Compatibilità Elementor" del prototipo — caricato
   DOPO style.css. Il prototipo resta intatto: qui ci sono solo
   1. i margini che il blocco di compatibilità azzera per errore,
   2. la variante "ghost" del widget Bottone,
   3. gli stili inline del prototipo resi come classi (in Elementor free non
      si può scrivere l'attributo style), con prefisso u-.
   ========================================================================== */

/* 1. Il blocco di compatibilità azzera i margini di tutti i titoli e
      dell'ultimo paragrafo dei widget con una specificità (0,2,0 / 0,2,1)
      più alta di queste regole del prototipo: le riporto. */
.hero-copy .elementor-widget-heading h1.elementor-heading-title{margin-bottom:var(--sp-4);}
.page-hero .elementor-widget-heading h1.elementor-heading-title{margin-bottom:var(--sp-4);}
.service-row .elementor-widget-heading h3.elementor-heading-title{margin-bottom:var(--sp-3);}
.method-card .elementor-widget-heading h4.elementor-heading-title{margin-bottom:.5rem;}
.project-block .elementor-widget-heading h3.elementor-heading-title{margin-bottom:.75rem;}
.service-row .elementor-widget-text-editor p:last-child{margin-bottom:var(--sp-3);}

/* 2. Widget Bottone come link sottolineato: stessi valori di .btn-ghost */
.btn-w.is-ghost .elementor-button{
  display:inline-flex;align-items:center;gap:.5em;
  padding:.4em 0;
  border:0;border-bottom:1px solid currentColor;border-radius:0;
  background:none;color:inherit;
  font-size:inherit;font-weight:600;letter-spacing:normal;text-transform:none;
  white-space:normal;transition:none;
}
.btn-w.is-ghost .elementor-button-content-wrapper{gap:.5em;}
.btn-w.is-ghost .elementor-button:hover{transform:none;color:var(--lime-ink);}
.section-dark .btn-w.is-ghost .elementor-button:hover{color:var(--lime-400);}
.btn-w .elementor-button-icon svg{flex-shrink:0;transition:transform .25s var(--ease);}
.btn-w .elementor-button:hover .elementor-button-icon svg{transform:translateX(3px);}

/* 3. Liste con freccia fatte con il widget Icon List senza icona: la freccia
      la disegna uno pseudo-elemento, con gli stessi valori dello
      <span class="tick"> del prototipo (.q-list usa già ::before di suo). */
.tick-list .elementor-icon-list-item::before,
.svc-includes .elementor-icon-list-item::before{content:'→';font-weight:800;flex-shrink:0;}
.tick-list .elementor-icon-list-item::before{color:var(--lime-ink);}
.side-us .tick-list .elementor-icon-list-item::before{color:var(--lime-400);}
.svc-includes .elementor-icon-list-item::before{color:var(--teal-900);}

/* 4. Card servizio: nel prototipo è il paragrafo a crescere (flex:1) e a
      spingere "Scopri" in fondo; in Elementor la cella flex è il widget. */
.svc-card > .elementor-widget-text-editor:has(> p){flex:1;}

/* 5. Numero degli stat: nel prototipo il "+" è una cella flex con gap .15em */
.stat .num .elementor-heading-title{display:inline-flex;align-items:baseline;gap:.15em;}

/* 6. Recensioni: nel prototipo la card è un <blockquote> e tiene i margini
      del browser; il container di Elementor non ha quel tag. */
.review-card.u-blockquote{margin:1em 40px;}

/* 6b. Il container non può avere html_tag="figure" (non è tra le opzioni
       libere): .team-card-figure sostituisce .team-card figure con la
       stessa resa (Elementor free non ha il campo Attributi personalizzati
       che servirebbe per altre soluzioni). */
.team-card-figure{border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/5;margin-bottom:var(--sp-3);}
.team-card-figure img{width:100%;height:100%;object-fit:cover;}

/* 7. Honeypot anti-spam del form Contatti (vedi functions.php): un campo
      di testo reale, invisibile solo alle persone (non con display:none o
      l'attributo hidden, che un bot potrebbe semplicemente ignorare in
      entrambi i casi — qui resta nel flusso ma fuori dallo schermo). */
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* 8. Widget Shortcode del form CF7: stessa cornice di .wizard-form del
      prototipo, applicata al wrapper del widget invece che al <form> (vedi
      tools/build-contatti.js). Il wrapper di CF7 (.wpcf7) resta neutro. */
.wizard-form{background:var(--white);border:1px solid var(--border-on-light);border-radius:var(--radius-lg);padding:clamp(1.5rem,2.5vw,2.5rem);}
.wizard-form form{all:unset;display:contents;} /* il <form> di CF7 non deve introdurre stili propri */
/* Messaggio nativo di CF7 (successo/errore/spam): stesso trattamento del
   nostro .wizard-error quando è un avviso, testo semplice quando è ok. */
.wpcf7-response-output{margin:0 0 var(--sp-3);font-size:.9rem;border-radius:var(--radius-sm);padding:.75em 1em;}
.wpcf7-mail-sent-ok.wpcf7-response-output{background:var(--lime-100);color:var(--lime-ink);border:1px solid var(--lime-500);}
.wpcf7-validation-errors.wpcf7-response-output,.wpcf7-mail-sent-ng.wpcf7-response-output,.wpcf7-spam-blocked.wpcf7-response-output{background:#FBEAEA;color:#8C1D1D;border:1px solid #8C1D1D;}
.wpcf7-not-valid-tip{display:block;margin-top:.4rem;font-size:.82rem;font-weight:700;color:#8C1D1D;}
/* Dopo un invio riuscito CF7 aggiunge questa classe al form: nascondiamo la
   card e mostriamo solo il nostro pannello finale (.wizard-done, gestito da
   main.js) invece di lasciare visibili anche i campi già inviati. */
.wizard-form form.sent .wizard-step,.wizard-form form.sent .wizard-nav{display:none;}
/* Il bottone di invio è generato da CF7 (input, non il nostro widget Bottone):
   stessi valori di .btn.btn-lime, applicati via classe invece che via markup. */
.wpcf7-submit.wizard-send{
  -webkit-appearance:none;appearance:none;
  display:inline-flex;align-items:center;gap:.6em;
  padding:.95em 1.7em;border-radius:var(--radius-pill);
  font-family:inherit;font-weight:700;font-size:.95rem;letter-spacing:.02em;text-transform:uppercase;
  border:1px solid transparent;white-space:nowrap;cursor:pointer;
  background:var(--lime-500);color:var(--near-black);
  transition:transform .25s var(--ease),background-color .25s var(--ease);
}
.wpcf7-submit.wizard-send:hover{background:var(--lime-600);transform:translateY(-2px);}
.wpcf7-submit.wizard-send:disabled{opacity:.6;cursor:default;transform:none;}

/* 10. Il tag [radio] di Contact Form 7 avvolge ogni opzione in
       .wpcf7-list-item, non nel nostro <label class="choice-chip"> diretto:
       la griglia a pillole (.choice-group nel markup) va quindi applicata a
       .wpcf7-form-control.wpcf7-radio, e lo stile della pillola a
       .wpcf7-list-item label, con lo stesso trattamento del prototipo. */
.wpcf7-form-control.wpcf7-radio{display:flex;flex-wrap:wrap;gap:.6rem;}
.wpcf7-radio .wpcf7-list-item{margin:0;}
.wpcf7-radio .wpcf7-list-item label{
  display:inline-flex;position:relative;
  border:1px solid var(--grey-400);border-radius:var(--radius-pill);
  padding:.7em 1.2em;font-size:.9rem;font-weight:600;cursor:pointer;background:var(--white);
  transition:.2s var(--ease);
}
/* Solo le radio-pillole nascondono il controllo nativo (lo stile lo fa la
   label): il checkbox del consenso, che condivide lo stesso .wpcf7-list-item
   di CF7, deve restare visibile e cliccabile. */
.wpcf7-radio .wpcf7-list-item input{position:absolute;opacity:0;pointer-events:none;}
.wpcf7-radio .wpcf7-list-item label:has(input:checked){background:var(--near-black);color:var(--white);border-color:var(--near-black);}
/* Sotto i 560px, come .choice-group/.choice-chip nel prototipo: pillole
   impilate a piena larghezza invece che a capo su righe di larghezza
   diseguale (vedi style.css, blocco "Wizard" dentro @media max-width:560px). */
@media (max-width:560px){
  .wpcf7-form-control.wpcf7-radio{flex-direction:column;}
  .wpcf7-radio .wpcf7-list-item label{width:100%;justify-content:center;text-align:center;}
}

/* 10b. CF7 aggiunge sempre uno <span class="wpcf7-spinner"> subito dopo il
        bottone di invio, anche quando è nascosto: è comunque un fratello
        flex di .wizard-nav e finisce dopo "margin-left:auto", spingendo il
        bottone visibile via dal bordo destro. Il prototipo non ha spinner:
        lo nascondiamo per restare identici e per riavere l'allineamento. */
.wizard-nav .wpcf7-spinner{display:none;}

/* 11. Consenso privacy: nessun equivalente nel prototipo (obbligatorio prima
       del lancio, vedi PAGINE-LEGALI.md). Stile minimo coerente col resto. */
.wpcf7-acceptance{display:block;font-size:.85rem;color:var(--grey-500);}
.wpcf7-acceptance .wpcf7-list-item{display:flex;gap:.6rem;align-items:flex-start;}
.wpcf7-acceptance input{margin-top:.2em;flex-shrink:0;}

/* 12. Stili inline del prototipo */
.u-mx-auto{margin-inline:auto;}
.u-text-left{text-align:left;}
.u-mb-0{margin-bottom:0;}
.u-maxw-22ch{max-width:22ch;}
.u-maxw-34ch{max-width:34ch;}
.u-maxw-42rem{max-width:42rem;}
.u-maxw-44rem{max-width:44rem;}
.u-maxw-46rem{max-width:46rem;}
.u-radius-lg{border-radius:var(--radius-lg);}
.u-maxw-52ch{max-width:52ch;}
.u-grey-300{color:var(--grey-300);}
.u-note{font-size:.82rem;color:var(--grey-300);}
/* Titolo stretto e centrato: il max-width in ch va misurato sul titolo, non sul widget */
.u-h2-narrow .elementor-heading-title{max-width:22ch;margin-inline:auto;}
/* "18." della homepage */
.u-big-18{margin:var(--sp-3) 0;}
.u-big-18 .elementor-heading-title{font-size:clamp(5rem,14vw,11rem);line-height:.85;}
/* Lista "Per chi lavoriamo" */
.u-fit-list{display:flex;flex-direction:column;gap:var(--sp-3);}
.u-fit-item{display:flex;gap:1rem;align-items:flex-start;}
.u-fit-arrow{color:var(--lime-ink);font-weight:800;font-size:1.2rem;line-height:1;}
/* Recapiti nell'hero di Contatti: gap .75rem, non 1.5rem come u-fit-list */
.u-contact-list{display:flex;flex-direction:column;gap:.75rem;font-weight:600;}