/*
 * Pateo Enfant · pages éditoriales.
 * Guide et comparatif (pateo-g-, pateo-k-), pages hub (pateo-h-), pages d'aide et de confiance (pateo-cf-),
 * guide des tailles (pateo-gt-), tailles par race (pateo-tr-), pages légales (pateo-lg-), page auteur
 * (pateo-au-), 404, et blocs éditoriaux (en bref, chiffres, transparence, contact, comparatif, tailles).
 * Repris des maquettes (docs/maquettes/html/editorial.css et styles propres à chaque maquette), qui font foi.
 */

.pateo-g-article { padding: 4px 0 var(--pateo-bande); }
.pateo-g-grille { display: grid; gap: 0; }

/* En-tête d'article */
.pateo-g-entete { padding: 8px 0 20px; max-width: 760px; }
.pateo-g-entete h1 { margin-bottom: 14px; }
.pateo-g-chapeau { font-size: 18px; line-height: 1.55; margin-bottom: 18px; }
.pateo-g-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: 14px; color: var(--pateo-gris); margin: 0; }
.pateo-g-meta__auteur { display: inline-flex; align-items: center; gap: 10px; }
.pateo-g-meta__auteur .pateo-image { width: 40px; height: 40px; border-radius: 50%; padding: 0; font-size: 0; flex: none; }
.pateo-g-meta a { font-weight: 700; display: inline-flex; align-items: center; min-height: 44px; }
.pateo-g-meta__sep { color: var(--pateo-bordure-champ); }

/* Image principale */
.pateo-g-image { margin: 0 0 24px; }
.pateo-g-image .pateo-image { aspect-ratio: 16 / 9; border-radius: var(--pateo-rayon-carte); }
@media (min-width: 1024px) { .pateo-g-image .pateo-image { aspect-ratio: 2 / 1; } }
.pateo-g-image figcaption, .pateo-g-figure figcaption { font-size: 14px; color: var(--pateo-gris); margin-top: 8px; }

/* Sommaire : barre collante en mobile, colonne collante en desktop */
.pateo-g-sommaire { position: sticky; top: var(--pateo-entete); z-index: 9; margin: 0 calc(-1 * var(--pateo-gouttiere)) 24px; background: var(--pateo-creme); border-bottom: 1px solid var(--pateo-bordure-legere); }
.pateo-g-sommaire__bouton {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 52px;
	padding: 0 var(--pateo-gouttiere); background: none; border: 0; cursor: pointer; text-align: left; font-size: 15px;
}
.pateo-g-sommaire__bouton strong { flex: none; }
.pateo-g-sommaire__courant { flex: 1; min-width: 0; color: var(--pateo-gris); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pateo-g-sommaire__bouton .pateo-icone { transition: transform .2s; }
.pateo-g-sommaire__bouton[aria-expanded="true"] .pateo-icone { transform: rotate(180deg); }
.pateo-g-sommaire__titre { display: none; }
.pateo-g-sommaire ol { list-style: none; margin: 0; padding: 0 var(--pateo-gouttiere) 12px; counter-reset: s; }
.pateo-g-sommaire li a {
	display: flex; gap: 10px; align-items: baseline; min-height: 44px; padding: 10px 0;
	color: var(--pateo-anthracite); text-decoration: none; font-size: 15px; line-height: 1.4;
	border-top: 1px solid var(--pateo-bordure-legere);
}
.pateo-g-sommaire li a::before { counter-increment: s; content: counter(s); font-weight: 800; color: var(--pateo-sauge-fonce); min-width: 16px; }
.pateo-g-sommaire li a:hover { color: var(--pateo-sauge-fonce); text-decoration: underline; }
.pateo-g-sommaire li a[aria-current="true"] { color: var(--pateo-sauge-fonce); font-weight: 800; }

/* Corps de l'article */
.pateo-g-corps { max-width: 70ch; min-width: 0; }
.pateo-g-corps > h2 { margin-top: 48px; scroll-margin-top: calc(var(--pateo-entete) + 72px); }
.pateo-g-corps > h2:first-of-type { margin-top: 40px; }
.pateo-g-corps h3 { margin-top: 28px; }
.pateo-g-corps ul.pateo-g-liste, .pateo-g-corps ol.pateo-g-etapes { padding: 0; list-style: none; margin: 0 0 1em; }

/* L'essentiel en 30 secondes */
.pateo-g-essentiel { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 22px 22px 18px; border-top: 4px solid var(--pateo-sauge-fonce); }
.pateo-g-essentiel__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 21px; margin: 0 0 10px; }
.pateo-g-essentiel li, .pateo-g-liste li { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; }
.pateo-g-essentiel .pateo-icone, .pateo-g-liste .pateo-icone { width: 22px; height: 22px; margin-top: 2px; }

/* Figure dans le texte */
.pateo-g-figure { margin: 20px 0 24px; }
.pateo-g-figure .pateo-image { aspect-ratio: 16 / 10; }

/* Tableau des types (défile horizontalement si trop étroit) */
/* Tableaux du texte (.pateo-g-tableau) : styles communs dans base.css */

/* Carte produit horizontale dans le texte */
.pateo-g-produit { position: relative; display: grid; grid-template-columns: 104px 1fr; gap: 16px; align-items: center; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 10px 16px 10px 10px; margin: 16px 0 24px; transition: transform .25s ease; }
.pateo-g-produit .pateo-image { aspect-ratio: 1; padding: 6px; font-size: 10px; border-radius: 14px; }
.pateo-g-produit .pateo-surtitre { margin-bottom: 2px; font-size: 12px; }
.pateo-g-produit__nom { font-weight: 800; margin: 0 0 4px; line-height: 1.35; }
.pateo-g-produit__nom a { color: var(--pateo-anthracite); text-decoration: none; }
.pateo-g-produit__nom a::after { content: ""; position: absolute; inset: 0; border-radius: var(--pateo-rayon-carte); }
.pateo-g-produit__nom a:focus-visible { outline: none; }
.pateo-g-produit:focus-within { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-g-produit__infos { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--pateo-gris); margin: 0; }
.pateo-g-produit__infos strong { color: var(--pateo-anthracite); }
@media (hover: hover) {
	.pateo-g-produit:hover { transform: translateY(-3px); }
	.pateo-g-produit:hover .pateo-g-produit__nom a { text-decoration: underline; }
}

/* Calculateur de taille dans le texte */
.pateo-g-calcul { background: var(--pateo-sauge-clair); border-radius: var(--pateo-rayon-carte); padding: 20px; margin: 16px 0 24px; }
.pateo-g-calcul__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 20px; margin: 0 0 12px; }
.pateo-g-calcul__grille { display: grid; gap: 16px; }
.pateo-g-calcul form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.pateo-g-calcul .pateo-champ { min-width: 150px; }
.pateo-g-calcul .pateo-champ { flex: 1; }
.pateo-g-calcul__aide { font-size: 14px; color: var(--pateo-gris); margin: 8px 0 0; }
.pateo-g-resultat { margin-top: 14px; background: var(--pateo-blanc); border-radius: 16px; padding: 14px 16px; }
.pateo-g-resultat p { margin: 0; }
.pateo-g-resultat strong { font-family: var(--pateo-titres); font-weight: 600; font-size: 20px; }
.pateo-g-mesure { display: grid; grid-template-columns: 96px 1fr; gap: 14px; align-items: start; font-size: 15px; }
.pateo-g-mesure .pateo-image { aspect-ratio: 3 / 4; background: var(--pateo-blanc); font-size: 10px; padding: 6px; }
.pateo-g-mesure ol { margin: 0; padding-left: 20px; }
.pateo-g-mesure li + li { margin-top: 4px; }

