/* ==========================================================================
   VTT Offres d'emploi — pages des offres et des candidatures
   D'après le kit de maquettes (vtt-kit-design/vtt-kit : BRIEF.md, tokens.css).
   Mobile d'abord ; points de rupture 768px et 1200px ; contenu limité à 1296px.
   Tout est préfixé « vtt- » pour ne pas interférer avec Breakdance.
   ========================================================================== */

:root {
	/* Couleurs (tokens.css du kit) */
	--vtt-framboise: #cf0142;
	--vtt-orange: #ff5a18;
	--vtt-poudre: #f3dad0;
	--vtt-poudre-20: rgba(243, 218, 208, 0.2);
	--vtt-poudre-50: rgba(243, 218, 208, 0.5);
	--vtt-fond-section: #fcf8f6;
	--vtt-encre: #111317;
	--vtt-gris-texte: #55575d;
	--vtt-gris-texte-50: rgba(85, 87, 93, 0.5);
	--vtt-gris-bordure: #d9d9d7;
	--vtt-champ-fond: #f5f5f5;
	--vtt-champ-bordure: rgba(36, 38, 42, 0.1);
	--vtt-erreur: #d01515;
	--vtt-blanc: #fff;
	--vtt-degrade: linear-gradient(180deg, #d90c58 0%, #ff4d45 46%, #f6a29e 100%);
	--vtt-ombre-carte: 0 18px 24px rgba(17, 19, 23, 0.1);

	/* Polices du site (kit Adobe Fonts) : All Round Gothic et Helvetica LT Pro */
	--vtt-font-titres: "all-round-gothic", "Quicksand", "Nunito", system-ui, sans-serif;
	--vtt-font-texte: "helvetica-lt-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* Mise en page */
	--vtt-contenu: 1296px;
	--vtt-gouttiere: 18px;
	/* Hauteur de l'en-tête Breakdance (fixe) : 70px, puis 100px à partir de 1024px (ses points de rupture). */
	--vtt-entete: 70px;
}

@media (min-width: 1024px) {
	:root { --vtt-entete: 100px; }
}

@media (min-width: 768px) {
	:root { --vtt-gouttiere: 40px; }
}

@media (min-width: 1200px) {
	:root { --vtt-gouttiere: 72px; }
}

/* ---------- Base ---------- */

/* L'en-tête Breakdance est en position fixe : on réserve sa hauteur. */
.vtt-offres {
	padding-top: var(--vtt-entete);
	font-family: var(--vtt-font-texte);
	font-size: 16px;
	line-height: 1.5;
	color: var(--vtt-encre);
	background: var(--vtt-blanc);
	overflow-x: clip;
}

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

/* Remises à zéro sans spécificité (:where) : les classes vtt- gardent toujours la main. */
:where(.vtt-offres) :where(h1, h2, h3, p, ul, ol, dl, dd, fieldset) {
	margin: 0;
}

.vtt-offres img {
	display: block;
	max-width: 100%;
	height: auto;
}

.vtt-offres a {
	color: inherit;
}

.vtt-offres :focus-visible {
	outline: 2px solid var(--vtt-orange);
	outline-offset: 2px;
}

.vtt-icone {
	flex: none;
	width: 18px;
	height: 18px;
}

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

/* ---------- Menu Breakdance : entrée « Nos offres d'emplois » active ---------- */

/* L'entrée est masquée dans l'en-tête Breakdance (elle pointait vers #contact) : visible sur nos pages. */
.vtt-offres-page .breakdance-menu-item:has(> .vtt-menu-actif) {
	display: flex !important;
}

.vtt-offres-page .breakdance-menu-link.vtt-menu-actif {
	color: var(--vtt-framboise) !important;
	background: var(--vtt-fond-section);
	box-shadow: inset 0 -2px 0 var(--vtt-framboise);
}

/* ---------- Textes communs ---------- */

.vtt-kicker {
	font-family: var(--vtt-font-texte);
	font-size: 12px;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--vtt-framboise);
}

.vtt-kicker--clair {
	color: var(--vtt-blanc);
}

.vtt-offres .vtt-titre-section {
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 36px;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--vtt-orange);
}

.vtt-offres .vtt-titre-section--centre {
	text-align: center;
}

.vtt-date {
	font-size: 13px;
	color: var(--vtt-gris-texte-50);
}

.vtt-lieu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 10px;
	font-size: 15px;
	color: var(--vtt-gris-texte);
}

