.wp-block-group.grave-controle-identity {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--50);
}

/* Core lays these groups out as flow and gives every child a block margin, which would fight
   the flex and grid tracks below. Its `.wp-container-… > * + *` rule ties on specificity and
   is printed last, so the reset needs the extra class to win. */
.wp-block-group.grave-controle-identity > *,
.wp-block-group.grave-controle-facts > *,
.wp-block-group.grave-controle-fact > *,
/* Existing control content predates the shared pattern attributes and still needs these selectors. */
.wp-block-group.grave-controle-brief__head > *,
.wp-block-group.grave-controle-fact__head > * {
	margin: 0;
}

.grave-controle-identity > * {
	flex: 1 1 22rem;
	padding: var(--wp--preset--spacing--50);
	border-radius: var(--wp--custom--radius--md);
}

.grave-controle-brief {
	background-color: var(--wp--preset--color--primary-highlight);
	color: var(--wp--preset--color--fg-dark);
}

.grave-controle-brief__head,
.grave-controle-fact__head {
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.grave-controle-brief__head > .wp-block-grave-icon,
.grave-controle-fact__head > .wp-block-grave-icon {
	--grave-icon-width: 1.25em;

	flex: none;
	color: var(--wp--preset--color--fg-dark);
}

.grave-controle-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	background-color: var(--wp--preset--color--surface);
}

.grave-controle-fact {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	align-content: start;
}

.grave-controle-fact__label {
	color: var(--wp--preset--color--fg-dark);
	font-weight: 600;
}

.grave-controle-fact__value {
	color: var(--wp--preset--color--fg-muted);
}

.grave-hero-controle__body {
	max-width: var(--wp--style--global--content-size);
}

.grave-controle-grid-section {
	container-type: inline-size;
}

.grave-controle-grid.wp-block-post-template {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--40);
}

.grave-controle-grid > .wp-block-post {
	margin: 0;
}

/* Container conditions cannot resolve theme custom properties, so these structural thresholds
   stay font-relative while every visual value continues to come from theme.json. */
@container (width > 48rem) {
	.grave-controle-grid.wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@container (width > 72rem) {
	.grave-controle-grid.wp-block-post-template {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.grave-controle-grid--media.wp-block-post-template {
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
}

.wp-block-group.grave-controle-workflow-step-head > * {
	margin: 0;
}

p.grave-controle-workflow-step-number {
	display: grid;
	flex: 0 0 2em;
	width: 2em;
	aspect-ratio: 1;
	padding: 0;
	place-items: center;
}

/* A domaine without child pages lists its contrôles here instead of the cards. */
.wp-block-group.grave-controle-catalogue {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.wp-block-group.grave-controle-catalogue > * {
	margin: 0;
}

.grave-controle-catalogue__intro {
	justify-self: center;
	max-width: var(--wp--style--global--content-size);
}

.grave-controle-approach {
	container-type: inline-size;
}

.wp-block-group.grave-controle-approach__intro > *,
.wp-block-group.grave-controle-approach__steps > * {
	margin: 0;
}

.grave-controle-approach__intro {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	max-width: var(--wp--style--global--content-size);
}

.grave-controle-approach__steps {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--40);
	align-items: stretch;
}

/* Container conditions cannot resolve theme custom properties, so this threshold stays
   font-relative while every visual value continues to come from theme.json. */
@container (width > 48rem) {
	.grave-controle-approach__steps {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}