/* Accueil immersif (v0.35.0, includes/pages-accueil.php) : mise en page des sections. Chaque règle est bornée
   à un style de groupe propre (is-style-cnd-accueil-…) : aucune autre page n'est touchée. */

/* ---------- Tout pour votre chien : « Par où commencer ? » (H3) sous les cartes ---------- */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-univers > h3.wp-block-heading {
	margin-block-start: var(--s-7);
	font-size: var(--t-h3);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-univers > h3.wp-block-heading + .cnd {
	margin-block-start: var(--s-4);
}

/* ---------- Panneaux teintés de leur univers : Éducation et Formations ----------
   Fond --brand-tint de la section (data-branch posé par cnd-branche-<univers>), rayon 20 px. */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) :is(.is-style-cnd-accueil-education, .is-style-cnd-accueil-formations) {
	padding: 48px;
	border-radius: 20px;
	background: var(--brand-tint);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) :is(.is-style-cnd-accueil-education, .is-style-cnd-accueil-formations) > .wp-block-columns {
	align-items: center !important; /* v0.38.0 : le cœur force « normal !important » */
	gap: 48px;
	margin: 0;
}

/* ---------- L'éducation canine : photo à fond perdu à gauche, texte, 4 points et bilan à droite ----------
   v0.35.2 (recette du 06/11) : la photo touche les bords du panneau dans sa colonne, sans marge ; le panneau
   n'a plus de marge intérieure (la colonne de texte porte la sienne) et arrondit seul ses angles extérieurs
   (overflow: hidden). Photo en object-fit: cover sur toute la hauteur du panneau. Plus de surtitre. */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education {
	padding: 0;
	overflow: hidden;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns {
	align-items: stretch;
	gap: 0;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:first-child {
	position: relative;
	min-height: 480px;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:first-child > .wp-block-image {
	position: absolute;
	inset: 0;
	margin: 0;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:first-child > .wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:last-child {
	align-self: center;
	padding: 48px;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:last-child > .wp-block-heading:first-child {
	margin-top: 0;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages + .wp-block-list {
	margin-block-start: var(--s-5);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .wp-block-list.is-style-cnd-liens-pilules > li > a {
	background: var(--surface);
}

/* 4 points clés : liste lisible d'un coup d'œil (coche à gauche, intitulé, une phrase), sans cartes, sur le
   panneau teinté. Bloc cnd/advantages inchangé ailleurs. */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--s-5) var(--s-6);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages .cnd-advantage {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	column-gap: var(--s-3);
	align-items: start;
	/* Point plus court que son voisin de ligne : la place en trop reste en bas, pas entre titre et texte. */
	align-content: start;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages .cnd-advantage__check {
	grid-row: 1 / span 2;
	margin: 0;
	background: var(--brand);
	border-color: var(--brand);
	color: var(--brand-on);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages .cnd-advantage__title {
	margin: 2px 0 4px;
	font-size: var(--t-h4);
	line-height: 1.3;
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages .cnd-advantage__text {
	font-size: var(--t-small);
}

/* ---------- Formations : texte, Qualiopi et catalogue à gauche ; 3 cartes compactes à droite ---------- */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-formations > .wp-block-columns > .wp-block-column:first-child > .wp-block-heading {
	margin-top: 0;
}

/* ---------- Sport : une carte de plus à l'écran en bureau (v0.35.2, recette du 06/11) ----------
   4,3 cartes au lieu de 3,3 dès 1200 px ; tablette (2,2) et mobile (85 %) inchangés. */
@media (min-width: 1200px) {
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-sport .cnd.cnd-rail-cards .cnd-carousel {
		--cnd-per-view: 4.3;
	}
}

/* ---------- Sports, centres : boutons sous les cartes ---------- */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) :is(.is-style-cnd-accueil-sport, .is-style-cnd-accueil-centres) > .wp-block-buttons {
	margin-block-start: var(--s-6);
}

/* ---------- Conseils : catégories en étiquettes entre le titre et les articles ----------
   v0.35.2 (recette du 06/11) : étiquettes à 24 px du titre (--s-5, l'écart du site entre un titre et le bloc
   qui le suit) ; « Tous nos articles » centré sous les cartes. */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-conseils > .wp-block-heading + .wp-block-list.is-style-cnd-liens-pilules {
	margin-block-start: var(--s-5);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-conseils > .wp-block-list.is-style-cnd-liens-pilules + .cnd {
	margin-block-start: var(--s-5);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-conseils > p:last-child {
	max-width: none;
	text-align: center;
}

@media (max-width: 781px) {
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-formations {
		padding: 24px 20px;
	}
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-formations > .wp-block-columns {
		gap: 24px;
	}
	/* Éducation : la photo garde toute la largeur du panneau, au-dessus du texte, sans marge. */
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:first-child {
		min-height: 0;
		aspect-ratio: 4 / 3;
		max-height: 360px;
		width: 100%;
	}
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education > .wp-block-columns > .wp-block-column:last-child {
		padding: 24px 20px;
	}
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .cnd.cnd-advantages {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--s-4);
	}
		:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .wp-block-buttons > .wp-block-button {
		flex: 1 1 100%;
	}
	:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-education .wp-block-buttons > .wp-block-button > .wp-block-button__link {
		width: 100%;
	}
}

/* ---------- Bande finale sur photo ----------
   Voile du bloc partagé (--overlay, 55 %) : 3,7:1 au pire pour du blanc sur un pixel blanc de la photo. Ici 66 %,
   comme le hero (5,1:1), et texte en blanc plein (le blanc à 88 % du bloc tomberait à 4,4:1). */
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-cta .cnd.cnd-cta-band--photo .cnd-cta-band__overlay {
	background: rgba(29, 35, 39, .66);
}
:is(body.cnd-site .cnd-site-main, .editor-styles-wrapper) .is-style-cnd-accueil-cta .cnd.cnd-cta-band--photo .cnd-cta-band__text {
	color: var(--on-image);
}
