/* Transições do transitions.dev (Jakub Antalík, licença em ~/.claude/skills/transitions-dev/LICENSE.txt:
   uso livre em projetos, inclusive comerciais; não pode redistribuir a biblioteca como produto).
   Só os tokens e os trechos que o site usa: número do preço, troca de texto do botão, ✓ de sucesso, campo que treme,
   revelar textos. Cores adaptadas ao tema escuro. */
:root {
  --duration-stagger: 40ms; --duration-quick: 150ms; --duration-fast: 250ms; --duration-slow: 400ms; --duration-very-slow: 500ms;
  --ease-smooth-out: cubic-bezier(0.22, 1, 0.36, 1);

  /* número do preço */
  --digit-dur: 500ms; --digit-distance: 8px; --digit-stagger: 70ms; --digit-blur: 2px;
  --digit-ease: cubic-bezier(0.34, 1.45, 0.64, 1); --digit-dir-x: 0; --digit-dir-y: 1;
  /* troca de texto */
  --text-swap-dur: 150ms; --text-swap-translate-y: 4px; --text-swap-blur: 2px; --text-swap-ease: ease-in-out;
  /* ✓ de sucesso */
  --check-opacity-dur: 500ms; --check-rotate-dur: 500ms; --check-rotate-from: 80deg; --check-bob-dur: 500ms;
  --check-y-amount: 40px; --check-blur-dur: 500ms; --check-blur-from: 10px; --check-path-dur: 500ms; --check-path-delay: 80ms;
  --check-ease-out: cubic-bezier(0.22, 1, 0.36, 1); --check-ease-bob: cubic-bezier(0.34, 1.35, 0.64, 1);
  /* campo que treme */
  --shake-distance: 6px; --shake-overshoot: 4px; --shake-dur-a: 80ms; --shake-dur-b: 60ms;
  --shake-ease: cubic-bezier(0.22, 1, 0.36, 1); --revert-dur: 280ms;
  /* revelar textos */
  --stagger-dur: 500ms; --stagger-distance: 12px; --stagger-stagger: 40ms; --stagger-blur: 3px;
  --stagger-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /* abas e acordeão */
  --tabs-dur: 250ms; --tabs-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --acc-expand: 250ms; --acc-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Número que entra (02 · number pop-in) */
@keyframes t-digit-pop-in {
  0% { transform: translate(calc(var(--digit-distance) * var(--digit-dir-x)), calc(var(--digit-distance) * var(--digit-dir-y))); opacity: 0; filter: blur(var(--digit-blur)); }
  100% { transform: translate(0, 0); opacity: 1; filter: blur(0); }
}
.t-digit-group { display: inline-flex; align-items: baseline; }
.t-digit { display: inline-block; }
.t-digit-group.is-animating .t-digit { animation: t-digit-pop-in var(--digit-dur) var(--digit-ease) both; }
.t-digit-group.is-animating .t-digit[data-stagger="1"] { animation-delay: var(--digit-stagger); }
.t-digit-group.is-animating .t-digit[data-stagger="2"] { animation-delay: calc(var(--digit-stagger) * 2); }

/* Troca de texto (04 · text states swap) */
.t-text-swap { display: inline-block; transform: translateY(0); filter: blur(0); opacity: 1;
  transition: transform var(--text-swap-dur) var(--text-swap-ease), filter var(--text-swap-dur) var(--text-swap-ease), opacity var(--text-swap-dur) var(--text-swap-ease); }
.t-text-swap.is-exit { transform: translateY(calc(var(--text-swap-translate-y) * -1)); filter: blur(var(--text-swap-blur)); opacity: 0; }
.t-text-swap.is-enter-start { transform: translateY(var(--text-swap-translate-y)); filter: blur(var(--text-swap-blur)); opacity: 0; transition: none; }

/* ✓ de sucesso (10 · success check) */
.t-success-check { display: inline-block; transform-origin: center; opacity: 0; }
.t-success-check svg { display: block; overflow: visible; }
.t-success-check svg path { stroke-dasharray: 20; stroke-dashoffset: 20; }
.t-success-check[data-state="in"] {
  animation: t-check-fade var(--check-opacity-dur) var(--check-ease-out) forwards, t-check-rotate var(--check-rotate-dur) var(--check-ease-out) forwards,
             t-check-blur var(--check-blur-dur) var(--check-ease-out) forwards, t-check-bob var(--check-bob-dur) var(--check-ease-bob) forwards; }
.t-success-check[data-state="in"] svg path { animation: t-check-draw var(--check-path-dur) var(--check-ease-out) var(--check-path-delay) forwards; }
@keyframes t-check-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes t-check-rotate { from { transform: rotate(var(--check-rotate-from)); } to { transform: rotate(0deg); } }
@keyframes t-check-blur { from { filter: blur(var(--check-blur-from)); } to { filter: blur(0); } }
@keyframes t-check-bob { from { translate: 0 var(--check-y-amount); } to { translate: 0 0; } }
@keyframes t-check-draw { to { stroke-dashoffset: 0; } }

/* Campo com erro que treme (12 · error state shake) */
.t-input { transition: border-color 150ms ease-out, box-shadow 150ms ease-out; }
.t-input-wrap.is-error .t-input { transition: border-color var(--revert-dur) ease-out; }
.t-error-msg { opacity: 0; visibility: hidden; transition: opacity var(--revert-dur) ease-out, visibility 0s linear var(--revert-dur); }
.t-input-wrap.is-error .t-error-msg { opacity: 1; visibility: visible; transition: opacity var(--revert-dur) ease-out, visibility 0s linear 0s; }
.t-input.is-shaking { animation: t-input-shake calc(var(--shake-dur-a) * 2 + var(--shake-dur-b) * 2) linear; }
@keyframes t-input-shake {
  0% { transform: translateX(0); animation-timing-function: var(--shake-ease); }
  28.57% { transform: translateX(var(--shake-distance)); animation-timing-function: var(--shake-ease); }
  57.14% { transform: translateX(calc(var(--shake-distance) * -1)); animation-timing-function: var(--shake-ease); }
  78.57% { transform: translateX(var(--shake-overshoot)); animation-timing-function: var(--shake-ease); }
  100% { transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
  .t-digit-group .t-digit { animation: none !important; }
  .t-text-swap { transition: none !important; }
  .t-success-check { animation: none !important; opacity: 1; }
  .t-success-check svg path { animation: none !important; stroke-dashoffset: 0 !important; }
  .t-input { animation: none !important; transform: none !important; }
}