/*
Theme Name: Roosty
Theme URI: https://roosty.fr/
Author: Idéalternative
Author URI: https://idealternative.fr/
Description: Thème enfant 100 % FSE du site Roosty : un journal de classe, des ressources d’apprentissage, des projets et des rituels. Conçu pour l’accessibilité RGAA, la sobriété RGPD et la performance — aucune ressource extérieure, aucun traceur, aucune police distante. Les couleurs suivent le calendrier scolaire sans qu’une seule ligne de contenu soit touchée.
Requires at least: 7.0
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.1.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: roosty
Tags: education, blog, full-site-editing, block-patterns, accessibility-ready, translation-ready
*/

/* ==========================================================================
   1. Polices de secours
   Pendant la fraction de seconde où Life Savers et Lato se chargent, le
   navigateur affiche une police déjà présente sur la machine du visiteur.
   Sans réglage, elle n'a ni la même largeur ni la même hauteur : la page se
   réagence sous les yeux au moment où la vraie police arrive, et le lien
   qu'on visait se dérobe. Les quatre déclarations ci-dessous corrigent la
   police de remplacement pour qu'elle occupe très exactement la même place.
   Le texte ne bouge plus : il change seulement de dessin.

   Les pourcentages sont mesurés sur les fichiers livrés dans assets/fonts/,
   caractère par caractère, pondérés par leur fréquence en français. Ils sont
   propres à ces polices-là : changer de police oblige à les refaire.

   Sur une machine sans Georgia ni Arial — Linux, Android —, la déclaration
   ne trouve rien et le navigateur passe simplement à la famille suivante de
   la liste. Rien ne casse ; l'ajustement, lui, ne s'applique pas.
   ========================================================================== */

@font-face {
	font-family: "Titres secours";
	src: local("Georgia");
	font-weight: 400;
	font-style: normal;
	size-adjust: 94.9%;
	ascent-override: 102.4%;
	descent-override: 26.3%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Titres secours";
	src: local("Georgia Bold"), local("Georgia");
	font-weight: 700;
	font-style: normal;
	size-adjust: 84.5%;
	ascent-override: 115%;
	descent-override: 29.6%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Texte secours";
	src: local("Arial");
	font-weight: 400;
	font-style: normal;
	size-adjust: 98.2%;
	ascent-override: 100.5%;
	descent-override: 21.7%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Texte secours";
	src: local("Arial Bold"), local("Arial");
	font-weight: 700;
	font-style: normal;
	size-adjust: 92.5%;
	ascent-override: 106.7%;
	descent-override: 23%;
	line-gap-override: 0%;
}

/* ==========================================================================
   2. Jetons de conception
   Les composants ne connaissent que ces variables ; les variables, elles,
   pointent vers la palette de theme.json. Une variante calendaire change
   la palette, et tout le site suit — sans qu'aucune page soit modifiée.
   ========================================================================== */

