/* ============================================================
   Page Prendre rendez-vous — Les Vétos Parisiens

   Le parcours de réservation (#rdv-book, stylé par
   css/rendezvous-booking.css) vit dans la section « Nos adresses » :
   cette feuille habille le hero compact, les fiches clinique de
   l'étape 1, puis les blocs d'information (horaires, urgences, avis,
   FAQ). Contenu piloté par cms/pages/rendezvous.json.
   ============================================================ */

/* ---------- Hero compact : la réservation arrive vite ---------- */
/* Sur cette page, le hero n'est qu'un sas : il tient en un écran et demi de
   moins que sur les autres pages. Hauteur mesurée : 443 px → 316 px à 1440,
   528 px → 424 px à 390. */
.page--rendezvous .page-hero {
	padding-block: var(--s-16);
}
/* Le hero n'est plus qu'un sas : la section « Choisissez votre clinique »
   doit tenir dans le premier écran. Le chapeau et les deux boutons font
   doublon avec la carte de réservation juste en dessous. */
.page--rendezvous .page-hero__lead,
.page--rendezvous .page-hero__actions {
	display: none;
}
.page--rendezvous .page-hero__title {
	font-size: clamp(28px, 2.8vw, 40px);
	line-height: 1.1;
	margin-top: var(--s-4);
	max-width: 22em;
}
.page--rendezvous .page-hero__lead {
	margin-top: var(--s-8);
	font-size: clamp(15px, 1.05vw, 17px);
}

/* ---------- Actions du hero ---------- */
/* Retirées : la carte de réservation suit immédiatement, ses deux fiches
   clinique portent déjà l'appel à réserver. Le lien « Urgence ? » du bandeau
   de preuves garde l'accès au téléphone. */
.page--rendezvous .page-hero__actions {
	display: none;
}
/* Bouton plein forêt : blanc sur sauge ne tiendrait pas le contraste (2,7:1),
   blanc sur forêt vaut 11,7:1. */
.page--rendezvous .btn--forest {
	background-color: var(--forest);
	color: var(--ivory);
	border-color: var(--forest);
	box-shadow: 0 4px 16px rgba(31, 58, 45, 0.24);
}
.page--rendezvous .btn--forest:hover {
	background-color: color-mix(in srgb, var(--forest) 86%, var(--sage));
	border-color: color-mix(in srgb, var(--forest) 86%, var(--sage));
	color: var(--ivory);
	transform: translateY(-1px);
}
.page--rendezvous .btn--forest:active {
	transform: translateY(0);
}
/* Le box-shadow décoratif ci-dessus (même spécificité, feuille plus tardive)
   écrasait le liseré de focus de styles.css : sur un bouton forêt, l'anneau
   forêt valait 1:1. Double anneau explicite : blanc à l'extérieur. */
.page--rendezvous .btn--forest:focus-visible {
	outline: 2px solid var(--forest);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--white);
}

/* ---------- Bandeau de preuves du hero (fond sauge) ---------- */
.rdv-facts {
	margin-top: var(--s-12);
	padding-top: var(--s-8);
	gap: var(--s-4) var(--s-20);
	border-top-color: var(--hairline-light);
	color: var(--on-dark-muted);
}
.rdv-facts .hero__facts-stars {
	color: var(--white);
}
.rdv-facts a {
	color: var(--white);
	text-decoration: underline;
	text-decoration-color: var(--hairline-light);
	text-underline-offset: 4px;
}
.rdv-facts a:hover {
	text-decoration-color: var(--white);
}
.rdv-facts__rating {
	display: inline-flex;
	align-items: center;
	gap: var(--s-8);
	min-height: 44px;
	color: var(--white);
	text-decoration: none;
}
.rdv-facts__rating:hover {
	text-decoration: underline;
	text-decoration-color: var(--white);
	text-underline-offset: 4px;
}

