/**
 * Aux 4 Pattes One : mouvement (animations discrètes).
 * Règles : seulement transform / opacity (clip-path, stroke-dashoffset pour un tracé) ; rien en boucle ;
 * le titre et la grande photo du haut de page ne partent jamais invisibles (LCP) ; tout est coupé
 * pour les personnes qui ont demandé moins d'animations (bloc prefers-reduced-motion: no-preference).
 * Les états « caché avant l'entrée » (.a4p-av) ne sont posés que par assets/js/mouvement.js :
 * sans JavaScript, tout reste visible.
 */
:root {
	--a4p-mv-courbe: cubic-bezier(.2, .7, .2, 1);
	--a4p-mv-trace: cubic-bezier(.6, 0, .2, 1);
	--a4p-mv-rebond: cubic-bezier(.3, 1.4, .5, 1);
	--a4p-mv-distance: 24px;
	--a4p-mv-court: .25s;
	--a4p-mv-moyen: .6s;
	--a4p-mv-long: 1.1s;
	--a4p-mv-pas: .09s;
	--a4p-mv-pas-mot: .07s;
	--a4p-mv-pas-etape: .45s;
	--a4p-mv-zoom: 1.06;
	--a4p-mv-page: .22s;
	/* Réglages de départ : facteur de lenteur des animations, délai après l'entrée d'une zone dans l'écran, délai du haut de page. */
	--a4p-mv-facteur: 1.3;
	--a4p-mv-delai-defilement: .5s;
	--a4p-mv-delai-haut: 1s;
	--a4p-mv-opacite-ini: .35;
	--a4p-mv-distance-ini: 24px;
	--a4p-avis-lignes: 4;
}

