/* Page Nos projets et pages de catégorie : chargé seulement là (voir inc/blocks.php).
   La carte elle-même (.projet-mini) est dans base.css, partagée avec l'accueil. */

.projets-intro { margin-bottom: 36px; }
.projets-intro p { color: var(--wp--preset--color--texte-doux); }

/* Filtres : variante « Filtres de projets » d'un Groupe (lien « Tous » + bloc Catégories) */
.is-style-filtres { align-items: center; gap: 10px !important; margin: 0 0 56px; }
.is-style-filtres > *, .is-style-filtres ul { margin: 0; }
.is-style-filtres ul { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; }
.is-style-filtres :is(p, li) {
	display: flex; align-items: center; gap: 6px; padding: 7px 16px;
	border: 2px solid var(--wp--preset--color--encre); border-radius: 99px;
	background: var(--wp--preset--color--blanc);
	font-size: 15px; font-weight: 500; color: var(--wp--preset--color--texte-doux);
	transition: background .2s, color .2s, transform .3s cubic-bezier(.3, 1.4, .5, 1);
}
.is-style-filtres a { color: var(--wp--preset--color--encre); font-weight: 700; text-decoration: none; }
.is-style-filtres a::after { content: ""; position: absolute; inset: 0; } /* toute la pastille est cliquable */
.is-style-filtres :is(p, li) { position: relative; }
.is-style-filtres :is(p, li):hover { transform: rotate(-2deg); }
/* est-actif : filtre choisi (projets.js) ; current-cat : page de la catégorie (WordPress) */
.is-style-filtres :is(.est-actif, .current-cat) { background: var(--wp--preset--color--encre); color: var(--wp--preset--color--menthe); }
.is-style-filtres :is(.est-actif, .current-cat) a { color: var(--wp--preset--color--blanc); }
.is-style-filtres a:focus-visible { outline: none; }
.is-style-filtres :is(p, li):has(a:focus-visible) { outline: 3px solid var(--wp--preset--color--vert); outline-offset: 3px; }

/* Grille de tous les projets : le sticker du logo déborde davantage sous la carte, pour ne pas
   masquer l'accroche que beaucoup de sites placent en bas à gauche de leur page d'accueil. */
.projets-grille .projet-mini { margin-bottom: 64px; }
/* Sticker plus grand et droit au repos : une image tournée est rééchantillonnée par le
   navigateur et perd sa netteté ; l'inclinaison ne vient qu'au survol. */
.projets-grille .projet-mini__logo { bottom: -40px; width: 160px; height: 86px; padding: 10px 14px; transform: none; }
.projets-grille .projet-mini__logo img { max-height: 62px; }
.projets-grille .wp-block-post:hover .projet-mini__logo { transform: rotate(-3deg) translateY(-4px); }
.projets-grille .wp-block-post-title { margin: 0; font-size: 20px; letter-spacing: -.01em; }
.projets-grille .wp-block-post-title a { color: inherit; text-decoration: none; }
.projets-grille .wp-block-post-terms { margin-top: 4px; font-size: 14px; color: var(--wp--preset--color--texte-doux); }
.projets-grille .wp-block-post-terms a { color: inherit; text-decoration: none; }
/* Cibles d'au moins 24 px de haut (WCAG 2.5.8) pour le nom et la catégorie. */
.projets-grille :is(.wp-block-post-title, .wp-block-post-terms) a { display: inline-block; min-height: 24px; line-height: 24px; }
/* Le lien de la capture est rogné par le cadre : le contour de focus se dessine sur le cadre. */
.projets-grille .projet-mini__ecran a:focus-visible { outline: none; }
.projets-grille .projet-mini__ecran:has(a:focus-visible) { outline: 3px solid var(--wp--preset--color--encre); outline-offset: 3px; }
.projets-grille .wp-block-post[hidden] { display: none; }
.projets-grille .wp-block-post.est-revele { animation: projet-revele .45s cubic-bezier(.3, 1.4, .5, 1) both; }
@keyframes projet-revele { from { opacity: 0; transform: translateY(14px) rotate(1deg); } }

.projets-appel { text-align: center; padding-top: clamp(48px, 7vw, 96px); padding-bottom: clamp(64px, 9vw, 120px); }
.projets-appel .wp-block-buttons { justify-content: center; }