.vtt-lieu__partie + .vtt-lieu__partie::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 10px;
	vertical-align: middle;
	border-radius: 50%;
	background: var(--vtt-orange);
}

.vtt-lien {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	color: var(--vtt-framboise) !important;
	text-decoration: none;
}

.vtt-lien:hover {
	text-decoration: underline;
}

@media (min-width: 1200px) {
	.vtt-offres .vtt-titre-section { font-size: 48px; }
}

/* ---------- Boutons ---------- */

.vtt-bouton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	min-height: 58px;
	padding: 0 24px;
	border: 0;
	border-radius: 0;
	font-family: var(--vtt-font-titres);
	font-weight: 600;
	font-size: 13px;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: padding 0.2s ease, gap 0.2s ease;
}

/* Survol (variantes 2 et 4 de la maquette) : la flèche se rapproche du texte. */
.vtt-bouton:hover,
.vtt-bouton:focus-visible {
	gap: 10px;
	padding: 0 32px;
}

.vtt-bouton--plein {
	background: var(--vtt-framboise);
	color: var(--vtt-blanc) !important;
}

.vtt-bouton--clair {
	background: var(--vtt-poudre);
	color: var(--vtt-framboise) !important;
}

/* Bouton « Voir l'offre » */
.vtt-bouton-ligne {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 15px;
	border: 1px solid var(--vtt-framboise);
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.4;
	color: var(--vtt-framboise) !important;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s ease, color 0.2s ease;
}

/* ---------- Haut de page ---------- */

.vtt-hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 280px;
	padding: 48px var(--vtt-gouttiere);
	background: var(--vtt-degrade);
	color: var(--vtt-blanc);
	text-align: center;
}

.vtt-offres-page--offre .vtt-hero {
	min-height: 400px;
}

.vtt-offres .vtt-hero__kicker {
	font-family: var(--vtt-font-titres);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
}

.vtt-offres .vtt-hero__titre {
	margin-top: 12px;
	font-family: var(--vtt-font-titres);
	font-weight: 600;
	font-size: 40px;
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: var(--vtt-blanc);
	overflow-wrap: anywhere;
}

/* Variante photo (liste des offres) : photo en haut sur mobile, à gauche sur ordinateur. */
.vtt-hero--photo {
	display: block;
	padding: 0;
	background: none;
	text-align: right;
}

.vtt-hero--photo .vtt-hero__photo {
	width: 100%;
	height: 200px;
	object-fit: cover;
}

.vtt-hero--photo .vtt-hero__texte {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 300px;
	padding: 32px var(--vtt-gouttiere);
	background: var(--vtt-degrade);
}

@media (min-width: 768px) {
	.vtt-hero { min-height: 400px; }
	.vtt-offres .vtt-hero__titre { font-size: 60px; }
}

@media (min-width: 1200px) {
	.vtt-hero--photo {
		display: flex;
		justify-content: flex-start;
		height: 400px;
		background: var(--vtt-degrade);
	}

	.vtt-hero--photo .vtt-hero__photo {
		width: 64.1%;
		height: 100%;
	}

	/* Bloc de texte de 500px qui déborde de 131px sur la photo (maquette). */
	.vtt-hero--photo .vtt-hero__texte {
		position: absolute;
		top: 50%;
		right: 10.3%;
		width: 500px;
		min-height: 0;
		padding: 0;
		background: none;
		transform: translateY(-50%);
	}
}

/* ---------- Sections ---------- */

.vtt-section {
	padding: 48px var(--vtt-gouttiere);
}

.vtt-section--poudre {
	background: var(--vtt-fond-section);
}

.vtt-section > * {
	max-width: var(--vtt-contenu);
	margin-right: auto;
	margin-left: auto;
}

.vtt-section__entete {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	margin-bottom: 32px;
	text-align: center;
}

@media (min-width: 768px) {
	.vtt-section { padding-top: 72px; padding-bottom: 72px; }
}

@media (min-width: 1200px) {
	.vtt-section { padding-top: 120px; padding-bottom: 120px; }

	.vtt-section__entete {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		margin-bottom: 72px;
		text-align: left;
	}
}

/* ---------- Liste des offres ---------- */

/* Ancre des filtres et de la pagination : sous l'en-tête fixe. */
.vtt-liste {
	scroll-margin-top: var(--vtt-entete);
}

.vtt-liste__bouton-entete {
	display: none;
}

.vtt-liste__corps {
	display: flex;
	flex-direction: column;
}