@media (prefers-reduced-motion: no-preference) {

	/* ---- t1 · Fondu entre les pages (sans JavaScript) ---- */
	@view-transition { navigation: auto; }
	::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--a4p-mv-page); }
	/* L'en-tête et la barre d'appel du téléphone restent en place pendant le fondu. */
	header.wp-block-template-part:has(> .a4p-hd) { view-transition-name: a4p-entete; }
	.a4p-actions-tel { view-transition-name: a4p-actions; }

	/* ---- Entrée au défilement : états posés par le script ---- */
	.a4p-av:not(.a4p-vu):not(.a4p-solo) > * { opacity: 0; }
	.a4p-solo.a4p-av:not(.a4p-vu) { opacity: 0; }
	.a4p-solo.a4p-vu { animation: a4p-monte calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) var(--a4p-mv-delai-defilement) backwards; }
	.a4p-vu:not(.a4p-solo) > * {
		animation: a4p-monte calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + var(--i, 0) * var(--a4p-mv-pas));
	}
	/* Zone déjà à l'écran à l'ouverture : elle joue son entrée ~1 s après l'ouverture, sans jamais disparaître tout à fait
	   (opacité de départ > 0 : une image du haut de page ne retarde pas le LCP). */
	.a4p-ini { --a4p-mv-delai-defilement: var(--a4p-mv-delai-haut); }
	.a4p-ini.a4p-vu:not(.a4p-solo) > *, .a4p-solo.a4p-ini.a4p-vu { animation-name: a4p-monte-ini; }
	@keyframes a4p-monte-ini { from { opacity: var(--a4p-mv-opacite-ini); transform: translateY(var(--a4p-mv-distance-ini)); } }
	@keyframes a4p-monte { from { opacity: 0; transform: translateY(var(--a4p-mv-distance)); } }
	@keyframes a4p-fondu { from { opacity: 0; } }
	@keyframes a4p-pop { from { opacity: 0; transform: scale(.4); } }
	@keyframes a4p-bulle { from { opacity: 0; transform: translateY(10px) scale(.9); } }
	@keyframes a4p-montee-texte { from { transform: translateY(.4em); } }
	@keyframes a4p-souligne { from { transform: scaleX(0); } }
	@keyframes a4p-reflet { to { transform: translateX(120%); } }
	@keyframes a4p-photo-entree { from { scale: 1.12; } }
	@keyframes a4p-etoiles { from { width: 0; } }
	@keyframes a4p-fil { from { transform: scaleX(0); } }

	/* ---- 1 · Haut de page vivant (animations au chargement : le titre et la photo restent visibles) ---- */
	body .a4p-heros .a4p-eyebrow { animation: a4p-monte calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) var(--a4p-mv-delai-haut) backwards; }
	body .a4p-h1 .a4p-mot {
		display: inline-block;
		animation: a4p-montee-texte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) backwards;
		animation-delay: calc(var(--a4p-mv-delai-haut) + .12s + var(--i, 0) * var(--a4p-mv-pas-mot));
	}
	body .a4p-h1 em::after {
		transform-origin: left center;
		animation: a4p-souligne calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-trace) calc(var(--a4p-mv-delai-haut) + .85s) backwards;
	}
	body .a4p-heros .a4p-lead { animation: a4p-montee-texte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .6s) backwards; }
	body .a4p-heros .a4p-cherche { animation: a4p-monte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .75s) backwards; }
	body .a4p-cherche button { position: relative; overflow: hidden; }
	body .a4p-heros .a4p-cherche button::after {
		content: ""; position: absolute; inset: 0; pointer-events: none;
		background: linear-gradient(105deg, transparent 35%, #ffffff66 50%, transparent 65%);
		transform: translateX(-120%);
		animation: a4p-reflet calc(var(--a4p-mv-long) * var(--a4p-mv-facteur)) ease-in-out calc(var(--a4p-mv-delai-haut) + 1.6s) 1 backwards;
	}
	body .a4p-heros .a4p-preuve { animation: a4p-fondu calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) ease calc(var(--a4p-mv-delai-haut) + 1s) backwards; }
	/* Photo : seul le zoom d'arrivée (jamais invisible), puis léger suivi de la souris (variables posées par le script). */
	body .a4p-visuel .a4p-photo img {
		transform: translate3d(var(--a4p-px, 0), var(--a4p-py, 0), 0) scale(var(--a4p-mv-zoom));
		transition: transform .5s var(--a4p-mv-courbe);
		animation: a4p-photo-entree calc(1.2s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .1s) backwards;
	}
	body .a4p-f2 { animation: a4p-bulle calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) calc(var(--a4p-mv-delai-haut) + 1.1s) backwards; }
	body .a4p-f1 { animation: a4p-bulle calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) calc(var(--a4p-mv-delai-haut) + 1.3s) backwards; }
	/* 3 · étoiles du haut de page qui se remplissent (note affichée en texte, inchangée sans animation) */
	body .a4p-preuve .a4p-etoiles { position: relative; display: inline-block; color: #e9dfe3; }
	body .a4p-preuve .a4p-etoiles::before {
		content: "★★★★★"; position: absolute; inset: 0; color: var(--a4p-star); overflow: hidden; white-space: nowrap;
		width: var(--a4p-rempli, 98%);
		animation: a4p-etoiles calc(var(--a4p-mv-long) * var(--a4p-mv-facteur)) var(--a4p-mv-trace) calc(var(--a4p-mv-delai-haut) + .5s) backwards;
	}

	/* ---- Haut des autres pages : fil d'Ariane, titre et introduction montent doucement (seulement transform : jamais invisibles) ---- */
	body .a4p-ph .a4p-ariane { animation: a4p-montee-texte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) var(--a4p-mv-delai-haut) backwards; }
	body .a4p-ph .a4p-eyebrow { animation: a4p-montee-texte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .1s) backwards; }
	body .a4p-ph .a4p-ph-titre { animation: a4p-montee-texte calc(.8s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .2s) backwards; }
	body .a4p-ph .a4p-lead { animation: a4p-montee-texte calc(.7s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) calc(var(--a4p-mv-delai-haut) + .45s) backwards; }
	body .a4p-ph .a4p-preuve { animation: a4p-fondu calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) ease calc(var(--a4p-mv-delai-haut) + .7s) backwards; }

	/* ---- 2 · Cartes des soins : survol et clavier ---- */
	body .a4p-carte { transition-duration: .35s; transition-timing-function: var(--a4p-mv-courbe); }
	body .a4p-carte-img img { transition: transform .6s var(--a4p-mv-courbe); }
	body .a4p-carte:is(:hover, :focus-visible) .a4p-carte-img img { transform: scale(var(--a4p-mv-zoom)); }
	body .a4p-carte .a4p-go { transition: background .25s, color .25s, transform .25s; }
	body .a4p-carte:is(:hover, :focus-visible) .a4p-go { transform: translateX(3px); }

	/* ---- 3 · Chiffres : arrivée l'un après l'autre (le défilement sans fin des chiffres est retiré, voir plus bas) ---- */

	/* ---- 4 · Fil des 3 étapes ---- */
	@media (min-width: 821px) {
		body .a4p-etapes { position: relative; }
		body .a4p-etapes::before {
			content: ""; position: absolute; z-index: 1; top: 47px; height: 2px; left: 68px; right: calc(100% / 3 - 40px);
			background: var(--a4p-fu); border-radius: 2px; transform-origin: left center; pointer-events: none;
		}
		body .a4p-etape::after { z-index: 2; }
		body .a4p-av:not(.a4p-vu).a4p-etapes::before { transform: scaleX(0); }
		body .a4p-etapes.a4p-vu::before { animation: a4p-fil calc(1.4s * var(--a4p-mv-facteur)) var(--a4p-mv-trace) calc(var(--a4p-mv-delai-defilement) + .2s) backwards; }
	}
	body .a4p-etapes.a4p-vu > .a4p-etape { animation-delay: calc(var(--a4p-mv-delai-defilement) + .1s + var(--i, 0) * var(--a4p-mv-pas-etape)); }
	body .a4p-etapes.a4p-vu > .a4p-etape::after {
		animation: a4p-pop calc(.5s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + .15s + var(--i, 0) * var(--a4p-mv-pas-etape));
	}

	/* ---- t2 · Ouverture du panneau de menu : le panneau descend, puis les colonnes arrivent une à une ---- */
	.a4p-nav .is-menu-open .a4p-pm { animation: a4p-panneau .4s var(--a4p-mv-courbe) backwards; }
	@keyframes a4p-panneau { from { opacity: 0; transform: translateY(calc(-1 * var(--a4p-mv-distance))) scale(.985); } }
	.a4p-nav .is-menu-open .a4p-pm-grille > * {
		animation: a4p-monte .45s var(--a4p-mv-courbe) backwards;
		animation-delay: calc(.1s + var(--i, 0) * .06s);
	}
	.a4p-pm-grille > :nth-child(2) { --i: 1; }
	.a4p-pm-grille > :nth-child(3) { --i: 2; }
	.a4p-pm-grille > :nth-child(4) { --i: 3; }
	.a4p-pm-grille > :nth-child(5) { --i: 4; }

	/* ---- t3 · Barre « Appeler / Prendre rendez-vous » du téléphone : arrive en douceur, se réveille quand un créneau est choisi ---- */
	@media (max-width: 640px) {
		.a4p-actions-tel { animation: a4p-barre .5s var(--a4p-mv-courbe) .6s backwards; }
		@keyframes a4p-barre { from { transform: translateY(100%); } }
		.a4p-a-rdv { position: relative; overflow: hidden; }
		.a4p-a-rdv.a4p-reveil { animation: a4p-reveil .55s var(--a4p-mv-rebond); }
		.a4p-a-rdv.a4p-reveil::after {
			content: ""; position: absolute; inset: 0; pointer-events: none;
			background: linear-gradient(105deg, transparent 35%, #ffffff77 50%, transparent 65%);
			transform: translateX(-120%); animation: a4p-reflet .9s ease-in-out .15s both;
		}
		@keyframes a4p-reveil { 40% { transform: scale(1.05); } }
	}

	/* ---- p1 · Onglets Chiens / Chats / NAC : le curseur glisse, le déroulement du soin arrive étape par étape ---- */
	body .a4p-onglets { position: relative; }
	body .a4p-onglets a { position: relative; z-index: 1; transition: color .25s; }
	body .a4p-onglets.a4p-curseur a[aria-selected="true"] { background: transparent; }
	body .a4p-onglets.a4p-curseur::before {
		content: ""; position: absolute; top: 0; left: 0; z-index: 0; border-radius: 999px; background: var(--a4p-fu);
		width: var(--a4p-cw, 0); height: var(--a4p-ch, 0);
		transform: translate(var(--a4p-cx, 0), var(--a4p-cy, 0)) scaleX(var(--a4p-cs, 1));
		transition: transform .35s var(--a4p-mv-rebond);
	}
	body .a4p-onglets-actifs .a4p-actif .a4p-deroule li {
		animation: a4p-monte .4s var(--a4p-mv-courbe) backwards;
		animation-delay: calc(var(--i, 0) * 55ms);
	}
	body .a4p-deroule li:nth-child(2) { --i: 1; } body .a4p-deroule li:nth-child(3) { --i: 2; }
	body .a4p-deroule li:nth-child(4) { --i: 3; } body .a4p-deroule li:nth-child(5) { --i: 4; }

	/* ---- r1 · Page des races : les cartes glissent à leur nouvelle place quand on change de filtre ---- */
	body .a4p-rc-grille > .a4p-rc { view-transition-class: a4p-rc; }
	::view-transition-group(*.a4p-rc) { animation-duration: .4s; animation-timing-function: var(--a4p-mv-courbe); }

	/* ---- r2 · Fiche d'une race : l'échelle (nu, court, long…) se dresse barre par barre ---- */
	.a4p-ech .a4p-vu > li { animation: a4p-pousse calc(.6s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) backwards; animation-delay: calc(var(--a4p-mv-delai-defilement) + var(--i, 0) * .08s); }
	/* Au quotidien : les points de chaque ligne se remplissent un à un, 0,15 s entre deux lignes. */
	.a4p-pts i:nth-child(2) { --k: 1; } .a4p-pts i:nth-child(3) { --k: 2; } .a4p-pts i:nth-child(4) { --k: 3; } .a4p-pts i:nth-child(5) { --k: 4; }
	.a4p-fi-quot ul.a4p-vu > li .a4p-pts i.on {
		animation: a4p-pop calc(.45s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + .15s + var(--i, 0) * .15s + var(--k, 0) * .08s);
	}
	@keyframes a4p-pousse { from { opacity: 0; transform: scaleY(0); transform-origin: bottom; } }

	/* ---- c1 · Formulaire de contact : champs qui réagissent doucement (validation immédiate, jamais bloquante) ---- */
	body .a4p-form-carte .plume-forms__field { position: relative; }
	body .a4p-form-carte .plume-forms__input { transition: border-color .2s, box-shadow .2s; }
	body .a4p-form-carte .plume-forms__input:focus { box-shadow: 0 0 0 4px var(--a4p-fu-soft); }
	body .a4p-form-carte .plume-forms__field.a4p-valide::after {
		content: "✓"; position: absolute; top: 0; right: 0; width: 20px; height: 20px; border-radius: 50%;
		background: #1f7a54; color: #fff; font-size: .72rem; font-weight: 800; display: grid; place-items: center;
		animation: a4p-pop .35s var(--a4p-mv-rebond) backwards;
	}
	body .a4p-form-carte .plume-forms__field.a4p-invalide .plume-forms__input { border-color: #b3261e; }
	body .a4p-form-carte :is(.plume-forms__error, .plume-forms__status, .plume-forms__errors):not(:empty) { animation: a4p-monte .3s var(--a4p-mv-courbe) backwards; }

	/* ---- c2 · Venir au salon : l'épingle tombe sur le salon avec deux ondes douces, puis les encarts arrivent l'un après l'autre ---- */
	@keyframes a4p-tombe { from { opacity: 0; transform: translateY(-56px); } 60% { opacity: 1; } }
	@keyframes a4p-onde { from { opacity: .9; transform: scale(.5); } to { opacity: 0; transform: scale(5); } }
	.a4p-plan-carte.a4p-av:not(.a4p-vu) .a4p-epingle { opacity: 0; }
	.a4p-plan-carte.a4p-vu .a4p-epingle { animation: a4p-tombe calc(.6s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) calc(var(--a4p-mv-delai-defilement) + .6s) backwards; }
	.a4p-plan-carte.a4p-vu .a4p-onde { animation: a4p-onde calc(1.3s * var(--a4p-mv-facteur)) ease-out calc(var(--a4p-mv-delai-defilement) + 1.25s) 2 forwards; }
	/* Les encarts attendent la fin de la chute, puis arrivent un à un (pastille qui rebondit). */
	.a4p-venir .a4p-coords.a4p-vu > * { animation-delay: calc(var(--a4p-mv-delai-defilement) + .9s + var(--i, 0) * .18s); }
	.a4p-venir .a4p-coords.a4p-vu .a4p-pastille {
		animation: a4p-pop calc(.45s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + 1.1s + var(--i, 0) * .18s);
	}
	body .a4p-coord { transition: transform .3s var(--a4p-mv-courbe), box-shadow .3s; }
	body .a4p-coord:is(:hover, :focus-within) { transform: translateY(-3px); box-shadow: 0 16px 30px -22px #2a0a1a66; }

	/* ---- g1 · Certificat en grand dans un <dialog> ---- */
	dialog.a4p-grand[open] { animation: a4p-zoom .35s var(--a4p-mv-courbe) backwards; }
	dialog.a4p-grand[open]::backdrop { animation: a4p-fondu .3s ease backwards; }
	@keyframes a4p-zoom { from { opacity: 0; transform: scale(.85); } }

	/* ---- f1 · Questions fréquentes : la réponse se déplie en glissant ---- */
	.a4p-faq details { interpolate-size: allow-keywords; }
	.a4p-faq details::details-content {
		height: 0; overflow: hidden;
		transition: height .35s var(--a4p-mv-courbe), content-visibility .35s allow-discrete;
	}
	.a4p-faq details[open]::details-content { height: auto; }
	.a4p-faq summary::after { transition: transform .3s var(--a4p-mv-rebond), background .2s; }

	/* ---- bl · Blog : cartes qui se soulèvent, image qui zoome, image de l'article qui s'agrandit depuis la carte ---- */
	body .a4p-blog-image { overflow: hidden; }
	body .a4p-blog-image img { transition: transform .6s var(--a4p-mv-courbe); }
	body .a4p-blog-carte { transition: transform .3s var(--a4p-mv-courbe), box-shadow .3s; }
	body .a4p-blog-carte:is(:hover, :focus-within) { box-shadow: 0 20px 36px -24px #2a0a1a66; }
	body .a4p-blog-carte:is(:hover, :focus-within) .a4p-blog-image img { transform: scale(var(--a4p-mv-zoom)); }
	::view-transition-group(a4p-article) { animation-duration: .45s; animation-timing-function: var(--a4p-mv-courbe); }

	/* ---- a1 · Avis : les étoiles se remplissent une à une, « Lire la suite » déplie en fondu ---- */
	.a4p-avis-resume.a4p-vu .a4p-avis-etoiles i {
		animation: a4p-pop calc(.5s * var(--a4p-mv-facteur)) var(--a4p-mv-rebond) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + .35s + var(--k, 0) * .15s);
	}
	.a4p-avis-etoiles i:nth-child(2) { --k: 1; } .a4p-avis-etoiles i:nth-child(3) { --k: 2; } .a4p-avis-etoiles i:nth-child(4) { --k: 3; } .a4p-avis-etoiles i:nth-child(5) { --k: 4; }
	.a4p-avis-resume.a4p-ini .a4p-avis-etoiles i { animation-delay: calc(var(--a4p-mv-delai-haut) + .35s + var(--k, 0) * .15s); }
	.wp-gr .grw-review.a4p-ouvert .wp-google-text { animation: a4p-fondu .35s ease backwards; }

	/* Bouton « Voir tous les avis » : arrive en fondu après la note. */
	.a4p-avis-resume.a4p-av:not(.a4p-vu) + .a4p-avis-tous { opacity: 0; }
	.a4p-avis-resume.a4p-vu + .a4p-avis-tous { animation: a4p-fondu calc(var(--a4p-mv-moyen) * var(--a4p-mv-facteur)) ease calc(var(--a4p-mv-delai-defilement) + 1.4s) backwards; }
	.a4p-avis-resume.a4p-ini.a4p-vu + .a4p-avis-tous { animation-delay: calc(var(--a4p-mv-delai-haut) + 1.4s); }

	/* ---- z1 · Zone desservie : les cercles de distance s'ouvrent, un trait part du salon vers chaque commune, les noms apparaissent du plus proche au plus lointain ---- */
	.a4p-carte-zone .a4p-lien { stroke: #C7025655; stroke-width: 1.5; stroke-dasharray: 1; }
	.a4p-carte-zone.a4p-vu .a4p-rayon {
		transform-box: fill-box; transform-origin: center;
		animation: a4p-rayon calc(1.2s * var(--a4p-mv-facteur)) var(--a4p-mv-courbe) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + var(--i, 0) * .25s);
	}
	.a4p-carte-zone.a4p-vu .a4p-lien {
		animation: a4p-trait calc(.9s * var(--a4p-mv-facteur)) var(--a4p-mv-trace) backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + .5s + var(--i, 0) * .12s);
	}
	.a4p-carte-zone.a4p-vu .a4p-ville {
		animation: a4p-fondu calc(.4s * var(--a4p-mv-facteur)) ease backwards;
		animation-delay: calc(var(--a4p-mv-delai-defilement) + .8s + var(--i, 0) * .12s);
	}
	@keyframes a4p-rayon { from { opacity: 0; transform: scale(0); } }
	@keyframes a4p-trait { from { stroke-dashoffset: 1; } }

	/* ---- Replis : navigateurs sans transition entre pages (Firefox) → léger fondu du contenu à l'arrivée ---- */
	@supports not (view-transition-name: none) {
		body { animation: a4p-fondu-page var(--a4p-mv-page) ease backwards; }
		@keyframes a4p-fondu-page { from { opacity: .4; } }
	}
	/* (groupe .a4p-coches, entrée au défilement commune ci-dessus) */
}

/* Les chiffres ne défilent plus en boucle : Chiens · Chats · NAC côte à côte, les phrases restent lisibles pour les lecteurs d'écran. */
body .a4p-chiffres .a4p-rot { display: flex; flex-wrap: wrap; justify-content: center; column-gap: .3em; }
body .a4p-chiffres b.a4p-rot > span { grid-area: auto; opacity: 1; animation: none; }
body .a4p-chiffres b.a4p-rot > span + span::before { content: "·"; margin-right: .3em; color: var(--a4p-tx-3); }
body .a4p-chiffres b.a4p-rot { font-size: clamp(1.25rem, 2.2vw, 1.8rem); white-space: nowrap; flex-wrap: nowrap; }
body .a4p-chiffres span.a4p-rot { display: block; }
body .a4p-chiffres span.a4p-rot > span { grid-area: auto; animation: none; opacity: 1; }
body .a4p-chiffres span.a4p-rot > span {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

/* Photo en grand (g1) : élément <dialog>, ouvert par assets/js/mouvement.js */
dialog.a4p-grand { border: 0; padding: 0; background: transparent; max-width: min(92vw, 900px); max-height: 90vh; overflow: visible; }
dialog.a4p-grand::backdrop { background: #120d16cc; }
dialog.a4p-grand img { display: block; max-width: min(92vw, 900px); max-height: 82vh; width: auto; height: auto; border-radius: 16px; background: #fff; }
dialog.a4p-grand .a4p-fermer {
	position: absolute; top: -14px; right: -10px; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
	background: #fff; color: var(--a4p-bl); font: 800 1.2rem/1 var(--wp--preset--font-family--inter); box-shadow: 0 6px 20px #0005;
}
dialog.a4p-grand .a4p-fermer:focus-visible { outline: 3px solid var(--a4p-fu); outline-offset: 2px; }

/* ---- Avis Google : résumé en haut puis grille de cartes (2 colonnes, 1 sur téléphone), avis coupés à quelques lignes ---- */
body .wp-gr[data-layout="grid"] .grw-reviews {
	display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; width: 100% !important; transform: none !important; align-items: stretch;
}
body .wp-gr[data-layout="grid"] .grw-review { flex: none !important; width: auto !important; max-width: none !important; margin: 0 !important; min-width: 0; }
@media (max-width: 640px) {
	body .wp-gr[data-layout="grid"] .grw-reviews { grid-template-columns: minmax(0, 1fr); }
}
body .a4p-avis-resume { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 0 auto 28px; text-align: left; }
body .a4p-avis-note { font-family: var(--a4p-marque); font-weight: 400; font-size: clamp(3.2rem, 7vw, 4.6rem); line-height: 1; color: var(--a4p-fu); font-variant-numeric: tabular-nums; min-width: 2.4ch; text-align: right; }
body .a4p-avis-etoiles { display: inline-flex; gap: 2px; font-size: 1.7rem; line-height: 1; }
body .a4p-avis-etoiles i { position: relative; display: inline-block; font-style: normal; color: #e9dfe3; }
body .a4p-avis-etoiles i::before { content: "★"; position: absolute; left: 0; top: 0; width: var(--pc, 100%); overflow: hidden; color: var(--a4p-star); }
body .a4p-avis-nb { margin: 4px 0 0 !important; font-size: .95rem; color: var(--a4p-tx-3); }
/* L'en-tête de l'extension est remplacé par le résumé ; seul le lien « donnez votre avis » reste. */
body .wp-gr.a4p-avis-ok .grw-header .grw-img-wrap, body .wp-gr.a4p-avis-ok .grw-header .wp-google-name,
body .wp-gr.a4p-avis-ok .grw-header .rpi-stars, body .wp-gr.a4p-avis-ok .grw-header .wp-google-based,
body .wp-gr.a4p-avis-ok .grw-header .wp-google-powered { display: none !important; }
body .wp-gr[data-layout="grid"] .wp-google-feedback { height: auto !important; min-height: 0 !important; max-height: none !important; }
body .wp-gr .wp-google-text.a4p-coupe { display: -webkit-box; -webkit-line-clamp: var(--a4p-avis-lignes); -webkit-box-orient: vertical; overflow: hidden; }
body .wp-gr .a4p-suite { align-self: flex-start; background: none; border: 0; padding: 6px 0; min-height: 32px; cursor: pointer; font: 700 .9rem var(--wp--preset--font-family--inter); color: var(--a4p-fu) !important; text-decoration: underline; text-underline-offset: 3px; }
body .wp-gr .a4p-suite:focus-visible { outline: 3px solid var(--a4p-fu); outline-offset: 2px; border-radius: 4px; }
/* Disposition : résumé (note, étoiles, bouton « donnez votre avis ») dans la colonne de gauche (~1/4), avis en deux colonnes à droite (~3/4).
   Les conteneurs de l'extension disparaissent de la mise en page (display: contents) pour que le résumé, l'en-tête et la grille
   deviennent les éléments d'une même grille. Sous 900 px : le résumé passe au-dessus, puis les avis. */
body .wp-gr.a4p-avis-ok {
	display: grid !important; grid-template-columns: minmax(230px, 1fr) minmax(0, 3fr); column-gap: clamp(20px, 3vw, 36px); row-gap: 0;
	align-items: start; grid-template-rows: auto auto 1fr auto;
}
body .wp-gr.a4p-avis-ok .grw-row, body .wp-gr.a4p-avis-ok .grw-row > .grw-content, body .wp-gr.a4p-avis-ok .grw-content-inner { display: contents !important; }
body .wp-gr.a4p-avis-ok .a4p-avis-resume { grid-column: 1; grid-row: 1; justify-content: flex-start; margin: 0 0 14px; }
body .wp-gr.a4p-avis-ok .grw-header { grid-column: 1; grid-row: 2; justify-content: flex-start; margin: 0 0 14px; width: auto; }
body .wp-gr.a4p-avis-ok .grw-header { padding: 0 !important; }
body .wp-gr.a4p-avis-ok .grw-header.rpi-flx > .grw-header-inner, body .wp-gr.a4p-avis-ok .grw-header-inner { justify-content: flex-start; margin: 0; padding: 0 !important; gap: 0; }
body .wp-gr.a4p-avis-ok .grw-header-inner > .rpi-col8 { display: none; }
body .wp-gr.a4p-avis-ok .grw-reviews { grid-column: 2; grid-row: 1 / span 3; }
body .wp-gr.a4p-avis-ok .wp-google-url { grid-column: 2; grid-row: 4; justify-self: center; margin: 16px 0 0; }
/* Bouton « Voir tous les avis » : en contour fuchsia, colonne de gauche sous « donnez votre avis » ; sous la grille sur téléphone. */
body .wp-gr.a4p-avis-ok .a4p-avis-tous {
	grid-column: 1; grid-row: 3; justify-self: start; align-self: start; margin: 4px 0 0;
	display: inline-block; padding: 11px 22px; border: 1.5px solid var(--a4p-fu); border-radius: 999px; background: transparent;
	color: var(--a4p-fu); font: 700 .95rem var(--wp--preset--font-family--inter); text-decoration: none; transition: background .25s, color .25s;
}
body .wp-gr.a4p-avis-ok .a4p-avis-tous:is(:hover, :focus-visible) { background: var(--a4p-fu); color: #fff; }
body .wp-gr.a4p-avis-ok .a4p-avis-tous:focus-visible { outline: 3px solid var(--a4p-fu); outline-offset: 3px; }
@media (max-width: 900px) {
	body .wp-gr.a4p-avis-ok .a4p-avis-tous { grid-column: 1; grid-row: 4; justify-self: center; margin-top: 18px; }
	body .wp-gr.a4p-avis-ok { grid-template-columns: minmax(0, 1fr); }
	body .wp-gr.a4p-avis-ok .a4p-avis-resume, body .wp-gr.a4p-avis-ok .grw-header { grid-column: 1; justify-content: center; margin-inline: auto; }
	body .wp-gr.a4p-avis-ok .grw-header-inner { justify-content: center; }
	body .wp-gr.a4p-avis-ok .grw-reviews { grid-column: 1; grid-row: 3; margin-top: 8px; }
	body .wp-gr.a4p-avis-ok .wp-google-url { grid-column: 1; grid-row: 4; }
}