/* ---------- Bandes d'information ---------- */
.rdv-info {
	padding: var(--s-64) var(--gutter) var(--s-96);
	background-color: var(--surface-muted);
}
.rdv-info--book {
	padding-top: var(--s-24);
}
.rdv-info--faq {
	background-color: var(--surface);
}
.rdv-info__lead {
	margin-top: var(--s-12);
	max-width: 62ch;
	color: var(--green-muted);
}
/* Le parcours suit directement le chapeau de la section. */
.rdv-info--book .rdv-book {
	margin-top: var(--s-16);
}

/* ============================================================
   Étape 1 · Les deux fiches clinique (dans la coque du parcours)
   ============================================================ */
.rdv-clinics {
	display: grid;
	/* Deux fiches côte à côte seulement si chacune garde un corps de texte
	   confortable : sous ~936 px de fenêtre, une fiche pleine largeur se lit
	   mieux que deux colonnes de 340 px (vignette 168 px → texte écrasé). */
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
	gap: var(--s-20);
	min-width: 0;
}
.rdv-clinic {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr) auto;
	gap: var(--s-16) var(--s-24);
	align-items: start;
	min-width: 0;
	padding: var(--s-24);
	background-color: var(--ivory);
	border: 1px solid var(--rdv-hairline-strong, rgba(31, 58, 45, 0.58));
	border-radius: 14px;
	cursor: pointer;
	transition:
		border-color 220ms var(--ease-out),
		box-shadow 220ms var(--ease-out),
		transform 220ms var(--ease-out);
}
.rdv-clinic:hover {
	border-color: var(--forest);
	box-shadow: var(--shadow-soft);
	transform: translateY(-1px);
}
/* Clinique déjà choisie (retour à l'étape 1) : double filet, lisible en gris. */
.rdv-clinic.is-active {
	border: 2px solid var(--forest);
	padding: calc(var(--s-24) - 1px);
	background-color: var(--surface-muted);
	box-shadow: var(--shadow-soft);
}
.rdv-clinic.is-active:hover {
	transform: none;
}
.rdv-clinic__body {
	display: grid;
	gap: var(--s-10);
	align-content: start;
	min-width: 0;
}
.rdv-clinic__name {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(18px, 1.5vw, 21px);
	line-height: 1.2;
	font-weight: 500;
	letter-spacing: -0.01em;
	color: var(--text-heading);
	text-wrap: balance;
}
.rdv-clinic__addr {
	margin: 0;
	font-style: normal;
	font-size: 15px;
	line-height: 1.45;
	color: var(--forest);
}
.rdv-clinic__access {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--green-muted);
}
.rdv-clinic__links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-4) var(--s-10);
	margin: 0;
	font-size: 14px;
	color: var(--green-muted);
}
.rdv-clinic__tel,
.rdv-clinic__map {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	font-weight: 600;
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--green-deep);
	text-underline-offset: 4px;
}
.rdv-clinic__tel:hover,
.rdv-clinic__map:hover {
	text-decoration-color: var(--forest);
}
/* Bouton plein (forêt) : le bouton ivoire du site serait invisible sur crème. */
/* Le bouton occupe toute la largeur de la fiche : c'est l'action de l'écran. */
.rdv-clinic__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	grid-column: 1 / -1;
	justify-self: stretch;
	min-height: 48px;
	-webkit-appearance: none;
	appearance: none;
	padding: calc(var(--s-12) + var(--cap-shift)) var(--s-24)
		calc(var(--s-12) - var(--cap-shift));
	border: 1px solid var(--forest);
	border-radius: 999px;
	background-color: var(--forest);
	color: var(--ivory);
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.01em;
	line-height: 1.2;
	cursor: pointer;
	transition:
		background-color 220ms var(--ease-out),
		box-shadow 220ms var(--ease-out),
		transform 220ms var(--ease-out);
}
.rdv-clinic__cta::after {
	content: "→";
	margin-left: 0.45em;
	transition: transform 220ms var(--ease-out);
}
.rdv-clinic:hover .rdv-clinic__cta,
.rdv-clinic__cta:hover {
	background-color: color-mix(in srgb, var(--forest) 86%, var(--sage));
}
.rdv-clinic:hover .rdv-clinic__cta::after {
	transform: translateX(3px);
}
.rdv-clinic__cta:focus-visible {
	box-shadow: 0 0 0 2px var(--white);
}
.rdv-clinic__cta[aria-pressed="true"]::after {
	content: "✓";
}
.rdv-book__clinics {
	display: grid;
	gap: var(--s-16);
	min-width: 0;
}
.rdv-book__clinics-hint {
	font-size: 14px;
}

