/* Pagine di servizio dello studio (ADR, Dolby Atmos) — 18 ago 2026.
   Non ridisegnano niente: usano home.css + studio.css e aggiungono solo quello che sulle altre
   pagine non esisteva, cioe' l'elenco delle domande. L'hero qui e' piu' basso di quello dello
   studio perche' queste pagine devono arrivare al contenuto, non fare scena. */

.sv-hero .hero-inner { padding-top: 96px; padding-bottom: 64px; }
.sv-hero .hero-title { font-size: clamp(2.1rem, 6vw, 4.6rem); line-height: 1.02; }

.sv-faq-sec { padding-top: 8px; }
.sv-faq-list { max-width: 900px; }   /* stesso margine sinistro dei titoli di sezione: allineate */

/* Le risposte sono NELL'HTML e Google le legge anche chiuse: e' la strada legittima per avere
   testo utile senza appesantire la pagina. Niente testo nascosto, che e' motivo di penalizzazione. */
.sv-faq {
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  padding: 2px 0;
}
.sv-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 18px 34px 18px 2px;
  position: relative;
  font-weight: 600;
  font-size: 1.02rem;
  transition: color .18s ease;
}
.sv-faq summary::-webkit-details-marker { display: none; }
.sv-faq summary::after {
  content: "+";
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1;
  opacity: .55;
  transition: transform .2s ease, opacity .2s ease;
}
.sv-faq[open] summary::after { transform: translateY(-50%) rotate(45deg); opacity: .9; }
.sv-faq summary:hover { color: #ff4d4d; }
.sv-faq p {
  margin: 0 0 20px;
  padding-right: 34px;
  opacity: .78;
  line-height: 1.62;
  max-width: 74ch;
}

.sv-cta {
  text-align: center;
  padding: 72px 20px 96px;
}
.sv-cta .sec-head { margin-bottom: 26px; }
/* Il filetto sotto il titolo lo centra la classe `center` gia' presente in home.css: qui basta
   centrare il sottotitolo, che ha una larghezza massima sua. */
.sv-cta .sec-sub { margin-left: auto; margin-right: auto; max-width: 62ch; }
.sv-cta .hero-cta { justify-content: center; display: flex; gap: 14px; flex-wrap: wrap; }

@media (max-width: 640px) {
  .sv-hero .hero-inner { padding-top: 76px; padding-bottom: 48px; }
  .sv-faq summary { font-size: .98rem; padding-right: 30px; }
}
