/* ==========================================================================
   Armorik Product SlideUp — module Divi
   Carte produit : bouteille + titre, image de fond révélée au survol.
   ========================================================================== */

.apsu-card {
	--apsu-duration: 650ms;
	--apsu-ease: cubic-bezier(0.33, 1, 0.68, 1); /* easeOutCubic : doux et naturel */

	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	text-decoration: none;
	cursor: pointer;
	border-radius: 0;
	isolation: isolate;
	outline: none;
	/* Hauteur fixe optionnelle (option du module) : toutes les cartes
	   d'une rangée partagent la même hauteur, titres alignés. */
	height: var(--apsu-card-h, auto);
}

/* --------------------------------------------------------------------------
   Image d'arrière-plan (chargée au premier survol par le JS)
   -------------------------------------------------------------------------- */

.apsu-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	will-change: transform, opacity;
	pointer-events: none;
}

/* Voile de lisibilité, couleur pilotée par les options du module */
.apsu-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--apsu-overlay, rgba(20, 20, 30, 0.18));
	opacity: 0;
	transition: opacity var(--apsu-duration) var(--apsu-ease);
}

/* ---- Variante « fondu » -------------------------------------------------- */

.apsu-anim-fade .apsu-bg {
	transition: opacity var(--apsu-duration) var(--apsu-ease);
}

/* ---- Variante « slide depuis le bas » ------------------------------------ */

.apsu-anim-slide .apsu-bg {
	transform: translateY(100%);
	transition:
		transform var(--apsu-duration) var(--apsu-ease),
		opacity calc(var(--apsu-duration) * 0.6) linear;
}

/* ---- États révélés : uniquement quand l'image est chargée ---------------- */

.apsu-card.apsu-is-loaded:hover .apsu-bg,
.apsu-card.apsu-is-loaded.apsu-is-active .apsu-bg,
.apsu-card.apsu-is-loaded:focus-within .apsu-bg,
.apsu-card.apsu-is-loaded:focus .apsu-bg {
	opacity: 1;
	transform: translateY(0);
}

.apsu-card.apsu-is-loaded:hover .apsu-bg::after,
.apsu-card.apsu-is-loaded.apsu-is-active .apsu-bg::after,
.apsu-card.apsu-is-loaded:focus-within .apsu-bg::after,
.apsu-card.apsu-is-loaded:focus .apsu-bg::after {
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Contenu : bouteille + textes
   -------------------------------------------------------------------------- */

.apsu-inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 40px 24px 32px;
	height: 100%;
	box-sizing: border-box;
}

/* En hauteur fixe : la bouteille se centre dans l'espace disponible,
   le titre reste calé en bas — mêmes lignes sur toutes les cartes. */
.apsu-figure {
	margin: 0;
	line-height: 0;
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	max-width: 100%;
}

.apsu-bottle {
	display: block;
	/* Largeur pilotée par l'option du module ; auto = taille naturelle,
	   toujours plafonnée à la largeur de la carte. */
	width: var(--apsu-bottle-w, auto);
	max-width: 100%;
	height: auto;
	/* En hauteur fixe, la bouteille ne déborde jamais de son espace. */
	max-height: 100%;
	object-fit: contain;
	margin: 0 auto;
	transform: translateY(0);
	transition: transform var(--apsu-duration) var(--apsu-ease);
	filter: drop-shadow(0 18px 24px rgba(0, 0, 0, 0.10));
}

/* Légère élévation de la bouteille au survol */
.apsu-card.apsu-is-loaded:hover .apsu-bottle,
.apsu-card.apsu-is-loaded.apsu-is-active .apsu-bottle,
.apsu-card.apsu-is-loaded:focus-within .apsu-bottle {
	transform: translateY(-8px);
}

.apsu-caption {
	margin-top: 28px;
	text-align: center;
}

.apsu-title {
	margin: 0;
	padding: 0;
	font-weight: 700;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--apsu-text, #1b2a4a);
	transition: color calc(var(--apsu-duration) * 0.6) ease;
}

.apsu-subtitle {
	display: block;
	margin-top: 6px;
	font-style: italic;
	letter-spacing: 0.12em;
	color: var(--apsu-text, #1b2a4a);
	transition: color calc(var(--apsu-duration) * 0.6) ease;
}

/* Texte en blanc (couleur réglable) : uniquement image chargée + survol.
   !important requis pour battre les couleurs de titres de Divi/du thème. */
.apsu-card.apsu-is-loaded:hover .apsu-title,
.apsu-card.apsu-is-loaded:hover .apsu-subtitle,
.apsu-card.apsu-is-loaded.apsu-is-active .apsu-title,
.apsu-card.apsu-is-loaded.apsu-is-active .apsu-subtitle,
.apsu-card.apsu-is-loaded:focus-within .apsu-title,
.apsu-card.apsu-is-loaded:focus-within .apsu-subtitle,
.apsu-card.apsu-is-loaded:focus .apsu-title,
.apsu-card.apsu-is-loaded:focus .apsu-subtitle {
	color: var(--apsu-text-hover, #ffffff) !important;
}

/* --------------------------------------------------------------------------
   Accessibilité & confort
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.apsu-bg,
	.apsu-bg::after,
	.apsu-bottle,
	.apsu-title,
	.apsu-subtitle {
		transition-duration: 0.01ms !important;
	}

	.apsu-anim-slide .apsu-bg {
		transform: translateY(0);
	}
}