/* Intro (corpo centrale) */
.section--intro{
  margin-top: 60px;
  margin-bottom: 60px;
}
.section--intro .intro__container{
  max-width: var(--body-max, 900px);
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

/* Titolo principale */
.section--intro .intro__title{
  font-family: var(--font-title, "Roboto Condensed", system-ui, sans-serif);
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 12px 0;
  color: var(--text-strong);
  text-transform: uppercase;
}

/* OCCHIELLO (abstract): più grande e più sottile */
.section--intro .intro__abstract{
  /* Dimensione responsiva: cresce un po' su schermi grandi */
  font-size: clamp(1.125rem, 1rem + 1vw, 1.5rem); /* ~18px → 24px */
  font-weight: 300; /* più sottile */
  line-height: 1.8; /* più aria tra le righe */
  letter-spacing: 0.01em; /* leggerissima spaziatura */
  color: var(--text); /* mantiene il colore testo del tema */
  margin: 0 0 24px 0;
}

/* Due colonne con 20px di gap (desktop) */
.section--intro .intro__cols{
  column-count: 2;
  column-gap: 20px;
  line-height: 1.7;
  color: var(--text);
}
.section--intro .intro__cols p{
  break-inside: avoid;
  margin: 0 0 1rem 0;
}

/* Mobile: una colonna */
@media (max-width: 768px){
  .section--intro .intro__cols{
    column-count: 1;
  }
}

/* [Opzionale] Variante extra-evidente dell’occhiello, se mai servisse:
   aggiungi la classe .intro__abstract--eyebrow all'abstract per forzare stile più “editoriale”.
   Non usata di default. */
.section--intro .intro__abstract--eyebrow{
  font-size: clamp(1.25rem, 1.1rem + 1.2vw, 1.65rem);
  font-weight: 300;
  letter-spacing: 0.02em;
}
