.bn-registration-card {
    overflow: hidden;
    border: 1px solid var(--d-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(22, 45, 80, .05);
}

.bn-registration-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--d-line);
}

.bn-registration-title {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}

.bn-registration-icon {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    color: #2864e5;
    background: #edf4ff;
}

.bn-registration-icon .fi-icon { width: 20px; height: 20px; }
.bn-registration-title h2 { margin: 0; color: var(--d-ink); font-size: .95rem; font-weight: 750; }
.bn-registration-title p { margin: .15rem 0 0; color: var(--d-muted); font-size: .72rem; line-height: 1.45; }

.bn-registration-reference {
    display: grid;
    gap: .12rem;
    max-width: 270px;
    text-align: right;
}

.bn-registration-reference span,
.bn-registration-foot span {
    color: var(--d-muted);
    font-size: .66rem;
    font-weight: 700;
    text-transform: uppercase;
}

.bn-registration-reference strong { overflow-wrap: anywhere; color: #2457b8; font-size: .78rem; }
.bn-progress-track { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 1.15rem 1.1rem; }
.bn-progress-step { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: .55rem; min-width: 0; padding-right: .65rem; }
.bn-progress-step:not(:last-child)::after { content: ''; position: absolute; z-index: 0; top: 14px; left: 29px; right: -1px; height: 2px; background: #e2e8f0; }
.bn-progress-marker { position: relative; z-index: 1; display: grid; width: 30px; height: 30px; place-items: center; border: 2px solid #d6deea; border-radius: 50%; color: #77879d; background: #fff; font-size: .68rem; font-weight: 800; }
.bn-progress-marker .fi-icon { width: 14px; height: 14px; }
.bn-progress-step.is-complete .bn-progress-marker { color: #fff; border-color: #20a878; background: #20a878; }
.bn-progress-step.is-complete:not(:last-child)::after { background: #83d5b8; }
.bn-progress-step.is-current .bn-progress-marker { color: #fff; border-color: #2864e5; background: #2864e5; box-shadow: 0 0 0 4px rgba(40, 100, 229, .11); }
.bn-progress-content { display: grid; align-content: start; min-width: 0; gap: .16rem; }
.bn-progress-content > .fi-icon { display: none; }
.bn-progress-content strong { color: #42536b; font-size: .72rem; line-height: 1.35; }
.bn-progress-content small { color: #8290a3; font-size: .62rem; line-height: 1.4; }
.bn-progress-state { justify-self: start; margin-top: .18rem; color: #1e5bd6; font-size: .6rem; font-weight: 750; }
.bn-progress-step.is-complete .bn-progress-state { color: #15825d; }
.bn-registration-foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1.1rem; border-top: 1px solid var(--d-line); background: #f8fafc; }
.bn-registration-foot > div { display: grid; gap: .1rem; }
.bn-registration-foot strong { color: var(--d-ink); font-size: .78rem; }
.dark .bn-registration-card { background: #101d31; }
.dark .bn-registration-icon { color: #a9c5ff; background: rgba(56, 105, 231, .16); }
.dark .bn-registration-foot { background: #0d192a; }

@media (max-width: 760px) {
    .bn-registration-head { align-items: flex-start; flex-direction: column; }
    .bn-registration-reference { max-width: none; text-align: left; }
    .bn-progress-track { grid-template-columns: 1fr !important; padding: .75rem 1rem; }
    .bn-progress-step { grid-template-columns: 34px minmax(0, 1fr); min-height: 72px; padding: 0 0 .75rem; }
    .bn-progress-step:not(:last-child)::after { top: 30px; bottom: 0; left: 16px; right: auto; width: 2px; height: auto; }
    .bn-progress-marker { width: 34px; height: 34px; }
    .bn-progress-content { padding: .1rem 0 0; }
    .bn-progress-content strong { font-size: .8rem; }
    .bn-progress-content small { font-size: .69rem; }
    .bn-registration-foot { align-items: flex-start; flex-direction: column; }
}