/* ---------- Liens internes contextuels ---------- */
.rdv-more {
	margin: var(--s-24) 0 0;
	color: var(--green-muted);
}
.rdv-more a {
	font-weight: 600;
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--green-deep);
	text-underline-offset: 4px;
}
.rdv-more a:hover {
	text-decoration-color: var(--forest);
}

/* ---------- Urgences ---------- */
.rdv-urgent {
	margin-top: var(--s-32);
	padding: var(--s-32);
	/* Sauge éclaircie : le forêt sur #83a692 ne tient que 4,6:1, sous la marge
	   du grain de la charte ; la version éclaircie passe 5,6:1. */
	background-color: color-mix(in srgb, var(--sage-panel) 80%, var(--ivory));
	border-radius: 12px;
	color: var(--forest);
}
.rdv-urgent__title {
	margin: var(--s-8) 0 0;
	font-size: clamp(22px, 2.2vw, 30px);
	line-height: 1.15;
	font-weight: 600;
	color: var(--forest);
}
.rdv-urgent__text {
	margin: var(--s-8) 0 0;
	max-width: 62ch;
}
.rdv-urgent__phones {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--s-8) var(--s-16);
	margin: var(--s-16) 0 0;
	font-weight: 600;
}
.rdv-urgent__phones a {
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--forest);
	text-underline-offset: 4px;
}

/* ---------- Avis Google ---------- */
.rdv-reviews {
	background-color: var(--surface);
}
.rdv-reviews__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-24);
	margin: var(--s-40) 0 0;
	padding: 0;
	list-style: none;
}
.rdv-review {
	display: flex;
	flex-direction: column;
	gap: var(--s-12);
	padding: var(--s-32);
	background-color: var(--ivory);
	border: 1px solid var(--hairline);
	border-radius: 12px;
	box-shadow: var(--shadow-soft);
}
.rdv-review__stars {
	margin: 0;
	font-size: 16px;
	letter-spacing: 0.08em;
	color: var(--forest);
}
.rdv-review__quote {
	margin: 0;
}
.rdv-review__quote p {
	margin: 0;
	color: var(--text-body);
}
.rdv-review__author {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-8);
	margin: auto 0 0;
	padding-top: var(--s-8);
	font-size: 14px;
	font-weight: 600;
	color: var(--green-muted);
}
.rdv-reviews__more {
	margin: var(--s-32) 0 0;
}
.rdv-reviews__more a {
	font-weight: 600;
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--green-deep);
	text-underline-offset: 4px;
}

/* ---------- FAQ ---------- */
.rdv-faq {
	margin-top: var(--s-40);
	max-width: 80ch;
	border-top: 1px solid var(--hairline);
}
.rdv-faq__item {
	border-bottom: 1px solid var(--hairline);
}
.rdv-faq__q {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--s-16);
	padding: var(--s-20) 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--text-heading);
	cursor: pointer;
	list-style: none;
}
.rdv-faq__q::-webkit-details-marker {
	display: none;
}
.rdv-faq__q::after {
	content: "+";
	flex: 0 0 auto;
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
	color: var(--forest);
	transition: transform 220ms var(--ease-out);
}
.rdv-faq__item[open] .rdv-faq__q::after {
	transform: rotate(45deg);
}
.rdv-faq__q:hover {
	text-decoration: underline;
	text-decoration-color: var(--hairline);
	text-underline-offset: 4px;
}
.rdv-faq__a {
	padding: 0 0 var(--s-20);
	max-width: 70ch;
	color: var(--green-muted);
}
.rdv-faq__a p {
	margin: 0;
}
.rdv-faq__a-link {
	margin: var(--s-12) 0 0;
}
.rdv-faq__a-link a {
	display: inline-flex;
	align-items: center;
	font-weight: 600;
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--green-deep);
	text-underline-offset: 4px;
}
.rdv-faq__more {
	margin-top: var(--s-32);
	color: var(--green-muted);
}
.rdv-faq__more a {
	font-weight: 600;
	color: var(--forest);
	text-decoration: underline;
	text-decoration-color: var(--green-deep);
	text-underline-offset: 4px;
}

