/* Zone « À la une » ([vitrine_une]) : cartes carrées, trois visibles.
   Au-delà de trois produits : défilement et flèches. */
.vtr-une {
	position: relative;
	margin: 0;
}
.vtr-une .vtr-une__grille.vtr-grille {
	display: grid;
	grid-template-columns: none;
	grid-template-rows: none;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 48px) / 3);
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}
.vtr-une .vtr-une__grille::-webkit-scrollbar {
	display: none;
}
.vtr-une[data-nb="1"] .vtr-une__grille.vtr-grille {
	grid-auto-columns: 100%;
}
.vtr-une[data-nb="2"] .vtr-une__grille.vtr-grille {
	grid-auto-columns: calc((100% - 24px) / 2);
}
.vtr-une .vtr-une__grille > li {
	scroll-snap-align: start;
}
.vtr-une .vtr-une__grille > li::marker {
	content: none;
}
.vtr-une .vtr-carte__titre {
	font-size: clamp(17px, 1.5vw, 22px);
	line-height: 1.25;
}

/* Flèches posées sur les images, à mi-hauteur. */
.vtr-une__fleche {
	position: absolute;
	top: calc((100% - 110px) / 2);
	z-index: 5;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--wp--preset--color--filet, #e6e6e1);
	border-radius: 50%;
	background: #fff;
	color: var(--wp--preset--color--encre, #14171f);
	cursor: pointer;
	transform: translateY(-50%);
	transition: opacity 0.25s ease, border-color 0.25s ease;
}
.vtr-une__fleche:hover {
	border-color: currentColor;
}
.vtr-une__fleche:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}
.vtr-une__fleche.is-prec {
	left: 16px;
}
.vtr-une__fleche.is-suiv {
	right: 16px;
}
.vtr-une__fleche[disabled] {
	/* Bout de course : flèche estompée mais toujours là, pour qu'un clic de trop
	   ne tombe pas sur le produit en dessous. */
	opacity: 0.35;
	cursor: default;
}
.vtr-une__fleche[disabled]:hover {
	border-color: var(--wp--preset--color--filet, #e6e6e1);
}

@media (max-width: 1100px) {
	.vtr-une .vtr-une__grille.vtr-grille {
		grid-auto-columns: calc((100% - 24px) / 2);
	}
}
@media (max-width: 860px) {
	.vtr-une .vtr-une__grille.vtr-grille,
	.vtr-une[data-nb] .vtr-une__grille.vtr-grille {
		grid-auto-columns: 85%;
		gap: 12px;
	}
	.vtr-une__fleche {
		display: none;
	}
}

/* Composition « À la une » (classe vtr-une-zone sur son groupe) : fond blanc comme le
   reste de la page, la sélection se démarque par son format, pas par un aplat de couleur. */
.vtr-une-zone {
	padding: clamp(8px, 2vw, 24px) 0;
	background: transparent;
}
.vtr-une-zone > :first-child {
	margin-top: 0;
}
.vtr-une-zone h2 {
	margin: 4px 0 8px;
}
.vtr-une-zone .vtr-une {
	margin-top: clamp(20px, 2.5vw, 32px);
}

/* ---------- Slider « À la une » : un produit par diapositive ---------- */
.vtr-une-sl { --sl-encre: var(--wp--preset--color--encre, #14171f); --sl-gris: var(--wp--preset--color--gris, #5a5f55); --sl-filet: var(--wp--preset--color--filet, #e6e6e1); --sl-olive: var(--wp--preset--color--olive, #4b5636); position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 8px; }
.vtr-une-sl__nav { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: -64px; }
.vtr-une-sl__compteur { font-size: 14px; letter-spacing: .1em; font-variant-numeric: tabular-nums; margin-right: 6px; }
.vtr-une-sl__fleche { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--sl-encre); background: transparent; color: var(--sl-encre); cursor: pointer; padding: 0; border-radius: 0; transition: background .2s, color .2s; }
.vtr-une-sl__fleche.is-suiv, .vtr-une-sl__fleche:hover { background: var(--sl-encre); color: #fff; }
.vtr-une-sl__fleche.is-suiv:hover { background: var(--sl-olive); border-color: var(--sl-olive); }
.vtr-une-sl__piste { order: 1; }
.vtr-une-sl__onglets { order: 2; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 24px; }
.vtr-une-sl__diapo { display: flex; gap: 64px; align-items: stretch; }
.vtr-une-sl__diapo[hidden] { display: none; }
.vtr-une-sl__diapo.is-active { animation: vtrUneFondu .45s ease; }
@keyframes vtrUneFondu { from { opacity: .3; } }
.vtr-une-sl__photo { position: relative; flex: 0 0 57%; aspect-ratio: 3 / 2; max-height: 560px; overflow: hidden; background: var(--wp--preset--color--beige, #f3f1ec); display: block; }
.vtr-une-sl .vtr-une-sl__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .6s ease; }
.vtr-une-sl .vtr-une-sl__img.is-detoure { inset: 8%; width: 84%; height: 84%; object-fit: contain; mix-blend-mode: multiply; }
.vtr-une-sl__photo:hover .vtr-une-sl__img { transform: scale(1.03); }
.vtr-une-sl__texte { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; }
.vtr-une-sl__texte > * { margin: 0; }
.vtr-une-sl__marque { font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--sl-gris); }
.vtr-une-sl .vtr-une-sl__nom { font-size: clamp(32px, 3.4vw, 46px); line-height: 1.05; font-weight: 200; }
.vtr-une-sl__nom a { color: inherit; text-decoration: none; }
.vtr-une-sl__type { font-size: 16px; line-height: 1.6; color: var(--sl-gris); }
.vtr-une-sl__prix { font-size: 24px; font-weight: 400; margin-top: 8px !important; }
.vtr-une-sl__prix del { font-size: 16px; opacity: .55; margin-right: 6px; }
.vtr-une-sl__prix ins { text-decoration: none; }
.vtr-une-sl__htva { font-size: 13px; font-weight: 300; color: var(--sl-gris); }
.vtr-une-sl__delai { font-size: 14px; color: var(--sl-olive); }
.vtr-une-sl .vtr-une-sl__bouton { margin-top: 14px; background: var(--sl-encre); color: #fff; text-decoration: none; font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: 18px 30px; transition: background .2s; }
.vtr-une-sl .vtr-une-sl__bouton:hover { background: var(--sl-olive); color: #fff; }
.vtr-une-sl__onglet { all: unset; cursor: pointer; display: flex; flex-direction: column; gap: 10px; font-size: 13px; letter-spacing: .04em; color: var(--sl-gris); }
.vtr-une-sl__barre { display: block; height: 2px; background: var(--sl-filet); transition: background .3s; }
.vtr-une-sl__onglet.is-active { color: var(--sl-encre); }
.vtr-une-sl__onglet.is-active .vtr-une-sl__barre { background: var(--sl-encre); }
.vtr-une-sl__onglet:focus-visible { outline: 1px solid var(--sl-encre); outline-offset: 4px; }
@media (max-width: 900px) {
	/* Téléphone : flèches sur leur propre ligne, séparées du bouton produit et en contour
	   (seul le bouton produit est plein, pour ne pas confondre l'action et la navigation). */
	.vtr-une-sl__nav { position: static; order: 3; justify-content: space-between; margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--sl-filet); }
	.vtr-une-sl__compteur { margin-right: auto; }
	.vtr-une-sl__fleche { width: 44px; height: 44px; }
	.vtr-une-sl__fleche.is-suiv { background: transparent; color: var(--sl-encre); }
	.vtr-une-sl .vtr-une-sl__bouton { align-self: stretch; text-align: center; }
	.vtr-une-sl__diapo { flex-direction: column; gap: 24px; }
	.vtr-une-sl__photo { flex-basis: auto; width: 100%; }
	.vtr-une-sl__onglets { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.vtr-une-sl__diapo.is-active { animation: none; }
	.vtr-une-sl__img, .vtr-une-sl__barre { transition: none !important; }
}
