/* ==========================================================================
   Vauban Expertise : charte du site
   Une seule source pour les couleurs, les polices et les espacements.
   Tout écart avec les maquettes se corrige ici, jamais à la main sur une page.
   ========================================================================== */

/* 1. Jetons
   -------------------------------------------------------------------------- */
:root {
	--vb-bordeaux: #5A1E2E;
	--vb-rouille: #A9452A;
	--vb-filet-rouille: #C65A3C;
	--vb-prune: #6E4A55;
	--vb-ivoire: #F6F1EA;
	--vb-pierre: #FBF8F4;
	--vb-lin: #DCC9BD;
	--vb-nuit: #21141A;
	--vb-nuit-filet: #4A2F38;
	--vb-rose-fane: #BFA6AE;
	--vb-rose-clair: #E9DDE1;
	--vb-blanc: #FFFFFF;

	--vb-serif: 'Cormorant Garamond', Garamond, 'Times New Roman', serif;
	--vb-sans: 'Source Sans 3', 'Source Sans Pro', 'Segoe UI', system-ui, sans-serif;

	--vb-large: 1280px;
	--vb-texte: 760px;
	--vb-goutiere: clamp(16px, 4vw, 32px);
	--vb-section: clamp(64px, 9vw, 112px);

	/* Simulateurs : mêmes couleurs que le site. */
	--vxt-bg: var(--vb-ivoire);
	--vxt-surface: var(--vb-pierre);
	--vxt-ink: var(--vb-bordeaux);
	--vxt-muted: var(--vb-prune);
	--vxt-line: var(--vb-lin);
	--vxt-action: var(--vb-rouille);
	--vxt-btn: var(--vb-bordeaux);
	--vxt-on-btn: var(--vb-blanc);
	--vxt-panel: var(--vb-nuit);
	--vxt-panel-ink: var(--vb-ivoire);
	--vxt-panel-muted: var(--vb-rose-fane);
	--vxt-panel-line: var(--vb-nuit-filet);
}

/* 2. Base (neutralise les réglages par défaut de GeneratePress)
   -------------------------------------------------------------------------- */