:root {
	--roosty-encre: var(--wp--preset--color--encre, #333239);
	--roosty-papier: var(--wp--preset--color--papier, #f9f4ef);
	--roosty-sable: var(--wp--preset--color--sable, #e8d2bc);
	--roosty-cannelle: var(--wp--preset--color--cannelle, #d2691a);
	--roosty-accent: var(--wp--preset--color--cannelle-profonde, #8f4712);
	--roosty-safran: var(--wp--preset--color--safran, #e6a303);
	--roosty-framboise: var(--wp--preset--color--framboise, #b4295e);
	--roosty-brun: var(--wp--preset--color--brun, #532105);
	--roosty-estompe: var(--wp--preset--color--estompe, #5c5a63);
	--roosty-blanc: var(--wp--preset--color--blanc, #fff);

	--roosty-trait: color-mix(in srgb, var(--roosty-sable) 82%, var(--roosty-encre));
	--roosty-trait-discret: color-mix(in srgb, var(--roosty-sable) 55%, transparent);
	--roosty-voile: color-mix(in srgb, var(--roosty-papier) 88%, var(--roosty-sable));
	--roosty-voile-framboise: color-mix(in srgb, var(--roosty-papier) 90%, var(--roosty-framboise));
	--roosty-voile-safran: color-mix(in srgb, var(--roosty-papier) 84%, var(--roosty-safran));

	--roosty-rayon: 0.75rem;
	--roosty-rayon-large: 1.25rem;
	--roosty-rayon-rond: 999px;

	--roosty-ombre: var(--wp--preset--shadow--carte, 0 1px 2px rgba(51, 50, 57, .06), 0 6px 18px rgba(51, 50, 57, .07));
	--roosty-ombre-relief: var(--wp--preset--shadow--relief, 0 2px 4px rgba(51, 50, 57, .08), 0 14px 34px rgba(51, 50, 57, .12));

	--roosty-cible: 2.75rem; /* 44 px : cible tactile minimale du RGAA. */
	--roosty-transition: 160ms ease;

	--roosty-icone-taille: 1.5em;
}

/* ==========================================================================
   3. Réglages de base
   ========================================================================== */

html {
	scroll-behavior: smooth;
}

body {
	-webkit-text-size-adjust: 100%;
	text-wrap: pretty;
}

h1, h2, h3, h4 {
	text-wrap: balance;
}

::selection {
	background-color: var(--roosty-safran);
	color: var(--roosty-brun);
}

/* Deux anneaux complémentaires : l'accent se détache des fonds clairs, le
   papier des fonds sombres. Le focus reste ainsi visible avec toute palette. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--roosty-accent);
	outline-offset: 3px;
	box-shadow: 0 0 0 3px var(--roosty-papier);
	border-radius: 0.2rem;
}

@media (forced-colors: active) {
	:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
		outline-color: Highlight;
		box-shadow: none;
	}
}

/* Les liens du contenu restent soulignés : la couleur seule ne suffit pas. */
.wp-block-post-content a:where(:not(.wp-element-button):not(.wp-block-button__link)),
.roosty-texte a:where(:not(.wp-element-button)) {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 0.08em;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ==========================================================================
   4. Lien d'évitement
   ========================================================================== */

.roosty-evitement {
	position: absolute;
	inset-inline-start: 1rem;
	inset-block-start: -100vh;
	z-index: 999;
	padding: 0.75rem 1.25rem;
	background-color: var(--roosty-accent);
	color: var(--roosty-blanc);
	border-radius: 0 0 var(--roosty-rayon) var(--roosty-rayon);
	text-decoration: none;
	font-weight: 700;
}

.roosty-evitement:focus {
	inset-block-start: 0;
}

/* ==========================================================================
   5. Icônes
   Le fichier SVG sert de pochoir : c'est la couleur du texte qui le
   colorie. Une icône suit donc la palette, y compris en variante
   calendaire, et reste lisible en mode contraste élevé.
   ========================================================================== */

.roosty-icone,
.wp-block-group.roosty-icone {
	display: inline-block;
	inline-size: var(--roosty-icone-taille);
	aspect-ratio: 1;
	flex: none;
	vertical-align: -0.2em;
	background-color: currentColor;
	-webkit-mask-image: var(--roosty-icone);
	mask-image: var(--roosty-icone);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.roosty-icone--petite { --roosty-icone-taille: 1em; }
.roosty-icone--grande { --roosty-icone-taille: 2.25rem; }
.roosty-icone--geante { --roosty-icone-taille: 3.5rem; }

/* Une icône posée dans un médaillon : cercle de couleur, icône en creux. */
.roosty-medaillon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 3.5rem;
	aspect-ratio: 1;
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
}

/* Repli : si le navigateur ignore les masques, l'icône disparaît sans
   laisser de carré plein disgracieux. */
@supports not ((-webkit-mask-image: none) or (mask-image: none)) {
	.roosty-icone,
	.wp-block-group.roosty-icone {
		background-color: transparent;
	}
}

/* ==========================================================================
   6. Sections et rythme vertical
   ========================================================================== */

.roosty-section {
	position: relative;
}

.roosty-section--liseree {
	border-block-start: 3px solid var(--roosty-cannelle);
}

.roosty-section--voile {
	background-color: var(--roosty-voile);
}

/* Une section pleine largeur pose un bandeau de couleur d'un bord à l'autre,
   mais son contenu doit rester dans la colonne large : sans cela le titre
   paraîtrait rentré vers l'intérieur pendant que les cartes, elles, touchent
   les bords. */
.roosty-section.alignfull > :where(:not(.alignwide):not(.alignfull)) {
	inline-size: 100%;
	max-inline-size: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

/* Un surtitre est une boîte en ligne : sans cette bascule, les marges
   automatiques de la règle précédente ne le recaleraient pas. */
.roosty-section.alignfull > .roosty-surtitre {
	display: flex;
}

/* Ce qui se lit garde une largeur de lecture, calée sur le bord gauche de la
   colonne et non centrée au milieu du bandeau. */
.roosty-section.alignfull > :where(p, .roosty-releve, .roosty-recherche-geante) {
	max-inline-size: 60ch;
	margin-inline-start: 0;
}

.roosty-section.alignfull > .roosty-chapeau {
	max-inline-size: 46ch;
	margin-inline-start: 0;
}

/* L'en-tête d'une section : un intitulé à gauche, un lien de sortie à droite.
   L'écart n'est posé que sur la variante en rangée, pour ne pas écraser le
   blockGap que le cœur applique déjà aux en-têtes empilés. */
.roosty-section__entete.is-layout-flex {
	gap: 0.75rem var(--wp--preset--spacing--40);
}

.roosty-surtitre {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-block-end: 0.5rem;
	color: var(--roosty-estompe);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ==========================================================================
   7. En-tête, pied de page et bandeaux
   Ces blocs vivent dans des parties de modèle, donc remis à neuf à chaque
   mise à jour du thème. Rien d'éditorial ne s'y écrit : la mise en forme
   est ici, les libellés viennent des menus, eux jamais touchés.
   ========================================================================== */

.roosty-entete {
	border-block-end: 1px solid var(--roosty-trait);
}

.roosty-entete__rangee {
	gap: var(--wp--preset--spacing--40);
}

.roosty-entete__marque {
	gap: 0.75rem;
}

.roosty-entete__marque .wp-block-site-title a {
	text-decoration: none;
}

.roosty-entete__marque .wp-block-site-title a:where(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.roosty-entete__outils {
	gap: var(--wp--preset--spacing--30);
}

/* Le menu principal : la page courante se repère sans compter sur la
   seule couleur, comme l'exige le RGAA. */
.roosty-menu .wp-block-navigation-item.current-menu-item > a,
.roosty-menu .wp-block-navigation-item.current-menu-ancestor > a {
	color: var(--roosty-accent);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}

.roosty-recherche .wp-block-search__button {
	border-radius: var(--roosty-rayon-rond);
	min-inline-size: var(--roosty-cible);
	min-block-size: var(--roosty-cible);
}

.roosty-pied {
	border-block-start: 1px solid var(--roosty-trait);
	background-color: var(--roosty-voile);
}

.roosty-pied .wp-block-site-title a {
	text-decoration: none;
}

.roosty-pied__menu .wp-block-navigation-item a {
	text-decoration: none;
}

.roosty-pied__menu .wp-block-navigation-item a:where(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Bandeau d'accès rapide : une barre de raccourcis, pas un menu bis. */
.roosty-acces__rangee {
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}

.roosty-acces__menu .wp-block-navigation-item a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--roosty-cible);
	padding-inline: 0.9rem;
	border: 1px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-papier);
	text-decoration: none;
}

.roosty-acces__menu .wp-block-navigation-item a:where(:hover, :focus-visible) {
	border-color: var(--roosty-accent);
	color: var(--roosty-accent);
}

/* Bandeau du rituel du jour : fond sombre, donc texte clair imposé aux
   blocs qui n'auraient pas reçu de couleur explicite. */
.roosty-bandeau__entete {
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	margin-block-end: var(--wp--preset--spacing--40);
}

.roosty-bandeau__contenu .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}

.roosty-bandeau__contenu .wp-block-post-title a:where(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* ==========================================================================
   8. Gabarits : chapeau, méta, listes d'articles et pagination
   Ces classes sont posées par les modèles du thème. Elles décrivent des
   emplacements, jamais du contenu : une mise à jour les repeint sans
   toucher au moindre texte saisi.
   ========================================================================== */

.roosty-principal {
	min-block-size: 40vh;
}

/* Page pleine largeur : le contenu gère lui-même ses marges. */
.roosty-principal--large {
	margin-block-start: 0;
}

/* Page légale : lecture longue, colonne étroite, décor minimal. */
.roosty-principal--sobre {
	--wp--style--global--content-size: 38rem;
}

/* Le titre d'un article. La taille se règle ici, et non par une classe de
   taille posée dans le modèle : la page d'un rituel a besoin de la revoir, et
   les classes de taille du cœur sont écrites en !important — on ne les
   discute pas, on ne les emploie pas. */
.roosty-principal .roosty-titre-article {
	font-size: var(--wp--preset--font-size--xx-large);
}

/* Un rituel porte pour titre sa référence — « Le compte est bon 001 » —, pas
   sa question. Une référence se lit, se note, se retrouve : elle n'a rien à
   faire en tête d'affiche. La question est dans l'énoncé, juste dessous, et
   c'est elle qui doit prendre la place. */
.roosty-page-rituel .roosty-principal .roosty-titre-article {
	font-size: var(--wp--preset--font-size--x-large);
}

.roosty-chapeau {
	max-inline-size: 46ch;
	color: var(--roosty-estompe);
	line-height: 1.55;
}

.roosty-meta {
	gap: 0.5rem 1rem;
	color: var(--roosty-estompe);
}

.roosty-meta .wp-block-post-terms a,
.roosty-carte-article .wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}

.roosty-meta .wp-block-post-terms a:where(:hover, :focus-visible),
.roosty-carte-article .wp-block-post-terms a:where(:hover, :focus-visible) {
	color: var(--roosty-accent);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Liste d'articles : la grille se replie d'elle-même, sans point de
   rupture à maintenir. */
.roosty-liste-articles {
	padding: 0;
	list-style: none;
}

.roosty-carte-article {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
	block-size: 100%;
}

.roosty-carte-article .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}

.roosty-carte-article .wp-block-post-title a:where(:hover, :focus-visible) {
	color: var(--roosty-accent);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.roosty-carte-article .wp-block-post-featured-image img {
	inline-size: 100%;
	block-size: auto;
}

/* Les métadonnées se collent au bas de la carte : les titres restent
   alignés d'une carte à l'autre. */
.roosty-carte-article > .wp-block-post-date {
	margin-block-start: auto;
}

.roosty-pagination {
	gap: var(--wp--preset--spacing--30);
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: 1px solid var(--roosty-trait);
}

.roosty-pagination .wp-block-query-pagination-numbers a,
.roosty-pagination .wp-block-query-pagination-numbers .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: var(--roosty-cible);
	min-block-size: var(--roosty-cible);
	border-radius: var(--roosty-rayon-rond);
}

.roosty-pagination .wp-block-query-pagination-numbers .current {
	background-color: var(--roosty-sable);
	font-weight: 700;
}

.roosty-navigation-article {
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}

.roosty-navigation-article .wp-block-post-navigation-link {
	max-inline-size: 22rem;
}

/* ==========================================================================
   9. Cartes et encadrés
   ========================================================================== */

.roosty-carte,
.is-style-roosty-carte {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px solid var(--roosty-trait-discret);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
}

.is-style-roosty-carte-sable {
	padding: clamp(1.25rem, 3vw, 2rem);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-sable);
}

.is-style-roosty-carte-accent {
	padding: clamp(1.25rem, 3vw, 2rem);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-brun);
	color: var(--roosty-papier);
}

.is-style-roosty-carte-accent :where(h1, h2, h3, h4, h5, h6) {
	color: var(--roosty-papier);
}

.is-style-roosty-carte-accent a:where(:not(.wp-element-button)) {
	color: var(--roosty-safran);
}

.is-style-roosty-encadre {
	padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 1.75rem);
	border-inline-start: 5px solid var(--roosty-cannelle);
	border-radius: 0 var(--roosty-rayon) var(--roosty-rayon) 0;
	background-color: var(--roosty-voile);
}

.is-style-roosty-rangee-icone {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}

.is-style-roosty-rangee-icone > .roosty-icone {
	--roosty-icone-taille: 1.75rem;
	color: var(--roosty-accent);
	margin-block-start: 0.15em;
}

.is-style-roosty-colonnes-cartes > .wp-block-column {
	padding: clamp(1.25rem, 3vw, 1.75rem);
	border: 1px solid var(--roosty-trait-discret);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-blanc);
}

.is-style-roosty-pointille {
	border: 0;
	border-block-start: 3px dotted var(--roosty-sable);
	background: none;
	max-inline-size: 6rem;
}

.is-style-roosty-parole {
	border: 0;
	padding: clamp(1.25rem, 3vw, 1.75rem);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-sable);
	font-style: normal;
}

.is-style-roosty-parole cite {
	display: block;
	margin-block-start: 0.75rem;
	color: var(--roosty-brun);
	font-style: normal;
	font-weight: 700;
}

.is-style-roosty-medaillon img {
	border-radius: var(--roosty-rayon-rond);
	aspect-ratio: 1;
	object-fit: cover;
}

.is-style-roosty-polaroid img {
	padding: 0.75rem 0.75rem 2.5rem;
	border-radius: 0.25rem;
	background-color: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre-relief);
}

.is-style-roosty-liste-nue {
	list-style: none;
	padding-inline-start: 0;
}

.is-style-roosty-liste-coches {
	list-style: none;
	padding-inline-start: 0;
}

.is-style-roosty-liste-coches li {
	position: relative;
	padding-inline-start: 1.75rem;
	margin-block-end: 0.5rem;
}

.is-style-roosty-liste-coches li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 0.25em;
	inline-size: 1.1em;
	aspect-ratio: 1;
	background-color: var(--roosty-accent);
	-webkit-mask-image: url("assets/icons/etoile.svg");
	mask-image: url("assets/icons/etoile.svg");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

/* ==========================================================================
   10. Motifs composés
   Les classes ci-dessous sont posées par les compositions du thème. Elles
   n'habillent que des emplacements : c'est ce qui permet à une mise à jour
   de reprendre la main sur la mise en page d'une section déjà insérée sans
   toucher au texte, aux images ni aux fichiers qu'elle contient.
   ========================================================================== */

/* Les rangées à deux volets se partagent la largeur et se replient seules :
   pas de point de rupture à maintenir. */
.roosty-hero > *,
.roosty-mise-en-avant > *,
.roosty-qr > * {
	flex: 1 1 20rem;
	min-inline-size: 0;
}

.roosty-hero__texte {
	flex-grow: 1.2;
}

.roosty-qr__image {
	flex: 0 1 14rem;
}

.roosty-hero__image img,
.roosty-mise-en-avant__image img,
.roosty-qr__image img {
	inline-size: 100%;
	block-size: auto;
}

/* Un aplat décalé derrière l'image d'ouverture : de la profondeur sans une
   seule image de plus à charger. */
.roosty-hero__image {
	position: relative;
}

.roosty-hero__image::before {
	content: "";
	position: absolute;
	inset: 1.5rem -1.5rem -1.5rem 1.5rem;
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-safran);
	opacity: 0.3;
}

.roosty-hero__image img {
	position: relative;
}

/* Ligne de réassurance sous les boutons d'ouverture. */
.roosty-reassurance {
	gap: 0.4rem 1.25rem;
	color: var(--roosty-estompe);
	font-size: var(--wp--preset--font-size--x-small);
}

.roosty-reassurance p {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.roosty-reassurance .roosty-icone {
	--roosty-icone-taille: 1rem;
	color: var(--roosty-accent);
}

/* Carte de motif : même gabarit que la carte d'article, contenu libre. */
.roosty-carte {
	display: flex;
	flex-direction: column;
	block-size: 100%;
}

.roosty-carte > .roosty-icone {
	color: var(--roosty-accent);
}

.roosty-carte :where(h2, h3, h4) a {
	color: inherit;
	text-decoration: none;
}

.roosty-carte :where(h2, h3, h4) a:where(:hover, :focus-visible) {
	color: var(--roosty-accent);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.roosty-carte--porte {
	text-align: start;
}

.roosty-lien-carte {
	margin-block-start: auto;
	font-weight: 700;
}

.roosty-actions {
	margin-block-start: auto;
}

/* Rangée de compteurs : chaque nombre prend sa part, et passe à la ligne
   plutôt que de se serrer. */
.roosty-rangee--compteurs > * {
	flex: 1 1 8rem;
}

/* Les deux volets d'un exemple de rituel gardent la même hauteur, sinon la
   question et la réponse ne se lisent plus comme une paire. */
.roosty-exemple-rituel {
	block-size: 100%;
}

/* Relevé « Cette semaine » : une icône, une phrase, rien de plus. */
.roosty-releve__ligne > .roosty-icone {
	color: var(--roosty-accent);
}

.roosty-releve__ligne p {
	margin: 0;
	flex: 1 1 16rem;
}

/* Pastilles de raccourci : cibles tactiles pleines, pas de simple lien. */
.roosty-pastille {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	min-inline-size: 7.5rem;
	padding: 1rem 0.75rem;
	border: 1px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-papier);
	text-align: center;
}

.roosty-pastille:where(:hover, :focus-within) {
	border-color: var(--roosty-accent);
}

.roosty-pastille .roosty-icone {
	color: var(--roosty-accent);
}

.roosty-pastille p {
	margin: 0;
}

.roosty-pastille a {
	color: inherit;
	text-decoration: none;
}

.roosty-pastille a:where(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Frise : un filet vertical relie les étapes, dessiné en CSS seul. */
.roosty-frise {
	position: relative;
	padding-inline-start: 0.5rem;
}

.roosty-frise__etape {
	position: relative;
	padding-inline-start: 1.5rem;
	padding-block-end: 1.25rem;
}

.roosty-frise__etape::before {
	content: "";
	position: absolute;
	inset-block: 0.4rem 0;
	inset-inline-start: 0;
	inline-size: 2px;
	background-color: var(--roosty-trait);
}

.roosty-frise__etape:last-child::before {
	inset-block-end: auto;
	block-size: 0;
}

.roosty-frise__etape > .roosty-icone {
	color: var(--roosty-accent);
}

.roosty-frise__etape p {
	margin: 0;
}

/* Encadré d'alerte : le liseré change, la couleur seule ne porte jamais
   l'information — l'icône et le titre la disent aussi. */
.roosty-encadre--alerte {
	border-inline-start-color: var(--roosty-safran);
}

.roosty-encadre--alerte > .roosty-rangee > .roosty-icone {
	color: var(--roosty-brun);
}

/* Étapes numérotées : le numéro devient une pastille lisible. */
.roosty-etapes {
	counter-reset: roosty-etape;
	padding-inline-start: 0;
	list-style: none;
}

.roosty-etapes > li {
	counter-increment: roosty-etape;
	position: relative;
	padding-inline-start: 3rem;
	margin-block-end: 1rem;
}

.roosty-etapes > li::before {
	content: counter(roosty-etape);
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: -0.1em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 2.1rem;
	aspect-ratio: 1;
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
	font-family: var(--wp--preset--font-family--titres);
	font-weight: 700;
}

.roosty-galerie img {
	border-radius: var(--roosty-rayon);
}

/* Sur fond sombre, les cartes et les filets se recalent d'eux-mêmes. */
.roosty-section.has-brun-background-color .roosty-icone {
	color: var(--roosty-safran);
}

/* --------------------------------------------------------------------------
   9 bis. Motifs illustrés
   Les pages d'accueil, de rubrique et de projet vivent d'images, d'étiquettes
   et de dates. Ces classes leur donnent un cadre commun : une composition qui
   les porte reste juste, et une mise à jour du thème les repeint toutes.
   -------------------------------------------------------------------------- */

/* Carte illustrée : l'image touche les bords, le texte respire dessous. */
.roosty-carte--illustree,
.is-style-roosty-carte-illustree {
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--roosty-trait-discret);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
}

.roosty-carte__visuel {
	position: relative;
	margin: 0;
	background-color: var(--roosty-voile);
}

.roosty-carte__visuel img {
	display: block;
	inline-size: 100%;
	block-size: auto;
	border-radius: 0;
}

/* L'étiquette de rubrique se pose sur l'image, jamais sur le texte. */
.roosty-carte__visuel .roosty-etiquette {
	position: absolute;
	inset-block-end: 0.6rem;
	inset-inline-start: 0.6rem;
	box-shadow: var(--roosty-ombre);
}

.roosty-carte__corps {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 0.5rem;
	padding: clamp(1rem, 2.5vw, 1.4rem);
}

.roosty-carte__corps > * {
	margin: 0;
}

.roosty-carte__date {
	margin-block-start: auto;
	color: var(--roosty-estompe);
	font-size: var(--wp--preset--font-size--x-small);
}

/* Bandeau immersif : une image plein cadre, un titre par-dessus. */
.roosty-bandeau-immersif {
	border-radius: var(--roosty-rayon-large);
	overflow: hidden;
}

.roosty-bandeau-immersif :where(h1, h2, h3, p) {
	text-shadow: 0 1px 12px rgba(0, 0, 0, .45);
}

/* Frise horizontale : les étapes d'un projet, de gauche à droite. */
.roosty-frise-horizontale {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--50);
}

.roosty-frise-horizontale > * {
	position: relative;
	flex: 1 1 10rem;
	padding-block-start: 1.5rem;
	border-block-start: 2px solid var(--roosty-trait);
}

.roosty-frise-horizontale > *::before {
	content: "";
	position: absolute;
	inset-block-start: -0.5rem;
	inset-inline-start: 0;
	inline-size: 0.85rem;
	aspect-ratio: 1;
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-cannelle);
}

.roosty-frise-horizontale > *:first-child::before {
	background-color: var(--roosty-framboise);
}

.roosty-frise-horizontale p {
	margin: 0;
}

.roosty-date-courte {
	color: var(--roosty-accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Pastilles de filtre : des liens qui se cliquent comme des boutons. */
.roosty-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.roosty-chip .wp-block-button__link,
.is-style-roosty-chip .wp-block-button__link {
	min-block-size: 2.25rem;
	padding: 0.35em 1em;
	border: 1px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-blanc);
	color: var(--roosty-encre);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
}

.roosty-chip .wp-block-button__link:where(:hover, :focus-visible),
.is-style-roosty-chip .wp-block-button__link:where(:hover, :focus-visible) {
	border-color: var(--roosty-framboise);
	background-color: var(--roosty-voile-framboise);
	color: var(--roosty-framboise);
}

/* Grande zone de recherche : la barre est le sujet de la page. */
.roosty-recherche-geante .wp-block-search__input {
	min-block-size: 3.5rem;
	padding-inline: 1.25rem;
	border: 2px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-blanc);
	font-size: var(--wp--preset--font-size--large);
}

.roosty-recherche-geante .wp-block-search__button {
	min-block-size: 3.5rem;
	padding-inline: 1.5rem;
	border-radius: var(--roosty-rayon-rond);
}

/* Compteur : un grand nombre, une légende dessous. */
.roosty-compteur__nombre {
	display: block;
	margin: 0;
	color: var(--roosty-framboise);
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	line-height: 1;
}

.roosty-compteur__legende {
	margin: 0.25rem 0 0;
	color: var(--roosty-estompe);
	font-size: var(--wp--preset--font-size--small);
}

/* Mosaïque de productions : des vignettes carrées, sans légende. */
.roosty-mosaique img {
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: var(--roosty-rayon);
}

/* Décor de confettis : trois pastilles peintes en CSS, sans image ni script.
   Purement ornemental — la section reste entière si le navigateur l'ignore. */
.roosty-decor {
	position: relative;
	isolation: isolate;
}

.roosty-decor::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	background-image:
		radial-gradient(circle at 12% 18%, var(--roosty-safran) 0 0.35rem, transparent 0.36rem),
		radial-gradient(circle at 88% 26%, var(--roosty-framboise) 0 0.28rem, transparent 0.29rem),
		radial-gradient(circle at 78% 84%, var(--roosty-cannelle) 0 0.4rem, transparent 0.41rem);
	opacity: 0.5;
	pointer-events: none;
}

/* Sur un aplat sombre, les confettis se dessinent en clair pour rester
   visibles sans jamais concurrencer le texte. */
.roosty-decor--clair::before {
	background-image:
		radial-gradient(circle at 12% 18%, var(--roosty-papier) 0 0.35rem, transparent 0.36rem),
		radial-gradient(circle at 88% 26%, var(--roosty-papier) 0 0.28rem, transparent 0.29rem),
		radial-gradient(circle at 78% 84%, var(--roosty-papier) 0 0.4rem, transparent 0.41rem);
	opacity: 0.22;
}

@media (prefers-reduced-motion: no-preference) {
	.roosty-carte-lien:hover .roosty-carte__visuel img {
		transform: scale(1.03);
	}

	.roosty-carte__visuel img {
		transition: transform var(--roosty-transition);
	}
}

/* ==========================================================================
   11. Étiquettes
   ========================================================================== */

.roosty-etiquette {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.2em 0.7em;
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.4;
}

.roosty-etiquette--protege {
	background-color: var(--roosty-brun);
	color: var(--roosty-papier);
}

.roosty-etiquette--nouveau {
	background-color: var(--roosty-framboise);
	color: var(--roosty-blanc);
}

/* Étiquettes de rubrique. La couleur ne porte jamais seule l'information :
   le mot est écrit en toutes lettres dans l'étiquette. */
.roosty-etiquette--journal {
	background-color: var(--roosty-accent);
	color: var(--roosty-blanc);
}

.roosty-etiquette--projet {
	background-color: var(--roosty-brun);
	color: var(--roosty-papier);
}

.roosty-etiquette--evenement {
	background-color: var(--roosty-framboise);
	color: var(--roosty-blanc);
}

.roosty-etiquette--ressource {
	background-color: var(--roosty-safran);
	color: var(--roosty-brun);
}

.roosty-etiquette--rituel {
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
}

/* Étiquette posée par le modèle d'article. Elle affiche la catégorie de
   l'article, quelle qu'elle soit : sa couleur doit donc suivre la page, et
   non un mot choisi d'avance dans le modèle. Le journal par défaut, les
   rituels sur leur page. */
.roosty-etiquette--rubrique {
	background-color: var(--roosty-accent);
	color: var(--roosty-blanc);
}

.roosty-page-rituel .roosty-etiquette--rubrique {
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
}

.roosty-etiquette--grande {
	padding: 0.35em 1em;
	font-size: var(--wp--preset--font-size--small);
}

/* ==========================================================================
   13. Page protégée par mot de passe
   ========================================================================== */

.roosty-verrou {
	max-inline-size: 34rem;
	margin-inline: auto;
	padding: clamp(1.75rem, 5vw, 3rem);
	border: 1px solid var(--roosty-trait-discret);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
	text-align: center;
}

.roosty-verrou__blason {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 4.5rem;
	aspect-ratio: 1;
	margin-block-end: 1.25rem;
	border-radius: var(--roosty-rayon-rond);
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
}

.roosty-verrou__blason .roosty-icone {
	--roosty-icone-taille: 2rem;
	vertical-align: 0;
}

.roosty-verrou__titre {
	margin: 0 0 0.5rem;
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--large);
	color: var(--roosty-brun);
}

.roosty-verrou__texte {
	margin: 0 auto 1.75rem;
	max-inline-size: 30rem;
	color: var(--roosty-estompe);
}

.roosty-verrou__erreur {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin-block-end: 1.25rem;
	padding: 0.85rem 1rem;
	border-inline-start: 5px solid var(--roosty-brun);
	border-radius: 0 var(--roosty-rayon) var(--roosty-rayon) 0;
	background-color: var(--roosty-sable);
	color: var(--roosty-brun);
	text-align: start;
	font-weight: 700;
}

.roosty-verrou__erreur .roosty-icone {
	--roosty-icone-taille: 1.25rem;
	margin-block-start: 0.1em;
}

.roosty-verrou__champ {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-block-end: 1.25rem;
	text-align: start;
}

.roosty-verrou__champ label {
	font-weight: 700;
}

.roosty-verrou__champ input {
	inline-size: 100%;
	min-block-size: var(--roosty-cible);
	padding: 0.6rem 0.9rem;
	border: 2px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon);
	background-color: var(--roosty-papier);
	color: var(--roosty-encre);
	font-family: inherit;
	font-size: 1rem;
}

