*, ::before, ::after                                            { box-sizing: border-box; border-width: 0; border-style: solid; }
body                                                            { margin: 0; line-height: inherit; }
blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre  { margin: 0; }
menu, ol, ul                                                    { margin: 0; padding: 0; list-style: none; }

/* Variables globales ========================================================== (MOBILE FIRST) */
:root {
	--bleu-trmdvsr-pur:					#203c85;
	--bleu-trmdvsr-moyen:				#3968de;
	--bleu-trmdvsr-clair:				#339af0;
	--bleu-trmdvsr-clair-RGB:		82, 152, 233;
	--gris-trmdvsr-fonce:				#111827;
	--gris-trmdvsr-fonce-RGB:		17, 24, 39;
	--gris-trmdvsr-clair:				#a0aec0;													/* RGB: 160, 174, 192; */
	--gris-trmdvsr-tres-clair:	#e9ecf3;
	--blanc-trmdvsr:						#f4f5f9;													/* RGB :244, 245, 249; */
	--blanc-pur:                #FFF;
	--vert-trmdvsr-clair:				#a0c0a0;
	--vert-trmdvsr-moyen:				#4a684d;
	--vert-trmdvsr-fonce:				#2a8520;
	--rouge-trmdvsr-clair:			#c0a0a0;
	--beige-trmdvsr:						#e7d7cb;
	--couleur-fond-carte:				#2a2e3d;
	--color-shadow:             rgba(0, 0, 0, 0.15);
	--bordure-radius:						1rem;
	--largeur-stroke:						2;

	--pente-unitaire: 					calc(100vw / 60rem);										/* +> calcul fluide */
	--hauteur-header:						clamp(102px, 5.9vw + 83.1px, 128px);
	--hauteur-content:					0px;														/* hauteur dynamique calculée car pb de height 25.10.28(09:52) */
	--module-avis-height:				400px;   													/* Nouvelle variable pour la hauteur fixe de la conversation */
	--largeur-conteneur-max:		min(100%, 60rem);											/* 100% de l'écran jusqu'à 60rem de largeur */
	--largeur-logo-bouton:			clamp(2.5rem, 4rem - 2vw, 4rem);							/* => +'vw' augmente, + valeur finale diminue */
	--largeur-loader:						clamp(2rem, 50%, 10vw);										/* Largeur du bloc loading => fluide: min:2rem | ideal:50% | max:20vw */
	--largeur-notede0:					clamp(131px, 7.08vw + 108.33px, 199px);
	--largeur-notea5:						clamp(102px, 5.52vw + 84.33px, 155px);
	--logo-tronksize-larg:			clamp(1rem, 0.75rem + 0.25vw, 1.5rem);						/* Taille de la coupure du logo */
	--pp-dimensions:						clamp(4rem, 0.5rem + 2vw, 5rem);
	
	--espacement-master:				clamp(3rem, 2rem + 2.5vw, 5rem);

	--espacement-large:					clamp(1.5rem, 0.5rem + 2vw, 3rem);
	--espacement-button:				clamp(0.25rem, 2.5833rem - 0.1823vw, 2rem);					/* Espace entre les boutons UX Mobile */
	--espacement-button-half:		clamp(0.125rem, calc(2.5833rem / 2 - 0.1823vw / 2), 1rem);	/* Espace entre les boutons UX Mobile */

	--graisse-texte:						400;														/* graisse normale */
	--taille-texte:							clamp(1rem, calc(1rem + 2vw), 1.25rem);						/* 1rem (16px) à 1.25rem (20px) OLD : 4vw */
	--taille-texte-btn:					0.875rem;													/* 0.874rem (14px) */

	--taille-h1: clamp( 
		calc(var(--taille-texte) * 1.0625), 														/* Valeur Min à ~30rem */
		calc(var(--taille-texte) * (1.0625 + (2.5 - 1.0625) * var(--pente-unitaire))), 			/* Transition parfaite */
		calc(var(--taille-texte) * 2.5)															/* Valeur Max à 60rem et au-delà => 40px à 3.125rem (50px)*/
	);
	--taille-h2: clamp(
		calc(var(--taille-texte) * 1),
		calc(var(--taille-texte) * (1 + (2 - 1) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 2) 															/* 32px à 2.5rem (40px) */
	);
	--taille-h3: clamp(
		calc(var(--taille-texte) * 0.5),
		calc(var(--taille-texte) * (0.5 + (1.5 - 0.5) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 1.5)															/* 24px à 1.875rem (30px) */
	);
	--taille-h4: clamp(
		calc(var(--taille-texte) * 0.75),
		calc(var(--taille-texte) * (0.75 + (1.25 - 0.75) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 1.25)														/* 20px à 1.5625rem (25px) */
	);					
	--taille-chapo: clamp(
		calc(var(--taille-texte) * 1.0),
		calc(var(--taille-texte) * (1.0 + (1.125 - 1.0) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 1.125) 														/* 16px à 1.4rem (px) */
	);
	--taille-sstexte: clamp(
		calc(var(--taille-texte) * 0.5),
		calc(var(--taille-texte) * (0.5 + (0.75 - 0.5) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 0.75) 														/* .75 = 12px */
	);			
	--taille-label: clamp(
		calc(var(--taille-texte) * 0.375),
		calc(var(--taille-texte) * (0.375 + (0.625 - 0.375) * var(--pente-unitaire))),
		calc(var(--taille-texte) * 0.625) 														/* .625 = 10px */
	);					
	--graisse-h1:					calc(var(--graisse-texte) * 2.25);							/* 900 */
	--graisse-h2:					calc(var(--graisse-texte) * 2);								/* 800 */
	--graisse-h3:					calc(var(--graisse-texte) * 1.75);							/* 700 */
	--graisse-h4:					calc(var(--graisse-texte) * 1.5);							/* 600 */
	--graisse-chapo:			calc(var(--graisse-texte) * 1.25);							/* 500 */
	--graisse-sstexte:		calc(var(--graisse-texte) * 1.5);							/* 600 */
	
	--espacement-tres-large:		calc(var(--espacement-large) * 1.33);						/* 31,92 */
	--espacement-moyen:					calc(var(--espacement-large) * 0.66);						/* 15,84 */
	--espacement-moyen-demi:		calc(var(--espacement-moyen) * 0.5);						/* 8 */
	--espacement-court:					calc(var(--espacement-moyen) * 0.66);						/* 10,4544 */
	
	--var-spec-max: 						calc( 4 * var(--espacement-large) );
	--var-spec-fluide: 					calc( var(--var-spec-max) - 3vw );
	--espacement-sprfld : 			clamp( var(--espacement-large), var(--var-spec-fluide), var(--var-spec-max) );
	--largeur-navigation-aide:	calc((var(--espacement-large) * 3) + (var(--largeur-logo-bouton) * 2));  /* 108px => 240px */
	--largeur-tier-max:					calc((var(--largeur-conteneur-max) - (var(--espacement-large) * 2)) / 3);/* 315px => 307px */
	--largeur-eval-item:				calc(var(--largeur-conteneur-max) - (var(--espacement-court) * 2)); /* Conteneur - les marges */
	--largeur-composant-note:		calc(var(--largeur-eval-item) - var(--largeur-notede0) - var(--largeur-notea5) - (var(--espacement-large) *2) );
	--logo-tronksize-med:				calc(var(--logo-tronksize-larg) * 0.66 );
	--logo-tronksize-court:			calc(var(--logo-tronksize-med) * 0.66 );

	--url-logo-inactif:				url('https://i.imgur.com/OIsQ6DL.png');
	--url-logo-charte:				url('https://i.imgur.com/Hfhftm1.png');
	--url-logo-rollover:			url('https://i.imgur.com/SFq0KsY.png');
	--url-logo-actif:					url('https://i.imgur.com/FZWC78D.png');
	--url-logo-blanc:					url('./dts/img/logo_signe_seul.png');
	--url-notede0:						url('https://i.imgur.com/gy5B1Wg.png');
	--url-notea5:							url('https://i.imgur.com/oGZf3eC.png');
	--url-visuel-fauteuil:		url('https://i.imgur.com/2xmmReX.png');
	--url-visuel-accueil:			url('https://i.imgur.com/LILnWVO.png');						/* 1125px × 2436px | ratio:2,1653333333 */
	--url-visuel-bulle1:			url('https://i.imgur.com/kbXpA00.png');
	--url-visuel-bulle2:			url('https://i.imgur.com/aiR2TF3.png');
}

/* Textes ============================================================================ (GLOBAL) */
.trmdvsr-texte-h1 {
	margin-bottom:					var(--espacement-court);
	font-size:						var(--taille-h1);
	font-weight:					var(--graisse-h1);
	line-height:					120%; 
	letter-spacing:					-0.0269rem;													/* -0.43px iOS */
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
} 
.trmdvsr-texte-h2 {
	font-size:						var(--taille-h2);
	font-weight:					var(--graisse-h2);
	line-height:					120%; 
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
}
.trmdvsr-texte-h3 {
	padding:						var(--espacement-moyen) 0;
	font-size:						var(--taille-h3);
	font-weight:					var(--graisse-h3);
	line-height:					120%; 
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
}
.trmdvsr-texte-h3.blanc {
	padding:						var(--espacement-moyen) 0;
	font-size:						var(--taille-h3);
	font-weight:					var(--graisse-h3);
	line-height:					120%; 
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--blanc-pur);
}
.trmdvsr-texte-h4 {
	font-size:						calc(var(--taille-sstexte) * 0.66);       /* var(--taille-h4); */
	font-weight:					var(--graisse-h4);
	line-height:					120%;
	letter-spacing:					2px;                                      /* -0.0269rem; */
	text-rendering:					optimizeLegibility;
	text-transform:					uppercase;
	color:							var(--bleu-trmdvsr-clair);
} 
.trmdvsr-texte-h5 {
	font-size:						calc(var(--taille-h3) * 0.66);       /* var(--taille-h4); */
	font-weight:					var(--graisse-h3);
	line-height:					120%;
	letter-spacing:					2px;                                      /* -0.0269rem; */
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
} 
.trmdvsr-texte-chapo {
	margin: 							0;
	padding: 							0;
	font-size:						var(--taille-chapo);
	font-weight:					var(--graisse-chapo);
	line-height:					120%;
	letter-spacing:				-0.0269rem;
	text-rendering:				optimizeLegibility;
	color:								var(--gris-trmdvsr-fonce);
}
.trmdvsr-texte-chapo p            { padding-bottom: var(--espacement-moyen); }										/* Applique l'espace sous CHAQUE paragraphe */
.trmdvsr-texte-chapo p:last-child { padding-bottom: var(--espacement-court); }										/* Supprime l'espace sous le dernier paragraphe */
.trmdvsr-texte {
	font-size:						var(--taille-texte);
	font-weight:					var(--graisse-texte);
	letter-spacing:					-0.0269rem;
	word-break: 					word-break;
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
}
.trmdvsr-texte p            { margin-bottom: var(--espacement-court);           } 							/* Applique l'espace sous CHAQUE paragraphe */
.trmdvsr-texte p:last-child { margin-bottom: calc(var(--espacement-court) / 2); } 							/* Supprime l'espace sous le dernier paragraphe */
.trmdvsr-texte-btn {
	text-align:						center;
	font-size:						var(--taille-texte-btn);
	font-weight:					var(--graisse-h3);
	line-height:					140%;
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
}
.trmdvsr-sstexte {
	font-size:						var(--taille-sstexte); 
	font-weight:					var(--graisse-sstexte);
	line-height:					140%;
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--gris-trmdvsr-fonce);
}
.trmdvsr-label {
	font-size:						var(--taille-label); 
	font-weight:					var(--graisse-sstexte);
	line-height:					140%;
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--blanc-trmdvsr);
}
.trmdvsr-label.blue {
	font-size:						var(--taille-label); 
	font-weight:					var(--graisse-sstexte);
	line-height:					140%;
	letter-spacing:					-0.0269rem;
	text-rendering:					optimizeLegibility;
	color:							var(--bleu-trmdvsr-clair);
}
.trmdvsr-breadcrumb {
	display: 							flex;
	align-items: 					center;
	font-size:						var(--taille-label); 
	font-weight:					var(--graisse-texte);
	line-height:					140%;
	letter-spacing:				-0.0269rem;
	text-rendering:				optimizeLegibility;
	color:								var(--gris-trmdvsr-fonce);
}
em { font-weight: var(--graisse-texte); font-style: italic; }
.lien-bleu        { text-decoration: none;        color: var(--bleu-trmdvsr-clair); }
.lien-bleu:hover  { text-decoration: underline;   color: var(--bleu-trmdvsr-moyen); }
ol { list-style-type: decimal; }																																/* Rétablit l'affichage des chiffres (1, 2, 3...) */

/* Dividers ========================================================================== (GLOBAL) */
.traum-divider-small {                                                /* IDENTIQUE MOBILE & DESKTOP */
	width:                    calc( 100% - (var(--espacement-large) * 2) );
	height:                   1px;
	margin:                   var(--espacement-moyen) var(--espacement-large);/* espace 2 côtés */
	padding:                  0;
	background-color:         var(--gris-trmdvsr-clair);
}
.traum-divider {                                                      /* IDENTIQUE MOBILE & DESKTOP */
	width:                    calc( 100% - var(--espacement-large) );
	height:                   1px;
	margin:                   var(--espacement-moyen) 0 var(--espacement-moyen) var(--espacement-large); /* espace left (t:r:b:l) */
	padding:                  0;
	background-color:         var(--gris-trmdvsr-clair); 
}
.traum-divider-big {                                                  /* IDENTIQUE MOBILE & DESKTOP */
	width:                    calc( 100% - 5px );
	height:                   2px;
	margin:                   var(--espacement-moyen) 0 var(--espacement-moyen) 5px; /* espace 1 côté tres petit */
	padding:                  0;
	background-color:         var(--bleu-trmdvsr-pur); 
}

/* Shape pour background ============================================================= (GLOBAL) */
.traum-shape {                                                        /* IDENTIQUE MOBILE & DESKTOP \BLOC LOGIQUE */
	height:                   100%;
	margin:                   0;
	padding:                  0;
	border:                   none;
	background-color:         var(--blanc-trmdvsr);
	--cut-size:               var(--logo-tronksize-larg);
	clip-path:                polygon( 0% 0%, 100% 0%, 100% calc(100% - var(--cut-size)), calc(100% - var(--cut-size)) 100%, 0% 100% );
}

/* Boutons =========================================================================== (GLOBAL) */
.trmdvsr-button {                                                     /* BASE */
	display:                  inline-flex;
	justify-content:          center;
	align-items:              center;
	gap:                      calc( var(--espacement-court) / 1.5 );  /* espace entre le texte et le picto */
	width:                    100%;                                   /* MOBILE : Prend toute la largeur disponible */
	padding:                  0.75rem 1.25rem;                        /* ↕: 14px | ↔: 18px >> Standard */
	font-weight:              var(--graisse-h2);                      /* 600; Semi-gras Note :  taille typo 1.1 */
	color:                    var(--bleu-trmdvsr-clair);              /* iOS: #007aff */
	--cut-size:               var(--logo-tronksize-court);            /* ‼️ voir si on remet bouton tronqué sans ombre ou boutons ombré */
	cursor:                   pointer;
	outline:                  none;                                   /* Supprime le contour bleu au focus */
	filter: 									none;
	pointer-events: 					auto;
	opacity: 									1;
	border-radius:            0.5rem 0.5rem 0.75rem;                  /* (haut gauche) (haut droite & bas gauche) (bas droite) */
	background-color:         var(--blanc-pur);
	box-shadow:                                                       /* Ombres Style iOS */
		0 1px 2px rgba(0, 0, 0, 0.05),                                /* Ombre très légère et proche (pour la netteté) */
		0 4px 12px rgba(0, 0, 0, 0.08);                               /* Ombre plus diffuse et éloignée (pour la profondeur) */
	transition:               all 0.2s ease-out;
}
.trmdvsr-button:hover { 
	background-color:         var(--gris-trmdvsr-tres-clair); 
	box-shadow: 
		0 1px 3px rgba(0, 0, 0, 0.08),                                /* Légère modification de l'ombre */
		0 6px 16px rgba(0, 0, 0, 0.12);                               /* L'ombre suggère que l'élément "s'élève" */
	transform: translateY(-1px);                                      /* Légère élévation */
}
.trmdvsr-button:active { 
	background-color:         var(--gris-trmdvsr-clair);
	box-shadow: 
		0 0 1px rgba(0, 0, 0, 0.05),                                  /* Ombre très faible */
		0 1px 4px rgba(0, 0, 0, 0.08);                                /* L'ombre se rapproche */
	transform: translateY(1px);                                       /* L'élément "s'enfonce" */
}
.trmdvsr-button:disabled {
	opacity: 						0.4;
	cursor: 						not-allowed !important;
	filter: 						grayscale(1);
	pointer-events: 		none; 
	box-shadow: 				none !important;
	transform: 					none !important;
}
.trmdvsr-button.primary {
	font-weight:              var(--graisse-h3);
	color:                    var(--blanc-pur);
	background-color:         var(--bleu-trmdvsr-clair);              /* iOS: #007aff */
	box-shadow: 
		0 1px 2px rgba(0, 122, 255, 0.2),                             /* Ombre colorée */
		0 4px 12px rgba(0, 122, 255, 0.25);
}
.trmdvsr-button.primary:hover {
	background-color:         var(--bleu-trmdvsr-moyen);
	box-shadow: 
		0 1px 3px rgba(0, 122, 255, 0.3),
		0 6px 16px rgba(0, 122, 255, 0.35);
	transform:                translateY(-1px);
}
.trmdvsr-button.primary:active {
	background-color:         var(--bleu-trmdvsr-pur);
	box-shadow: 
		0 0 1px rgba(0, 122, 255, 0.15),
		0 1px 4px rgba(0, 122, 255, 0.2);
	transform:                translateY(1px);
}
.trmdvsr-button.primary:disabled {
	background-color: 	#e0e0e0 !important; 						/* Gris neutre */
	color: 							#9e9e9e !important;            	/* Texte gris */
	border-color: 			#bdbdbd !important;
}
.trmdvsr-button-picto {
	width:                  var(--taille-texte-btn);
	height:                 auto;
	stroke:                 currentColor;                             /* Hériter de la couleur du texte du parent */
	stroke-width:           var(--largeur-stroke);                    /* Passer d'une graisse type à une stroke-width */
	stroke-linecap:         round;
	stroke-linejoin:        round;
	fill:                   none;
	vertical-align:         middle;
}
..trmdvsr-button-picto.bleu {
	color: 								var(--bleu-trmdvsr-clair);
}
.trmdvsr-button:hover .trmdvsr-button-picto {
	animation:              info 0.4s linear 1;                       /* @keyframes duration | easing-function | delay | name */
}
.trmdvsr-button.primary.large { flex-grow: 2; } 																								/* Plus large pour l'action principale */

/* Architecture ====================================================================== (GLOBAL) */
html { width: 100%; height: auto; margin: 0px; padding: 0px; }																	/* IDENTIQUE MOBILE & DESKTOP */
/*--------------------------------------------------------------------------------------------- */
header.conteneur-lame.flex-trmdvsr-id {                               /* Mufasa: N'oublie pas le Mobile First */
	display:                  flex;
	flex-direction:           row;
	justify-content:          space-between;                            /* ↔ */
	align-items:              flex-end;                                 /* ↕ */
	position:                 relative;                                 /* La navigation reste toujours en haut */
	height:                   var(--hauteur-header);      				/* 5.9vw + 83.1px => atteindre 128px autour de 768px de largeur. */
	padding:                  var(--espacement-court);
}
.logo-trmdvsr {                                                       	/* HEADER & FOOTER */
	object-fit:               	contain;
	width:                    	auto;                                   /* base: 720px old : 50%; base{w:720px h:154px} */
	max-width:					66vw;
	height:                   	auto;
	max-height:               	90px;
	margin:                   	0;
	padding:                  	0;
}
.neutre {                                                             /* HEADER & FOOTER CONTENEUR PUSH INSTA */
	display:                  flex;          
	justify-content:          center;                                 /* Centre l'image à l'intérieur du lien */
	align-items:              center;
	text-decoration:          none;                                   /* Neutralisation de l'alignement et des espacements */
}      
.neutre img { display: block; }                                       													/* défensif, car on est sur un <a> */
.insta-desktop { display: none; }                                     													/* Cache le bouton Desktop du header(mobile first) => @Media Query */
.insta-mobile { display: block; }                                     													/* Affiche le bouton Mobile dans le Footer => @Media Query */
.insta-desktop .push-trmdvsr {                                        /* HEADER => TAILLE FLUIDE */
	width:                    clamp(96.5px, -5.9vw + 107.83px, 166px);/* Wmax: 166px, Wmin: 96.5px old : 14% base{w:166px h:172px} */
	max-height:               clamp(100px, -5.9vw + 111.33px, 172px);
}
.insta-mobile .push-trmdvsr {                                         /* FOOTER -> TAILLE FIXE */
	max-height:               150px;                                  /* base{w:166px h:172px} */
	padding:                  var(--espacement-court) 0;
}
/*--------------------------------------------------------------------------------------------- */
ul.accueil {
  display: flex;
  flex-direction: column; /* Pour les aligner verticalement */
  gap: clamp(1rem, 0.5rem + 2vw, 2rem); /* Ton espace fluide */
  list-style: none; /* Optionnel : enlève les puces */
}
li.accueil {
	list-style-type: circle;
	list-style-position: inside;
}
/*--------------------------------------------------------------------------------------------- */
footer.conteneur-lame.flex-trmdvsr-id {                               /* MOBILE FIRST => LOGO AFFICHÉ */
	display:                  flex;
	flex-direction:           column;
	justify-content:          flex-start;                               /* ↕ */
	align-items:              center;                                   /* ↔ */
	width: 						100%;
	max-width: 					var(--largeur-conteneur-max);
	height:                   auto;
	padding:                  var(--espacement-court) var(--logo-tronksize-larg) var(--espacement-moyen);
}
footer .trmdvsr-sstexte { text-align: right; color: var(--blanc-trmdvsr); } 										/* Alignement texte */

/* Menu Classique & Burger =========================================================== (GLOBAL) */
.menu-container {
	position: 									relative;
	display: 										inline-block;														/* On s'assure que le conteneur couvre bien la zone */
}
.menu-container .nav-globale {                                                        /* Mise en forme du menu déployé sur mobile */
	position:                 	fixed;
	top:                      	0;
	right:                    	0;
	display:                  	flex;                                 /* Mobile first => Affichage du bouton Burger */
	flex-direction:           	column;
	gap:                      	1rem;
	width:                    	70vw;
	max-width: 									20rem;
	height:                   	100vh;                                /* Masquer par défaut */
	padding-top:              	calc(var(--hauteur-header) + var(--espacement-large)); 
	padding-bottom:           	var(--espacement-large);
	opacity:                  	0;
	z-index:                  	300;
	overflow:                 	hidden;
	background-color:         	var(--gris-trmdvsr-tres-clair);
	border-left:								2px solid var(--bleu-trmdvsr-moyen);
	box-shadow: 
		0 1px 2px rgba(0, 0, 0, 0.05),                                /* Ombre très légère et proche (pour la netteté) */
		0 4px 12px rgba(0, 0, 0, 0.08),                               /* Ombre plus diffuse et éloignée (pour la profondeur) */
		0 10px 20px rgba(0, 0, 0, 0.2);
	/*transform:                	translateX(25%);*/
	transition:									transform 0.3s cubic-bezier(0.2, 0.8, 0.5, 1);
	cursor: 										pointer;
	pointer-events: 						none;
}
.menu-container .menu-toggle {                                                        /* MENU BURGER */
	display:                  	flex;                                   /* Mobile first => Affichage du bouton Burger */
	position:										relative;
	flex-direction:           	column;
	justify-content:          	center;
	align-items:              	center;
	gap:                      	4px;
	width:                    	var(--largeur-logo-bouton);
	height:                   	var(--largeur-logo-bouton);
	padding:                  	4px;
	background-color: 					unset;
	z-index:                  	400;
	cursor:                   	pointer;
	transition: 								transform 0.5s ease-in-out
}
.menu-container .nav-globale .nav-list.trmdvsr-texte-h4 {
	list-style:               	none;
	text-align:               	center;
	line-height: 								1.6;
	font-size:                	calc(var(--taille-sstexte) * 0.75);     
	letter-spacing:           	-0.0269rem;
}
.menu-container .nav-globale .nav-list li {
	width:                    	100%;
	padding:                  	1rem;
	background-color: 					unset;
	color: 											var(--bleu-trmdvsr-clair);
	transition: 								background-color 0.2s;
}
.menu-container .nav-globale .nav-list li:active {
	width:                    	100%;
	padding:                  	1rem;
	background-color: 					var(--bleu-trmdvsr-moyen);
	color: 											var(--blanc-trmdvsr);
}
.menu-container .nav-globale .nav-list li.active {
	background-color: 					var(--bleu-trmdvsr-pur);
	color: 											var(--blanc-trmdvsr);
}
.menu-container .nav-globale .nav-list li.active .trmdvsr-button-picto { 		fill: currentColor; }
.menu-container .nav-globale .nav-list li:not(.active) .trmdvsr-button-picto {fill: currentColor;	}
.menu-container .nav-globale .nav-list a {
	display: 										flex;
	flex-direction: 						column;
	align-items: 								center;
	text-decoration:          	none; 
	color: 											var(--bleu-trmdvsr-clair);
}
.menu-container .nav-globale .nav-list a:active { color: var(--blanc-trmdvsr); }
.menu-container .nav-globale .nav-list .active a {
	color:                    	var(--blanc-trmdvsr);
	position:                 	relative;
	pointer-events:							none;
	cursor: 										default;
}
.menu-container .nav-globale .nav-list .active a::after {
	content:                  	'';
	position:                 	absolute;
	bottom:                   	0;
	left:                     	2px;
	width:                    	4px;
	height:                   	100%;
	background-color:         	var(--blanc-trmdvsr);
	border-radius:            	2px;
}
.menu-container .nav-globale .nav-list .trmdvsr-button-picto {
	width:                    	calc( var(--largeur-logo-bouton) / 2) ;
	aspect-ratio:								1 / 1;
	stroke:                   	currentColor;
	stroke-width:             	.2;
	stroke-linecap:           	round;
	stroke-linejoin:          	round;
	fill:                     	currentColor;
}
.menu-icon {                                                          /* barre pour le menu burger */
	display:                  	block;
	width:                    	24px;                                   /* hauteur totale des 3 bandes x1.33 */
	height:                   	3px;
	border-radius:            	50px;
	background-color:         	var(--blanc-trmdvsr);
	transition: 								transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	 transform-origin: 					50% 50%;								/* L'origine est essentielle pour la rotation */
}
.menu-container.is-hovered .nav-globale {
	opacity: 										1;
	transform: 									translateX(0);
	pointer-events: 						auto;
}
.menu-container.is-hovered .menu-toggle .menu-icon:nth-child(1) { background-color: var(--bleu-trmdvsr-moyen); transform: translateY(7px) rotate(45deg); }
.menu-container.is-hovered .menu-toggle .menu-icon:nth-child(2) { background-color: var(--bleu-trmdvsr-moyen); opacity: 0; transform: scale(-50%); }						/* La ligne du milieu disparaît */
.menu-container.is-hovered .menu-toggle .menu-icon:nth-child(3) { background-color: var(--bleu-trmdvsr-moyen); transform: translateY(-7px) rotate(-45deg); }		/* Rotation de -45 degrés et translation vers le centre */
.menu-container.is-hovered .menu-toggle .menu-icon {
	background-color:         var(--bleu-trmdvsr-pur);
}

/* Lames contenus ============================================================== (MOBILE FIRST) */
.conteneur-lame {                                                     /* IDENTIQUE MOBILE & DESKTOP */
	width:                    var(--largeur-conteneur-max);
	height:                   100%;
	margin:                   0px;
	padding:                  var(--espacement-large) var(--espacement-master) var(--espacement-tres-large); /* ↑ | ↔ | ↓ (16|24|10) */
	transition:               all 0.5s ease-in-out;
	/*border:                   1px dotted purple;*/
}
.conteneur-lame.flex-into-row {                                       /* MOBILE => DESKTOP bascule en row */
	display:                  flex;
	flex-direction:           column;                                   /* Princi:↕|Transv:↔ => desktop:row */
	gap:                      0;
	padding:                  0;                                        /* surcharge pt:espMoy; plr:espLarg; pb:espCou; */
	/*border:                   1px dashed red; */                        /* POUR DEBUG */
}
.conteneur-lame.flex-col {                                            /* => COMMUN COL-FIRST/COL-MIDDLE/COL-LAST */
	display:                  flex;
	flex-direction:           column;
	width:                    100%;
	height:                   100%;
}
.conteneur-lame.flex-col.col-first,
.conteneur-lame.flex-col.col-middle,
.conteneur-lame.flex-col.col-last {                                   /* Mobile => toute largeur */
	padding:                  var(--espacement-large) var(--espacement-master) var(--espacement-tres-large);
}
/* Lames Hero ------------------------------------------------------------------ (MOBILE FIRST) */
.conteneur-lame.flex-into-row.trmdvsr-suprfld {                   /* Englobe le sélecteur pour ajouter btn action et positionner sur */
	position:                 absolute;
	bottom:                   -1.5rem;                                /* Déplacer le conteneur de 50px vers le bas pour le chevauchement */
	left:                     50%;
	z-index:                  3;
	
	transform:                translateX(-50%);                       /* Centrage parfait */
	width:                    min(90%, 45rem);
	height:                   auto;
	margin:                   0;
	padding:                  2px;
	border:                   2px solid var(--gris-trmdvsr-clair);
	border-radius:            0.5rem 0.5rem 0.75rem;                  /* (haut gauche) (haut droite & bas gauche) (bas droite) */
	background-color: 			var(--blanc-trmdvsr);
	box-shadow:                                                       /* Ombres Style iOS */
		0 1px 2px rgba(0, 0, 0, 0.05),                                  /* Ombre très légère et proche (pour la netteté) */
		0 4px 12px rgba(0, 0, 0, 0.08),                                 /* Ombre plus diffuse et éloignée (pour la profondeur) */
		0 10px 20px rgba(0, 0, 0, 0.2);                                 /* Ombre plus prononcée pour l'effet flottant */
}
.trmdvsr-suprfld .form-select {
	box-shadow:               none;
	border:                   none;
	transition:               none;
}
.trmdvsr-suprfld .form-select:focus {
	outline:                  none;
	border-color:             none;                                   /* var(--bleu-trmdvsr-clair); */
	box-shadow:               none;                                   /* 0 0 4px 2px rgba(var(--bleu-trmdvsr-clair-RGB), 0.4); */
}
.trmdvsr-suprfld .trmdvsr-button { box-shadow: none; }
.trmdvsr-suprfld .trmdvsr-button:hover { box-shadow: none; }
.trmdvsr-suprfld .trmdvsr-button:active { box-shadow: none; }

/* Input & Forms ===================================================================== (MODULE) */
.trmdvsr-input,
.trmdvsr-select { display: flex; position: relative; width: 100%; height: 100%; }    						/* <div> englobante ref pour icon enfant en position absolute */

/* RÈGLES - ADAPTATIVE @MEDIA ======================================================= (DESKTOP) */
@media (min-width: 60rem) {																																			/* Comportement à partir d'au moins 768px (a.k.a. pour desktop) */
	:root { --largeur-eval-item: calc(var(--largeur-conteneur-max) - (var(--espacement-large) * 2)); } /* Conteneur - les marges */
	.trmdvsr-button {																			/* BASE  */
		display:					inline-flex;
		justify-content:			center;
		align-items:				center;
		gap:						calc( var(--espacement-court) / 1.5 );						/* espace entre le texte et le picto */
		width:						auto;														/* vs MOBILE => Prend toute la largeur disponible */
		height:						var(--largeur-logo-bouton);
		padding:					0 1.25rem;													/* ↕: 14px | ↔: 18px >> Standard */
		font-weight:				var(--graisse-h2);											/* 600; Semi-gras Note :  taille typo 1.1 */
		color:						var(--bleu-trmdvsr-clair);									/* iOS: #007aff */
		--cut-size:					var(--logo-tronksize-court);								/* ‼️ voir si on remet bouton tronqué sans ombre ou boutons ombré */
		cursor:						pointer;
		outline:					none;														/* Supprime le contour bleu au focus */
		border-radius:				0.5rem 0.5rem 0.75rem;										/* (haut gauche) (haut droite & bas gauche) (bas droite) */
		background-color:			var(--blanc-pur);
		box-shadow:					0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.08);
		transition:					all 0.2s ease-out;
	}
	.insta-desktop	{ display: block; }																														/* Affiche le bouton Desktop du Header */
	.insta-mobile		{ display: none; }																														/* Cache le bouton Mobile du Footer */

	/* ------------------------------------------------------------------------------------------ */
	header.conteneur-lame.flex-trmdvsr-id {
		justify-content:	space-between;																														/* ↔ | mobile: flex-start */
		align-items:			flex-end;																																	/* ↕ | mobile: flex-start */
		padding:					var(--espacement-court) 0;																								/* ↕ ↔ */
	}
	footer.conteneur-lame.flex-trmdvsr-id {
		justify-content:	flex-start;																																/* ↕ | mobile: flex-start */
		align-items:			flex-end;																																	/* ↔ | mobile: center */
		width: 						100%;
		max-width: 				var(--largeur-conteneur-max);
	}
	/* ------------------------------------------------------------------------------------------ */
	
	.menu-container .menu-toggle { display: none; }																								/* Menu BURGER Masqué sur desktop */
	.menu-container .nav-globale {
		position: 								static;
		display: 									flex;
		flex-direction: 					row;
		/*right:									clamp(180px, 100px + 20vw, 240px);     */    										/* Logo + 20px */
		right: 										0;
		bottom: 									0;
		justify-content: 					center;
		align-items: 							flex-end;
		width:										initial;
		height:										var(--hauteur-header);
		padding:									0px;
		margin:										0px;
		opacity:									1;
		overflow:									visible;
		border: 									none;
		background-color:					transparent;
		box-shadow:								none;
		pointer-events: 					auto;
		top:                      unset;
		transform:                	translateX(0) !important;
		transition:									none !important;
	}
	.menu-container .nav-globale .nav-list.trmdvsr-texte-h4 {padding: 0; margin: 0;}
	.menu-container .nav-globale .nav-list {
		display: 									flex;
		flex-direction: 					row;
		align-items: 							flex-end;
		gap: 											2rem;
		list-style: 							none;
		margin: 									0;
		padding:									0;
		background-color:					none;
		border:										none;
	}
	.menu-container .nav-globale .nav-list li {
		width: 										auto;
		padding:									0;
		background-color:					unset;
		border:										none;
	}
	.menu-container .nav-globale .nav-list li:hover,
	.menu-container .nav-globale .nav-list li:active,
	.menu-container .nav-globale .nav-list li.active {
		background-color: 				transparent;
		color: 										var(--bleu-trmdvsr-moyen);
		padding: 0;
		margin: 0;
	}
	.menu-container .nav-globale .nav-list li.active .trmdvsr-button-picto { 		fill: currentColor; }
	.menu-container .nav-globale .nav-list li:not(.active) .trmdvsr-button-picto {fill: currentColor;	}
	.menu-container .nav-globale .nav-list a {}
	.menu-container .nav-globale .nav-list a:hover,
	.menu-container .nav-globale .nav-list a:active { 
		color: var(--bleu-trmdvsr-moyen); 
		padding: 0;
		margin: 0;
	}
	.menu-container .nav-globale .nav-list .active a { color: var(--blanc-trmdvsr); }
	.menu-container .nav-globale .nav-list .active a::after {																/* Bande sous l'item menu actif */
		bottom:						-5px;
		left:							0;
		width:						100%;
		height:						2px;
		background-color:			var(--blanc-trmdvsr);
		
	}
	.menu-container.is-hovered { position: relative; }
	.menu-container.is-hovered .nav-globale { 
		transform: 								none !important;
		opacity: 									1 !important;
		transition: 							none !important;
		position: 								static;
		transform:                	translateX(0) !important;
	}
	/* ------------------------------------------------------------------------------------------ */
	.conteneur-lame.flex-into-row.button-multi,
	.conteneur-lame.flex-into-row { 
		flex-direction:				row; 
		vertical-align:				center;
		justify-content:			space-between;
		justify-items:				stretch;
		align-items:					stretch;
	}
	/* ------------------------------------------------------------------------------------------ */
	.conteneur-lame.flex-col.col-first { 
		padding-top:					var(--espacement-large);
		padding-right:				var(--espacement-moyen-demi);
		padding-left:					var(--espacement-master); 
		padding-bottom:				var(--espacement-tres-large); 
	}
	.conteneur-lame.flex-col.col-middle {
		padding:							var(--espacement-large) var(--espacement-moyen-demi) var(--espacement-tres-large);
	}
	.conteneur-lame.flex-col.col-last {
		padding-top:					var(--espacement-large);
		padding-right:				var(--espacement-master);
		padding-left:					var(--espacement-moyen-demi); 
		padding-bottom:				var(--espacement-tres-large);
	}
	.conteneur-lame.flex-into-row.trmdvsr-suprfld { /* ----------------------------------- Hero */
		flex-direction:				row;
	}
}

/* ANIMATIONS CSS ==================================================================== (GLOBAL) */
@keyframes spin {
	to			{ transform: rotate(360deg); }
}
@keyframes loading {																			/* ex gelatine */
	from, to	{ transform: scale(1, 1);       }
	25%			{ transform: scale(0.9, 1.1);   }
	50%			{ transform: scale(1.1, 0.9);   }
	75%			{ transform: scale(0.95, 1.05); }
}
@keyframes info {																				/* ex hithere */
	30%			{ transform:                scale(1.2); }
	40%, 60%	{ transform: rotate(-20deg) scale(1.2); }
	50%			{ transform: rotate(20deg)  scale(1.2); }
	70%			{ transform: rotate(0deg)   scale(1.2); }
	100%		{ transform:                scale(1);   }
}
@keyframes wobble {
	0%			{ transform: translateX(0%);                  }
	15%			{ transform: translateX(-25%) rotate(-5deg);  }
	30%			{ transform: translateX(20%)  rotate(3deg);   }
	45%			{ transform: translateX(-15%) rotate(-3deg);  }
	60%			{ transform: translateX(10%)  rotate(2deg);   }
	75%			{ transform: translateX(-5%)  rotate(-1deg);  }
	100%		{ transform: translateX(0%);                  }
}
@keyframes shake {
	10%, 90% 			{ transform: translate3d(-1px, 0, 0); }
	20%, 80% 			{ transform: translate3d(2px, 0, 0); }
	30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
	40%, 60% 			{ transform: translate3d(4px, 0, 0); }
}

/* La bulle de chargement */
.typing-indicator-wrapper {
	position:						relative;
	display: 						flex;
	flex-direction: 		column;
	align-items: 				flex-start;
	margin-bottom: 			15px;
}

/* Ta bulle (déjà configurée) */
.typing-indicator {
	display: 						inline-flex;
	align-items: 				center;
	gap: 								10px;
	padding: 						12px 16px;
	background: 				#f1f3f5;
	border-radius: 			18px 18px 18px 5px;
	margin-bottom: 			5px;
}

/* Le texte spécifiquement */
.typing-text {
	display: 						inline-block;
	font-weight: 				var(--graisse-texte);
}

/* Ciblage précis des points dans leur nouveau conteneur .dots */
.typing-indicator .dots {
	position:						absolute;
	left:								30px;
	bottom:							-8px;
	display: 						inline-block;
	--s: 								45px;
	width: 							var(--s);
	aspect-ratio: 			2;
	margin-left: 				8px;
	--_g: 							var(--bleu-trmdvsr-pur) 90%, #0000;
}

/* On décale l'animation pour chaque point pour l'effet "vague" 
.typing-indicator .dots span:nth-child(1) { animation-delay: 0.2s; }
.typing-indicator .dots span:nth-child(2) { animation-delay: 0.4s; }
.typing-indicator .dots span:nth-child(3) { animation-delay: 0.6s; }
*/
/* --- ANIMATION 1 : Respiration (Simple clignotement) --- */
.dots.mode-breath {
	background: 
		radial-gradient(circle closest-side, var(--_g)) 0 50%,
		radial-gradient(circle closest-side, var(--_g)) 50% 50%,
		radial-gradient(circle closest-side, var(--_g)) 100% 50%;
	background-size: 			calc(var(--s)/3) 50%;
	background-repeat: 		no-repeat;
	animation: 						breath 1.8s infinite ease-in-out;
}

/* --- ANIMATION 2 : Calcul (Ajustement pour éviter que les cercles se rentrent dedans) --- */
.dots.mode-calcul {
	background: 
		radial-gradient(farthest-side at bottom, var(--_g)) 0    calc(50% - var(--s)/12),
		radial-gradient(farthest-side at top   , var(--_g)) 0    calc(50% + var(--s)/12),
		radial-gradient(farthest-side at bottom, var(--_g)) 50%  calc(50% - var(--s)/12),
		radial-gradient(farthest-side at top   , var(--_g)) 50%  calc(50% + var(--s)/12),
		radial-gradient(farthest-side at bottom, var(--_g)) 100% calc(50% - var(--s)/12),
		radial-gradient(farthest-side at top   , var(--_g)) 100% calc(50% + var(--s)/12);
	background-size: 			25% 25%; /* Légère réduction de la taille des points pour laisser de l'air */
	background-repeat: 		no-repeat;
	animation: 						l13 1.2s infinite linear;
}

/* Animation L5 : Trois points via box-shadow */
.dots.mode-robot {
	position: 						absolute;
	left: 								45px;
	bottom: 							0;
	width: 								8px !important;
	aspect-ratio: 				1;
	border-radius: 				50%;
	--c: 									var(--bleu-trmdvsr-pur);
	--c-off: 							rgba(32, 60, 133, 0.15); 
	background: 					var(--c);
	display: 							block;
	animation: 						l5 1.5s infinite linear alternate;
}


@keyframes l5 {
	0%   { box-shadow: 12px 0 var(--c), -12px 0 var(--c-off); background: var(--c)     }
	33%  { box-shadow: 12px 0 var(--c), -12px 0 var(--c-off); background: var(--c-off) }
	66%  { box-shadow: 12px 0 var(--c-off), -12px 0 var(--c); background: var(--c-off) }
	100% { box-shadow: 12px 0 var(--c-off), -12px 0 var(--c); background: var(--c)     }
}

@keyframes breath {
	0%, 100% { opacity: 0.3; transform: scale(0.9); }
	50% { opacity: 1; transform: scale(1); }
}

@keyframes l13 {
	16.67% {background-position:0 0,0 100%,50% calc(50% - var(--s)/8),50% calc(50% + var(--s)/16),100% calc(50% - var(--s)/16),100% calc(50% + var(--s)/16)}
	33.33% {background-position:0 0,0 100%,50% 0,50% 100%,100% calc(50% - var(--s)/16),100% calc(50% + var(--s)/16)}
	50%    {background-position:0 0,0 100%,50% 0,50% 100%,100% 0,100% 100%}
	66.67% {background-position:0 calc(50% - var(--s)/16),0 calc(50% + var(--s)/16),50% 0,50% 100%,100% 0,100% 100%}
	83.33% {background-position:0 calc(50% - var(--s)/16),0 calc(50% + var(--s)/16),50% calc(50% - var(--s)/16),50% calc(50% + var(--s)/16),100% 0,100% 100%}
}

@keyframes l20 {
	0%       {transform: scale(var(--_s,1)) translate(0)    rotate(0)}
	25%      {transform: scale(var(--_s,1)) translate(-50%) rotate(0)}
	50%      {transform: scale(var(--_s,1)) translate(-50%) rotate(1turn)}
	75%,100% {transform: scale(var(--_s,1)) translate(0)    rotate(1turn)}
}
/** ******************************************************************************************* //
 * @document 'Fin du fichier. with care.'
 * @author 'trmdvsr'
 * @version 25.10.09 (23:16)
// ******************************************************************************************** */