body.vauban {
	margin: 0;
	background: var(--vb-ivoire);
	color: var(--vb-bordeaux);
	font-family: var(--vb-sans);
	font-size: 17px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.vauban *,
.vauban *::before,
.vauban *::after {
	box-sizing: border-box;
}

/* Les simulateurs (.vx) gèrent leurs propres couleurs de liens et de boutons. */
.vauban a:where(:not(.vx a)) {
	color: var(--vb-bordeaux);
	text-underline-offset: 4px;
	text-decoration-thickness: 1px;
}

.vauban a:where(:not(.vx a)):hover {
	color: var(--vb-rouille);
}

.vauban a:focus-visible,
.vauban button:focus-visible,
.vauban input:focus-visible,
.vauban select:focus-visible,
.vauban textarea:focus-visible,
.vauban summary:focus-visible,
.vauban [tabindex]:focus-visible {
	outline: 2px solid var(--vb-rouille);
	outline-offset: 3px;
}

.vauban main:focus {
	outline: none;
}

.vauban h1,
.vauban h2,
.vauban h3,
.vauban h4 {
	font-family: var(--vb-serif);
	color: inherit;
	margin: 0;
	text-wrap: balance;
}

.vauban h1 {
	font-size: clamp(40px, 5.4vw, 64px);
	line-height: 1.07;
	font-weight: 500;
	letter-spacing: -0.015em;
}

.vauban h2 {
	font-size: clamp(32px, 4.2vw, 48px);
	line-height: 1.13;
	font-weight: 500;
}

.vauban h3 {
	font-size: clamp(24px, 2.6vw, 30px);
	line-height: 1.2;
	font-weight: 600;
}

.vauban h4 {
	font-size: 22px;
	line-height: 1.3;
	font-weight: 600;
}

.vauban p {
	margin: 0;
}

.vauban strong,
.vauban b {
	font-weight: 600;
}

.vauban img {
	max-width: 100%;
	height: auto;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* 3. Cadre et lien d'évitement
   -------------------------------------------------------------------------- */
.vb-cadre {
	width: 100%;
	max-width: var(--vb-large);
	margin-inline: auto;
	padding-inline: var(--vb-goutiere);
}

.vb-evitement {
	position: absolute;
	left: 16px;
	top: -100px;
	z-index: 1000;
	padding: 12px 20px;
	background: var(--vb-bordeaux);
	color: var(--vb-blanc) !important;
	font-weight: 600;
	text-decoration: none;
}

.vb-evitement:focus {
	top: 16px;
}

/* 4. Barre haute
   -------------------------------------------------------------------------- */
.vb-barre {
	background: var(--vb-bordeaux);
	color: var(--vb-rose-clair);
	font-size: 13px;
	line-height: 20px;
}

.vb-barre__cadre {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 4px 24px;
	padding-block: 8px;
}

.vb-barre__menu {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.vauban .vb-barre a {
	color: var(--vb-ivoire);
	text-decoration: none;
}

.vauban .vb-barre li:first-child a {
	font-weight: 600;
}

.vauban .vb-barre a:hover {
	text-decoration: underline;
	color: var(--vb-blanc);
}

/* 5. En-tête
   -------------------------------------------------------------------------- */
.vb-entete {
	border-bottom: 1px solid var(--vb-lin);
	background: var(--vb-ivoire);
}

.vb-entete__cadre {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 48px;
	padding-block: 20px;
}

.vb-logo {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	text-decoration: none !important;
	color: var(--vb-bordeaux) !important;
}

.vb-logo__image {
	width: 40px;
	height: 46px;
	object-fit: contain;
}

.vb-logo__texte {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.vb-logo__nom {
	font-family: var(--vb-serif);
	font-size: 25px;
	font-weight: 600;
	letter-spacing: 0.14em;
}

.vb-logo__suffixe {
	margin-top: 5px;
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.5em;
	color: var(--vb-prune);
}

.vb-navigation {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px 48px;
}

.vb-navigation__menu {
	flex: 1 1 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 36px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.vauban .vb-navigation__menu a {
	text-decoration: none;
	display: inline-block;
	padding-block: 6px;
}

.vauban .vb-navigation__menu a[aria-current="page"],
.vauban .vb-navigation__menu a:hover {
	text-decoration: underline;
	text-underline-offset: 8px;
}

.vb-menu-bouton {
	display: none;
}

@media (max-width: 1080px) {
	.vb-entete__cadre {
		justify-content: space-between;
	}

	.vb-menu-bouton {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		min-height: 44px;
		padding: 0 4px;
		background: none;
		border: 0;
		color: var(--vb-bordeaux);
		font: 600 14px/1 var(--vb-sans);
		letter-spacing: 0.08em;
		text-transform: uppercase;
		cursor: pointer;
	}

	.vb-menu-bouton__traits,
	.vb-menu-bouton__traits::before,
	.vb-menu-bouton__traits::after {
		display: block;
		width: 22px;
		height: 2px;
		background: currentColor;
		transition: transform 0.2s ease;
	}

	.vb-menu-bouton__traits {
		position: relative;
	}

	.vb-menu-bouton__traits::before,
	.vb-menu-bouton__traits::after {
		content: "";
		position: absolute;
		left: 0;
	}

	.vb-menu-bouton__traits::before { top: -7px; }
	.vb-menu-bouton__traits::after { top: 7px; }

	.vb-menu-bouton[aria-expanded="true"] .vb-menu-bouton__traits { background: transparent; }
	.vb-menu-bouton[aria-expanded="true"] .vb-menu-bouton__traits::before { transform: translateY(7px) rotate(45deg); }
	.vb-menu-bouton[aria-expanded="true"] .vb-menu-bouton__traits::after { transform: translateY(-7px) rotate(-45deg); }

	.vb-navigation {
		flex: 1 1 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
		padding-block: 8px 12px;
	}

	.js .vb-navigation:not(.est-ouverte) {
		display: none;
	}

	.vb-navigation__menu {
		flex-direction: column;
		gap: 0;
		font-size: 17px;
	}

	.vb-navigation__menu li {
		border-top: 1px solid var(--vb-lin);
	}

	.vauban .vb-navigation__menu a {
		display: block;
		padding-block: 14px;
	}

	.vb-entete__bouton {
		align-self: flex-start;
	}
}

/* 6. Boutons et liens forts
   -------------------------------------------------------------------------- */
.vauban .vb-bouton,
.vauban .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 0 30px;
	border: 0;
	border-radius: 2px;
	background: var(--vb-bordeaux);
	color: var(--vb-blanc);
	font-family: var(--vb-sans);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.04em;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.vauban .vb-bouton:hover,
.vauban .wp-block-button__link:hover {
	background: var(--vb-rouille);
	color: var(--vb-blanc);
}

.vauban .vb-bouton--compact {
	min-height: 46px;
	padding: 0 24px;
	font-size: 14px;
}

/* Bouton clair, pour les fonds sombres. */
.vauban .is-style-vauban-clair .wp-block-button__link {
	background: var(--vb-ivoire);
	color: var(--vb-bordeaux);
	min-height: 56px;
	padding: 0 32px;
}

.vauban .is-style-vauban-clair .wp-block-button__link:hover {
	background: var(--vb-blanc);
	color: var(--vb-rouille);
}

/* Bouton présenté comme un lien souligné. */
.vauban .is-style-vauban-lien .wp-block-button__link,
.vauban .vb-lien-fort {
	min-height: 44px;
	padding: 0;
	background: none;
	color: inherit;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	text-decoration: underline;
	text-underline-offset: 6px;
}

.vauban .is-style-vauban-lien .wp-block-button__link:hover {
	background: none;
	color: var(--vb-rouille);
}

.vauban .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 32px;
}

.vb-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 32px;
	margin-top: 8px !important;
}

/* 7. Typographie de contenu
   -------------------------------------------------------------------------- */
.vb-label,
.vauban .is-style-vauban-label {
	display: block;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--vb-rouille);
}

.vb-filet,
.vauban hr.vb-filet,
.vauban .wp-block-separator.is-style-vauban-filet {
	width: 56px;
	height: 2px;
	margin: 0;
	border: 0;
	background: var(--vb-filet-rouille);
	opacity: 1;
}

.vb-chapo,
.vauban .is-style-vauban-chapo {
	font-size: 19px;
	line-height: 31px;
	max-width: 640px;
}

.vauban .has-prune-color,
.vb-discret {
	color: var(--vb-prune);
}

.vb-maj {
	font-size: 14px;
	line-height: 22px;
	color: var(--vb-prune);
}

.vb-alerte {
	padding: 16px 20px;
	border-left: 2px solid var(--vb-rouille);
	background: var(--vb-pierre);
}

/* 8. Pages : titre, fil d'Ariane, flux du contenu
   -------------------------------------------------------------------------- */
.vb-main {
	display: block;
}

.vb-main__ariane {
	padding-top: 40px;
}

.vb-ariane {
	font-size: 13px;
	line-height: 20px;
	color: var(--vb-prune);
}

.vauban .vb-ariane a {
	color: var(--vb-prune);
	text-decoration: none;
}

.vauban .vb-ariane a:hover {
	text-decoration: underline;
}

.vb-ariane__sep {
	color: var(--vb-lin);
	margin-inline: 4px;
}

.vb-ariane [aria-current] {
	color: var(--vb-bordeaux);
}

.vb-page-titre {
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding-top: 72px;
	padding-bottom: 56px;
}

/* Le contenu : texte centré sur 760 px, blocs larges sur 1216 px, blocs pleine largeur sur tout l'écran. */
.vauban .vb-contenu {
	padding-bottom: var(--vb-section);
}

.vauban .vb-contenu:has(> .alignfull:last-child) {
	padding-bottom: 0;
}

.vauban .vb-contenu > * {
	width: calc(100% - 2 * var(--vb-goutiere));
	max-width: var(--vb-texte);
	margin-inline: auto;
}

.vauban .vb-contenu > .alignwide {
	max-width: calc(var(--vb-large) - 64px);
}

.vauban .vb-contenu > .alignfull {
	width: 100%;
	max-width: none;
}

.vauban .vb-contenu > * + * {
	margin-top: 24px;
}

.vauban .vb-contenu > .alignfull + .alignfull {
	margin-top: 0;
}

.vauban .vb-contenu > h2,
.vauban .vb-contenu > h3 {
	margin-top: 56px;
}

.vauban .vb-contenu > h2 + *,
.vauban .vb-contenu > h3 + * {
	margin-top: 16px;
}

.vauban .vb-contenu ul:not([class*="is-style-"]):not(.vb-filets),
.vauban .vb-contenu ol:not([class*="is-style-"]):not(.vb-filets) {
	margin-block: 0;
	padding-left: 1.4em;
}

.vauban .vb-contenu li + li {
	margin-top: 6px;
}

.vauban .wp-block-image figcaption,
.vauban figcaption {
	font-size: 14px;
	line-height: 22px;
	color: var(--vb-prune);
}

/* 9. Sections (compositions)
   -------------------------------------------------------------------------- */
.vauban .vb-section {
	padding-block: var(--vb-section);
}

.vauban .vb-section--pierre {
	background: var(--vb-pierre);
	border-top: 1px solid var(--vb-lin);
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .vb-section--pierre + .vb-section {
	border-top: 0;
}

.vb-section > .vb-cadre,
.vb-section .vb-cadre {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* En-tête de page en texte seul. */
.vauban .vb-en-tete {
	padding-block: 40px 96px;
}

.vauban .vb-en-tete .vb-cadre {
	gap: 28px;
}

.vauban .vb-en-tete .vb-label,
.vauban .vb-en-tete .is-style-vauban-label {
	margin-top: 40px;
}

.vauban .vb-contenu > .vb-en-tete:first-child {
	padding-top: 0;
}

.vauban .vb-contenu > .vb-en-tete:first-child .is-style-vauban-label:first-child {
	margin-top: 64px;
}

/* Deux colonnes : intitulé à gauche, contenu à droite. */
.vauban .vb-deux-colonnes.wp-block-columns {
	display: flex;
	flex-wrap: wrap !important;
	gap: 48px 96px;
	margin: 0;
}

.vauban .vb-deux-colonnes > .wp-block-column {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
}

.vauban .vb-deux-colonnes > .wp-block-column:first-child {
	flex: 1 1 320px !important;
}

.vauban .vb-deux-colonnes > .wp-block-column:last-child {
	flex: 2 1 560px !important;
	gap: 24px;
}

/* En-tête ou bande avec image (bloc Média et texte). */
.vauban .wp-block-media-text.vb-media {
	grid-template-columns: 1fr 1fr;
	min-height: 600px;
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .wp-block-media-text.vb-media .wp-block-media-text__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 28px;
	padding: 72px clamp(24px, 5vw, 64px);
	max-width: 680px;
}

.vauban .wp-block-media-text.vb-media.has-media-on-the-right .wp-block-media-text__content {
	justify-self: end;
}

.vauban .wp-block-media-text.vb-media > .wp-block-media-text__media {
	position: relative;
	align-self: stretch;
	margin: 0;
	min-height: 420px;
}

.vauban .wp-block-media-text.vb-media > .wp-block-media-text__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.vauban .wp-block-media-text.vb-bande {
	background: var(--vb-bordeaux);
	color: var(--vb-ivoire);
	min-height: 420px;
	border: 0;
}

.vauban .vb-bande a {
	color: var(--vb-ivoire);
	font-weight: 600;
	text-underline-offset: 6px;
}

.vauban .vb-bande .vb-label,
.vauban .vb-bande .is-style-vauban-label,
.vauban .vb-cadrage .is-style-vauban-label {
	color: var(--vb-rose-fane);
}

@media (max-width: 781px) {
	.vauban .wp-block-media-text.vb-media {
		grid-template-columns: 100% !important;
		min-height: 0;
	}

	.vauban .wp-block-media-text.vb-media .wp-block-media-text__media {
		grid-row: 1;
		min-height: 320px;
	}

	.vauban .wp-block-media-text.vb-media .wp-block-media-text__content {
		grid-row: 2;
		padding: 48px var(--vb-goutiere) 64px;
		max-width: none;
	}
}

/* Bandeau sombre « Parlez-nous de la décision à prendre ». */
.vauban .vb-cadrage {
	background: var(--vb-nuit);
	color: var(--vb-ivoire);
	padding-block: clamp(72px, 9vw, 104px);
}

.vauban .vb-cadrage .wp-block-columns {
	display: flex;
	flex-wrap: wrap !important;
	align-items: flex-end;
	gap: 40px 96px;
	margin: 0;
}

.vauban .vb-cadrage .wp-block-column:first-child {
	flex: 999 1 560px !important;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.vauban .vb-cadrage .wp-block-column:last-child {
	flex: 1 1 280px !important;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.vauban .vb-cadrage h2 {
	font-size: clamp(34px, 4.4vw, 52px);
	line-height: 1.12;
}

.vauban .vb-cadrage p {
	color: var(--vb-rose-fane);
	max-width: 560px;
}

.vauban .vb-cadrage a:not(.wp-block-button__link) {
	color: var(--vb-ivoire);
	font-weight: 600;
}

.vauban .vb-cadrage .wp-block-button,
.vauban .vb-cadrage .wp-block-button__link {
	width: 100%;
}

/* 10. Listes à filets, listes à tirets, chiffres clés
   -------------------------------------------------------------------------- */
.vauban .is-style-vauban-filets,
.vauban .vb-filets {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--vb-lin);
	counter-reset: vb-filet;
}

.vauban .is-style-vauban-filets > li,
.vauban .vb-filets > li {
	display: grid;
	grid-template-columns: minmax(180px, 1fr) 2fr;
	align-items: baseline;
	gap: 8px 24px;
	margin: 0;
	padding: 24px 0;
	border-top: 1px solid var(--vb-lin);
	color: var(--vb-prune);
	font-size: 16px;
	line-height: 26px;
}

.vauban .is-style-vauban-filets > li:first-child,
.vauban .vb-filets > li:first-child {
	border-top-color: var(--vb-bordeaux);
}

.vauban .is-style-vauban-filets > li > strong:first-child,
.vauban .vb-filets__titre {
	font-family: var(--vb-serif);
	font-size: 24px;
	line-height: 30px;
	font-weight: 600;
	color: var(--vb-bordeaux);
}

.vauban ol.is-style-vauban-filets > li {
	grid-template-columns: 40px minmax(160px, 1fr) 2fr;
	counter-increment: vb-filet;
}

.vauban ol.is-style-vauban-filets > li::before {
	content: counter(vb-filet, decimal-leading-zero);
	font-family: var(--vb-serif);
	font-size: 22px;
	line-height: 30px;
	color: var(--vb-rouille);
	font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
	.vauban .is-style-vauban-filets > li,
	.vauban .vb-filets > li,
	.vauban ol.is-style-vauban-filets > li {
		display: block;
	}

	.vauban .is-style-vauban-filets > li > strong:first-child,
	.vauban .vb-filets__titre,
	.vauban ol.is-style-vauban-filets > li::before {
		display: block;
		margin-bottom: 6px;
	}

	.vauban ol.is-style-vauban-filets > li::before {
		margin-bottom: 2px;
	}
}

.vauban .is-style-vauban-tirets {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .is-style-vauban-tirets > li {
	position: relative;
	margin: 0;
	padding: 14px 0 14px 28px;
	border-top: 1px solid var(--vb-lin);
	font-size: 16px;
	line-height: 26px;
}

.vauban .is-style-vauban-tirets > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 26px;
	width: 12px;
	height: 1px;
	background: var(--vb-rouille);
}

/* Lignes cliquables (guides, simulateurs, expertises). */
.vb-liste-guides {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .vb-ligne {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 32px;
	padding: 26px 0;
	border-top: 1px solid var(--vb-lin);
	text-decoration: none;
	color: var(--vb-bordeaux);
}

.vb-liste-guides > li:first-child .vb-ligne {
	border-top-color: var(--vb-bordeaux);
}

.vb-ligne__titre {
	flex: 1 1 280px;
	font-family: var(--vb-serif);
	font-size: 30px;
	line-height: 36px;
	font-weight: 600;
}

.vb-ligne__texte {
	flex: 2 1 340px;
	font-size: 16px;
	line-height: 26px;
	color: var(--vb-prune);
}

.vb-ligne__date {
	flex: 1 1 100%;
	font-size: 13px;
	color: var(--vb-prune);
}

.vauban .vb-ligne:hover .vb-ligne__titre {
	color: var(--vb-rouille);
}

/* 11. Tableaux
   -------------------------------------------------------------------------- */
.vauban .wp-block-table.is-style-vauban {
	margin: 0;
	overflow-x: auto;
}

.vauban .is-style-vauban table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	border-bottom: 1px solid var(--vb-bordeaux);
	font-size: 16px;
	line-height: 24px;
}

.vauban .is-style-vauban th,
.vauban .is-style-vauban td {
	border: 0;
	border-top: 1px solid var(--vb-lin);
	padding: 16px 24px 16px 0;
	text-align: left;
	vertical-align: top;
	background: none;
}

.vauban .is-style-vauban th:last-child,
.vauban .is-style-vauban td:last-child {
	padding-right: 0;
}

.vauban .is-style-vauban thead th {
	border-top: 0;
	border-bottom: 1px solid var(--vb-bordeaux);
	padding-top: 0;
	padding-bottom: 14px;
	vertical-align: bottom;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--vb-prune);
}

.vauban .is-style-vauban tbody td:first-child {
	font-weight: 400;
}

@media (max-width: 640px) {
	.vauban .is-style-vauban table {
		min-width: 560px;
		font-size: 15px;
	}

	.vauban .wp-block-table.is-style-vauban {
		-webkit-overflow-scrolling: touch;
	}
}

.vauban .is-style-vauban .has-text-align-right {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.vauban .is-style-vauban figcaption,
.vauban .wp-element-caption {
	margin-top: 14px;
	font-size: 14px;
	line-height: 22px;
	color: var(--vb-prune);
	text-align: left;
}

/* 12. Rubriques des pages légales
   -------------------------------------------------------------------------- */
.vauban .vb-rubriques {
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .vb-rubrique.wp-block-columns {
	display: flex;
	flex-wrap: wrap !important;
	gap: 12px 64px;
	margin: 0;
	padding: 32px 0;
	border-top: 1px solid var(--vb-lin);
}

.vauban .vb-rubriques > .vb-rubrique:first-child {
	border-top-color: var(--vb-bordeaux);
}

.vauban .vb-rubrique > .wp-block-column:first-child {
	flex: 1 1 240px !important;
}

.vauban .vb-rubrique > .wp-block-column:last-child {
	flex: 3 1 560px !important;
	display: flex;
	flex-direction: column;
	gap: 14px;
	font-size: 16px;
	line-height: 27px;
}

.vauban .vb-rubrique h2 {
	font-size: 26px;
	line-height: 32px;
	font-weight: 600;
}

/* 13. Articles (guides)
   -------------------------------------------------------------------------- */
.vb-article__entete {
	width: calc(100% - 2 * var(--vb-goutiere));
	max-width: var(--vb-texte);
	margin: 0 auto;
	padding-block: 72px 48px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.vauban .vb-article__corps > p,
.vauban .vb-article__corps > ul,
.vauban .vb-article__corps > ol {
	font-size: 18px;
	line-height: 31px;
}

.vauban .vb-article__corps > h2 {
	font-size: clamp(28px, 3.4vw, 38px);
}

/* 14. Simulateurs
   -------------------------------------------------------------------------- */
.vb-simulateur {
	margin-block: 24px;
}

/* 15. Pied de page
   -------------------------------------------------------------------------- */
.vb-pied {
	background: var(--vb-nuit);
	color: var(--vb-rose-fane);
	border-top: 1px solid var(--vb-nuit-filet);
	font-size: 13px;
	line-height: 21px;
}

.vb-pied__cadre {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 24px 56px;
	padding-block: 48px;
}

.vb-pied__marque {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.vb-pied__nom {
	font-family: var(--vb-serif);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0.14em;
	color: var(--vb-ivoire);
}

.vauban .vb-pied a {
	color: inherit;
}

.vb-pied__menu {
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	gap: 8px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.vauban .vb-pied__menu a {
	color: var(--vb-ivoire);
	display: inline-block;
	padding-block: 4px;
}

.vauban .vb-pied__menu a:hover {
	color: var(--vb-blanc);
}

/* 16. Page d'attente
   -------------------------------------------------------------------------- */
.vb-attente {
	min-height: 100vh;
	display: flex;
	align-items: center;
	padding: 64px var(--vb-goutiere);
}

.vb-attente__cadre {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.vb-attente__cadre .vb-logo {
	margin-bottom: 40px;
}

.vb-attente__pied {
	margin-top: 24px !important;
	font-size: 13px;
	color: var(--vb-prune);
}

.vauban .vb-attente__pied a {
	color: var(--vb-prune);
}

/* 17. Éditeur de blocs : mêmes repères visuels
   -------------------------------------------------------------------------- */
.editor-styles-wrapper {
	background: var(--vb-ivoire);
	color: var(--vb-bordeaux);
	font-family: var(--vb-sans);
}

.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3 {
	font-family: var(--vb-serif);
	font-weight: 500;
}

/* 18. Préférences et impression
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.vauban *,
	.vauban *::before,
	.vauban *::after {
		transition: none !important;
		animation: none !important;
	}
}

@media print {
	.vb-barre,
	.vb-entete,
	.vb-pied,
	.vb-cadrage,
	.vb-evitement {
		display: none !important;
	}

	body.vauban {
		background: #fff;
		font-size: 11pt;
	}
}

/* 19. Sections converties des maquettes
   -------------------------------------------------------------------------- */
.vauban .vb-section--bordeaux {
	background: var(--vb-bordeaux);
	color: var(--vb-ivoire);
}

.vauban .vb-section--nuit {
	background: var(--vb-nuit);
	color: var(--vb-ivoire);
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) .is-style-vauban-label {
	color: #E9B9A6;
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) :is(.has-prune-color, li, .is-style-vauban-filets > li) {
	color: var(--vb-rose-clair);
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) .is-style-vauban-filets > li > strong:first-child,
.vauban :is(.vb-section--bordeaux, .vb-section--nuit) a:where(:not(.wp-block-button__link)) {
	color: var(--vb-ivoire);
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) .is-style-vauban-filets,
.vauban :is(.vb-section--bordeaux, .vb-section--nuit) .is-style-vauban-filets > li {
	border-color: #8A5A6A;
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) .wp-block-button:not(.is-style-vauban-lien) .wp-block-button__link {
	background: var(--vb-ivoire);
	color: var(--vb-bordeaux);
}

/* Colonnes génériques (cartes, chiffres clés, image et texte). */
.vauban .vb-colonnes.wp-block-columns {
	display: flex;
	flex-wrap: wrap !important;
	align-items: flex-start;
	gap: 40px 48px;
	margin: 0;
}

.vauban .vb-colonnes > .wp-block-column {
	flex: 1 1 220px !important;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.vauban .vb-colonnes > .wp-block-column:has(> .wp-block-image) {
	flex: 1 1 420px !important;
}

.vauban .vb-colonnes .wp-block-image img,
.vauban .vb-deux-colonnes .wp-block-image img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.vauban .wp-block-image {
	margin: 0;
}

/* Bande photographique pleine largeur. */
.vauban .wp-block-image.vb-photo img {
	width: 100%;
	height: clamp(260px, 32vw, 440px);
	object-fit: cover;
}

/* Lignes de liens (expertises, situations, simulateurs). */
.vauban .vb-liens > li > strong:first-child a {
	text-decoration: none;
	color: var(--vb-bordeaux);
}

.vauban .vb-liens > li > strong:first-child a:hover {
	color: var(--vb-rouille);
}

.vauban .vb-liens > li em {
	font-style: normal;
	font-weight: 600;
	color: var(--vb-bordeaux);
	white-space: nowrap;
}

/* Citation. */
.vauban .wp-block-quote.is-style-vauban {
	margin: 0;
	padding: 0 0 0 24px;
	border-left: 2px solid var(--vb-filet-rouille);
}

.vauban .wp-block-quote.is-style-vauban p {
	font-family: var(--vb-serif);
	font-size: clamp(24px, 2.8vw, 32px);
	line-height: 1.25;
	font-style: italic;
}

/* Questions fréquentes (bloc Détails). */
.vauban .wp-block-details {
	border-top: 1px solid var(--vb-lin);
	padding: 0;
}

.vauban .wp-block-details:last-of-type {
	border-bottom: 1px solid var(--vb-lin);
}

.vauban .wp-block-details summary {
	list-style: none;
	cursor: pointer;
	padding: 24px 40px 24px 0;
	position: relative;
	font-family: var(--vb-serif);
	font-size: clamp(22px, 2.4vw, 26px);
	line-height: 1.25;
	font-weight: 600;
}

.vauban .wp-block-details summary::-webkit-details-marker {
	display: none;
}

.vauban .wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 22px;
	font-family: var(--vb-sans);
	font-size: 22px;
	color: var(--vb-rouille);
	transition: transform 0.2s ease;
}

.vauban .wp-block-details[open] summary::after {
	transform: rotate(45deg);
}

.vauban .wp-block-details > :not(summary) {
	margin: 0 0 24px;
	max-width: 720px;
	font-size: 16px;
	line-height: 27px;
	color: var(--vb-prune);
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit, .vb-bande) .is-style-vauban-lien .wp-block-button__link {
	color: var(--vb-ivoire);
}

.vauban :is(.vb-section--bordeaux, .vb-section--nuit) ol.is-style-vauban-filets > li::before {
	color: #E9B9A6;
}

/* Chiffres clés : intitulé en petites capitales. */
.vauban .vb-faits > li > strong:first-child {
	font-family: var(--vb-sans);
	font-size: 12px;
	line-height: 26px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--vb-prune);
}

.vauban .vb-faits > li {
	padding: 16px 0;
	color: var(--vb-bordeaux);
}

/* Lignes de liens : le prix ou la mention à droite. */
@media (min-width: 900px) {
	.vauban .vb-liens > li {
		grid-template-columns: minmax(220px, 1fr) 2fr auto;
	}
}

.vauban .vb-liens > li > strong:first-child {
	font-size: clamp(24px, 2.4vw, 30px);
	line-height: 1.2;
}
