/* ============================================================================
   ULTRACYCLISME.CC – Page article (chargé sur is_singular('post'))
   Charte « Proposition 01 » §04 + §07. Ne modifie pas la structure des blocs
   AffiliateX : seulement typo, largeur de colonne et composants autour.
   ========================================================================== */

/* --- 1. Corps de texte : Work Sans (ContentBerg met un serif) ------------ */
.the-post .post-content,
.the-post .entry-content,
.post-content.entry-content,
.entry-content p,
.entry-content li {
	font-family: var(--uc-font-corps, "Work Sans", Arial, sans-serif) !important;
}
.entry-content {
	font-size: 18px;
	line-height: 1.667; /* 18/30 */
	color: var(--uc-texte, #55584A);
}
.entry-content p { margin: 0 0 1.4em; }

/* --- 2. Colonne de lecture : 680px (le texte seulement) ------------------
   Les figures, tableaux et blocs AffiliateX gardent la largeur de l'article. */
.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > h2,
.entry-content > h3,
.entry-content > h4,
.entry-content > blockquote,
.entry-content > .wp-block-heading,
.entry-content > .wp-block-list,
.entry-content > .wp-block-paragraph {
	max-width: 680px;
}

/* --- 3. Titres de section ---------------------------------------------------- */
.entry-content h2,
.entry-content .wp-block-heading {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-weight: 600;
	color: var(--uc-kaki-nuit, #21261C);
}
.entry-content > h2 {
	font-size: 32px;
	line-height: 1.06; /* ~34 */
	text-transform: uppercase;
	margin: 2em 0 0.6em;
}
.entry-content > h3 {
	font-size: 24px;
	line-height: 1.17; /* ~28 */
	margin: 1.6em 0 0.5em;
}
@media (max-width: 600px) {
	.entry-content > h2 { font-size: 26px; }
	.entry-content > h3 { font-size: 21px; }
}

/* --- 4. Chapô : 1er vrai paragraphe (après la ligne de méta) ------------- */
.entry-content > .uc-meta + p,
.entry-content > p:first-of-type {
	font-size: 19px;
	line-height: 1.6;
	color: var(--uc-kaki-nuit, #21261C);
}
@media (max-width: 600px) {
	.entry-content > .uc-meta + p,
	.entry-content > p:first-of-type { font-size: 18px; }
}

/* --- 5. Titre d'article/page (en-tête, pas la navigation prev/next) -----
   Taille fluide via clamp() : ~22px sur mobile 375, ~34px au-delà de ~800px.
   Pas de media-query concurrente à départager. */
.the-post .the-post-header .post-title,
.the-post > .post-header .post-title,
.the-page .the-page-title,
.the-page .post-title,
.page .page-title,
.single-title,
body h1.post-title {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-weight: 600 !important;
	color: var(--uc-kaki-nuit, #21261C) !important;
	font-size: clamp(21px, 1rem + 2.2vw, 34px) !important;
	line-height: 1.22 !important;
	letter-spacing: 0 !important;
	text-transform: none;
	text-wrap: pretty;
	overflow-wrap: break-word;
	hyphens: auto;
}
/* Capitales seulement à partir de la tablette (titres longs illisibles
   en capitales sur petit écran – assouplissement charte validé). */
@media (min-width: 601px) {
	.the-post .the-post-header .post-title,
	.the-page .the-page-title,
	.page .page-title,
	body h1.post-title {
		text-transform: uppercase;
		line-height: 1.14 !important;
	}
}

/* --- 5b. Navigation article précédent / suivant ------------------------- */
.post-nav { margin: 40px 0; }
.post-nav .post-meta .label {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-size: 11px !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: var(--uc-texte-2, #8C8B77) !important;
}
.post-nav .post-title,
.post-nav .post-title a {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	line-height: 1.3 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--uc-kaki-nuit, #21261C) !important;
}
.post-nav .post-title a:hover { color: var(--uc-vert-profond, #0F6E5C) !important; }
.post-nav .read-time,
.post-nav .meta-item { font-size: 11px !important; color: var(--uc-texte-2, #8C8B77) !important; text-transform: none !important; }

/* --- 6. Boutons de partage : masqués (choix éditorial) ------------------- */
.the-post .services,
.the-post .share-float,
.the-post .post-share,
.the-post .social-share,
.post-content.has-share-float::before { display: none !important; }
/* ContentBerg décale le contenu (margin-left ~30px en tablette) pour la barre
   de partage flottante – qu'on masque : on annule ce décalage à toutes tailles
   pour aligner le contenu sur le titre. */
.the-post .post-content.has-share-float,
.post-content.has-share-float,
.the-post .post-content.content-spacious {
	margin-left: 0 !important;
	padding-left: 0 !important;
}
.post-share-float,
.share-float-a,
.post-share-float.share-float-a { display: none !important; }

/* --- 7. Sommaire (généré par article.js) --------------------------------- */
.uc-toc {
	max-width: 680px;
	background: var(--uc-sable-moyen, #ececef);
	padding: 18px 22px;
	margin: 28px 0 32px;
}
.uc-toc > summary {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--uc-kaki-nuit, #21261C);
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	gap: 10px;
}
.uc-toc > summary::-webkit-details-marker { display: none; }
.uc-toc > summary::before {
	content: "";
	width: 12px;
	height: 12px;
	background: var(--uc-vert-profond, #0F6E5C);
	clip-path: polygon(0 100%, 100% 22%, 100% 100%);
	flex: none;
}
.uc-toc[open] > summary { margin-bottom: 12px; }
.uc-toc ol {
	margin: 0;
	padding: 0 0 0 1.2em;
	counter-reset: uc-toc;
	list-style: none;
}
.uc-toc li { margin: 6px 0; counter-increment: uc-toc; }
.uc-toc li::before {
	content: counter(uc-toc) ". ";
	color: var(--uc-texte-2, #8C8B77);
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
}
.uc-toc a {
	color: var(--uc-vert-profond, #0F6E5C);
	text-decoration: none;
	font-size: 15px;
	line-height: 1.4;
}
.uc-toc a:hover { color: var(--uc-vert-survol, #0A5346); text-decoration: underline; }

/* Ancres : compenser le header collant si présent */
.entry-content > h2[id],
.entry-content > h3[id] { scroll-margin-top: 90px; }

/* --- 8. Encadré « À retenir » (si inséré manuellement dans l'article) --- */
.entry-content .uc-summary {
	background: var(--uc-sable-moyen, #ececef);
	padding: 24px 28px;
	margin: 32px 0;
	max-width: 680px;
}
.entry-content .uc-summary__title {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--uc-kaki-nuit, #21261C);
	margin: 0 0 8px;
}

/* --- 8b. Ligne de méta sous le titre ------------------------------------- */
.entry-content > p.uc-meta {
	max-width: 680px;
	margin: 0 0 24px;
	padding: 0 0 16px;
	border-bottom: 1px solid var(--uc-filet, #dededf);
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-size: 12.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uc-texte-2, #8C8B77);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 20px;
	row-gap: 6px;
}
/* Bouton Google News « Source préférée » + suivi Instagram, cote a cote
   sous le bloc meta. */
.entry-content > div.uc-top-actions {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 10px;
	max-width: 680px;
	margin: 0 0 24px;
}
.uc-top-actions > .uc-preferred-src { margin: 0; flex: 0 0 auto; }
.uc-follow-insta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: 1px solid var(--uc-filet, #dededf);
	border-radius: 999px;
	background: #fff;
	font-family: var(--uc-font-corps, "Work Sans", Arial, sans-serif);
	font-size: 14px;
	font-weight: 500;
	color: var(--uc-kaki-nuit, #21261C);
	text-decoration: none;
	white-space: nowrap;
	flex: 0 0 auto;
	transition: border-color .15s ease, color .15s ease;
}
.uc-follow-insta:hover { border-color: var(--uc-vert-profond, #0F6E5C); color: var(--uc-vert-profond, #0F6E5C); }
.uc-follow-insta__ico { width: 18px; height: 18px; flex: 0 0 18px; }
.uc-follow-insta__ico svg { width: 100%; height: 100%; }

/* Le bouton Google a une largeur fixe imposee par son script (~220px) :
   sous 480px, l'Instagram passe en icone seule pour rester a cote. */
@media (max-width: 480px) {
	.uc-follow-insta {
		width: 42px;
		height: 42px;
		padding: 0;
		justify-content: center;
		gap: 0;
	}
	.uc-follow-insta__label { display: none; }
}

/* Pas de puce entre les éléments : sur 2 lignes (colonne de 680px) une puce
   se retrouvait orpheline en début de ligne. Espacement au gap uniquement. */
.uc-meta__author {
	color: var(--uc-kaki-nuit, #21261C);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.uc-meta__avatar {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
	display: block;
}
/* .uc-meta__sep : supprimé (voir ci-dessus) – conservé masqué au cas où un
   cache servirait encore l'ancien markup. */
.uc-meta__sep { display: none; }

/* --- 8c. Encadré auteur (E-E-A-T) – gabarit ContentBerg .author-box ----- */
.uc-author { max-width: 680px; margin: 44px 0 8px; }
.uc-author .author-box {
	display: flex !important;
	gap: 18px;
	align-items: flex-start;
	background: var(--uc-sable-moyen, #ececef);
	padding: 22px 24px;
	border: 0 !important;
	text-align: left !important;
	position: static !important;
}
.uc-author .author-box::before,
.uc-author .author-box::after { display: none !important; }
.the-post .uc-author .author-box .image,
.uc-author .author-box .image {
	position: static !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	flex: none;
	width: 72px !important;
	height: 72px !important;
	min-width: 0 !important;
	left: auto !important;
	top: auto !important;
	transform: none !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	overflow: hidden;
	line-height: 0;
}
.the-post .uc-author .author-box .image img,
.uc-author .author-box .image img {
	width: 72px !important;
	height: 72px !important;
	min-width: 0 !important;
	max-width: none !important;
	border-radius: 0 !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	display: block;
	object-fit: cover;
}
.uc-author .author-box .content {
	flex: 1;
	text-align: left !important;
	padding: 0 !important;
	margin: 0 !important;
}
.uc-author .author-box .author {
	display: block;
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-weight: 600 !important;
	font-size: 17px !important;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--uc-kaki-nuit, #21261C) !important;
	margin: 0 0 8px !important;
	text-align: left !important;
}
.uc-author .author-box .author > span {
	display: block;
	font-size: 11px;
	letter-spacing: 0.1em;
	font-weight: 500;
	color: var(--uc-texte-2, #8C8B77);
	margin-bottom: 2px;
}
.uc-author .author-box .author a { color: var(--uc-kaki-nuit, #21261C) !important; text-decoration: none; }
.uc-author .author-box .author-bio {
	font-family: var(--uc-font-corps, "Work Sans", Arial, sans-serif) !important;
	font-size: 15px !important;
	line-height: 1.55 !important;
	color: var(--uc-texte, #55584A) !important;
	margin: 0 0 10px !important;
	text-align: left !important;
}
.uc-author .author-box .social-icons {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	gap: 14px;
	justify-content: flex-start !important;
}
.uc-author .author-box .social-icons a {
	color: var(--uc-vert-profond, #0F6E5C) !important;
	font-size: 15px;
	background: none !important;
}
@media (max-width: 520px) {
	.uc-author .author-box { flex-direction: column; gap: 14px; }
}

/* --- 8c-bis. Encart Instagram, apres l'encadre auteur ------------------- */
.uc-insta-cta, .uc-insta-cta * { box-sizing: border-box; }
.uc-insta-cta {
	max-width: 680px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin: 18px 0 8px;
	padding: 18px 20px;
	border-radius: 12px;
	background: rgba(15, 110, 92, .08);
	border: 1px solid rgba(15, 110, 92, .25);
}
.uc-insta-cta__head {
	flex: 1 1 260px;
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}
.uc-insta-cta__ico { flex: none; color: var(--uc-vert-profond, #0F6E5C); }
.uc-insta-cta__ico svg { width: 30px; height: 30px; display: block; }
.uc-insta-cta__txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.uc-insta-cta__title {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-weight: 600;
	font-size: 15px;
	color: var(--uc-kaki-nuit, #21261C);
}
.uc-insta-cta__desc { font-size: 13px; line-height: 1.45; color: var(--uc-texte-2, #6B6A5C); }
.uc-insta-cta__btn {
	flex: none;
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif);
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 10px 16px;
	border-radius: 8px;
	background: var(--uc-vert-profond, #0F6E5C);
	color: #fff !important;
	text-decoration: none !important;
	white-space: nowrap;
}
.uc-insta-cta__btn:hover { background: var(--uc-vert-survol, #0A5346); }
@media (max-width: 560px) {
	.uc-insta-cta__btn { width: 100%; text-align: center; }
}

/* --- 8d. Articles liés -------------------------------------------------------- */
.related-posts { max-width: 680px; margin-top: 44px; border: 0; }
.related-posts .section-head {
	border: 0 !important;
	padding: 0 0 12px !important;
	margin: 0 0 22px !important;
	border-bottom: 1px solid var(--uc-filet, #dededf) !important;
	text-align: left !important;
	display: block !important;
}
.related-posts .section-head::before,
.related-posts .section-head::after { display: none !important; }
.related-posts .section-head,
.related-posts .section-head .title {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: var(--uc-kaki-nuit, #21261C) !important;
	background: none !important;
}
.related-posts .post .post-title,
.related-posts .post .post-title a {
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 1.25 !important;
	color: var(--uc-kaki-nuit, #21261C) !important;
	text-transform: none !important;
}
.related-posts .post .post-title a:hover { color: var(--uc-vert-profond, #0F6E5C) !important; }
.related-posts .post .post-cat,
.related-posts .post .post-cat a,
.related-posts .post .category {
	color: var(--uc-vert-profond, #0F6E5C) !important;
	background: none !important;
	padding: 0 !important;
	font-family: var(--uc-font-titre, "Oswald", Arial, sans-serif) !important;
	font-size: 11px !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
}
.related-posts .post .post-meta,
.related-posts .post .post-date { font-size: 12px !important; color: var(--uc-texte-2, #8C8B77) !important; }

/* --- 8e. Images dans le corps d'article : coins arrondis 15px ----------
   Exclut les visuels des blocs AffiliateX (on n'y touche pas). */
.entry-content figure.wp-block-image img,
.entry-content > img,
.entry-content p > img,
.entry-content .wp-block-image img,
.entry-content figure > img {
	border-radius: 15px;
}
.entry-content [class*="wp-block-affiliatex"] img,
.entry-content [class*="afx-"] img { border-radius: 0; }

/* --- 9. Tampon de fin d'article (ajouté via filtre the_content) --------- */
.uc-stamp {
	max-width: 680px;
	margin: 40px 0 8px;
	display: flex;
	align-items: center;
	gap: 14px;
}
.uc-stamp::before {
	content: "";
	width: 22px;
	height: 22px;
	flex: none;
	background: var(--uc-vert-profond, #0F6E5C);
	clip-path: polygon(0 100%, 100% 22%, 100% 100%);
}
.uc-stamp::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--uc-filet, #dededf);
}