:root {
  --pricing-motion-ease:cubic-bezier(.16,1,.3,1);
  --pricing-motion-fast:180ms;
}

/* A single composed entrance, matching the restrained rhythm of the home page. */
.pricing-page .nav .brand,
.pricing-page .nav .desktop-nav__links,
.pricing-page .nav .nav__actions {
  animation:pricing-nav-enter 520ms var(--pricing-motion-ease) both;
}
.pricing-page .nav .desktop-nav__links { animation-delay:50ms; }
.pricing-page .nav .nav__actions { animation-delay:100ms; }

.pricing-page .pricing-hero__limited,
.pricing-page .pricing-hero__members,
.pricing-page .pricing-billing-options,
.pricing-page .pricing-offer-card,
.pricing-page .pricing-limit-note,
.pricing-page .pricing-links {
  animation:pricing-content-enter 680ms var(--pricing-motion-ease) both;
}
.pricing-page .pricing-hero__limited { animation-delay:90ms; }
.pricing-page .pricing-hero__members { animation-delay:145ms; }
.pricing-page .pricing-billing-options { animation-delay:205ms; }
.pricing-page .pricing-offer-card { animation-delay:275ms; }
.pricing-page .pricing-limit-note { animation-delay:350ms; }
.pricing-page .pricing-links { animation-delay:390ms; }

.pricing-page .pricing-checklist li {
  animation:pricing-feature-enter 520ms var(--pricing-motion-ease) both;
  animation-delay:var(--pricing-feature-delay,390ms);
}

@keyframes pricing-nav-enter {
  from { opacity:0;transform:translateY(-7px); }
  to { opacity:1;transform:none; }
}

@keyframes pricing-content-enter {
  from { opacity:0;transform:translateY(14px);filter:blur(3px); }
  to { opacity:1;transform:none;filter:blur(0); }
}

@keyframes pricing-feature-enter {
  from { opacity:0;transform:translateX(-8px); }
  to { opacity:1;transform:none; }
}

/* The plan changes in place: no page transition and no layout jump. */
.pricing-page .pricing-offer-card {
  transition:border-color 300ms ease,background-color 300ms ease !important;
}

.pricing-page .pricing-offer-card.is-plan-changing :where(
  .pricing-offer-price,
  .pricing-offer-copy,
  .pricing-offer-action,
  .pricing-offer-notes
) {
  animation:pricing-plan-refresh 380ms var(--pricing-motion-ease) both !important;
}
.pricing-page .pricing-offer-card.is-plan-changing .pricing-offer-copy { animation-delay:28ms !important; }
.pricing-page .pricing-offer-card.is-plan-changing .pricing-offer-action { animation-delay:52ms !important; }
.pricing-page .pricing-offer-card.is-plan-changing .pricing-offer-notes { animation-delay:72ms !important; }
.pricing-page .pricing-offer-card.is-plan-changing:not(.is-monthly-plan) .pricing-top-offer {
  animation:pricing-offer-return 420ms var(--pricing-motion-ease) both !important;
}

@keyframes pricing-plan-refresh {
  from { opacity:.32;transform:translateY(7px);filter:blur(2px); }
  to { opacity:1;transform:none;filter:blur(0); }
}

@keyframes pricing-offer-return {
  from { opacity:.3;transform:translateY(-7px); }
  to { opacity:1;transform:none; }
}

/* Short physical feedback, shared by mouse, trackpad and touch. */
.pricing-page .pricing-billing-options button,
.pricing-page .pricing-offer-action,
.pricing-page .pricing-links a {
  transition:
    transform var(--pricing-motion-fast) var(--pricing-motion-ease),
    color var(--pricing-motion-fast) ease,
    background-color var(--pricing-motion-fast) ease,
    border-color var(--pricing-motion-fast) ease !important;
}
.pricing-page .pricing-billing-options button:active,
.pricing-page .pricing-offer-action:active { transform:scale(.985) !important; }

.pricing-page .pricing-offer-action > b,
.pricing-page .pricing-offer-action > b svg {
  transition:transform 320ms var(--pricing-motion-ease) !important;
}

@media (hover:hover) and (pointer:fine) {
  .pricing-page .pricing-offer-action:hover > b { transform:translateX(3px) !important; }
  .pricing-page .pricing-offer-action:hover > b svg { transform:translateX(1px) !important; }
  .pricing-page .pricing-links a:hover { transform:translateY(-1px); }
}

@media (max-width:680px) {
  .pricing-page .pricing-hero__limited,
  .pricing-page .pricing-hero__members,
  .pricing-page .pricing-billing-options,
  .pricing-page .pricing-offer-card,
  .pricing-page .pricing-limit-note,
  .pricing-page .pricing-links {
    animation-duration:560ms;
  }
  .pricing-page .pricing-checklist li { animation-duration:440ms; }
}

@media (prefers-reduced-motion:reduce) {
  .pricing-page .nav .brand,
  .pricing-page .nav .desktop-nav__links,
  .pricing-page .nav .nav__actions,
  .pricing-page .pricing-hero__limited,
  .pricing-page .pricing-hero__members,
  .pricing-page .pricing-billing-options,
  .pricing-page .pricing-offer-card,
  .pricing-page .pricing-limit-note,
  .pricing-page .pricing-links,
  .pricing-page .pricing-checklist li,
  .pricing-page .pricing-offer-card.is-plan-changing :where(
    .pricing-top-offer,
    .pricing-offer-price,
    .pricing-offer-copy,
    .pricing-offer-action,
    .pricing-offer-notes
  ) {
    animation:none !important;
    transition:none !important;
    opacity:1 !important;
    filter:none !important;
    transform:none !important;
  }
  .pricing-page :where(.pricing-billing-options button,.pricing-offer-action,.pricing-offer-action b,.pricing-offer-action svg,.pricing-links a) {
    transition:none !important;
    transform:none !important;
  }
}