/* Sur mobile, le bloc « candidature spontanée » passe après la liste (maquette). */
.vtt-liste__colonne {
	display: contents;
}

.vtt-filtres {
	order: 1;
	margin-bottom: 24px;
	text-align: center;
}

.vtt-liste__resultats {
	order: 2;
}

.vtt-encart-spontanee {
	order: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
	margin-top: 48px;
	text-align: center;
}

.vtt-filtres__titre {
	margin-bottom: 15px;
	font-size: 16px;
	color: var(--vtt-gris-texte);
	text-align: left;
}

.vtt-filtres__liste {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	padding: 0;
	list-style: none;
}

.vtt-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 15px;
	border: 1px solid var(--vtt-gris-bordure);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.4);
	font-size: 15px;
	line-height: 1.3;
	color: var(--vtt-gris-texte) !important;
	text-decoration: none;
	transition: border-color 0.2s ease;
}

.vtt-tag:hover {
	border-color: var(--vtt-orange);
}

.vtt-tag--actif {
	border-color: var(--vtt-orange);
	background: var(--vtt-blanc);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	color: var(--vtt-orange) !important;
}

.vtt-tag--actif::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--vtt-orange);
}

.vtt-encart-spontanee__mascotte {
	width: 168px;
}

.vtt-offres .vtt-encart-spontanee__titre {
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 28px;
	line-height: 1.2;
	color: var(--vtt-orange);
}

.vtt-encart-spontanee__texte {
	color: var(--vtt-gris-texte);
}

.vtt-lignes {
	background: var(--vtt-blanc);
	box-shadow: var(--vtt-ombre-carte);
}

.vtt-ligne-offre {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 6px 24px;
	padding: 24px 18px;
	background: var(--vtt-blanc);
	transition: background 0.2s ease;
}

.vtt-ligne-offre::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 1px;
	background: var(--vtt-orange);
	transition: height 0.2s ease;
}

.vtt-ligne-offre > * {
	grid-column: 1 / -1;
}

.vtt-offres .vtt-ligne-offre__titre {
	font-family: var(--vtt-font-texte);
	font-weight: 400;
	font-size: 20px;
	line-height: 1.25;
	color: var(--vtt-encre);
}

.vtt-ligne-offre .vtt-date {
	grid-column: 1;
	align-self: end;
	margin-top: 12px;
}

.vtt-ligne-offre__lien {
	grid-column: 2;
	grid-row: 3;
	align-self: end;
}

/* Toute la ligne est cliquable. */
.vtt-ligne-offre__lien::after {
	content: "";
	position: absolute;
	inset: 0;
}

.vtt-ligne-offre:hover,
.vtt-ligne-offre:focus-within {
	background: var(--vtt-poudre-50);
}

.vtt-ligne-offre:hover::before,
.vtt-ligne-offre:focus-within::before {
	height: 3px;
}

.vtt-ligne-offre:hover .vtt-lieu,
.vtt-ligne-offre:hover .vtt-date {
	color: var(--vtt-encre);
}

.vtt-ligne-offre:hover .vtt-bouton-ligne,
.vtt-ligne-offre:focus-within .vtt-bouton-ligne {
	background: var(--vtt-framboise);
	color: var(--vtt-blanc) !important;
}

.vtt-pagination {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin-top: 24px;
}

.vtt-pagination__page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 54px;
	height: 54px;
	padding: 0 12px;
	border: 1px solid var(--vtt-gris-bordure);
	border-radius: 120px;
	background: rgba(255, 255, 255, 0.4);
	font-family: var(--vtt-font-titres);
	font-weight: 400;
	font-size: 22px;
	color: var(--vtt-encre) !important;
	text-decoration: none;
}

.vtt-pagination__page:hover {
	border-color: var(--vtt-orange);
}

.vtt-pagination__page--active {
	border-color: transparent;
	background: var(--vtt-blanc);
	color: var(--vtt-orange) !important;
}

.vtt-pagination__page--active::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--vtt-orange);
}

.vtt-pagination__ellipse {
	align-self: center;
	color: var(--vtt-gris-texte);
}

.vtt-vide {
	display: grid;
	gap: 15px;
	padding: 48px 24px;
	background: var(--vtt-blanc);
	box-shadow: var(--vtt-ombre-carte);
	color: var(--vtt-gris-texte);
	text-align: center;
}

@media (min-width: 768px) {
	.vtt-ligne-offre { padding: 24px; }
	.vtt-offres .vtt-ligne-offre__titre { font-size: 24px; }
}