/* ---------- Cibles tactiles des liens isolés (WCAG 2.5.8, 24 px mini) ---------- */
.rdv-more a,
.rdv-reviews__more a,
.rdv-faq__more a,
.rdv-faq__a-link a,
.rdv-facts a,
.rdv-urgent__phones a {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}
.rdv-facts__rating {
	min-height: 44px;
}

/* ============================================================
   Bande de rappel : dernier appel à réserver, en bas de page.
   Aplat forêt (blanc à 11,7:1) plutôt que le sauge de la charte,
   qui ne donne que 2,7:1 sous du texte blanc.
   ============================================================ */
.rdv-finale {
	padding: clamp(var(--s-64), 9vh, var(--s-96)) var(--gutter);
	background-color: var(--forest);
	color: var(--white);
	text-align: center;
}
.rdv-finale .label {
	color: var(--on-dark-muted);
}
.rdv-finale__title {
	max-width: 18ch;
	margin: var(--s-16) auto 0;
	font-family: var(--font-display);
	font-size: clamp(30px, 3.6vw, 48px);
	line-height: 1.1;
	letter-spacing: -0.035em;
	font-weight: 500;
	color: var(--white);
	text-wrap: balance;
}
.rdv-finale__lead {
	max-width: 46ch;
	margin: var(--s-16) auto 0;
	font-size: clamp(16px, 1.2vw, 18px);
	line-height: 1.55;
	color: var(--on-dark-muted);
}
.rdv-finale__actions {
	display: flex;
	justify-content: center;
	margin-top: var(--s-32);
}
.rdv-finale__phones {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: var(--s-8) var(--s-16);
	margin: var(--s-32) 0 0;
	font-size: 14px;
	color: var(--on-dark-subtle);
}
.rdv-finale__phones a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	font-weight: 700;
	color: var(--white);
	text-decoration: underline;
	text-decoration-color: var(--hairline-light);
	text-underline-offset: 4px;
}
.rdv-finale__phones a:hover {
	text-decoration-color: var(--white);
}

