/*
 * Modulo2 — foglio autonomo. Nessuna dipendenza da altri moduli o da Bootstrap.
 * Ogni selettore è limitato a .design-modulo2.
 * Colori, font, dimensioni e spazi sono variabili del tab Aspetto, per istanza.
 * Per un override singolo usare #modulo2-module-ID oppure un'ancora unica.
 * Le regole responsive seguono anche la larghezza della posizione Helix.
 */
.design-modulo2 {
  width: 100%; margin: 0; padding: 0;
  font-family: var(--design-text-font, Arial, Helvetica, sans-serif);
  font-size: 16px; line-height: 1.5;
  color: var(--design-body, #20261f); background: var(--design-background, #fbfaf6);
  scroll-margin-top: 100px;
}
.design-modulo2, .design-modulo2 * { box-sizing: border-box; }
.design-modulo2 [hidden] { display: none !important; }
.design-modulo2 .dg-wrap { width: 100%; max-width: var(--design-max-width, 1600px); margin: 0 auto; container: modulo2 / inline-size; }
.design-modulo2 p { margin: 0; }
.design-modulo2 :is(a, button):focus-visible { outline: 3px solid var(--design-accent, currentColor); outline-offset: 4px; }
.design-modulo2 .dg-inner { min-width: 0; overflow-wrap: anywhere; }
.design-modulo2 .dg-headline { font-family: var(--design-display-font, Georgia, serif); color: var(--design-title, #20261f); }
.design-modulo2 .dg-headline :is(em, i) { color: var(--design-accent, #912535); font-style: italic; }

/* 1. Spazi e intestazione: titolo ampio a sinistra, frase breve a destra. */
.design-modulo2 .dg-inner { min-height: 717px; padding: var(--design-padding-top, 40px) 8.375% var(--design-padding-bottom, 28px); padding-inline: clamp(24px, 8.375cqw, 134px); }
.design-modulo2 .dg-eyebrow { color: var(--design-eyebrow); font-size: 14px; font-weight: 700; line-height: 1.5; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 28px; }
.design-modulo2 .dg-heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; }
.design-modulo2 .dg-headline { margin: 0; font-size: var(--design-heading-size, 64px); font-size: min(var(--design-heading-size, 64px), max(24px, var(--design-heading-fluid, 4cqw))); font-weight: 700; line-height: 1.1; letter-spacing: -.04em; }
.design-modulo2 .dg-side-note { flex: 0 1 230px; color: var(--design-side-note); font-size: 14px; line-height: 1.8; letter-spacing: .14em; text-transform: uppercase; padding-bottom: 4px; }

/* 2. Testo e citazione: divisore verticale e ampio spazio fra le due colonne. */
.design-modulo2 .dg-content { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 64px; margin-top: 52px; }
.design-modulo2 .dg-copy { min-width: 0; }
.design-modulo2 .dg-body { max-width: 650px; color: var(--design-body); font-size: var(--design-body-size, 22px); font-size: min(var(--design-body-size, 22px), max(16px, var(--design-body-fluid, 1.375cqw))); line-height: 1.65; }
.design-modulo2 .dg-body p { margin: 0 0 22px; }
.design-modulo2 .dg-body p:last-child { margin-bottom: 0; }
.design-modulo2 .dg-body :is(ul, ol) { margin: 0 0 22px; padding-left: 1.25em; }
.design-modulo2 .dg-body a { color: var(--design-accent); text-decoration: underline; }
.design-modulo2 .dg-quote { position: relative; margin: 0; padding: 14px 0 24px clamp(30px, 7.5cqw, 120px); border-left: 1px solid var(--design-line); min-width: 0; }
.design-modulo2 .dg-quote-mark { position: absolute; left: clamp(14px, 5cqw, 80px); top: -14px; color: var(--design-accent); font-family: var(--design-display-font, Georgia, serif); font-size: 90px; font-weight: 700; line-height: 1; }
.design-modulo2 .dg-quote blockquote { margin: 0; padding: 0; border: 0; font-family: var(--design-display-font, Georgia, serif); font-size: var(--design-quote-size, 60px); font-size: min(var(--design-quote-size, 60px), max(24px, var(--design-quote-fluid, 3.75cqw))); font-weight: 400; line-height: 1.18; letter-spacing: -.035em; color: var(--design-quote); }
.design-modulo2 .dg-quote blockquote :is(em, i) { color: var(--design-accent); }
.design-modulo2 .dg-quote figcaption { color: var(--design-signature); font-size: 12px; line-height: 1.6; letter-spacing: .12em; text-transform: uppercase; margin-top: 42px; }

/* 3. Invito all'azione: link manuale in forma di pulsante, nota indipendente. */
.design-modulo2 .dg-button { display: inline-flex; align-items: center; justify-content: center; max-width: 100%; min-height: 65px; margin-top: 40px; padding: 18px 30px; border: 1px solid transparent; border-radius: 3px; background: var(--design-button-bg); color: var(--design-button-text); font: 700 16px/1.4 var(--design-text-font, Arial, sans-serif); text-align: center; text-decoration: none; }
.design-modulo2 .dg-button:hover { filter: brightness(.94); }
.design-modulo2 .dg-footnote { color: var(--design-footnote); font-size: 16px; line-height: 1.6; margin-top: 16px; }

/* 4. Posizioni strette e mobile: titolo e citazione diventano blocchi verticali. */
@container modulo2 (max-width: 1050px) {
  .design-modulo2 .dg-inner { min-height: 0; padding-inline: 32px; }
  .design-modulo2 .dg-heading-row { align-items: flex-start; flex-direction: column; gap: 22px; }
  .design-modulo2 .dg-headline { font-size: min(var(--design-heading-size, 64px), 52px); }
  .design-modulo2 .dg-side-note { flex: none; font-size: 12px; }
  .design-modulo2 .dg-content { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-top: 34px; }
  .design-modulo2 .dg-body { max-width: none; font-size: min(var(--design-body-size, 22px), 20px); }
  .design-modulo2 .dg-quote { border-left: 0; border-top: 1px solid var(--design-line); padding: 32px 0 0 42px; }
  .design-modulo2 .dg-quote-mark { left: 0; top: 16px; font-size: 70px; }
  .design-modulo2 .dg-quote blockquote { font-size: min(var(--design-quote-size, 60px), 46px); }
  .design-modulo2 .dg-quote figcaption { margin-top: 24px; }
}
@container modulo2 (max-width: 520px) {
  .design-modulo2 .dg-inner { padding-inline: 22px; }
  .design-modulo2 .dg-eyebrow { font-size: 10px; margin-bottom: 24px; }
  .design-modulo2 .dg-headline { font-size: min(var(--design-heading-size, 64px), 38px); }
  .design-modulo2 .dg-body { font-size: 17px; }
  .design-modulo2 .dg-button { width: 100%; min-height: 52px; margin-top: 28px; padding: 14px 20px; font-size: 14px; }
  .design-modulo2 .dg-footnote { font-size: 13px; }
  .design-modulo2 .dg-quote blockquote { font-size: min(var(--design-quote-size, 60px), 34px); }
  .design-modulo2 .dg-quote figcaption { font-size: 10px; }
}
/* Fallback per browser senza container queries. */
@supports not (container-type: inline-size) {
  @media (max-width: 1050px) {
    .design-modulo2 .dg-inner { min-height: 0; padding-inline: 24px; }
    .design-modulo2 .dg-heading-row { flex-direction: column; align-items: flex-start; }
    .design-modulo2 .dg-side-note { flex: none; }
    .design-modulo2 .dg-content { grid-template-columns: minmax(0, 1fr); }
    .design-modulo2 .dg-headline { font-size: 40px; }
    .design-modulo2 .dg-quote { padding-left: 40px; }
    .design-modulo2 .dg-quote-mark { left: 0; }
    .design-modulo2 .dg-quote blockquote { font-size: 36px; }
  }
}