@media (min-width: 1200px) {
	.vtt-liste__bouton-entete { display: inline-flex; }

	.vtt-liste__corps {
		display: grid;
		grid-template-columns: 290px 1fr;
		align-items: start;
	}

	.vtt-liste__colonne {
		display: flex;
		flex-direction: column;
		padding-right: 32px;
	}

	.vtt-filtres {
		margin-bottom: 0;
		padding-bottom: 32px;
		border-bottom: 1px solid var(--vtt-gris-bordure);
		text-align: left;
	}

	.vtt-filtres__liste {
		justify-content: flex-start;
	}

	.vtt-encart-spontanee {
		align-items: flex-start;
		margin-top: 32px;
		text-align: left;
	}

	.vtt-offres .vtt-encart-spontanee__titre { font-size: 32px; }

	.vtt-liste__resultats {
		padding-left: 32px;
	}
}

/* ---------- Cartes (fiche, candidature) ---------- */

.vtt-carte {
	position: relative;
	padding: 24px 18px;
	background: var(--vtt-blanc);
	box-shadow: var(--vtt-ombre-carte);
}

.vtt-carte__entete {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--vtt-poudre);
}

.vtt-icone--recherche {
	width: 38px;
	height: 38px;
	color: var(--vtt-orange);
}

.vtt-carte__pied {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 15px;
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid var(--vtt-poudre);
}

.vtt-carte__pied--centre {
	justify-content: center;
}

@media (min-width: 768px) {
	.vtt-carte { padding: 32px 38px; }
}

@media (min-width: 1200px) {
	.vtt-carte { padding: 32px 48px; }
}

/* ---------- Fiche d'une offre ---------- */

.vtt-fiche::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--vtt-orange), var(--vtt-framboise));
}

.vtt-criteres {
	display: grid;
	grid-template-columns: 1fr;
	margin: 15px 0 32px;
	background: var(--vtt-poudre-20);
	text-align: center;
}

.vtt-criteres__item {
	padding: 12px 10px;
	border-top: 1px solid var(--vtt-poudre);
}

.vtt-criteres__item:first-child {
	border-top: 0;
}

.vtt-criteres__libelle {
	font-size: 13px;
	text-transform: uppercase;
	color: var(--vtt-orange);
}

.vtt-criteres__valeur {
	font-size: 16px;
	color: var(--vtt-gris-texte);
}

.vtt-fiche__contenu {
	display: grid;
	gap: 32px;
}

.vtt-offres .vtt-titre-rubrique {
	margin-bottom: 15px;
	font-family: var(--vtt-font-texte);
	font-weight: 400;
	font-size: 30px;
	line-height: 1.2;
	letter-spacing: -0.7px;
	color: var(--vtt-encre);
}

.vtt-offres .vtt-titre-sous-rubrique {
	margin: 18px 0 6px;
	font-family: var(--vtt-font-texte);
	font-weight: 700;
	font-size: 16px;
}

.vtt-texte {
	font-size: 16px;
	line-height: 1.5;
	color: var(--vtt-encre);
}

.vtt-texte p + p,
.vtt-texte p + ul,
.vtt-texte p + ol,
.vtt-texte ul + p,
.vtt-texte ol + p {
	margin-top: 12px;
}

.vtt-texte ul,
ul.vtt-texte {
	padding-left: 24px;
	list-style: none;
}

.vtt-texte ol {
	padding-left: 24px;
}

.vtt-texte ul > li,
ul.vtt-texte > li {
	position: relative;
}

/* Puce orange de la maquette (puce-liste-offre.svg). */
.vtt-texte ul > li::before,
ul.vtt-texte > li::before {
	content: "";
	position: absolute;
	top: 0.55em;
	left: -17px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--vtt-orange);
}

.vtt-texte ol > li::marker {
	color: var(--vtt-orange);
}

.vtt-contact {
	margin-top: 18px;
}

.vtt-contact__libelle {
	font-weight: 700;
}

.vtt-contact .vtt-lien {
	font-size: 16px;
}

.vtt-autres {
	margin-top: 72px;
}

.vtt-autres .vtt-titre-section {
	margin-bottom: 32px;
}

@media (min-width: 768px) {
	.vtt-criteres {
		grid-template-columns: repeat(3, 1fr);
	}

	.vtt-criteres__item {
		border-top: 0;
		border-left: 1px solid var(--vtt-poudre);
	}

	.vtt-criteres__item:nth-child(3n + 1) {
		border-left: 0;
	}

	.vtt-criteres__item:nth-child(n + 4) {
		border-top: 1px solid var(--vtt-poudre);
	}

	.vtt-offres .vtt-titre-rubrique { font-size: 36px; }
}

