.realisation-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	height: 100%;
	min-height: 401px;
	overflow: hidden;
	border: 1px solid #d8d1c5;
	border-radius: 9px;
	background: #fcf9f2;
	color: #595a55;
	text-decoration: none;
	transition: border-color 240ms ease, box-shadow 240ms ease;
}

.realisation-card:is(:hover, :focus-visible) {
	border-color: #a9a293;
	box-shadow: 0 14px 30px rgb(47 49 42 / 14%);
}

.realisation-card:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent, #a91b13);
	outline-offset: 3px;
}

.realisation-card__media {
	position: relative;
	flex: 0 0 225px;
	overflow: hidden;
	background: #e6e0d5;
}

.realisation-card__media--placeholder::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: #777b70;
	font-size: 0.875rem;
	content: "Image de la réalisation";
}

.realisation-card__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 500ms ease;
}

.realisation-card:is(:hover, :focus-visible) .realisation-card__image {
	transform: scale(1.035);
}

.realisation-card__media-badges {
	position: absolute;
	right: 11px;
	bottom: 8px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
}

.realisation-card__media-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 14px;
	background: rgb(255 255 255 / 92%);
	color: #51443c;
	font-family: var(--wp--preset--font-family--condensed, "Barlow Condensed", Arial, sans-serif);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1;
}

.realisation-card__media-badge strong {
	font-family: Arial, sans-serif;
	font-size: 0.6875rem;
	font-weight: 700;
}

.realisation-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	box-sizing: border-box;
	padding: 24px;
}

.realisation-card__category {
	display: inline-flex;
	padding: 6px 16px;
	border-radius: 15px;
	background: rgb(113 87 71 / 94%);
	color: #fff9ee;
	font-family: var(--wp--preset--font-family--condensed, "Barlow Condensed", Arial, sans-serif);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1;
	text-transform: uppercase;
}

.realisation-card__title-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
}

.realisation-card__title {
	min-width: 0;
	margin: 0;
	color: #424242;
	font-family: var(--wp--preset--font-family--heading, "Lora", Georgia, serif);
	font-size: clamp(1.25rem, 1.25vw, 1.5rem);
	font-weight: 700;
	line-height: 1.2;
}

.realisation-card__arrow {
	display: grid;
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	place-items: center;
	border: 1px solid #86887e;
	border-radius: 50%;
	transition: border-color 220ms ease, background-color 220ms ease, transform 220ms ease;
}

.realisation-card__arrow span {
	display: block;
	width: 16px;
	height: 16px;
	background: url("../icons/chevron-right.svg") center / 16px 16px no-repeat;
}

.realisation-card:is(:hover, :focus-visible) .realisation-card__arrow {
	border-color: #a91b13;
	background: #a91b13;
	transform: translateX(2px);
}

.realisation-card:is(:hover, :focus-visible) .realisation-card__arrow span {
	filter: brightness(0) invert(1);
}

.realisation-card__summary {
	margin: 0;
	color: #595a55;
	font-size: 0.9375rem;
	line-height: 1.3;
}

@media (max-width: 47.999rem) {
	.realisation-card__media {
		flex-basis: 210px;
	}

	.realisation-card__body {
		padding: 20px;
	}
}