.roosty-verrou__champ input[aria-invalid="true"] {
	border-color: var(--roosty-brun);
}

.roosty-verrou__validation {
	margin: 0;
}

.roosty-verrou__bouton {
	min-block-size: var(--roosty-cible);
	min-inline-size: 12rem;
	cursor: pointer;
	border: 0;
}

/* ==========================================================================
   14. Rituels
   ========================================================================== */

.roosty-attente {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 2px dashed var(--roosty-sable);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-voile);
	text-align: center;
}

.roosty-attente__titre {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	margin: 0;
	color: var(--roosty-brun);
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--medium);
}

.roosty-attente__titre .roosty-icone {
	--roosty-icone-taille: 1.6rem;
}

.roosty-attente__texte {
	margin: 0;
	color: var(--roosty-estompe);
}

.roosty-attente__texte time {
	color: var(--roosty-encre);
	font-weight: 700;
}

/* Le réveil du panneau : à l'heure dite, le script retire l'attribut « hidden »
   et pose la classe ci-dessous. La lune cède la place au soleil, le pointillé
   devient un trait plein, et le fond passe au voile safran — les mêmes teintes
   que le reste du site, donc celles de la palette en cours, quelle qu'elle
   soit. */
.roosty-attente--eveillee {
	border-style: solid;
	border-color: var(--roosty-accent);
	background-color: var(--roosty-voile-safran);
}

/* Les deux phrases d'attente donnaient rendez-vous : une fois l'heure passée,
   elles seraient fausses. On les retire plutôt que de les laisser mentir. */
.roosty-attente--eveillee .roosty-attente__titre,
.roosty-attente--eveillee .roosty-attente__texte {
	display: none;
}

.roosty-attente__reveil {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.9rem;
}

.roosty-attente__annonce {
	margin: 0;
	color: var(--roosty-brun);
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--medium);
}

/* Le bouton porte « wp-element-button » : il hérite du bouton du thème, et
   suivra donc toute palette sans qu'une couleur soit écrite ici. */
.roosty-attente__bouton {
	gap: 0.5rem;
	padding: 0.65rem 1.5rem;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
}

.roosty-attente__bouton .roosty-icone {
	--roosty-icone-taille: 1.3em;
}

@media (prefers-reduced-motion: no-preference) {
	.roosty-attente--eveillee {
		animation: roosty-reveil 320ms ease-out both;
	}
}

@keyframes roosty-reveil {
	from {
		opacity: 0.55;
		transform: scale(0.99);
	}
}

/* Contenus distants : la carte qui remplace un lecteur YouTube, Vimeo,
   Spotify… Elle emprunte au panneau d'attente sa forme et ses teintes, pour
   qu'un contenu qu'on n'a pas encore ouvert se reconnaisse du premier coup
   d'œil, ici comme là. */
.roosty-lien-distant {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	margin-inline: 0;
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 2px solid var(--roosty-trait);
	border-radius: var(--roosty-rayon-large);
	background-color: var(--roosty-voile);
	text-align: center;
}

.roosty-lien-distant__hebergeur {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	margin: 0;
	color: var(--roosty-brun);
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--medium);
}

.roosty-lien-distant__hebergeur .roosty-icone {
	--roosty-icone-taille: 1.6rem;
}

/* Le lien porte « wp-element-button » : il hérite du bouton du thème, donc de
   la palette en cours, sans qu'une couleur soit écrite ici. */
.roosty-lien-distant__lien {
	padding: 0.65rem 1.5rem;
	text-decoration: none;
}

.roosty-lien-distant__mention {
	margin: 0;
	max-inline-size: 42ch;
	color: var(--roosty-estompe);
	font-size: var(--wp--preset--font-size--small);
}

.roosty-lien-distant figcaption {
	margin: 0;
}

.roosty-reponse {
	position: relative;
}

.roosty-avis-redaction {
	margin: 0 0 1rem;
	padding: 0.6rem 0.9rem;
	border-radius: var(--roosty-rayon);
	background-color: var(--roosty-safran);
	color: var(--roosty-brun);
	font-size: var(--wp--preset--font-size--small);
}

/* ==========================================================================
   15. Confort de lecture et cibles tactiles
   ========================================================================== */

.wp-block-navigation .wp-block-navigation-item__content,
.wp-block-button__link,
.wp-element-button {
	min-block-size: var(--roosty-cible);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wp-block-navigation .wp-block-navigation-item__content {
	padding-block: 0.5rem;
}

/* Une carte entièrement cliquable reste accessible au clavier : c'est le
   titre qui porte le lien, la carte ne fait que réagir. */
.roosty-carte-lien {
	transition: transform var(--roosty-transition), box-shadow var(--roosty-transition);
}

.roosty-carte-lien:hover,
.roosty-carte-lien:focus-within {
	transform: translateY(-2px);
	box-shadow: var(--roosty-ombre-relief);
}

/* ==========================================================================
   16. Contraste renforcé, à la demande du système
   ========================================================================== */

/* Quand le système annonce « contrastes renforcés » — Réglages d'accessibilité
   de macOS, d'iOS, de Windows ou d'Android — le thème prend de lui-même les
   couleurs de la variante « Contraste renforcé ». Le visiteur n'a rien à
   régler et ne perd pas le site de vue : ce sont les mêmes teintes, poussées.

   Ces valeurs sont exactement celles de styles/contraste-renforce.json, et
   « verifier.sh » refuse la livraison si les deux listes divergent. Pour
   changer une couleur, changez-la dans le fichier de variante : c'est lui qui
   fait foi.

   Redéfinir les jetons de WordPress suffit : tout le thème les traverse, y
   compris les palettes composées sur le site — qui cèdent donc le pas, comme
   il se doit, au réglage d'accessibilité du visiteur. */
@media (prefers-contrast: more) {
	:root {
		--wp--preset--color--encre: #14131a;
		--wp--preset--color--papier: #ffffff;
		--wp--preset--color--sable: #efe7dc;
		--wp--preset--color--cannelle: #8f4712;
		--wp--preset--color--cannelle-profonde: #6b330a;
		--wp--preset--color--safran: #d89a28;
		--wp--preset--color--framboise: #8e1b46;
		--wp--preset--color--brun: #2a1204;
		--wp--preset--color--estompe: #33323a;
		--wp--preset--color--blanc: #ffffff;
	}
}

/* ==========================================================================
   17. Décor des variantes calendaires
   Purement facultatif : une variante reste lisible sans lui.
   ========================================================================== */

.roosty-saison .roosty-section--liseree {
	border-block-start-color: var(--roosty-cannelle);
}

.roosty-saison--noel .roosty-etiquette--nouveau,
.roosty-saison--carnaval .roosty-etiquette--nouveau {
	background-color: var(--roosty-brun);
}

/* ==========================================================================
   18. Impression
   Les fiches et les rituels sont souvent imprimés pour la classe.
   ========================================================================== */

@media print {
	.roosty-evitement,
	.wp-block-navigation,
	.wp-block-search {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
		font-size: 11pt;
	}

	.roosty-carte,
	.is-style-roosty-carte,
	.is-style-roosty-colonnes-cartes > .wp-block-column {
		border: 1px solid #999;
		box-shadow: none;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 9pt;
		word-break: break-all;
	}
}

/* ==========================================================================
   19. Compositions éditoriales annuelles
   Une grammaire commune relie accueil, journal, projets et ressources.
   ========================================================================== */

.roosty-composition,
.roosty-article {
	--roosty-composition-trait: var(--roosty-trait);
}

.roosty-composition__panneau,
.roosty-projets-vide,
.roosty-projet-categorie,
.roosty-article > .wp-block-group,
.roosty-article > .wp-block-media-text {
	border: 1px solid var(--roosty-composition-trait);
	border-radius: var(--roosty-rayon-large);
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
}

.roosty-projets-vide,
.roosty-projet-categorie {
	color: var(--roosty-encre);
}

.roosty-composition__panneau,
.roosty-projets-vide {
	padding: clamp(1.25rem, 3vw, 2.25rem);
}

.roosty-composition__numero,
.roosty-composition__date-courte,
.roosty-projet-categorie__compte {
	display: inline-flex;
	align-items: center;
	min-block-size: 2rem;
	padding-inline: 0.75rem;
	border-radius: var(--roosty-rayon-rond);
	background: var(--roosty-voile-safran);
	color: var(--roosty-brun);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.roosty-projets-liste {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 2.5vw, 2rem);
}

.roosty-projet-categorie {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: clamp(1.25rem, 3vw, 2rem);
	transition: transform var(--roosty-transition), box-shadow var(--roosty-transition), border-color var(--roosty-transition);
}

.roosty-projet-categorie:hover,
.roosty-projet-categorie:focus-within {
	transform: translateY(-3px);
	border-color: var(--roosty-cannelle);
	box-shadow: var(--roosty-ombre-relief);
}

.roosty-projet-categorie h3 {
	margin-block: 1rem 0.5rem;
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.15;
}

.roosty-projet-categorie h3 a {
	color: inherit;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.2em;
}

.roosty-projet-categorie__lien {
	margin-block-start: auto;
	padding-block-start: 1rem;
	font-weight: 700;
}

.roosty-projets-vide {
	max-inline-size: 48rem;
	border-style: dashed;
	background: var(--roosty-voile);
}

.roosty-projets-vide__titre {
	margin-block-start: 0;
	font-family: var(--wp--preset--font-family--titres);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
}

.roosty-composition__frise {
	position: relative;
	padding-inline-start: clamp(1.25rem, 3vw, 2.5rem);
	border-inline-start: 3px solid var(--roosty-cannelle);
}

.roosty-composition__date {
	font-weight: 700;
	color: var(--roosty-accent);
}

.roosty-composition__agenda,
.roosty-composition__domaines,
.roosty-composition__liens {
	gap: clamp(1rem, 2.5vw, 2rem) !important;
}

.roosty-article {
	padding-block: clamp(1rem, 2vw, 2rem);
}

.roosty-article > .wp-block-image img {
	border-radius: var(--roosty-rayon-large);
	box-shadow: var(--roosty-ombre);
}

.roosty-page-projet .wp-block-query-title {
	max-inline-size: 18ch;
}

@media (max-width: 800px) {
	.roosty-projets-liste {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.roosty-projets-liste {
		grid-template-columns: 1fr;
	}

}

@media print {
	.roosty-projet-categorie,
	.roosty-projets-vide,
	.roosty-composition__panneau {
		break-inside: avoid;
		box-shadow: none;
	}
}

/* ==========================================================================
   20. Architecture éditoriale 1.0.0
   Hero Polaroid, états vides et cartes dynamiques de l’accueil.
   ========================================================================== */

.roosty-hero-polaroid {
	overflow: clip;
	background-image:
		radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--roosty-safran) 18%, transparent) 0 7rem, transparent 7.1rem),
		linear-gradient(180deg, var(--roosty-papier), var(--roosty-voile));
}