@media (min-width: 1200px) {
	.vtt-criteres {
		grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
		grid-auto-flow: column;
	}

	.vtt-criteres__item,
	.vtt-criteres__item:nth-child(n + 4) {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 74px;
		border-top: 0;
		border-left: 1px solid var(--vtt-poudre);
	}

	.vtt-criteres__item:first-child {
		border-left: 0;
	}

	.vtt-autres { margin-top: 120px; }
}

/* ---------- Bandeau « Candidature spontanée » ---------- */

.vtt-cta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	padding: 32px var(--vtt-gouttiere);
	background: var(--vtt-degrade);
	color: var(--vtt-blanc);
}

.vtt-cta__texte {
	display: grid;
	gap: 10px;
}

.vtt-offres .vtt-cta__titre {
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 28px;
	line-height: 1.2;
	color: var(--vtt-blanc);
}

.vtt-cta__description {
	opacity: 0.9;
}

@media (min-width: 1200px) {
	.vtt-cta {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 48px 120px;
	}

	.vtt-offres .vtt-cta__titre { font-size: 32px; }
}

/* ---------- Frise de photos ---------- */

.vtt-frise {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
	padding: 32px 0;
	background: var(--vtt-blanc);
}

.vtt-frise__photo {
	width: 100%;
	height: 150px;
	object-fit: cover;
}

@media (min-width: 768px) {
	.vtt-frise { grid-template-columns: repeat(4, 1fr); }
	.vtt-frise__photo { height: 300px; }
}

/* ---------- Candidature ---------- */

/* Retour sur le formulaire après un envoi refusé (ancre), sous l'en-tête fixe. */
.vtt-candidature {
	scroll-margin-top: calc(var(--vtt-entete) + 20px);
}

.vtt-candidature__entete {
	padding-bottom: 10px;
}

.vtt-candidature__surtitre {
	font-size: 13px;
	color: var(--vtt-gris-texte);
}

.vtt-offres .vtt-candidature__titre {
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 28px;
	line-height: 1.2;
	color: var(--vtt-orange);
}

.vtt-candidature__liens {
	flex-direction: column;
	align-items: flex-start;
}

.vtt-lien--droite {
	margin-left: auto;
}

.vtt-confirmation {
	padding: 48px 24px;
	border: 1px solid var(--vtt-poudre);
	background: var(--vtt-poudre-20);
	text-align: center;
}

.vtt-offres .vtt-confirmation__titre {
	margin-bottom: 18px;
	font-family: var(--vtt-font-titres);
	font-weight: 500;
	font-size: 36px;
	line-height: 1.2;
	color: var(--vtt-orange);
}

@media (min-width: 768px) {
	.vtt-offres .vtt-candidature__titre { font-size: 36px; }
	.vtt-candidature__liens { flex-direction: row; align-items: center; }
	.vtt-confirmation { padding: 48px; }
	.vtt-offres .vtt-confirmation__titre { font-size: 48px; }
}

/* ---------- Formulaire ---------- */

.vtt-formulaire {
	margin-top: 24px;
}

.vtt-formulaire__alerte {
	margin-bottom: 24px;
	padding: 15px 18px;
	border: 1px dashed var(--vtt-erreur);
	color: var(--vtt-erreur);
}

.vtt-formulaire__grille {
	display: grid;
	grid-template-columns: 1fr;
	gap: 15px 24px;
}

.vtt-champ {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 0;
	border: 0;
}

.vtt-champ__libelle {
	padding: 0;
	font-family: var(--vtt-font-texte);
	font-weight: 700;
	font-size: 11px;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--vtt-encre);
}

.vtt-champ__aide {
	margin-left: 6px;
	font-weight: 400;
	text-transform: none;
	color: var(--vtt-gris-texte);
}

.vtt-champ__saisie {
	width: 100%;
	height: 62px;
	padding: 0 10px;
	border: 1px solid transparent;
	border-bottom-color: var(--vtt-champ-bordure);
	border-radius: 0;
	background: var(--vtt-champ-fond);
	font-family: var(--vtt-font-texte);
	font-size: 16px;
	color: var(--vtt-gris-texte);
	box-shadow: none;
	appearance: none;
}

