/* ==========================================================================
   Centro Anna Rita Buonincontro — pagine legali (Privacy Policy, Cookie Policy)
   --------------------------------------------------------------------------
   Ordine di caricamento: css/base.css → css/inner.css → css/legale.css
   Nessun artboard dedicato nel design: riusa la tipografia delle pagine interne.
   Da base.css: token, .split__text (Inter 200, 20/36).
   Da inner.css: .cs-container, .page-hero.
   Titoli di sezione come .cs-title, sottotitoli teal come l'elenco .cs-list
   (Chi siamo), elenchi con il quadratino teal delle altre pagine.

   Struttura della pagina:
     .page-hero.lg-hero   → Hero (eyebrow + titolo + sottotitolo)
     .lg-body > .lg-text  → testo su una colonna (h2, h3, p, ul)

   Indice
   01. Testo
   02. Responsive
   ========================================================================== */

/* 01. Testo -------------------------------------------------------------- */
.lg-body { padding: 92px 0 120px; }
.lg-text { max-width: 900px; }
/* Sezioni: filetto sottile teal di separazione, come le righe delle FAQ */
.lg-text h2 {
  font-family: var(--ff-head); font-weight: 700;
  font-size: clamp(26px, 1.852vw, 32px); line-height: 1.125; color: var(--slate);
}
.lg-text h2:not(:first-child) { margin-top: 56px; padding-top: 48px; border-top: 1px solid rgba(1, 156, 165, .35); }
.lg-text h3 {
  margin-top: 32px;
  font-family: var(--ff-head); font-weight: 700; font-size: 20px; line-height: 32px; color: var(--teal);
}
.lg-text h2 + h3 { margin-top: 20px; }
.lg-text .split__text { margin-top: 16px; }
.lg-text h2 + .split__text { margin-top: 20px; }
.lg-text h3 + .split__text { margin-top: 6px; }
.lg-text strong { font-weight: 600; color: var(--slate); }
.lg-text a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; transition: color .3s var(--ease); }
.lg-text a:hover { color: var(--teal-deep); }
.lg-text ul, .lg-text ol { margin-top: 16px; }
.lg-text li {
  position: relative; padding-left: 22px;
  font-weight: 200; font-size: 20px; line-height: 36px;
}
.lg-text ul > li::before { content: ""; position: absolute; left: 2px; top: 16px; width: 5px; height: 5px; background: var(--teal); }
.lg-text ol { counter-reset: lg; }
.lg-text ol > li { counter-increment: lg; padding-left: 30px; }
.lg-text ol > li::before { content: counter(lg) "."; position: absolute; left: 0; font-family: var(--ff-head); font-weight: 700; color: var(--teal); }

/* 02. Responsive --------------------------------------------------------- */
/* ≤1023 — tablet */
@media (max-width: 1023.98px) {
  .lg-body { padding: 72px 0 88px; }
  .lg-text { max-width: 760px; }
}

/* ≤767 — mobile */
@media (max-width: 767.98px) {
  .lg-body { padding: 56px 0 64px; }
  .lg-text h2:not(:first-child) { margin-top: 40px; padding-top: 36px; }
  .lg-text h3 { margin-top: 26px; font-size: 19px; line-height: 28px; }
  .lg-text li { font-size: 18px; line-height: 30px; }
  .lg-text ul > li::before { top: 13px; }
}
