/* ---------- Animations du catalogue de matelas ---------- */

/* Chaque matelas flotte doucement (la photo reste entière) */
.carte-matelas .galerie-item img {
  animation: flotter-matelas 4.5s ease-in-out infinite alternate;
}

/* Rythmes décalés pour que les matelas ne bougent pas tous ensemble */
.carte-matelas:nth-child(2n) .galerie-item img { animation-duration: 5.5s; animation-delay: -1.5s; }
.carte-matelas:nth-child(3n) .galerie-item img { animation-duration: 5s;   animation-delay: -3s; }
.carte-matelas:nth-child(4n) .galerie-item img { animation-duration: 6s;   animation-delay: -2s; }

@keyframes flotter-matelas {
  0%   { transform: translateY(0) scale(1); }
  100% { transform: translateY(-8px) scale(1.06); }
}

/* Au survol : la photo s'arrête et zoome un peu */
.carte-matelas:hover .galerie-item img {
  animation-play-state: paused;
  transform: scale(1.1);
  transition: transform 0.5s ease;
}

/* Apparition progressive des cartes quand on descend la page */
@keyframes apparition-carte {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0); }
}
@supports (animation-timeline: view()) {
  .carte-matelas {
    animation: apparition-carte linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 35%;
  }
}

/* Le bouton WhatsApp pulse légèrement pour attirer l'oeil */
.matelas-btn {
  animation: pulsation 2.6s ease-in-out infinite;
}
@keyframes pulsation {
  0%, 100% { box-shadow: 0 0 0 0 rgba(47, 158, 68, 0.45); }
  50%      { box-shadow: 0 0 0 9px rgba(47, 158, 68, 0); }
}
.matelas-btn:hover { animation: none; }