/*
 * Design system — Pôle Médical Vaise
 * Direction « 1c Modernist chaleureux »
 *
 * Sommaire
 *   1. Jetons
 *   2. Base et accessibilité
 *   3. Boutons
 *   4. Badges et pastilles
 *   5. Cartes
 *   6. Surfaces
 *   7. Listes et encarts
 *   8. Pictogrammes
 *   9. Header
 *  10. Footer
 *  11. Barre d'accès mobile
 *  12. Sections de page
 *  13. Hero d'accueil
 *  14. Placeholders d'image
 *  15. Sections courantes
 *  16. Accès rapide
 *  16 bis. Lien externe hors carte
 *  17. Pôle et MSP
 *  18. Repères dans le bâtiment
 *  19. Bloc professionnels
 *  20. Bloc MSP
 *  21. Informations pratiques
 *  22. Pages internes et fil d'Ariane
 *  23. Grille des six regroupements
 *  24. Sections dynamiques de l'annuaire
 *  25. Liste des cabinets et structures
 *  26. Grille des professionnels
 *  26 bis. Bouton de prise de rendez-vous
 *  27. Fiches praticien et cabinet
 *  28. Retour vers l'annuaire
 *  29. Coordonnées d'une fiche
 *
 * Breakpoints (à écrire en dur : les propriétés personnalisées ne sont pas
 * utilisables dans une media query)
 *   mobile   : max-width 767.98px
 *   tablette : 768px → 1024px
 *   desktop  : min-width 1025px
 *   header   : bascule burger sous 1200px (phase 2)
 *
 * L'essentiel de la mise en forme passe par le personnalisateur Astra et les
 * réglages des blocs Spectra. Cette feuille ne porte que ce qui n'est pas
 * atteignable autrement.
 */

/* ------------------------------------------------------------------ *
 * 1. Jetons
 * ------------------------------------------------------------------ */

:root {
	/* Couleurs — identité */
	--pmv-bleu: #0F4C5C;
	--pmv-bleu-presse: #0C3E4B;
	--pmv-vert: #7DBB8D;
	--pmv-vert-texte: #2F6842;

	/*
	 * Variante accessible du vert de marque sur le bleu pétrole du pied de page.
	 * Le vert doux y plafonne à 4,24:1 ; celui-ci atteint 4,55:1 (AA) pour une
	 * différence visuelle quasi indiscernable. Réservé aux titres de colonnes du
	 * pied de page : le vert doux reste la couleur des accents décoratifs.
	 */
	--pmv-vert-titre-footer: #85C193;

	/* Couleurs — texte */
	--pmv-texte: #333F46;
	--pmv-texte-secondaire: #5B6B72;
	--pmv-texte-attenue: #8A9299;

	/* Couleurs — surfaces */
	--pmv-ivoire: #FDFCFA;
	--pmv-blanc: #FFFFFF;
	--pmv-bleu-clair: #E7EEF0;
	--pmv-vert-clair: #EAF4ED;
	--pmv-vert-surface: #F1F7F3;

	/* Seconde bande des placeholders rayés (handoff, cadres 1c). */
	--pmv-raye-clair: #F2F6F7;

	/* Couleurs — lignes */
	--pmv-bordure: #D9E0E2;
	--pmv-bordure-champ: #B9CCD2;
	--pmv-bordure-pointillee: #C6CFD2;
	--pmv-bordure-header: #E3E7E6;
	--pmv-separateur-fil: #B9C4C8;

	/* Couleurs — états */
	--pmv-survol-bouton-secondaire: #EEF3F4;
	--pmv-survol-carte: #F6F9F7;

	/* Typographie */
	--pmv-police-titre: "Outfit", sans-serif;
	--pmv-police-corps: "Inter", sans-serif;
	--pmv-graisse-titre: 600;
	--pmv-graisse-corps: 400;
	--pmv-graisse-corps-forte: 500;

	--pmv-taille-corps: 17px;
	--pmv-taille-corps-mobile: 16px;
	--pmv-taille-description: 15px;
	--pmv-taille-kicker: 13px;
	--pmv-taille-fil: 13px;

	--pmv-interligne-corps: 1.65;
	--pmv-interligne-description: 1.55;
	--pmv-interlettrage-kicker: 0.08em;

	/* Espacements */
	--pmv-pad-section-x: 56px;
	--pmv-pad-section-x-mobile: 20px;
	--pmv-espace-section: 96px;
	--pmv-espace-section-mobile: 40px;
	--pmv-gap-grille: 20px;
	--pmv-gap-grille-mobile: 12px;
	--pmv-pad-carte: 28px;
	--pmv-pad-carte-mobile: 18px;

	/* Rayons */
	--pmv-rayon-carte: 12px;
	--pmv-rayon-bouton: 10px;
	--pmv-rayon-badge: 8px;

	/* Bordures */
	--pmv-trait: 1px solid var(--pmv-bordure);
	--pmv-trait-champ: 1.5px solid var(--pmv-bordure-champ);
	--pmv-trait-vide: 1px dashed var(--pmv-bordure-pointillee);

	/* Ombre — unique ombre autorisée, au survol des cartes cliquables */
	--pmv-ombre-survol: 0 4px 16px rgba(15, 76, 92, 0.08);

	/* Largeurs */
	--pmv-largeur-contenu: 1328px;
	--pmv-largeur-paragraphe: 680px;

	/* Cible tactile minimale */
	--pmv-cible-tactile: 44px;
}

/* ------------------------------------------------------------------ *
 * 2. Base et accessibilité
 * ------------------------------------------------------------------ */

body {
	line-height: var(--pmv-interligne-corps);
}

/* Corps mobile jamais sous 16px (handoff, section J). */
@media (max-width: 767.98px) {
	body {
		font-size: var(--pmv-taille-corps-mobile);
	}
}

/*
 * Focus clavier visible — remplace l'anneau par défaut du navigateur.
 * Exigence d'accessibilité du handoff (sections G et J).
 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: 2px;
}

/*
 * Astra pose sur ses boutons un anneau de focus ivoire sans décalage : posé
 * sur le fond ivoire du site, il est invisible. On rétablit l'anneau bleu
 * décalé de 2 px, qui se détache aussi bien du bouton que de la page.
 */
.wp-block-button__link:focus-visible,
.wp-block-button .wp-block-button__link:focus-visible,
.ast-button:focus-visible,
.ast-custom-button:focus-visible {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------ *
 * 3. Boutons
 * ------------------------------------------------------------------ */

.pmv-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--pmv-cible-tactile);
	padding: 15px 26px;
	border-radius: var(--pmv-rayon-bouton);
	font-family: var(--pmv-police-titre);
	font-size: 16px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.pmv-btn--principal {
	background: var(--pmv-bleu);
	border: 0;
	color: var(--pmv-ivoire);
}

.pmv-btn--principal:hover,
.pmv-btn--principal:focus {
	background: var(--pmv-bleu-presse);
	color: var(--pmv-ivoire);
}

.pmv-btn--secondaire {
	background: var(--pmv-ivoire);
	border: var(--pmv-trait-champ);
	color: var(--pmv-bleu);
}

.pmv-btn--secondaire:hover,
.pmv-btn--secondaire:focus {
	background: var(--pmv-survol-bouton-secondaire);
	color: var(--pmv-bleu-presse);
}

/* Variante posée sur le bleu pétrole (footer, carte Pôle). */
.pmv-btn--sur-sombre {
	background: var(--pmv-ivoire);
	border: 0;
	color: var(--pmv-bleu);
}

.pmv-btn--sur-sombre:hover,
.pmv-btn--sur-sombre:focus {
	background: var(--pmv-blanc);
	color: var(--pmv-bleu-presse);
}

.pmv-sombre :focus-visible {
	outline-color: var(--pmv-ivoire);
}

/* ------------------------------------------------------------------ *
 * 4. Badges et pastilles
 * ------------------------------------------------------------------ */

.pmv-kicker {
	display: block;
	font-family: var(--pmv-police-corps);
	font-size: var(--pmv-taille-kicker);
	font-weight: var(--pmv-graisse-corps-forte);
	line-height: 1.4;
	color: var(--pmv-vert-texte);
	text-transform: uppercase;
	letter-spacing: var(--pmv-interlettrage-kicker);
}

.pmv-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pmv-vert);
}

.pmv-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-radius: var(--pmv-rayon-badge);
	font-family: var(--pmv-police-corps);
	line-height: 1.3;
}

/* Localisation : étage ou repère de lieu. */
.pmv-badge--loc {
	padding: 7px 12px;
	background: var(--pmv-bleu-clair);
	color: var(--pmv-bleu);
	font-size: 14px;
}

/* Proximité : pharmacie et laboratoire, entrées distinctes. */
.pmv-badge--proximite {
	padding: 5px 10px;
	background: var(--pmv-vert-clair);
	color: var(--pmv-texte);
	font-size: 13px;
	border-radius: 6px;
}

/* Membre de la MSP : facultatif, jamais affiché par défaut. */
.pmv-badge--msp {
	padding: 6px 12px;
	background: var(--pmv-vert-clair);
	color: var(--pmv-texte);
	font-size: 13px;
}

/* ------------------------------------------------------------------ *
 * 5. Cartes
 * ------------------------------------------------------------------ */

.pmv-carte {
	position: relative;
	padding: var(--pmv-pad-carte);
	background: var(--pmv-blanc);
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
}

@media (max-width: 767.98px) {
	.pmv-carte {
		padding: var(--pmv-pad-carte-mobile);
	}
}

.pmv-carte__titre {
	margin: 0 0 6px;
	font-family: var(--pmv-police-titre);
	font-size: 19px;
	font-weight: var(--pmv-graisse-titre);
	color: var(--pmv-bleu);
}