.roosty-hero-polaroid__maxime {
	max-inline-size: 15ch;
}

.roosty-hero-polaroid__image {
	max-inline-size: 32rem;
	margin-inline: auto;
	transform: rotate(1.5deg);
}

.roosty-hero-polaroid--gauche .roosty-hero-polaroid__image {
	transform: rotate(-1.5deg);
}

.roosty-colonnes-inversees {
	flex-direction: row-reverse;
}

.roosty-carte-rituel {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
	block-size: 100%;
	padding: clamp(1.1rem, 2.5vw, 1.6rem);
	border: 1px solid var(--roosty-trait-discret);
	border-radius: var(--roosty-rayon-large);
	background: var(--roosty-blanc);
	color: var(--roosty-encre);
	box-shadow: var(--roosty-ombre);
}

.roosty-carte-rituel--sombre {
	border-color: color-mix(in srgb, var(--roosty-papier) 28%, transparent);
	background: color-mix(in srgb, var(--roosty-papier) 10%, transparent);
	color: var(--roosty-papier);
}

.roosty-carte-rituel--sombre a {
	color: inherit;
}

.roosty-etat-vide {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 2px dashed var(--roosty-sable);
	border-radius: var(--roosty-rayon-large);
	background: var(--roosty-voile);
}

.roosty-etat-vide--sombre {
	border-color: color-mix(in srgb, var(--roosty-papier) 45%, transparent);
	background: color-mix(in srgb, var(--roosty-papier) 10%, transparent);
}

.roosty-restez-connectes {
	border-block: 1px solid var(--roosty-trait);
}

/* Un bouton de composition sans URL est un repère éditorial, pas encore une
   action. Il reste visible dans l’éditeur (editeur.css) mais ne crée pas de
   faux contrôle au clavier sur le site public. */
.wp-site-blocks .wp-block-button__link:not([href]) {
	display: none;
}

/* Une carte sans image mise en avant conserve un repère visuel discret. */
.roosty-carte-article:not(:has(.wp-block-post-featured-image))::before {
	content: "";
	display: block;
	inline-size: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--roosty-rayon);
	background:
		var(--roosty-voile)
		url("assets/icons/image.svg") center / 3rem no-repeat;
}

@media (max-width: 781px) {
	.roosty-colonnes-inversees {
		flex-direction: column-reverse;
	}

	.roosty-hero-polaroid__image {
		max-inline-size: min(100%, 28rem);
	}
}

@media (max-width: 480px) {
	.roosty-hero-polaroid {
		text-align: start;
	}

	.roosty-hero-polaroid__image {
		transform: none;
	}
}

@media print {
	.roosty-hero-polaroid {
		background: #fff;
	}

	.roosty-hero-polaroid__image,
	.roosty-carte-rituel {
		transform: none;
		box-shadow: none;
	}
}

/* ==========================================================================
   21. Bibliothèque d'icônes
   Une ligne par icône livrée avec le thème. Les icônes déposées dans
   wp-content/uploads/roosty-icones/ s'ajoutent d'elles-mêmes à cette liste.
   ========================================================================== */

.roosty-icone--accessibilite { --roosty-icone: url("assets/icons/accessibilite.svg"); }
.roosty-icone--accueil { --roosty-icone: url("assets/icons/accueil.svg"); }
.roosty-icone--alerte { --roosty-icone: url("assets/icons/alerte.svg"); }
.roosty-icone--anglais { --roosty-icone: url("assets/icons/anglais.svg"); }
.roosty-icone--apprendre { --roosty-icone: url("assets/icons/apprendre.svg"); }
.roosty-icone--archives { --roosty-icone: url("assets/icons/archives.svg"); }
.roosty-icone--arts { --roosty-icone: url("assets/icons/arts.svg"); }
.roosty-icone--audio { --roosty-icone: url("assets/icons/audio.svg"); }
.roosty-icone--calendrier { --roosty-icone: url("assets/icons/calendrier.svg"); }
.roosty-icone--classe { --roosty-icone: url("assets/icons/classe.svg"); }
.roosty-icone--coeur { --roosty-icone: url("assets/icons/coeur.svg"); }
.roosty-icone--collection { --roosty-icone: url("assets/icons/collection.svg"); }
.roosty-icone--courriel { --roosty-icone: url("assets/icons/courriel.svg"); }
.roosty-icone--document { --roosty-icone: url("assets/icons/document.svg"); }
.roosty-icone--donnees { --roosty-icone: url("assets/icons/donnees.svg"); }
.roosty-icone--ecouter { --roosty-icone: url("assets/icons/ecouter.svg"); }
.roosty-icone--ecriture { --roosty-icone: url("assets/icons/ecriture.svg"); }
.roosty-icone--emc { --roosty-icone: url("assets/icons/emc.svg"); }
.roosty-icone--espace { --roosty-icone: url("assets/icons/espace.svg"); }
.roosty-icone--etoile { --roosty-icone: url("assets/icons/etoile.svg"); }
.roosty-icone--famille { --roosty-icone: url("assets/icons/famille.svg"); }
.roosty-icone--filtre { --roosty-icone: url("assets/icons/filtre.svg"); }
.roosty-icone--fleche-droite { --roosty-icone: url("assets/icons/fleche-droite.svg"); }
.roosty-icone--francais { --roosty-icone: url("assets/icons/francais.svg"); }
.roosty-icone--frise { --roosty-icone: url("assets/icons/frise.svg"); }
.roosty-icone--geometrie { --roosty-icone: url("assets/icons/geometrie.svg"); }
.roosty-icone--grammaire { --roosty-icone: url("assets/icons/grammaire.svg"); }
.roosty-icone--histoire-geographie { --roosty-icone: url("assets/icons/histoire-geographie.svg"); }
.roosty-icone--horloge { --roosty-icone: url("assets/icons/horloge.svg"); }
.roosty-icone--idee { --roosty-icone: url("assets/icons/idee.svg"); }
.roosty-icone--image { --roosty-icone: url("assets/icons/image.svg"); }
.roosty-icone--imprimer { --roosty-icone: url("assets/icons/imprimer.svg"); }
.roosty-icone--info { --roosty-icone: url("assets/icons/info.svg"); }
.roosty-icone--jouer { --roosty-icone: url("assets/icons/jouer.svg"); }
.roosty-icone--journal { --roosty-icone: url("assets/icons/journal.svg"); }
.roosty-icone--lecture { --roosty-icone: url("assets/icons/lecture.svg"); }
.roosty-icone--lien-externe { --roosty-icone: url("assets/icons/lien-externe.svg"); }
.roosty-icone--lire { --roosty-icone: url("assets/icons/lire.svg"); }
.roosty-icone--lune { --roosty-icone: url("assets/icons/lune.svg"); }
.roosty-icone--manipuler { --roosty-icone: url("assets/icons/manipuler.svg"); }
.roosty-icone--mathematiques { --roosty-icone: url("assets/icons/mathematiques.svg"); }
.roosty-icone--matiere { --roosty-icone: url("assets/icons/matiere.svg"); }
.roosty-icone--mesures { --roosty-icone: url("assets/icons/mesures.svg"); }
.roosty-icone--methodes { --roosty-icone: url("assets/icons/methodes.svg"); }
.roosty-icone--mot-cle { --roosty-icone: url("assets/icons/mot-cle.svg"); }
.roosty-icone--musique { --roosty-icone: url("assets/icons/musique.svg"); }
.roosty-icone--niveau { --roosty-icone: url("assets/icons/niveau.svg"); }
.roosty-icone--nombres { --roosty-icone: url("assets/icons/nombres.svg"); }
.roosty-icone--oceans { --roosty-icone: url("assets/icons/oceans.svg"); }
.roosty-icone--oral { --roosty-icone: url("assets/icons/oral.svg"); }
.roosty-icone--orthographe { --roosty-icone: url("assets/icons/orthographe.svg"); }
.roosty-icone--outils { --roosty-icone: url("assets/icons/outils.svg"); }
.roosty-icone--partager { --roosty-icone: url("assets/icons/partager.svg"); }
.roosty-icone--problemes { --roosty-icone: url("assets/icons/problemes.svg"); }
.roosty-icone--production { --roosty-icone: url("assets/icons/production.svg"); }
.roosty-icone--projet { --roosty-icone: url("assets/icons/projet.svg"); }
.roosty-icone--qr-code { --roosty-icone: url("assets/icons/qr-code.svg"); }
.roosty-icone--recherche { --roosty-icone: url("assets/icons/recherche.svg"); }
.roosty-icone--regarder { --roosty-icone: url("assets/icons/regarder.svg"); }
.roosty-icone--reviser { --roosty-icone: url("assets/icons/reviser.svg"); }
.roosty-icone--rituel { --roosty-icone: url("assets/icons/rituel.svg"); }
.roosty-icone--rss { --roosty-icone: url("assets/icons/rss.svg"); }
.roosty-icone--sciences-technologie { --roosty-icone: url("assets/icons/sciences-technologie.svg"); }
.roosty-icone--sentrainer { --roosty-icone: url("assets/icons/sentrainer.svg"); }
.roosty-icone--soleil { --roosty-icone: url("assets/icons/soleil.svg"); }
.roosty-icone--sortie { --roosty-icone: url("assets/icons/sortie.svg"); }
.roosty-icone--telecharger { --roosty-icone: url("assets/icons/telecharger.svg"); }
.roosty-icone--temps { --roosty-icone: url("assets/icons/temps.svg"); }
.roosty-icone--verrou { --roosty-icone: url("assets/icons/verrou.svg"); }
.roosty-icone--video { --roosty-icone: url("assets/icons/video.svg"); }
.roosty-icone--vivant { --roosty-icone: url("assets/icons/vivant.svg"); }
.roosty-icone--vocabulaire { --roosty-icone: url("assets/icons/vocabulaire.svg"); }

/* ==========================================================================
   22. Direction artistique « carnet d'exploration »

   Cette couche donne davantage de relief aux modèles FSE sans enfermer les
   contenus : les textes, images, menus et liens restent ceux des blocs natifs.
   Les collages et pictogrammes sont purement décoratifs et disparaissent à
   l'impression ou lorsque l'espace manque.
   ========================================================================== */

/* En-tête compact, dessiné comme la première ligne d'un carnet. */
.roosty-entete {
	position: relative;
	z-index: 2;
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--roosty-sable) 26%, transparent) 1px, transparent 1px) 0 0 / 3rem 100%,
		color-mix(in srgb, var(--roosty-papier) 96%, var(--roosty-sable));
	box-shadow: 0 0.25rem 1.5rem rgba(83, 33, 5, 0.045);
}

