/* ========================================================== */
/* Style commun pour les pages d'articles (Article Layout)    */
/* Consolidation des styles autrefois en ligne via $pageExtraStyle */
/* ========================================================== */

/* Conteneur principal de l'article (article-wrapper) */
.article-wrapper {
    max-width: 900px;
    margin: 0 auto;
    background: var(--bg-white); /* Utilise la variable du modèle [1, 3] */
    padding: 40px;
    border-radius: var(--radius); /* Utilise la variable du modèle [1, 3] */
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* Titres H2 à l'intérieur du corps de l'article (.article-body) */
.article-body h2 {
    font-size: 1.7rem;
    font-weight: 600;
    color: var(--primary-color); /* La couleur principale des titres [1, 3] */
    margin-top: 50px;
    margin-bottom: 25px;
}

/* Titres H3 à l'intérieur du corps de l'article (.article-body) */
.article-body h3 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-top: 30px;
    margin-bottom: 15px;
}

/* Style du corps de texte (paragraphes et éléments de liste) */
.article-body p, .article-body li {
    font-size: 1.15rem; /* Taille commune pour le corps de texte [2, 4] */
    line-height: 1.7;
    color: var(--text-secondary);
    margin-bottom: 16px;
}

/* Listes non ordonnées (UL) */
.article-body ul {
    margin-left: 20px;
}

/* Éléments de liste (LI) */
.article-body ul li {
    list-style-type: disc;
    margin-bottom: 8px;
}

/* Classes utilitaires de mise en avant/Avantages (Vert olive doux) */
.reit-advantage {
    background-color: var(--positive-icon-color); /* Couleur définie dans styledef.css [6] */
    color: white;
    font-weight: 600;
}

/* Classes utilitaires de mise en garde/Cautions (Rouge doux patrimonial) */
.scpi-caution {
    background-color: var(--negative-icon-color); /* Couleur définie dans styledef.css [6] */
    color: white;
    font-weight: 600;
}

/* Styles pour les images intégrées dans l'article */
.image-article {
    width: 100%;
    max-height: 450px;
    object-fit: cover;
    border-radius: var(--radius);
    margin: 20px 0;
}

--------------------------------------------------------------------------------
Étapes d'implémentation recommandées
1. Création du fichier : Enregistrez ce bloc de code dans un nouveau fichier nommé stylearticles.css.
2. Mise à jour du Header : Ajoutez un lien vers ce nouveau fichier dans votre fichier d'en-tête dynamique utilisé par les articles, header3.php. Vous le placeriez idéalement après l'appel au fichier CSS principal, styledef.css :
3. (Modification à effectuer dans header3.php)
4. Nettoyage des fichiers d'articles : Une fois que stylearticles.css est appelé par header3.php, vous devez supprimer tout le contenu du bloc $pageExtraStyle dans vos fichiers d'articles (par exemple, reits-vs-sp500.pdf et scpi-pour-expatries.pdf).
    ◦ Exception (Styles Uniques) : Notez que l'article scpi-pour-expatries.pdf contenait un style spécifique pour les tableaux (.comparison-table, th, td). Ce style n'est pas inclus dans le fichier commun ci-dessus. Si vous souhaitez que seul l'article SCPI utilise ce style de tableau, vous devrez le conserver dans la variable $pageExtraStyle de ce fichier uniquement, ou le déplacer dans un fichier séparé si d'autres pages l'utilisent.