/*
 * CSS résiduel : uniquement ce que theme.json ne sait pas exprimer
 * (positionnement collant, pseudo-éléments, media queries, animations).
 * Toujours passer par les variables --wp--preset--* et --wp--custom--*.
 * Le CSS propre à une section va dans assets/css/blocks/.
 */

/* Pas d'espace entre en-tête, contenu et pied de page. */
body .wp-site-blocks > * + * { margin-block-start: 0; }
body { -webkit-font-smoothing: antialiased; overflow-x: clip; }
:where(h1, h2, h3, h4) { text-wrap: balance; letter-spacing: -0.005em; }
:where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--wp--preset--color--terracotta); outline-offset: 3px; border-radius: 6px; }
:where(.has-foret-background-color, .is-style-section-foret, .is-style-section-terracotta) :focus-visible { outline-color: var(--wp--preset--color--ocre-pale); }

/* Boutons : légère montée au survol, comme la maquette. */
.wp-element-button { transition: transform var(--wp--custom--transition--rapide), background-color var(--wp--custom--transition--rapide), border-color var(--wp--custom--transition--rapide); min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.wp-element-button:hover { transform: translateY(-2px); }
.is-style-petit .wp-element-button, .wp-block-button.is-style-petit .wp-element-button { min-height: 44px; padding: 8px 18px; font-size: 1rem; }

/* ---------- En-tête ---------- */
.wp-site-blocks > header { position: sticky; top: 0; z-index: 100; }
.admin-bar .wp-site-blocks > header { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header { top: 46px; } }
.cq-entete-in { min-height: var(--wp--custom--hauteur-entete--mobile); gap: 8px !important; }
@media (min-width: 1024px) { .cq-entete-in { min-height: var(--wp--custom--hauteur-entete--bureau); } }
.cq-logo { flex: none; background: var(--wp--preset--color--papier); border-radius: 16px; padding: 4px 13px 4px 6px; line-height: 0; margin: 0 !important; }
.cq-logo img { height: 44px !important; width: auto !important; }
@media (max-width: 389px) { .cq-logo { padding: 3px 8px 3px 4px; } .cq-logo img { height: 40px !important; } }
@media (min-width: 1024px) { .cq-logo { border-radius: 18px; padding: 4px 15px 4px 8px; } .cq-logo img { height: 54px !important; } }
.cq-entete nav.cq-menu-principal { margin-left: 12px; flex: 1 1 auto; }
.cq-entete-actions { flex: none; margin-left: auto !important; }
.cq-bouton-contact .wp-element-button { min-height: 44px; padding: 8px 16px; font-size: 1rem; }
.cq-bouton-contact .wp-element-button::before { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; -webkit-mask: url("../images/icone-message.svg") center / contain no-repeat; mask: url("../images/icone-message.svg") center / contain no-repeat; }
@media (max-width: 420px) { .cq-bouton-contact .wp-element-button { padding: 8px 14px; font-size: .9375rem; } .cq-bouton-contact .wp-element-button::before { display: none; } }

/* Menu principal, comme la maquette : liens en pilules serrées, flèche dans la pilule,
   sous-menus en cartes claires. En dessous de 1180 px : bouton menu (burger). */
.cq-menu-principal .wp-block-navigation__container { gap: 2px !important; }
.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item { border-radius: 999px; min-height: 44px; align-items: center; transition: background-color var(--wp--custom--transition--rapide); }
.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; font-weight: 700; font-size: 1rem; }
.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item.has-child > .wp-block-navigation-item__content { padding-right: 2px; }
.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item.has-child { padding-right: 10px; }
.cq-menu-principal .wp-block-navigation__submenu-icon { width: 16px; height: 16px; margin-left: 2px !important; }
.cq-menu-principal .wp-block-navigation__submenu-icon svg { width: 16px; height: 16px; stroke-width: 2px; }
.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item:hover { background: rgba(251, 245, 234, .1); }
.cq-menu-principal .current-menu-item > .wp-block-navigation-item__content { text-decoration: underline; text-decoration-color: var(--wp--preset--color--ocre-pale); text-decoration-thickness: 3px; text-underline-offset: 6px; }
@media (min-width: 1180px) {
	.cq-menu-principal .wp-block-navigation__submenu-container { top: calc(100% + 8px) !important; left: 0 !important; background: var(--wp--preset--color--papier) !important; color: var(--wp--preset--color--foret) !important; border: 0 !important; border-radius: var(--wp--preset--border-radius--moyen); box-shadow: var(--wp--preset--shadow--flottante); padding: 10px !important; min-width: 250px !important; }
	.cq-menu-principal .wp-block-navigation__submenu-container::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
	.cq-menu-principal .wp-block-navigation__submenu-container .wp-block-navigation-item__content { display: flex; align-items: center; min-height: 44px; padding: 4px 10px !important; border-radius: 10px; font-weight: 600; color: var(--wp--preset--color--foret); }
	.cq-menu-principal .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--sauge); }
	/* Sous-groupe (En famille) : intitulé en terracotta, liens en dessous. */
	.cq-menu-principal .wp-block-navigation__submenu-container .has-child > .wp-block-navigation-item__content { min-height: 0; padding: 10px 10px 2px !important; font-size: .875rem; font-weight: 800; color: var(--wp--preset--color--terracotta); pointer-events: none; }
	.cq-menu-principal .wp-block-navigation__submenu-container .has-child .wp-block-navigation__submenu-icon { display: none; }
	.cq-menu-principal .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container { position: static !important; visibility: visible !important; opacity: 1 !important; width: auto !important; height: auto !important; min-width: 0 !important; box-shadow: none; padding: 0 0 0 10px !important; border-radius: 0; }
}
/* Entre 600 et 1179 px, WordPress afficherait tout le menu : on garde le burger, comme la maquette. */
@media (min-width: 600px) and (max-width: 1179px) {
	.cq-menu-principal .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.cq-menu-principal .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
/* Menu mobile, comme la maquette : panneau vert, entrées séparées par un filet,
   sous-menus en accordéon (la flèche les déplie). */
.cq-menu-principal .wp-block-navigation__responsive-container.is-menu-open { top: var(--wp--custom--hauteur-entete--mobile); padding: 8px clamp(1rem, 4vw, 2.5rem) 40px !important; border-top: 1px solid rgba(251, 245, 234, .15); animation: none !important; }
@media (min-width: 1024px) { .cq-menu-principal .wp-block-navigation__responsive-container.is-menu-open { top: var(--wp--custom--hauteur-entete--bureau); } }
.admin-bar .cq-menu-principal .wp-block-navigation__responsive-container.is-menu-open { margin-top: 32px; }
@media (max-width: 782px) { .admin-bar .cq-menu-principal .wp-block-navigation__responsive-container.is-menu-open { margin-top: 46px; } }
.cq-menu-principal .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 0 !important; }
/* La croix prend la place du bouton menu, dans l'en-tête resté visible. */
.cq-menu-principal .is-menu-open .wp-block-navigation__responsive-container-close { position: fixed; top: 10px; right: clamp(1rem, 4vw, 2.5rem); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 12px; color: var(--wp--preset--color--creme); }
@media (min-width: 1024px) { .cq-menu-principal .is-menu-open .wp-block-navigation__responsive-container-close { top: 18px; } }
.admin-bar .cq-menu-principal .is-menu-open .wp-block-navigation__responsive-container-close { margin-top: 32px; }
@media (max-width: 782px) { .admin-bar .cq-menu-principal .is-menu-open .wp-block-navigation__responsive-container-close { margin-top: 46px; } }
.cq-menu-principal .is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; }
.cq-menu-principal .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item { width: 100%; display: grid !important; grid-template-columns: 1fr 56px; align-items: center; border-radius: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(251, 245, 234, .14); background: none !important; }
.cq-menu-principal .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { grid-column: 1; font-family: var(--wp--preset--font-family--titres); font-weight: 500; font-size: 1.3rem; min-height: 56px; padding: 0 4px !important; box-sizing: border-box; }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-icon { display: flex !important; grid-column: 2; justify-self: center; width: 56px !important; height: 56px !important; align-items: center; justify-content: center; margin: 0 !important; padding: 0; color: var(--wp--preset--color--creme); }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-icon svg { width: 20px; height: 20px; transition: transform .25s; }
.cq-menu-principal .is-menu-open .cq-deplie > .wp-block-navigation__submenu-icon svg { transform: rotate(180deg); }
.cq-menu-principal .is-menu-open .has-child > .wp-block-navigation__submenu-container { display: none !important; grid-column: 1 / -1; padding: 0 0 12px 8px !important; }
.cq-menu-principal .is-menu-open .cq-deplie > .wp-block-navigation__submenu-container { display: flex !important; flex-direction: column; gap: 0; }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { min-height: 44px; box-sizing: border-box; padding: 4px 10px !important; font-weight: 600; font-size: 1rem; border-radius: 10px; }
/* Sous-groupe (En famille) dans le panneau : intitulé ocre, liens toujours visibles. */
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-container .has-child { display: flex !important; flex-direction: column; align-items: flex-start; border: 0; }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-container .has-child > .wp-block-navigation-item__content { min-height: 0; padding: 10px 10px 2px !important; font-size: .875rem; font-weight: 800; color: var(--wp--preset--color--ocre-pale); }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-container .has-child > .wp-block-navigation__submenu-icon { display: none !important; }
.cq-menu-principal .is-menu-open .wp-block-navigation__submenu-container .has-child > .wp-block-navigation__submenu-container { display: flex !important; padding: 0 0 0 10px !important; }
.cq-menu-principal .wp-block-navigation__responsive-container-open svg, .cq-menu-principal .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }

/* ---------- Pied de page (cotes de la maquette) ---------- */
.cq-pied { padding-top: 64px; padding-bottom: 28px; }
.cq-pied a { color: var(--wp--preset--color--creme); text-decoration: none; font-weight: inherit; }
.cq-pied a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--ocre-pale); }
.cq-pied-grille { gap: 36px 56px !important; margin-top: 0 !important; margin-bottom: 0 !important; }
@media (min-width: 900px) { .cq-pied-grille { display: grid !important; grid-template-columns: 1.1fr 2fr; } .cq-pied-grille > .wp-block-column { flex-basis: auto !important; } }
.cq-pied-logo { box-sizing: border-box; background: var(--wp--preset--color--papier); border-radius: var(--wp--preset--border-radius--carte); padding: 10px; width: 170px; margin: 0 !important; line-height: 0; }
.cq-pied-logo img { width: 150px !important; height: auto; }
.cq-pied-coord { display: flex; flex-direction: column; gap: 9px; }
.cq-pied-coord > * { margin: 0 !important; }
.cq-pied-coord > .cq-pied-adresse { margin-top: 19px !important; }
.cq-pied-coord > p { display: flex; gap: 10px; align-items: flex-start; min-height: 32px; }
.cq-pied-adresse::before, .cq-pied-contact::before { content: ""; width: 20px; height: 20px; margin-top: 3px; flex: none; background: var(--wp--preset--color--ocre-pale); -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; }
.cq-pied-adresse::before { -webkit-mask-image: url("../images/icone-lieu.svg"); mask-image: url("../images/icone-lieu.svg"); }
.cq-pied-contact::before { -webkit-mask-image: url("../images/icone-message.svg"); mask-image: url("../images/icone-message.svg"); }
.cq-pied-reseaux { margin-top: 7px !important; gap: 8px !important; }
.cq-pied-reseaux .wp-social-link { box-sizing: border-box; background: transparent !important; color: var(--wp--preset--color--creme) !important; border: 2px solid rgba(251, 245, 234, .35); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; margin: 0 !important; }
.cq-pied-reseaux .wp-social-link:hover { border-color: var(--wp--preset--color--ocre-pale); transform: none; }
.cq-pied-reseaux .wp-social-link a { padding: 0; }
.cq-pied-reseaux .wp-social-link svg { width: 20px; height: 20px; }
/* Menu du pied : une colonne par entrée du menu, sous-entrées toujours visibles. */
.cq-menu-pied { width: 100%; }
.cq-menu-pied .wp-block-navigation__container { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px !important; align-items: start; width: 100%; }
@media (min-width: 640px) { .cq-menu-pied .wp-block-navigation__container { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cq-menu-pied .wp-block-navigation__container > .wp-block-navigation-item:not(.has-child) { display: none; }
.cq-menu-pied .wp-block-navigation__container > .wp-block-navigation-item { display: flex; flex-direction: column; align-items: flex-start; }
.cq-menu-pied .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: 1.15rem; line-height: 1.08; color: var(--wp--preset--color--ocre-pale) !important; margin-bottom: 8px; padding: 0; }
.cq-menu-pied .wp-block-navigation__submenu-icon { display: none !important; }
.cq-menu-pied .wp-block-navigation__submenu-container { position: static !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 0 !important; visibility: visible !important; opacity: 1 !important; width: auto !important; height: auto !important; min-width: 0 !important; background: none !important; border: 0 !important; padding: 0 !important; overflow: visible !important; color: var(--wp--preset--color--creme) !important; }
.cq-menu-pied .wp-block-navigation__submenu-container .wp-block-navigation-item { display: flex; flex-direction: column; align-items: flex-start; }
.cq-menu-pied .wp-block-navigation__submenu-container .wp-block-navigation-item__content { display: flex; align-items: center; min-height: 40px; padding: 0 !important; font-weight: 600; font-size: 1.125rem; line-height: 1.6; color: var(--wp--preset--color--creme) !important; }
/* Sous-groupe (En famille) : ses liens rejoignent simplement la liste, comme la maquette. */
.cq-menu-pied .wp-block-navigation__submenu-container .wp-block-navigation-item > a.wp-block-navigation-item__content[href="#"] { display: none !important; }
.cq-menu-pied .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container { padding: 0 !important; }
.cq-pied-bas { margin-top: 48px !important; padding-top: 20px; border-top: 1px solid rgba(251, 245, 234, .18); font-size: .9375rem; color: #DCE3D4; gap: 10px !important; }
.cq-pied-bas p { margin: 0; }
.cq-menu-legal .wp-block-navigation__container { gap: 4px 10px !important; }
.cq-menu-legal .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; font-weight: 400; font-size: .9375rem; text-decoration: underline !important; color: var(--wp--preset--color--creme) !important; }
.cq-menu-legal .wp-block-navigation-item + .wp-block-navigation-item::before { content: "·"; margin-right: 10px; color: #DCE3D4; }
.cq-menu-legal .wp-block-navigation-item { flex-direction: row; align-items: center; }

/* ---------- Sections communes ---------- */
.cq-section { padding-top: var(--wp--preset--spacing--section); padding-bottom: var(--wp--preset--spacing--section); }
.cq-texte-doux { color: var(--wp--preset--color--texte-doux); font-size: var(--wp--preset--font-size--grand); }
.cq-lien-fleche a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 800; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.cq-lien-fleche a::after { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("../images/icone-fleche.svg") center / contain no-repeat; mask: url("../images/icone-fleche.svg") center / contain no-repeat; transition: transform var(--wp--custom--transition--rapide); }
.cq-lien-fleche a:hover::after { transform: translateX(3px); }
/* Pictogramme devant un bouton ou un titre : classe cq-ico-<nom>. */
[class*="cq-ico-"] > .wp-element-button::before, h2[class*="cq-ico-"]::before { content: ""; width: 1.15em; height: 1.15em; flex: none; background: currentColor; -webkit-mask: var(--cq-ico) center / contain no-repeat; mask: var(--cq-ico) center / contain no-repeat; }
.cq-ico-message { --cq-ico: url("../images/icone-message.svg"); }
.cq-ico-maison { --cq-ico: url("../images/icone-maison.svg"); }
.cq-ico-coeur { --cq-ico: url("../images/icone-coeur.svg"); }
.cq-ico-etiquette { --cq-ico: url("../images/icone-etiquette.svg"); }
.cq-ico-lieu { --cq-ico: url("../images/icone-lieu.svg"); }
.cq-ico-itineraire { --cq-ico: url("../images/icone-itineraire.svg"); }
.cq-ico-horloge { --cq-ico: url("../images/icone-horloge.svg"); }
.cq-ico-telecharger { --cq-ico: url("../images/icone-telecharger.svg"); }

/* Fil d'Ariane */
.cq-fil { font-size: var(--wp--preset--font-size--petit); font-weight: 700; color: var(--wp--preset--color--texte-doux); margin-bottom: var(--wp--preset--spacing--m) !important; }
.cq-fil a { color: var(--wp--preset--color--terracotta); }

/* ---------- Fiche d'un animal ---------- */
.cq-fiche-haut { padding-top: var(--wp--preset--spacing--l); padding-bottom: var(--wp--preset--spacing--section); }
.cq-fiche-grille { gap: 28px 56px !important; align-items: flex-start !important; }
.cq-fiche-infos { display: flex; flex-direction: column; gap: 16px; }
.cq-fiche-infos > * { margin: 0 !important; }
.cq-fiche-nom { font-size: var(--wp--preset--font-size--titre-geant) !important; }
.cq-bloc { padding: 22px 20px 24px; }
@media (min-width: 640px) { .cq-bloc { padding: 24px 26px 26px; } }
.cq-bloc > * + * { margin-top: 14px !important; }
.cq-bloc-titre { display: flex; align-items: center; gap: 10px; font-size: 1.45rem !important; }
.cq-bloc-titre::before { color: var(--wp--preset--color--brique); background: var(--wp--preset--color--brique) !important; }
.cq-identite { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.cq-identite > * { margin: 0 !important; }
.cq-identite-ligne { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 14px; background: var(--wp--preset--color--creme); }
.cq-identite-ligne > p { margin: 0 !important; }
.cq-identite-ligne.is-large { grid-column: 1 / -1; }
.cq-identite-k { font-size: .875rem; font-weight: 800; color: var(--wp--preset--color--terracotta); }
.cq-identite-v { font-weight: 700; color: var(--wp--preset--color--foret); line-height: 1.35; overflow-wrap: anywhere; }
.cq-fiche-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px !important; }
.cq-fiche-actions .wp-block-button { width: 100%; }
.cq-fiche-actions .wp-element-button { width: 100%; min-height: 56px; font-size: 1rem; }
.cq-fiche-actions .wp-block-button:first-child { grid-column: 1 / -1; }
@media (min-width: 900px) { .cq-fiche-actions .wp-block-button:first-child { grid-column: auto; } }
/* Histoire */
.cq-histoire { gap: 18px 28px !important; align-items: flex-start !important; }
.cq-histoire-carte { padding: 24px 22px 26px; display: flex; flex-direction: column; gap: 12px; }
@media (min-width: 640px) { .cq-histoire-carte { padding: 32px 34px 34px; } }
.cq-histoire-carte > * { margin: 0 !important; }
.cq-histoire-carte h2 { font-size: clamp(1.7rem, 6vw, 2.4rem); }
.cq-histoire-k { font-family: var(--wp--preset--font-family--titres); font-size: 1.125rem; font-weight: 600; color: var(--wp--preset--color--terracotta); margin-top: 6px !important; }
.cq-histoire-fait { font-size: 1.125rem; font-weight: 700; color: var(--wp--preset--color--foret); }
.cq-histoire-citation { position: relative; margin: 8px 0 0 !important; border: 0 !important; background: var(--wp--preset--color--creme) !important; font-size: 1.125rem; line-height: 1.65; }
.cq-histoire-citation::before { content: ""; position: absolute; left: 0; top: 16px; bottom: 16px; width: 5px; border-radius: 0 6px 6px 0; background: var(--wp--preset--color--brique); }
.cq-histoire-plus { background: var(--wp--preset--color--foret) !important; color: var(--wp--preset--color--creme) !important; border-color: transparent !important; }
.cq-histoire-plus h2 { color: var(--wp--preset--color--creme); }
.cq-histoire-plus .cq-histoire-k { color: var(--wp--preset--color--ocre-pale); }
/* Contact sous la fiche */
.cq-contact { gap: 24px 56px !important; align-items: flex-start !important; }
.cq-formulaire { padding: 24px 22px; }
@media (min-width: 640px) { .cq-formulaire { padding: 32px; } }
.cq-autres-tete { margin-bottom: var(--wp--preset--spacing--l) !important; }
.cq-autres-tete h2 { margin: 0; }

/* ---------- Cartes d'animaux (listes) ---------- */
.cq-grille-animaux { gap: 18px !important; }
.cq-carte-animal { height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.cq-carte-animal > * { margin: 0 !important; }
.cq-carte-animal-photo { position: relative; }
.cq-carte-animal-photo .wp-block-post-featured-image { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--wp--preset--color--sable); }
/* Le cadre garde sa forme même si le fichier de la photo manque (sinon la carte s'étire). */
.cq-carte-animal-photo .wp-block-post-featured-image img { width: 100%; height: 100% !important; object-fit: cover; }
.cq-carte-animal-photo .wp-block-post-featured-image img { transition: transform .5s var(--wp--custom--transition--rapide); }
.cq-carte-animal:hover .cq-carte-animal-photo img { transform: scale(1.04); }
.cq-carte-animal-photo .refuge-etiquettes { position: absolute; left: 12px; top: 12px; margin: 0 !important; }
.cq-carte-animal-corps { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 16px 16px 18px; }
.cq-carte-animal-corps > * { margin: 0 !important; }
.cq-carte-animal-nom { font-size: 1.5rem !important; }
.cq-carte-animal-nom a { color: inherit; text-decoration: none; }
/* Toute la carte est cliquable : le lien du nom s'étend sur la carte (la photo et le bouton gardent le leur, au-dessus). */
.cq-carte-animal, .cq-carte-article { position: relative; }
:is(.cq-carte-animal-nom, .cq-carte-article-titre) a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
:is(.cq-carte-animal, .cq-carte-article) :is(.wp-block-post-featured-image a, .wp-block-button, .cq-carte-article-cat a) { position: relative; z-index: 2; }
.cq-carte-animal-photo .refuge-etiquettes { z-index: 3; pointer-events: none; }
.cq-carte-animal-nom a:focus-visible, .cq-carte-article-titre a:focus-visible { outline: none; }
:is(.cq-carte-animal, .cq-carte-article):has(:is(.cq-carte-animal-nom, .cq-carte-article-titre) a:focus-visible) { outline: 3px solid var(--wp--preset--color--terracotta); outline-offset: 3px; }
.editor-styles-wrapper :is(.cq-carte-animal-nom, .cq-carte-article-titre) a::after { display: none; }
.cq-carte-animal-meta { font-weight: 800; font-size: .9375rem; color: var(--wp--preset--color--terracotta); }
.cq-carte-animal-race { font-size: .9375rem; color: var(--wp--preset--color--texte-doux); }
.cq-carte-animal .refuge-ententes { margin: 6px 0 4px !important; }
.cq-carte-animal-bouton { margin-top: auto !important; padding-top: 8px; }
.cq-carte-animal-bouton .wp-block-button, .cq-carte-animal-bouton .wp-element-button { width: 100%; }
.cq-carte-animal-bouton .wp-element-button { min-height: 44px; padding: 8px 16px; font-size: 1rem; }


/* ---------- Boutons : variantes ---------- */
.cq-petit .wp-element-button { min-height: 44px; padding: 8px 18px; font-size: 1rem; }
.cq-fleche .wp-element-button::after { content: ""; width: 1.2em; height: 1.2em; flex: none; background: currentColor; -webkit-mask: url("../images/icone-fleche.svg") center / contain no-repeat; mask: url("../images/icone-fleche.svg") center / contain no-repeat; transition: transform var(--wp--custom--transition--rapide); }
.cq-fleche .wp-element-button:hover::after { transform: translateX(4px); }
.cq-ico-cadeau { --cq-ico: url("../images/icone-cadeau.svg"); }
.cq-ico-patte { --cq-ico: url("../images/icone-patte.svg"); }
h3[class*="cq-ico-"]::before { content: ""; width: 1em; height: 1em; flex: none; background: var(--wp--preset--color--brique); -webkit-mask: var(--cq-ico) center / contain no-repeat; mask: var(--cq-ico) center / contain no-repeat; }
.cq-tete { display: flex; flex-direction: column; gap: 12px; max-width: 760px; margin-bottom: 28px !important; margin-left: max(0px, calc((100% - var(--wp--style--global--wide-size)) / 2)) !important; margin-right: auto !important; }
.cq-tete > * { margin: 0 !important; }
@media (min-width: 1024px) { .cq-tete { margin-bottom: 44px !important; } }
.cq-tete-centree { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; margin-bottom: 28px !important; }
.cq-tete-centree > * { margin: 0 !important; }
@media (min-width: 1024px) { .cq-tete-centree { margin-bottom: 44px !important; } }
.cq-pastille { display: inline-block; padding: 6px 16px; border-radius: 999px; background: var(--wp--preset--color--foret-moyen); color: #fff; font-family: var(--wp--preset--font-family--titres); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: .9375rem; }
.cq-section > .alignwide + .alignwide { margin-top: 0; }

/* ---------- Accueil : haut de page ---------- */
.cq-accueil-haut { padding-top: 22px; padding-bottom: 64px; overflow: hidden; }
.cq-accueil-haut-grille { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "titre photo" "sous sous" "adr adr" "cta cta" "rdv rdv" "raccourcis raccourcis"; column-gap: 14px; align-items: start; }
.cq-accueil-haut-grille > * { margin: 0 !important; }
/* Titre et logo Vesoul Agglo sur la même ligne (le logo passe dessous si la place manque). */
.cq-accueil-titre-ligne { grid-area: titre; align-self: center; flex-wrap: nowrap !important; gap: clamp(8px, 2vw, 22px) !important; }
.cq-accueil-titre-ligne > * { margin: 0 !important; }
.cq-accueil-titre { flex: 0 1 auto; min-width: 0; font-size: clamp(2.75rem, 13vw, 6rem) !important; font-weight: 700; line-height: .95 !important; letter-spacing: -.01em; }
.cq-accueil-sous { grid-area: sous; margin-top: 14px !important; font-family: var(--wp--preset--font-family--titres); font-weight: 500; font-size: clamp(1.25rem, 5.2vw, 1.9rem); line-height: 1.2; color: var(--wp--preset--color--terracotta); }
.cq-accueil-adresse { grid-area: adr; display: flex; gap: 10px; align-items: flex-start; margin-top: 14px !important; font-weight: 700; font-size: 1.0625rem; line-height: 1.45; }
.cq-accueil-adresse::before { content: ""; width: 1.25em; height: 1.25em; margin-top: 2px; flex: none; background: var(--wp--preset--color--brique); -webkit-mask: url("../images/icone-lieu.svg") center / contain no-repeat; mask: url("../images/icone-lieu.svg") center / contain no-repeat; }
.cq-accueil-cta { grid-area: cta; margin-top: 20px !important; flex-direction: column; align-items: stretch !important; gap: 10px; }
.cq-accueil-cta .wp-block-button, .cq-accueil-cta .wp-element-button { width: 100%; }
@media (min-width: 640px) { .cq-accueil-cta { flex-direction: row; align-items: center !important; } .cq-accueil-cta .wp-block-button, .cq-accueil-cta .wp-element-button { width: auto; } }
.cq-accueil-rdv { grid-area: rdv; margin-top: 22px !important; padding: 16px 18px; border-radius: var(--wp--preset--border-radius--moyen); background: var(--wp--preset--color--sable); flex-direction: column; align-items: flex-start !important; gap: 12px !important; }
.cq-accueil-rdv p { margin: 0; font-size: 1.0625rem; }
.cq-accueil-rdv .wp-block-buttons { flex: none; }
.cq-accueil-rdv .wp-element-button { white-space: nowrap; }
.cq-raccourcis { grid-area: raccourcis; margin-top: 18px !important; gap: 8px !important; }
.cq-raccourci .wp-element-button { min-height: 44px; padding: 6px 16px; border-radius: 999px; background: var(--wp--preset--color--papier); border: 1px solid var(--wp--custom--ligne); color: var(--wp--preset--color--foret); font-weight: 700; font-size: 1rem; gap: 8px; }
.cq-raccourci .wp-element-button:hover { background: var(--wp--preset--color--sauge); border-color: #D3E0C6; transform: none; }
.cq-raccourci .wp-element-button::before { background: var(--wp--preset--color--brique) !important; }
.cq-accueil-agglo { flex: none; }
.cq-accueil-agglo img { width: clamp(40px, 11vw, 80px) !important; height: auto; padding: 6px 8px; background: #fff; border-radius: 14px; box-shadow: var(--wp--preset--shadow--carte); box-sizing: border-box; }
/* Taille du titre réglée pour que « SPA Vesoul » et le logo tiennent sur une ligne (au-delà du téléphone). */
@media (min-width: 600px) { .cq-accueil-titre { font-size: clamp(2.75rem, 9.5vw, 6rem) !important; } }
@media (min-width: 900px) { .cq-accueil-titre { font-size: clamp(3.6rem, 6.6vw, 6rem) !important; } }
/* La photo abritée sous le toit de la maison */
.cq-maison { grid-area: photo; position: relative; width: clamp(104px, 30vw, 150px); }
.cq-maison::before { content: ""; position: relative; z-index: 2; display: block; width: 112%; margin-left: -6%; aspect-ratio: 200 / 92; background: var(--wp--preset--color--foret-moyen); -webkit-mask: url("../images/toit-maison.svg") center / contain no-repeat; mask: url("../images/toit-maison.svg") center / contain no-repeat; }
.cq-maison img { position: relative; display: block; width: 100%; margin-top: -37.5%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; clip-path: polygon(50% 0, 100% 32.7%, 100% 100%, 0 100%, 0 32.7%); border-radius: 0 0 18px 18px; background: var(--wp--preset--color--sable); }
@media (min-width: 900px) {
	.cq-accueil-haut { padding-top: 48px; padding-bottom: 110px; }
	.cq-accueil-haut-grille { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); grid-template-areas: ". photo" "titre photo" "sous photo" "adr photo" "cta photo" "rdv photo" "raccourcis photo" ". photo"; column-gap: 56px; grid-template-rows: 1fr auto auto auto auto auto auto 1fr; }
	.cq-accueil-titre-ligne { align-self: end; }
	.cq-maison { width: 100%; max-width: 470px; justify-self: end; align-self: center; }
	.cq-maison img { border-radius: 0 0 30px 30px; }
	.cq-accueil-rdv { flex-direction: row; align-items: center !important; justify-content: space-between; gap: 20px !important; }
}

/* ---------- Accueil : nos besoins du moment ---------- */
.cq-besoins { gap: 18px !important; }
@media (min-width: 760px) { .cq-besoins { gap: 26px !important; } }
.cq-besoin { display: grid; overflow: hidden; }
.cq-besoin > * { margin: 0 !important; }
@media (min-width: 1100px) { .cq-besoin { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }
.cq-besoin-photo { aspect-ratio: 16 / 10; overflow: hidden; background: var(--wp--preset--color--sable); }
@media (min-width: 1100px) { .cq-besoin-photo { aspect-ratio: auto; height: 100%; min-height: 300px; } }
.cq-besoin-photo img { width: 100%; height: 100%; object-fit: cover; }
.cq-besoin-texte { padding: 24px 22px 26px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; }
.cq-besoin-texte > * { margin: 0 !important; }
.cq-besoin-texte h3 { font-size: clamp(1.6rem, 5vw, 2rem); line-height: 1.05; }
.cq-besoin-pour { font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: 1.2rem; color: var(--wp--preset--color--terracotta); line-height: 1.2; }
.cq-besoin-texte .wp-block-buttons { margin-top: auto !important; }

/* ---------- Accueil : les valeurs (chemin de pattes) ---------- */
.cq-valeurs { display: grid; gap: 96px; counter-reset: valeur; }
.cq-valeurs > * { margin: 0 !important; }
.cq-valeur { --p: 1; position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; counter-increment: valeur; }
.cq-valeur > * { margin: 0 !important; }
.cq-valeur::before { content: counter(valeur); position: relative; z-index: 1; display: grid; place-items: end; width: 104px; height: 104px; margin-bottom: 0; border-radius: 50%; box-shadow: var(--wp--preset--shadow--flottante); background: var(--wp--preset--color--papier); color: transparent; transition: transform .5s cubic-bezier(.2,.8,.2,1), background-color .5s cubic-bezier(.2,.8,.2,1); }
.cq-valeur h3::after { content: ""; position: absolute; z-index: 2; left: 50%; top: 29px; width: 46px; height: 46px; margin-left: -23px; background: var(--wp--preset--color--terracotta); -webkit-mask: var(--cq-valeur-ico) center / contain no-repeat; mask: var(--cq-valeur-ico) center / contain no-repeat; transition: transform .5s cubic-bezier(.2,.8,.2,1), background-color .5s cubic-bezier(.2,.8,.2,1); }
.cq-valeur-refuge { --cq-valeur-ico: url("../images/valeur-maison.svg"); }
.cq-valeur-soins { --cq-valeur-ico: url("../images/valeur-soins.svg"); }
.cq-valeur-famille { --cq-valeur-ico: url("../images/valeur-coeur.svg"); }
.cq-valeur h3 { position: static; font-size: 1.6rem !important; letter-spacing: .06em; text-transform: uppercase; color: var(--wp--preset--color--foret); margin-top: 8px !important; }
.cq-valeur h3::before { content: counter(valeur); position: absolute; z-index: 3; left: 50%; top: -4px; margin-left: 20px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--wp--preset--color--foret-moyen); color: #fff; font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: 1.15rem; letter-spacing: 0; border: 3px solid var(--wp--preset--color--sauge); box-sizing: border-box; }
.cq-valeur p { max-width: 34ch; color: var(--wp--preset--color--texte-doux); }
.cq-valeur:not(:last-child)::after { content: ""; position: absolute; left: 50%; top: 100%; width: 34px; height: 84px; margin: 6px 0 0 -17px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='44' viewBox='0 0 28 44'%3E%3Cg fill='%23CB6636' fill-opacity='.75'%3E%3Cg transform='translate(18 18) rotate(180)'%3E%3Cellipse cx='8' cy='12' rx='4.2' ry='3.6'/%3E%3Ccircle cx='3' cy='6.5' r='1.7'/%3E%3Ccircle cx='6.2' cy='3.6' r='1.7'/%3E%3Ccircle cx='9.8' cy='3.6' r='1.7'/%3E%3Ccircle cx='13' cy='6.5' r='1.7'/%3E%3C/g%3E%3Cg transform='translate(26 40) rotate(180)'%3E%3Cellipse cx='8' cy='12' rx='4.2' ry='3.6'/%3E%3Ccircle cx='3' cy='6.5' r='1.7'/%3E%3Ccircle cx='6.2' cy='3.6' r='1.7'/%3E%3Ccircle cx='9.8' cy='3.6' r='1.7'/%3E%3Ccircle cx='13' cy='6.5' r='1.7'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat space; background-position: center top; background-size: 34px 53px;  clip-path: inset(0 0 calc((1 - var(--p)) * 100%) 0); }
@media (min-width: 960px) {
	.cq-valeurs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; }
	.cq-valeur:not(:last-child)::after { left: calc(50% + 66px); top: 34px; width: calc(100% + 48px - 132px); height: 37px; margin: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='28' viewBox='0 0 44 28'%3E%3Cg fill='%23CB6636' fill-opacity='.75'%3E%3Cg transform='translate(18 10) rotate(90)'%3E%3Cellipse cx='8' cy='12' rx='4.2' ry='3.6'/%3E%3Ccircle cx='3' cy='6.5' r='1.7'/%3E%3Ccircle cx='6.2' cy='3.6' r='1.7'/%3E%3Ccircle cx='9.8' cy='3.6' r='1.7'/%3E%3Ccircle cx='13' cy='6.5' r='1.7'/%3E%3C/g%3E%3Cg transform='translate(40 0) rotate(90)'%3E%3Cellipse cx='8' cy='12' rx='4.2' ry='3.6'/%3E%3Ccircle cx='3' cy='6.5' r='1.7'/%3E%3Ccircle cx='6.2' cy='3.6' r='1.7'/%3E%3Ccircle cx='9.8' cy='3.6' r='1.7'/%3E%3Ccircle cx='13' cy='6.5' r='1.7'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-repeat: space no-repeat; background-position: left center; background-size: 58px 37px;  clip-path: inset(0 calc((1 - var(--p)) * 100%) 0 0); }
}
/* Les pattes avancent au défilement et les étapes s'allument (assets/js/animations.js). */
.cq-anim .cq-valeur::before, .cq-anim .cq-valeur h3::after { transform: scale(.88); }
.cq-anim .cq-valeur::before { background-color: #D3E0C6; }
.cq-anim .cq-valeur h3::after { background-color: #43603A; }
.cq-valeur.is-on::before { transform: none; background-color: var(--wp--preset--color--terracotta); }
.cq-valeur.is-on h3::after { transform: none; background-color: #fff; }

/* ---------- Accueil : comment nous soutenir ---------- */
.cq-soutenir-intro { color: #E6ECDF; font-size: 1.125rem; }
.cq-tete:has(.cq-soutenir-intro) { margin-bottom: 44px !important; }
.cq-soutiens { gap: 18px !important; }
@media (min-width: 760px) { .cq-soutiens { gap: 26px !important; } }
.cq-soutien { display: flex; flex-direction: column; overflow: hidden; height: 100%; color: var(--wp--preset--color--texte); }
.cq-soutien > * { margin: 0 !important; }
.cq-soutien-photo { aspect-ratio: 16 / 10; overflow: hidden; background: var(--wp--preset--color--sable); }
.cq-soutien-photo img { width: 100%; height: 100%; object-fit: cover; }
.cq-soutien-texte { display: flex; flex-direction: column; gap: 10px; padding: 22px 22px 24px; flex: 1; }
.cq-soutien-texte > * { margin: 0 !important; }
.cq-soutien h3 { display: flex; align-items: center; gap: 10px; font-size: 1.6rem !important; color: var(--wp--preset--color--foret) !important; }
.cq-soutien .wp-block-buttons { margin-top: auto !important; }

/* ---------- Accueil : Prêt ? ---------- */
.cq-pret-grille { gap: 28px 56px !important; }
.cq-pret-titre { font-size: clamp(2.6rem, 12vw, 5rem) !important; font-weight: 700; margin: 0; }
.cq-pret-texte { font-size: 1.25rem; font-weight: 700; margin: 10px 0 22px !important; }
.cq-pret-photos .wp-block-post-template { gap: 8px !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
@media (min-width: 640px) { .cq-pret-photos .wp-block-post-template { gap: 14px !important; } }
.cq-pret-photos .wp-block-post { transition: transform .3s var(--wp--custom--transition--rapide); }
.cq-pret-photos .wp-block-post:nth-child(even) { transform: translateY(14px); }
.cq-pret-photos:hover .wp-block-post { transform: translateY(-4px); }
.cq-pret-photos:hover .wp-block-post:nth-child(even) { transform: translateY(8px); }
.cq-pret-photos .wp-block-post-featured-image { margin: 0; aspect-ratio: 3 / 4; border-radius: var(--wp--preset--border-radius--moyen); overflow: hidden; border: 3px solid rgba(255, 255, 255, .85); background: var(--wp--preset--color--terracotta-clair); }

/* ---------- Accueil : sur le blog ---------- */
.cq-blog { gap: 18px !important; }
@media (min-width: 760px) { .cq-blog { gap: 26px !important; } }
.cq-blog-carte { display: grid; overflow: hidden; height: 100%; }
.cq-blog-carte > * { margin: 0 !important; }
@media (min-width: 1100px) { .cq-blog-carte { grid-template-columns: 220px minmax(0, 1fr); } }
.cq-blog-photo { aspect-ratio: 16 / 9; overflow: hidden; background: var(--wp--preset--color--sable); }
@media (min-width: 1100px) { .cq-blog-photo { aspect-ratio: auto; height: 100%; } }
.cq-blog-photo img { width: 100%; height: 100%; object-fit: cover; }
.cq-blog-texte { display: flex; flex-direction: column; gap: 10px; padding: 22px; }
.cq-blog-texte > * { margin: 0 !important; }
.cq-blog-texte h3 { font-size: 1.45rem !important; }
.cq-blog-texte .wp-block-buttons { margin-top: auto !important; }

/* ---------- Accueil : comment nous trouver ---------- */
.cq-plan { gap: 22px 48px !important; }
.cq-plan .wp-block-column > * + * { margin-top: 16px !important; }
.cq-plan-texte { font-size: 1.125rem; }
.cq-plan-texte a { white-space: nowrap; }
.cq-carte { position: relative; border-radius: var(--wp--preset--border-radius--grand); overflow: hidden; background: var(--wp--preset--color--sable); border: 6px solid var(--wp--preset--color--papier); box-shadow: var(--wp--preset--shadow--flottante); height: 320px; }
@media (min-width: 960px) { .cq-carte { height: 440px; } }
.cq-carte iframe { display: block; width: 100%; height: 100%; border: 0; }
.cq-horaires { margin-top: 56px !important; gap: 22px 40px !important; align-items: flex-start !important; }
.cq-horaires .wp-block-column > * + * { margin-top: 10px !important; }
.cq-horaires-titre { font-size: clamp(1.3rem, 4.2vw, 1.6rem) !important; margin-bottom: 12px !important; }
.cq-horaire { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 14px 16px 14px 20px; background: var(--wp--preset--color--papier); border-radius: var(--wp--preset--border-radius--moyen); border: 1px solid rgba(227, 213, 190, .7); }
.cq-horaire > * { margin: 0 !important; }
.cq-horaire::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 5px; border-radius: 0 6px 6px 0; background: var(--wp--preset--color--ocre-pale); }
.cq-horaire.is-ok::before { background: var(--wp--custom--etat--ok); }
.cq-horaire.is-non::before { background: var(--wp--preset--color--brique); }
.cq-horaire-k { font-weight: 700; color: var(--wp--preset--color--texte-doux); font-size: .9375rem; }
.cq-horaire-v { font-family: var(--wp--preset--font-family--titres); font-weight: 500; font-size: 1.25rem; line-height: 1.25; color: var(--wp--preset--color--foret); }
.cq-horaire.is-aujourdhui { border-color: var(--wp--preset--color--foret-moyen); box-shadow: 0 0 0 2px var(--wp--preset--color--foret-moyen); }
.cq-horaire.is-aujourdhui::after { content: "Aujourd'hui"; align-self: flex-start; margin-top: 6px; padding: 2px 10px; border-radius: 999px; background: var(--wp--preset--color--foret-moyen); color: #fff; font-size: .8125rem; font-weight: 800; }
/* Carte « Ouvert aujourd'hui ? » */
.cq-auj { padding: 22px 22px 24px; border-radius: var(--wp--preset--border-radius--grand); background: var(--wp--preset--color--papier); box-shadow: var(--wp--preset--shadow--flottante); border: 1px solid rgba(227, 213, 190, .7); display: flex; flex-direction: column; gap: 8px; }
.cq-auj[hidden] { display: none; }
.cq-auj > * { margin: 0; }
@media (min-width: 960px) { .cq-auj { position: sticky; top: calc(var(--wp--custom--hauteur-entete--bureau) + 24px); padding: 32px; } }
.cq-auj-titre { font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: clamp(1.6rem, 6.6vw, 2.4rem); line-height: 1.05; color: var(--wp--preset--color--foret); }
.cq-auj-jour { font-weight: 800; color: var(--wp--preset--color--texte-doux); font-size: 1.0625rem; }
.cq-auj-etat { display: flex; align-items: center; gap: 12px; margin-top: 10px !important; padding: 14px 16px; border-radius: var(--wp--preset--border-radius--moyen); font-weight: 800; font-size: 1.125rem; line-height: 1.3; background: var(--wp--custom--etat--moyen-fond); color: var(--wp--custom--etat--moyen); }
.cq-auj-etat.is-ok { background: var(--wp--custom--etat--ok-fond); color: var(--wp--custom--etat--ok); }
.cq-auj-etat.is-non { background: var(--wp--custom--etat--non-fond); color: var(--wp--custom--etat--non); }
.cq-auj-point { flex: none; width: 14px; height: 14px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 5px rgba(255, 255, 255, .65); }
.cq-auj-heures { font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: clamp(2.2rem, 10vw, 3.4rem); line-height: 1; color: var(--wp--preset--color--foret); margin: 8px 0 4px !important; }
.cq-auj .wp-block-button { margin-top: 10px; }
.cq-auj .wp-element-button { width: 100%; }

/* Entrée du haut de page (accueil, fiche, listes) : en CSS, dès le premier affichage,
   sans attendre le script, pour que le contenu principal compte comme affiché tout de suite. */
@keyframes cq-entree { from { opacity: .35; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.cq-anim :is(.cq-accueil-haut-grille > *, .cq-fiche-photos, .cq-fiche-nom, .cq-fiche-nom + *, .cq-liste-haut > :not(.cq-fil)) { animation: cq-entree .6s cubic-bezier(.25, .46, .45, .94) .05s both; }
.cq-anim .cq-accueil-haut-grille > :nth-child(2), .cq-anim .cq-fiche-nom, .cq-anim .cq-liste-haut > :nth-child(3) { animation-delay: .12s; }
.cq-anim .cq-accueil-haut-grille > :nth-child(3), .cq-anim .cq-fiche-nom + * { animation-delay: .19s; }
.cq-anim .cq-accueil-haut-grille > :nth-child(4) { animation-delay: .26s; }
.cq-anim .cq-accueil-haut-grille > :nth-child(5) { animation-delay: .33s; }
.cq-anim .cq-accueil-haut-grille > :nth-child(n+6) { animation-delay: .4s; }

/* ---------- Mouvement : comme la maquette (assets/js/animations.js) ----------
   La classe cq-anim est posée dans le <head> (sauf si le visiteur demande moins
   d'animations) : les éléments animés restent transparents jusqu'à leur apparition
   (transparents et non masqués : les lecteurs d'écran les lisent toujours).
   Sans script, elle est retirée au bout de 2,5 s et tout s'affiche. */
.cq-anim :is(.cq-tete-centree, .cq-tete, .cq-autres-tete) > *,
.cq-anim :is(.cq-pret-grille, .cq-plan) > .wp-block-column:first-child > *,
.cq-anim .cq-plan > .wp-block-column:last-child,
.cq-anim :is(.cq-auj, .cq-horaires-titre, .cq-fiche-infos .cq-bloc, .cq-fiche-actions, .cq-histoire-carte, .cq-formulaire),
.cq-anim .cq-contact > .wp-block-column > :not(.cq-formulaire),
.cq-anim :is(.cq-besoins, .cq-soutiens, .cq-blog) > *,
.cq-anim :is(.cq-pret-photos .wp-block-post, .cq-horaire, .cq-grille-animaux > .wp-block-post) { opacity: 0; }

/* ---------- Mouvement ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Burger à droite, après « Nous contacter » (tablette et téléphone). */
@media (max-width: 1179px) {
	.cq-entete nav.cq-menu-principal { order: 3; margin-left: 0; flex: none; }
	.cq-entete .cq-entete-actions { order: 2; }
	.cq-menu-principal .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; }
	.cq-menu-principal .wp-block-navigation__responsive-container-open:hover { background: rgba(251, 245, 234, .1); }
}
.cq-menu-principal .wp-block-navigation__submenu-icon svg { stroke-width: 1.6px; }
/* Entrée sans page propre (lien « # », ex. Adoptions) : flèche à 4 px du libellé, comme les boutons de la maquette. */
@media (min-width: 1180px) {
	.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content[href="#"] { padding-right: 4px; }
	.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item.has-child > a[href="#"] + .wp-block-navigation__submenu-icon { margin-left: 0 !important; }
	.cq-menu-principal .wp-block-navigation__container > .wp-block-navigation-item.has-child:has(> a[href="#"]) { padding-right: 12px; }
}

/* Menu ouvert : l'icône du menu laisse la place à la croix. */
.cq-menu-principal:has(.is-menu-open) .wp-block-navigation__responsive-container-open { visibility: hidden; }

/* Sous-menus (ordinateur) : ils se déroulent au survol ou au clavier, sous-groupe empilé. */
@media (min-width: 1180px) {
	.cq-menu-principal .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-container { transform: translateY(-6px); transition: opacity .2s ease, transform .2s ease, visibility .2s; }
	.cq-menu-principal .wp-block-navigation__container > .has-child:hover > .wp-block-navigation__submenu-container,
	.cq-menu-principal .wp-block-navigation__container > .has-child:focus-within > .wp-block-navigation__submenu-container,
	.cq-menu-principal .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-icon[aria-expanded="true"] + .wp-block-navigation__submenu-container { transform: none; }
	.cq-menu-principal .wp-block-navigation__submenu-container .has-child { display: flex !important; flex-direction: column !important; align-items: stretch !important; }
	.cq-menu-principal .wp-block-navigation__submenu-container .has-child > .wp-block-navigation__submenu-container { display: flex !important; flex-direction: column; transform: none; }
	.cq-menu-principal .wp-block-navigation__submenu-container .wp-block-navigation-item { width: 100%; }
}
/* Panneau mobile : le sous-menu se déroule en douceur. */
.cq-menu-principal .is-menu-open .cq-deplie > .wp-block-navigation__submenu-container { animation: cq-deroule .22s ease; }
@keyframes cq-deroule { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* Réseaux sociaux du pied : pictogrammes au trait de la maquette à la place des logos pleins. */
.cq-pied-reseaux .wp-social-link svg { display: none; }
.cq-pied-reseaux .wp-social-link :is(a, button) { padding: 0; border: 0; background: none; color: inherit; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.cq-pied-reseaux .wp-social-link :is(a, button)::before { content: ""; width: 20px; height: 20px; background: var(--wp--preset--color--creme); -webkit-mask: var(--cq-ico) center / contain no-repeat; mask: var(--cq-ico) center / contain no-repeat; }
.cq-pied-reseaux .wp-social-link-facebook { --cq-ico: url("../images/icone-facebook.svg"); }
.cq-pied-reseaux .wp-social-link-instagram { --cq-ico: url("../images/icone-instagram.svg"); }

/* Grilles de deux cartes (besoins, soutenir, blog) : une colonne sur téléphone, deux ensuite. */
.cq-besoins, .cq-soutiens, .cq-blog { grid-template-columns: minmax(0, 1fr) !important; }
@media (min-width: 760px) { .cq-besoins, .cq-soutiens, .cq-blog { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
/* Encart rendez-vous : texte et bouton côte à côte sur ordinateur. */
@media (min-width: 900px) { .cq-accueil-rdv { flex-wrap: nowrap !important; } .cq-accueil-rdv > p { flex: 1 1 auto; min-width: 0; } }

/* ---------- Listes d'animaux (Adoptions, En famille) ---------- */
.cq-liste-haut { padding-top: var(--wp--preset--spacing--l); padding-bottom: 8px; }
.cq-liste-intro { display: grid; gap: 14px 56px; align-items: end; }
.cq-liste-intro > * { margin: 0 !important; }
.cq-liste-intro h1 { font-size: clamp(2.6rem, 9vw, 5rem) !important; }
.cq-liste-intro h2 { font-size: clamp(1.5rem, 4vw, 2rem) !important; grid-column: 1 / -1; }
.cq-liste-intro p { font-size: var(--wp--preset--font-size--grand); color: var(--wp--preset--color--texte-doux); max-width: 46ch; }
@media (min-width: 900px) { .cq-liste-intro { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
.cq-onglets { margin-top: var(--wp--preset--spacing--l) !important; gap: 6px !important; padding: 6px; background: var(--wp--preset--color--sable); border-radius: 999px; width: max-content; max-width: 100%; }
.cq-onglet .wp-element-button { min-height: 44px; padding: 8px 18px; font-size: 1rem; background: transparent; border-color: transparent; color: var(--wp--preset--color--foret); gap: 8px; }
.cq-onglet .wp-element-button:hover { background: var(--wp--preset--color--papier); transform: none; }
.cq-onglet.is-actif .wp-element-button { background: var(--wp--preset--color--foret-moyen); border-color: var(--wp--preset--color--foret-moyen); color: #fff; }
.cq-ico-chien { --cq-ico: url("../images/icone-chien.svg"); }
.cq-ico-chat { --cq-ico: url("../images/icone-chat.svg"); }
.cq-liste { padding-top: var(--wp--preset--spacing--l); padding-bottom: var(--wp--preset--spacing--section); }
.cq-pagination { margin-top: var(--wp--preset--spacing--l) !important; gap: 8px !important; font-weight: 800; }
.cq-pagination a, .cq-pagination .current { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 999px; text-decoration: none; }
.cq-pagination a { background: var(--wp--preset--color--papier); color: var(--wp--preset--color--foret); box-shadow: var(--wp--preset--shadow--carte); }
.cq-pagination .current { background: var(--wp--preset--color--foret-moyen); color: #fff; }
.cq-aucun { font-size: var(--wp--preset--font-size--grand); color: var(--wp--preset--color--texte-doux); }

/* ---------- Pages de contenu (reprises du site actuel) ---------- */
.cq-page { padding-top: var(--wp--preset--spacing--l); padding-bottom: var(--wp--preset--spacing--section); }
.cq-page-titre, .cq-page-contenu h1 { font-size: clamp(2.4rem, 8vw, 4.2rem) !important; margin-bottom: var(--wp--preset--spacing--l) !important; }
.cq-page-contenu > * + * { margin-top: 1.1rem; }
.cq-page-contenu h2 { font-size: clamp(1.7rem, 5vw, 2.4rem) !important; margin-top: 2.6rem !important; }
.cq-page-contenu h3 { font-size: clamp(1.3rem, 4vw, 1.6rem) !important; margin-top: 2rem !important; color: var(--wp--preset--color--terracotta); }
.cq-page-contenu p, .cq-page-contenu li { font-size: var(--wp--preset--font-size--normal); }
.cq-page-contenu .wp-block-list { padding-left: 1.3em; }
.cq-page-contenu .wp-block-list li::marker { color: var(--wp--preset--color--terracotta); }
.cq-page-contenu .wp-block-list li + li { margin-top: .4rem; }
.cq-page-contenu .wp-block-image img { border-radius: var(--wp--preset--border-radius--carte); box-shadow: var(--wp--preset--shadow--carte); }
.cq-page-contenu .wp-block-buttons { margin-top: 1.4rem; }
.cq-page-contenu .cq-formulaire { padding: 24px 22px; margin-top: 2rem; }
@media (min-width: 640px) { .cq-page-contenu .cq-formulaire { padding: 32px; } }
.cq-tableau { overflow-x: auto; }
.cq-tableau table { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--wp--preset--color--papier); border-radius: var(--wp--preset--border-radius--moyen); overflow: hidden; box-shadow: var(--wp--preset--shadow--carte); }
.cq-tableau th, .cq-tableau td { padding: 14px 16px; text-align: center; border: 0 !important; border-bottom: 1px solid var(--wp--custom--ligne) !important; }
.cq-tableau th { background: var(--wp--preset--color--foret-moyen); color: #fff; font-weight: 800; }
.cq-tableau td { font-family: var(--wp--preset--font-family--titres); font-weight: 600; font-size: 1.3rem; color: var(--wp--preset--color--foret); }
.cq-page-contenu .wp-block-image { text-align: center; }
.cq-page-contenu .wp-block-image img { max-height: 520px; width: auto; max-width: 100%; }

/* ---------- Blog ---------- */
.cq-liste-titre { font-size: clamp(2.6rem, 9vw, 5rem) !important; margin-top: 0 !important; }
.cq-grille-articles { gap: 22px !important; }
.cq-carte-article { height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.cq-carte-article > * { margin: 0 !important; }
.cq-carte-article .wp-block-post-featured-image { margin: 0; aspect-ratio: 16 / 10; overflow: hidden; background: var(--wp--preset--color--sable); }
.cq-carte-article .wp-block-post-featured-image img, .cq-pret-photos .wp-block-post-featured-image img { width: 100%; height: 100% !important; object-fit: cover; }
.cq-carte-article-corps { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 24px; }
.cq-carte-article-corps > * { margin: 0 !important; }
.cq-carte-article-cat { font-size: .875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.cq-carte-article-cat a { color: var(--wp--preset--color--terracotta); text-decoration: none; }
.cq-carte-article-titre { font-size: 1.5rem !important; }
.cq-carte-article-titre a { color: inherit; text-decoration: none; }
.cq-carte-article .wp-block-buttons { margin-top: auto !important; }
.cq-article .cq-carte-article-cat { max-width: 760px; margin: 0 auto 10px !important; }
.cq-article-image { max-width: 760px; margin: 0 auto 2rem !important; border-radius: var(--wp--preset--border-radius--carte); overflow: hidden; }
.cq-article .cq-page-titre { max-width: 760px; margin-left: auto !important; margin-right: auto !important; }

/* Styles de boutons (choisis dans l'éditeur : Terracotta, Vert forêt, Contour, Clair). */
.wp-block-button.is-style-bouton-terracotta .wp-element-button { background-color: var(--wp--preset--color--terracotta); border-color: var(--wp--preset--color--terracotta); color: #fff; }
.wp-block-button.is-style-bouton-terracotta .wp-element-button:hover { background-color: var(--wp--custom--terracotta-fonce); border-color: var(--wp--custom--terracotta-fonce); }
.wp-block-button.is-style-bouton-foret .wp-element-button { background-color: var(--wp--preset--color--foret-moyen); border-color: var(--wp--preset--color--foret-moyen); color: #fff; }
.wp-block-button.is-style-bouton-foret .wp-element-button:hover { background-color: var(--wp--preset--color--foret); border-color: var(--wp--preset--color--foret); }
.wp-block-button.is-style-bouton-contour .wp-element-button { background-color: transparent; border-color: var(--wp--preset--color--foret-moyen); color: var(--wp--preset--color--foret); }
.wp-block-button.is-style-bouton-contour .wp-element-button:hover { background-color: var(--wp--preset--color--sauge); }
.is-style-section-foret .wp-block-button.is-style-bouton-contour .wp-element-button { border-color: rgba(251, 245, 234, .7); color: var(--wp--preset--color--creme); }
.is-style-section-foret .wp-block-button.is-style-bouton-contour .wp-element-button:hover { background-color: rgba(251, 245, 234, .12); }
.wp-block-button.is-style-bouton-clair .wp-element-button { background-color: var(--wp--preset--color--papier); border-color: var(--wp--preset--color--papier); color: var(--wp--preset--color--foret); }
.wp-block-button.is-style-bouton-clair .wp-element-button:hover { background-color: var(--wp--preset--color--sable); border-color: var(--wp--preset--color--sable); }
.cq-accueil-agglo img { max-width: 80px; }
/* Dans l'éditeur, comme sur le site : le titre automatique de la page est masqué
   quand le contenu a déjà son propre grand titre (pages reprises du site actuel). */
.editor-styles-wrapper .cq-page-titre:has(~ .cq-page-contenu h1) { display: none; }

/* Dans l'éditeur, l'étiquette de statut des cartes reste en haut de la photo, comme sur le site
   (sinon elle glisse sous la photo et recouvre le nom de l'animal). */
.editor-styles-wrapper .cq-carte-animal-photo > .wp-block-refuge-etiquettes { position: absolute !important; left: 12px; top: 12px; z-index: 3; margin: 0 !important; }
.editor-styles-wrapper .cq-carte-animal-photo > .wp-block-refuge-etiquettes .refuge-etiquettes { position: static; }

/* Dans l'éditeur, WordPress met chaque bloc en position relative : le numéro et l'icône
   des valeurs doivent rester calés sur l'étape (le rond), pas sur le titre. */
.editor-styles-wrapper .cq-valeur > h3 { position: static !important; }

/* Dans l'éditeur, aucune animation : le contenu est toujours visible pendant la saisie. */
.editor-styles-wrapper *, .editor-styles-wrapper *::before, .editor-styles-wrapper *::after { animation: none !important; }

/* ---------- Pages : sections reprises du site actuel ---------- */
/* Le contenu prend toute la section : le texte reste à 760 px, les sections larges vont à 1220 px. */
.cq-page > .cq-page-contenu { max-width: none !important; }
/* Une section pleine largeur dans une page (ex. « Comment nous trouver » sur Contact) va d'un bord à l'autre,
   avec de l'espace après le texte ou le formulaire qui la précède, et touche le pied de page si elle termine la page. */
.cq-page .cq-page-contenu > .alignfull { margin-left: calc(var(--wp--style--root--padding-left) * -1) !important; margin-right: calc(var(--wp--style--root--padding-right) * -1) !important; max-width: none !important; }
.cq-page .cq-page-contenu > :not(.alignfull) + .alignfull { margin-top: var(--wp--preset--spacing--section) !important; }
.cq-page:has(> .cq-page-contenu > .alignfull:last-child) { padding-bottom: 0; }
.cq-page-contenu > .cq-carte { max-width: var(--wp--style--global--content-size); margin-left: auto !important; margin-right: auto !important; }
/* Témoignage (Bénévolat) : photo et citation dans une carte. */
.cq-page-contenu .cq-temoignage { display: grid; gap: 0; overflow: hidden; margin-top: var(--wp--preset--spacing--l); }
.cq-temoignage > * { margin: 0 !important; }
@media (min-width: 700px) { .cq-temoignage { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; } }
.cq-page-contenu .cq-temoignage-photo img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; box-shadow: none; }
@media (min-width: 700px) { .cq-page-contenu .cq-temoignage-photo, .cq-page-contenu .cq-temoignage-photo img { height: 100%; aspect-ratio: auto; min-height: 280px; } }
.cq-temoignage-texte { padding: 24px 26px 28px; display: flex; flex-direction: column; gap: 8px; }
.cq-temoignage-texte > * { margin: 0 !important; }
.cq-page-contenu .cq-temoignage-citation { font-family: var(--wp--preset--font-family--titres); font-weight: 500; font-size: var(--wp--preset--font-size--grand); line-height: 1.4; color: var(--wp--preset--color--foret); }
.cq-temoignage-nom { font-weight: 800; color: var(--wp--preset--color--terracotta); }

/* Nous recherchons activement (Bénévolat) : les deux cartes de l'accueil. */
.cq-besoins-page .cq-besoin { grid-template-columns: none; align-content: start; }
.cq-besoins-page .cq-besoin-photo { aspect-ratio: 16 / 10; height: auto; min-height: 0; }
.cq-page-contenu .cq-besoin-photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; box-shadow: none; }
.cq-page-contenu .cq-besoins-page { display: flex; flex-direction: column; align-items: center; gap: 22px; margin-top: var(--wp--preset--spacing--section); margin-bottom: var(--wp--preset--spacing--l); }
.cq-besoins-page > * { margin: 0 !important; }
.cq-besoins-page .cq-besoins { display: grid; width: 100%; }
.cq-besoins-page .cq-besoin-texte { align-items: flex-start; text-align: left; }
.cq-page-contenu .cq-besoin-texte h3 { margin: 0 !important; color: var(--wp--preset--color--foret); font-size: clamp(1.6rem, 5vw, 2rem) !important; }
.cq-besoins-page .cq-besoin-texte .wp-block-buttons { margin-top: 10px !important; }

/* Ces articles peuvent vous intéresser... : cartes du blog. */
.cq-page-contenu .cq-articles-lies { margin-top: var(--wp--preset--spacing--section); }
.cq-articles-lies > h2 { margin: 0 0 24px !important; }
.cq-page-contenu .cq-articles-lies .cq-carte-article-titre { margin: 0 !important; color: var(--wp--preset--color--foret); font-size: 1.4rem !important; }
.cq-page-contenu .cq-carte-article .wp-block-post-featured-image img { border-radius: 0; box-shadow: none; }

/* Prêt ? : bandeau terracotta en bas de page. */
.cq-page-contenu .cq-pret-bandeau { margin-top: var(--wp--preset--spacing--section); padding: clamp(28px, 5vw, 56px); border-radius: var(--wp--preset--border-radius--carte); }
.cq-pret-bandeau .cq-pret-grille { margin: 0 !important; }
.cq-page-contenu .cq-pret-bandeau h2.cq-pret-titre { margin: 0 !important; }
.cq-page-contenu .cq-pret-bandeau .cq-pret-texte { margin: 10px 0 22px !important; }

/* Les sections pleine largeur se touchent : pas d'espace entre deux blocs de section. */
.wp-block-post-content > .alignfull, main > .alignfull { margin-block-start: 0; margin-block-end: 0; }

/* Titre lu seulement par les lecteurs d'écran (structure des titres des listes). */
.cq-lecteur-seul { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ---------- Bouton « Remonter en haut de la page » ---------- */
.cq-haut { position: fixed; z-index: 90; right: max(16px, calc(env(safe-area-inset-right, 0px) + 16px)); bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 16px)); display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 2px solid rgba(251, 245, 234, .35); border-radius: 50%; background: var(--wp--preset--color--foret); color: var(--wp--preset--color--creme); box-shadow: var(--wp--preset--shadow--flottante); cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .25s ease, transform .25s ease, visibility .25s, background-color .2s ease; }
.cq-haut.is-visible { opacity: 1; visibility: visible; transform: none; }
.cq-haut:hover { background: var(--wp--preset--color--terracotta); }
.cq-haut:focus-visible { outline: 3px solid var(--wp--preset--color--terracotta); outline-offset: 3px; }
body[tabindex="-1"]:focus { outline: none; }
@media (min-width: 1024px) { .cq-haut { right: 28px; bottom: 28px; width: 52px; height: 52px; } }
@media (prefers-reduced-motion: reduce) { .cq-haut { transition: none; } }

/* Pages d'une race, d'une couleur ou d'une localisation (modèle taxonomy.html). */
.cq-liste-titre { font-size: clamp(2.4rem, 8vw, 4.2rem) !important; margin-top: var(--wp--preset--spacing--s) !important; }