.roosty-entete::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-end: -0.3rem;
	block-size: 0.65rem;
	background: linear-gradient(175deg, transparent 45%, var(--roosty-sable) 46% 53%, transparent 54%);
	opacity: 0.45;
	pointer-events: none;
}

.roosty-entete__rangee {
	min-block-size: 3.5rem;
}

.roosty-entete__marque .wp-block-site-title {
	position: relative;
	font-size: clamp(1.65rem, 2vw, 2.15rem) !important;
	font-weight: 700;
}

.roosty-entete__marque .wp-block-site-title::before {
	content: "";
	position: absolute;
	inset-inline-start: -0.65rem;
	inset-block-start: -0.45rem;
	inline-size: 0.8rem;
	aspect-ratio: 1;
	background: url("assets/icons/etoile.svg") center / contain no-repeat;
	transform: rotate(-12deg);
}

.roosty-entete__marque .wp-block-site-tagline:empty {
	display: none;
}

.roosty-menu {
	font-size: 0.85rem !important;
}

.roosty-entete .roosty-recherche .wp-block-search__button {
	inline-size: var(--roosty-cible);
	padding: 0;
	border: 0;
	background-color: var(--roosty-accent);
	color: var(--roosty-blanc);
	box-shadow: 0 0.25rem 0.8rem rgba(83, 33, 5, 0.16);
}

/* Hero : papier légèrement texturé, collage de feuilles et vrai Polaroid. */
.roosty-hero-polaroid {
	position: relative;
	isolation: isolate;
	min-block-size: clamp(32rem, 54vw, 43rem);
	background-image:
		radial-gradient(circle at 9% 16%, color-mix(in srgb, var(--roosty-framboise) 7%, transparent) 0 0.12rem, transparent 0.13rem),
		radial-gradient(circle at 89% 14%, color-mix(in srgb, var(--roosty-safran) 24%, transparent) 0 6.5rem, transparent 6.6rem),
		linear-gradient(176deg, transparent 0 17%, color-mix(in srgb, var(--roosty-sable) 34%, transparent) 17.2% 17.45%, transparent 17.7%),
		linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-papier) 88%, var(--roosty-sable)));
	background-size: 2rem 2rem, auto, auto, auto;
}

.roosty-hero-polaroid::before,
.roosty-hero-polaroid::after {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
}

.roosty-hero-polaroid::before {
	inset-inline-start: clamp(1rem, 3vw, 3rem);
	inset-block-end: clamp(2rem, 6vw, 5rem);
	inline-size: clamp(3rem, 6vw, 5rem);
	aspect-ratio: 1;
	background: url("assets/icons/etoile.svg") center / contain no-repeat;
	transform: rotate(-10deg);
}

.roosty-hero-polaroid::after {
	inset-inline-end: clamp(1rem, 3vw, 3.25rem);
	inset-block-start: clamp(1.5rem, 4vw, 3.5rem);
	inline-size: clamp(2.5rem, 5vw, 4rem);
	aspect-ratio: 1;
	background: url("assets/icons/idee.svg") center / contain no-repeat;
	transform: rotate(12deg);
}

.roosty-hero-polaroid__texte {
	position: relative;
	z-index: 1;
}

.roosty-hero-polaroid__texte::after {
	content: "";
	display: block;
	inline-size: min(9rem, 45%);
	block-size: 1.35rem;
	margin-block-start: 1.25rem;
	border-block-start: 3px dashed var(--roosty-cannelle);
	border-radius: 50%;
	transform: rotate(-3deg);
	opacity: 0.75;
}

.roosty-hero-polaroid__maxime {
	max-inline-size: 10ch;
	font-size: clamp(3.2rem, 6.5vw, 6.2rem) !important;
	line-height: 0.92 !important;
	letter-spacing: -0.035em;
}

.roosty-hero-polaroid__accent {
	display: block;
	padding: 0;
	background: transparent;
	color: var(--roosty-cannelle-profonde);
	font: inherit;
}

.roosty-hero-polaroid__visuel {
	position: relative;
	padding: clamp(1rem, 2vw, 2rem);
}

.roosty-hero-polaroid__visuel::before {
	content: "";
	position: absolute;
	inset: 8% 4% 12% 12%;
	z-index: -1;
	border: 1px solid color-mix(in srgb, var(--roosty-sable) 75%, var(--roosty-encre));
	border-radius: 0.25rem;
	background:
		linear-gradient(90deg, transparent 0 48%, color-mix(in srgb, var(--roosty-sable) 45%, transparent) 48% 49%, transparent 49%),
		var(--roosty-papier);
	box-shadow: var(--roosty-ombre);
	transform: rotate(5deg) translate(1rem, 0.5rem);
}

.roosty-hero-polaroid__visuel::after {
	content: "";
	position: absolute;
	z-index: 3;
	inset-block-start: -0.25rem;
	inset-inline-start: 44%;
	inline-size: 6.5rem;
	block-size: 2rem;
	background: color-mix(in srgb, var(--roosty-safran) 45%, var(--roosty-sable));
	box-shadow: 0 0.15rem 0.35rem rgba(83, 33, 5, 0.08);
	clip-path: polygon(3% 9%, 97% 0, 94% 92%, 0 100%);
	transform: rotate(3deg);
	opacity: 0.84;
}

.roosty-hero-polaroid__image {
	position: relative;
	max-inline-size: 38rem;
	transform: rotate(2.4deg);
}

.roosty-hero-polaroid--gauche .roosty-hero-polaroid__image {
	transform: rotate(-2.4deg);
}

.roosty-hero-polaroid__image img {
	inline-size: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	padding: clamp(0.65rem, 1.2vw, 1rem) clamp(0.65rem, 1.2vw, 1rem) clamp(2.5rem, 4vw, 3.75rem);
	box-shadow: 0 1.2rem 2.8rem rgba(83, 33, 5, 0.18);
}

.roosty-hero-polaroid__image figcaption {
	margin-block-start: -2.25rem;
	padding-inline: 1.25rem;
	font-family: var(--wp--preset--font-family--titres);
	font-size: 0.85rem;
	transform: rotate(-0.5deg);
}

/* Entêtes de sections et liens manuscrits. */
.roosty-section__entete {
	position: relative;
	gap: 1rem 2rem;
}

.roosty-section__entete h2::after,
.roosty-acces-principaux > h2::after {
	content: "";
	display: block;
	inline-size: 3rem;
	margin-block-start: 0.35rem;
	border-block-start: 3px solid var(--roosty-safran);
	border-radius: 50%;
	transform: rotate(-4deg);
}

.roosty-acces-principaux > h2::after {
	margin-inline: auto;
}

.roosty-lien-suite a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--roosty-cible);
	color: var(--roosty-accent);
	font-weight: 700;
	text-decoration: none;
}

.roosty-lien-suite a:where(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

/* Actualités : cartes plus photographiques, plus proches d'un journal. */
.roosty-actualites {
	position: relative;
	background-image:
		linear-gradient(175deg, transparent 0 1.4rem, color-mix(in srgb, var(--roosty-sable) 28%, transparent) 1.45rem 1.55rem, transparent 1.6rem),
		linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-papier) 96%, var(--roosty-sable)));
}

.roosty-actualites::after {
	content: "";
	position: absolute;
	inset-inline-end: clamp(1rem, 4vw, 4rem);
	inset-block-start: 1.25rem;
	inline-size: 3.25rem;
	aspect-ratio: 1;
	background: url("assets/icons/journal.svg") center / contain no-repeat;
	transform: rotate(8deg);
	pointer-events: none;
}

.roosty-actualites .wp-block-post-template {
	gap: clamp(1rem, 2vw, 1.5rem);
}

.roosty-actualites .roosty-carte-article,
.roosty-archive-actualites .roosty-carte-article {
	position: relative;
	overflow: hidden;
	padding: 0 0 1rem;
	border-color: color-mix(in srgb, var(--roosty-sable) 68%, transparent);
	border-radius: 0.8rem;
	box-shadow: 0 0.45rem 1.25rem rgba(83, 33, 5, 0.075);
}

.roosty-actualites .roosty-carte-article:nth-child(even),
.roosty-archive-actualites .roosty-carte-article:nth-child(even) {
	transform: translateY(0.75rem);
}

/* L'image touche les bords haut, gauche et droit de la carte. Plutôt que de
   la faire déborder d'un rembourrage — la carte est un conteneur flex en
   colonne, où une marge « auto » n'absorbe que de l'espace disponible et
   retombe à zéro dès que l'enfant est plus large que son parent —, la carte
   ne porte plus de rembourrage latéral du tout : ce sont les blocs de texte
   qui portent le leur, plus bas. Reste à neutraliser les marges automatiques
   que la mise en page « constrained » de WordPress impose en « !important » à
   tout enfant direct : sans quoi les blocs ne s'étirent pas et se réduisent à
   leur contenu. */
.roosty-actualites .roosty-carte-article > *,
.roosty-archive-actualites .roosty-carte-article > * {
	margin-inline: 0 !important;
}

.roosty-actualites .roosty-carte-article .wp-block-post-featured-image,
.roosty-archive-actualites .roosty-carte-article .wp-block-post-featured-image {
	inline-size: 100%;
	max-inline-size: none;
	margin-block: 0;
}

.roosty-actualites .roosty-carte-article .wp-block-post-featured-image img,
.roosty-archive-actualites .roosty-carte-article .wp-block-post-featured-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
}

.roosty-actualites .roosty-carte-article > :not(.wp-block-post-featured-image),
.roosty-archive-actualites .roosty-carte-article > :not(.wp-block-post-featured-image) {
	padding-inline: 1rem;
}

.roosty-actualites .roosty-carte-article .wp-block-post-terms a,
.roosty-archive-actualites .roosty-carte-article .wp-block-post-terms a {
	display: inline-flex;
	padding: 0.18rem 0.5rem;
	border: 1px solid currentColor;
	border-radius: var(--roosty-rayon-rond);
	background: var(--roosty-papier);
	color: var(--roosty-accent);
	font-size: 0.66rem;
}

.roosty-actualites .roosty-carte-article:not(:has(.wp-block-post-featured-image))::before,
.roosty-archive-actualites .roosty-carte-article:not(:has(.wp-block-post-featured-image))::before {
	margin: 0;
	inline-size: 100%;
	border-radius: 0;
	background-color: color-mix(in srgb, var(--roosty-sable) 62%, var(--roosty-papier));
}

/* Rituels : bandeau de papier pointillé et cartes d'atelier. */
.roosty-rituels-du-jour {
	position: relative;
	isolation: isolate;
	background:
		radial-gradient(circle at 5% 22%, color-mix(in srgb, var(--roosty-safran) 20%, transparent) 0 4.75rem, transparent 4.85rem),
		linear-gradient(180deg, color-mix(in srgb, var(--roosty-papier) 94%, var(--roosty-sable)), var(--roosty-papier));
	border-block: 1px solid var(--roosty-sable);
}

.roosty-rituels-du-jour::before,
.roosty-rituels-du-jour::after {
	content: "";
	position: absolute;
	z-index: -1;
	inline-size: clamp(4rem, 8vw, 6rem);
	aspect-ratio: 1;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}

.roosty-rituels-du-jour::before {
	display: none;
}

.roosty-rituels-du-jour::after {
	inset-inline-end: clamp(1rem, 3vw, 2.5rem);
	inset-block-end: 1.5rem;
	background-image: url("assets/icons/calendrier.svg");
	transform: rotate(7deg);
}

.roosty-rituels-du-jour__entete,
.roosty-rituels-du-jour .roosty-bandeau__contenu {
	padding-inline: clamp(1rem, 5vw, 5rem);
}

.roosty-rituels-du-jour__entete > .wp-block-group:first-child {
	position: relative;
	padding-inline-start: 0;
}

.roosty-rituels-du-jour__entete > .wp-block-group:first-child::before {
	display: none;
}

.roosty-rituels-du-jour .roosty-bandeau__contenu {
	padding-block: clamp(1.25rem, 3vw, 2.25rem);
	border: 2px dashed color-mix(in srgb, var(--roosty-cannelle) 56%, var(--roosty-sable));
	border-radius: 0.8rem;
	background: color-mix(in srgb, var(--roosty-papier) 92%, transparent);
	box-shadow: inset 0 0 2rem rgba(83, 33, 5, 0.035);
}