.pmv-carte__texte {
	margin: 0;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

/*
 * Carte entièrement cliquable : la surface complète est le lien.
 * Le lien est étiré en superposition plutôt que d'imbriquer du contenu
 * dans une balise <a>, ce qui resterait ingérable avec des blocs.
 */
.pmv-carte--cliquable {
	transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.pmv-carte--cliquable:hover {
	background: var(--pmv-survol-carte);
	box-shadow: var(--pmv-ombre-survol);
}

/*
 * Le lien ne se distingue pas du titre qu'il porte : l'affordance est la
 * carte entière, pas le libellé. La première règle vaut partout ; la seconde
 * passe au-dessus du soulignement de contenu d'Astra, plus spécifique, selon
 * la même convention que les liens des blocs Pôle et MSP plus bas. Aucun
 * `!important` : le réglage global d'Astra reste intact.
 */
.pmv-carte__lien {
	text-decoration: none;
	color: inherit;
}

.entry-content .pmv-carte .pmv-carte__lien {
	text-decoration: none;
}

.pmv-carte__lien::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.pmv-carte--cliquable:focus-within {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: 2px;
}

/*
 * La carte entière porte déjà l'anneau de focus : on évite le double anneau
 * sur le lien étiré, qui ne cerne qu'une portion du titre.
 */
.pmv-carte--cliquable .pmv-carte__lien:focus-visible {
	outline: none;
}

/* Pastille d'icône. */
.pmv-pastille {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin-bottom: 14px;
	border-radius: var(--pmv-rayon-bouton);
	background: var(--pmv-bleu-clair);
	color: var(--pmv-bleu);
}

.pmv-pastille--verte {
	background: var(--pmv-vert-clair);
	color: var(--pmv-vert-texte);
}

/* ------------------------------------------------------------------ *
 * 6. Surfaces
 * ------------------------------------------------------------------ */

.pmv-surface {
	padding: var(--pmv-pad-carte);
	border-radius: var(--pmv-rayon-carte);
}

.pmv-surface--ivoire {
	background: var(--pmv-ivoire);
	border: var(--pmv-trait);
}

.pmv-surface--blanche {
	background: var(--pmv-blanc);
	border: var(--pmv-trait);
}

.pmv-surface--bleue {
	background: var(--pmv-bleu);
	color: var(--pmv-ivoire);
}

.pmv-surface--verte {
	background: var(--pmv-vert-surface);
}

/*
 * Sur surface sombre, le texte et les liens passent en ivoire — mais jamais
 * les boutons, qui portent leur propre couleur. Sans l'exclusion ci-dessous,
 * « .pmv-sombre a » l'emporte sur « .pmv-btn--sur-sombre » et rend le libellé
 * ivoire sur un bouton ivoire, donc illisible.
 */
.pmv-sombre,
.pmv-sombre a:not(.pmv-btn) {
	color: var(--pmv-ivoire);
}

/*
 * Les titres n'héritent pas : Astra leur pose sa propre couleur globale, qui
 * l'emporte sur l'ivoire de la surface. Sans cette règle, un titre posé sur le
 * bleu pétrole ressort en bleu pétrole, donc invisible.
 */
.pmv-sombre h1,
.pmv-sombre h2,
.pmv-sombre h3,
.pmv-sombre h4,
.pmv-sombre h5,
.pmv-sombre h6 {
	color: var(--pmv-ivoire);
}

/* ------------------------------------------------------------------ *
 * 7. Listes et encarts
 * ------------------------------------------------------------------ */

/* Liste bordée : la dernière ligne ne porte pas de trait. */
.pmv-liste {
	margin: 0;
	padding: 0;
	list-style: none;
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-liste > li {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: var(--pmv-cible-tactile);
	padding: 14px 18px;
	border-bottom: 1px solid var(--pmv-bordure);
}

.pmv-liste > li:last-child {
	border-bottom: 0;
}

/*
 * Numéro d'étage.
 *
 * Le numéro porte une information (l'étage) : il emploie donc le vert texte
 * accessible (#2F6842, 6,08:1) et non le vert doux (#7DBB8D, 2,19:1), qui
 * reste réservé aux fonds, pastilles et repères sans texte.
 */
.pmv-etage {
	flex: none;
	font-family: var(--pmv-police-titre);
	font-size: 24px;
	font-weight: var(--pmv-graisse-titre);
	color: var(--pmv-vert-texte);
}

/* Encart de réassurance. */
.pmv-encart {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	background: var(--pmv-vert-surface);
	border-radius: var(--pmv-rayon-carte);
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte);
}

.pmv-encart .pmv-dot {
	margin-top: 7px;
	flex: none;
}

/*
 * État vide ou contenu à venir.
 *
 * Le gris atténué (#8A9299) plafonne à 3,08:1 sur ivoire : insuffisant pour
 * une information nécessaire. Ce bloc porte un message que l'utilisateur doit
 * pouvoir lire, on emploie donc le gris secondaire (5,40:1, AA). Le gris
 * atténué reste réservé aux placeholders de saisie et au texte désactivé.
 */
.pmv-vide {
	padding: var(--pmv-pad-carte);
	border: var(--pmv-trait-vide);
	border-radius: var(--pmv-rayon-carte);
	color: var(--pmv-texte-secondaire);
	font-size: var(--pmv-taille-description);
}

/* ------------------------------------------------------------------ *
 * 8. Pictogrammes
 * ------------------------------------------------------------------ */

.pmv-icon {
	display: inline-block;
	vertical-align: middle;
	flex: none;
}

/* ------------------------------------------------------------------ *
 * 9. Header
 *
 * La structure vient du Header Builder d'Astra. Ne restent ici que les
 * points qu'il n'expose pas.
 * ------------------------------------------------------------------ */

/* Le logo est un SVG : jamais déformé, jamais étiré au-delà du conteneur. */
.custom-logo,
.astra-logo-svg {
	height: auto;
	max-width: 100%;
}

/*
 * Lien de navigation actif : soulignement vert 2 px (handoff section C).
 * Repère décoratif — le libellé reste en bleu pétrole, l'information n'est
 * jamais portée par la couleur seule.
 */
.ast-builder-menu-1 .main-header-menu .current-menu-item > .menu-link,
.ast-builder-menu-1 .main-header-menu .current-menu-ancestor > .menu-link,
.ast-builder-menu-1 .main-header-menu .current_page_item > .menu-link {
	box-shadow: inset 0 -2px 0 0 var(--pmv-vert);
}

/*
 * Bascule bureau / mobile du header à 1200 px.
 *
 * Le filtre `astra_header_break_point` (functions.php) porte bien le seuil à
 * 1200 px pour le JavaScript d'Astra, mais le thème compose ces deux règles
 * d'affichage à partir de son point de rupture tablette (921 px) : sans
 * l'appoint ci-dessous, la navigation bureau restait affichée jusqu'à 921 px
 * et se comprimait sur deux lignes entre 1199 et 922 px.
 */
@media (max-width: 1199.98px) {
	#ast-desktop-header {
		display: none;
	}

	#ast-mobile-header {
		display: block;
	}
}

/*
 * Le logo SVG porte déjà le nom « Pôle Médical Vaise » et la baseline
 * « Maison de santé – Lyon 9 ». Le bloc titre d'Astra ferait donc doublon —
 * il occupait 216 px et repoussait la navigation sur une seconde ligne.
 * Le nom reste accessible : il est porté par l'attribut alt du logo.
 */
.ast-primary-header-bar .ast-site-title-wrap {
	display: none;
}

/*
 * Répartition de la barre du header.
 *
 * Astra partage la ligne en deux colonnes de largeur voisine, ce qui laissait
 * trop peu de place à droite : les six liens et le bouton passaient sur deux
 * lignes (header de 177 px au lieu de 89 px). On donne au logo sa largeur
 * naturelle, le reste à la navigation, et on interdit le retour à la ligne
 * des liens. Sous le seuil de bascule, le menu mobile prend le relais.
 */
@media (min-width: 1200px) {
	.ast-primary-header-bar .ast-builder-grid-row-has-sides {
		grid-template-columns: auto 1fr;
	}

	.ast-builder-menu-1 .main-header-menu {
		flex-wrap: nowrap;
	}
}

/* Bouton burger : cible tactile pleine, rayon et bordure du handoff. */
.ast-mobile-menu-trigger-minimal,
.ast-mobile-menu-trigger-outline,
.ast-mobile-menu-trigger-fill {
	min-width: var(--pmv-cible-tactile);
	min-height: var(--pmv-cible-tactile);
	border-radius: var(--pmv-rayon-bouton);
}

/* ------------------------------------------------------------------ *
 * 10. Footer
 * ------------------------------------------------------------------ */

/*
 * Grille 1.4fr / 1fr / 1fr / 1fr du handoff, à partir de la tablette.
 *
 * Astra génère ici une grille à trois colonnes égales quel que soit le
 * réglage de colonnes ; la quatrième section repassait à la ligne.
 */
/*
 * La disposition des rangées vient désormais du réglage Astra
 * « hb-footer-layout » (4-equal / 2-equal / full) : « hb-footer-column » valait
 * bien 4 depuis la phase 2, mais la disposition n'avait jamais été renseignée
 * et Astra retombait sur son défaut à trois colonnes, la quatrième repassant à
 * la ligne. Ne reste ici que le rapport 1.4fr/1fr/1fr/1fr du handoff, que le
 * personnalisateur n'expose pas.
 *
 * Le seuil est porté à 922 px pour laisser la tranche tablette à Astra, et le
 * sélecteur compte quatre classes : les règles de grille du thème en portent
 * trois, une égalité de spécificité se serait jouée sur l'ordre des feuilles.
 */