/* Étapes numérotées */
.pateo-g-etapes { counter-reset: e; }
.pateo-g-etapes li { display: grid; grid-template-columns: 36px 1fr; gap: 12px; padding: 8px 0; }
.pateo-g-etapes li::before { counter-increment: e; content: counter(e); width: 32px; height: 32px; border-radius: 50%; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); display: grid; place-items: center; font-weight: 800; font-size: 15px; }

/* Encadré conseil dans le texte */
.pateo-g-corps .pateo-conseil { margin: 24px 0; }

/* Réponse directe en tête de section (SEO / GEO) */
.pateo-g-reponse { font-weight: 700; }
.pateo-g-essentiel__reponse { margin: 0 0 8px; }

/* Ce que nos tests nous ont appris */
.pateo-g-tests { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 8px 0 16px; }
.pateo-g-tests__chiffre { display: flex; flex-direction: column; align-items: center; text-align: center; background: var(--pateo-sauge-clair); border-radius: 16px; padding: 14px 8px; margin: 0; }
.pateo-g-tests__chiffre strong { font-family: var(--pateo-titres); font-weight: 600; font-size: 22px; line-height: 1.2; color: var(--pateo-sauge-fonce); }
.pateo-g-tests__chiffre span { font-size: 13px; color: var(--pateo-gris); }

/* Sources et méthode */
.pateo-g-sources { margin-top: 40px; padding: 20px; border: 2px solid var(--pateo-bordure-legere); border-radius: var(--pateo-rayon-carte); }
.pateo-g-sources__titre { font-weight: 800; margin: 0 0 6px; }
.pateo-g-sources ul { list-style: disc; padding-left: 20px; margin: 0 0 10px; }
.pateo-g-sources li a { display: inline-block; padding: 4px 0; }
.pateo-g-sources p:last-child { margin: 0; }

/* Profil auteur */
.pateo-g-auteur { display: grid; grid-template-columns: 80px 1fr; gap: 16px; align-items: start; margin-top: 24px; padding: 20px; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); }
.pateo-g-auteur .pateo-image { width: 80px; height: 80px; border-radius: 50%; padding: 6px; font-size: 9px; }
.pateo-g-auteur__nom { font-family: var(--pateo-titres); font-weight: 600; font-size: 20px; margin: 0; }
.pateo-g-auteur__role { font-size: 14px; color: var(--pateo-gris); margin: 0 0 8px; }
.pateo-g-auteur p:last-of-type { margin-bottom: 4px; }
.pateo-g-auteur a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

/* Colonne « Notre sélection » (desktop) */
.pateo-g-rail { display: none; }
.pateo-g-selection { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 12px 12px 18px; }
.pateo-g-selection .pateo-surtitre { padding: 4px 6px 0; }
.pateo-g-selection__produit { position: relative; }
.pateo-g-selection__produit .pateo-image { aspect-ratio: 4 / 3; margin-bottom: 10px; }
.pateo-g-selection__corps { padding: 0 6px; }
.pateo-g-selection__nom { font-weight: 800; margin: 0 0 4px; line-height: 1.35; }
.pateo-g-selection__nom a { color: var(--pateo-anthracite); text-decoration: none; }
.pateo-g-selection__nom a:hover { text-decoration: underline; }
.pateo-g-selection__note { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--pateo-gris); margin: 0 0 6px; }
.pateo-g-selection__note .pateo-icone { width: 18px; height: 18px; }
.pateo-g-selection__prix { font-weight: 800; font-size: 17px; margin: 0 0 12px; }
.pateo-g-selection .pateo-bouton { width: 100%; }
.pateo-g-selection__tout { display: flex; justify-content: center; align-items: center; min-height: 44px; margin-top: 4px; font-weight: 700; font-size: 15px; }

/* Bas de page : produits et guides liés */
.pateo-g-grille-produits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pateo-g-voir-tout { display: flex; justify-content: center; margin-top: 24px; }

