/* -------------------------------------------------------------------------
   WDG - lisibilite des titres d'articles, en liste et en page
   16/09/2026.

   Quatre defauts constates a l'ecran :
   1. le titre sortait en 12,5 px, en capitales, avec une interligne de 20 px ;
   2. le theme le remonte de 7 px (margin-top negatif) dans un en-tete qui
      coupe ce qui depasse : le haut des majuscules et les accents etaient
      rognes ;
   3. la ligne "By ... / In ..." n'apporte rien sur un site tenu par une
      seule personne ;
   4. le bouton "Lire la suite" avait la meme couleur de texte que son fond,
      donc un libelle invisible tant qu'on ne survolait pas.

   Note de specificite : le theme pose ses regles sur
   "article .entry-header .entry-title" et sa feuille est chargee apres la
   notre. A specificite egale, c'est lui qui gagne. On prefixe donc chaque
   selecteur par la classe de corps (.single, .blog, .archive, .search)
   plutot que de recourir a !important.
   ------------------------------------------------------------------------- */

/* 1. Le titre en page d'article. */
.single article .entry-header .entry-title,
.single article .entry-header .entry-title a {
	font-size: 30px;
	line-height: 1.35;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	margin-top: 0;
	margin-bottom: 0;
	height: auto;
	max-height: none;
	overflow: visible;
	text-overflow: clip;
	white-space: normal;
}

/* 2. Les titres dans la liste. */
.blog article .entry-header .entry-title,
.archive article .entry-header .entry-title,
.search article .entry-header .entry-title {
	margin-top: 0;
	margin-bottom: 10px;
	max-height: none;
	overflow: visible;
}

.blog article .entry-header .entry-title,
.blog article .entry-header .entry-title a,
.archive article .entry-header .entry-title,
.archive article .entry-header .entry-title a,
.search article .entry-header .entry-title,
.search article .entry-header .entry-title a {
	font-size: 22px;
	line-height: 1.4;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	display: block;
	height: auto;
	max-height: none;
	overflow: visible;
	text-overflow: clip;
	white-space: normal;
}

@media (max-width: 767px) {
	.single article .entry-header .entry-title,
	.single article .entry-header .entry-title a {
		font-size: 23px;
	}

	.blog article .entry-header .entry-title,
	.blog article .entry-header .entry-title a,
	.archive article .entry-header .entry-title,
	.archive article .entry-header .entry-title a,
	.search article .entry-header .entry-title,
	.search article .entry-header .entry-title a {
		font-size: 19px;
	}
}

/* On ne touche pas a l'overflow de l'en-tete : il y cree un contexte de
   formatage qui empeche sa marge basse de fusionner avec le chapeau.
   Le rendre visible recollait l'extrait au titre. Annuler la remontee de
   7 px suffit a ne plus rien couper. */

/* 2bis. Les intertitres dans le corps d'un article.
   Le theme leur donne une interligne de 2,7 em (89 px pour un corps de 33 px) :
   les deux lignes d'un meme intertitre etaient separees par un vide enorme.
   On ramene l'interligne a 1,3 et on redonne l'espace en marge haute, ou il
   sert a separer les sections au lieu de disloquer le titre. */
.single .entry-content h2 {
	font-size: 25px;
	line-height: 1.3;
	margin-top: 42px;
	margin-bottom: 14px;
}

.single .entry-content h3 {
	font-size: 20px;
	line-height: 1.35;
	margin-top: 32px;
	margin-bottom: 12px;
}

.single .entry-content h4 {
	font-size: 18px;
	line-height: 1.4;
	margin-top: 26px;
	margin-bottom: 10px;
}

@media (max-width: 767px) {
	.single .entry-content h2 {
		font-size: 21px;
	}

	.single .entry-content h3 {
		font-size: 18px;
	}
}

/* 2ter. Le bloc « derniers articles » de la page d'accueil.
   Widget de posts du theme : les titres y sortent aussi en 12,5 px, dans des
   .item-post et non des article.post. La classe de corps est .home, pas .blog,
   et is_home() y est faux : la feuille est donc chargee sur is_front_page(). */
.home .item-post .entry-title,
.home .item-post .entry-title a {
	font-size: 18px;
	line-height: 1.4;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	display: block;
	height: auto;
	max-height: none;
	overflow: visible;
	text-overflow: clip;
	white-space: normal;
	margin-top: 0;
	margin-bottom: 8px;
}

/* 2quater. La pastille de date du theme, sur la page d'un article.
   Le theme pose un bloc carre « 16 / SEP » dans l'en-tete. Il n'est pas dans
   le contenu : Elementor ne peut pas le retirer. On le masque ici, et
   wdg-liste-articles.php ecrit une ligne datee sous le titre a la place.
   La pastille reste en liste, ou elle sert de repere visuel. */
.single .entry-header .date-meta {
	display: none;
}

/* La pastille flottait a gauche et le bloc du titre flottait a droite sur
   735 px dans un conteneur de 835 : masquer la pastille laissait le titre
   decale de 100 px vers la droite, desaligne du texte. On rend le bloc du
   titre a la pleine largeur, puis on l'aligne sur la colonne de lecture. */
.single .entry-header.has_date .entry-contain,
.single .entry-header .entry-contain {
	float: none;
	width: 100%;
}

.single .entry-header.has_date .entry-title,
.single .entry-header .entry-title {
	max-width: 700px;
}

/* Selecteur prefixe par .single : sinon la regle de couleur du corps de texte,
   plus specifique, reprenait le dessus et la ligne perdait sa discretion. */
