/* ==========================================================================================
   pagine/contatti.css — /contatti/ (agente contatti-blog; rifatta il 2026-10-02: pochi elementi,
   molto vuoto, BRIEF §11.2)
   hero · modulo come conversazione (isola modulo.js) · ripiego senza JS · esito senza JS ·
   recapiti · domande + guida AI (la chat ha i suoi stili in isole/chat.js)
   ========================================================================================== */

/* i bagliori delle sezioni sfumano ai bordi: niente taglio netto dove la sezione finisce */
.pagina-contatti .ct-modulo > .bagliori,
.pagina-contatti .sezione > .bagliori {
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 78%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 78%, transparent);
}

/* ---------------------------------------------------------------- hero ----------------- */
.ct-hero {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  display: grid;
  align-content: end;
  padding-top: calc(var(--testata-h) + 48px);
  padding-bottom: calc(var(--hud-h) + clamp(48px, 9vh, 112px));
  overflow: clip;
}
.ct-hero__foto {
  position: absolute;
  top: 0; bottom: 0;
  right: 0;
  width: min(40vw, 700px);
  z-index: -1;
}
.ct-hero__cornice { position: absolute; inset: 0; }
.ct-hero__ritratto { position: absolute; inset: 0; background-color: transparent; }
.ct-hero__ritratto img { filter: brightness(.8) saturate(1.05); }
.ct-hero__testo { position: relative; min-width: 0; }
.ct-hero__titolo { font-size: clamp(44px, min(6.6vw, 12.5svh), 108px); max-width: 100%; }
.ct-hero__titolo .rientro { --rientro: 1.15em; }
.ct-hero__piede {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.4vw, 36px);
  margin-top: var(--aria);
}
.ct-hero__lead {
  font: 300 clamp(18px, 1.45vw, 22px)/1.4 var(--font-voce);
  letter-spacing: -.01em;
  color: var(--carta-2);
}
.ct-hero__lead .link { white-space: nowrap; }
.ct-hero__giu {
  flex: none;
  display: grid;
  place-items: center;
  width: 52px; height: 52px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px var(--linea-forte);
  color: var(--carta);
  transition: background-color .5s var(--curva-expo), color .5s var(--curva-expo), box-shadow .5s var(--curva-expo);
}
.ct-hero__giu .freccia { width: 16px; height: 16px; transition: transform .6s var(--curva-expo); }
.ct-hero__giu:hover { background: var(--carta); color: var(--nero); box-shadow: none; }
.ct-hero__giu:hover .freccia { transform: translateY(2px); }

@media (max-width: 819px) {
  .ct-hero { align-content: start; padding-top: 0; }
  .ct-hero__titolo { font-size: min(8.8vw, 52px); }
  .ct-hero__foto { position: relative; width: auto; height: 62svh; margin: 0 calc(var(--margine) * -1); }
  .ct-hero__testo { margin-top: -14svh; }
  .ct-hero__piede { align-items: flex-end; justify-content: space-between; }
  .ct-hero__lead .link { white-space: normal; }
}

/* ---------------------------------------------------------------- esito (senza JS) ----- */
.ct-esito { max-width: 760px; margin-bottom: var(--aria); padding: 20px 22px; box-shadow: inset 0 0 0 1px var(--linea-forte); background: var(--nero-2); }
.ct-esito__titolo { font: 500 22px/1.2 var(--font-sans); color: var(--carta); margin-bottom: 6px; }
.ct-esito--ok { box-shadow: inset 0 0 0 1px var(--viola-luce); }
.ct-esito--errore { box-shadow: inset 0 0 0 1px rgba(255, 143, 143, .55); }
.ct-esito p { color: var(--carta-2); }

/* ---------------------------------------------------------------- modulo (isola) ------- */
.ct-modulo {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  display: grid;
  align-content: center;
  padding-block: clamp(96px, 16vh, 200px);
}
.ct-modulo > * { min-width: 0; }

.modulo { position: relative; max-width: 1240px; }

