/* ============================================================
   «ROTATIVA» — interni.css: le sei pagine interne.
   Apertura bassa in bordeaux (niente fotografia: nel tema le
   pagine interne si aprono con la sola tipografia), principio
   guida sulla fascia calda, i due gemelli dell'Associazione,
   i principi, i soffietti delle domande, gli atti legali e la
   variante centrata del congedo.
   ============================================================ */

/* ============ APERTURA DELLE INTERNE ============ */
.hero-inner{padding-block:clamp(3rem,4.5vw,4.5rem) clamp(2.5rem,4vw,3.75rem)}
.hero-inner .container{position:relative}
/* il retino si ferma prima che il testo lo raggiunga: il confine fra campo
   pieno e campo rigato dev'essere una linea netta, non passare fra le parole */
.hero-inner .stripes{width:42%}
.page-title{
  font-size:clamp(1.875rem,1.15rem + 2.5vw,2.75rem);
  color:var(--ivory);
  max-width:15em;
}
.lead{
  font-size:1.1875rem;line-height:1.68;
  color:var(--ivory-body);
  max-width:33rem;
  margin-top:1.25rem;
}
/* Contatti: il numero è il protagonista annunciato dal titolo, non la sua coda */
.hero-inner .hotline{margin-top:1.75rem}
.note-italic{
  font-family:var(--serif);font-style:italic;
  font-size:1.0625rem;color:var(--ivory-soft);
  margin-top:1rem;
}

/* ============ PRINCIPIO GUIDA: la riga che vale la pagina ============ */
.guiding-principle p{
  font-family:var(--serif);
  font-size:1.375rem;line-height:1.5;
  color:var(--ink);
  max-width:46ch;
}
@media (min-width:900px){.guiding-principle p{font-size:1.5rem}}
.guiding-principle em{font-style:italic;color:var(--red)}

/* ============ I DUE GEMELLI: avvocati e medici legali ============
   Due targhe basse: l'icona e il nome della competenza. Il testo che le
   spiega sta UNA volta sola, nella riga d'apertura della sezione. */
.team-lead{font-size:1.1875rem;line-height:1.68;color:var(--gray-1);max-width:36rem;margin-top:1.1rem}
.twins{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.25rem,2.5vw,1.75rem)}
.twin{
  display:flex;align-items:center;gap:1.25rem;
  background:var(--paper);
  border:1px solid var(--border);
  padding:1.4rem 1.5rem;
}
.twin h3{font-size:1.375rem;margin:0}

/* ============ LA SQUADRA: la stampa e il testo ============ */
.team-grid{
  display:grid;grid-template-columns:.95fr 1.05fr;
  gap:clamp(2rem,4vw,3.25rem);align-items:start;
  margin-top:clamp(2rem,3.5vw,3rem);
}
.team-grid .plate{aspect-ratio:5/4}
.team-text p{font-size:1.0625rem;line-height:1.68;color:var(--gray-1)}
.team-text p + p{margin-top:1rem}
.team-text strong{color:var(--ink);font-weight:600}

/* ============ I PRINCIPI: tre voci sulla fascia calda ============ */
.principles{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.25rem)}
.principle h3{font-family:var(--sans);font-size:1.0625rem;font-weight:600;line-height:1.4;margin-bottom:.5rem}
.principle p{font-size:1rem;line-height:1.62;color:var(--gray-1)}
.principle .rule{width:100%;margin:0 0 1.05rem;background:var(--gold-rule)}

/* ============ SOFFIETTI: le domande frequenti ============ */
.accordion{display:flex;flex-direction:column;gap:.75rem}
.accordion-item{background:var(--paper);border:1px solid var(--border)}
.accordion-item summary{
  display:flex;align-items:center;gap:1rem;
  list-style:none;cursor:pointer;
  padding:1.15rem 1.25rem;min-height:56px;
  font-family:var(--serif);font-size:1.1875rem;line-height:1.4;
  color:var(--ink);
}
.accordion-item summary::-webkit-details-marker{display:none}
.accordion-item summary::after{
  content:"";flex:none;order:-1;
  width:34px;height:34px;border-radius:50%;
  background:#F6E7E2;
  background-image:linear-gradient(var(--red),var(--red)),linear-gradient(var(--red),var(--red));
  background-size:13px 1.5px,1.5px 13px;
  background-position:center,center;
  background-repeat:no-repeat;
  transition:transform .25s var(--ease-soft);
}
.accordion-item[open] summary::after{transform:rotate(135deg)}
.accordion-item summary:hover{color:var(--red)}
.accordion-body{padding:0 1.25rem 1.35rem 4.25rem}
.accordion-body p{font-size:1.0625rem;line-height:1.68;color:var(--gray-1);max-width:34rem}

/* ============ ATTI LEGALI ============ */
.legal-notes{display:flex;flex-direction:column;gap:1.25rem}
.legal-note{
  background:var(--paper);
  border:1px solid var(--border);
  padding:1.6rem 1.4rem;
}
@media (min-width:900px){.legal-note{padding:2rem 1.85rem}}
.legal-note h2{font-size:1.5rem;margin-bottom:.9rem}
.legal-note p{font-size:1.0625rem;line-height:1.68;color:var(--gray-1);max-width:34rem}
.legal-note em{font-style:italic;color:var(--gray-2)}
.legal-note .rule{margin:0 0 .9rem}

/* ============ CONGEDO CENTRATO: la variante delle interne ============ */
.closing-center{flex-direction:column;text-align:center;gap:1.75rem}
.closing-center .closing-text{max-width:40ch;margin-inline:auto}
.closing-center .closing-text p{margin-inline:auto}
.closing-center .closing-phone,
.closing-center .hours,
.closing-center .tap-note{text-align:center}
.closing-button{margin-top:1.5rem}

/* ===== RESPONSIVE — interni ===== */
@media (max-width:1000px){
  .team-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .team-grid{grid-template-columns:1fr;gap:1.75rem}
  .principles{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .twins{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr;gap:1.5rem}
  .accordion-item summary{font-size:1.0625rem;gap:.85rem;padding:1rem}
  .accordion-body{padding:0 1rem 1.15rem 3.6rem}
}