@media (min-width: 922px) {
	.site-footer .ast-builder-grid-row-container.site-primary-footer-wrap .ast-builder-footer-grid-columns {
		grid-template-columns: 1.4fr 1fr 1fr 1fr;
	}
}

/*
 * Astra place sa rupture mobile à 544 px. Entre 545 et 767 px, le pied de page
 * restait donc sur deux colonnes alors que le handoff traite toute largeur
 * inférieure à 768 px en colonne unique.
 */
@media (max-width: 767.98px) {
	.site-footer .ast-builder-grid-row-container.site-primary-footer-wrap .ast-builder-footer-grid-columns {
		grid-template-columns: 1fr;
	}
}

.pmv-fmarque {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
}

.pmv-fsymbole {
	display: inline-flex;
	padding: 5px;
	border-radius: var(--pmv-rayon-badge);
	background: var(--pmv-ivoire);
}

/*
 * Angles inférieurs du pied de page.
 *
 * Le cadre 1c enveloppe la maquette entière dans un conteneur
 * « border-radius: 12px; overflow: hidden » ; seuls ses deux angles inférieurs
 * sont reportés sur le site réel, les supérieurs restant droits puisque le
 * header est au contact du haut de la fenêtre.
 *
 * Les deux rangées d'Astra portent leur propre fond bleu pétrole et ignorent
 * le rayon de leur parent : sans `overflow: hidden` sur le pied de page, elles
 * déborderaient dans les découpes et les angles resteraient carrés. Le
 * débordement est donc masqué ici, et nulle part ailleurs.
 */
.site-footer {
	border-radius: 0 0 var(--pmv-rayon-carte) var(--pmv-rayon-carte);
	overflow: hidden;
}

/*
 * Couleurs du pied de page.
 *
 * Astra expose des réglages « footer-widget-N-color » et
 * « footer-widget-N-link-color », renseignés en phase 2 avec les valeurs du
 * handoff, mais il n'émet aucune règle correspondante pour les zones de
 * widgets classiques : l'inspection de la cascade ne trouve sur ces éléments
 * que le « a { color: var(--ast-global-color-0) } » global et la couleur de
 * corps héritée. Sur le bleu pétrole, le nom de la marque sortait donc en
 * #333F46 et les liens en #0F4C5C sur #0F4C5C, soit invisibles.
 *
 * Les classes du pied de page portent leur couleur explicitement, comme le
 * faisaient déjà .pmv-fadresse et .pmv-ftitre. Un sélecteur de classe suffit
 * à l'emporter sur le « a » global : aucun !important n'est nécessaire.
 */
.pmv-fnom {
	font-family: var(--pmv-police-titre);
	font-size: 16px;
	font-weight: var(--pmv-graisse-titre);
	color: var(--pmv-ivoire);
}

.pmv-fliens a {
	color: rgba(253, 252, 250, 0.85);
	text-decoration: none;
}

.pmv-flegal a {
	color: rgba(253, 252, 250, 0.65);
	text-decoration: none;
}

.pmv-fliens a:hover,
.pmv-fliens a:focus,
.pmv-flegal a:hover,
.pmv-flegal a:focus {
	color: var(--pmv-blanc);
	text-decoration: underline;
}

.pmv-fadresse {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(253, 252, 250, 0.75);
}

/*
 * Intitulés de colonnes : kicker vert sur fond bleu pétrole.
 *
 * Le vert doux #7DBB8D du handoff ne donne que 4,24:1 sur #0F4C5C, sous le
 * seuil AA, et à 12 px gras ces titres ne relèvent pas du grand texte. La
 * variante #85C193 atteint 4,55:1 en restant dans la famille du vert de marque.
 */
.pmv-ftitre {
	margin: 0 0 10px;
	font-family: var(--pmv-police-titre);
	font-size: 12px;
	font-weight: var(--pmv-graisse-titre);
	color: var(--pmv-vert-titre-footer);
	text-transform: uppercase;
	letter-spacing: var(--pmv-interlettrage-kicker);
}

.pmv-fliens {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 14px;
}

.pmv-flegal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	font-size: 13px;
}

.pmv-fannee {
	margin-left: auto;
}

@media (max-width: 767.98px) {
	.pmv-fannee {
		margin-left: 0;
		width: 100%;
	}
}

/* Sur le bleu pétrole, l'anneau de focus doit rester lisible. */
.site-footer :focus-visible {
	outline-color: var(--pmv-ivoire);
}

/* ------------------------------------------------------------------ *
 * 11. Barre d'accès mobile
 * ------------------------------------------------------------------ */

.pmv-mobile-bar {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 90;
	display: flex;
	gap: 10px;
	padding: 12px 16px;
	padding-bottom: calc(12px + env(safe-area-inset-bottom));
	background: var(--pmv-ivoire);
	border-top: 1px solid var(--pmv-bordure-header);
}

.pmv-mobile-bar__lien {
	flex: 1;
	gap: 8px;
	min-height: var(--pmv-cible-tactile);
	padding: 12px 14px;
	font-size: 15px;
}

/* Au-delà du mobile, la barre disparaît complètement. */
@media (min-width: 768px) {
	.pmv-mobile-bar {
		display: none;
	}
}

/*
 * Sous 768 px, on réserve la hauteur de la barre en bas du document pour
 * qu'elle ne recouvre jamais le pied de page.
 */
@media (max-width: 767.98px) {
	body {
		padding-bottom: 76px;
	}
}

/*
 * Fenêtre très basse (clavier virtuel ouvert, paysage sur petit écran) :
 * la barre mangerait l'écran, on la retire et on rend la hauteur au contenu.
 */
@media (max-width: 767.98px) and (max-height: 450px) {
	.pmv-mobile-bar {
		display: none;
	}

	body {
		padding-bottom: 0;
	}
}

/*
 * Coexistence avec une future bannière de cookies : la bannière ajoute
 * « pmv-cookie-open » sur <body> et la barre s'efface le temps du choix.
 */
body.pmv-cookie-open .pmv-mobile-bar {
	display: none;
}

/* ------------------------------------------------------------------ *
 * 12. Sections de page
 *
 * Les pages du site sont en pleine largeur (réglage Astra
 * « full-width-container ») : chaque section porte donc elle-même son
 * padding latéral et sa largeur maximale. Astra a déjà recomposé deux fois
 * ses propres grilles sous nos pieds (header en 0.2.1, footer en 0.2.1) ;
 * les sections ne dépendent d'aucune de ses mécaniques de conteneur.
 * ------------------------------------------------------------------ */

/*
 * Astra pose sur les blocs de premier niveau du contenu une règle
 * « .entry-content > .wp-block-group » dont les deux classes l'emportent sur
 * la classe unique de nos sections : le padding du handoff était écrasé par
 * les 51 px du thème. Plutôt que de surencherir en spécificité, chaque section
 * alimente les variables qu'Astra consomme *et* pose sa propre déclaration.
 * Les deux portent la même valeur : le rendu est identique quelle que soit la
 * règle qui l'emporte, et aucun `!important` n'est nécessaire.
 */
.pmv-section {
	--wp--custom--ast-default-block-top-padding: 0;
	--wp--custom--ast-default-block-bottom-padding: 0;
	--wp--custom--ast-default-block-left-padding: var(--pmv-pad-section-x);
	--wp--custom--ast-default-block-right-padding: var(--pmv-pad-section-x);

	padding-left: var(--pmv-pad-section-x);
	padding-right: var(--pmv-pad-section-x);
}

.pmv-section__inner {
	max-width: var(--pmv-largeur-contenu);
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 767.98px) {
	.pmv-section {
		--wp--custom--ast-default-block-left-padding: var(--pmv-pad-section-x-mobile);
		--wp--custom--ast-default-block-right-padding: var(--pmv-pad-section-x-mobile);

		padding-left: var(--pmv-pad-section-x-mobile);
		padding-right: var(--pmv-pad-section-x-mobile);
	}
}

/* ------------------------------------------------------------------ *
 * 13. Hero d'accueil
 * ------------------------------------------------------------------ */

.pmv-hero {
	--wp--custom--ast-default-block-top-padding: 88px;
	--wp--custom--ast-default-block-bottom-padding: 88px;

	padding-top: 88px;
	padding-bottom: 88px;
}

@media (max-width: 767.98px) {
	.pmv-hero {
		--wp--custom--ast-default-block-top-padding: 36px;
		--wp--custom--ast-default-block-bottom-padding: 44px;

		padding-top: 36px;
		padding-bottom: 44px;
	}
}

/*
 * Rapport de colonnes 1.05 / 0.95 du handoff.
 *
 * Le cœur empile ses colonnes sous 782 px et impose alors
 * « flex-basis: 100% !important ». Le handoff place la bascule à 768 px et
 * garde deux colonnes sur la tranche tablette : au-dessus du seuil mobile on
 * rétablit donc le rang unique, et les largeurs sont exprimées en facteur de
 * croissance plutôt qu'en pourcentages, ce qui traduit le rapport exactement.
 */
.pmv-hero__grille {
	margin-bottom: 0;
}

@media (min-width: 768px) {
	.pmv-hero__grille {
		gap: 64px;
		flex-wrap: nowrap;
	}

	.pmv-hero__grille > .wp-block-column {
		align-self: center;
		flex-basis: 0 !important;
	}

	.pmv-hero__grille > .wp-block-column:first-child {
		flex-grow: 1.05;
	}

	.pmv-hero__grille > .wp-block-column:last-child {
		flex-grow: 0.95;
	}
}

@media (max-width: 767.98px) {
	.pmv-hero__grille {
		gap: 26px;
	}
}

