/* =====================================================================
   motion.css — couche de mouvement commune aux pages refondues

   Chargé en dernier, après les CSS de page. Applique les principes
   d'Emil Kowalski (emilkowalski/skills : emil-design-eng,
   animation-performance) :
   - tout ce qui se presse réagit au clic (scale 0.97, 120–160 ms) ;
   - les effets de survol décoratifs sont réservés aux souris : sur
     écran tactile, un tap ne laisse plus une carte zoomée ;
   - courbes ease-out « fortes », animations d'interface < 300 ms ;
   - seuls transform / opacity / filter sont animés.
   ===================================================================== */

body.index-new {
  --nx-ease-out:    cubic-bezier(0.23, 1, 0.32, 1);
  --nx-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

/* =====================================================================
   1. RETOUR AU CLIC
   ===================================================================== */

/* Bouton principal : la pression se compose avec l'effet magnétique */
body.index-new .nx-btn:active {
  transform: translate3d(var(--nx-bx, 0px), var(--nx-by, 0px), 0) scale(0.97);
  transition-duration: 120ms;
}

/* Contrôles compacts : puces, pages, pouces, étoile de vote… */
body.index-new .nxa-chip,
body.index-new .nxa-page,
body.index-new .nxd-thumb,
body.index-new .nxd-delete,
body.index-new .nxd-share,
body.index-new .nxu-avatar,
body.index-new .nxu-linkbtn,
body.index-new .nxa-reset,
body.index-new .asset-vote-button,
body.index-new .card .actions a,
body.index-new .card .actions button {
  transition-property: color, border-color, background-color, opacity, transform;
  transition-duration: .2s, .2s, .2s, .2s, 160ms;
  transition-timing-function: ease, ease, ease, ease, var(--nx-ease-out);
}

body.index-new .nxa-chip:active,
body.index-new .nxa-page:active:not(:disabled),
body.index-new .nxd-thumb:active,
body.index-new .nxd-delete:active,
body.index-new .nxd-share:active,
body.index-new .nxu-avatar:active,
body.index-new .nxu-linkbtn:active,
body.index-new .nxa-reset:active,
body.index-new .card .actions a:active,
body.index-new .card .actions button:active {
  transform: scale(0.97);
  transition-duration: .2s, .2s, .2s, .2s, 100ms;
}

/* L'étoile de vote presse un peu plus fort : c'est un geste qui compte */
body.index-new .asset-vote-button:active:not(.disabled) { transform: scale(0.92); }

/* Grandes surfaces cliquables : pression très légère */
body.index-new .card:active,
body.index-new a.nxa-next__card:active,
body.index-new .nxu-vote:active,
body.index-new .nxab-pack:active,
body.index-new .nx-pack:active {
  transform: scale(0.985);
  transition: transform 120ms var(--nx-ease-out);
}

/* =====================================================================
   2. SURVOL RÉSERVÉ AUX SOURIS
   Sur tactile, le navigateur simule :hover au tap et le laisse « collé ».
   On neutralise les effets décoratifs (zooms, soulèvements) ; les
   révélations utiles (titre / actions des cartes) restent.
   ===================================================================== */

@media (hover: none), (pointer: coarse) {
  body.index-new .card:hover,
  body.index-new .asset-card:hover,
  body.index-new .nx-tier:hover,
  body.index-new a.nxa-next__card:hover,
  body.index-new .nx-link:hover span,
  body.index-new .nx-benefit:hover .nx-benefit__icon,
  body.index-new .nx-pack:hover .nx-pack__img,
  body.index-new .nxa-spot:hover .nxa-spot__media img,
  body.index-new .nxd-shot:hover img,
  body.index-new .nxd-pshot:hover img,
  body.index-new .nxp-pack__media:hover img,
  body.index-new .nxp-shot:hover img,
  body.index-new .nxab-sketch:hover img,
  body.index-new .nxab-pack:hover .nxab-pack__img,
  body.index-new .nxu-vote:hover .nxu-vote__img,
  body.index-new footer .social a:hover svg {
    transform: none;
  }
  body.index-new .nx-btn::before { display: none; }
}

/* =====================================================================
   3. VISIONNEUSE D'IMAGES (#popin de style.css)
   Elle apparaissait d'un coup ; voile en fondu et image qui part de
   0.96 (jamais de 0), centrée comme une modale.
   ===================================================================== */

body.index-new .popin.open {
  animation: nx-popin-veil 200ms var(--nx-ease-out) both;
}
body.index-new .popin.open .popin-content {
  animation: nx-popin-in 260ms var(--nx-ease-out) both;
}
@keyframes nx-popin-veil { from { opacity: 0; } }
@keyframes nx-popin-in   { from { opacity: 0; transform: scale(0.96); } }

/* =====================================================================
   4. CATALOGUE : changement de filtre
   Un léger flou masque l'échange de contenu pendant le chargement.
   ===================================================================== */

body.assets-new .nxa-grid {
  transition: opacity .2s ease, filter .2s ease;
}
body.assets-new .nxa-grid.is-loading {
  filter: blur(2px);
}

/* =====================================================================
   5. MOUVEMENT RÉDUIT
   Moins de mouvement, pas zéro : les fondus restent, les déplacements
   et changements d'échelle disparaissent.
   ===================================================================== */

@media (prefers-reduced-motion: reduce) {
  body.index-new .nx-btn:active,
  body.index-new .card:active,
  body.index-new a.nxa-next__card:active { transform: none; }
  body.index-new .popin.open .popin-content { animation-name: nx-popin-veil; }
}