@media (min-width: 768px) {
	.pateo-g-grille-produits { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
	.pateo-g-calcul__grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
	.pateo-g-auteur { grid-template-columns: 96px 1fr; padding: 24px; gap: 20px; }
	.pateo-g-auteur .pateo-image { width: 96px; height: 96px; }
}
@media (min-width: 1024px) {
	/* Sommaire à gauche, texte au centre, sélection à droite */
	.pateo-g-grille { grid-template-columns: 200px minmax(0, 1fr) 260px; column-gap: 40px; align-items: start; }
	.pateo-g-entete, .pateo-g-image { grid-column: 2 / 4; }
	.pateo-g-entete { padding-top: 16px; }
	.pateo-g-sommaire { grid-column: 1; grid-row: 1 / span 3; top: calc(var(--pateo-entete) + 24px); margin: 24px 0 0; padding: 0; background: none; border: 0; align-self: start; }
	.pateo-g-sommaire__bouton { display: none; }
	.pateo-g-sommaire__titre { display: block; font-size: 13px; margin-bottom: 4px; }
	.pateo-g-sommaire ol { display: block !important; padding: 0; }
	.pateo-g-sommaire li a { font-size: 14px; min-height: 0; padding: 9px 0; }
	.pateo-g-sommaire li a[aria-current="true"] { box-shadow: inset 3px 0 0 var(--pateo-sauge-fonce); padding-left: 10px; }
	.pateo-g-corps { grid-column: 2; }
	.pateo-g-corps > h2:first-of-type { margin-top: 48px; }
	.pateo-g-rail { display: block; grid-column: 3; position: sticky; top: calc(var(--pateo-entete) + 24px); align-self: start; margin-top: 0; }
}

/* ======================================================================
 * Pages hub (guides, guides d'un univers ou d'un thème, comparatifs) · préfixe ph-
 * ====================================================================== */
.pateo-h-entete { padding: 8px 0 28px; }
.pateo-h-entete h1 { margin-bottom: 12px; }
.pateo-h-entete__intro { max-width: 70ch; margin-bottom: 14px; }
.pateo-h-entete__preuve { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin: 0; font-size: 14px; }
.pateo-h-entete__preuve .pateo-k-etiquette, .pateo-h-etiquette { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; background: var(--pateo-sauge-clair); color: var(--pateo-sauge-fonce); font-weight: 800; font-size: 14px; }
.pateo-h-etiquette .pateo-icone { width: 18px; height: 18px; }
.pateo-h-entete__preuve a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

/* Entrées rapides */
.pateo-h-entrees { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 20px calc(-1 * var(--pateo-gouttiere)) 0; padding: 2px var(--pateo-gouttiere) 4px; }
.pateo-h-entrees::-webkit-scrollbar { display: none; }
.pateo-h-entrees a {
	flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 18px;
	background: var(--pateo-blanc); border: 2px solid var(--pateo-bordure-legere); border-radius: 999px;
	color: var(--pateo-anthracite); text-decoration: none; font-weight: 800; font-size: 15px; white-space: nowrap;
}
.pateo-h-entrees a:hover { border-color: var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }
.pateo-h-entrees a[aria-current] { background: var(--pateo-sauge-fonce); border-color: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-h-entrees .pateo-icone { width: 20px; height: 20px; }
.pateo-h-entrees a[aria-current] .pateo-icone { stroke: var(--pateo-creme); }

/* À la une : un grand + deux petits */
.pateo-h-une { display: grid; gap: 16px; }
.pateo-h-une__grand { position: relative; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 12px 12px 22px; transition: transform .25s ease; }
.pateo-h-une__grand .pateo-image { aspect-ratio: 16 / 10; margin-bottom: 16px; }
.pateo-h-une__grand-corps { padding: 0 8px; }
.pateo-h-une__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 24px; line-height: 1.25; margin: 0 0 8px; }
.pateo-h-une__titre a, .pateo-h-mini__titre a { color: var(--pateo-anthracite); text-decoration: none; }
.pateo-h-une__titre a::after, .pateo-h-mini__titre a::after { content: ""; position: absolute; inset: 0; border-radius: var(--pateo-rayon-carte); }
.pateo-h-une__titre a:focus-visible, .pateo-h-mini__titre a:focus-visible { outline: none; }
.pateo-h-une__grand:focus-within, .pateo-h-mini:focus-within { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-h-une__chapeau { color: var(--pateo-gris); margin-bottom: 10px; }
.pateo-h-meta { font-size: 14px; color: var(--pateo-gris); margin: 0; }
.pateo-h-une__petits { display: grid; gap: 16px; }
.pateo-h-mini { position: relative; display: grid; grid-template-columns: 112px 1fr; gap: 14px; align-items: center; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 10px 14px 10px 10px; transition: transform .25s ease; }
.pateo-h-mini .pateo-image { aspect-ratio: 1; padding: 6px; font-size: 10px; border-radius: 14px; }
.pateo-h-mini .pateo-surtitre { font-size: 12px; margin-bottom: 4px; }
.pateo-h-mini__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 18px; line-height: 1.3; margin: 0 0 6px; }
@media (hover: hover) {
	.pateo-h-une__grand:hover, .pateo-h-mini:hover { transform: translateY(-3px); }
	.pateo-h-une__grand:hover .pateo-h-une__titre a, .pateo-h-mini:hover .pateo-h-mini__titre a { text-decoration: underline; }
}

/* Explorer par thème */
.pateo-h-themes { display: grid; gap: 20px; }
.pateo-h-themes__groupe { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); padding: 18px 18px 14px; }
.pateo-h-themes__titre { font-weight: 800; margin: 0 0 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pateo-h-themes__titre a { font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; min-height: 44px; }
.pateo-h-pastilles { display: flex; flex-wrap: wrap; gap: 8px; }
.pateo-h-pastilles a {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px;
	border: 2px solid var(--pateo-bordure-legere); border-radius: 999px;
	color: var(--pateo-anthracite); text-decoration: none; font-weight: 700; font-size: 15px;
}
.pateo-h-pastilles a:hover { border-color: var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }
.pateo-h-pastilles small { color: var(--pateo-gris); font-weight: 400; font-size: 13px; }

/* En-tête de section avec lien « Tout voir » */
.pateo-h-section__entete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 4px 24px; margin-bottom: 24px; }
.pateo-h-section__entete .pateo-bande__entete { margin: 0; }
.pateo-h-tout { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 800; }
.pateo-h-tout .pateo-icone { width: 18px; height: 18px; }
.pateo-h-grille { display: grid; gap: 20px; }
/* Mobile : les sections défilent horizontalement ; seule la liste complète reste verticale */
@media (max-width: 767px) {
	.pateo-h-grille:not(.pateo-h-grille--liste) {
		display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
		margin: 0 calc(-1 * var(--pateo-gouttiere)); padding: 4px var(--pateo-gouttiere) 12px; scroll-padding: 0 var(--pateo-gouttiere);
	}
	.pateo-h-grille:not(.pateo-h-grille--liste)::-webkit-scrollbar { display: none; }
	.pateo-h-grille:not(.pateo-h-grille--liste) > li { flex: 0 0 78%; scroll-snap-align: start; }
}

/* Bandeau guide des tailles */
.pateo-h-bandeau { display: grid; gap: 16px; align-items: center; background: var(--pateo-sauge-clair); border-radius: var(--pateo-rayon-carte); padding: 12px 12px 22px; }
.pateo-h-bandeau .pateo-image { aspect-ratio: 16 / 9; background: var(--pateo-blanc); }
.pateo-h-bandeau__corps { padding: 0 8px; }
.pateo-h-bandeau__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 24px; line-height: 1.25; margin: 0 0 8px; }

/* Pagination */
.pateo-h-pagination { margin-top: 36px; }
.pateo-h-pagination ul { display: flex; justify-content: center; align-items: center; gap: 6px; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; }
.pateo-h-pagination a, .pateo-h-pagination span { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px; font-weight: 800; text-decoration: none; color: var(--pateo-anthracite); }
.pateo-h-pagination a:hover { background: var(--pateo-sauge-clair); }
.pateo-h-pagination [aria-current] { background: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-h-pagination .pateo-h-suivant { display: inline-flex; gap: 4px; border: 2px solid var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }
.pateo-h-pagination .pateo-h-suivant .pateo-icone { width: 18px; height: 18px; stroke: currentColor; }

/* Comment on écrit nos guides */
.pateo-h-ecriture { display: grid; gap: 16px; align-items: center; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 20px; }
.pateo-h-ecriture__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 22px; margin: 0 0 8px; }
.pateo-h-ecriture ul { list-style: none; padding: 0; margin: 0 0 8px; }
.pateo-h-ecriture li { display: flex; gap: 10px; align-items: flex-start; padding: 4px 0; font-size: 15px; }
.pateo-h-ecriture li .pateo-icone { width: 20px; height: 20px; margin-top: 2px; }
.pateo-h-ecriture a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; margin-right: 20px; }
.pateo-h-ecriture__auteur { display: flex; align-items: center; gap: 14px; }
.pateo-h-ecriture__auteur .pateo-image { width: 72px; height: 72px; border-radius: 50%; padding: 4px; font-size: 9px; flex: none; }
.pateo-h-ecriture__auteur p { margin: 0; font-size: 15px; }

