/* Ten steps share one clock: confirmation -> transfer -> next confirmation. */
.prepravci-site .pc-journey-track {
  --journey-cycle: 7250ms;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 52px 36px;
  padding: 0;
  margin: 42px 0 0;
  list-style: none;
}
.prepravci-site .pc-journey-step { position: relative; min-width: 0; display: flex; }
.prepravci-site .pc-journey-step:nth-child(6) { grid-row: 2; grid-column: 5; }
.prepravci-site .pc-journey-step:nth-child(7) { grid-row: 2; grid-column: 4; }
.prepravci-site .pc-journey-step:nth-child(8) { grid-row: 2; grid-column: 3; }
.prepravci-site .pc-journey-step:nth-child(9) { grid-row: 2; grid-column: 2; }
.prepravci-site .pc-journey-step:nth-child(10) { grid-row: 2; grid-column: 1; }
.prepravci-site .pc-journey-card {
  position: relative;
  width: 100%;
  padding: 22px 18px;
  border: 1px solid #768d9e;
  background: #f3f8fb;
  box-shadow: 0 12px 32px rgb(16 45 69 / 7%);
  color: #0a1c31;
}
.prepravci-site .pc-journey-symbol { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 21px; color: #1689a7; }
.prepravci-site .pc-journey-symbol > span { font-size: 28px; line-height: 1; font-weight: 600; font-variant-numeric: tabular-nums; color: #ce202f; }
.prepravci-site .pc-journey-symbol > svg { width: 29px; height: 29px; flex: 0 0 29px; stroke-width: 1.7; }
.prepravci-site .pc-journey-copy h3 { color: #0a1c31; font-size: 20px; line-height: 1.28; letter-spacing: -.025em; font-weight: 650; margin: 0 0 13px; }
.prepravci-site .pc-journey-copy p { color: #29465d; font-size: 14px; line-height: 1.7; margin: 0; }
.prepravci-site .pc-journey-step:last-child .pc-journey-card { background-color: #edf7f1; border-color: #6a9582; }
.prepravci-site .pc-journey-step:last-child .pc-journey-symbol { color: #168052; }
.prepravci-site .pc-journey-link {
  --journey-turn: 0deg;
  position: absolute;
  width: 36px;
  height: 16px;
  top: calc(50% - 8px);
  right: -36px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6e9dae;
  transform: rotate(var(--journey-turn)) !important;
  pointer-events: none;
}
.prepravci-site .pc-journey-link svg { width: 28px; height: 20px; stroke-width: 1.5; }
.prepravci-site .pc-journey-link::after {
  content: '';
  position: absolute;
  top: 5px;
  left: 0;
  width: 8px;
  height: 6px;
  border-radius: 3px;
  background: #1689a7;
  box-shadow: 0 0 7px rgb(22 137 167 / 55%);
  opacity: 0;
}
.prepravci-site .pc-journey-step:nth-child(5) .pc-journey-link { --journey-turn: 90deg; top: calc(100% + 18px); left: calc(50% - 18px); right: auto; }
.prepravci-site .pc-journey-step:nth-child(n+6) .pc-journey-link { --journey-turn: 180deg; left: -36px; right: auto; }
html.motion-ready .prepravci-site .pc-journey-track.is-playing .pc-journey-card { animation: pc-journey-confirm var(--journey-cycle) linear infinite; animation-delay: calc(var(--journey-step) * 725ms); }
html.motion-ready .prepravci-site .pc-journey-track.is-playing .pc-journey-link::after { animation: pc-journey-transfer var(--journey-cycle) linear infinite; animation-delay: calc(var(--journey-step) * 725ms); }
html.motion-ready.motion-paused .prepravci-site .pc-journey-track.is-playing .pc-journey-card,
html.motion-ready.motion-paused .prepravci-site .pc-journey-track.is-playing .pc-journey-link::after { animation-play-state: paused; }
@keyframes pc-journey-confirm {
  0%, 6.8965%, 17.9311%, 100% { border-color: #768d9e; background-color: #f3f8fb; box-shadow: 0 12px 32px rgb(16 45 69 / 7%); }
  8.2759%, 13.7931% { border-color: #1689a7; background-color: #d9f0f6; box-shadow: 0 0 0 1px #1689a7, 0 9px 28px rgb(22 137 167 / 15%); }
}
@keyframes pc-journey-transfer {
  0%, 13.7931% { opacity: 0; transform: translateX(-8px); }
  13.7932% { opacity: 1; transform: translateX(-8px); }
  16.8965% { opacity: 1; transform: translateX(28px); }
  16.8966%, 100% { opacity: 0; transform: translateX(28px); }
}
.prepravci-site .pc-journey-context { margin-top: 32px; border-top: 1px solid #cbd9e2; padding-top: 27px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; gap: 44px; }
.prepravci-site .pc-journey-context > div { display: flex; align-items: flex-start; gap: 15px; }
.prepravci-site .pc-journey-context > div > svg { width: 29px; height: 29px; flex: 0 0 29px; color: #168052; }
.prepravci-site .pc-journey-context p { margin: 0; font-size: 15px; line-height: 1.8; color: #29465d; }
.prepravci-site .pc-journey-context strong { color: #0a1c31; font-weight: 650; }
.prepravci-site .pc-journey-context .pc-journey-conditions { font-size: 13px; line-height: 1.8; }
.prepravci-site .pc-journey-conditions a { color: #126d86; text-decoration: underline; text-underline-offset: 3px; }
.prepravci-site .pc-journey-conditions a:focus-visible { outline: 2px solid #1689a7; outline-offset: 3px; }
@media (max-width: 1100px) and (min-width: 961px) {
  .prepravci-site .pc-journey-card { padding: 20px 13px; }
  .prepravci-site .pc-journey-copy h3 { font-size: 18px; }
}
@media (max-width: 960px) {
  .prepravci-site .pc-journey-track { grid-template-columns: minmax(0, 1fr); gap: 44px; margin-top: 32px; }
  .prepravci-site .pc-journey-step:nth-child(n) { grid-row: auto; grid-column: auto; }
  .prepravci-site .pc-journey-card { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 22px; padding: 23px 25px; }
  .prepravci-site .pc-journey-symbol { flex-direction: column; gap: 16px; margin: 0; justify-content: flex-start; align-items: center; }
  .prepravci-site .pc-journey-copy h3 { font-size: 22px; margin-bottom: 8px; }
  .prepravci-site .pc-journey-copy p { font-size: 15px; }
  .prepravci-site .pc-journey-step:nth-child(n) .pc-journey-link { --journey-turn: 90deg; top: calc(100% + 14px); left: calc(50% - 18px); right: auto; }
  .prepravci-site .pc-journey-context { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}
@media (max-width: 480px) {
  .prepravci-site .pc-journey-card { grid-template-columns: 30px minmax(0, 1fr); gap: 17px; padding: 21px 17px; }
  .prepravci-site .pc-journey-symbol > span { font-size: 24px; }
  .prepravci-site .pc-journey-symbol > svg { width: 25px; height: 25px; flex-basis: 25px; }
  .prepravci-site .pc-journey-copy h3 { font-size: 20px; }
  .prepravci-site .pc-journey-copy p { font-size: 14px; }
}