.roosty-rituels-du-jour .roosty-carte-rituel {
	position: relative;
	padding-inline-start: clamp(4.35rem, 6vw, 5rem);
	border: 0;
	border-inline-start: 1px solid var(--roosty-sable);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.roosty-rituels-du-jour .roosty-carte-rituel::before {
	content: "";
	position: absolute;
	inset-inline-start: 0.9rem;
	inset-block-start: 0.85rem;
	inline-size: 2.8rem;
	aspect-ratio: 1;
	border-radius: 50%;
	background: color-mix(in srgb, var(--roosty-safran) 34%, var(--roosty-papier)) url("assets/icons/rituel.svg") center / 1.75rem no-repeat;
	box-shadow: 0 0.25rem 0.8rem rgba(83, 33, 5, 0.1);
}

.roosty-rituels-du-jour .roosty-rituel__etat {
	margin-block-start: auto;
	font-weight: 700;
}

/* Accès principaux : quatre pictogrammes généreux, sans effet de tableau. */
.roosty-acces-principaux {
	position: relative;
	overflow: clip;
}

.roosty-acces-principaux::before {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-start: 0;
	block-size: 1.15rem;
	background: linear-gradient(174deg, var(--roosty-sable) 0 45%, transparent 47% 100%);
	opacity: 0.45;
	pointer-events: none;
}

.roosty-acces-principaux__grille {
	gap: clamp(1rem, 2vw, 1.75rem) !important;
}

.roosty-acces-principaux__grille > .roosty-acces-carte {
	position: relative;
	padding: 6.1rem 1.25rem 1.5rem;
	border: 0;
	border-inline-end: 1px solid var(--roosty-sable);
	border-radius: 0;
	background: transparent;
	text-align: center;
}

.roosty-acces-principaux__grille > .roosty-acces-carte:last-child {
	border-inline-end: 0;
}

.roosty-acces-carte::before {
	content: "";
	position: absolute;
	inset-block-start: 0.25rem;
	inset-inline-start: 50%;
	inline-size: 5rem;
	aspect-ratio: 1;
	border-radius: 46% 54% 58% 42% / 48% 42% 58% 52%;
	background-color: var(--roosty-sable);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 3.35rem;
	transform: translateX(-50%) rotate(-4deg);
}

.roosty-acces-carte--classe::before {
	background-color: color-mix(in srgb, var(--roosty-safran) 64%, var(--roosty-papier));
	background-image: url("assets/icons/classe.svg");
}

.roosty-acces-carte--apprendre::before {
	background-color: color-mix(in srgb, var(--roosty-framboise) 22%, var(--roosty-papier));
	background-image: url("assets/icons/apprendre.svg");
}

.roosty-acces-carte--familles::before {
	background-color: color-mix(in srgb, var(--roosty-cannelle) 25%, var(--roosty-papier));
	background-image: url("assets/icons/famille.svg");
}

.roosty-acces-carte--projets::before {
	background-color: color-mix(in srgb, var(--roosty-safran) 36%, var(--roosty-papier));
	background-image: url("assets/icons/projet.svg");
}

.roosty-acces-carte h3 {
	color: var(--roosty-accent);
}

.roosty-acces-carte .wp-block-buttons {
	justify-content: center;
}

/* Bandeau de contact et pied de page, comme la couverture du carnet. */
.roosty-restez-connectes {
	position: relative;
	overflow: clip;
	background:
		radial-gradient(circle at 29% calc(100% - 1.1rem), color-mix(in srgb, var(--roosty-safran) 92%, transparent) 0 0.38rem, transparent 0.41rem),
		radial-gradient(circle at 57% calc(100% - 0.85rem), color-mix(in srgb, var(--roosty-cannelle) 90%, transparent) 0 0.36rem, transparent 0.39rem),
		radial-gradient(circle at 76% calc(100% - 1.05rem), color-mix(in srgb, var(--roosty-safran) 82%, transparent) 0 0.3rem, transparent 0.33rem),
		linear-gradient(180deg, color-mix(in srgb, var(--roosty-sable) 82%, var(--roosty-papier)), var(--roosty-sable));
	border: 0;
}

.roosty-restez-connectes::before,
.roosty-restez-connectes::after {
	content: "";
	position: absolute;
	inline-size: clamp(4rem, 7vw, 5.5rem);
	aspect-ratio: 1;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}

.roosty-restez-connectes::before {
	display: none;
}

.roosty-restez-connectes::after {
	inset-inline-end: clamp(1rem, 4vw, 4rem);
	inset-block-start: 1rem;
	background-image: url("assets/icons/etoile.svg");
	transform: rotate(10deg);
}

.roosty-pied {
	margin-block-start: 0 !important;
	border: 0;
	background:
		radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--roosty-cannelle) 18%, transparent) 0 0.12rem, transparent 0.13rem) 0 0 / 2rem 2rem,
		var(--roosty-brun);
	color: var(--roosty-papier);
}

.roosty-pied :where(h2, p, a),
.roosty-pied .has-estompe-color {
	color: var(--roosty-papier) !important;
}

.roosty-pied a:where(:hover, :focus-visible) {
	color: var(--roosty-safran) !important;
}

.roosty-pied .wp-block-separator {
	border-color: color-mix(in srgb, var(--roosty-papier) 35%, transparent);
}

/* Les autres écrans reprennent les mêmes gestes graphiques. */
.roosty-archive-actualites,
.roosty-archive-rituels {
	position: relative;
	padding-block-start: clamp(1.5rem, 4vw, 3rem);
}

.roosty-archive-actualites::after,
.roosty-archive-rituels::after {
	content: "";
	position: absolute;
	z-index: -1;
	inset-inline-end: 0;
	inset-block-start: 0;
	inline-size: clamp(9rem, 24vw, 18rem);
	aspect-ratio: 4 / 3;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 0.72;
	pointer-events: none;
}

.roosty-archive-actualites::after {
	background-image: url("assets/images/illustration-journal.svg");
}

.roosty-archive-rituels::after {
	background-image: url("assets/images/illustration-rituel.svg");
}

.roosty-archive-actualites > :where(.wp-block-query-title, .roosty-chapeau),
.roosty-archive-rituels > :where(.wp-block-query-title, .roosty-chapeau) {
	max-inline-size: min(62%, 42rem);
	margin-inline-start: 0 !important;
}

.roosty-principal--actualite > .wp-block-post-featured-image,
.roosty-principal--ressource > .wp-block-post-featured-image {
	position: relative;
	padding: 0.75rem 0.75rem 2.5rem;
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre-relief);
	transform: rotate(-0.65deg);
}

.roosty-principal--actualite > .wp-block-post-featured-image::before,
.roosty-principal--ressource > .wp-block-post-featured-image::before {
	content: "";
	position: absolute;
	z-index: 2;
	inset-block-start: -1rem;
	inset-inline-start: 44%;
	inline-size: 6rem;
	block-size: 1.8rem;
	background: color-mix(in srgb, var(--roosty-safran) 42%, var(--roosty-sable));
	clip-path: polygon(2% 8%, 100% 0, 96% 92%, 0 100%);
	transform: rotate(2deg);
	opacity: 0.84;
}

.roosty-principal--actualite > .wp-block-post-featured-image img,
.roosty-principal--ressource > .wp-block-post-featured-image img {
	border-radius: 0.2rem;
}

.roosty-bloc--page-ressources .roosty-page-intro {
	position: relative;
	min-block-size: clamp(22rem, 38vw, 31rem);
	background:
		url("assets/images/illustration-apprendre.svg") right clamp(1rem, 5vw, 5rem) center / min(38%, 28rem) auto no-repeat,
		linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-papier) 90%, var(--roosty-sable)));
}

.roosty-bloc--page-ressources .roosty-page-intro > * {
	max-inline-size: min(54%, 38rem);
	margin-inline-start: max(0px, calc((100% - var(--wp--style--global--wide-size)) / 2));
}

@media (max-width: 900px) {
	.roosty-hero-polaroid__maxime {
		font-size: clamp(3rem, 8vw, 4.75rem) !important;
	}

	.roosty-actualites .roosty-carte-article:nth-child(even),
	.roosty-archive-actualites .roosty-carte-article:nth-child(even) {
		transform: none;
	}

	.roosty-acces-principaux__grille {
		flex-wrap: wrap !important;
	}

	.roosty-acces-principaux__grille > .roosty-acces-carte {
		flex: 1 1 calc(50% - 1rem) !important;
		border-inline-end: 0;
	}
}

@media (max-width: 781px) {
	.roosty-entete__rangee,
	.roosty-entete__outils {
		flex-wrap: nowrap;
	}

	.roosty-hero-polaroid {
		min-block-size: 0;
	}

	.roosty-hero-polaroid__visuel {
		order: -1;
		padding: 0.5rem 1rem 1.5rem;
	}

	.roosty-hero-polaroid__image {
		max-inline-size: min(100%, 32rem);
	}

	.roosty-hero-polaroid__texte::after {
		display: none;
	}

	.roosty-rituels-du-jour::before {
		display: none;
	}

	.roosty-rituels-du-jour::after,
	.roosty-actualites::after {
		opacity: 0.28;
	}

	.roosty-rituels-du-jour__entete,
	.roosty-rituels-du-jour .roosty-bandeau__contenu {
		padding-inline: 1rem;
	}

	.roosty-archive-actualites::after,
	.roosty-archive-rituels::after {
		opacity: 0.22;
	}

	.roosty-archive-actualites > :where(.wp-block-query-title, .roosty-chapeau),
	.roosty-archive-rituels > :where(.wp-block-query-title, .roosty-chapeau) {
		max-inline-size: 100%;
	}

	.roosty-bloc--page-ressources .roosty-page-intro {
		min-block-size: 0;
		background-image: linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-papier) 90%, var(--roosty-sable)));
	}

	.roosty-bloc--page-ressources .roosty-page-intro > * {
		max-inline-size: 100%;
		margin-inline-start: auto;
	}
}

@media (max-width: 520px) {
	.roosty-entete__marque .wp-block-site-title {
		font-size: 1.35rem !important;
	}

	.roosty-hero-polaroid__maxime {
		font-size: clamp(2.8rem, 14vw, 4rem) !important;
	}

	.roosty-hero-polaroid::before,
	.roosty-hero-polaroid::after,
	.roosty-restez-connectes::before,
	.roosty-restez-connectes::after {
		display: none;
	}

	.roosty-hero-polaroid__visuel::after {
		inline-size: 4.5rem;
		block-size: 1.4rem;
	}

	.roosty-rituels-du-jour__entete > .wp-block-group:first-child {
		padding-inline-start: 0;
	}

	.roosty-rituels-du-jour__entete > .wp-block-group:first-child::before {
		display: none;
	}

	.roosty-acces-principaux__grille > .roosty-acces-carte {
		flex-basis: 100% !important;
		padding-block-start: 5.75rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.roosty-hero-polaroid__image,
	.roosty-hero-polaroid__visuel::before,
	.roosty-principal--actualite > .wp-block-post-featured-image,
	.roosty-principal--ressource > .wp-block-post-featured-image,
	.roosty-actualites .roosty-carte-article:nth-child(even),
	.roosty-archive-actualites .roosty-carte-article:nth-child(even) {
		transform: none;
	}
}

@media print {
	.roosty-entete::after,
	.roosty-hero-polaroid::before,
	.roosty-hero-polaroid::after,
	.roosty-hero-polaroid__visuel::before,
	.roosty-hero-polaroid__visuel::after,
	.roosty-actualites::after,
	.roosty-rituels-du-jour::before,
	.roosty-rituels-du-jour::after,
	.roosty-acces-carte::before,
	.roosty-restez-connectes::before,
	.roosty-restez-connectes::after,
	.roosty-archive-actualites::after,
	.roosty-archive-rituels::after,
	.roosty-principal--actualite > .wp-block-post-featured-image::before,
	.roosty-principal--ressource > .wp-block-post-featured-image::before {
		display: none;
	}

	.roosty-pied {
		background: #fff;
		color: #000;
	}

	.roosty-pied :where(h2, p, a),
	.roosty-pied .has-estompe-color {
		color: #000 !important;
	}
}

/* ==========================================================================
   23. Carnet vivant — modèles, compositions et tempéraments
   Les réglages custom de theme.json sont surchargés par chaque variation.
   Le contenu reste composé exclusivement de blocs natifs Gutenberg.
   ========================================================================== */

body {
	--roosty-decor-opacity: var(--wp--custom--roosty--decor-opacity, 0.78);
	--roosty-card-tilt: var(--wp--custom--roosty--card-tilt, 0.65deg);
	--roosty-card-lift: var(--wp--custom--roosty--card-lift, 0.45rem);
	--roosty-texture-opacity: var(--wp--custom--roosty--texture-opacity, 0.34);
	--roosty-playful-radius: var(--wp--custom--roosty--playful-radius, 1.25rem);
}

.wp-site-blocks {
	background:
		radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--roosty-sable) 25%, transparent) 1px, transparent 1.2px) 0 0 / 1.5rem 1.5rem,
		var(--roosty-papier);
}

/* Les variations saisonnières pilotées par Roosty Outils reprennent les
   mêmes paramètres que les variations globales choisies dans l’éditeur. */
.roosty-saison--rentree { --roosty-decor-opacity: 0.92; --roosty-card-tilt: 1deg; --roosty-card-lift: 0.6rem; --roosty-texture-opacity: 0.45; --roosty-playful-radius: 1.25rem; }
.roosty-saison--halloween { --roosty-decor-opacity: 0.84; --roosty-card-tilt: -0.85deg; --roosty-card-lift: 0.55rem; --roosty-texture-opacity: 0.26; --roosty-playful-radius: 0.7rem; }
.roosty-saison--automne { --roosty-decor-opacity: 0.72; --roosty-card-tilt: 0.9deg; --roosty-card-lift: 0.38rem; --roosty-texture-opacity: 0.48; --roosty-playful-radius: 1.05rem; }
.roosty-saison--noel { --roosty-decor-opacity: 0.78; --roosty-card-tilt: 0.55deg; --roosty-card-lift: 0.45rem; --roosty-texture-opacity: 0.28; --roosty-playful-radius: 1.1rem; }
.roosty-saison--hiver { --roosty-decor-opacity: 0.38; --roosty-card-tilt: 0.18deg; --roosty-card-lift: 0.2rem; --roosty-texture-opacity: 0.1; --roosty-playful-radius: 0.8rem; }
.roosty-saison--carnaval { --roosty-decor-opacity: 1; --roosty-card-tilt: 1.4deg; --roosty-card-lift: 0.7rem; --roosty-texture-opacity: 0.58; --roosty-playful-radius: 1.65rem; }
.roosty-saison--printemps { --roosty-decor-opacity: 0.82; --roosty-card-tilt: 0.7deg; --roosty-card-lift: 0.4rem; --roosty-texture-opacity: 0.36; --roosty-playful-radius: 1.8rem; }
.roosty-saison--ete { --roosty-decor-opacity: 0.62; --roosty-card-tilt: 0.45deg; --roosty-card-lift: 0.35rem; --roosty-texture-opacity: 0.18; --roosty-playful-radius: 1.5rem; }

