/* Visible by default. JavaScript adds only opacity and tiny translations;
   nothing is hidden from assistive technology or removed from document flow. */
#summary .success-copy-unit,
#summary .success-promise .promise-intro,
#summary .success-promise .promise-step,
#summary [data-success-comparison] .success-workflow,
#summary [data-success-comparison] .success-arrow {
  opacity: 1;
  transform: none;
  transition: none;
}

/* The baseline stays readable throughout the comparison. */
#summary [data-success-comparison] .success-baseline {
  opacity: 1 !important;
  transform: none !important;
}

/* Editorial clauses enter once at their scroll threshold. Each bottom rule
   follows its own clause; the row and parent remain fully visible and in flow. */
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state] {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state]::before {
  opacity: 1;
  transform: none;
  transition: opacity 280ms cubic-bezier(.22,1,.36,1), transform 280ms cubic-bezier(.22,1,.36,1);
}
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state] .promise-clause {
  opacity: 1;
  transform: none;
  filter: none;
  transition: opacity 400ms cubic-bezier(.22,1,.36,1) 50ms,
    transform 400ms cubic-bezier(.22,1,.36,1) 50ms,
    filter 400ms cubic-bezier(.22,1,.36,1) 50ms;
}
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state]::after {
  opacity: 1;
  transform: scaleX(1);
  transform-origin: left center;
  transition: opacity 400ms cubic-bezier(.22,1,.36,1) 50ms,
    transform 400ms cubic-bezier(.22,1,.36,1) 50ms;
}
#summary[data-summary-variant="editorial"] .promise-step:is([data-clause-state="pending"],[data-clause-state="queued"])::before {
  opacity: 0;
  transform: translate3d(0,4px,0);
  transition: none;
}
#summary[data-summary-variant="editorial"] .promise-step:is([data-clause-state="pending"],[data-clause-state="queued"]) .promise-clause {
  opacity: 0;
  transform: translate3d(0,8px,0);
  filter: blur(1.5px);
  transition: none;
}
#summary[data-summary-variant="editorial"] .promise-step:is([data-clause-state="pending"],[data-clause-state="queued"])::after {
  opacity: 0;
  transform: scaleX(.94);
  transition: none;
}
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state="static"]::before,
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state="static"]::after,
#summary[data-summary-variant="editorial"] .promise-step[data-clause-state="static"] .promise-clause,
:is(.motion-paused,[data-motion="off"]) #summary .promise-step[data-clause-state]::before,
:is(.motion-paused,[data-motion="off"]) #summary .promise-step[data-clause-state]::after,
:is(.motion-paused,[data-motion="off"]) #summary .promise-step[data-clause-state] .promise-clause {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}

#summary [data-success-copy-motion="static"],
#summary [data-success-motion="static"] .success-workflow,
#summary [data-success-motion="static"] .success-arrow,
.motion-paused #summary .success-copy-unit,
.motion-paused #summary .success-promise .promise-intro,
.motion-paused #summary .success-promise .promise-step,
.motion-paused #summary [data-success-comparison] .success-workflow,
.motion-paused #summary [data-success-comparison] .success-arrow,
[data-motion="off"] #summary .success-copy-unit,
[data-motion="off"] #summary .success-promise .promise-intro,
[data-motion="off"] #summary .success-promise .promise-step,
[data-motion="off"] #summary [data-success-comparison] .success-workflow,
[data-motion="off"] #summary [data-success-comparison] .success-arrow {
  opacity: 1 !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce), print {
  #summary .success-copy-unit,
  #summary .success-promise .promise-intro,
  #summary .success-promise .promise-step,
  #summary .promise-step[data-clause-state]::before,
  #summary .promise-step[data-clause-state]::after,
  #summary .promise-step[data-clause-state] .promise-clause,
  #summary [data-success-comparison] .success-workflow,
  #summary [data-success-comparison] .success-arrow {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}
