/* Conseil d’administration (Figma node 927:9472) ------------------------------------ */

/* Introduction */

.council-intro {
	padding: 80px 0;
	background: #f8f8f7;
}

.council-intro__row {
	display: grid;
	grid-template-columns: minmax(0, 330px) minmax(0, 830px);
	justify-content: center;
	gap: 70px;
	width: min(1230px, 100% - 2 * var(--gutter-wide));
	margin-inline: auto;
}

.council-intro__title {
	padding-top: 6px;
	color: #0b1421;
	font-family: var(--font-serif);
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;
}

.council-intro__text {
	color: #303740;
	font-size: 16px;
	line-height: 28px;
}

.council-intro__lead {
	margin-top: 20px;
	color: #0b1421;
	font-size: 16px;
	font-weight: 600;
	line-height: 26px;
}

/* Groups: white and light grey in turn (council-group--grey set in the template). */

.council-group {
	padding: 52px 0 72px;
	background: var(--white);
}

.council-group--grey {
	background: #f8f8f7;
}

.council-group--small {
	padding: 80px 0 88px;
}

.council-group__inner {
	width: min(1180px, 100% - 2 * var(--gutter-wide));
	margin-inline: auto;
}

.council-group__title {
	color: #0b1421;
	font-family: var(--font-serif);
	font-size: 35px;
	font-weight: 700;
	line-height: 48px;
}

.council-group__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 363px));
	gap: 45px;
	margin-top: 45px;
}

.council-group--small .council-group__list {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 45px 17.5px;
}

.council-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid #e3e5e8;
	border-radius: 18px;
	background: var(--white);
	box-shadow: 0 11px 26px rgba(0, 0, 0, 0.06);
}

.council-card__photo {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 363 / 359;
	object-fit: cover;
	object-position: center 20%;
}

.council-card__photo--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f1f3f5;
	color: #87909a;
	font-family: var(--font-serif);
	font-size: 64px;
}

.council-card__copy {
	display: flex;
	flex-direction: column;
	gap: 17px;
	min-height: 116px;
	padding: 20px 20px 17px;
}

.council-card__name {
	color: #0b1421;
	font-size: 16.5px;
	font-weight: 700;
	line-height: 21px;
}

.council-card__role {
	color: #7a828c;
	font-size: 14.75px;
	line-height: 17.5px;
}

.council-group--small .council-card {
	border-radius: 14px;
	box-shadow: 0 8.6px 20px rgba(0, 0, 0, 0.06);
}

.council-group--small .council-card__photo {
	aspect-ratio: 282 / 323;
}

.council-group--small .council-card__copy {
	gap: 13.6px;
	min-height: 90px;
	padding: 16px 16px 13px;
}

.council-group--small .council-card__name {
	font-size: 14.75px;
	line-height: 16.5px;
}

.council-group--small .council-card__role {
	font-size: 14.75px;
	line-height: 17px;
}

/* Responsive ------------------------------------------------------------ */

@media (max-width: 1279px) {
	.council-intro__row {
		grid-template-columns: minmax(0, 280px) minmax(0, 1fr);
		gap: 40px;
	}

	.council-group__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 24px;
	}

	.council-group--small .council-group__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 32px 16px;
	}
}

@media (max-width: 1023px) {
	.council-intro__row {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.council-group__list,
	.council-group--small .council-group__list {
		gap: 24px 16px;
	}

	.council-card__copy,
	.council-group--small .council-card__copy {
		gap: 8px;
		min-height: 0;
		padding: 14px;
	}

	.council-card__name,
	.council-card__role,
	.council-group--small .council-card__name,
	.council-group--small .council-card__role {
		font-size: 14px;
		line-height: 19px;
	}
}

@media (max-width: 767px) {
	.council-intro {
		padding: 48px 0;
	}

	.council-intro__title {
		font-size: 26px;
		line-height: 33px;
	}

	.council-group,
	.council-group--small {
		padding: 40px 0 48px;
	}

	.council-group__title {
		font-size: 28px;
		line-height: 36px;
	}

	.council-group__list {
		margin-top: 24px;
	}

	/* Two smaller cards per row; one large card per row for the main roles. */
	.council-group:not(.council-group--small) .council-group__list {
		grid-template-columns: minmax(0, 1fr);
		max-width: 340px;
	}

	.council-group--small .council-group__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px 12px;
	}

	.council-group--small .council-card__copy {
		gap: 6px;
		min-height: 0;
		padding: 12px;
	}

	.council-group--small .council-card__name,
	.council-group--small .council-card__role {
		font-size: 13px;
		line-height: 17px;
	}
}