/* Badge de localisation. La pastille verte est décorative : elle est tracée
 * en CSS plutôt qu'insérée dans le texte, pour qu'aucun lecteur d'écran ne la
 * restitue et que le contenu du bloc reste du texte simple, éditable. */
.pmv-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 24px;
	padding: 8px 15px;
	background: var(--pmv-vert-clair);
	border-radius: var(--pmv-rayon-badge);
	color: var(--pmv-bleu);
	font-family: var(--pmv-police-corps);
	font-size: 13px;
	font-weight: var(--pmv-graisse-corps-forte);
	line-height: 1.3;
}

.pmv-hero__badge::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pmv-vert);
}

@media (max-width: 767.98px) {
	.pmv-hero__badge {
		margin-bottom: 18px;
	}
}

.pmv-hero__titre {
	margin: 0 0 20px;
	font-family: var(--pmv-police-titre);
	font-size: 60px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.08;
	color: var(--pmv-bleu);
}

@media (max-width: 767.98px) {
	.pmv-hero__titre {
		margin-bottom: 14px;
		font-size: 36px;
		line-height: 1.1;
	}
}

.pmv-hero__texte {
	margin: 0 0 40px;
	max-width: 520px;
	font-size: 18px;
	line-height: 1.7;
	color: var(--pmv-texte);
}

@media (max-width: 767.98px) {
	.pmv-hero__texte {
		margin-bottom: 26px;
		font-size: var(--pmv-taille-corps-mobile);
		line-height: 1.65;
	}
}

.pmv-hero__actions {
	gap: 14px;
}

/* Mobile : les deux actions passent en pile, pleine largeur (handoff, E.1). */
@media (max-width: 767.98px) {
	.pmv-hero__actions {
		flex-direction: column;
		gap: 12px;
	}

	.pmv-hero__actions .wp-block-button {
		width: 100%;
	}

	.pmv-hero__actions .wp-block-button__link {
		display: block;
		width: 100%;
		text-align: center;
	}
}

/* ------------------------------------------------------------------ *
 * 14. Placeholders d'image
 *
 * Rayures diagonales et étiquette monospace, en attendant les photographies
 * du praticien et du cabinet. Aucune image distante, aucun service tiers.
 * ------------------------------------------------------------------ */

.pmv-placeholder {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	border-radius: var(--pmv-rayon-carte);
	background: repeating-linear-gradient(
		45deg,
		var(--pmv-bleu-clair) 0 14px,
		var(--pmv-raye-clair) 14px 28px
	);
}

.pmv-placeholder__note {
	margin: 0;
	padding: 8px 14px;
	border-radius: var(--pmv-rayon-badge);
	background: var(--pmv-ivoire);
	color: var(--pmv-texte-secondaire);
	font-family: ui-monospace, monospace;
	font-size: 12px;
	line-height: 1.4;
	text-align: center;
}

.pmv-hero__visuel {
	min-height: 400px;
}

/*
 * Pastille verte en débord bas-gauche du visuel.
 *
 * Le cadre 1c ne la porte que sur le bureau : en mobile, le visuel occupe
 * toute la largeur utile et la pastille déborderait dans la gouttière de
 * 20 px, où elle se lit comme une scorie plutôt que comme un repère.
 */
@media (min-width: 768px) {
	.pmv-hero__visuel::after {
		content: "";
		position: absolute;
		left: -10px;
		bottom: -10px;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		background: var(--pmv-vert);
	}
}

/*
 * Le visuel du hero porte une photographie.
 *
 * L'état d'attente et l'état photographié partagent la même géométrie : un
 * cadre de 400 px de haut dont la largeur suit la colonne. Ce qui change,
 * c'est ce qui le remplit.
 *
 * La grille à piste unique étire l'enfant sur toute la hauteur du cadre. C'est
 * ce qui donne à l'image une hauteur définie à laquelle rapporter son
 * « height: 100% » : « min-height » seul laisserait le pourcentage sans
 * référence, et l'image reprendrait son rapport naturel.
 *
 * Le rayon est porté par l'image, pas par le cadre. Masquer le débordement du
 * cadre pour l'arrondir rognerait la pastille verte, qui vit dix pixels en
 * dehors de lui.
 *
 * « position: relative » reprend ici le rôle que tenait « .pmv-placeholder » :
 * sans lui, la pastille perdrait son bloc conteneur et irait se poser au bas
 * de la page.
 */
.pmv-hero__visuel--photo {
	position: relative;
}

/*
 * La figure sort du flux. C'est ce qui permet au cadre de garder exactement
 * ses 400 px : une image laissée dans le flux impose sa hauteur naturelle au
 * conteneur, et « min-height » ne la retient pas.
 */
.pmv-hero__visuel--photo > figure {
	position: absolute;
	inset: 0;
	margin: 0;
}

/*
 * Le sélecteur passe par « .wp-block-image » à dessein : le cœur pose
 * « height: auto » sur cette image avec la même spécificité, et l'ordre des
 * feuilles ne doit pas décider du résultat.
 *
 * Le décalage vertical de 35 % remonte légèrement le cadrage. À 390 px, le
 * cadre est presque deux fois plus large que haut : centré, il rognait le haut
 * du mot « Entrée » et du logo. Rien n'est recadré dans le fichier.
 */
.pmv-hero__visuel--photo .wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 35%;
	border-radius: var(--pmv-rayon-carte);
}
/*
 * Photographie éditoriale posée dans le fil d'une section.
 *
 * Le cadre du hero a sa géométrie propre ; ces photographies-là n'en ont pas.
 * Elles gardent donc leur rapport natif — rien n'est recadré — et n'empruntent
 * au design que son rayon de carte, pour ne pas détonner à côté des blocs
 * voisins.
 *
 * La variante portrait est bornée en largeur : une image haute prise sur toute
 * la largeur d'une section pousserait le reste de la page hors de l'écran.
 */
.pmv-photo {
	margin: 28px 0 0;
}

.pmv-photo img {
	display: block;
	height: auto;
	border-radius: var(--pmv-rayon-carte);
}

/*
 * « min() » et non « 420px » : la règle ci-dessus est plus spécifique que le
 * « max-width: 100% » du cœur, qu'elle remplace au lieu de s'y ajouter. Sans
 * cette borne, l'image portrait garde ses 420 px sur un écran de 390 et sort
 * du cadre.
 */
.pmv-photo--portrait img {
	max-width: min(420px, 100%);
}

@media (max-width: 767.98px) {
	.pmv-photo {
		margin-top: 20px;
	}
}
@media (max-width: 767.98px) {
	.pmv-hero__visuel {
		min-height: 180px;
	}

	.pmv-placeholder {
		background: repeating-linear-gradient(
			45deg,
			var(--pmv-bleu-clair) 0 12px,
			var(--pmv-raye-clair) 12px 24px
		);
	}

	.pmv-placeholder__note {
		padding: 7px 12px;
		font-size: 11px;
	}
}

/* ------------------------------------------------------------------ *
 * 15. Sections courantes
 *
 * Le hero porte 88 px en haut et en bas. Les sections qui le suivent
 * s'enchaînent : elles n'ont pas de padding haut et referment sur 96 px,
 * conformément aux cadres 1c.
 * ------------------------------------------------------------------ */

/*
 * Écart de bloc du cœur.
 *
 * WordPress pose « margin-block-start: 24px » sur tout bloc frère qui n'est pas
 * le premier. Dans une grille, cet écart décale chaque élément au lieu de les
 * aligner sur la rangée ; dans une liste bordée, il disjoint les lignes. Les
 * conteneurs dont nous pilotons nous-mêmes l'espacement le neutralisent.
 */
.pmv-acces__grille,
.pmv-acces__grille > *,
.pmv-poles__grille > *,
.pmv-reperes__grille > *,
.pmv-etages,
.pmv-etages > *,
.pmv-etages__ligne > * {
	margin-block: 0;
}

.pmv-section--suite {
	--wp--custom--ast-default-block-top-padding: 0;
	--wp--custom--ast-default-block-bottom-padding: 96px;

	padding-top: 0;
	padding-bottom: 96px;
}

@media (max-width: 767.98px) {
	.pmv-section--suite {
		--wp--custom--ast-default-block-bottom-padding: 44px;

		padding-bottom: 44px;
	}
}

.pmv-section__titre {
	margin: 0 0 40px;
	font-family: var(--pmv-police-titre);
	font-size: 36px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.15;
	color: var(--pmv-bleu);
}

.pmv-kicker + .pmv-section__titre {
	margin-top: 10px;
}

@media (max-width: 767.98px) {
	.pmv-section__titre {
		margin-bottom: 20px;
		font-size: 24px;
	}
}

/* ------------------------------------------------------------------ *
 * 16. Accès rapide
 *
 * Grille de cellules jointives : chaque carte porte ses filets à droite et
 * en bas, le conteneur porte le cadre et le rayon. Les filets de bordure
 * sont redéfinis à chaque palier, le nombre de colonnes changeant.
 * ------------------------------------------------------------------ */