/* En-têtes de modèles : une couverture distincte pour chaque écran. */
.roosty-principal:not(.roosty-principal--accueil) {
	position: relative;
}

.roosty-archive-generique,
.roosty-ecran-recherche,
.roosty-ecran-404,
.roosty-principal--page,
.roosty-principal--article,
.roosty-principal--actualite,
.roosty-principal--rituel,
.roosty-principal--projet,
.roosty-principal--ressource {
	isolation: isolate;
	padding-block-start: clamp(2rem, 5vw, 4.5rem);
}

.roosty-archive-generique::before,
.roosty-ecran-recherche::before,
.roosty-principal--page::before,
.roosty-principal--article::before,
.roosty-principal--actualite::before,
.roosty-principal--rituel::before,
.roosty-principal--projet::before,
.roosty-principal--ressource::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset-inline-end: 0;
	inset-block-start: 0;
	inline-size: clamp(8rem, 22vw, 17rem);
	aspect-ratio: 4 / 3;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: var(--roosty-decor-opacity);
	pointer-events: none;
}

.roosty-archive-generique::before,
.roosty-archive-journal::before,
.roosty-principal--article::before,
.roosty-principal--actualite::before {
	background-image: url("assets/images/illustration-journal.svg");
}

.roosty-archive-categorie::before { background-image: url("assets/images/illustration-archives.svg"); }
.roosty-ecran-recherche::before { background-image: url("assets/images/illustration-recherche.svg"); }
.roosty-principal--page::before { background-image: url("assets/images/illustration-collections.svg"); }
.roosty-principal--rituel::before { background-image: url("assets/images/illustration-rituel.svg"); }
.roosty-principal--projet::before { background-image: url("assets/images/illustration-projets.svg"); }
.roosty-principal--ressource::before { background-image: url("assets/images/illustration-apprendre.svg"); }

.roosty-archive-generique > :where(.wp-block-query-title, h1, .roosty-chapeau, .wp-block-term-description),
.roosty-ecran-recherche > :where(.wp-block-query-title, h1),
.roosty-principal:is(.roosty-principal--article, .roosty-principal--actualite, .roosty-principal--rituel, .roosty-principal--projet, .roosty-principal--ressource) > :where(.wp-block-post-title, .roosty-chapeau, .roosty-meta) {
	max-inline-size: min(68%, 46rem);
}

.roosty-archive-generique > :where(.wp-block-query-title, h1, .roosty-chapeau, .wp-block-term-description) {
	margin-inline-start: 0 !important;
}

.roosty-archive-actualites::after,
.roosty-archive-rituels::after {
	z-index: 0;
}

.roosty-archive-actualites > *,
.roosty-archive-rituels > * {
	position: relative;
	z-index: 1;
}

.roosty-archive-generique > :where(.wp-block-query-title, h1),
.roosty-ecran-recherche > :where(.wp-block-query-title, h1),
.roosty-principal--page > .wp-block-post-title,
.roosty-principal:is(.roosty-principal--article, .roosty-principal--actualite, .roosty-principal--rituel, .roosty-principal--projet, .roosty-principal--ressource) > .wp-block-post-title {
	position: relative;
	display: table;
}

.roosty-archive-generique > :where(.wp-block-query-title, h1)::after,
.roosty-ecran-recherche > :where(.wp-block-query-title, h1)::after,
.roosty-principal--page > .wp-block-post-title::after,
.roosty-principal:is(.roosty-principal--article, .roosty-principal--actualite, .roosty-principal--rituel, .roosty-principal--projet, .roosty-principal--ressource) > .wp-block-post-title::after {
	content: "";
	display: block;
	inline-size: 42%;
	margin-block-start: 0.35rem;
	border-block-start: 4px solid var(--roosty-safran);
	border-radius: 50%;
	transform: rotate(calc(var(--roosty-card-tilt) * -1));
}

/* Archives, recherche et pagination prennent un rythme de mur d’atelier. */
.roosty-archive-generique .roosty-liste-articles,
.roosty-ecran-recherche .roosty-liste-articles,
.roosty-archive-rituels .roosty-liste-articles {
	gap: clamp(1.25rem, 3vw, 2.25rem);
}

.roosty-archive-generique .roosty-carte-article,
.roosty-ecran-recherche .roosty-carte-article,
.roosty-archive-rituels .roosty-carte-article {
	border-radius: var(--roosty-playful-radius);
	transform: rotate(var(--roosty-card-tilt));
	transition: transform var(--roosty-transition), box-shadow var(--roosty-transition);
}

.roosty-archive-generique .roosty-carte-article:nth-child(even),
.roosty-ecran-recherche .roosty-carte-article:nth-child(even),
.roosty-archive-rituels .roosty-carte-article:nth-child(even) {
	transform: rotate(calc(var(--roosty-card-tilt) * -1)) translateY(var(--roosty-card-lift));
}

.roosty-archive-generique .roosty-carte-article:where(:hover, :focus-within),
.roosty-ecran-recherche .roosty-carte-article:where(:hover, :focus-within),
.roosty-archive-rituels .roosty-carte-article:where(:hover, :focus-within) {
	transform: translateY(calc(var(--roosty-card-lift) * -1));
	box-shadow: var(--roosty-ombre-relief);
}

.roosty-pagination {
	padding-block-start: 1rem;
	border-block-start: 2px dashed color-mix(in srgb, var(--roosty-cannelle) 45%, var(--roosty-sable));
}

.roosty-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-inline-size: var(--roosty-cible);
	min-block-size: var(--roosty-cible);
	border-radius: 50%;
}

.roosty-pagination .page-numbers.current {
	background: var(--roosty-cannelle);
	color: var(--roosty-blanc);
}

.roosty-recherche-geante,
.roosty-recherche {
	padding: clamp(0.75rem, 2vw, 1.25rem);
	border: 1px solid var(--roosty-sable);
	border-radius: var(--roosty-playful-radius);
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
	transform: rotate(calc(var(--roosty-card-tilt) / 3));
}

.roosty-entete .roosty-recherche {
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	transform: none;
}

.roosty-ecran-404 .roosty-recherche .wp-block-search__button {
	inline-size: auto;
	padding-inline: 1.35rem;
}

.roosty-attente,
.roosty-etat-vide {
	position: relative;
	background:
		linear-gradient(transparent 1.65rem, color-mix(in srgb, var(--roosty-sable) 42%, transparent) 1.7rem) 0 0 / 100% 1.75rem,
		var(--roosty-papier);
}

/* Articles et pages : photographie, fiche et cahier ont chacun leur geste. */
.roosty-principal--page > .wp-block-post-featured-image,
.roosty-principal--article > .wp-block-post-featured-image,
.roosty-principal--projet > .wp-block-post-featured-image {
	position: relative;
	padding: 0.75rem 0.75rem 2.5rem;
	border: 1px solid color-mix(in srgb, var(--roosty-sable) 70%, transparent);
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre-relief);
	transform: rotate(calc(var(--roosty-card-tilt) * -1));
}

.roosty-principal--projet > .wp-block-post-featured-image {
	transform: rotate(var(--roosty-card-tilt));
}

.roosty-principal--page > .wp-block-post-featured-image::before,
.roosty-principal--article > .wp-block-post-featured-image::before,
.roosty-principal--projet > .wp-block-post-featured-image::before {
	content: "";
	position: absolute;
	z-index: 2;
	inset-block-start: -0.9rem;
	inset-inline-start: 42%;
	inline-size: 6.5rem;
	block-size: 1.7rem;
	background: color-mix(in srgb, var(--roosty-safran) 45%, var(--roosty-sable));
	clip-path: polygon(3% 8%, 100% 0, 95% 93%, 0 100%);
	opacity: var(--roosty-decor-opacity);
}

.roosty-principal--rituel {
	padding: clamp(2rem, 5vw, 4rem);
	border: 2px dashed color-mix(in srgb, var(--roosty-cannelle) 48%, var(--roosty-sable));
	border-radius: var(--roosty-playful-radius);
	background:
		radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--roosty-safran) 26%, transparent) 1px, transparent 1.2px) 0 0 / 1.35rem 1.35rem,
		color-mix(in srgb, var(--roosty-papier) 94%, var(--roosty-sable));
}

.roosty-principal--ressource > .wp-block-post-content,
.roosty-principal--projet > .wp-block-post-content,
.roosty-principal--actualite > .wp-block-post-content,
.roosty-principal--article > .wp-block-post-content {
	margin-block-start: clamp(1rem, 3vw, 2rem);
}

.roosty-navigation-article {
	position: relative;
	padding: clamp(1rem, 3vw, 1.75rem);
	border: 1px dashed var(--roosty-sable);
	border-radius: var(--roosty-playful-radius);
	background: color-mix(in srgb, var(--roosty-sable) 25%, var(--roosty-papier));
}

/* Pages complètes : chaque rubrique reçoit sa propre couverture illustrée. */
.roosty-page-intro {
	position: relative;
	overflow: clip;
	min-block-size: clamp(20rem, 34vw, 28rem);
	background-position: right clamp(1rem, 5vw, 5rem) center !important;
	background-repeat: no-repeat !important;
	background-size: min(38%, 27rem) auto !important;
}

.roosty-page-intro::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-end: -0.35rem;
	block-size: 1.4rem;
	background: linear-gradient(176deg, transparent 0 38%, var(--roosty-sable) 40% 47%, transparent 49% 100%);
	opacity: var(--roosty-texture-opacity);
	pointer-events: none;
}

.roosty-page-intro > * {
	max-inline-size: min(54%, 40rem);
	margin-inline-start: max(0px, calc((100% - var(--wp--style--global--wide-size)) / 2));
}

