Concetti Chiave utilizzati

• display: flex: Attiva il modello Flexbox sul contenitore.
• justify-content: Allinea gli elementi lungo l'asse principale (es. space-between separa gli oggetti, center li raggruppa al centro).
• align-items: Allinea gli elementi lungo l'asse trasversale (ottimo per centrare verticalmente).
• gap: Crea uno spazio uniforme tra gli elementi flessibili (molto più pulito dei vecchi margini).
• flex-wrap: wrap: Permette agli elementi di andare "a capo" quando lo spazio finisce, rendendo il sito adatto ai dispositivi mobile.
• flex: 0 1 300px: Una scorciatoia per flex-grow (0), flex-shrink (1) e flex-basis (300px), che definisce la dimensione ideale dell'elemento.