.vtt-champ__saisie:focus {
	border-color: var(--vtt-champ-bordure);
	color: var(--vtt-encre);
	outline: none;
}

.vtt-champ__saisie:focus-visible {
	outline: 2px solid var(--vtt-orange);
	outline-offset: 0;
}

.vtt-champ__erreur {
	font-size: 13px;
	color: var(--vtt-erreur);
	text-align: right;
}

.vtt-champ--erreur .vtt-champ__libelle,
.vtt-champ--erreur .vtt-champ__saisie {
	color: var(--vtt-erreur);
}

.vtt-champ--erreur .vtt-champ__saisie,
.vtt-champ--erreur .vtt-fichier {
	border: 1px dashed var(--vtt-erreur);
}

/* Champ fichier : zone grise + bouton « Joindre un CV » (le vrai champ est invisible mais reste utilisable). */
.vtt-fichier {
	position: relative;
	display: flex;
	align-items: stretch;
	height: 62px;
	border-bottom: 1px solid var(--vtt-champ-bordure);
	background: var(--vtt-champ-fond);
	cursor: pointer;
}

.vtt-fichier__saisie {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.vtt-fichier__nom {
	flex: 1;
	align-self: center;
	padding: 0 10px;
	overflow: hidden;
	font-size: 14px;
	color: var(--vtt-gris-texte);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.vtt-fichier__bouton {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 130px;
	border-radius: 0 6px 6px 0;
	background: var(--vtt-poudre);
	font-weight: 700;
	font-size: 14px;
	color: var(--vtt-framboise);
}

.vtt-fichier:focus-within {
	outline: 2px solid var(--vtt-orange);
	outline-offset: 2px;
}

/* Choix de l'agence (boutons radio de la maquette ; état coché : point orange). */
.vtt-choix__options {
	display: grid;
	gap: 10px;
	margin-top: 6px;
}

.vtt-choix__option {
	display: inline-flex;
	align-items: center;
	gap: 15px;
	font-size: 16px;
	cursor: pointer;
}

.vtt-choix__saisie,
.vtt-consentement__saisie {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.vtt-choix__rond {
	display: grid;
	flex: none;
	place-items: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--vtt-champ-bordure);
	border-radius: 50%;
	background: var(--vtt-champ-fond);
}

.vtt-choix__saisie:checked + .vtt-choix__rond::after {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--vtt-orange);
}

.vtt-choix__saisie:focus-visible + .vtt-choix__rond,
.vtt-consentement__saisie:focus-visible + .vtt-consentement__case {
	outline: 2px solid var(--vtt-orange);
	outline-offset: 2px;
}

.vtt-champ--erreur .vtt-choix__rond {
	border: 1px dashed var(--vtt-erreur);
}

/* Case de consentement (maquette : carré noir ; état coché : coche blanche). */
.vtt-consentement {
	margin-top: 10px;
}

.vtt-consentement__libelle {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	cursor: pointer;
}

.vtt-consentement__case {
	position: relative;
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	border: 1px solid var(--vtt-blanc);
	background: var(--vtt-encre);
	box-shadow: 0 0 0 1px var(--vtt-encre);
}

.vtt-consentement__saisie:checked + .vtt-consentement__case::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 5px;
	width: 5px;
	height: 9px;
	border: solid var(--vtt-blanc);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.vtt-consentement__texte {
	font-size: 12px;
	line-height: 1.5;
	color: var(--vtt-encre);
	opacity: 0.68;
}

.vtt-champ--erreur .vtt-consentement__texte {
	color: var(--vtt-erreur);
	opacity: 1;
}

.vtt-champ--erreur.vtt-consentement .vtt-champ__erreur {
	text-align: left;
}

/* Information RGPD sous la case de consentement (même style que son texte). */
.vtt-mention {
	font-size: 12px;
	line-height: 1.5;
	color: var(--vtt-encre);
	opacity: 0.68;
}

.vtt-mention a {
	color: var(--vtt-framboise) !important;
}

.vtt-formulaire__envoi {
	margin-top: 32px;
	text-align: center;
}

.vtt-formulaire__envoi .vtt-bouton {
	width: 100%;
}

.vtt-formulaire__piege {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (min-width: 768px) {
	.vtt-formulaire__grille { grid-template-columns: 1fr 1fr; }
	.vtt-champ--large { grid-column: 1 / -1; }
	.vtt-choix__options { grid-template-columns: repeat(3, 1fr); }
	.vtt-formulaire__envoi .vtt-bouton { width: auto; }
}