/* avanzamento: «01 / 04» e una linea sottile */
.modulo__testa { display: flex; align-items: center; gap: 20px; margin-bottom: var(--aria); }
.modulo__conta { flex: none; font: 500 12px/1 var(--font-mono); letter-spacing: .06em; color: var(--carta-2); font-variant-numeric: tabular-nums; }
.modulo__linea { position: relative; flex: 1; height: 1px; background: var(--linea); overflow: hidden; }
.modulo__linea i {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--viola), var(--viola-luce));
  transform-origin: 0 50%;
  transition: transform 1s var(--curva-sipario);
}

/* la domanda */
.modulo__palco { position: relative; }
.modulo__domanda {
  font: var(--peso-display) clamp(40px, min(6.4vw, 11svh), 104px)/.92 var(--font-display);
  letter-spacing: -.045em;
  text-transform: uppercase;
  color: var(--carta);
  max-width: 100%;
}
.modulo__domanda:focus, .modulo__domanda:focus-visible { outline: none; }   /* focus solo programmatico (cambio passo): non è un comando */
.modulo__palco--contatto .modulo__domanda { font-size: clamp(36px, min(5.2vw, 9svh), 84px); }
.modulo__maschera { display: block; overflow-y: clip; padding-bottom: .12em; margin-bottom: -.12em; }
.modulo__domanda-in { display: block; }
.modulo__testo { margin-top: 18px; max-width: 52ch; font-size: clamp(16px, 1.15vw, 18px); color: var(--carta-3); }
.modulo__fs { border: 0; padding: 0; margin: 0; min-width: 0; }

/* le opzioni: pillole grandi (radio nativi: frecce, spazio e lettori di schermo funzionano da soli) */
.modulo__scelte { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(36px, 6vh, 72px); }
.modulo__scelta {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 60px;
  padding: 10px 26px 10px 10px;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px var(--linea-forte);
  font: 400 clamp(17px, 1.4vw, 21px)/1.2 var(--font-sans);
  letter-spacing: -.01em;
  color: var(--carta);
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: background-color .45s var(--curva-expo), box-shadow .35s ease, color .35s ease;
}
.modulo__scelta input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.modulo__tasto {
  flex: none;
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px var(--linea-forte);
  font: 500 12px/1 var(--font-mono);
  color: var(--carta-2);
  transition: background-color .45s var(--curva-expo), color .35s ease, box-shadow .35s ease;
}
.modulo__scelta:hover { box-shadow: inset 0 0 0 1px var(--carta-2); background: rgba(239, 233, 225, .04); }
.modulo__scelta:has(input:focus-visible) { outline: 2px solid var(--viola-luce); outline-offset: 3px; }
.modulo__scelta.is-scelta { background: var(--viola); box-shadow: inset 0 0 0 1px var(--viola), 0 18px 60px -24px rgba(121, 64, 224, .9); }
.modulo__scelta.is-scelta .modulo__tasto { background: var(--carta); color: var(--viola); box-shadow: none; }
.modulo__scelta--altro:not(.is-scelta) .modulo__scelta-testo { color: var(--carta-2); }

