.title-article {
    font-size: 2em;
    font-weight: bold;
    margin-bottom: 20px;
}

.subtitle-article {
    font-size: 1.5em;
    margin-top: 25px;
    margin-bottom: 15px;
    color: #333;
    position: relative;
    padding-left: 50px; /* aumenta lo spazio tra icona e testo */
}

/* Icone dei sottotitoli */
.subtitle-article::before {
    position: absolute;
    left: 0;
    top: 50%;             /* centra verticalmente */
    transform: translateY(-50%);
    font-size: 1.2em;     /* dimensione icona leggermente più grande */
}

.subtitle-article.icon-idea::before { content: "💡"; }
.subtitle-article.icon-science::before { content: "🔬"; }
.subtitle-article.icon-smile::before { content: "😄"; }
.subtitle-article.icon-sad::before {content: "😢";}
.subtitle-article.icon-anguished::before {content: "😟";}
.subtitle-article.icon-alert::before {content: "⚠️";}
.subtitle-article.icon-history::before { content: "📜"; }
.subtitle-article.icon-eye::before { content: "👁️"; }
.subtitle-article.icon-rocket::before { content: "🚀"; }
.subtitle-article.icon-star::before { content: "⭐"; }

.quote-box, .quote-box-blue, .quote-box-green, .quote-box-purple {
    padding: 10px 15px;
    margin: 15px 0;
    font-style: italic;
}

.quote-box { border-left: 4px solid #4CAF50; background-color: #f9fff9; }
.quote-box-blue { border-left: 4px solid #2196F3; background-color: #f0f8ff; }
.quote-box-green { border-left: 4px solid #4CAF50; background-color: #f9fff9; }
.quote-box-purple { border-left: 4px solid #8E44AD; background-color: #f5f0ff; }

.example-box { border: 2px dashed #FFA500; background-color: #fffaf0; padding: 10px 15px; margin: 15px 0; }