/* PERCORSI GUIDATI — moduli a passi a tutto schermo, barra della home e Verifica (batch 26/10; scelte di Davide, decisions.md 26/10).
   Misure su una griglia di 8: campi alti 64, raggio 18, testo 20; scelte alte come i campi. Palette di oggi: arancione brand, bianco,
   marrone del sito per il testo scuro. Tutte le regole stanno sotto .pgp (il tutto schermo), .pgp-invito o .aqv (la barra). */
.pgp-sr { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }

/* «Inizia Ora» della pagina corsi nuova, senza movimento e senza velatura scura (Davide 26/10). Pieno in pagina, bianco sull'arancione. */
.pgp-bottone {
  position: relative; display: inline-grid; place-items: center; box-sizing: border-box; cursor: pointer; border: 0; margin: 0;
  min-width: clamp(220px, 21vw, 308px); min-height: clamp(64px, 7.6vw, 112px); padding: 0 1.1em;
  border-radius: clamp(20px, 2.4vw, 34px);
  font: 500 clamp(24px, 2.6vw, 38px)/1 "Inter", system-ui, sans-serif; letter-spacing: -0.02em; text-decoration: none; white-space: nowrap;
}
.pgp-bottone--pieno { background: #F95100; color: #FFFFFF; }
.pgp-bottone--bianco { background: #FFFFFF; color: #F95100; }
.pgp-bottone:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.pgp-bottone--bianco:focus-visible { outline-color: #FFFFFF; }
.pgp-bottone:disabled { opacity: .6; cursor: default; }
.pgp-bottone:active { transform: scale(.97); transition: transform 120ms; }
/* 28/10 (Davide: «stesso over di tutti i bottoni inizia come questo del paracadute, anche quelli dentro i corsi finanziabili»): il
   passaggio del mouse di .btn-paracadute (piu' luminoso, su di 1 px, ombra arancione); supera «senza movimento» del 26/10 */
.pgp-bottone--pieno { transition: transform .55s cubic-bezier(.25,.8,.25,1), box-shadow .55s cubic-bezier(.25,.8,.25,1), filter .55s cubic-bezier(.25,.8,.25,1); }
@media (hover: hover) and (pointer: fine) {
  .pgp-bottone--pieno:hover { color: #FFFFFF; filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 12px 28px rgba(249,81,0,.28); }
}

/* l'invito al posto dei campi, in pagina */
.pgp-invito { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; margin: 28px 0 8px; }
/* 28/10 (Davide: «questi bottoni sempre a destra dentro ai vari layout»): «Inizia» a destra nel suo blocco, la nota prima */
.pgp-invito { justify-content: flex-end; }
.pgp-invito .pgp-meta { order: -1; }
/* 28/10 (Davide, schermata del «Contattaci» della consulenza privacy: «questi tipi di impaginazione, metti il bottone inizia a destra
   rispetto al testo»): nei blocchi occhiello + titolo + testo + invito, al computer il testo resta a sinistra (al massimo 720 px, come
   prima) e l'invito sta alla sua destra, centrato sul testo; il blocco si allarga fino al suo contenitore. Al telefono resta sotto. */
@media (min-width: 1000px) {
  /* fuori le colonne strette accanto a un rail (Per chi?, 720 px col rail a destra): li' il testo si stringerebbe a 300 px e l'invito
     resta sotto, a destra. :not(#nessuno) = la forza per battere i max-width delle pagine (es. .pg-consulenza .cs-stretto, 720 px) senza !important */
  :is(section, div):not(#nessuno):not(.pk-corpo-testo > *):has(> .pgp-invito):has(> h2) { max-width: none; display: grid; grid-template-columns: minmax(0, 720px) auto;
    justify-content: space-between; column-gap: clamp(40px, 6vw, 120px); align-items: start; }
  :is(section, div):not(#nessuno):not(.pk-corpo-testo > *):has(> .pgp-invito):has(> h2) > * { grid-column: 1; }
  :is(section, div):not(#nessuno):not(.pk-corpo-testo > *):has(> .pgp-invito):has(> h2) > .pgp-invito { grid-column: 2; grid-row: 1 / span 8; align-self: center; margin: 0;
    flex-direction: column; align-items: center; gap: 12px; }
  :is(section, div):not(#nessuno):not(.pk-corpo-testo > *):has(> .pgp-invito):has(> h2) > .pgp-invito .pgp-meta { order: 1; }
}
.pgp-invito .pgp-meta { color: var(--muted, #6b6b6b); font-size: 15px; margin: 0; }

/* ---------- il guscio ---------- */
.pgp {
  --pgp-fondo: #F95100; --pgp-scuro: #2B1711; --pgp-velo: rgba(255,255,255,.28);
  --pgp-curva: cubic-bezier(.2,.8,.2,1); --pgp-molla: cubic-bezier(.34,1.15,.4,1);
  --pgp-h: 64px; --pgp-rc: 18px;
  position: fixed; inset: 0; z-index: 2147483000; background: var(--pgp-fondo); color: #fff;
  font-family: "Inter", system-ui, sans-serif; font-weight: 500; letter-spacing: -0.01em; -webkit-font-smoothing: antialiased;
  clip-path: circle(0 at var(--pgp-x, 50%) var(--pgp-y, 50%));
  transition: clip-path 440ms var(--pgp-curva);
  display: grid; grid-template-rows: auto 1fr auto;
}
.pgp.is-aperto { clip-path: circle(var(--pgp-r, 150%) at var(--pgp-x, 50%) var(--pgp-y, 50%)); }
/* finita l'apertura il ritaglio sparisce: un cerchio calcolato sulla finestra del momento tagliava gli angoli se la finestra cambiava (26/10) */
.pgp.is-pieno { clip-path: none; transition: none; }
.pgp[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .pgp { transition: opacity 150ms; clip-path: none; opacity: 0; } .pgp.is-aperto { opacity: 1; } }

.pgp-testa { display: flex; align-items: center; gap: 20px; padding: clamp(10px, 2vw, 28px) clamp(14px, 2.4vw, 40px) 0 clamp(20px, 13vw, 210px); }
.pgp-cosa { margin: 0; font-size: 15px; color: rgba(255,255,255,.9); }
.pgp-avanz { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pgp-avanz li { width: 8px; height: 8px; border-radius: 50%; background: var(--pgp-velo); transition: background 200ms, transform 320ms var(--pgp-molla); }
.pgp-avanz li.is-fatto { background: #fff; }
.pgp-avanz li.is-ora { background: #fff; transform: scale(1.5); }
/* «Chiudi» con la X a pallini: copiato dal dettaglio corso (misure e movimento), in bianco */
.pgp-chiudi {
  margin-left: auto; display: inline-flex; align-items: center; gap: .26em; padding: .08em .18em;
  border: 0; border-radius: 16px; background: transparent; color: #fff; cursor: pointer;
  font: 500 clamp(28px, 4.1vw, 60px)/1 "Inter", system-ui, sans-serif; letter-spacing: -0.03em;
}
.pgp-chiudi svg { width: .72em; height: .72em; fill: currentColor; transition: transform 320ms var(--pgp-molla); }
@media (hover: hover) and (pointer: fine) { .pgp-chiudi:hover svg { transform: rotate(90deg); } }
.pgp :focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

.pgp-scorri { position: relative; overflow-y: auto; overscroll-behavior: contain; }
/* «non si capisce che continua la pagina sotto» (Davide 26/10): il fondo sfuma finche' c'e' altro da scorrere */
.pgp.is-altro .pgp-scorri { -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent); }
.pgp-in { box-sizing: border-box; width: min(100%, 1100px); padding: clamp(16px, 4vh, 64px) clamp(20px, 5vw, 48px) 40px clamp(20px, 13vw, 210px); }
.pgp-form { margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; display: block !important; max-width: none !important; }
.pgp-form[hidden] { display: none !important; }   /* a invio riuscito il modulo lascia il posto alla conferma */
.pgp-passo.is-entra-avanti { animation: pgp-avanti 340ms var(--pgp-curva) both; }
.pgp-passo.is-entra-indietro { animation: pgp-indietro 340ms var(--pgp-curva) both; }
@keyframes pgp-avanti { from { opacity: 0; transform: translateX(24px); } }
@keyframes pgp-indietro { from { opacity: 0; transform: translateX(-24px); } }

.pgp-n { margin: 0 0 12px; font-size: 15px; color: rgba(255,255,255,.86); }
.pgp-dom { margin: 0 0 clamp(20px, 3.4vh, 36px); max-width: 16em; font-size: clamp(34px, min(4.4vw, 7vh), 64px); line-height: 1.05; letter-spacing: -0.035em; font-weight: 500; color: #fff; }
.pgp-dom:focus, .pgp-dom:focus-visible { outline: 0; }
.pgp-corpo { display: grid; gap: clamp(16px, 3vh, 24px); max-width: 680px; }

/* ---------- i campi ---------- */
.pgp-campi { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 16px; align-items: start; }
.pgp-campi:empty { display: none; }
.pgp .pgp-campo { grid-column: span 1; margin: 0; padding: 0; border: 0; min-width: 0; display: grid; grid-template-columns: 1fr auto; grid-template-areas: "et fa" "ca ca" "er er"; align-items: end; gap: 8px 12px; }
.pgp .pgp-campo--lungo, .pgp .pgp-campo--scelte, .pgp-campi > .pgp-campo:only-child { grid-column: 1 / -1; }
.pgp .pgp-campo > label { grid-area: et; margin: 0; padding: 0; color: #fff; font-size: 16px; line-height: 1.3; font-weight: 500; }
.pgp .pgp-campo > label b { color: #fff; font-weight: 500; }
.pgp-facolt { grid-area: fa; font-size: 13px; color: rgba(255,255,255,.78); line-height: 1.3; }
.pgp .pgp-campo > input, .pgp .pgp-campo > textarea, .pgp .pgp-campo > .pgp-num, .pgp .pgp-campo > .pgp-scelte { grid-area: ca; }
.pgp .pgp-campo > .pg-form-err, .pgp .pgp-campo > .lv-err { grid-area: er; }
.pgp .pgp-campo input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .pgp .pgp-campo textarea {
  box-sizing: border-box; width: 100%; height: var(--pgp-h); margin: 0; border: 0; border-radius: var(--pgp-rc);
  background: #fff; color: #1b1b1b; font: 500 20px/1.3 "Inter", system-ui, sans-serif; letter-spacing: -0.01em;
  padding: 0 20px; box-shadow: none; -webkit-appearance: none; appearance: none; transition: box-shadow 160ms ease;
}
.pgp .pgp-campo textarea { height: auto; min-height: 168px; padding: 18px 20px; resize: vertical; line-height: 1.45; }
.pgp .pgp-campo input::placeholder, .pgp .pgp-campo textarea::placeholder { color: #9b9b9b; opacity: 1; }
/* il fuoco: anello bianco staccato dal campo da un filo arancione, leggibile sull'arancione senza scurire niente */
.pgp .pgp-campo input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus, .pgp .pgp-campo textarea:focus { outline: 0; box-shadow: 0 0 0 3px var(--pgp-fondo), 0 0 0 6px #fff; }
/* l'errore: niente icona (Davide 26/10), anello marrone, un piccolo «no» e la frase della pagina in marrone (5,1:1 sull'arancione) */
.pgp .pgp-campo.is-errore input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .pgp .pgp-campo.is-errore textarea,
.pgp .pgp-campo.is-errore .pgp-num, .pgp .pgp-campo.is-errore .pgp-scelte, .pgp .pgp-campo.is-errore .lv-cv { border-radius: var(--pgp-rc); box-shadow: 0 0 0 3px var(--pgp-fondo), 0 0 0 6px var(--pgp-scuro); }
.pgp .pg-form-err, .pgp .lv-err { display: block; margin: 2px 0 0; padding: 0; background: none; color: var(--pgp-scuro); font-size: 15px; line-height: 1.35; }
.pgp .pg-form-err[hidden], .pgp .lv-err[hidden] { display: none; }
.pgp .pgp-campo.is-scuote > input, .pgp .pgp-campo.is-scuote > textarea, .pgp .pgp-campo.is-scuote .pgp-num, .pgp .pgp-campo.is-scuote .pgp-scelte { animation: pgp-no 360ms cubic-bezier(.36,.07,.19,.97) both; }
@keyframes pgp-no { 20% { transform: translateX(-6px); } 40% { transform: translateX(5px); } 60% { transform: translateX(-3px); } 80% { transform: translateX(2px); } }

/* il numero, senza freccine: meno e piu' dentro il campo */
.pgp-num { position: relative; display: grid; grid-template-columns: var(--pgp-h) 1fr var(--pgp-h); align-items: center; height: var(--pgp-h); border-radius: var(--pgp-rc); background: #fff; }
/* dentro il numero l'anello lo fa il contenitore: la regola del campo (piu' specifica) qui va spenta con la stessa forza */
/* stessa catena di :not() della regola generale (che altrimenti pesa di piu'), piu' .pgp-num */
.pgp .pgp-campo .pgp-num input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 100%; text-align: center; padding: 0 4px; background: transparent; border-radius: 0; -moz-appearance: textfield; }
.pgp .pgp-campo .pgp-num input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus { box-shadow: none; }
.pgp-num:focus-within { box-shadow: 0 0 0 3px var(--pgp-fondo), 0 0 0 6px #fff; }
.pgp-num input::-webkit-outer-spin-button, .pgp-num input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pgp-num-b { width: 44px; height: 44px; justify-self: center; border: 0; border-radius: 50%; background: #F4F3F3; color: #1b1b1b; font: 500 24px/1 "Inter", system-ui, sans-serif; cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .pgp-num-b:hover { background: #E7E7E7; } }

/* le scelte: riquadri alti come i campi, due per riga, la spunta su quello scelto */
.pgp-scelte { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pgp-scelte--fitte { grid-template-columns: repeat(3, 1fr); }
.pgp-scelta {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; box-sizing: border-box; min-height: var(--pgp-h); margin: 0;
  padding: 10px 14px 10px 20px; border: 0; border-radius: var(--pgp-rc); cursor: pointer; text-align: left;
  background: rgba(255,255,255,.16); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55);
  font: 500 18px/1.25 "Inter", system-ui, sans-serif; letter-spacing: -0.01em; transition: background 160ms, color 160ms, box-shadow 160ms;
}
@media (hover: hover) and (pointer: fine) { .pgp-scelta:hover { background: rgba(255,255,255,.24); } }
.pgp-scelta-v { flex: 0 0 auto; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); }
.pgp-scelta-v svg { width: 16px; height: 16px; opacity: 0; }
.pgp-scelta[aria-checked="true"] { background: #fff; color: #1b1b1b; box-shadow: none; }
.pgp-scelta[aria-checked="true"] .pgp-scelta-v { background: var(--pgp-fondo); box-shadow: none; color: #fff; }
.pgp-scelta[aria-checked="true"] .pgp-scelta-v svg { opacity: 1; }
.pgp-scelte.is-no { animation: pgp-no 360ms cubic-bezier(.36,.07,.19,.97) both; }

/* ---------- il «sapevi che»: testo sotto i campi, in marrone ---------- */
.pgp-sapevi { padding-top: 8px; color: var(--pgp-scuro); max-width: 680px; }
.pgp-sapevi[hidden] { display: none; }
.pgp-sapevi.is-dentro { animation: pgp-sapevi 420ms var(--pgp-curva) both; }
@keyframes pgp-sapevi { from { opacity: 0; transform: translateY(10px); } }
.pgp-sapevi-t { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 14px; letter-spacing: .04em; text-transform: uppercase; }
.pgp-sapevi-t::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--pgp-scuro); }
.pgp-sapevi-p { margin: 0 0 12px; font-size: clamp(22px, 2.1vw, 30px); line-height: 1.25; letter-spacing: -0.02em; }
.pgp-sapevi-p b { font-weight: 600; }
.pgp-sapevi-a { color: var(--pgp-scuro); font-size: 16px; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px; }

/* ---------- l'ultimo passo: riepilogo, consenso, invio ---------- */
.pgp-riep { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin: 0; }
.pgp-riep:empty { display: none; }
.pgp-riep div { position: relative; display: grid; gap: 4px; padding: 14px 72px 14px 0; border-bottom: 1px solid rgba(255,255,255,.32); align-content: start; }
.pgp-riep div.is-lungo { grid-column: 1 / -1; }
.pgp-riep dt { color: rgba(255,255,255,.82); font-size: 14px; }
.pgp-riep dd { margin: 0; font-size: 18px; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.pgp-modifica { position: absolute; right: 0; top: 14px; border: 0; background: none; color: #fff; font: 500 14px "Inter", system-ui, sans-serif; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 0; }
.pgp .pg-consenso, .pgp .lv-consenso { color: #fff; font-size: 16px !important; line-height: 1.45 !important; margin: 0 !important; gap: 12px !important; align-items: center !important; display: flex !important; }
.pgp .pg-consenso input, .pgp .lv-consenso input { -webkit-appearance: none; appearance: none; flex: 0 0 auto; width: 24px; height: 24px; margin: 0 !important; border-radius: 7px; background: #fff; cursor: pointer; }
.pgp .pg-consenso input:checked, .pgp .lv-consenso input:checked { background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F95100' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat; }
.pgp .pg-nota-dati, .pgp .lv-nota-dati { color: rgba(255,255,255,.86); font-size: 13px; line-height: 1.5; margin: 0 !important; }
.pgp .lv-nota-dati a { color: #fff; }
.pgp .pg-form-invia, .pgp .lv-invia { margin: 0 !important; padding: 0 !important; display: block !important; }
.pgp .lv-stato { color: var(--pgp-scuro); font-size: 15px; margin: 0; }
.pgp .lv-stato:empty { display: none; }
.pgp .pg-esito, .pgp .lv-esito { display: none !important; }

/* ---------- il piede: Indietro, Continua sotto, Avanti (o l'invio) ---------- */
.pgp-piede { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; padding: 16px clamp(20px, 5vw, 48px) clamp(16px, 3vw, 36px) clamp(20px, 13vw, 210px); }
.pgp-piede[hidden] { display: none; }
.pgp-indietro { grid-column: 1; justify-self: start; border: 0; background: none; color: #fff; font: 500 18px "Inter", system-ui, sans-serif; cursor: pointer; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; padding: 8px 0; }
.pgp-indietro[hidden] { visibility: hidden; display: inline-block; }
.pgp-piede .pgp-avanti, .pgp-piede .pgp-invia { grid-column: 3; grid-row: 1; justify-self: end; }
.pgp-piede .pgp-avanti[hidden], .pgp-piede .pgp-invia[hidden] { display: none; }
/* Avanti, un minimo di interazione (Davide 26/10, «1 Freccia»): col mouse entra la freccia e la parola le fa posto */
.pgp-avanti > span { display: inline-flex; align-items: center; }
.pgp-freccia { width: 0; height: .72em; margin-left: 0; opacity: 0; transform: translateX(-.3em); transition: width 260ms var(--pgp-curva), margin 260ms var(--pgp-curva), opacity 200ms, transform 260ms var(--pgp-curva); }
@media (hover: hover) and (pointer: fine) { .pgp-avanti:hover .pgp-freccia { width: .72em; margin-left: .32em; opacity: 1; transform: none; } }
.pgp-avanti:focus-visible .pgp-freccia { width: .72em; margin-left: .32em; opacity: 1; transform: none; }
.pgp-sotto {
  grid-column: 2; grid-row: 1; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 999px; cursor: pointer;
  background: #fff; color: #F95100; font: 500 15px/1 "Inter", system-ui, sans-serif;
  opacity: 0; pointer-events: none; transform: translateY(6px); transition: opacity 200ms, transform 260ms var(--pgp-curva);
}
.pgp-sotto svg { width: 16px; height: 16px; }
.pgp.is-altro .pgp-sotto { opacity: 1; pointer-events: auto; transform: none; }
@media (prefers-reduced-motion: reduce) { .pgp-freccia, .pgp-sotto, .pgp-scelta, .pgp-avanz li { transition: none !important; } .pgp-sapevi.is-dentro, .pgp-passo { animation: none !important; } }

.pgp-fatto { display: grid; gap: 20px; justify-items: start; }
.pgp-fatto .pgp-dom { margin-bottom: 0; }
.pgp-fatto-ok { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #fff; color: var(--pgp-fondo); }
.pgp-fatto-ok svg { width: 28px; height: 28px; }
.pgp-fatto-p { margin: 0; max-width: 32em; font-size: clamp(19px, 1.8vw, 24px); line-height: 1.4; }
.pgp-fatto .pgp-bottone { margin-top: 12px; }

/* ---------- /it/contatti: i quattro passi della pagina dentro il guscio ---------- */
.pgp .ct-nav, .pgp .ct-passi { display: none !important; }
.pgp .ct-pan { margin: 0; padding: 0; background: none; border: 0; box-shadow: none; display: grid; gap: clamp(16px, 3vh, 24px); max-width: 680px; }
.pgp .ct-pan[hidden] { display: none; }
.pgp .ct-kicker { margin: 0; font-size: 15px; color: rgba(255,255,255,.86); }
.pgp .ct-pan h2 { margin: 0; font-size: clamp(34px, min(4.4vw, 7vh), 64px); line-height: 1.05; letter-spacing: -0.035em; font-weight: 500; color: #fff; outline: 0; }
.pgp .ct-sub { margin: 0; font-size: 18px; line-height: 1.45; color: rgba(255,255,255,.92); }
.pgp .ct-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 16px; align-items: start; }
.pgp .ct-griglia .ct-full { grid-column: 1 / -1; }
.pgp .ct-eco { display: none; }
.pgp .pg-intenti { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* le card dei bisogni: la card e' lo SPAN della pagina (prima ne uscivano due, una dentro l'altra) */
.pgp .pg-intento { display: block; height: 100%; cursor: pointer; }
.pgp .pg-intento input { position: absolute; opacity: 0; pointer-events: none; }
.pgp .pg-form .pg-intento > span { display: block; height: 100%; box-sizing: border-box; padding: 16px 18px; border: 0; border-radius: var(--pgp-rc); background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); color: #fff; }
.pgp .pg-form .pg-intento > span:hover { background: rgba(255,255,255,.24); }
.pgp .pg-form .pg-intento b { display: block; font-weight: 500; font-size: 18px; margin-bottom: 4px; color: inherit; }
.pgp .pg-form .pg-intento i { font-style: normal; font-size: 14px; line-height: 1.4; color: inherit; opacity: .9; }
.pgp .pg-form .pg-intento input:checked + span { background: #fff; color: #1b1b1b; box-shadow: none; }
.pgp .pg-form .pg-intento input:focus-visible + span { outline: 3px solid #fff; outline-offset: 3px; }
.pgp .ct-pan select { box-sizing: border-box; width: 100%; height: var(--pgp-h); border: 0; border-radius: var(--pgp-rc); background: #fff; color: #1b1b1b; font: 500 18px "Inter", system-ui, sans-serif; padding: 0 16px; }
/* 27/10 sera (Davide, «bug strano ui»): i due riquadri informativi del modulo dei contatti («Quello che vedrai», la formazione
   finanziata) entravano nel tutto schermo senza la loro forma, che nella pagina vale solo sotto .pg-contatti: qui la riprendono,
   coi colori del guscio (riquadro velato, testi bianchi, tessera bianca con l'icona arancione). Check pgp.blocchi-di-contorno. */
.pgp .ct-box { margin-top: 8px; padding: 20px 22px 22px; border-radius: var(--pgp-rc); background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.4); color: #fff; max-width: 680px; }
.pgp .ct-box[hidden] { display: none; }
.pgp .ct-box .boxb-t { margin: 0; font-size: 19px; line-height: 1.35; letter-spacing: -0.012em; font-weight: 500; color: #fff; }
.pgp .ct-box .boxb-s { margin: 7px 0 0; font-size: 15px; line-height: 1.5; color: rgba(255,255,255,.9); }
.pgp .ct-box .boxb-cta { margin: 14px 0 0; }
.pgp .ct-box .ct-link { display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: 15px; text-decoration: underline; text-underline-offset: 4px; }
.pgp .ct-kf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin-top: 16px; }
.pgp .ct-kf-t { display: flex; align-items: center; gap: 10px; margin: 0 0 5px; font-size: 16px; font-weight: 500; color: #fff; }
.pgp .ct-kf-s { margin: 0; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.88); }
.pgp .ct-box .tessera { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: var(--pgp-fondo); }
@media (max-width: 760px) { .pgp .ct-kf { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Lavora con noi: ruolo, abilitazioni e curriculum nel guscio ---------- */
.pgp .lv-ruolo legend, .pgp .lv-abil legend { color: #fff; font-size: 16px; margin: 0 0 8px; padding: 0; }
.pgp .lv-ruolo-scelte, .pgp .lv-chips { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pgp .lv-ruolo-opz, .pgp .lv-chip { position: relative; display: flex; align-items: center; min-height: var(--pgp-h); box-sizing: border-box; padding: 10px 20px; border-radius: var(--pgp-rc); cursor: pointer; background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); color: #fff; font-size: 18px; }
.pgp .lv-ruolo-opz input, .pgp .lv-chip input { position: absolute; opacity: 0; pointer-events: none; }
.pgp .lv-ruolo-opz:has(input:checked), .pgp .lv-chip:has(input:checked) { background: #fff; color: #1b1b1b; box-shadow: none; }
.pgp .lv-ruolo-opz:has(input:focus-visible), .pgp .lv-chip:has(input:focus-visible) { outline: 3px solid #fff; outline-offset: 3px; }
.pgp .lv-ruolo-aiuto { color: rgba(255,255,255,.9); font-size: 15px; margin: 8px 0 0; }
.pgp .lv-ruolo-aiuto[hidden] { display: none; }
.pgp .lv-abil[hidden] { display: none; }
.pgp .lv-abil-altro { margin-top: 16px; }
.pgp .lv-cv { display: flex; align-items: center; gap: 14px; min-height: 96px; padding: 16px 20px; box-sizing: border-box; border-radius: var(--pgp-rc); background: #fff; color: #1b1b1b; cursor: pointer; }
.pgp .lv-cv input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pgp .lv-cv-ico svg { width: 28px; height: 28px; color: var(--pgp-fondo); }
.pgp .lv-cv-et { color: #fff; font-size: 16px; }
.pgp .lv-cv-testo small { display: block; color: #6b6b6b; }

/* ---------- telefono ---------- */
@media (max-width: 760px) {
  .pgp { --pgp-h: 58px; --pgp-rc: 16px; }
  .pgp-testa { padding: 12px 14px 0 20px; gap: 12px; }
  .pgp-cosa { display: none; }
  .pgp-in { padding: 20px 20px 24px; }
  .pgp-dom, .pgp .ct-pan h2 { font-size: 34px; }
  .pgp-dom { margin-bottom: 22px; }
  .pgp-campi, .pgp .ct-griglia { grid-template-columns: 1fr; gap: 20px; }
  .pgp .pgp-campo { grid-column: 1 / -1; }
  .pgp .pgp-campo input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .pgp .pgp-campo textarea { font-size: 18px; }
  .pgp-scelte, .pgp-scelte--fitte, .pgp .pg-intenti, .pgp .lv-ruolo-scelte, .pgp .lv-chips { grid-template-columns: 1fr; gap: 10px; }
  .pgp-sapevi-p { font-size: 22px; }
  .pgp-riep { grid-template-columns: 1fr; }
  .pgp-piede { grid-template-columns: auto auto 1fr; padding: 10px 16px calc(14px + env(safe-area-inset-bottom)); gap: 10px; }
  .pgp-piede .pgp-avanti, .pgp-piede .pgp-invia { justify-self: stretch; min-width: 0; }
  .pgp-sotto { padding: 0 12px; font-size: 0; gap: 0; width: 40px; justify-content: center; }
  .pgp-sotto svg { width: 18px; height: 18px; }
  .pgp-bottone { min-height: 64px; font-size: 24px; }
  /* nel piede del telefono il bottone divide la riga con Indietro e «Continua sotto»: «Invia la richiesta» va a capo invece di uscire */
  .pgp-piede .pgp-bottone { font-size: 20px; padding: 6px .7em; white-space: normal; line-height: 1.1; text-align: center; }
}
/* schermi bassi (portatili e finestre fino a 960 px di altezza): stessa composizione, meno aria, il «sapevi che» resta nel primo schermo */
@media (min-width: 761px) and (max-height: 960px) {
  .pgp-in { padding-top: 12px; }
  .pgp-n { margin-bottom: 6px; }
  .pgp-dom, .pgp .ct-pan h2 { font-size: clamp(32px, 3.4vw, 46px); }
  .pgp-dom { margin-bottom: 18px; }
  .pgp-corpo, .pgp .ct-pan { gap: 14px; }
  .pgp-campi { gap: 16px 16px; }
  .pgp-scelte { gap: 10px; }
  .pgp-sapevi { padding-top: 0; }
  .pgp-sapevi-t { margin-bottom: 6px; }
  .pgp-sapevi-p { font-size: 22px; margin-bottom: 8px; }
  .pgp-piede { padding-top: 8px; padding-bottom: 16px; }
}

/* ---------- HOME: la barra di ricerca col bottone «Verifica la tua azienda» DENTRO (Davide 26/10, «B»), che a barra attiva diventa «Cerca» ---------- */
.bar-wrap.aqv .aqv-bottone {
  position: relative; z-index: 1; flex: none; display: inline-flex; align-items: center; justify-content: flex-start; overflow: hidden;
  height: 44px; padding: 0 20px; margin: 0 -15px 0 0; border: 0; border-radius: 999px; cursor: pointer;
  background: #F95100; color: #fff; font: 500 16.5px/1 "Inter", system-ui, sans-serif; letter-spacing: -0.01em; white-space: nowrap;
  transition: width 260ms cubic-bezier(.2,.8,.2,1);
}
.bar-wrap.aqv .aqv-bottone:focus-visible { outline: 2px solid #F95100; outline-offset: 3px; }
.bar-wrap.aqv .aqv-bottone:active { transform: scale(.97); }
.bar-wrap.aqv .ph { right: 230px; }
.aqv-et { display: inline-block; white-space: nowrap; transition: opacity 180ms, transform 260ms cubic-bezier(.2,.8,.2,1); }
.aqv-et--cerca { position: absolute; left: 20px; opacity: 0; transform: translateY(8px); }
.bar-wrap.aqv-cerca .aqv-et--verifica { position: absolute; left: 20px; opacity: 0; transform: translateY(-8px); }
.bar-wrap.aqv-cerca .aqv-et--cerca { position: static; opacity: 1; transform: none; }
.aqv-corto { display: none; }
@media (max-width: 560px) { .aqv-lungo { display: none; } .aqv-corto { display: inline; } .bar-wrap.aqv .ph { right: 110px; } }
@media (prefers-reduced-motion: reduce) { .aqv-et, .bar-wrap.aqv .aqv-bottone { transition: none; } }

/* ---------- la Verifica: i pezzi che i moduli non hanno (il resto e' il guscio .pgp) ---------- */
.pgv-intro, .pgv-aiuto { margin: 0; font-size: 18px; line-height: 1.45; color: rgba(255,255,255,.92); max-width: 34em; }
.pgv-quadro { max-width: 760px; gap: 28px; }
.pgv-gruppo h3 { margin: 0 0 10px; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; font-weight: 500; }
.pgv-gruppo ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pgv-gruppo li { display: grid; gap: 6px; padding: 16px 18px; border-radius: 18px; background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.45); }
.pgv-gruppo--da-fare li { background: #fff; color: #1b1b1b; box-shadow: none; }
.pgv-gruppo li b { font-size: 19px; font-weight: 500; }
.pgv-gruppo li > span { font-size: 16px; line-height: 1.4; }
.pgv-riga { display: grid; grid-template-columns: 96px 1fr; gap: 10px; font-size: 15px !important; }
.pgv-riga i { font-style: normal; opacity: .65; font-size: 13px; padding-top: 2px; }
.pgv-soluzione { justify-self: start; margin-top: 6px; display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 999px; background: #F95100; color: #fff !important; text-decoration: none; font-size: 15px; }
.pgv-gruppo:not(.pgv-gruppo--da-fare) .pgv-soluzione { background: #fff; color: #F95100 !important; }
.pgv-link { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.pgv-link a { color: inherit; text-decoration: underline; text-underline-offset: 3px; font-size: 15px; }
.pgv-gruppo--da-fare .pgv-link a { color: #C74100; }
.pgv-mandato b { font-weight: 600; }
@media (min-width: 1000px) { .pgv .pgp-corpo { max-width: 920px; } .pgv .pgp-scelte--fitte { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px) { .pgv-riga { grid-template-columns: 1fr; gap: 2px; } }

/* Lavora con noi fuori dalla sua pagina: le regole della pagina valgono solo sotto .pg-lavora, qui si rifanno i pezzi che servono */
.pgp .lv-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }   /* il campo trappola anti-spam */
.pgp fieldset.pgp-campo, .pgp .pgp-campo:has(.lv-cv) { display: block; }
.pgp fieldset.pgp-campo + fieldset.pgp-campo { margin-top: 24px; }
.pgp .lv-chips { grid-template-columns: repeat(3, 1fr); }
.pgp .lv-cv-et { display: block; margin: 0 0 8px; }
.pgp .pgp-campo > label.lv-cv b { display: block; color: #1b1b1b; font-weight: 500; font-size: 17px; }
.pgp .lv-cv.is-pieno { box-shadow: inset 0 0 0 2px #fff; }
.pgp .lv-err { margin-top: 8px; }
@media (max-width: 760px) { .pgp .lv-chips { grid-template-columns: 1fr 1fr; } }

/* ---------- CONTATTACI, proposta A (Davide 27/10 sera, «il principale e il più curato»): una decisione per schermo ---------- */
/* i pannelli della pagina restano nel modulo (validatore e invio della pagina li usano), vuoti e nascosti: i passi sono i nostri */
.pgp .pgp-form--contatti > .ct-pan { display: none !important; }
/* le tappe col nome in testa, al posto dei puntini */
.pgp--tappe .pgp-avanz { display: none; }
.pgp-tappe { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 14px; }
.pgp-tappe li { padding: 6px 12px; border-radius: 999px; color: rgba(255,255,255,.72); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35); }
.pgp-tappe li.is-fatto { color: #fff; box-shadow: inset 0 0 0 1.5px #fff; }
.pgp-tappe li.is-ora { background: #fff; color: var(--pgp-fondo); box-shadow: none; }
/* il bisogno: quattro riquadri grandi con l'icona; la scelta fa avanzare */
.pgp .pgp-form--contatti .pgp-corpo { max-width: 760px; }
.pgp .pgp-form--contatti [data-ruolo="bisogno"] .pgp-corpo { max-width: 920px; }
.pgp .pgp-form--contatti .pg-intenti { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
/* stessa forza della regola dei moduli qui sopra e piu' in basso: vince questa */
.pgp .pgp-form--contatti .pg-intento > span {
  position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-areas: "i t" "i s"; gap: 4px 16px; align-items: start;
  padding: 22px 56px 22px 22px; border-radius: 22px; background: rgba(255,255,255,.14); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5);
  transition: background 160ms, transform 160ms; }
@media (hover: hover) and (pointer: fine) { .pgp .pgp-form--contatti .pg-intento > span:hover { background: rgba(255,255,255,.24); } }
.pgp .pgp-form--contatti .pg-intento .pgp-int-ico { grid-area: i; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: #fff; color: var(--pgp-fondo); font-style: normal; }
.pgp .pgp-form--contatti .pg-intento .pgp-int-ico svg { width: 30px; height: 30px; }
.pgp .pgp-form--contatti .pg-intento b { grid-area: t; margin: 0 !important; font-size: 22px !important; line-height: 1.3; letter-spacing: -0.015em; font-weight: 500; }
.pgp .pgp-form--contatti .pg-intento i { grid-area: s; font-size: 15px !important; line-height: 1.45 !important; opacity: .92; }
.pgp .pgp-form--contatti .pg-intento .pgp-int-v { position: absolute; right: 18px; top: 18px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); font-style: normal; }
.pgp .pgp-form--contatti .pg-intento .pgp-int-v svg { width: 16px; height: 16px; opacity: 0; }
.pgp .pgp-form--contatti .pg-intento input:checked + span { background: #fff; color: #1b1b1b; box-shadow: none; transform: scale(.985); }
.pgp .pgp-form--contatti .pg-intento input:checked + span i { color: #555; opacity: 1; }
.pgp .pgp-form--contatti .pg-intento input:checked + span .pgp-int-ico { background: var(--pgp-fondo); color: #fff; }
.pgp .pgp-form--contatti .pg-intento input:checked + span .pgp-int-v { background: var(--pgp-fondo); color: #fff; box-shadow: none; }
.pgp .pgp-form--contatti .pg-intento input:checked + span .pgp-int-v svg { opacity: 1; }
.pgp .pgp-form--contatti .pg-intento input:focus-visible + span { outline: 3px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .pgp .pgp-form--contatti .pg-intento > span { transition: none; } }
/* il passo dell'azienda come nel lab A: il nome a tutta riga; al computer i gruppi da tre scelte (la taglia, i dettagli) su una riga */
.pgp .pgp-form--contatti .pgp-campo:has(#fd-azienda) { grid-column: 1 / -1; }
.pgp .pgp-form--contatti .ct-box { max-width: none; }   /* i riquadri allineati alla griglia dei campi, bordo destro compreso */
@media (min-width: 761px) { .pgp .pgp-form--contatti .pgp-scelte:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }   /* i gruppi da tre scelte su una riga */
@media (max-width: 760px) {
  .pgp-tappe { display: none; }
  .pgp--tappe .pgp-avanz { display: flex; }
  .pgp .pgp-form--contatti .pg-intenti { grid-template-columns: 1fr; gap: 10px; }
  .pgp .pgp-form--contatti .pg-intento > span { padding: 16px 48px 16px 16px; gap: 2px 12px; }
  .pgp .pgp-form--contatti .pg-intento .pgp-int-ico { width: 44px; height: 44px; border-radius: 14px; }
  .pgp .pgp-form--contatti .pg-intento b { font-size: 19px !important; }
  .pgp .pgp-form--contatti .pg-intento i { font-size: 14px !important; }
}
/* 27/10 sera (Davide, «l'header non c'e'» su /it/contatti, poi «metti il testo e il bottone in mezzo allo schermo»): col modulo nel tutto
   schermo la pagina dei contatti restava piu' corta della finestra, il footer entrava nel primo schermo e ritirava l'header gia' all'arrivo.
   La pagina e' alta almeno quanto la finestra sotto l'header (il footer parte sotto il bordo) e il blocco d'apertura sta al centro: stesso
   respiro sopra e sotto. Solo col tutto schermo attivo (c'e' l'invito); senza JavaScript la pagina col modulo in linea resta com'e'. */
main.pg-contatti:has(.pgp-invito) { box-sizing: border-box; min-height: calc(100svh - var(--header-h, 48px)); display: flex; flex-direction: column; justify-content: center; padding-bottom: 72px; }