.prp-sequence {
  --prp-sequence-navy: #0d1b2a;
  --prp-sequence-gold: #c9a96e;
  --prp-sequence-cream: #f8f5ef;
  --prp-sequence-ease: var(--ease-premium, cubic-bezier(.16, 1, .3, 1));
  color: var(--prp-sequence-cream);
  font-family: "DM Sans", sans-serif;
  background: var(--prp-sequence-navy);
}
.prp-sequence *, .prp-sequence *::before, .prp-sequence *::after { box-sizing: border-box; }
.prp-sequence-stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; }
.prp-stage { position: relative; list-style: none; padding: 0 28px 14px; margin: 0; min-width: 0; }
.prp-stage:first-child { padding-left: 0; }
.prp-stage:last-child { padding-right: 0; }
.prp-stage + .prp-stage { border-left: 1px solid #c9a96e26; }
.prp-stage:not(:last-child)::after { content: ""; position: absolute; right: -9px; top: 181px; width: 18px; height: 1px; background: var(--prp-sequence-gold); }
.prp-stage:not(:last-child)::before { content: ""; position: absolute; right: -9px; top: 178px; width: 6px; height: 6px; border-top: 1px solid var(--prp-sequence-gold); border-right: 1px solid var(--prp-sequence-gold); transform: rotate(45deg); }
.prp-stage-heading { min-height: 86px; padding-right: 4px; }
.prp-stage-number { display: block; margin-bottom: 13px; font-size: 12px; letter-spacing: .1em; color: var(--prp-sequence-gold); font-variant-numeric: tabular-nums; }
.prp-stage h3 { font: 400 clamp(25px, 2.25vw, 33px)/1.1 "EB Garamond", Georgia, serif; letter-spacing: -.02em; margin: 0; color: var(--prp-sequence-cream); text-wrap: balance; }
.prp-stage-figure { display: flex; align-items: center; justify-content: center; width: 100%; margin: 14px 0 16px; }
.prp-stage-diagram { display: block; width: 100%; height: auto; aspect-ratio: 360 / 280; overflow: visible; }
.prp-stage > p { font-size: 14px; line-height: 1.75; margin: 0; color: #f8f5efcc; max-width: 34ch; min-height: 98px; }
.prp-stage-detail { display: block; font-size: 12px; line-height: 1.65; color: var(--prp-sequence-gold); max-width: 34ch; padding-top: 14px; margin-top: 16px; border-top: 1px solid #c9a96e26; }
.prp-sequence-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid #c9a96e26; margin-top: 23px; padding-top: 15px; }
.prp-sequence-footer > p { margin: 0; color: #f8f5efa6; font-size: 11px; line-height: 1.6; }
.prp-sequence-play { display: inline-flex; flex-shrink: 0; align-items: center; gap: 9px; background: none; border: none; color: var(--prp-sequence-cream); font: 400 12px/1.5 "DM Sans", sans-serif; cursor: pointer; padding: 10px 0 10px 12px; }
.prp-sequence-play svg { width: 14px; height: 14px; flex-shrink: 0; }
.prp-sequence-play:disabled { opacity: .7; cursor: default; }
.prp-sequence-play:focus-visible { outline: 2px solid var(--prp-sequence-gold); outline-offset: 5px; border-radius: 2px; }
.prp-sequence .prp-blood-fill { transform-box: fill-box; transform-origin: bottom center; animation: prp-sequence-fill 8s var(--prp-sequence-ease) infinite; }
.prp-sequence .prp-blood-flow { animation: prp-sequence-flow 3s linear infinite; }
.prp-sequence .prp-blood-flow:nth-child(2) { animation-delay: -1s; }
.prp-sequence .prp-blood-flow:nth-child(3) { animation-delay: -2s; }
.prp-sequence .prp-centrifuge-rotor { transform-box: fill-box; transform-origin: center; animation: prp-sequence-spin 5s linear infinite; }
.prp-sequence .prp-plasma-dot { animation: prp-sequence-plasma 4s ease infinite; }
.prp-sequence .prp-plasma-dot:nth-of-type(2n) { animation-delay: -1.5s; }
.prp-sequence .prp-plasma-dot:nth-of-type(3n) { animation-delay: -2.5s; }
.prp-sequence .prp-injection-dot { animation: prp-sequence-inject 4s var(--prp-sequence-ease) infinite; }
.prp-sequence .prp-injection-dot:nth-of-type(2) { animation-delay: -1.3s; }
.prp-sequence .prp-injection-dot:nth-of-type(3) { animation-delay: -2.6s; }
.prp-sequence[data-playing="false"] [data-prp-motion], .prp-sequence[data-visible="false"] [data-prp-motion] { animation-play-state: paused; }
@keyframes prp-sequence-fill { 0%, 8% { transform: scaleY(.2); } 45%, 100% { transform: scaleY(1); } }
@keyframes prp-sequence-flow { 0% { transform: translateY(-14px); opacity: 0; } 20%, 70% { opacity: .75; } 100% { transform: translateY(29px); opacity: 0; } }
@keyframes prp-sequence-spin { to { transform: rotate(360deg); } }
@keyframes prp-sequence-plasma { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@keyframes prp-sequence-inject { 0% { transform: translateY(-10px); opacity: 0; } 25%, 65% { opacity: 1; } 100% { transform: translateY(22px); opacity: 0; } }
@media (hover: hover) and (pointer: fine) { .prp-sequence-play:hover { color: var(--prp-sequence-gold); } }
@media (max-width: 1000px) and (min-width: 761px) {
  .prp-stage { padding-inline: 18px; }
  .prp-stage h3 { font-size: 28px; }
  .prp-stage > p { min-height: 124px; }
}
@media (max-width: 760px) {
  .prp-sequence-stages { grid-template-columns: minmax(0, 1fr); }
  .prp-stage, .prp-stage:first-child, .prp-stage:last-child { padding: 30px 0 34px; }
  .prp-stage:first-child { padding-top: 0; }
  .prp-stage + .prp-stage { border-left: 0; border-top: 1px solid #c9a96e26; }
  .prp-stage:not(:last-child)::after { left: 50%; right: auto; top: auto; bottom: -10px; height: 20px; width: 1px; z-index: 1; }
  .prp-stage:not(:last-child)::before { left: calc(50% - 3px); right: auto; top: auto; bottom: -10px; transform: rotate(135deg); z-index: 1; }
  .prp-stage-heading { min-height: 0; }
  .prp-stage-number { margin-bottom: 12px; }
  .prp-stage h3 { font-size: 32px; }
  .prp-stage-figure { max-width: 370px; margin: 10px auto 12px; }
  .prp-stage > p { font-size: 14px; max-width: none; min-height: 0; }
  .prp-stage-detail { max-width: none; border-top: 0; padding-top: 0; margin-top: 14px; }
  .prp-sequence-footer { margin-top: 0; align-items: flex-start; gap: 14px; }
  .prp-sequence-footer > p { font-size: 10px; max-width: 29ch; }
  .prp-sequence-play { font-size: 10px; padding-top: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  .prp-sequence [data-prp-motion] { animation: none !important; }
  .prp-sequence .prp-blood-flow, .prp-sequence .prp-injection-dot { opacity: .8; }
}