/* ============================================================
   La Caféothèque — Animations (déclenchées au scroll via JS)
   Principe : les éléments restent VISIBLES par défaut ; l'animation
   est appliquée par cafeo-anim.js à l'apparition (rien de masqué si le
   JS ne tourne pas). Exception : le sceau (animation CSS en pause,
   passée en "running" par le JS).
   ============================================================ */

/* ---- Titres ---- */
@keyframes cafeoTitleReveal { /* H1 hero : fade-up + défloutage */
	from { opacity: 0; transform: translateY(26px); filter: blur(7px); }
	to   { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes cafeoTitleWipe { /* H2 sections : déroulement gauche → droite */
	from { clip-path: inset(0 100% 0 0); }
	to   { clip-path: inset(0 0 0 0); }
}

/* ---- Frames photos ---- */
@keyframes cafeoImgFromRight { from { opacity: 0; transform: translateX(60px); }  to { opacity: 1; transform: translateX(0); } }
@keyframes cafeoImgFromLeft  { from { opacity: 0; transform: translateX(-60px); } to { opacity: 1; transform: translateX(0); } }
@keyframes cafeoCardPop      { from { opacity: 0; transform: translateY(40px) scale(.94); }  to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes cafeoImgSettle    { from { opacity: 0; transform: translateY(34px) scale(.965); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* ---- Sceau ---- */
@keyframes cafeoSealStamp {
	0%   { transform: scale(1.4) rotate(-6deg); opacity: 0; }
	55%  { opacity: 1; }
	100% { transform: scale(1) rotate(0deg); opacity: 1; }
}
@keyframes cafeoSealPulse {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.04); }
}
@keyframes cafeoSealShine {
	0%   { transform: translateX(-130%) rotate(18deg); }
	100% { transform: translateX(230%) rotate(18deg); }
}

/* Sceau : animation en pause au départ, lancée par le JS au scroll (threshold .5) */
.cafeo-front .cf-commit__seal {
	overflow: hidden;
	will-change: transform; /* couche GPU → pas de repaint de l'ombre pendant le scale (fluidité). */
	backface-visibility: hidden;
	animation: cafeoSealStamp 1.4s cubic-bezier(.22,1,.36,1) both, cafeoSealPulse 4s ease-in-out 1.4s infinite;
	animation-play-state: paused, paused;
}
.cafeo-front .cf-commit__seal-shine {
	position: absolute; top: -20%; left: 0; width: 34%; height: 140%; pointer-events: none;
	background: linear-gradient(to right, transparent, rgba(255,255,255,.45), transparent);
	animation: cafeoSealShine 2.4s ease-in-out 1.4s both;
	animation-play-state: paused;
}

/* ---- Accessibilité : respecter prefers-reduced-motion ---- */
@media (prefers-reduced-motion: reduce) {
	.cafeo-front .cf-commit__seal,
	.cafeo-front .cf-commit__seal-shine { animation: none !important; }
}