/* FAQ: accordion curato */
.aperta--bassa { min-height: clamp(520px, 78svh, 860px); }

.cerca { display: flex; align-items: center; gap: 12px; margin-top: clamp(28px, 4vh, 44px); padding: 0 14px 0 20px; height: 64px; border-radius: 999px; border: 1px solid var(--linea-forte); background: rgba(255, 255, 255, .86); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: var(--ombra-morbida); transition: border-color .3s, box-shadow .3s; }
.cerca:focus-within { border-color: var(--imperial); box-shadow: 0 0 0 4px rgba(142, 183, 206, .3); }
.cerca svg { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--sky); stroke-width: 1.8; stroke-linecap: round; }
.cerca input { flex: 1; min-width: 0; height: 100%; border: 0; background: none; color: var(--mint); font: 400 var(--t-testo)/1 var(--display); caret-color: var(--fucsia); }
.cerca input::placeholder { color: var(--nebbia); }
.cerca input:focus { outline: none; }
.cerca input::-webkit-search-cancel-button { filter: none; }
.cerca kbd { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--linea); font: 400 var(--t-dato)/1 var(--mono); color: var(--nebbia); }
.cerca-conto { flex: none; color: var(--sky); padding-right: 6px; }
.cerca:focus-within kbd { display: none; }

.faq-gruppo { padding: clamp(48px, 8vh, 96px) 0; }
.faq-griglia { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 24px clamp(24px, 4vw, 80px); align-items: start; }
.faq-gruppo-titolo { position: sticky; top: 150px; display: grid; gap: 12px; font: 500 var(--t-t2)/1.02 var(--voce); letter-spacing: -.02em; color: var(--titolo); }
.faq-gruppo-titolo .mono { letter-spacing: 0; color: var(--sky); font-weight: 400; }

.domande { border-bottom: 1px solid var(--linea); }
.domanda { border-top: 1px solid var(--linea); transition: background-color .5s var(--esce); }
.domanda summary { display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: 20px; align-items: center; padding: clamp(18px, 2.6vh, 26px) 0; cursor: pointer; list-style: none; }
.domanda summary::-webkit-details-marker { display: none; }
.domanda summary:focus-visible { outline-offset: -2px; border-radius: 14px; }
.q { font: 600 var(--t-t4)/1.2 var(--display); letter-spacing: -.015em; transition: color .3s, transform .6s var(--esce); }
.domanda summary:hover .q { color: var(--imperial); transform: translateX(6px); }
.segno { position: relative; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--linea-forte); transition: background-color .4s, border-color .4s, transform .6s var(--esce); }
.segno::before, .segno::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; border-radius: 2px; background: var(--mint); transition: transform .5s var(--esce); }
.segno::after { transform: rotate(90deg); }
.domanda summary:hover .segno { border-color: var(--imperial); }
.aperta-d .segno { background: var(--mint); border-color: var(--mint); transform: rotate(180deg); }
.aperta-d .segno::before, .aperta-d .segno::after { background: var(--notte); }
.aperta-d .segno::after { transform: rotate(0deg); }
.aperta-d .q { color: var(--imperial); }
.risposta { overflow: hidden; }
.risposta p { padding: 0 64px clamp(22px, 3vh, 32px) 0; color: var(--sky-chiaro); font-size: var(--t-testo); line-height: 1.65; }
.domanda:target summary .q { color: var(--sky); }

.cerca-vuoto { padding: clamp(48px, 8vh, 96px) var(--margine); display: grid; gap: 16px; }
.cerca-vuoto a { color: var(--imperial); }

@media (max-width: 900px) {
  .faq-griglia { grid-template-columns: 1fr; }
  .faq-gruppo-titolo { position: static; }
  .risposta p { padding-right: 0; }
}
@media (max-width: 480px) {
  .cerca { height: 56px; padding-left: 16px; }
  .cerca kbd, .cerca-conto { display: none; }
}

/* ===================================================================== adattivo (21/10)
   Il titolo del gruppo si ferma sotto la testata a una distanza che segue l'altezza dello schermo. */
@media (min-width: 901px) { .faq-gruppo-titolo { top: calc(var(--testa-h) + clamp(24px, 8vh, 74px)); } }
