.apercuVisionneuse
{
	overflow: hidden;
	margin-bottom: 1.5rem;
}
.apercuContenu
{
	display: flex;
	align-items: start;
	transition: transform .3s ease-in-out;
}
.apercuContenu .grille
{
	flex-grow: 1;
	flex-shrink: 1;
	min-width: 100%;
}
.apercuContenu .grille > div
{
	grid-column: span 2;
}
.apercuContenu img
{
	width: 100%;
	height: auto;
	border-radius: var(--border-radius);
}
.apercuContenu > div
{
	margin: 0 1rem;
}
.apercuContenu > div:first-child
{
	margin-left: 0;
}
.apercuContenu > div:last-child
{
	margin-right: 0;
}
@media (min-width: 600px) and (max-width: 1365px)
{
	.apercuContenu h3 { margin-bottom: 1.3rem; }
}
@media (min-width: 1366px)
{
	.apercuContenu h3 { margin-bottom: 2rem; }
}
.apercuContenu p
{
	margin-bottom: 0;
}
.apercuNav,
.apercuNav div
{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.apercuNav p
{
	font-weight: 800;
	color:var(--couleur-habillage);
	font-size: var(--corps-mobile-titre4);
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum";
	text-align: center;
	display: inline-block;
}
@media (min-width: 600px) and (max-width: 1365px)
{
	.apercuNav p { font-size: var(--corps-tablette-titre4); }
}
@media (min-width: 1366px)
{
	.apercuNav p { font-size: var(--corps-desktop-titre4); }
}
.apercuNav button
{
	border-radius: 3rem;
	padding: .1rem;
	overflow: hidden;
}
.apercuNav button div
{
	border: var(--bordure-pleine-primaire);
	border-radius: 3rem;
	padding: .8rem;
	width: 2.915rem;
	height: 2.915rem;
	display: flex;
	align-items: center; 
	justify-content: center; 
	transition: transform .3s ease-out, background-color .1s ease;
}
.apercuNav button img,
.apercuNav button svg
{
	width: 100%;
	height: auto; 
	object-fit: cover;  /* l'image remplit même si elle dépasse */
	display: block; /* enlever l’espace en dessous causé par les images inline */
}
@media (min-width: 1366px)
{
	.apercuNav button div
	{
		width: 3.51rem;
		height: 3.51rem;
	}
	.apercuNav button svg
	{
		width: 80%;
	}
}
.apercuBtnPrev div
{
	transform: scaleX(-1);
}
.apercuBtnNext div
{
	transform: scale(1);
}
.apercuNav button:first-child
{
	margin-right: .5rem;
}
.apercuNav button.inactif div
{
	opacity: .2;
	cursor: not-allowed;
}
.apercuNav button svg
{
	fill: var(--couleur-primaire);
	transition: fill .1s ease;
}
@media (hover: hover)
{
	.apercuNav button:not(.inactif):hover div
	{
		background-color: var(--couleur-primaire);
	}
	.apercuNav button:not(.inactif):hover svg
	{
		fill: var(--couleur-fond);
	}
}
.apercuBtnPrev:not(.inactif):active div
{
	transform: scaleX(-1) scale(.85);
	transition: none;
} 
.apercuBtnNext:not(.inactif):active div
{
	transform: scale(.85);
	transition: none;
} 
