/* Page Blog et catégories : 3 articles par ligne, photo au-dessus du texte, pagination.
   Couleurs du site : bleu-vert #29515c (texte), orange #fa6525 (boutons). */

/* Grille : 3 colonnes sur ordinateur, 2 sur tablette, 1 sur téléphone */
.u-blog-1 .u-repeater-1 {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	grid-auto-columns: auto !important;
	grid-auto-rows: auto !important;
	min-height: 0 !important;
	gap: 24px !important;
}

@media (max-width: 991px) {
	.u-blog-1 .u-repeater-1 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 575px) {
	.u-blog-1 .u-repeater-1 {
		grid-template-columns: 1fr !important;
	}
}

/* Carte : photo en haut, texte dessous, bouton aligné en bas */
.u-blog-1 .u-blog-post {
	border-radius: 12px;
	overflow: hidden;
}

.u-blog-1 .u-blog-post > .u-container-layout {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	height: 100%;
	padding: 0 0 24px !important;
}

.u-blog-1 .u-blog-post > .u-container-layout > * {
	margin: 0 22px !important;
	width: auto !important;
	max-width: calc(100% - 44px) !important;
}

.u-blog-1 .u-blog-post > .u-container-layout > .u-image {
	display: block;
	width: 100% !important;
	max-width: 100% !important;
	height: 200px !important;
	margin: 0 0 18px !important;
	background-size: cover !important;
	background-position: center !important;
}

.u-blog-1 .u-blog-post > .u-container-layout > .u-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.u-blog-1 .u-blog-post h4.u-blog-control {
	margin-bottom: 8px !important;
}

.u-blog-1 .u-blog-post .u-metadata {
	margin-bottom: 12px !important;
}

.u-blog-1 .u-blog-post .u-post-content {
	font-size: 1rem !important;
	line-height: 1.55 !important;
	margin-bottom: 18px !important;
}

.u-blog-1 .u-blog-post > .u-container-layout > .u-btn {
	margin-top: auto !important;
}

/* Pagination */
.teb-pagination ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
}

.teb-pagination-bas .teb-pagination ul {
	margin: 32px 0 8px;
}

.teb-pagination li {
	margin: 0;
}

.teb-pagination a,
.teb-pagination span {
	display: inline-block;
	min-width: 42px;
	padding: 9px 15px;
	border-radius: 22px;
	text-align: center;
	font-weight: 600;
	text-decoration: none !important;
	background: #fff;
	color: #29515c !important;
	border: 1px solid #d5e3e6;
	transition: background 0.2s, color 0.2s;
}

.teb-pagination a:hover {
	background: #fdf0e9;
	color: #fa6525 !important;
}

.teb-pagination span.current {
	background: #fa6525;
	border-color: #fa6525;
	color: #fff !important;
}

.teb-pagination span.dots {
	background: none;
	border: none;
}

.teb-pagination-bas {
	padding: 0 16px;
}

/* Boutons de catégories */
.teb-categories {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0 0 22px;
}

.teb-categories a {
	display: inline-block;
	padding: 8px 18px;
	border-radius: 22px;
	border: 1px solid #29515c;
	background: #fff;
	color: #29515c !important;
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none !important;
	transition: background 0.2s, color 0.2s;
}

.teb-categories a:hover {
	background: #eef5f6;
}

.teb-categories a.actif {
	background: #29515c;
	color: #fff !important;
}

@media (max-width: 575px) {
	.teb-categories {
		gap: 8px;
	}

	.teb-categories a {
		padding: 7px 14px;
		font-size: 0.88rem;
	}
}

/* Bandeau « Blog – Les nouvelles » : moins haut, rond orange plus petit.
   L'image (1 280 px) est cadrée sur le tronc et le champ plutôt que sur le feuillage. */
body.blog .u-section-1,
body.archive .u-section-1 {
	/* Même photo que celle du thème, en 1 920 px (Pixabay n° 6574455) au lieu de 1 280 : nette sur grand écran */
	background-image: url("/wp-content/uploads/2026/10/chene-champ-brume-lever-soleil.jpg") !important;
	background-position: 50% 72% !important;
}

body.blog .u-section-1 .u-sheet-1,
body.archive .u-section-1 .u-sheet-1 {
	min-height: 300px !important;
}

/* Grand écran : un peu plus haut, sinon on ne voit qu'une fine tranche de l'image */
@media (min-width: 1400px) {
	body.blog .u-section-1 .u-sheet-1,
	body.archive .u-section-1 .u-sheet-1 {
		min-height: 400px !important;
	}
}

body.blog .u-section-1 .u-group-1,
body.archive .u-section-1 .u-group-1 {
	width: 270px !important;
	height: 270px !important;
	min-height: 270px !important;
	margin-top: 15px !important;
	margin-bottom: 15px !important;
}

body.blog .u-section-1 .u-group-1 > .u-container-layout,
body.archive .u-section-1 .u-group-1 > .u-container-layout {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: center !important;
	padding: 20px !important;
}

body.blog .u-section-1 .u-group-1 .u-text-1,
body.archive .u-section-1 .u-group-1 .u-text-1 {
	font-size: 2.6rem !important;
	margin: 0 !important;
	width: auto !important;
}

body.blog .u-section-1 .u-group-1 .u-text-2,
body.archive .u-section-1 .u-group-1 .u-text-2 {
	font-size: 1.25rem !important;
	margin: 8px 0 0 !important;
	width: auto !important;	text-align: center !important;
	align-self: center !important;
}

/* Espace entre le bandeau et les boutons de catégories */
.teb-categories {
	margin-top: 40px !important;
}

@media (max-width: 767px) {
	body.blog .u-section-1 .u-sheet-1,
	body.archive .u-section-1 .u-sheet-1 {
		min-height: 230px !important;
	}

	body.blog .u-section-1 .u-group-1,
	body.archive .u-section-1 .u-group-1 {
		width: 200px !important;
		height: 200px !important;
		min-height: 200px !important;
	}

	body.blog .u-section-1 .u-group-1 .u-text-1,
	body.archive .u-section-1 .u-group-1 .u-text-1 {
		font-size: 2rem !important;
	}

	body.blog .u-section-1 .u-group-1 .u-text-2,
	body.archive .u-section-1 .u-group-1 .u-text-2 {
		font-size: 1.05rem !important;
	}

	.teb-categories {
		margin-top: 28px !important;
	}
}
