/* Animation des boutons : défilement du texte au survol (même mouvement que 1600.agency).
   - le texte actuel descend en s'estompant, le même texte entre par le haut ;
   - les lettres du nouveau texte montent de 5 px, décalées de 20 ms ;
   - ressort amorti sans rebond (≈ 1 s). Le bouton lui-même ne bouge pas.
   Activé par /forge-buttons.js (classe .rollable). */
:root{
  --spring-slow:linear(0, 0.0362, 0.1198, 0.2241, 0.3329, 0.4369, 0.5316, 0.6147, 0.6861, 0.7462, 0.7961, 0.8372, 0.8706, 0.8976, 0.9192, 0.9365, 0.9503, 0.9611, 0.9697, 0.9764, 0.9817, 0.9858, 0.989, 0.9915, 0.9935, 0.995, 0.9961, 0.997, 0.9977, 0.9982, 0.9987, 0.999, 1);
  --spring-fast:linear(0, 0.0596, 0.1861, 0.3296, 0.4658, 0.5842, 0.6821, 0.7603, 0.8212, 0.8678, 0.903, 0.9293, 0.9488, 0.963, 0.9734, 0.981, 0.9864, 0.9903, 0.9931, 0.9951, 0.9966, 0.9976, 0.9983, 0.9988, 0.9992, 0.9994, 0.9996, 0.9997, 1);
}
.rollable .roll{position:relative;display:inline-block;overflow:hidden;vertical-align:top;white-space:inherit;padding-block:var(--roll-p,.9em);margin-block:calc(var(--roll-p,.9em) * -1)}
.rollable .roll__in{position:relative;display:block;transform:translateY(0)}
.rollable .roll__old{display:block;opacity:1}
.rollable .roll__new{position:absolute;left:0;right:0;bottom:100%;margin-bottom:var(--roll-p,.9em);display:block;text-align:center;white-space:nowrap;pointer-events:none}
.rollable .roll--multi .roll__new{white-space:normal}
.rollable .roll__w{display:inline-block;white-space:nowrap}
.rollable .roll__c{display:inline-block;opacity:0;transform:translateY(5px);transition:opacity 0s linear 1s,transform 0s linear 1s}
/* retour : le texte continue de rouler vers le haut */
.rollable .roll__in{transition:transform 1s var(--spring-slow)}
.rollable .roll__old{transition:opacity 1s var(--spring-slow)}

@media (hover:hover) and (pointer:fine){
  .rollable:hover .roll__in{transform:translateY(calc(100% + var(--roll-p,.9em)))}
  .rollable:hover .roll__old{opacity:0}
  .rollable:hover .roll__c{opacity:1;transform:none;transition:opacity .5s var(--spring-fast) calc(var(--i) * 20ms),transform .5s var(--spring-fast) calc(var(--i) * 20ms)}
}
.rollable:focus-visible .roll__in{transform:translateY(calc(100% + var(--roll-p,.9em)))}
.rollable:focus-visible .roll__old{opacity:0}
.rollable:focus-visible .roll__c{opacity:1;transform:none;transition:opacity .5s var(--spring-fast) calc(var(--i) * 20ms),transform .5s var(--spring-fast) calc(var(--i) * 20ms)}

@media (prefers-reduced-motion:reduce){
  .rollable .roll__new{display:none}
  .rollable .roll__in,.rollable .roll__old{transition:none}
  .rollable:hover .roll__in,.rollable:focus-visible .roll__in{transform:none}
  .rollable:hover .roll__old,.rollable:focus-visible .roll__old{opacity:1}
}