@media (min-width: 768px) {
	.pateo-h-grille { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
	.pateo-h-grille--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pateo-h-themes { grid-template-columns: 1fr 1fr; }
	.pateo-h-bandeau { grid-template-columns: 280px 1fr; padding: 16px 32px 16px 16px; gap: 32px; }
	.pateo-h-bandeau__corps { padding: 0; }
	.pateo-h-ecriture { grid-template-columns: 1fr 300px; padding: 28px 32px; gap: 32px; }
}
@media (min-width: 1024px) {
	.pateo-h-une { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
	.pateo-h-une__titre { font-size: 30px; }
	.pateo-h-une__petits { grid-template-rows: 1fr 1fr; }
	.pateo-h-mini { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); align-items: stretch; padding: 10px 18px 10px 10px; }
	.pateo-h-mini .pateo-image { aspect-ratio: auto; height: 100%; min-height: 140px; }
	.pateo-h-mini img.pateo-image { aspect-ratio: 1 / 1; height: auto; align-self: stretch; }
	.pateo-h-mini > div:last-child { align-self: center; }
	.pateo-h-grille--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
}

/* Carte de comparatif avec son gagnant (hub comparatifs) */
.pateo-h-comp { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 12px 12px 18px; transition: transform .25s ease; }
.pateo-h-comp .pateo-image { aspect-ratio: 16 / 10; margin-bottom: 14px; }
.pateo-h-comp__corps { padding: 0 8px; display: flex; flex-direction: column; flex: 1; }
.pateo-h-comp__titre { font-family: var(--pateo-titres); font-weight: 600; font-size: 20px; line-height: 1.3; margin: 0 0 12px; }
.pateo-h-comp__titre a { color: var(--pateo-anthracite); text-decoration: none; }
.pateo-h-comp__titre a::after { content: ""; position: absolute; inset: 0; border-radius: var(--pateo-rayon-carte); }
.pateo-h-comp__titre a:focus-visible { outline: none; }
.pateo-h-comp:focus-within { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-h-comp__gagnant { display: flex; align-items: center; gap: 10px; background: var(--pateo-sauge-clair); border-radius: 14px; padding: 10px 12px; margin: 0 0 12px; font-size: 14px; line-height: 1.35; }
.pateo-h-comp__gagnant .pateo-icone { width: 22px; height: 22px; flex: none; }
.pateo-h-comp__gagnant strong { display: block; color: var(--pateo-sauge-fonce); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.pateo-h-comp .pateo-h-meta { margin-top: auto; }
@media (hover: hover) { .pateo-h-comp:hover { transform: translateY(-3px); } .pateo-h-comp:hover .pateo-h-comp__titre a { text-decoration: underline; } }

/* Comment on compare */
.pateo-h-methode { display: grid; gap: 24px; align-items: start; }
.pateo-h-etapes { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; counter-reset: m; }
.pateo-h-etapes li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.pateo-h-etapes li::before { counter-increment: m; content: counter(m); width: 44px; height: 44px; border-radius: 50%; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); display: grid; place-items: center; font-family: var(--pateo-titres); font-weight: 600; font-size: 20px; }
.pateo-h-etapes h3 { margin: 6px 0 4px; }
.pateo-h-etapes p { margin: 0; color: var(--pateo-gris); font-size: 15px; }
.pateo-h-transparence { display: flex; gap: 12px; align-items: flex-start; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); padding: 18px 20px; font-size: 15px; }
.pateo-h-transparence .pateo-icone { width: 24px; height: 24px; flex: none; margin-top: 1px; }
.pateo-h-transparence p { margin: 0 0 8px; }
.pateo-h-transparence a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
@media (min-width: 1024px) { .pateo-h-methode { grid-template-columns: 1.2fr 1fr; gap: 48px; } }

/* Avertissement « repères indicatifs » (guide des tailles, tailles par race) */
.pateo-gt-avertissement { display: flex; gap: 10px; align-items: flex-start; background: var(--pateo-blanc); border-left: 4px solid var(--pateo-sauge-fonce); border-radius: 12px; padding: 12px 16px; font-size: 15px; margin: 16px 0 8px; max-width: 70ch; }
.pateo-gt-avertissement .pateo-icone { width: 22px; height: 22px; margin-top: 1px; }

/* ======================================================================
 * Pages de confiance (livraison, retours, contact, FAQ, qui sommes-nous, méthode) · préfixe cf-
 * ====================================================================== */
.pateo-cf-page { padding: 4px 0 var(--pateo-bande); }
.pateo-cf-grille { display: grid; gap: 20px; align-items: start; }
.pateo-cf-nav { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); }
.pateo-cf-nav summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 18px; font-weight: 800; cursor: pointer; list-style: none; }
.pateo-cf-nav summary::-webkit-details-marker { display: none; }
.pateo-cf-nav summary .pateo-icone { transition: transform .3s; }
.pateo-cf-nav[open] summary .pateo-icone { transform: rotate(180deg); }
.pateo-cf-nav ul { list-style: none; margin: 0; padding: 0 10px 10px; }
.pateo-cf-nav a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 10px; border-radius: 12px; color: var(--pateo-anthracite); text-decoration: none; font-weight: 700; font-size: 15px; }
.pateo-cf-nav a .pateo-icone { width: 20px; height: 20px; }
.pateo-cf-nav a:hover { background: var(--pateo-sauge-clair); color: var(--pateo-sauge-fonce); }
.pateo-cf-nav a[aria-current] { background: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-cf-nav a[aria-current] .pateo-icone { stroke: var(--pateo-creme); }
.pateo-cf-contenu { min-width: 0; max-width: 820px; }
.pateo-cf-contenu > h2 { margin-top: 44px; scroll-margin-top: calc(var(--pateo-entete) + 16px); }
.pateo-cf-contenu h1 { margin-bottom: 12px; }
.pateo-cf-maj { font-size: 14px; color: var(--pateo-gris); margin: 0 0 20px; }
.pateo-cf-cles { list-style: none; padding: 0; margin: 20px 0 0; display: grid; gap: 12px; }
.pateo-cf-cles li { display: flex; gap: 14px; align-items: center; background: var(--pateo-blanc); border-radius: 16px; padding: 14px 16px; }
.pateo-cf-cles__picto { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--pateo-sauge-clair); display: grid; place-items: center; }
.pateo-cf-cles strong { display: block; line-height: 1.3; }
.pateo-cf-cles span.pateo-petit { color: var(--pateo-gris); display: block; }
.pateo-cf-voir-aussi { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 20px; font-size: 15px; }
.pateo-cf-voir-aussi a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.pateo-cf-testeurs { display: grid; gap: 14px; margin-top: 16px; }
.pateo-cf-testeur { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); padding: 14px; }
.pateo-cf-testeur .pateo-image { width: 88px; height: 88px; border-radius: 50%; padding: 6px; font-size: 9px; }
.pateo-cf-testeur__nom { font-weight: 800; margin: 0; }
.pateo-cf-testeur p { margin: 0; font-size: 15px; }
.pateo-cf-testeur .pateo-petit { color: var(--pateo-gris); }
.pateo-cf-echelle { list-style: none; padding: 0; margin: 12px 0 16px; display: grid; gap: 6px; }
.pateo-cf-echelle li { display: flex; gap: 12px; align-items: center; background: var(--pateo-blanc); border-radius: 12px; padding: 8px 12px; font-size: 15px; }
.pateo-cf-echelle strong { flex: none; width: 44px; height: 32px; border-radius: 999px; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); display: grid; place-items: center; font-size: 14px; }
@media (min-width: 768px) {
	.pateo-cf-cles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.pateo-cf-cles li { flex-direction: column; align-items: flex-start; }
	.pateo-cf-testeurs { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
	.pateo-cf-grille { grid-template-columns: 260px minmax(0, 1fr); gap: 48px; }
	.pateo-cf-nav { position: sticky; top: calc(var(--pateo-entete) + 24px); }
	.pateo-cf-nav summary { pointer-events: none; cursor: default; }
	.pateo-cf-nav summary .pateo-icone { display: none; }
}

/* Lisibilité sur fond sauge très clair : photos et encadrés chiffrés restent visibles */
.pateo-cf-testeur .pateo-image { background: var(--pateo-sauge-clair); }
.pateo-bande--sauge .pateo-g-tests__chiffre { background: var(--pateo-blanc); }

/* ======================================================================
 * Comparatif (maquette comparatif.html)
 * ====================================================================== */
/* ---------- Spécifique au gabarit comparatif (préfixe pk-) ---------- */

.pateo-k-etiquette { display: inline-flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 6px 14px; border-radius: 999px; background: var(--pateo-sauge-clair); color: var(--pateo-sauge-fonce); font-weight: 800; font-size: 14px; }
.pateo-k-etiquette .pateo-icone { width: 18px; height: 18px; }

/* Sections larges (pateo-au-dessus du corps) */
.pateo-k-large { min-width: 0; }
.pateo-k-large > h2 { margin-top: 8px; scroll-margin-top: calc(var(--pateo-entete) + 72px); }

/* Notre choix */
.pateo-k-choix { position: relative; display: grid; gap: 16px; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 12px 12px 22px; border: 2px solid var(--pateo-sauge-fonce); margin: 16px 0 0; }
.pateo-k-choix__badge { position: absolute; top: -14px; left: 20px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 14px; border-radius: 999px; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); font-weight: 800; font-size: 14px; }
.pateo-k-choix__badge .pateo-icone { width: 16px; height: 16px; stroke: var(--pateo-creme); }
.pateo-k-choix .pateo-image { aspect-ratio: 4 / 3; }
.pateo-k-choix__corps { padding: 0 8px; }
.pateo-k-choix__haut { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.pateo-k-choix__note { flex: none; width: 92px; height: 92px; border-radius: 50%; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); display: grid; place-content: center; text-align: center; line-height: 1.1; margin: 0; }
.pateo-k-choix__note small { font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.pateo-k-choix__note strong { font-family: var(--pateo-titres); font-weight: 600; font-size: 19px; }
.pateo-k-choix__nom { font-family: var(--pateo-titres); font-weight: 600; font-size: 22px; line-height: 1.25; margin: 0; }
.pateo-k-choix__verdict { margin-bottom: 12px; }
.pateo-k-points { list-style: none; padding: 0; margin: 0 0 16px; }
.pateo-k-points li { display: flex; gap: 10px; align-items: flex-start; padding: 4px 0; font-size: 15px; }
.pateo-k-points .pateo-icone { width: 20px; height: 20px; margin-top: 2px; }
.pateo-k-choix__achat { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.pateo-k-choix__prix { font-weight: 800; font-size: 24px; margin: 0; }
.pateo-k-choix__achat .pateo-bouton { flex: 1 1 220px; }
.pateo-k-choix__lien { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; font-size: 15px; margin-top: 4px; }

/* Nos choix selon ton chien */
.pateo-k-usages__titre { margin-top: 32px; }
.pateo-k-usages { display: grid; gap: 12px; list-style: none; padding: 0; margin: 0; }
.pateo-k-usage { position: relative; display: grid; grid-template-columns: 76px 1fr; gap: 14px; align-items: center; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 10px 14px 10px 10px; height: 100%; transition: transform .25s ease; }
.pateo-k-usage .pateo-image { aspect-ratio: 1; font-size: 9px; padding: 4px; border-radius: 12px; }
.pateo-k-usage .pateo-surtitre { font-size: 12px; margin-bottom: 2px; }
.pateo-k-usage__nom { font-weight: 800; line-height: 1.3; margin: 0 0 4px; font-size: 15px; }
.pateo-k-usage__nom a { color: var(--pateo-anthracite); text-decoration: none; }
.pateo-k-usage__nom a::after { content: ""; position: absolute; inset: 0; border-radius: var(--pateo-rayon-carte); }
.pateo-k-usage__nom a:focus-visible { outline: none; }
.pateo-k-usage:focus-within { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-k-usage__infos { font-size: 14px; color: var(--pateo-gris); margin: 0; }
@media (hover: hover) { .pateo-k-usage:hover { transform: translateY(-3px); } .pateo-k-usage:hover .pateo-k-usage__nom a { text-decoration: underline; } }

/* Tableau comparatif : colonne des critères fixe, colonne « Notre choix » mise en avant */
.pateo-k-tableau { overflow-x: auto; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); margin: 16px 0 8px; }
.pateo-k-tableau:focus-visible { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-k-tableau table { width: 100%; min-width: 760px; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.pateo-k-tableau caption { text-align: left; padding: 14px 16px 4px; font-weight: 800; font-size: 14px; color: var(--pateo-gris); }
.pateo-k-tableau th, .pateo-k-tableau td { padding: 12px 14px; border-bottom: 1px solid var(--pateo-bordure-legere); text-align: left; vertical-align: top; line-height: 1.4; }
.pateo-k-tableau tbody th { position: sticky; left: 0; z-index: 1; background: var(--pateo-blanc); font-weight: 800; min-width: 150px; box-shadow: 1px 0 0 var(--pateo-bordure-legere); }
.pateo-k-tableau thead th { vertical-align: bottom; font-size: 14px; }
.pateo-k-tableau thead td { position: sticky; left: 0; z-index: 1; background: var(--pateo-blanc); box-shadow: 1px 0 0 var(--pateo-bordure-legere); }
.pateo-k-tableau__produit { display: flex; flex-direction: column; gap: 8px; }
.pateo-k-tableau__produit .pateo-image { width: 88px; height: 88px; padding: 4px; font-size: 9px; border-radius: 12px; }
.pateo-k-tableau__produit a { color: var(--pateo-anthracite); font-weight: 800; }
.pateo-k-tableau .pateo-k-notre-choix { background: var(--pateo-sauge-clair); }
.pateo-k-tableau .pateo-k-notre-choix .pateo-image { background: var(--pateo-blanc); }
.pateo-k-tableau thead .pateo-k-notre-choix { border-radius: 16px 16px 0 0; }
.pateo-k-tableau__badge { display: inline-flex; align-self: flex-start; padding: 2px 10px; border-radius: 999px; background: var(--pateo-sauge-fonce); color: var(--pateo-creme); font-size: 12px; font-weight: 800; }
.pateo-k-tableau tr:last-child th, .pateo-k-tableau tr:last-child td { border-bottom: 0; }
.pateo-k-tableau td a { font-weight: 700; display: inline-flex; align-items: center; min-height: 44px; }
.pateo-k-tableau__pied { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; font-size: 14px; color: var(--pateo-gris); }
.pateo-k-tableau__pied a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

/* Produit testé (une section par produit) */
.pateo-k-produit__image { margin: 16px 0 20px; }
.pateo-k-produit__image .pateo-image { aspect-ratio: 16 / 10; }
.pateo-k-avis-test { display: grid; gap: 10px; list-style: none; padding: 0; margin: 20px 0; }
.pateo-k-avis-test li { display: flex; gap: 12px; align-items: flex-start; background: var(--pateo-blanc); border-radius: 16px; padding: 14px 16px; font-size: 15px; }
.pateo-k-avis-test .pateo-icone { width: 22px; height: 22px; margin-top: 1px; }
.pateo-k-pourqui { display: grid; gap: 12px; margin: 0 0 20px; }
.pateo-k-pourqui div { border: 2px solid var(--pateo-bordure-legere); border-radius: 16px; padding: 14px 16px; }
.pateo-k-pourqui p { font-weight: 800; margin: 0 0 6px; }
.pateo-k-pourqui ul { margin: 0; padding-left: 20px; font-size: 15px; }
.pateo-k-produit__achat { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; background: var(--pateo-blanc); border-radius: 16px; }
.pateo-k-produit__achat p { margin: 0; font-weight: 800; font-size: 18px; }
.pateo-k-produit__achat p span { display: block; font-weight: 400; font-size: 14px; color: var(--pateo-gris); }
.pateo-g-corps .pateo-fiche { margin-top: 8px; }

/* Transparence */
.pateo-k-transparence { display: flex; gap: 12px; align-items: flex-start; background: var(--pateo-sauge-clair); border-radius: 16px; padding: 14px 16px; font-size: 15px; margin: 0 0 12px; }
.pateo-k-transparence .pateo-icone { width: 22px; height: 22px; margin-top: 1px; }
.pateo-k-maj { font-size: 14px; color: var(--pateo-gris); }
.pateo-k-maj li { padding: 2px 0; }

@media (min-width: 768px) {
	.pateo-k-choix { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: center; padding: 16px 28px 16px 16px; gap: 28px; }
	.pateo-k-choix__corps { padding: 0; }
	.pateo-k-usages { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
	.pateo-k-usage { grid-template-columns: 1fr; padding: 10px 10px 14px; align-items: start; }
	.pateo-k-usage .pateo-image { aspect-ratio: 16 / 10; }
	.pateo-k-usage > div:last-child { padding: 0 4px; }
	.pateo-k-pourqui { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
	.pateo-k-large { grid-column: 2 / 4; }
	.pateo-g-sommaire { grid-row: 1 / span 5; }
	.pateo-k-tableau table { min-width: 0; }
}

/* ======================================================================
 * Guide des tailles (maquette guide-tailles-chien.html)
 * ====================================================================== */
/* ---------- Spécifique au guide des tailles (préfixe gt-) ---------- */
.pateo-gt-page { padding: 4px 0 var(--pateo-bande); }
/* Contenu terminé par une bande pleine largeur : pas de bande crème vide avant le pied de page. */
.pateo-gt-page:has(> .pateo-gt-contenu > .pateo-bande:last-child) { padding-bottom: 0; }
.pateo-gt-page .pateo-g-entete { max-width: 820px; }
.pateo-gt-raccourcis { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 4px calc(-1 * var(--pateo-gouttiere)) 0; padding: 2px var(--pateo-gouttiere) 4px; }
.pateo-gt-raccourcis::-webkit-scrollbar { display: none; }
/* Espace entre les raccourcis et le changement de fond de la première bande. */
.pateo-gt-raccourcis { margin-bottom: 32px; }
/* Ordinateur : les raccourcis passent à la ligne (pas de défilement caché à la souris) */
@media (min-width: 1024px) { .pateo-gt-raccourcis { flex-wrap: wrap; overflow: visible; margin: 4px 0 40px; padding: 2px 0 4px; } }
.pateo-gt-raccourcis a { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 2px solid var(--pateo-bordure-legere); border-radius: 999px; background: var(--pateo-blanc); color: var(--pateo-anthracite); text-decoration: none; font-weight: 700; font-size: 15px; }
.pateo-gt-raccourcis a:hover { border-color: var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }

.pateo-gt-section { scroll-margin-top: calc(var(--pateo-entete) + 16px); }
.pateo-gt-section > h2 { margin-bottom: 8px; }
.pateo-gt-intro { max-width: 70ch; }

/* Calculateur */
.pateo-gt-calcul { display: grid; gap: 20px; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 20px; margin-top: 20px; }
.pateo-gt-calcul fieldset { border: 0; margin: 0 0 16px; padding: 0; min-width: 0; }
.pateo-gt-calcul legend { font-weight: 800; font-size: 15px; margin-bottom: 8px; padding: 0; }
.pateo-gt-types { display: flex; flex-wrap: wrap; gap: 8px; }
.pateo-gt-radio { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pateo-gt-type { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 2px solid var(--pateo-bordure-champ); border-radius: 999px; background: var(--pateo-blanc); font-weight: 800; font-size: 15px; cursor: pointer; }
.pateo-gt-radio:checked + .pateo-gt-type { background: var(--pateo-sauge-fonce); border-color: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-gt-radio:focus-visible + .pateo-gt-type { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-gt-champs { display: grid; gap: 14px; margin-bottom: 16px; }
.pateo-gt-champ-aide { font-size: 13px; color: var(--pateo-gris); margin: 0; }
.pateo-gt-calcul .pateo-bouton--secondaire { width: 100%; }
.pateo-gt-resultat { background: var(--pateo-sauge-clair); border-radius: 16px; padding: 20px; align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.pateo-gt-resultat__vide { color: var(--pateo-gris); margin: 0; }
.pateo-gt-resultat__taille { font-family: var(--pateo-titres); font-weight: 600; font-size: 28px; line-height: 1.2; margin: 0 0 6px; }
.pateo-gt-resultat p { margin: 0 0 10px; }
.pateo-gt-resultat > :last-child { margin-bottom: 0; }
.pateo-gt-resultat .pateo-petit { color: var(--pateo-gris); }
.pateo-gt-resultat a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 800; }
.pateo-gt-resultat a .pateo-icone { width: 18px; height: 18px; }

/* Les 3 mesures */
.pateo-gt-mesures { display: grid; gap: 16px; margin-top: 20px; }
.pateo-gt-mesure { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 12px 12px 20px; }
.pateo-gt-mesure .pateo-image { aspect-ratio: 4 / 3; margin-bottom: 14px; }
.pateo-gt-mesure__corps { padding: 0 8px; }
.pateo-gt-mesure h3 { margin: 0 0 4px; }
.pateo-gt-mesure__pour { font-size: 14px; color: var(--pateo-sauge-fonce); font-weight: 700; margin: 0 0 10px; }
.pateo-gt-mesure ol { margin: 0 0 12px; padding-left: 20px; font-size: 15px; }
.pateo-gt-mesure li + li { margin-top: 4px; }
.pateo-gt-astuce { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; background: var(--pateo-sauge-clair); border-radius: 12px; padding: 10px 12px; margin: 0; }
.pateo-gt-astuce .pateo-icone { width: 18px; height: 18px; margin-top: 2px; }

/* Tableaux */
.pateo-gt-section h3 { margin-top: 28px; }
#tableaux .pateo-g-tableau, #tableaux h3 { max-width: 900px; }

/* Races */
.pateo-gt-races { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 16px; }
.pateo-gt-race { background: var(--pateo-blanc); border-radius: 16px; padding: 14px 16px; }
.pateo-gt-race__nom { font-weight: 800; margin: 0 0 4px; }
.pateo-gt-race p { margin: 0; font-size: 14px; color: var(--pateo-gris); }
.pateo-gt-race strong { color: var(--pateo-anthracite); }

/* Cas particuliers */
.pateo-gt-cas { display: grid; gap: 12px; margin-top: 20px; }
.pateo-gt-cas article { display: flex; gap: 14px; align-items: flex-start; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); padding: 18px; }
.pateo-gt-cas__picto { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--pateo-sauge-clair); display: grid; place-items: center; }
.pateo-gt-cas h3 { margin: 0 0 4px; font-size: 17px; }
.pateo-gt-cas p { margin: 0; font-size: 15px; }

/* Page d'accueil des guides des tailles : une carte par guide */
.pateo-gt-guides { margin: 28px 0 8px; }
.pateo-gt-guides > h2 { margin: 0 0 16px; }
.pateo-gt-guides__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.pateo-gt-guide { display: flex; flex-direction: column; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); overflow: hidden; }
.pateo-gt-guide__image { display: block; }
.pateo-gt-guide__image .pateo-image { border-radius: 0; }
.pateo-gt-guide__corps { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 20px 20px 24px; }
.pateo-gt-guide__titre { margin: 0; font-size: 24px; }
.pateo-gt-guide__titre a { color: inherit; text-decoration: none; }
.pateo-gt-guide__titre a:hover { color: var(--pateo-sauge-fonce); text-decoration: underline; }
.pateo-gt-guide__chapeau { margin: 0; color: var(--pateo-gris); }
.pateo-gt-guide .pateo-surtitre { margin: 6px 0 0; }
.pateo-gt-guide__sommaire { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 15px; }
.pateo-gt-guide__sommaire li { display: flex; gap: 8px; align-items: flex-start; }
.pateo-gt-guide__sommaire .pateo-icone { flex: none; width: 20px; height: 20px; color: var(--pateo-sauge-fonce); margin-top: 1px; }
.pateo-gt-guide__bouton { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; }
.pateo-gt-guide__bouton .pateo-icone { width: 18px; height: 18px; }
@media (min-width: 768px) {
	.pateo-gt-guides__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
	.pateo-gt-guide__corps { padding: 24px 28px 28px; }
}
.pateo-gt-page--accueil .pateo-gt-contenu { margin-top: 12px; }
.pateo-gt-fin { max-width: 820px; }
.pateo-gt-fin .pateo-faq { margin-top: 16px; }

@media (min-width: 768px) {
	.pateo-gt-calcul { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); padding: 28px; gap: 28px; }
	.pateo-gt-champs { grid-template-columns: 1fr 1fr; }
	.pateo-gt-mesures { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
	.pateo-gt-races { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.pateo-gt-cas { grid-template-columns: 1fr 1fr; gap: 16px; }
}

/* ======================================================================
 * Tailles par race (maquette tailles-races-chien.html)
 * ====================================================================== */
/* ---------- Spécifique aux tailles par race (préfixe tr-) ---------- */
.pateo-tr-page { padding: 4px 0 0; }
.pateo-tr-page .pateo-g-entete { max-width: 820px; }
.pateo-tr-outils { display: grid; gap: 14px; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); padding: 18px; margin: 8px 0 16px; }
.pateo-tr-recherche { position: relative; }
.pateo-tr-recherche input { padding-left: 48px; }
.pateo-tr-recherche .pateo-icone { position: absolute; left: 16px; bottom: 14px; }
.pateo-tr-filtres { border: 0; margin: 0; padding: 0; min-width: 0; }
.pateo-tr-filtres legend { font-size: 14px; font-weight: 700; padding: 0; margin-bottom: 6px; }
.pateo-tr-filtres div { display: flex; flex-wrap: wrap; gap: 8px; }
.pateo-tr-filtre { min-height: 44px; padding: 0 16px; border: 2px solid var(--pateo-bordure-champ); border-radius: 999px; background: var(--pateo-blanc); font-weight: 800; font-size: 15px; cursor: pointer; }
.pateo-tr-filtre[aria-pressed="true"] { background: var(--pateo-sauge-fonce); border-color: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-tr-index { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.pateo-tr-index a, .pateo-tr-index span { display: grid; place-items: center; min-width: 36px; height: 36px; border-radius: 10px; font-weight: 800; font-size: 14px; }
.pateo-tr-index a { color: var(--pateo-sauge-fonce); background: var(--pateo-sauge-clair); text-decoration: none; }
.pateo-tr-index a:hover { background: var(--pateo-sauge-fonce); color: var(--pateo-creme); }
.pateo-tr-index span { color: var(--pateo-bordure-champ); }
.pateo-tr-compte { font-size: 14px; color: var(--pateo-gris); margin: 0 0 8px; }
.pateo-tr-vide { background: var(--pateo-blanc); border-radius: 16px; padding: 16px; margin: 0 0 16px; }

.pateo-tr-tableau { overflow-x: auto; background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); box-shadow: var(--pateo-ombre); }
.pateo-tr-tableau:focus-visible { outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 2px; }
.pateo-tr-tableau table { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.pateo-tr-tableau caption { text-align: left; padding: 14px 16px 6px; font-weight: 800; font-size: 14px; color: var(--pateo-gris); }
.pateo-tr-tableau th, .pateo-tr-tableau td { padding: 11px 14px; border-bottom: 1px solid var(--pateo-bordure-legere); text-align: left; }
.pateo-tr-tableau thead th { background: var(--pateo-sauge-clair); color: var(--pateo-sauge-fonce); font-size: 14px; position: sticky; top: 0; }
.pateo-tr-tableau thead th:first-child, .pateo-tr-tableau tbody th[scope="row"] { position: sticky; left: 0; z-index: 1; box-shadow: 1px 0 0 var(--pateo-bordure-legere); }
.pateo-tr-tableau tbody th[scope="row"] { background: var(--pateo-blanc); font-weight: 800; min-width: 170px; }
.pateo-tr-lettre th { background: var(--pateo-creme); color: var(--pateo-sauge-fonce); font-family: var(--pateo-titres); font-weight: 600; font-size: 18px; padding-top: 8px; padding-bottom: 8px; scroll-margin-top: calc(var(--pateo-entete) + 16px); }
.pateo-tr-lettre th span { position: sticky; left: 14px; }
.pateo-tr-tableau tbody[id] { scroll-margin-top: calc(var(--pateo-entete) + 16px); }

.pateo-tr-croises { display: grid; gap: 16px; }
.pateo-tr-croises article { background: var(--pateo-blanc); border-radius: var(--pateo-rayon-carte); padding: 18px; }
.pateo-tr-croises h3 { margin: 0 0 6px; font-size: 17px; }
.pateo-tr-croises p { margin: 0; font-size: 15px; }
.pateo-tr-fin { max-width: 820px; }
@media (min-width: 768px) {
	.pateo-tr-outils { grid-template-columns: minmax(0, 1fr) auto; align-items: end; padding: 22px 24px; }
	.pateo-tr-index { grid-column: 1 / -1; }
	.pateo-tr-croises { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ======================================================================
 * Pages légales (maquette legal-cgv.html)
 * ====================================================================== */
/* ---------- Gabarit des pages légales (préfixe lg-) ---------- */
.pateo-lg-page { padding: 4px 0 var(--pateo-bande); }
.pateo-lg-entete { padding: 8px 0 20px; max-width: 820px; }
.pateo-lg-entete h1 { margin-bottom: 10px; }
.pateo-lg-vigueur { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; color: var(--pateo-gris); margin: 0; }
.pateo-lg-corps { max-width: 70ch; min-width: 0; }
.pateo-lg-corps h2 { font-size: 22px; margin: 36px 0 10px; scroll-margin-top: calc(var(--pateo-entete) + 72px); }
.pateo-lg-corps h2:first-child { margin-top: 8px; }
.pateo-lg-corps p { margin-bottom: 1em; }
.pateo-lg-pied { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--pateo-bordure-legere); }
.pateo-lg-pied p { margin: 0; font-size: 14px; color: var(--pateo-gris); flex-basis: 100%; }
.pateo-lg-pied a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; font-size: 15px; }
.pateo-lg-imprimer { display: inline-flex; align-items: center; gap: 8px; }
@media (min-width: 1024px) {
	.pateo-lg-grille { display: grid; grid-template-columns: 240px minmax(0, 1fr); column-gap: 56px; align-items: start; }
	.pateo-lg-grille .pateo-lg-entete { grid-column: 2; }
	.pateo-lg-grille .pateo-g-sommaire { grid-column: 1; grid-row: 1 / span 2; position: sticky; top: calc(var(--pateo-entete) + 24px); margin: 8px 0 0; padding: 0; background: none; border: 0; }
	.pateo-lg-grille .pateo-g-sommaire__bouton { display: none; }
	.pateo-lg-grille .pateo-g-sommaire__titre { display: block; font-size: 13px; margin-bottom: 4px; }
	.pateo-lg-grille .pateo-g-sommaire ol { display: block !important; padding: 0; }
	.pateo-lg-grille .pateo-g-sommaire li a { font-size: 14px; min-height: 0; padding: 8px 0; }
	.pateo-lg-grille .pateo-g-sommaire li a[aria-current="true"] { box-shadow: inset 3px 0 0 var(--pateo-sauge-fonce); padding-left: 10px; }
	.pateo-lg-grille .pateo-lg-corps { grid-column: 2; }
}
/* Impression : seulement le texte */
@media print {
	.pateo-entete, .pateo-pied, .pateo-ariane, .pateo-evitement, .pateo-g-sommaire, .pateo-lg-pied { display: none !important; }
	body { background: #fff; font-size: 12pt; }
	.pateo-lg-corps { max-width: none; }
}

/* ======================================================================
 * Page auteur (maquette auteur.html)
 * ====================================================================== */
/* ---------- Page auteur (préfixe au-) ---------- */
.pateo-au-profil { display: grid; gap: 24px; align-items: center; padding-top: 8px; padding-bottom: 40px; }
.pateo-au-photo { width: 180px; height: 180px; border-radius: 50%; padding: 12px; font-size: 12px; justify-self: start; }
.pateo-au-profil h1 { margin-bottom: 4px; }
.pateo-au-role { font-weight: 800; color: var(--pateo-sauge-fonce); margin: 0 0 14px; }
.pateo-au-bio { max-width: 62ch; }
.pateo-au-experience { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 6px; }
.pateo-au-experience li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.pateo-au-experience .pateo-icone { width: 20px; height: 20px; margin-top: 2px; }
.pateo-au-liens { display: flex; flex-wrap: wrap; gap: 8px; }
.pateo-au-liens a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 2px solid var(--pateo-bordure-legere); border-radius: 999px; background: var(--pateo-blanc); color: var(--pateo-anthracite); text-decoration: none; font-weight: 700; font-size: 15px; }
.pateo-au-liens a:hover { border-color: var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }
.pateo-au-liens .pateo-icone { width: 20px; height: 20px; }
.pateo-au-note { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--pateo-sauge-fonce); margin: 0 0 8px; }
.pateo-au-note .pateo-icone { width: 18px; height: 18px; }
.pateo-au-role-pateo { display: grid; gap: 24px; align-items: start; }
.pateo-au-role-pateo .pateo-g-tests { margin: 0; }
@media (min-width: 768px) {
	.pateo-au-profil { grid-template-columns: 220px minmax(0, 1fr); gap: 40px; padding-bottom: 56px; }
	.pateo-au-photo { width: 220px; height: 220px; }
	.pateo-au-role-pateo { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; }
}

/* ======================================================================
 * Page 404 (maquette 404.html)
 * ====================================================================== */
/* ---------- Page 404 (préfixe e4- devenu pateo-404) ---------- */
.pateo-404 { display: grid; gap: 28px; align-items: center; padding-top: 32px; padding-bottom: 56px; }
.pateo-404__illustration { aspect-ratio: 1; max-width: 180px; width: 100%; border-radius: 50%; justify-self: center; font-size: 13px; }
.pateo-404 h1 { margin-bottom: 12px; }
.pateo-404__texte { max-width: 52ch; margin-bottom: 24px; }
.pateo-404 .pateo-rs-form { position: relative; max-width: 520px; margin-bottom: 24px; }
.pateo-404 .pateo-rs-form label { display: block; font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.pateo-404 .pateo-rs-form input { width: 100%; height: 52px; padding: 0 56px 0 20px; border: 2px solid var(--pateo-bordure-champ); border-radius: 999px; background: var(--pateo-blanc); }
.pateo-404 .pateo-rs-form input:focus { border-color: var(--pateo-sauge-fonce); outline: 3px solid var(--pateo-sauge-fonce); outline-offset: 1px; }
.pateo-404 .pateo-rs-form button { position: absolute; right: 4px; bottom: 4px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; cursor: pointer; display: grid; place-items: center; }
.pateo-404__liens-titre { font-size: 15px; font-weight: 800; margin: 0 0 8px; }
.pateo-404__liens { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.pateo-404__liens a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 2px solid var(--pateo-bordure-legere); border-radius: 999px; background: var(--pateo-blanc); color: var(--pateo-anthracite); text-decoration: none; font-weight: 700; font-size: 15px; }
.pateo-404__liens a:hover { border-color: var(--pateo-sauge-fonce); color: var(--pateo-sauge-fonce); }
.pateo-404__liens .pateo-icone { width: 20px; height: 20px; }
.pateo-404-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .pateo-404-grille { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; } }
@media (min-width: 1024px) { .pateo-404 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 56px; padding-top: 56px; padding-bottom: 72px; } .pateo-404__illustration { order: 2; max-width: 360px; } }

/* Initiale de l'auteur (sans photo) à la taille des grands portraits */
span.pateo-au-photo.pateo-auteur-photo--initiale { font-size: 64px; }
span.pateo-g-auteur__photo.pateo-auteur-photo--initiale, span.pateo-h-ecriture__photo.pateo-auteur-photo--initiale { font-size: 28px; }

/* Cadres défilants des tableaux : les liens étendus (::after) restent dedans (pas de débordement de la page en mobile) */
.pateo-k-tableau, .pateo-tr-tableau { position: relative; }