/* Une grille durable, un geste d'ouverture, puis deux ponctuations. Voir docs/grammaire-mouvement-artclub.md.
   Les transformations portent sur les tracés ; le cadre reste réservé.
   État final par défaut, sans JS, sur mobile et en mouvement réduit. */
.identity-opening {
  opacity: .42;
  pointer-events: none;
}
.identity-opening path { fill: none; stroke: var(--identity-ink); stroke-linecap: round; stroke-width: 9; }
.identity-opening .opening-line-accent path { stroke: var(--identity-saffron); }
.identity-opening g { transform-box: fill-box; transform-origin: center; }
@media (min-width: 681px) and (prefers-reduced-motion: no-preference) {
  .identity-home.opening-active .identity-hero-spiral { opacity: 0; }
  .identity-home.opening-releasing .identity-hero-spiral { opacity: 1; transition: opacity 380ms ease-out; }
  .identity-home [data-motion="spiral"].motion-playing {
    --spiral-x: 8px;
    --spiral-y: -5px;
    --spiral-scale: 1.025;
    transform-box: fill-box;
    transform-origin: 50% 50%;
    animation: artclub-settle-spiral 1120ms cubic-bezier(.22, .65, .28, 1) both;
  }
  .identity-home [data-motion="settle"].motion-playing {
    animation: artclub-settle-line 920ms cubic-bezier(.22, .65, .28, 1) both;
    transform-origin: 50% 50%;
  }
}
/* La coupe haute de la tablette demande une amplitude encore plus faible. */
@media (min-width: 681px) and (max-width: 980px) and (prefers-reduced-motion: no-preference) {
  .identity-home [data-motion="spiral"].motion-playing {
    --spiral-x: 3px;
    --spiral-y: -2px;
    --spiral-scale: 1.01;
  }
}
@keyframes artclub-settle-spiral {
  from { transform: translate(var(--spiral-x), var(--spiral-y)) scale(var(--spiral-scale)); }
  to { transform: none; }
}
@keyframes artclub-settle-line {
  from { transform: translate(-6px, -5px) rotate(-.7deg); }
  to { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .identity-opening g { transition: none !important; transform: none !important; }
  .identity-home [data-motion] { animation: none !important; transform: none !important; }
}
