.es-availability{display:inline-block;padding:.5rem .85rem;border-radius:2rem;background:#edf7f4;color:#19644e;font-size:.85rem;font-weight:600}
.es-workflow,.es-preview-section,.es-use-cases{padding:3rem 0;border-top:1px solid #e1e8ed}
.es-workflow h2,.es-preview-section h2,.es-use-cases h2{max-width:900px;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.25;color:#183b51}
.es-section-intro{max-width:760px;color:#526779;line-height:1.8}
.es-workflow { scroll-margin-top: 120px; }
.es-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    padding: 0;
    margin: 1.5rem 0 0;
    list-style: none;
}
.es-steps li {
    position: relative;
    min-width: 0;
    background: #f4f8fa;
    border: 1px solid #dce8ed;
    border-radius: 16px;
}
.es-steps li:not(:last-child)::after {
    content: '→';
    position: absolute;
    right: -1.05rem;
    top: 3.9rem;
    color: #307b85;
    z-index: 1;
    font-size: 1.4rem;
    line-height: 1;
    pointer-events: none;
}
.es-step-button {
    display: block;
    width: 100%;
    height: 100%;
    padding: 1.4rem;
    border: 0;
    border-radius: 15px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.es-step-button:focus-visible { outline: 3px solid #0878dc; outline-offset: 4px; }
.es-step-button:hover { background: #e9f3f5; }
.es-step-actor {
    display: block;
    padding-right: 2rem;
    margin-bottom: 1rem;
    color: #526779;
    font-size: .75rem;
    font-weight: 600;
}
.es-step-number { position: absolute; right: 1.2rem; top: 1.4rem; color: #466878; font-weight: 600; font-size: .8rem; }
.es-steps .fa { display: block; font-size: 1.65rem; color: #287b80; margin-bottom: 1.1rem; }
.es-step-title { display: block; margin-bottom: .55rem; font-size: 1.1rem; font-weight: 600; color: #183b51; }
.es-step-summary { display: block; font-size: .95rem; line-height: 1.7; color: #526779; }
.es-steps li.is-active { border-color: #287b80; box-shadow: 0 0 0 2px #287b80; background: #eaf6f3; }
.es-steps li.is-complete { border-color: #9fc9bc; background: #f0f8f4; }
.es-steps li.is-active .es-step-actor, .es-steps li.is-complete .es-step-number { color: #19644e; }
.es-js-control { display: none; }
.es-workflow[data-enhanced] .es-js-control { display: flex; }
.es-workflow[data-enhanced] .es-walkthrough-label { display: inline-flex; }
.es-walkthrough-label { align-items: center; gap: .5rem; margin: .5rem 0 0; font-size: .85rem; color: #287b80; }
.es-workflow-controls { justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; }
.es-playback { display: flex; flex-wrap: wrap; gap: .65rem; }
.es-playback button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 44px;
    padding: .65rem .9rem;
    border: 1px solid #bed0d9;
    border-radius: 8px;
    background: white;
    color: #183b51;
    font: inherit;
    font-size: .85rem;
    font-weight: 500;
    cursor: pointer;
}
.es-playback [data-workflow-play] { border-color: #287b80; background: #287b80; color: white; }
.es-playback button:hover { filter: brightness(.94); }
.es-playback button:focus-visible { outline: 3px solid #0878dc; outline-offset: 3px; }
.es-playback button:disabled { opacity: .5; cursor: default; filter: none; }
.es-playback button[hidden] { display: none; }
.es-workflow-controls p { margin: 0; font-size: .8rem; line-height: 1.7; color: #526779; }
.es-step-detail { align-items: flex-start; gap: 1rem; padding: 1.3rem; margin-top: 1.2rem; border-radius: 12px; background: #edf5f8; }
.es-step-detail > span { flex-shrink: 0; padding: .4rem .65rem; border-radius: 6px; background: white; color: #226b54; font-size: .8rem; font-weight: 600; }
.es-step-detail p { margin: 0; color: #435b6c; font-size: .95rem; line-height: 1.8; }
.es-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.75rem;margin-top:2rem}
.es-screen{margin:0;overflow:hidden;border-radius:18px;border:1px solid #d7e1e8;background:#f4f7fa;box-shadow:0 14px 38px #1637470d}
.es-screen-bar{display:flex;justify-content:space-between;gap:.8rem;align-items:center;padding:1rem 1.2rem;background:#183b51;color:white;font-size:.85rem}
.es-screen-bar>span:last-child{font-size:.7rem;opacity:.9}
.es-screen-body{padding:1.6rem}.es-screen-body h3{font-size:1.5rem;color:#183b51;margin-bottom:1.25rem}
.es-document{padding:1.3rem;background:white;border:1px solid #dce5ea;border-radius:8px}.es-document p{font-size:.85rem;margin:1.1rem 0;color:#435b6c}
.es-document-label{font-size:.95rem;font-weight:600;color:#183b51}.es-document-lines{height:50px;margin-top:1rem;background:repeating-linear-gradient(to bottom,#e7edf1 0,#e7edf1 3px,transparent 3px,transparent 13px);width:85%}
.es-signed{display:inline-block;color:#226b54;font-size:.75rem;margin-left:.4rem}
.es-field{border:2px dashed #568cbb;color:#27618b;border-radius:5px;padding:1rem;font-size:.9rem;background:#edf6ff}.es-field .fa{margin-right:.5rem}
.es-field-signed{border-color:#3e9374;background:#eef8f1;color:#226b54;display:flex;justify-content:space-between;align-items:center}.es-signature{font-family:Georgia,serif;font-style:italic;font-size:1.25rem}
.es-request-summary{display:flex;gap:.8rem;align-items:center;margin-top:1.3rem;font-size:.85rem;line-height:1.6;color:#183b51}.es-request-summary>.fa{font-size:1.5rem;color:#287b80}.es-request-summary small{color:#526779}.es-status{margin-left:auto;background:#e0eee7;color:#226b54;border-radius:2rem;padding:.3rem .6rem;font-size:.75rem}
.es-screen figcaption{padding:0 1.6rem 1.4rem;color:#526779;font-size:.8rem;line-height:1.7}
.es-customer-screen .es-screen-bar{background:#276c6f}
.es-use-cases ul{list-style:none;display:flex;flex-wrap:wrap;gap:.8rem;padding:0;margin-top:1.5rem}.es-use-cases li{padding:.85rem 1rem;border:1px solid #dce8ed;border-radius:10px;color:#24495d;background:#f4f8fa}.es-use-cases .fa{margin-right:.5rem;color:#287b80}
.es-finance-note{display:flex;gap:1.3rem;padding:2rem;background:#f6f5f0;border:1px solid #e4dfd0;border-radius:16px;margin:0 0 3rem}.es-finance-note>.fa{font-size:2rem;color:#72633d}.es-finance-note h2{font-size:1.5rem;color:#183b51}.es-finance-note p{line-height:1.8;color:#4a5e6c}.es-finance-note p:last-child{margin-bottom:0}.es-finance-note a{text-decoration:underline;text-underline-offset:3px}
/* Keep DOM and keyboard order 1–6 while the desktop route snakes back along row two. */
@media (min-width: 761px) {
    .es-steps li:nth-child(4) { grid-column: 3; grid-row: 2; }
    .es-steps li:nth-child(5) { grid-column: 2; grid-row: 2; }
    .es-steps li:nth-child(6) { grid-column: 1; grid-row: 2; }
    .es-steps li:nth-child(3)::after { content: '↓'; right: calc(50% - .7rem); top: auto; bottom: -1.32rem; }
    .es-steps li:nth-child(4)::after, .es-steps li:nth-child(5)::after { content: '←'; right: auto; left: -1.05rem; }
}
@media (max-width: 760px) {
    .es-steps { grid-template-columns: 1fr; }
    .es-steps li:not(:last-child)::after { content: '↓'; right: calc(50% - .7rem); top: auto; bottom: -1.32rem; }
    .es-step-detail { flex-direction: column; gap: .7rem; }
    .es-previews { grid-template-columns: 1fr; }
    .es-screen-body { padding: 1.2rem; }
    .es-finance-note { padding: 1.4rem; gap: .8rem; }
    .es-finance-note > .fa { font-size: 1.3rem; }
    .es-screen-bar { font-size: .75rem; }
    .es-workflow, .es-preview-section, .es-use-cases { padding: 2rem 0; }
}