.single .entry-content p.wdg-date-article,
.wdg-date-article {
	margin: 0 0 22px;
	font-size: 14px;
	line-height: 1.4;
	font-weight: 400;
	color: #8a8f94;
}

/* -------------------------------------------------------------------------
   2quinquies. Le confort de lecture d'un article.
   Mesures relevees le 16/09/2026 sur un article de 1 200 mots :
   colonne de 835 px, soit 86 caracteres par ligne (le confort est entre 60 et
   75) ; liens en rgb(0,0,238), le bleu brut du navigateur, sans soulignement ;
   corps en Montserrat graisse 300, une police de titre employee en fine.
   ------------------------------------------------------------------------- */

/* Le conteneur d'article reserve 3 colonnes sur 12 a une barre laterale qui
   n'existe pas : 900 px utilises sur 1200, et rien a droite. On reprend la
   pleine largeur, puis on centre la colonne de lecture. */
.single main.site-main {
	width: 100%;
	float: none;
}

.single .entry-header,
.single .entry-content {
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}

/* La colonne de texte. 700 px donnent environ 72 caracteres par ligne. */
.single .entry-content > p,
.single .entry-content > h2,
.single .entry-content > h3,
.single .entry-content > h4,
.single .entry-content > ul,
.single .entry-content > ol,
.single .entry-content > blockquote,
.single .entry-content > figure {
	max-width: 700px;
}

/* Meme limite pour un article passe en mode Elementor : les paragraphes y sont
   dans des widgets, donc hors de portee du selecteur ci-dessus. C'est le cout
   du basculement : le gabarit ne s'applique plus tout seul, il se rattrape
   structure par structure. */
.single .elementor-widget-text-editor > .elementor-widget-container,
.single .elementor-widget-theme-post-content > .elementor-widget-container {
	max-width: 700px;
}

/* Le corps : une graisse de texte, pas une graisse de titre. */
.single .entry-content p,
.single .entry-content li {
	font-weight: 400;
	line-height: 1.7;
	color: #333333;
}

/* Les liens dans le texte : la couleur de la marque, et soulignes.
   Un lien qui ne se distingue que par sa couleur n'est pas accessible. */
.single .entry-content p a,
.single .entry-content li a {
	color: #2b7fae;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.single .entry-content p a:hover,
.single .entry-content li a:hover {
	color: #1c5c80;
	text-decoration-thickness: 2px;
}

/* Les listes : le theme n'en prevoit aucune, les prochaines pages en auront. */
.single .entry-content ul,
.single .entry-content ol {
	margin: 0 0 24px;
	padding-left: 22px;
}

.single .entry-content li {
	margin-bottom: 10px;
	padding-left: 4px;
}

.single .entry-content ul > li::marker {
	color: #4298cc;
}

/* Les mises en exergue. */
.single .entry-content blockquote {
	margin: 30px 0;
	padding: 4px 0 4px 22px;
	border-left: 3px solid #4298cc;
	font-style: normal;
}

.single .entry-content blockquote p:last-child {
	margin-bottom: 0;
}

/* Un peu plus de contraste sur les passages en gras. */
.single .entry-content strong {
	font-weight: 600;
	color: #1a1a1a;
}

/* 3. Ligne auteur et categorie : retiree partout.
      Un seul auteur, une seule categorie : l'information ne dit rien. */
.blog .entry-meta,
.archive .entry-meta,
.search .entry-meta,
.single .entry-meta,
.home .item-post .entry-meta {
	display: none;
}

/* 4. Bouton : le libelle doit se lire sans survol. */
.blog a.thim-button,
.archive a.thim-button,
.search a.thim-button {
	color: #ffffff;
	font-size: 14px;
	padding: 8px 22px;
}

.blog a.thim-button:hover,
.archive a.thim-button:hover,
.search a.thim-button:hover {
	color: #ffffff;
	opacity: .9;
}

/* 5. Titre de la page de liste, ecrit par wdg-liste-articles.php. */
.wdg-liste-titre {
	margin: 0 0 40px;
}

.wdg-liste-titre h1 {
	font-size: 34px;
	line-height: 1.3;
	font-weight: 700;
	margin: 0;
}

@media (max-width: 767px) {
	.wdg-liste-titre h1 {
		font-size: 26px;
	}
}

/* 6. Bloc « Avant de venir » sur la page d'une session
      (pose par wdg-ressources-session.php). */
.wdg-ressources-session {
	margin: 48px 0 8px;
	padding: 28px 30px;
	background: #f5f7f9;
	border-left: 4px solid #4298cc;
}

.wdg-ressources-session h2 {
	font-size: 22px;
	line-height: 1.3;
	margin: 0 0 8px;
	text-transform: none;
}

.wdg-ressources-session__chapeau {
	margin: 0 0 18px;
	font-size: 16px;
	line-height: 1.55;
}

.wdg-ressources-session__liste {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.wdg-ressources-session__liste li {
	margin: 0 0 10px;
	padding: 0 0 0 18px;
	position: relative;
	font-size: 17px;
	line-height: 1.45;
}

.wdg-ressources-session__liste li::before {
	content: "\203A";
	position: absolute;
	left: 0;
	top: -1px;
	color: #4298cc;
	font-size: 20px;
}

.wdg-ressources-session__liste a {
	font-weight: 600;
}

.wdg-ressources-session__suite {
	margin: 0;
	font-size: 15px;
}

@media (max-width: 767px) {
	.wdg-ressources-session {
		padding: 22px 18px;
	}

	.wdg-ressources-session h2 {
		font-size: 19px;
	}
}

/* Un peu d'air entre deux articles de la liste. */
.blog article.post,
.archive article.post {
	margin-bottom: 34px;
}