.pmv-acces__grille {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-acces__carte {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 32px;
	border-right: 1px solid var(--pmv-bordure);
	border-bottom: 1px solid var(--pmv-bordure);
	transition: background-color 0.15s ease;
}

/* Trois colonnes : pas de filet droit en fin de rangée, ni de filet bas
   sous la seconde rangée. */
@media (min-width: 1025px) {
	.pmv-acces__carte:nth-child(3n) {
		border-right: 0;
	}

	.pmv-acces__carte:nth-child(n + 4) {
		border-bottom: 0;
	}
}

@media (min-width: 768px) and (max-width: 1024.98px) {
	.pmv-acces__grille {
		grid-template-columns: repeat(2, 1fr);
	}

	.pmv-acces__carte {
		padding: 26px;
	}

	.pmv-acces__carte:nth-child(2n) {
		border-right: 0;
	}

	.pmv-acces__carte:nth-child(n + 5) {
		border-bottom: 0;
	}
}

@media (max-width: 767.98px) {
	.pmv-acces__grille {
		grid-template-columns: 1fr;
	}

	.pmv-acces__carte {
		padding: var(--pmv-pad-carte-mobile);
		border-right: 0;
	}

	.pmv-acces__carte:last-child {
		border-bottom: 0;
	}
}

/*
 * Pastille et pictogramme.
 *
 * Le glyphe est posé en masque CSS plutôt qu'en SVG inline : la carte reste
 * un simple bloc éditable dans Gutenberg, sans bloc HTML brut, et la couleur
 * du trait suit le jeton plutôt qu'une valeur figée dans le fichier.
 */
.pmv-acces__carte::before {
	content: "";
	display: block;
	width: 46px;
	height: 46px;
	margin-bottom: 18px;
	border-radius: var(--pmv-rayon-bouton);
	background: var(--pmv-bleu-clair);
}

.pmv-acces__carte::after {
	content: "";
	position: absolute;
	top: 32px;
	left: 32px;
	width: 46px;
	height: 46px;
	background-color: var(--pmv-bleu);
	-webkit-mask: var(--pmv-icone) center / 22px 22px no-repeat;
	mask: var(--pmv-icone) center / 22px 22px no-repeat;
}

@media (min-width: 768px) and (max-width: 1024.98px) {
	.pmv-acces__carte::after {
		top: 26px;
		left: 26px;
	}
}

@media (max-width: 767.98px) {
	.pmv-acces__carte::after {
		top: var(--pmv-pad-carte-mobile);
		left: var(--pmv-pad-carte-mobile);
	}
}

.pmv-acces__carte--medecine-generale { --pmv-icone: url("../icons/user.svg"); }
.pmv-acces__carte--autres-professionnels { --pmv-icone: url("../icons/users.svg"); }
.pmv-acces__carte--dentistes { --pmv-icone: url("../icons/smile.svg"); }
.pmv-acces__carte--dentisterie-pediatrique { --pmv-icone: url("../icons/heart.svg"); }
.pmv-acces__carte--pharmacie { --pmv-icone: url("../icons/cross.svg"); }
.pmv-acces__carte--laboratoire { --pmv-icone: url("../icons/flask-conical.svg"); }

/* Pharmacie et laboratoire : entrées distinctes, repère vert. */
.pmv-acces__carte--pharmacie::before,
.pmv-acces__carte--laboratoire::before {
	background: var(--pmv-vert-clair);
}

.pmv-acces__carte--pharmacie::after,
.pmv-acces__carte--laboratoire::after {
	background-color: var(--pmv-vert-texte);
}

.pmv-acces__entete {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 8px;
}

.pmv-acces__titre {
	margin: 0;
	font-family: var(--pmv-police-titre);
	font-size: 19px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.25;
	color: var(--pmv-bleu);
}

.pmv-acces__carte .pmv-carte__texte {
	margin-bottom: 18px;
}

.pmv-acces__lien {
	margin: auto 0 0;
	font-family: var(--pmv-police-titre);
	font-size: 14px;
	font-weight: var(--pmv-graisse-titre);
}

.pmv-acces__lien a {
	color: var(--pmv-bleu);
}

/*
 * Astra souligne tous les liens du contenu
 * (« .ast-single-post .entry-content a », deux classes et un élément). Le
 * handoff ne souligne que le corps de texte : « Consulter » et les liens des
 * blocs Pôle et MSP sont des affordances de bloc, pas de la prose. Les
 * sélecteurs ci-dessous passent une classe au-dessus de celui d'Astra, ce qui
 * suffit à l'emporter sans `!important`.
 */
.entry-content .pmv-acces__carte .pmv-acces__lien a,
.entry-content .pmv-poles__bloc .pmv-poles__lien a {
	text-decoration: none;
}

.entry-content .pmv-poles__bloc .pmv-poles__lien a:hover,
.entry-content .pmv-poles__bloc .pmv-poles__lien a:focus {
	text-decoration: underline;
}

/*
 * Carte entièrement cliquable : le lien est étiré sur toute la cellule.
 * Le focus est porté par la carte et non par le seul libellé ; l'anneau est
 * rentré de 2 px car le conteneur de grille masque ce qui dépasse.
 *
 * Le sélecteur est volontairement ancré à `.pmv-acces__carte`. Sans cette
 * ancre, il suivait la classe `.pmv-acces__lien` partout où elle était
 * reprise : hors d'une carte positionnée, le pseudo-élément prenait pour bloc
 * conteneur le conteneur de page et recouvrait tout ce qui s'y trouvait.
 * L'étirement n'a de sens que dans une carte dont l'unique fonction est de
 * conduire ailleurs.
 */
.pmv-acces__carte .pmv-acces__lien a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.pmv-acces__carte:hover {
	background: var(--pmv-survol-carte);
}

.pmv-acces__carte:focus-within {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: -2px;
}

/* La carte porte déjà l'anneau : double anneau évité, mais là seulement. */
.pmv-acces__carte .pmv-acces__lien a:focus-visible {
	outline: none;
}

/* ------------------------------------------------------------------ *
 * 16 bis. Lien externe posé hors d'une carte navigante
 *
 * Même allure que « Consulter », mais rien d'étiré : seuls le libellé et sa
 * marge tactile agissent. La hauteur de cible s'obtient par rembourrage
 * local, jamais en recouvrant l'encart qui l'entoure.
 * ------------------------------------------------------------------ */

.pmv-lien-externe {
	margin: 10px 0 0;
	font-family: var(--pmv-police-titre);
	font-size: 14px;
	font-weight: var(--pmv-graisse-titre);
}

.pmv-lien-externe a {
	display: inline-flex;
	align-items: center;
	padding: 4px 0;
	color: var(--pmv-bleu);
}

/* Sous 1025 px l'écran est tactile : la cible atteint la hauteur commune. */
@media (max-width: 1024.98px) {
	.pmv-lien-externe a {
		min-height: var(--pmv-cible-tactile);
	}
}

/* ------------------------------------------------------------------ *
 * 17. Pôle et MSP
 *
 * Deux blocs distincts et reliés : le bleu pétrole porte le Pôle, la surface
 * verte claire sert de simple repère à la MSP, jamais de seconde marque.
 * ------------------------------------------------------------------ */

.pmv-poles__grille {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

@media (max-width: 767.98px) {
	.pmv-poles__grille {
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

.pmv-poles__bloc {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 44px;
	border-radius: var(--pmv-rayon-carte);
}

@media (max-width: 767.98px) {
	.pmv-poles__bloc {
		padding: 28px 24px;
	}
}

.pmv-poles__titre {
	margin: 0 0 14px;
	font-family: var(--pmv-police-titre);
	font-size: 28px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.2;
}

@media (max-width: 767.98px) {
	.pmv-poles__titre {
		font-size: 21px;
	}
}

.pmv-poles__bloc--msp .pmv-poles__titre {
	color: var(--pmv-bleu);
}

/* Pastille verte : repère décoratif de la MSP, tracé en CSS. */
.pmv-poles__bloc--msp .pmv-poles__titre::before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	margin-right: 10px;
	border-radius: 50%;
	background: var(--pmv-vert);
	vertical-align: middle;
}

.pmv-poles__texte {
	margin: 0 0 22px;
	font-size: 16px;
	line-height: 1.7;
}

.pmv-poles__bloc--msp .pmv-poles__texte {
	color: var(--pmv-texte);
}

.pmv-poles__lien {
	margin: auto 0 0;
	font-family: var(--pmv-police-titre);
	font-size: 15px;
	font-weight: var(--pmv-graisse-titre);
}

.pmv-poles__lien a {
	text-decoration: none;
}

.pmv-poles__bloc--msp .pmv-poles__lien a {
	color: var(--pmv-bleu);
}

.pmv-poles__lien a:hover,
.pmv-poles__lien a:focus {
	text-decoration: underline;
}

/* ------------------------------------------------------------------ *
 * 18. Repères dans le bâtiment
 * ------------------------------------------------------------------ */

.pmv-reperes__grille {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 64px;
	align-items: start;
}

@media (max-width: 767.98px) {
	.pmv-reperes__grille {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

.pmv-reperes__grille .pmv-section__titre {
	margin-bottom: 0;
}

.pmv-etages {
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-etages__ligne {
	display: flex;
	align-items: center;
	gap: 22px;
	min-height: var(--pmv-cible-tactile);
	padding: 22px 32px;
	border-bottom: 1px solid var(--pmv-bordure);
}

.pmv-etages__ligne:last-child {
	border-bottom: 0;
}

@media (max-width: 767.98px) {
	.pmv-etages__ligne {
		gap: 16px;
		padding: 18px 16px;
	}
}

.pmv-etages__niveau {
	flex: none;
	width: 56px;
}

.pmv-etages__niveau .pmv-etage {
	margin: 0;
	line-height: 1.1;
}

.pmv-etages__unite {
	margin: 0;
	font-size: 13px;
	line-height: 1.3;
	color: var(--pmv-texte-secondaire);
}

.pmv-etages__libelle {
	margin: 0;
	font-family: var(--pmv-police-titre);
	font-size: 17px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.35;
	color: var(--pmv-bleu);
}

@media (max-width: 767.98px) {
	.pmv-etages__libelle {
		font-size: 15px;
	}
}

/*
 * Ligne d'étage entièrement cliquable. Même mécanique que la liste des
 * cabinets (section 25) : la ligne porte le positionnement, le lien l'étire
 * par un pseudo-élément, et l'anneau de focus est rendu par la ligne, jamais
 * par le seul libellé. L'anneau est rentré de 2 px car `.pmv-etages` masque
 * ce qui dépasse.
 *
 * La modificatrice n'est pas cosmétique : sans `position: relative` sur la
 * ligne, le pseudo-élément prendrait pour bloc conteneur le conteneur du site
 * et capterait les clics bien au-delà de sa propre ligne.
 */
.pmv-etages__ligne--cliquable {
	position: relative;
	transition: background-color 0.15s ease;
}

.pmv-etages__ligne--cliquable:hover {
	background: var(--pmv-survol-carte);
}

.pmv-etages__ligne--cliquable:focus-within {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: -2px;
}

.pmv-etages__lien {
	color: inherit;
	text-decoration: none;
}

.pmv-etages__lien::after {
	content: "";
	position: absolute;
	inset: 0;
}

/* La ligne porte déjà l'anneau : on évite le double anneau sur le lien étiré. */
.pmv-etages__ligne--cliquable .pmv-etages__lien:focus-visible {
	outline: none;
}

/* Au-dessus du soulignement de contenu d'Astra, comme pour la liste. */
.entry-content .pmv-etages .pmv-etages__lien {
	text-decoration: none;
}

.pmv-etages__note {
	margin: 16px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--pmv-texte-secondaire);
}

@media (max-width: 767.98px) {
	.pmv-etages__note {
		font-size: var(--pmv-taille-description);
	}
}
/* ------------------------------------------------------------------ *
 * 19. Bloc professionnels
 *
 * Bannière horizontale bordée : texte à gauche, appel à l'action à droite.
 * Composition volontairement non centrée, et distincte des grilles de cartes
 * qui la précèdent.
 * ------------------------------------------------------------------ */

.pmv-pros__bloc {
	display: flex;
	align-items: center;
	gap: 48px;
	padding: 52px 56px;
	background: var(--pmv-ivoire);
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
}

.pmv-pros__texte {
	flex: 1 1 auto;
	max-width: 640px;
}

.pmv-pros__titre {
	margin: 0 0 12px;
	font-family: var(--pmv-police-titre);
	font-size: 30px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.2;
	color: var(--pmv-bleu);
}

.pmv-pros__intro {
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--pmv-texte-secondaire);
}

.pmv-pros__action {
	flex: none;
	margin: 0;
}

@media (max-width: 767.98px) {
	.pmv-pros__bloc {
		flex-direction: column;
		align-items: stretch;
		gap: 18px;
		padding: 28px 24px;
	}

	.pmv-pros__titre {
		font-size: 21px;
	}

	.pmv-pros__action .wp-block-button,
	.pmv-pros__action .wp-block-button__link {
		display: block;
		width: 100%;
		text-align: center;
	}
}

/* ------------------------------------------------------------------ *
 * 20. Bloc MSP
 *
 * Surface verte très claire, trois catégories posées en colonnes
 * typographiques séparées par des filets. Délibérément sans cartes bordées :
 * la grille d'accès rapide occupe déjà cette composition plus haut dans la
 * page, et la répéter donnerait deux fois le même moment.
 * ------------------------------------------------------------------ */

.pmv-msp__bloc {
	padding: 56px;
	background: var(--pmv-vert-clair);
	border-radius: var(--pmv-rayon-carte);
}

.pmv-msp__titre {
	margin: 0 0 14px;
	font-family: var(--pmv-police-titre);
	font-size: 32px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.2;
	color: var(--pmv-bleu);
}

.pmv-msp__intro {
	margin: 0 0 32px;
	max-width: 640px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--pmv-texte);
}

.pmv-msp__categories {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0 0 32px;
	padding-top: 28px;
	border-top: 1px solid rgba(15, 76, 92, 0.14);
}

.pmv-msp__categorie {
	padding: 0 28px;
}

.pmv-msp__categorie:first-child {
	padding-left: 0;
}

.pmv-msp__categorie:last-child {
	padding-right: 0;
}

.pmv-msp__categorie + .pmv-msp__categorie {
	border-left: 1px solid rgba(15, 76, 92, 0.14);
}

/*
 * Sous 1025 px, les trois colonnes deviennent illisibles : à 768 px la colonne
 * centrale tombait à 119 px de large, soit une quinzaine de caractères par
 * ligne sur six lignes. Les catégories s'empilent donc, les filets verticaux
 * passant à l'horizontale. Deux colonnes laisseraient un orphelin sur trois
 * éléments.
 */
@media (max-width: 1024.98px) {
	.pmv-msp__categories {
		grid-template-columns: 1fr;
	}

	.pmv-msp__categorie {
		padding: 18px 0;
	}

	.pmv-msp__categorie:first-child {
		padding-top: 0;
	}

	.pmv-msp__categorie:last-child {
		padding-bottom: 0;
	}

	.pmv-msp__categorie + .pmv-msp__categorie {
		border-left: 0;
		border-top: 1px solid rgba(15, 76, 92, 0.14);
	}
}

/* Le vert porteur de texte est le vert accessible, jamais le vert doux. */
.pmv-msp__categorie-titre {
	margin: 0 0 6px;
	font-family: var(--pmv-police-titre);
	font-size: 17px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-vert-texte);
}

.pmv-msp__categorie-texte {
	margin: 0;
	font-size: var(--pmv-taille-description);
	line-height: 1.6;
	color: var(--pmv-texte);
}

.pmv-msp__action {
	margin: 0;
}

@media (max-width: 767.98px) {
	.pmv-msp__bloc {
		padding: 28px 24px;
	}

	.pmv-msp__titre {
		font-size: 22px;
	}

	.pmv-msp__intro {
		margin-bottom: 22px;
	}

	.pmv-msp__categories {
		grid-template-columns: 1fr;
		margin-bottom: 22px;
		padding-top: 18px;
	}

	.pmv-msp__categorie {
		padding: 16px 0;
	}

	.pmv-msp__categorie:first-child {
		padding-top: 0;
	}

	.pmv-msp__categorie + .pmv-msp__categorie {
		border-left: 0;
		border-top: 1px solid rgba(15, 76, 92, 0.14);
	}

	.pmv-msp__action .wp-block-button,
	.pmv-msp__action .wp-block-button__link {
		display: block;
		width: 100%;
		text-align: center;
	}
}

/* ------------------------------------------------------------------ *
 * 21. Informations pratiques
 * ------------------------------------------------------------------ */

.pmv-infos__grille {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: start;
}

@media (max-width: 767.98px) {
	.pmv-infos__grille {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

/* Le titre de section précède immédiatement l'adresse : écart resserré. */
.pmv-infos__colonne .pmv-section__titre {
	margin-bottom: 16px;
}

.pmv-infos__adresse {
	margin: 0 0 22px;
	font-family: var(--pmv-police-titre);
	font-size: 30px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.25;
	color: var(--pmv-bleu);
}

@media (max-width: 767.98px) {
	.pmv-infos__adresse {
		font-size: 21px;
	}
}

.pmv-infos__actions {
	gap: 14px;
	margin: 0 0 32px;
}

@media (max-width: 767.98px) {
	.pmv-infos__actions {
		flex-direction: column;
		gap: 12px;
		margin-bottom: 24px;
	}

	.pmv-infos__actions .wp-block-button,
	.pmv-infos__actions .wp-block-button__link {
		display: block;
		width: 100%;
		text-align: center;
	}
}

/*
 * Quatre repères à compléter. Ils restent en 2x2 jusqu'en mobile, comme le
 * prévoit la section D du handoff.
 */
.pmv-infos__reperes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

@media (max-width: 767.98px) {
	.pmv-infos__reperes {
		gap: 12px;
	}
}

.pmv-infos__repere {
	padding: 20px;
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-bouton);
}

@media (max-width: 767.98px) {
	.pmv-infos__repere {
		padding: 16px;
	}
}

.pmv-infos__repere-titre {
	margin: 0 0 4px;
	font-family: var(--pmv-police-titre);
	font-size: 15px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-bleu);
}

/*
 * Le gris atténué plafonne à 3,08:1 : ces placeholders portent une information
 * que le visiteur doit pouvoir lire, ils emploient donc le gris secondaire.
 */
.pmv-infos__repere-texte {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--pmv-texte-secondaire);
}

/*
 * Encart « Accès et itinéraire » : une carte informative, pas une carte
 * navigante. Aucun lien étiré ici. Le titre, l'adresse et le texte doivent
 * pouvoir être lus, sélectionnés et copiés ; seules les deux actions agissent.
 */
.pmv-infos__itineraire {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.pmv-infos__itineraire > * {
	margin: 0;
}

.pmv-infos__itineraire-adresse {
	font-family: var(--pmv-police-titre);
	font-size: 21px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.25;
	color: var(--pmv-bleu);
}

.pmv-infos__itineraire .wp-block-buttons {
	margin-top: 4px;
}

@media (max-width: 767.98px) {
	.pmv-infos__itineraire-adresse {
		font-size: 19px;
	}
}

/* Écarts de bloc neutralisés sur les conteneurs pilotés ici. */
.pmv-pros__bloc > *,
.pmv-msp__categories,
.pmv-msp__categories > *,
.pmv-infos__grille > *,
.pmv-infos__reperes,
.pmv-infos__reperes > * {
	margin-block: 0;
}

/* ------------------------------------------------------------------ *
 * 22. Pages internes et fil d'Ariane
 *
 * Les pages internes reprennent la mécanique de sections de l'accueil :
 * chaque bande porte son padding latéral et sa largeur maximale, et rien
 * ne dépend des conteneurs d'Astra. Le fil d'Ariane et les sections
 * dynamiques sont injectés par les gabarits de part et d'autre du contenu
 * éditorial, dans « .entry-content » : ils portent donc les mêmes classes
 * de section que les blocs Gutenberg qui les entourent.
 * ------------------------------------------------------------------ */

.pmv-fil {
	padding-top: 48px;
	padding-bottom: 0;
	font-size: var(--pmv-taille-fil);
	line-height: 1.5;
}

.pmv-fil__liste {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pmv-fil__niveau {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--pmv-texte-secondaire);
}

/*
 * Séparateur tracé en CSS : la barre oblique est un repère visuel, elle n'a
 * pas à être restituée entre chaque libellé par un lecteur d'écran.
 */
.pmv-fil__niveau + .pmv-fil__niveau::before {
	content: "/";
	color: var(--pmv-separateur-fil);
}

.pmv-fil__niveau a {
	color: var(--pmv-texte-secondaire);
	text-decoration: none;
}

.pmv-fil__niveau a:hover,
.pmv-fil__niveau a:focus {
	color: var(--pmv-bleu);
	text-decoration: underline;
}

.pmv-fil__niveau [aria-current="page"] {
	color: var(--pmv-bleu);
	font-weight: var(--pmv-graisse-corps-forte);
}

@media (max-width: 767.98px) {
	.pmv-fil {
		padding-top: 24px;
	}
}

/*
 * Bande éditoriale d'une page interne : elle ouvre la page sous le fil
 * d'Ariane et se referme sur les sections dynamiques, qui portent elles-mêmes
 * l'écart suivant.
 */
.pmv-interne {
	--wp--custom--ast-default-block-top-padding: 32px;
	--wp--custom--ast-default-block-bottom-padding: 0;

	padding-top: 32px;
	padding-bottom: 0;
}

@media (max-width: 767.98px) {
	.pmv-interne {
		--wp--custom--ast-default-block-top-padding: 20px;

		padding-top: 20px;
	}
}

/* Titre de page interne : 44 px, contre 60 px pour le H1 de l'accueil. */
.pmv-interne__titre {
	margin: 0 0 14px;
	font-family: var(--pmv-police-titre);
	font-size: 44px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.12;
	color: var(--pmv-bleu);
}

.pmv-kicker + .pmv-interne__titre {
	margin-top: 10px;
}

@media (max-width: 767.98px) {
	.pmv-interne__titre {
		margin-bottom: 12px;
		font-size: 30px;
		line-height: 1.18;
	}
}

.pmv-interne__intro {
	margin: 0 0 28px;
	max-width: var(--pmv-largeur-paragraphe);
	font-size: 17px;
	line-height: 1.7;
	color: var(--pmv-texte);
}

.pmv-interne__note {
	margin: -14px 0 28px;
	max-width: var(--pmv-largeur-paragraphe);
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

@media (max-width: 767.98px) {
	.pmv-interne__intro {
		margin-bottom: 20px;
		font-size: var(--pmv-taille-corps-mobile);
	}

	.pmv-interne__note {
		margin: -10px 0 20px;
	}
}

/* Repère de localisation d'un regroupement : étage, ou entrée distincte. */
.pmv-interne__reperes {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 8px;
}

/* ------------------------------------------------------------------ *
 * 23. Grille des six regroupements
 *
 * Même grille de cellules jointives que l'accès rapide de l'accueil, mais
 * sans pastille : le maquettage de l'annuaire pose des cartes purement
 * typographiques. Toute la mécanique de filets, de survol et de focus est
 * héritée de la section 16 ; seules la pastille et le padding changent.
 * ------------------------------------------------------------------ */

.pmv-groupes .pmv-acces__carte {
	padding: 26px;
}

.pmv-groupes .pmv-acces__carte::before,
.pmv-groupes .pmv-acces__carte::after {
	content: none;
}

@media (max-width: 767.98px) {
	.pmv-groupes .pmv-acces__carte {
		padding: var(--pmv-pad-carte-mobile);
	}
}

/* ------------------------------------------------------------------ *
 * 24. Sections dynamiques de l'annuaire
 * ------------------------------------------------------------------ */

.pmv-annuaire {
	padding-top: 44px;
	padding-bottom: 40px;
}

/*
 * Sur la page principale, aucune section de retour ne suit : la bande ferme
 * la page et reprend l'écart bas des autres sections du site.
 */
.pmv-annuaire:last-child {
	padding-bottom: 88px;
}

@media (max-width: 767.98px) {
	.pmv-annuaire {
		padding-top: 28px;
		padding-bottom: 24px;
	}

	.pmv-annuaire:last-child {
		padding-bottom: 44px;
	}
}

.pmv-annuaire__titre {
	margin: 0 0 20px;
	font-family: var(--pmv-police-titre);
	font-size: 28px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.2;
	color: var(--pmv-bleu);
}

.pmv-annuaire__titre--suite {
	margin-top: 48px;
}

@media (max-width: 767.98px) {
	.pmv-annuaire__titre {
		margin-bottom: 14px;
		font-size: 22px;
	}

	.pmv-annuaire__titre--suite {
		margin-top: 32px;
	}
}

/* ------------------------------------------------------------------ *
 * 25. Liste des cabinets et structures
 *
 * Liste bordée dont chaque ligne est entièrement cliquable : le lien porte
 * le nom, et un pseudo-élément l'étire sur toute la surface. Le focus est
 * rendu par la ligne, jamais par le seul libellé.
 * ------------------------------------------------------------------ */

.pmv-strucs {
	margin: 0;
	padding: 0;
	list-style: none;
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-strucs__ligne {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: var(--pmv-cible-tactile);
	padding: 24px 28px;
	border-bottom: 1px solid var(--pmv-bordure);
	transition: background-color 0.15s ease;
}

.pmv-strucs__ligne:last-child {
	border-bottom: 0;
}

.pmv-strucs__ligne:hover {
	background: var(--pmv-survol-carte);
}

.pmv-strucs__ligne:focus-within {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: -2px;
}

.pmv-strucs__corps {
	display: block;
}

.pmv-strucs__lien {
	display: block;
	font-family: var(--pmv-police-titre);
	font-size: 18px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-bleu);
	text-decoration: none;
}

.pmv-strucs__lien::after {
	content: "";
	position: absolute;
	inset: 0;
}

.pmv-strucs__lien:focus-visible {
	outline: none;
}

/* Astra souligne tous les liens du contenu : ces lignes sont des
   affordances de liste, pas de la prose. */
.entry-content .pmv-strucs .pmv-strucs__lien {
	text-decoration: none;
}

.pmv-strucs__meta {
	display: block;
	margin-top: 3px;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

.pmv-strucs__fleche {
	flex: none;
	font-family: var(--pmv-police-titre);
	font-size: 17px;
	font-weight: var(--pmv-graisse-titre);
	color: var(--pmv-bleu);
}

@media (max-width: 767.98px) {
	.pmv-strucs__ligne {
		padding: 17px 16px;
	}

	.pmv-strucs__lien {
		font-size: 16px;
	}
}

/* ------------------------------------------------------------------ *
 * 26. Grille des professionnels
 * ------------------------------------------------------------------ */

.pmv-pratics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--pmv-gap-grille);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 768px) and (max-width: 1024.98px) {
	.pmv-pratics {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 767.98px) {
	.pmv-pratics {
		grid-template-columns: 1fr;
		gap: var(--pmv-gap-grille-mobile);
	}
}

.pmv-pratics__cellule {
	display: flex;
}

.pmv-pratic {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	padding: 26px;
}

@media (max-width: 767.98px) {
	.pmv-pratic {
		padding: var(--pmv-pad-carte-mobile);
	}
}

/*
 * Photographie ronde, ou monogramme sur fond bleu clair. Le handoff réserve
 * le cercle aux portraits de liste ; aucune image générique n'est jamais
 * affichée à la place d'une photographie manquante.
 */
.pmv-pratic__photo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin-bottom: 14px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--pmv-bleu-clair);
}

.pmv-pratic__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.pmv-pratic__photo--monogramme {
	font-family: var(--pmv-police-titre);
	font-size: 20px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1;
	color: var(--pmv-bleu);
}

.pmv-pratic__nom {
	margin: 0 0 4px;
	font-family: var(--pmv-police-titre);
	font-size: 17px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-bleu);
}