.roosty-bloc--page-journal .roosty-page-intro { background-image: url("assets/images/illustration-journal.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-classe .roosty-page-intro { background-image: url("assets/images/illustration-productions.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-apprendre .roosty-page-intro { background-image: url("assets/images/illustration-apprendre.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-familles .roosty-page-intro { background-image: url("assets/images/illustration-familles.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-projets .roosty-page-intro { background-image: url("assets/images/illustration-projets.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-rituels .roosty-page-intro { background-image: url("assets/images/illustration-rituel.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }
.roosty-bloc--page-ressources .roosty-page-intro { background-image: url("assets/images/illustration-outils.svg"), linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))); }

/* Grandes sections : panneaux, fiches punaisées et rubriques illustrées. */
.roosty-composition:is(.roosty-composition--agenda, .roosty-composition--domaines, .roosty-composition--familles, .roosty-composition--productions) {
	position: relative;
	overflow: clip;
}

.roosty-composition:is(.roosty-composition--agenda, .roosty-composition--domaines, .roosty-composition--familles)::before {
	content: "";
	position: absolute;
	inset-inline-end: clamp(1rem, 4vw, 4rem);
	inset-block-start: 1.5rem;
	inline-size: clamp(4rem, 8vw, 6rem);
	aspect-ratio: 1;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: var(--roosty-decor-opacity);
	pointer-events: none;
}

.roosty-composition--agenda::before { background-image: url("assets/icons/calendrier.svg"); transform: rotate(var(--roosty-card-tilt)); }
.roosty-composition--domaines::before { background-image: url("assets/icons/apprendre.svg"); transform: rotate(calc(var(--roosty-card-tilt) * -1)); }
.roosty-composition--familles::before { background-image: url("assets/icons/famille.svg"); transform: rotate(var(--roosty-card-tilt)); }

.roosty-composition__agenda > .wp-block-column,
.roosty-composition__domaines > .wp-block-column,
.roosty-composition__colonnes > .wp-block-column {
	position: relative;
	padding: clamp(1rem, 2.5vw, 1.5rem);
	border: 1px solid color-mix(in srgb, var(--roosty-sable) 72%, transparent);
	border-radius: var(--roosty-playful-radius);
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
	transform: rotate(calc(var(--roosty-card-tilt) / 2));
}

.roosty-composition__agenda > .wp-block-column:nth-child(even),
.roosty-composition__domaines > .wp-block-column:nth-child(even),
.roosty-composition__colonnes > .wp-block-column:nth-child(even) {
	transform: rotate(calc(var(--roosty-card-tilt) / -2)) translateY(var(--roosty-card-lift));
}

.roosty-composition__domaines > .wp-block-column::before {
	content: "";
	display: block;
	inline-size: 3.25rem;
	aspect-ratio: 1;
	margin-block-end: 0.75rem;
	border-radius: 50%;
	background-color: color-mix(in srgb, var(--roosty-safran) 30%, var(--roosty-papier));
	background-position: center;
	background-repeat: no-repeat;
	background-size: 2.1rem;
}

.roosty-composition__domaines > .wp-block-column:nth-child(1)::before { background-image: url("assets/icons/francais.svg"); }
.roosty-composition__domaines > .wp-block-column:nth-child(2)::before { background-image: url("assets/icons/mathematiques.svg"); }
.roosty-composition__domaines > .wp-block-column:nth-child(3)::before { background-image: url("assets/icons/sciences-technologie.svg"); }
.roosty-composition__domaines > .wp-block-column:nth-child(4)::before { background-image: url("assets/icons/arts.svg"); }

.roosty-composition__liens > h3 {
	position: relative;
	padding-inline-start: 2.75rem;
}

.roosty-composition__liens > h3::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: -0.25rem;
	inline-size: 2rem;
	aspect-ratio: 1;
	background: url("assets/icons/etoile.svg") center / contain no-repeat;
}

.roosty-composition__galerie .wp-block-image,
.roosty-galerie .wp-block-image,
.roosty-bloc--deux-polaroids .wp-block-image {
	padding: 0.45rem 0.45rem 1.8rem;
	background: var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
	transform: rotate(var(--roosty-card-tilt));
}

.roosty-composition__galerie .wp-block-image:nth-child(even),
.roosty-galerie .wp-block-image:nth-child(even),
.roosty-bloc--deux-polaroids .wp-block-image:nth-child(even) {
	transform: rotate(calc(var(--roosty-card-tilt) * -1)) translateY(var(--roosty-card-lift));
}

/* Compositions d’article : un dossier différent pour actualités, projets,
   ressources et rituels, sans enfermer le moindre texte dans du HTML. */
.roosty-article,
.roosty-rituel {
	position: relative;
	padding: clamp(1.25rem, 4vw, 2.75rem);
	border: 1px solid color-mix(in srgb, var(--roosty-sable) 72%, transparent);
	border-radius: var(--roosty-playful-radius);
	background:
		linear-gradient(90deg, transparent 0 2.75rem, color-mix(in srgb, var(--roosty-framboise) 18%, transparent) 2.8rem 2.9rem, transparent 2.95rem),
		linear-gradient(transparent 1.72rem, color-mix(in srgb, var(--roosty-sable) 38%, transparent) 1.77rem) 0 0 / 100% 1.8rem,
		var(--roosty-blanc);
	box-shadow: var(--roosty-ombre);
}

.roosty-article::before,
.roosty-rituel::before {
	content: "";
	position: absolute;
	inset-block-start: -0.9rem;
	inset-inline-start: 42%;
	inline-size: 6rem;
	block-size: 1.6rem;
	background: color-mix(in srgb, var(--roosty-safran) 46%, var(--roosty-sable));
	clip-path: polygon(2% 8%, 100% 0, 95% 92%, 0 100%);
	transform: rotate(var(--roosty-card-tilt));
	opacity: var(--roosty-decor-opacity);
}

[class*="roosty-bloc--actualite-"] { border-inline-start: 0.4rem solid var(--roosty-cannelle); }
[class*="roosty-bloc--projet-"] { border-block-start: 0.4rem solid var(--roosty-framboise); }
[class*="roosty-bloc--ressource-"] { border-inline-end: 0.4rem solid var(--roosty-safran); }
.roosty-rituel { border-color: color-mix(in srgb, var(--roosty-cannelle) 58%, var(--roosty-sable)); border-style: dashed; }

.roosty-article > .wp-block-image,
.roosty-article > .wp-block-media-text {
	transform: rotate(calc(var(--roosty-card-tilt) / -2));
}

/* Petits encadrés : chaque usage possède son autocollant et son ton. */
.roosty-bloc--contenu-conseil,
.roosty-bloc--contenu-information,
.roosty-bloc--contenu-question,
.roosty-bloc--contenu-defi,
.roosty-bloc--contenu-le-savais-tu,
.roosty-bloc--contenu-citation,
.roosty-bloc--contenu-chiffres-cles,
.roosty-bloc--materiel,
.roosty-bloc--note-familles,
.roosty-bloc--avertissement,
.roosty-bloc--fichier,
.roosty-bloc--audio {
	--roosty-sticker: var(--roosty-safran);
	--roosty-sticker-icon: url("assets/icons/idee.svg");
	position: relative;
	padding-inline-start: clamp(4.75rem, 9vw, 6rem) !important;
	border-radius: var(--roosty-playful-radius) !important;
	transform: rotate(calc(var(--roosty-card-tilt) / 3));
}

.roosty-bloc--contenu-conseil::before,
.roosty-bloc--contenu-information::before,
.roosty-bloc--contenu-question::before,
.roosty-bloc--contenu-defi::before,
.roosty-bloc--contenu-le-savais-tu::before,
.roosty-bloc--contenu-citation::before,
.roosty-bloc--contenu-chiffres-cles::before,
.roosty-bloc--materiel::before,
.roosty-bloc--note-familles::before,
.roosty-bloc--avertissement::before,
.roosty-bloc--fichier::before,
.roosty-bloc--audio::before {
	content: "";
	position: absolute;
	inset-inline-start: 1.1rem;
	inset-block-start: 1.2rem;
	inline-size: 3.15rem;
	aspect-ratio: 1;
	border-radius: 43% 57% 52% 48% / 54% 45% 55% 46%;
	background-color: color-mix(in srgb, var(--roosty-sticker) 36%, var(--roosty-papier));
	background-image: var(--roosty-sticker-icon);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 2rem;
	transform: rotate(calc(var(--roosty-card-tilt) * -2));
}

.roosty-bloc--contenu-information { --roosty-sticker: var(--roosty-cannelle); --roosty-sticker-icon: url("assets/icons/info.svg"); }
.roosty-bloc--contenu-question { --roosty-sticker: var(--roosty-framboise); --roosty-sticker-icon: url("assets/icons/question.svg"); }
.roosty-bloc--contenu-defi { --roosty-sticker: var(--roosty-safran); --roosty-sticker-icon: url("assets/icons/jouer.svg"); }
.roosty-bloc--contenu-le-savais-tu { --roosty-sticker: var(--roosty-safran); --roosty-sticker-icon: url("assets/icons/idee.svg"); }
.roosty-bloc--contenu-citation { --roosty-sticker: var(--roosty-framboise); --roosty-sticker-icon: url("assets/icons/oral.svg"); }
.roosty-bloc--contenu-chiffres-cles { --roosty-sticker: var(--roosty-cannelle); --roosty-sticker-icon: url("assets/icons/nombres.svg"); }
.roosty-bloc--materiel { --roosty-sticker: var(--roosty-safran); --roosty-sticker-icon: url("assets/icons/outils.svg"); }
.roosty-bloc--note-familles { --roosty-sticker: var(--roosty-framboise); --roosty-sticker-icon: url("assets/icons/famille.svg"); }
.roosty-bloc--avertissement { --roosty-sticker: var(--roosty-cannelle); --roosty-sticker-icon: url("assets/icons/alerte.svg"); }
.roosty-bloc--fichier { --roosty-sticker: var(--roosty-cannelle); --roosty-sticker-icon: url("assets/icons/document.svg"); }
.roosty-bloc--audio { --roosty-sticker: var(--roosty-framboise); --roosty-sticker-icon: url("assets/icons/audio.svg"); }

.roosty-bloc--contenu-chiffres-cles .wp-block-column {
	padding: 1rem;
	border-radius: var(--roosty-playful-radius);
	background: color-mix(in srgb, var(--roosty-safran) 16%, var(--roosty-papier));
	text-align: center;
}

.roosty-bloc--faq .wp-block-details {
	padding: 0.85rem 1rem;
	border: 1px solid var(--roosty-sable);
	border-radius: var(--roosty-playful-radius);
	background: var(--roosty-blanc);
	box-shadow: 0 0.2rem 0.7rem rgba(83, 33, 5, 0.055);
}

.roosty-bloc--faq .wp-block-details:nth-of-type(even) {
	transform: translateX(min(1rem, 2vw));
}

.roosty-bloc--faq summary {
	min-block-size: var(--roosty-cible);
	padding-block: 0.55rem;
	font-weight: 700;
	cursor: pointer;
}

.roosty-composition--chronologie .roosty-composition__frise > .wp-block-column {
	position: relative;
	padding: 1rem;
}

.roosty-composition--chronologie .roosty-composition__frise > .wp-block-column::after {
	content: "";
	position: absolute;
	inset-inline-end: -0.55rem;
	inset-block-start: 1.4rem;
	inline-size: 1rem;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--roosty-cannelle);
}

.roosty-composition--chronologie .roosty-composition__frise > .wp-block-column:last-child::after {
	display: none;
}

.roosty-etapes > li {
	border-radius: var(--roosty-playful-radius);
	background: color-mix(in srgb, var(--roosty-sable) 22%, var(--roosty-papier));
	box-shadow: 0 0.2rem 0.65rem rgba(83, 33, 5, 0.05);
}

.roosty-bloc--sommaire,
.roosty-bloc--informations-pratiques,
.roosty-bloc--date-a-retenir,
.roosty-bloc--objectifs,
.roosty-bloc--observations,
.roosty-bloc--bilan-apprentissages,
.roosty-bloc--avant-apres {
	position: relative;
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px dashed color-mix(in srgb, var(--roosty-cannelle) 45%, var(--roosty-sable));
	border-radius: var(--roosty-playful-radius);
	background: color-mix(in srgb, var(--roosty-sable) 22%, var(--roosty-papier));
}

.roosty-bloc--ressources-liees .roosty-carte,
.roosty-bloc--sous-rubriques .roosty-carte,
.roosty-bloc--actualites-liees .roosty-carte,
.roosty-bloc--dernieres-actualites .roosty-carte,
.roosty-bloc--ressources-matiere .roosty-carte {
	border-radius: var(--roosty-playful-radius);
	transform: rotate(calc(var(--roosty-card-tilt) / 2));
}

.roosty-bloc--ressources-liees .roosty-carte:nth-child(even),
.roosty-bloc--sous-rubriques .roosty-carte:nth-child(even) {
	transform: rotate(calc(var(--roosty-card-tilt) / -2)) translateY(var(--roosty-card-lift));
}

@media (max-width: 781px) {
	.roosty-archive-generique::before,
	.roosty-ecran-recherche::before,
	.roosty-principal--page::before,
	.roosty-principal--article::before,
	.roosty-principal--actualite::before,
	.roosty-principal--rituel::before,
	.roosty-principal--projet::before,
	.roosty-principal--ressource::before {
		opacity: calc(var(--roosty-decor-opacity) * 0.28);
	}

	.roosty-archive-generique > :where(.wp-block-query-title, h1, .roosty-chapeau, .wp-block-term-description),
	.roosty-ecran-recherche > :where(.wp-block-query-title, h1),
	.roosty-principal:is(.roosty-principal--article, .roosty-principal--actualite, .roosty-principal--rituel, .roosty-principal--projet, .roosty-principal--ressource) > :where(.wp-block-post-title, .roosty-chapeau, .roosty-meta) {
		max-inline-size: 100%;
	}

	.roosty-page-intro {
		min-block-size: 0;
		background-image: linear-gradient(180deg, var(--roosty-papier), color-mix(in srgb, var(--roosty-sable) 34%, var(--roosty-papier))) !important;
		background-size: auto !important;
	}

	.roosty-page-intro > * {
		max-inline-size: 100%;
		margin-inline-start: auto;
	}

	.roosty-composition__agenda > .wp-block-column,
	.roosty-composition__domaines > .wp-block-column,
	.roosty-composition__colonnes > .wp-block-column,
	.roosty-archive-generique .roosty-carte-article,
	.roosty-ecran-recherche .roosty-carte-article,
	.roosty-archive-rituels .roosty-carte-article {
		transform: none;
	}

	.roosty-composition--chronologie .roosty-composition__frise > .wp-block-column::after {
		display: none;
	}
}

@media (max-width: 520px) {
	.roosty-bloc--contenu-conseil,
	.roosty-bloc--contenu-information,
	.roosty-bloc--contenu-question,
	.roosty-bloc--contenu-defi,
	.roosty-bloc--contenu-le-savais-tu,
	.roosty-bloc--contenu-citation,
	.roosty-bloc--contenu-chiffres-cles,
	.roosty-bloc--materiel,
	.roosty-bloc--note-familles,
	.roosty-bloc--avertissement,
	.roosty-bloc--fichier,
	.roosty-bloc--audio {
		padding-inline-start: 1.25rem !important;
		padding-block-start: 5rem !important;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.roosty-archive-generique .roosty-carte-article,
	.roosty-ecran-recherche .roosty-carte-article,
	.roosty-archive-rituels .roosty-carte-article,
	.roosty-principal--page > .wp-block-post-featured-image,
	.roosty-principal--article > .wp-block-post-featured-image,
	.roosty-principal--projet > .wp-block-post-featured-image,
	.roosty-composition__agenda > .wp-block-column,
	.roosty-composition__domaines > .wp-block-column,
	.roosty-composition__colonnes > .wp-block-column,
	.roosty-composition__galerie .wp-block-image,
	.roosty-galerie .wp-block-image,
	.roosty-bloc--deux-polaroids .wp-block-image,
	.roosty-bloc--contenu-conseil,
	.roosty-bloc--contenu-information,
	.roosty-bloc--contenu-question,
	.roosty-bloc--contenu-defi,
	.roosty-bloc--contenu-le-savais-tu,
	.roosty-bloc--contenu-citation,
	.roosty-bloc--contenu-chiffres-cles,
	.roosty-bloc--materiel,
	.roosty-bloc--note-familles,
	.roosty-bloc--avertissement,
	.roosty-bloc--fichier,
	.roosty-bloc--audio {
		transform: none;
	}
}

@media print {
	.wp-site-blocks,
	.roosty-article,
	.roosty-rituel,
	.roosty-principal--rituel {
		background: #fff;
	}

	.roosty-archive-generique::before,
	.roosty-ecran-recherche::before,
	.roosty-principal--page::before,
	.roosty-principal--article::before,
	.roosty-principal--rituel::before,
	.roosty-principal--projet::before,
	.roosty-principal--ressource::before,
	.roosty-page-intro::after,
	.roosty-composition::before,
	.roosty-article::before,
	.roosty-rituel::before {
		display: none;
	}
}