/* ---------- Bouton flottant « Réserver » (mobile et tablette) ---------- */
.rdv-fab {
	position: fixed;
	left: var(--gutter);
	bottom: 16px;
	z-index: 60;
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 22px;
	border-radius: 999px;
	background-color: var(--forest);
	color: var(--white);
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	box-shadow: var(--shadow-lift);
	transition:
		transform 220ms var(--ease-out),
		background-color 220ms var(--ease-out);
}
.rdv-fab[hidden] {
	display: none;
}
.rdv-fab:hover {
	background-color: var(--green-muted);
	transform: translateY(-2px);
}
.rdv-fab:focus-visible {
	/* Double anneau : le blanc disparaît sur les sections crème, le forêt
	   disparaîtrait sur les sections foncées. L'un des deux passe toujours. */
	outline: 2px solid var(--forest);
	outline-offset: 2px;
	box-shadow:
		0 0 0 2px var(--white),
		var(--shadow-lift);
}
@media (min-width: 900px) {
	.rdv-fab {
		display: none;
	}
}

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.rdv-reviews__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 720px) {
	.rdv-info {
		padding-block: var(--s-48);
	}
	.rdv-info--book {
		padding-top: var(--s-16);
	}
	.rdv-info--book .rdv-book {
		margin-top: var(--s-12);
	}
	.rdv-more {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	.rdv-more a {
		min-height: 44px;
	}
	.rdv-more [aria-hidden="true"] {
		display: none;
	}
	.rdv-facts a,
	.rdv-faq__a-link a,
	.rdv-urgent__phones a {
		min-height: 32px;
	}
	.rdv-urgent {
		padding: var(--s-24);
	}
	.rdv-reviews__list {
		grid-template-columns: minmax(0, 1fr);
	}
	.rdv-review {
		padding: var(--s-24);
	}
}
/* Liens de fiche : empilés tant que la carte est trop étroite pour les tenir
   sur une ligne — c'est le cas des deux colonnes entre ~936 et ~1160 px. */
@media (max-width: 1160px) {
	.rdv-clinic__links {
		flex-direction: column;
		align-items: flex-start;
	}
	.rdv-clinic__links [aria-hidden="true"] {
		display: none;
	}
}
/* Fiches clinique compactes : vignette réduite, bouton pleine largeur, les
   deux cliniques restent visibles sur un écran de téléphone. */
@media (max-width: 560px) {
	/* Les deux fiches clinique doivent tenir dans l'écran d'un téléphone :
	   padding et interlignes resserrés, et le rappel tarifaire (déjà porté
	   par chaque carte de motif à l'étape 2) laisse la place. */
	.rdv-book__clinics-hint {
		display: none;
	}
	.rdv-clinic {
		gap: var(--s-8) var(--s-16);
		padding: var(--s-12);
	}
	.rdv-clinic.is-active {
		padding: calc(var(--s-12) - 1px);
	}
	.rdv-clinic__cta {
		min-height: 44px;
	}
	.rdv-clinic__tel,
	.rdv-clinic__map {
		min-height: 32px;
	}
}
/* Le bouton flottant recouvrirait la ligne légale du pied de page. */
@media (max-width: 899px) {
	.page--rendezvous .site-footer__legal {
		padding-bottom: 76px;
	}
}
@media (max-width: 720px) {
	.rdv-finale__actions .btn {
		width: 100%;
	}
	.page--rendezvous .page-hero__actions .btn {
		flex: 1 1 auto;
	}
}
@media (prefers-reduced-motion: reduce) {
	.rdv-fab,
	.rdv-clinic,
	.rdv-clinic__cta,
	.rdv-clinic__cta::after {
		transition: none;
	}
	.rdv-fab:hover,
	.rdv-clinic:hover,
	.rdv-clinic:hover .rdv-clinic__cta::after {
		transform: none;
	}
}

/* ============================================================
   Surfaces foncées de cette page — le sauge de la charte ne porte pas
   le blanc (2,68:1). Ici --green-deep (voile du header, header collant,
   hero, pied de page) prend le forêt de la charte : blanc sur forêt vaut
   12,6:1, blanc atténué 11:1. Un jeton, aucun composant réécrit.
   --header-veil est redéclaré : sa valeur est calculée sur :root, où
   --green-deep garde le sauge.
   ============================================================ */
.page--rendezvous {
	--green-deep: var(--forest);
	--header-veil: color-mix(in srgb, var(--forest) 96%, transparent);
	/* Le lanceur et l'en-tête du chatbot suivent le vert de la page :
	   ivoire sur forêt (12,6:1) au lieu d'ivoire sur sauge (2,7:1). */
	--chatbot-accent: var(--forest);
}

/* Mention du chatbot : le sauge littéral de chatbot.css tombe à 2,5:1 sur
   crème, il n'est pas corrigeable par le jeton ci-dessus. */
.page--rendezvous .chatbot-disclaimer-text {
	color: var(--green-muted);
}

/* ---------- Hero ---------- */
/* Une seule porte d'entrée : le parcours de réservation juste en dessous.
   Le hero reste une colonne de lecture calée à gauche ; plus de second bloc
   qui répéterait le choix de clinique. */
.rdv-hero {
	display: grid;
	gap: var(--s-32);
	align-items: start;
	min-width: 0;
}
.rdv-hero__main {
	min-width: 0;
	max-width: 54rem;
}
@media (min-width: 1000px) {
	.page--rendezvous .page-hero {
		padding-block: var(--s-24);
	}
}

/* ---------- Pied de page entre 861 et 1024 px ----------
   styles.css ne passe le pied de page en deux colonnes qu'à 860 px : entre
   861 et ~1010 px, la quatrième colonne (Suivez-nous) dépasse et se fait
   rogner par overflow-x: clip. Correctif local ; à promouvoir dans
   styles.css (même seuil que le reste de la grille du pied de page). */
@media (min-width: 861px) and (max-width: 1024px) {
	.page--rendezvous .site-footer__inner {
		grid-template-columns: 1fr 1fr;
	}
	.page--rendezvous .site-footer__brand,
	.page--rendezvous .site-footer__houses {
		grid-column: 1 / -1;
	}
	.page--rendezvous .site-footer__brand {
		max-width: none;
	}
}

/* ---------- Chatbot : effacé pendant la réservation sur téléphone ---------- */
/* Le lanceur fixe recouvrait le bas du formulaire (dernier champ, bouton
   « Confirmer ») sur les écrans étroits. Le script de la page pose
   .rdv-chat-hidden tant que le parcours est à l'écran. */
@media (max-width: 899px) {
	.rdv-chat-hidden .chatbot-launcher {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	.rdv-chat-hidden .chatbot-panel {
		display: none;
	}
}

/* ---------- 20 · Cibles tactiles des liens d'action ---------- */
/* Les liens texte inline (téléphone, itinéraire, renvois) mesuraient 26 à
   32 px de haut : au-dessus du minimum WCAG 2.5.8 (24 px), mais sous la
   cible confortable de 44 px. On ne touche qu'aux liens d'action, pas aux
   liens noyés dans une phrase. */
.rdv-clinic__tel,
.rdv-clinic__map,
.rdv-urgent__phones a,
.rdv-facts a,
.rdv-more a,
.rdv-reviews__more a,
.rdv-faq__more a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}
.rdv-more a,
.rdv-reviews__more a,
.rdv-faq__more a {
	padding-block: 2px;
}

.rdv-finale__phones a,
.rdv-faq__a-link a,
.rdv-faq__a a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* Placeholder du champ du chatbot : 2,54:1 avec --sage-deep sur crème. */
.page--rendezvous .chatbot-panel__input::placeholder {
	color: var(--green-muted);
	opacity: 1;
}

/* ---------- Hero et bandeau de preuves sur téléphone ---------- */
@media (max-width: 720px) {
	.page--rendezvous .page-hero {
		padding-block: var(--s-16);
	}
	.page--rendezvous .rdv-facts {
		margin-top: var(--s-16);
		padding-top: var(--s-12);
		gap: var(--s-4) var(--s-16);
		font-size: 12.5px;
	}
	/* Le bandeau de preuves ne garde que la note et les horaires : les deux
	   adresses sont juste en dessous, l'urgence a son bouton au-dessus. */
	.page--rendezvous .rdv-facts li:nth-child(3),
	.page--rendezvous .rdv-facts li:nth-child(4) {
		display: none;
	}
}

/* Sur téléphone, le chapeau de la carte passe à la trappe : le titre et les
   deux fiches suffisent à comprendre, et la section doit tenir dans le
   premier écran. */
@media (max-width: 560px) {
	.page--rendezvous .rdv-book__intro-lead {
		display: none;
	}
	.page--rendezvous .rdv-book__intro-title {
		font-size: 24px;
	}
}

/* Premier écran sur téléphone : tout ce qui suit est du confort, on le serre. */
@media (max-width: 560px) {
	/* Le bandeau de preuves tient sur une ligne (note + horaires). */
	.page--rendezvous .rdv-facts {
		gap: var(--s-4) var(--s-12);
	}
	/* Le lien « Itinéraire » ne tient pas sur la même ligne que le téléphone :
	   l'adresse reste affichée, l'appel reste accessible. */
	.page--rendezvous .rdv-clinic__map {
		display: none;
	}
	.page--rendezvous .rdv-clinic__links {
		flex-wrap: nowrap;
		font-size: 13px;
	}
	.page--rendezvous .rdv-clinic__addr {
		font-size: 13px;
	}
	/* Le label « Nos adresses » est redondant avec le titre juste en dessous. */
	.page--rendezvous .rdv-book__intro .label {
		display: none;
	}
	/* Le bandeau de preuves ne garde que la note Google : les horaires sont
	   dans le pied de page et dans la FAQ, l'urgence a son lien. */
	.page--rendezvous .rdv-facts li:nth-child(2) {
		display: none;
	}
}