/* campi */
.modulo__campo { display: grid; gap: 8px; min-width: 0; }
.modulo__campo--altro { max-width: 720px; margin-top: 28px; }
.modulo__etichetta { font: 500 11px/1.2 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--carta-2); }
.modulo__campo input,
.modulo__campo textarea {
  width: 100%;
  padding: 10px 0 14px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--linea-forte);
  border-radius: 0;
  font: 400 clamp(20px, 1.8vw, 28px)/1.3 var(--font-sans);
  letter-spacing: -.01em;
  color: var(--carta);
  resize: vertical;
  transition: border-color .3s;
}
.modulo__campo textarea { min-height: calc(1.3em + 24px); field-sizing: content; max-height: 8em; }
.modulo__campo input::placeholder, .modulo__campo textarea::placeholder { color: var(--carta-3); }
.modulo__campo input:focus, .modulo__campo textarea:focus { outline: none; border-bottom-color: var(--viola-luce); }
.modulo__campo input:focus-visible, .modulo__campo textarea:focus-visible { box-shadow: 0 1px 0 0 var(--viola-luce); }
.modulo__campo.is-errato input, .modulo__campo.is-errato textarea { border-bottom-color: #ff8f8f; }
.modulo__errore-campo { font-size: 14px; color: #ffb0b0; }

/* ultimo passo: riepilogo minimo + contatti */
.modulo__riepilogo { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.modulo__chip {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 6px 16px;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px var(--linea-forte);
  font: 400 15px/1.2 var(--font-sans);
  color: var(--carta-2);
  text-align: left;
  transition: box-shadow .3s ease, color .3s ease;
}
.modulo__chip:hover { color: var(--carta); box-shadow: inset 0 0 0 1px var(--viola-luce); }
.modulo__campi { display: grid; gap: clamp(24px, 3.6vh, 36px) clamp(24px, 3vw, 48px); margin-top: clamp(28px, 4.4vh, 52px); }
@media (min-width: 700px) {
  .modulo__campi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* consenso */
.modulo__consenso { position: relative; display: flex; gap: 14px; align-items: flex-start; max-width: 76ch; margin-top: clamp(24px, 3.6vh, 32px); font-size: 15px; line-height: 1.5; color: var(--carta-2); cursor: pointer; }
.modulo__consenso input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.modulo__spunta { position: relative; flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--carta-2); transition: background-color .3s, box-shadow .3s; }
.modulo__spunta::after { content: ""; position: absolute; left: 7px; top: 3.5px; width: 5px; height: 10px; border: solid var(--nero); border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform .3s var(--curva-expo); }
.modulo__consenso input:checked + .modulo__spunta { background: var(--viola-luce); box-shadow: none; }
.modulo__consenso input:checked + .modulo__spunta::after { transform: rotate(45deg) scale(1); }
.modulo__consenso input:focus-visible + .modulo__spunta { outline: 2px solid var(--viola-luce); outline-offset: 3px; }
.modulo__consenso.is-errato .modulo__spunta { box-shadow: inset 0 0 0 1px #ff8f8f; }
.modulo__consenso a { color: var(--carta); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.modulo__aiuto { margin-top: 10px; font-size: 14px; color: #ffb0b0; }
.modulo__aiuto:empty { display: none; }
.modulo__avviso { margin-top: 20px; font-size: 15px; color: #ffb0b0; }

/* comandi */
.modulo__nav { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; margin-top: clamp(40px, 7vh, 80px); }
.modulo__palco--contatto + .modulo__trappola + .modulo__nav,
.modulo__palco--contatto ~ .modulo__nav { margin-top: clamp(28px, 4.4vh, 52px); }
.modulo__indietro {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  font: 500 12px/1 var(--font-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--carta-2);
  transition: color .3s;
}
.modulo__indietro .freccia { transition: transform .5s var(--curva-expo); }
.modulo__indietro:hover { color: var(--carta); }
.modulo__indietro:hover .freccia { transform: translateX(-3px); }
.modulo__nav .btn.is-attesa { opacity: .7; cursor: progress; }
.modulo__nav .btn:disabled { cursor: progress; }

/* trappola antispam: fuori dal flusso, mai annunciata */
.modulo__trappola, .modulo-trappola { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* invio non riuscito: ripiego mailto: */
.modulo__ko {
  display: grid;
  gap: 12px;
  max-width: 760px;
  margin-top: 36px;
  padding: 22px 24px;
  background: rgba(255, 143, 143, .05);
  box-shadow: inset 0 0 0 1px rgba(255, 143, 143, .45);
}
.modulo__ko-titolo { font: 500 20px/1.2 var(--font-sans); color: var(--carta); }
.modulo__ko-testo { color: var(--carta-2); max-width: 60ch; }
.modulo__ko-azioni { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.modulo__ko-azioni .btn { white-space: normal; text-align: left; }

/* esito positivo */
.modulo__ok { display: grid; justify-items: start; gap: 22px; }
.modulo__ok-segno { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--viola); color: var(--carta); box-shadow: 0 0 60px rgba(121, 64, 224, .6); }
.modulo__ok-titolo { font: var(--peso-display) clamp(44px, min(6.4vw, 11svh), 104px)/.92 var(--font-display); letter-spacing: -.045em; text-transform: uppercase; color: var(--carta); }
.modulo__ok-titolo:focus { outline: none; }
.modulo__ok-testo { max-width: 46ch; font: 300 clamp(18px, 1.45vw, 22px)/1.4 var(--font-voce); color: var(--carta-2); }
.modulo__ok-testo strong { color: var(--carta); font-weight: 400; }

@media (max-width: 599px) {
  .modulo__scelte { gap: 10px; }
  .modulo__scelta { min-height: 54px; padding: 8px 20px 8px 8px; gap: 12px; }
  .modulo__tasto { width: 36px; height: 36px; }
  .modulo__nav .btn { flex: 1 1 auto; justify-content: space-between; }
}
@media (pointer: coarse) {
  .modulo__tasto { display: none; }
  .modulo__scelta { padding-left: 22px; }
}

/* ---------------------------------------------------------------- ripiego senza JS ----- */
.modulo-ripiego { display: grid; gap: clamp(48px, 8vh, 88px); max-width: 1100px; }
.modulo-ripiego__passo { display: grid; gap: 24px; border: 0; margin: 0; padding: 0; min-width: 0; }
.modulo-ripiego__titolo {
  padding: 0;
  margin-bottom: clamp(24px, 4vh, 40px);
  font: var(--peso-display) clamp(32px, 4.4vw, 64px)/.95 var(--font-display);
  letter-spacing: -.04em;
  text-transform: uppercase;
  color: var(--carta);
}
.modulo-ripiego__opzioni { display: flex; flex-wrap: wrap; gap: 10px; }
.modulo-ripiego__opzioni label { display: inline-flex; gap: 12px; align-items: center; min-height: 52px; padding: 10px 22px 10px 16px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--linea-forte); cursor: pointer; font-size: 18px; }
.modulo-ripiego__opzioni label:has(input:checked) { box-shadow: inset 0 0 0 1px var(--viola-luce); background: rgba(121, 64, 224, .2); }
.modulo-ripiego__opzioni input { accent-color: var(--viola); width: 16px; height: 16px; margin: 0; }
.modulo-ripiego__campi { display: grid; gap: 28px 40px; }
@media (min-width: 700px) {
  .modulo-ripiego__campi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modulo-ripiego__campo--largo { grid-column: 1 / -1; }
}
.modulo-ripiego__campo { display: grid; gap: 8px; max-width: 720px; }
.modulo-ripiego__campo > span { font: 500 11px/1.3 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--carta-2); }
.modulo-ripiego input[type=text], .modulo-ripiego input[type=email], .modulo-ripiego input[type=tel], .modulo-ripiego textarea {
  width: 100%; padding: 10px 0 12px; background: transparent; border: 0; border-bottom: 1px solid var(--linea-forte); border-radius: 0;
  font: 400 21px/1.35 var(--font-sans); color: var(--carta);
}
.modulo-ripiego input:focus, .modulo-ripiego textarea:focus { outline: none; border-bottom-color: var(--viola-luce); }
.modulo-ripiego input::placeholder, .modulo-ripiego textarea::placeholder { color: var(--carta-3); }
.modulo-ripiego__consenso { display: flex; gap: 12px; align-items: flex-start; max-width: 76ch; color: var(--carta-2); font-size: 15px; }
.modulo-ripiego__consenso input { margin-top: 4px; accent-color: var(--viola); }
.modulo-ripiego__consenso a, .modulo-ripiego a { color: var(--viola-luce); text-decoration: underline; }
.modulo-ripiego__invio { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }

/* ---------------------------------------------------------------- recapiti ------------- */
.ct-email { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(16px, 2.2vw, 36px); }
.ct-email__indirizzo {
  position: relative;
  min-width: 0;
  max-width: 100%;
  font: var(--peso-display) clamp(30px, 6.4vw, 104px)/1.05 var(--font-display);
  letter-spacing: -.045em;
  color: var(--carta);
  overflow-wrap: anywhere;
  background-image: linear-gradient(var(--viola-luce), var(--viola-luce));
  background-repeat: no-repeat;
  background-size: 0% 1px;
  background-position: 100% 100%;
  transition: background-size 1s var(--curva-link), color .4s ease;
}
.ct-email__indirizzo:hover { color: var(--viola-luce); background-size: 100% 1px; background-position: 0% 100%; }
.ct-email__copia {
  position: relative;
  flex: none;
  display: grid;
  place-items: center;
  width: clamp(48px, 4.4vw, 64px); height: clamp(48px, 4.4vw, 64px);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px var(--linea-forte);
  color: var(--carta);
  cursor: copy;
  transition: background-color .5s var(--curva-expo), color .5s var(--curva-expo), box-shadow .5s var(--curva-expo);
}
.ct-email__copia:hover { background: var(--carta); color: var(--nero); box-shadow: none; }
.ct-email__icona { grid-area: 1 / 1; transition: opacity .3s ease, transform .5s var(--curva-expo); }
.ct-email__icona--fatto { opacity: 0; transform: scale(.6); }
.ct-email__copia.is-copiata { background: var(--viola); color: var(--carta); box-shadow: none; }
.ct-email__copia.is-copiata .ct-email__icona--copia { opacity: 0; transform: scale(.6); }
.ct-email__copia.is-copiata .ct-email__icona--fatto { opacity: 1; transform: none; }

.ct-voci { display: grid; margin-top: clamp(72px, 14vh, 160px); }
.ct-voce { display: grid; gap: 10px; align-content: start; padding: 26px 0 30px; border-top: 1px solid var(--linea); min-width: 0; }
.ct-voce__nome {
  justify-self: start;
  display: inline-flex;
  align-items: baseline;
  gap: .32em;
  font: var(--peso-display) clamp(28px, 2.7vw, 42px)/1 var(--font-display);
  letter-spacing: -.035em;
  text-transform: uppercase;
  color: var(--carta);
  transition: color .4s ease;
}
.ct-voce__nome .freccia { width: .6em; height: .6em; color: var(--carta-3); transition: transform .6s var(--curva-expo), color .4s ease; }
a.ct-voce__nome:hover { color: var(--viola-luce); }
a.ct-voce__nome:hover .freccia { color: var(--viola-luce); transform: translate(2px, -2px); }
.ct-voce__det { max-width: 34ch; font-size: 16px; line-height: 1.45; color: var(--carta-2); }
@media (min-width: 820px) {
  .ct-voci { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gutter); }
}

/* ---------------------------------------------------------------- domande + guida ------ */
.ct-domande { display: grid; gap: var(--aria); }
.ct-domande__titolo {
  font: var(--peso-display) clamp(32px, 3.6vw, 56px)/.95 var(--font-display);
  letter-spacing: -.035em;
  text-transform: uppercase;
  color: var(--carta);
}
.ct-domande__corpo { min-width: 0; }
@media (min-width: 1024px) {
  .ct-domande { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: start; }
  .ct-domande__titolo { grid-column: 1 / span 4; position: sticky; top: calc(var(--testata-h) + 40px); }
  .ct-domande__corpo { grid-column: 6 / -1; }
}

/* la guida AI: una riga che si apre */
.ct-guida { margin-top: clamp(48px, 9vh, 104px); }
.ct-guida__apri {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  cursor: pointer;
}
.ct-guida__apri::-webkit-details-marker { display: none; }
.ct-guida__frase { font: 300 clamp(20px, 1.8vw, 28px)/1.3 var(--font-voce); letter-spacing: -.015em; color: var(--carta-2); }
.ct-guida__chiedi {
  color: var(--carta);
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-size: 100% 1px;
  background-position: 0 100%;
  transition: color .3s ease;
}
.ct-guida__apri:hover .ct-guida__chiedi { color: var(--viola-luce); }
.ct-guida__segno {
  flex: none;
  display: grid;
  place-items: center;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--viola);
  color: var(--carta);
  transition: transform .6s var(--curva-expo), background-color .4s ease;
}
.ct-guida__segno .freccia { width: 16px; height: 16px; }
.ct-guida__apri:hover .ct-guida__segno { background: var(--viola-luce); color: var(--nero); }
.ct-guida[open] .ct-guida__segno { transform: rotate(90deg); }
.ct-guida .ct-chat { margin-top: 28px; min-width: 0; }
/* ripiego della chat prima che isole/chat.js arrivi (i suoi stili veri li inietta lo script) */
.chat--ripiego { display: grid; gap: 16px; padding: 22px 20px; background: var(--nero-2); box-shadow: inset 0 0 0 1px var(--linea); }
.chat--ripiego .chat__corpo { display: grid; gap: 16px; }
.chat--ripiego .chat__msg { padding-left: 14px; border-left: 1px solid var(--viola-luce); color: var(--carta); }
.chat--ripiego .chat__domande { display: flex; flex-wrap: wrap; gap: 8px; }
.chat--ripiego .btn { white-space: normal; text-align: left; }