.pmv-pratic__nom a {
	color: inherit;
	text-decoration: none;
}

.entry-content .pmv-pratic__nom a {
	text-decoration: none;
}

.pmv-pratic__profession {
	margin: 0;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

.pmv-pratic__badges {
	margin: 14px 0 0;
}

/* ------------------------------------------------------------------ *
 * 26 bis. Bouton « Prendre rendez-vous » des cartes et des lignes
 *
 * Le titre d'une carte, comme le nom d'une ligne, porte un lien étiré sur
 * toute la surface par un pseudo-élément. Le bouton doit donc passer
 * au-dessus de cet étirement, faute de quoi il serait recouvert et le clic
 * partirait vers la fiche. Aucun lien n'est imbriqué dans un autre : ce sont
 * deux liens frères, l'un étiré, l'autre posé par-dessus.
 *
 * Le bouton garde la hauteur de cible tactile commune : seul le rembourrage
 * horizontal est réduit, pour tenir dans une carte de grille.
 * ------------------------------------------------------------------ */

.pmv-btn--compact {
	padding: 10px 18px;
	font-size: var(--pmv-taille-description);
}

.pmv-rdv {
	position: relative;
	z-index: 1;
}

.pmv-rdv__ext {
	margin-left: 6px;
	font-size: 0.9em;
}

.pmv-pratic .pmv-rdv {
	align-self: flex-start;
	margin-top: 16px;
}

/* La carte pousse le bouton en pied : les cartes d'une même ligne s'alignent. */
.pmv-pratic__badges + .pmv-rdv,
.pmv-pratic__profession + .pmv-rdv {
	margin-top: 16px;
}

.pmv-strucs__ligne .pmv-rdv {
	flex: none;
	margin-left: auto;
}

/*
 * Sur mobile, la ligne d'un lieu passe à deux niveaux plutôt que de comprimer
 * le nom : le bouton descend sous le libellé et occupe la largeur utile.
 */
@media (max-width: 767.98px) {
	.pmv-strucs__ligne {
		flex-wrap: wrap;
	}

	.pmv-strucs__corps {
		flex: 1 1 100%;
		min-width: 0;
	}

	.pmv-strucs__ligne .pmv-rdv {
		margin-left: 0;
	}
}

/*
 * L'anneau de focus de la carte ou de la ligne ne répond qu'au lien étiré :
 * le bouton porte le sien, et l'on évite deux anneaux emboîtés. Les
 * navigateurs sans :has() ignorent la règle et affichent les deux : le focus
 * reste visible dans tous les cas.
 */
.pmv-carte--cliquable:has(.pmv-rdv:focus-visible),
.pmv-strucs__ligne:has(.pmv-rdv:focus-visible) {
	outline: none;
}

.pmv-rdv:focus-visible {
	outline: 2px solid var(--pmv-bleu);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------ *
 * 27. Fiches praticien et cabinet
 *
 * Deux colonnes 1.15 / 0.85 sur le bureau, empilées en deçà. La colonne de
 * droite n'est rendue que si elle a quelque chose à porter : aucune carte
 * vide, aucun encart « à venir » pour une donnée que le modèle ne connaît
 * pas encore.
 * ------------------------------------------------------------------ */

.pmv-fiche__section {
	padding-top: 32px;
	padding-bottom: 40px;
}

@media (max-width: 767.98px) {
	.pmv-fiche__section {
		padding-top: 20px;
		padding-bottom: 24px;
	}
}

.pmv-fiche__grille {
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 56px;
	align-items: start;
}

@media (max-width: 1024.98px) {
	.pmv-fiche__grille {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

.pmv-fiche__entete {
	display: flex;
	align-items: flex-start;
	gap: 28px;
	margin-bottom: 32px;
}

@media (max-width: 767.98px) {
	.pmv-fiche__entete {
		gap: 18px;
		margin-bottom: 24px;
	}
}

.pmv-fiche__portrait {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 128px;
	height: 128px;
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
	background: var(--pmv-bleu-clair);
}

.pmv-fiche__portrait--monogramme {
	font-family: var(--pmv-police-titre);
	font-size: 38px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1;
	color: var(--pmv-bleu);
}

.pmv-fiche__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 767.98px) {
	.pmv-fiche__portrait {
		width: 88px;
		height: 88px;
	}

	.pmv-fiche__portrait--monogramme {
		font-size: 26px;
	}
}

.pmv-fiche__titre {
	margin: 0 0 8px;
	font-family: var(--pmv-police-titre);
	font-size: 40px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.12;
	color: var(--pmv-bleu);
}

@media (max-width: 767.98px) {
	.pmv-fiche__titre {
		font-size: 28px;
		line-height: 1.18;
	}
}

.pmv-fiche__profession {
	margin: 0 0 14px;
	font-size: 18px;
	line-height: 1.5;
	color: var(--pmv-texte-secondaire);
}

@media (max-width: 767.98px) {
	.pmv-fiche__profession {
		font-size: var(--pmv-taille-corps-mobile);
	}
}

.pmv-fiche__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 28px;
}

.pmv-fiche__entete .pmv-fiche__badges {
	margin-bottom: 0;
}

.pmv-fiche__soustitre {
	margin: 40px 0 14px;
	font-family: var(--pmv-police-titre);
	font-size: 24px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.25;
	color: var(--pmv-bleu);
}

.pmv-fiche__entete + .pmv-fiche__soustitre,
.pmv-fiche__badges + .pmv-fiche__soustitre {
	margin-top: 0;
}

@media (max-width: 767.98px) {
	.pmv-fiche__soustitre {
		margin: 28px 0 12px;
		font-size: 20px;
	}
}

.pmv-fiche__contenu {
	max-width: var(--pmv-largeur-paragraphe);
}

/* La colonne de droite : blocs empilés, jamais de carte vide. */
.pmv-fiche__aside {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.pmv-fiche__visuel {
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-fiche__visuel .pmv-fiche__image {
	display: block;
	width: 100%;
	height: auto;
}

.pmv-fiche__bloc {
	padding: 26px;
	background: var(--pmv-blanc);
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
}

.pmv-fiche__bloc--verte {
	background: var(--pmv-vert-surface);
	border-color: transparent;
}

.pmv-fiche__bloc-titre {
	margin: 0 0 8px;
	font-family: var(--pmv-police-titre);
	font-size: 19px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-bleu);
}

.pmv-fiche__bloc-texte {
	margin: 0 0 16px;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte);
}

.pmv-fiche__bloc-action {
	width: 100%;
}

/* Liste des praticiens d'un cabinet : de un à N, hauteur de ligne constante. */
.pmv-equipe {
	margin: 0;
	padding: 0;
	list-style: none;
	border: var(--pmv-trait);
	border-radius: var(--pmv-rayon-carte);
	overflow: hidden;
}

.pmv-equipe__ligne {
	display: flex;
	align-items: center;
	gap: 16px;
	min-height: var(--pmv-cible-tactile);
	padding: 20px 24px;
	border-bottom: 1px solid var(--pmv-bordure);
}

.pmv-equipe__ligne:last-child {
	border-bottom: 0;
}

.pmv-equipe__photo {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--pmv-bleu-clair);
}

.pmv-equipe__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.pmv-equipe__photo--monogramme {
	font-family: var(--pmv-police-titre);
	font-size: 17px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1;
	color: var(--pmv-bleu);
}

.pmv-equipe__identite {
	margin-right: auto;
}

.pmv-equipe__nom {
	display: block;
	font-family: var(--pmv-police-titre);
	font-size: 16px;
	font-weight: var(--pmv-graisse-titre);
	line-height: 1.3;
	color: var(--pmv-bleu);
}

.pmv-equipe__profession {
	display: block;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

.pmv-equipe__action {
	flex: none;
	padding: 11px 18px;
	font-size: 14px;
}

@media (max-width: 767.98px) {
	.pmv-equipe__ligne {
		flex-wrap: wrap;
		padding: 16px;
	}

	.pmv-equipe__action {
		width: 100%;
	}
}

/* ------------------------------------------------------------------ *
 * 28. Retour vers l'annuaire
 * ------------------------------------------------------------------ */

.pmv-retour {
	padding-top: 0;
	padding-bottom: 88px;
}

@media (max-width: 767.98px) {
	.pmv-retour {
		padding-bottom: 44px;
	}

	.pmv-retour .pmv-btn {
		display: flex;
		width: 100%;
	}
}

/* Écarts de bloc neutralisés sur les conteneurs pilotés par ces sections. */
.pmv-fil__liste,
.pmv-fil__liste > *,
.pmv-strucs,
.pmv-strucs > *,
.pmv-pratics,
.pmv-pratics > *,
.pmv-equipe,
.pmv-equipe > *,
.pmv-fiche__grille > *,
.pmv-fiche__aside > * {
	margin-block: 0;
}

/* ------------------------------------------------------------------ *
 * 29. Coordonnées d'une fiche
 *
 * Liste de définitions : l'intitulé et la valeur restent associés pour un
 * lecteur d'écran, là où deux colonnes de texte ne le diraient pas. Rien
 * n'est rendu quand une fiche n'a aucune coordonnée : les encarts sont
 * conditionnés côté gabarit, pas masqués en CSS.
 * ------------------------------------------------------------------ */

.pmv-coord {
	margin: 0;
}

.pmv-coord__ligne {
	padding: 12px 0;
	border-bottom: 1px solid var(--pmv-bordure);
}

.pmv-coord__ligne:first-child {
	padding-top: 0;
}

.pmv-coord__ligne:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.pmv-coord dt {
	margin: 0 0 2px;
	font-family: var(--pmv-police-corps);
	font-size: 13px;
	font-weight: var(--pmv-graisse-corps-forte);
	line-height: 1.4;
	color: var(--pmv-texte-secondaire);
}

.pmv-coord dd {
	margin: 0;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte);
	/* Une adresse longue ou un domaine sans espace ne débordent jamais. */
	overflow-wrap: anywhere;
}

.pmv-coord dd a {
	color: var(--pmv-bleu);
}

.pmv-coord__note {
	margin: 16px 0 0;
	font-size: var(--pmv-taille-description);
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte);
}

/* Le bloc de coordonnées suit un titre : l'écart est repris ici. */
.pmv-fiche__bloc-titre + .pmv-coord {
	margin-top: 12px;
}

.pmv-fiche__bloc-texte + .pmv-coord {
	margin-top: 4px;
}

/*
 * Mention d'aperçu.
 *
 * Visible uniquement dans une prévisualisation authentifiée : elle signale
 * qu'un élément affiché n'est pas encore public. Traitée comme un état vide —
 * bordure pointillée, gris secondaire lisible — pour qu'on ne la confonde pas
 * avec du contenu du site.
 */
.pmv-apercu {
	margin: 14px 0 0;
	padding: 12px 14px;
	border: var(--pmv-trait-vide);
	border-radius: var(--pmv-rayon-bouton);
	font-size: 14px;
	line-height: var(--pmv-interligne-description);
	color: var(--pmv-texte-secondaire);
}

.pmv-fiche__principal .pmv-apercu {
	margin-top: 12px;
}

/* Écarts de bloc neutralisés sur les conteneurs pilotés ici. */
.pmv-coord,
.pmv-coord > * {
	margin-block: 0;
}