/**
 * ruto_2026.css
 * Refonte progressive du thème RUTO en CSS natif / flexbox, sans dépendance Bootstrap.
 * Scopé à la page projet (`.single-projet-page`).
 */

/* Wrapper principal : remplace le .container Bootstrap */
.single-projet-page {
	width: 100%;
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
}

.single-projet-page .ruto_page_content.projet {
	width: 100%;
}

/* Bloc titre du projet */
.single-projet-page .projet-title {
	margin-top: 30px;
	margin-bottom: 20px;
}

/* Corps du projet : 1/3 + 2/3 en desktop, stack en mobile */
.single-projet-page .projet-body {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 30px;
	margin-bottom: 60px;
}

.single-projet-page .projet-details {
	flex: 0 0 100%;
}

.single-projet-page .projet-content {
	flex: 0 0 100%;
}

@media (min-width: 768px) {
	.single-projet-page .projet-body {
		flex-wrap: nowrap;
	}
	.single-projet-page .projet-details {
		flex: 0 0 calc(33.333% - 20px);
		max-width: calc(33.333% - 20px);
	}
	.single-projet-page .projet-content {
		flex: 0 0 calc(66.667% - 10px);
		max-width: calc(66.667% - 10px);
	}
}

/* Axonometrie parallax : full width, un bloc à part */
.single-projet-page .projet-axonometrie {
	margin-top: 100px;
	width: 100%;
}

/* Navigation prev / next : prev à gauche, next à droite, wrap en mobile */
.single-projet-page .projet-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 40px;
	margin-bottom: 40px;
}

.single-projet-page .projet-nav-item {
	flex: 1 1 100%;
	min-width: 0;
}

@media (min-width: 992px) {
	.single-projet-page .projet-nav {
		justify-content: space-between;
	}
	.single-projet-page .projet-nav-item {
		flex: 0 0 calc(33.333% - 20px);
		max-width: calc(33.333% - 20px);
	}
	.single-projet-page .projet-nav-next {
		margin-left: auto; /* pousse le suivant à droite quand le précédent existe */
	}
}