/* Approval workflow: five readable, responsive step cards. */
.workflow { background: linear-gradient(135deg,#273979,#344b9b); }
.workflow-line { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; margin: 0; padding: 0; overflow: visible; }
.workflow-line::before { display: none; }
.workflow-line li { position: relative; min-width: 0; padding: 28px 22px; border: 1px solid rgba(255,255,255,.65); border-radius: 14px; background: #fff; box-shadow: 0 12px 30px rgba(9,20,57,.16); transition: transform .2s ease,box-shadow .2s ease; }
.workflow-line li > span { display: inline-flex; align-items: center; margin: 0 0 24px; padding: 5px 9px; border-radius: 5px; background: #eef1ff; color: #40549c; font: 700 11px/1.5 Inter,sans-serif; letter-spacing: .08em; }
.workflow-line li > span::before { content: "STEP "; white-space: pre; font-weight: 500; }
.workflow .workflow-line li .workflow-icon { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 0 24px; border: 1px solid #dce3fb; border-radius: 12px; background: #eef2ff; color: #3e55ac; font-size: 25px; line-height: 1; }
.workflow .workflow-line li:nth-child(3) .workflow-icon { background: #e7f5f4; color: #176c72; border-color: #c9e6e3; }
.workflow .workflow-line li:last-child .workflow-icon { background: #edf4e5; color: #4e6e2f; border-color: #d6e5c5; }
.workflow-line h3 { margin: 0 0 14px; color: #20243a; font: 600 16px/1.5 Poppins,sans-serif; }
.workflow-line p { margin: 0; color: #626981; font-size: 13px; line-height: 1.8; }
.workflow-line li:not(:last-child)::after { content: "→"; position: absolute; z-index: 1; right: -22px; top: 105px; display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid #d5dcf4; border-radius: 50%; color: #344b9b; background: #f3f5ff; font-size: 15px; }
@media (hover:hover) { .workflow-line li:hover { transform: translateY(-4px); box-shadow: 0 18px 36px rgba(9,20,57,.24); } }
@media (max-width:1100px) {
  .workflow-line { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
  .workflow-line li { padding: 26px; }
  .workflow-line li:last-child { grid-column: 1 / -1; }
  .workflow-line li:not(:last-child)::after { display: none; }
}
@media (max-width:600px) {
  .workflow-line { grid-template-columns: 1fr; margin-inline: 0; padding-inline: 0; gap: 16px; }
  .workflow-line li { padding: 24px; }
  .workflow-line li > span { margin-bottom: 18px; }
  .workflow .workflow-line .workflow-icon { margin-bottom: 18px; }
}
@media (prefers-reduced-motion:reduce) { .workflow-line li { transition: none; } .workflow-line li:hover { transform: none; } }