/*
 * Accueil, bloc « Menu » : composition fixe des photos de chaque menu (20/10/2026).
 * Les photos n'ont pas toutes le même format (portrait, paysage, panoramique) : chacune est recadrée dans un cadre de taille fixe
 * (object-fit: cover), si bien que la composition est identique pour chaque menu. Les tailles et positions suivent la largeur de la
 * colonne (unités cqw), et le bouton « Cliquer pour réserver » est un seul élément, hors des panneaux : il ne bouge plus.
 * Sélecteurs .img.img--N : plus prioritaires que les règles :first-child / :nth-child() du thème.
 * Repère : colonne de 644 px de large (écran ≥ 1680 px), 1 cqw = 6,44 px.
 */
@media only screen and (min-width: 992px) {
	.restaurant .container .content-right {
		container-type: inline-size;
	}
	/* Hauteur de la colonne = bas de la 3e photo : 62cqw (bouton) + 270px + 67.5cqw. Portée par un pseudo-élément, car les unités cqw
	   d'un élément se rapportent à son conteneur parent, pas à lui-même. */
	.restaurant .container .content-right::after {
		content: '';
		display: block;
		height: calc(129.5cqw + 270px);
	}
	.restaurant .container .content-right .content-right-panel .img {
		position: absolute;
		display: block;
		max-width: none;
		height: auto;
		margin: 0;
		aspect-ratio: 4 / 5;
		object-fit: cover;
		object-position: 50% 50%;
	}
	.restaurant .container .content-right .content-right-panel .img.img--1 {
		margin: 0;
		top: -23cqw;
		left: 20cqw;
		right: auto;
		width: 54cqw;
		z-index: 10;
	}
	.restaurant .container .content-right .content-right-panel .img.img--2 {
		margin: 0;
		/* Chevauche la 1re photo (bas : 44.5cqw) et la 3e (haut : 62cqw + 270px), au-dessus d'elles. La parallaxe du thème descend la
		   1re d'environ 33px et remonte celle-ci d'environ 37px (mesuré) : avec ces valeurs, environ 60px de chevauchement visible en haut
		   comme en bas. */
		top: calc(44.5cqw + 10px);
		height: calc(17.5cqw + 357px);
		aspect-ratio: auto;
		right: 0;
		left: auto;
		width: 46.5cqw;
		z-index: 12;
	}
	.restaurant .container .content-right .content-right-panel .img.img--3 {
		margin: 0;
		top: calc(62cqw + 270px);
		left: 12cqw; /* s'avance sous la photo du milieu (qui commence à 53.5cqw) : chevauchement net */
		right: auto;
		width: 54cqw;
		z-index: 5;
	}
	.restaurant .container .content-right .btn-circle--menu {
		position: absolute;
		top: 62cqw;
		/* 7cqw, mais jamais sur la 2e photo (qui commence à 53.5cqw) quand la colonne est étroite (écrans 992-1199 px) */
		left: max(-15px, min(7cqw, calc(53.5cqw - 205px)));
		margin: 0;
		transform: none;
		z-index: 100;
	}
}
/* Mobile et tablette : les photos ne sont pas affichées (comme avant), le bouton reste celui de la colonne de gauche. */
@media only screen and (max-width: 991px) {
	.restaurant .container .content-right .btn-circle--menu {
		display: none;
	}
}

/* Accueil, diaporama d'ouverture : chaque image est posée dans un cadre transparent de la hauteur de l'écran, et c'est ce cadre qui
   ouvre l'image en plein écran (app.js). Seule l'image reçoit le clic ; la zone noire en dessous le laisse passer (20/10/2026). */
.home .img-home .wrapper {
	pointer-events: none;
}
.home .img-home .wrapper .img {
	pointer-events: auto;
	cursor: zoom-in;
}
