/* SBank client visual system v2
   A standalone client stylesheet loaded only by views/layout.ejs.
   It has no dependency on the legacy client or back-office stylesheets. */

*, *::before, *::after { box-sizing: border-box; }
html { min-height: 100%; -webkit-text-size-adjust: 100%; }
body { min-height: 100vh; margin: 0; display: flex; flex-direction: column; font-size: 14.5px; line-height: 1.55; }
main { display: block; }
img, svg { max-width: 100%; }
img { height: auto; }
button, input, select, textarea { margin: 0; }
button, [role="button"] { cursor: pointer; }
[hidden], .is-hidden { display: none !important; }
.i18n-loading [data-i18n] { visibility: hidden; }
.i18n-loading [data-i18n-ready] { visibility: visible; }

:root {
  --client-navy-950: #071a2f;
  --client-navy-900: #0a2340;
  --client-navy-800: #12365b;
  --client-blue-700: #164f86;
  --client-blue-100: #eaf2f8;
  --client-paper: #ffffff;
  --client-canvas: #f4f6f8;
  --client-line: #dce3e9;
  --client-line-soft: #e9eef2;
  --client-text: #10243a;
  --client-muted: #617080;
  --client-success: #20735a;
  --client-warning: #9a6814;
  --client-danger: #b43b47;
  --client-radius: 6px;
  --client-shadow: 0 1px 2px rgba(7, 26, 47, .05), 0 10px 30px rgba(7, 26, 47, .035);
  --client-ease: cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; }

body {
  color: var(--client-text) !important;
  background: var(--client-canvas) !important;
  font-family: "IBM Plex Sans", Arial, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: -.006em;
}

body[data-scope="marketing"] { background: var(--client-paper) !important; }
body, button, input, select, textarea { font-family: "IBM Plex Sans", Arial, sans-serif !important; }
body strong, body b { font-weight: 400 !important; }

body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .ui-title,
body .card-title,
body .banking-card__title,
body .loan-panel__title {
  color: var(--client-navy-950);
  font-weight: 400 !important;
  letter-spacing: -.035em;
}

body h1, body .ui-title { font-size: clamp(30px, 4vw, 44px) !important; line-height: 1.08 !important; }
body h2 { font-size: clamp(27px, 3.2vw, 40px) !important; line-height: 1.12 !important; }
body h3 { font-size: 21px !important; line-height: 1.25 !important; }

body a { color: var(--client-blue-700); text-underline-offset: 3px; }
body a:hover { color: var(--client-navy-950); }

body .container { width: min(100% - 40px, 1216px) !important; max-width: 1216px !important; margin-right: auto !important; margin-left: auto !important; }
body .page-content { flex: 1 0 auto; padding: 42px 0 72px !important; }
body[data-scope="marketing"] .page-content { padding: 0 0 42px !important; overflow: clip; }
body main.page-content > .container > .page-content { width: 100%; padding: 0 !important; }
body main.page-content > .container > .page-content > .container { width: 100% !important; max-width: none !important; margin: 0 !important; }

/* Header */
body .site-header {
  position: sticky !important;
  top: 0;
  z-index: 1003;
  min-height: 68px;
  border: 0 !important;
  border-bottom: 1px solid rgba(7, 26, 47, .08) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
}

body .site-header .header-inner {
  display: flex;
  align-items: center;
  min-height: 68px !important;
  padding: 0 !important;
  gap: 30px !important;
}

body .site-header .logo { display: inline-flex; flex: 0 0 auto; align-items: center; text-decoration: none; line-height: 1; }
body .site-header .nav { display: flex; flex: 1 1 auto; align-items: center; }
/* Retired mobile drawer banner must never leak into the desktop layout. */
body .site-header .nav .nav-drawer-head { display: none !important; }
body .site-header .header-actions { display: flex; flex: 0 0 auto; align-items: center; margin-left: auto; }
body .site-header .nav-toggle { display: none; width: 42px; height: 42px; align-items: center; justify-content: center; padding: 0; }
body .hamburger { display: grid; width: 20px; gap: 4px; }
body .hamburger span { display: block; height: 1px; background: currentColor; }
body .nav-scrim { position: fixed; inset: 0; z-index: 1001; background: rgba(7,26,47,.38); backdrop-filter: blur(2px); }
body .nav-lang,
body .notif-menu,
body .profile-menu,
body .lang-picker { position: relative; }
body .nav-ico,
body .notif-ico,
body .profile-ico,
body .profile-caret,
body .mi-ico,
body .lang-caret { display: inline-flex; align-items: center; justify-content: center; }
body .notif-trigger,
body .profile-trigger { position: relative; display: inline-flex; min-width: 42px; height: 42px; align-items: center; justify-content: center; gap: 4px; padding: 0; color: var(--client-navy-800); }
body .notif-trigger svg,
body .profile-trigger svg { width: 19px; height: 19px; stroke-width: 1.7; }
body .profile-caret svg { width: 13px; height: 13px; }
body .notif-badge,
body .chat-badge {
  display: inline-grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  padding: 0 4px;
  border: 2px solid #fff;
  border-radius: 9px;
  color: #fff;
  background: var(--client-danger);
  font-size: 9px;
  line-height: 1;
}
body .notif-badge { position: absolute; top: 2px; right: 1px; }
body .profile-dropdown,
body .notif-dropdown,
body .nav-lang .lang-dropdown,
body .lang-picker .lang-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 1010;
  display: none;
  width: 260px;
  overflow: hidden;
}
body .notif-dropdown.open,
body .profile-dropdown.open,
body .nav-lang.is-open .lang-dropdown,
body .lang-picker.is-open .lang-dropdown,
body .lang-dropdown.open { display: block; }
body .notif-head,
body .profile-head { padding: 16px; border-bottom: 1px solid var(--client-line-soft); }
body .profile-name,
body .notif-head { color: var(--client-navy-950); font-size: 14px; }
body .profile-meta,
body .notif-empty { color: var(--client-muted); font-size: 11.5px; overflow-wrap: anywhere; }
body .notif-empty { padding: 18px 16px; }
body .menu-item {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 0;
  color: var(--client-text);
  background: transparent;
  font: inherit;
  font-size: 12.5px;
  text-align: left;
  text-decoration: none;
}
body .menu-item:hover { color: var(--client-navy-950); background: var(--client-canvas); }
body .menu-item .mi-ico { width: 19px; color: var(--client-muted); }
body .menu-divider { height: 1px; background: var(--client-line-soft); }
body .lang-dropdown { max-height: 320px; overflow-y: auto !important; }
body .flag-circle { display: inline-flex; width: 19px; height: 19px; align-items: center; justify-content: center; overflow: hidden; border-radius: 50%; }

body .site-header .logo {
  color: var(--client-navy-950) !important;
  font-size: 21px !important;
  font-weight: 400 !important;
  letter-spacing: -.045em;
}

body .site-header .logo::after {
  content: "BUSINESS";
  display: inline-block;
  margin-left: 9px;
  color: var(--client-muted);
  font-size: 9px;
  font-weight: 400;
  letter-spacing: .13em;
  vertical-align: 2px;
}

body .site-header .nav { gap: 22px !important; }
body .site-header .nav-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 68px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--client-muted) !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  line-height: 1.2;
  transition: color 180ms var(--client-ease) !important;
}

body .site-header .nav-link::after {
  right: 0 !important;
  bottom: -1px !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  border-radius: 0 !important;
  background: var(--client-navy-900) !important;
  transform: scaleX(0) !important;
  transform-origin: right;
  transition: transform 200ms var(--client-ease) !important;
}

body .site-header .nav-link:hover,
body .site-header .nav-link.active { color: var(--client-navy-950) !important; }
body .site-header .nav-link:hover::after,
body .site-header .nav-link.active::after { transform: scaleX(1) !important; transform-origin: left; }
body .site-header .nav-ico { color: currentColor !important; opacity: .82; }
body .site-header .nav-ico svg { width: 17px !important; height: 17px !important; stroke-width: 1.7; transition: transform 180ms var(--client-ease); }
body .site-header .nav-link:hover .nav-ico svg { transform: translateY(-2px); }

body .header-actions { gap: 10px !important; }
body .profile-trigger,
body .notif-trigger,
body .lang-current,
body .nav-toggle {
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
}
body .profile-trigger:hover,
body .notif-trigger:hover,
body .lang-current:hover,
body .nav-toggle:hover {
  color: var(--client-blue-700) !important;
  background: transparent !important;
}

/* Buttons, controls and focus */
body .btn,
body button.btn,
body a.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  vertical-align: middle;
  min-height: 42px;
  padding: 10px 17px !important;
  border: 1px solid var(--client-line) !important;
  border-radius: 4px !important;
  color: var(--client-navy-950) !important;
  background: var(--client-paper) !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  text-align: center;
  letter-spacing: -.01em;
  transition: color 180ms var(--client-ease), background 180ms var(--client-ease), border-color 180ms var(--client-ease), transform 180ms var(--client-ease) !important;
}

body .btn:hover { border-color: #b8c5d0 !important; background: var(--client-canvas) !important; transform: translateY(-1px); }
body .btn:active { transform: translateY(0); }
body .btn.primary,
body .btn-primary,
body button.primary {
  border-color: var(--client-navy-900) !important;
  color: #fff !important;
  background: var(--client-navy-900) !important;
}
body .btn.primary:hover,
body .btn-primary:hover,
body button.primary:hover { border-color: var(--client-blue-700) !important; background: var(--client-blue-700) !important; }
body .btn.ghost,
body .btn-secondary,
body .btn--soft { border-color: var(--client-line) !important; background: transparent !important; }
body .btn.small, body .btn-sm { min-height: 34px; padding: 7px 11px !important; font-size: 12px !important; }
body .btn .ico-wrap,
body .btn .btn-ico,
body .btn .btn__ico { display: inline-flex; width: 18px; height: 18px; flex: 0 0 18px; align-items: center; justify-content: center; line-height: 0; }
body .btn .ico-wrap svg,
body .btn .btn-ico svg,
body .btn .btn__ico svg { display: block; width: 17px !important; height: 17px !important; flex: 0 0 17px; stroke-width: 1.7; }
body .btn:hover .ico-wrap svg,
body .btn:hover .btn-ico svg,
body .btn:hover .btn__ico svg { transform: none; }

body :focus-visible { outline: 2px solid var(--client-blue-700) !important; outline-offset: 3px !important; box-shadow: none !important; }

body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
body select,
body textarea,
body .input {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 0 !important;
  border-bottom: 1px solid #aebdca !important;
  border-radius: 0 !important;
  color: var(--client-text) !important;
  background-color: transparent !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.35;
  transition: border-color 160ms var(--client-ease), box-shadow 160ms var(--client-ease) !important;
}
body select {
  appearance: none;
  padding-right: 42px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23566b7d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 13px center !important;
  background-size: 16px !important;
}
body textarea { min-height: 112px; padding-block: 12px; resize: vertical; }
body input::placeholder,
body textarea::placeholder { color: #8a98a5; opacity: 1; }
body input:not([type="checkbox"]):not([type="radio"]):hover,
body select:hover,
body textarea:hover,
body .input:hover { border-bottom-color: #7f93a4 !important; background-color: transparent !important; }
body input:focus, body select:focus, body textarea:focus, body .input:focus {
  border-bottom-color: var(--client-blue-700) !important;
  background-color: transparent !important;
  box-shadow: inset 0 -1px 0 var(--client-blue-700) !important;
}
body input:focus-visible, body select:focus-visible, body textarea:focus-visible, body .input:focus-visible { outline: 0 !important; }
body input:disabled, body select:disabled, body textarea:disabled, body .input:disabled {
  border-color: var(--client-line-soft) !important;
  color: #758594 !important;
  background-color: var(--client-canvas) !important;
  cursor: not-allowed;
  opacity: 1;
}
body [aria-invalid="true"], body .input.is-invalid { border-color: var(--client-danger) !important; }
body input:-webkit-autofill,
body input:-webkit-autofill:hover,
body input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--client-text) !important;
  caret-color: var(--client-text);
  box-shadow: inset 0 0 0 1000px #fff, inset 0 -1px 0 var(--client-blue-700) !important;
  transition: background-color 9999s ease-out 0s;
}
body input[type="file"] {
  width: 100%;
  min-height: 46px;
  padding: 5px;
  border: 1px solid var(--client-line) !important;
  border-radius: 4px !important;
  color: var(--client-muted);
  background: var(--client-paper);
  font-size: 12.5px;
}
body input[type="file"]::file-selector-button {
  min-height: 34px;
  margin-right: 12px;
  padding: 7px 12px;
  border: 0;
  border-radius: 3px;
  color: var(--client-navy-950);
  background: var(--client-canvas);
  font: inherit;
  cursor: pointer;
}
body .label, body label { color: var(--client-navy-800); font-size: 12.5px; font-weight: 400 !important; line-height: 1.35; }
body .hint, body .help, body .muted, body .text-small { color: var(--client-muted) !important; font-weight: 400 !important; }

body .form-grid,
body .form-grid.grid-2,
body .pr3-grid,
body .review-grid,
body .kv-grid,
body .loan-review__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
body .form-grid.narrow { grid-template-columns: 1fr; }
body .form-grid .full,
body .form-grid .is-wide,
body .pr3-span { grid-column: 1 / -1; }
body .form-grid label,
body .field,
body .form-field,
body .form-row { display: flex; min-width: 0; flex-direction: column; gap: 7px; }
body .field-row { display: flex; flex-wrap: wrap; gap: 16px; }
body .field-row > * { flex: 1 1 220px; }
body .form-actions,
body .kyc-actions,
body .wz-actions,
body .pr3-actions,
body .receipt-actions,
body .loan-list-actions,
body .loan-pay-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
body .form-actions { grid-column: 1 / -1; margin-top: 6px; }
body .input-wrap,
body .input-addon-wrap { position: relative; display: flex; align-items: center; }
body .input-wrap input,
body .input-addon-wrap input { width: 100%; }
body .input-wrap .icon-btn { position: absolute; right: 5px; width: 34px; height: 34px; }
body .input-addon { position: absolute; right: 12px; color: var(--client-muted); font-size: 12px; pointer-events: none; }
body .check,
body .checkbox,
body .checkline,
body .check-row { display: flex; align-items: flex-start; gap: 10px; }
body input[type="checkbox"],
body input[type="radio"] { width: 17px; height: 17px; flex: 0 0 auto; accent-color: var(--client-navy-900); }
body .mono { font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace !important; font-size: .93em; }
body .ta-r { text-align: right; }
body .row { display: flex; gap: 12px; }
body .small { font-size: 12px !important; }

/* Page hierarchy */
body .page-titlebar,
body .page-head {
  margin-bottom: 8px !important;
  padding: 0 !important;
  border: 0 !important;
}
body .page-titlebar .ui-title,
body .page-head .ui-title { display: flex; align-items: center; gap: 12px; margin: 0 !important; }
body .title-ico {
  display: inline-grid !important;
  width: 24px !important;
  height: 24px !important;
  place-items: center;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--client-blue-700) !important;
  background: transparent !important;
}
body .title-ico svg { width: 22px !important; height: 22px !important; stroke-width: 1.6; }
body .page-subhead {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 30px !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid var(--client-line) !important;
}
body .page-intro { max-width: 690px; margin: 0 !important; color: var(--client-muted) !important; font-size: 15px !important; line-height: 1.65 !important; }
body .page-actions { display: flex; flex-wrap: wrap; gap: 8px !important; }

/* Surfaces: one level of elevation, nested content stays flat */
body .card,
body .banking-card,
body .loan-panel,
body .transfer-card,
body .convert-card,
body .review-card,
body .status-card,
body .maintenance-panel,
body .legal-card,
body .pr3-panel {
  border: 0 !important;
  border-radius: var(--client-radius) !important;
  background: var(--client-paper) !important;
  box-shadow: none !important;
}

body .card { padding: 26px; }
body .banking-card,
body .loan-panel,
body .transfer-card,
body .convert-card,
body .review-card,
body .status-card,
body .maintenance-panel { padding: 28px; }
body .card-head,
body .banking-card__head,
body .loan-panel__head,
body .transfer-head,
body .review-card__title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 17px;
}
body .banking-card__body,
body .loan-panel__body,
body .transfer-body { padding: 20px 0; }
body .banking-card__footer,
body .transfer-footer { padding: 18px 0 0; border-top: 1px solid var(--client-line-soft); }
body .card-title,
body .banking-card__title,
body .loan-panel__title,
body .transfer-title,
body .review-card__title { font-size: 17px !important; line-height: 1.3; }
body .card-text,
body .loan-panel__sub,
body .transfer-subtitle { color: var(--client-muted); font-size: 12.5px; }

body .card .card,
body .banking-card .card,
body .loan-panel .card,
body .transfer-card .card,
body .convert-card .card,
body .review-card .card,
body .pr3-panel .card {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body .divider, body .ui-sep, body .soft-hr { height: 1px !important; border: 0 !important; background: var(--client-line-soft) !important; }

body .badge,
body .pill,
body .support-status,
body .loan-status,
body .ac-tag,
body .unread-count {
  padding: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
body .badge::before,
body .pill::before,
body .support-status::before,
body .loan-status::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 50%;
  background: currentColor;
  vertical-align: 1px;
}

body .alert,
body .sys-note,
body .acc-alert,
body .loan-info-note,
body .marketing-note {
  border: 0 !important;
  border-left: 2px solid var(--client-blue-700) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body .alert {
  display: flex;
  min-height: 0;
  align-items: flex-start;
  margin: 18px 0;
  padding: 2px 0 2px 12px !important;
  color: var(--client-blue-700) !important;
  background: transparent !important;
  font-size: 12.5px;
  line-height: 1.45;
}
body .alert.error,
body .acc-alert--danger { border-left-color: var(--client-danger) !important; background: transparent !important; }
body .alert.error { border-left-color: var(--client-danger) !important; color: var(--client-danger) !important; background: transparent !important; }
body .alert.success,
body .acc-alert--success { border-left-color: var(--client-success) !important; background: transparent !important; }
body .alert.success { color: var(--client-success) !important; background: transparent !important; }
body .alert.warn,
body .acc-alert--warning { border-left-color: var(--client-warning) !important; background: transparent !important; }
body .alert.warn { color: var(--client-warning) !important; background: transparent !important; }

/* Tables and transactional rows */
body table { width: 100%; border-collapse: collapse !important; }
body th {
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--client-line) !important;
  color: var(--client-muted) !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}
body td { padding: 14px 12px !important; border: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; font-weight: 400 !important; }
body tbody tr { transition: background 150ms var(--client-ease); }
body tbody tr:hover { background: #f8fafb !important; }
body .tx-list > *, body .accounts-list > *, body .notify-list > * { border-color: var(--client-line-soft) !important; }

/* Modal and menus */
body .modal { position: fixed; inset: 0; z-index: 1200; display: none; align-items: center; justify-content: center; padding: 20px; }
body .modal[aria-hidden="false"], body .modal.is-open, body .modal.open { display: flex; }
body .modal__backdrop { position: absolute; inset: 0; }
body .modal__panel { position: relative; z-index: 1; width: min(100%, 620px); max-height: min(88vh, 780px); overflow: auto; }
body .modal__head,
body .modal__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; }
body .modal__body { padding: 20px; }
body .modal__foot { justify-content: flex-end; }
body .modal__title { color: var(--client-navy-950); font-size: 18px; }
body .modal__subtitle { margin-top: 3px; font-size: 12px; }
body .modal__toast { display: none; margin: 12px 20px 0; padding: 10px 12px; border-left: 2px solid var(--client-blue-700); background: var(--client-blue-100); }
body .modal__toast[data-show="1"] { display: block; }
body .modal__backdrop { background: rgba(7, 26, 47, .48) !important; backdrop-filter: blur(4px); }
body .modal__panel,
body .profile-dropdown,
body .notif-dropdown,
body .lang-dropdown {
  border: 1px solid var(--client-line) !important;
  border-radius: var(--client-radius) !important;
  background: var(--client-paper) !important;
  box-shadow: 0 18px 55px rgba(7, 26, 47, .15) !important;
}
body .modal__head { border-bottom: 1px solid var(--client-line-soft) !important; }
body .modal__foot { border-top: 1px solid var(--client-line-soft) !important; }
body .icon-btn { border: 0 !important; border-radius: 0 !important; background: transparent !important; }
body .icon-btn:hover { color: var(--client-blue-700) !important; background: transparent !important; }

/* Marketing */
body[data-scope="marketing"] .container { max-width: 1240px !important; }
body .biz-eyebrow {
  margin-bottom: 18px;
  color: var(--client-blue-700);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body .biz-eyebrow--light { color: #a9c4dc; }

body .biz-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .93fr) minmax(460px, 1.07fr);
  gap: clamp(42px, 6vw, 82px);
  align-items: center;
  min-height: 650px;
  padding: 58px 0 62px;
  color: #fff;
}
body .biz-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  background: var(--client-navy-950);
  transform: translateX(-50%);
}
body .biz-hero__content { position: relative; z-index: 1; }
body .biz-hero .biz-eyebrow { color: #9fc2df; }
body .biz-hero h1 { max-width: 650px; margin: 0; color: #fff; font-size: clamp(48px, 5.2vw, 74px) !important; line-height: .99 !important; letter-spacing: -.055em; }
body .biz-hero__lead { max-width: 650px; margin: 28px 0 0; color: #c4d3df; font-size: clamp(17px, 1.8vw, 20px); line-height: 1.55; }
body .biz-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
body .biz-hero__actions .btn { min-height: 48px; padding: 12px 20px !important; }
body .biz-hero__actions .btn.primary { border-color: #fff !important; color: var(--client-navy-950) !important; background: #fff !important; }
body .biz-hero__actions .btn.ghost { border-color: rgba(255,255,255,.38) !important; color: #fff !important; background: transparent !important; }
body .biz-hero__actions .btn:hover { border-color: #fff !important; background: #edf4f8 !important; }
body .biz-hero__actions .btn.ghost:hover { color: var(--client-navy-950) !important; }
body .biz-hero__trust { display: flex; flex-wrap: wrap; gap: 25px; margin-top: 38px; padding-top: 23px; border-top: 1px solid rgba(255,255,255,.18); }
body .biz-trust-item { display: inline-flex; align-items: center; gap: 8px; color: #b8cbd9; font-size: 12.5px; }
body .biz-trust-item__icon { display: inline-flex; color: #86b7db; }
body .biz-trust-item__icon svg { width: 17px; height: 17px; stroke-width: 1.7; }
body .biz-hero__media { position: relative; min-height: 570px; margin: 0; overflow: hidden; background: var(--client-canvas); }
body .biz-hero__media::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(7, 26, 47, .06); pointer-events: none; }
body .biz-hero__media img { width: 100%; height: 570px; object-fit: cover; display: block; }
body .biz-photo-note {
  position: absolute;
  right: 22px;
  bottom: 22px;
  display: flex;
  min-width: 220px;
  flex-direction: column;
  gap: 3px;
  padding: 17px 19px;
  color: #fff;
  background: rgba(7, 26, 47, .9);
  backdrop-filter: blur(9px);
}
body .biz-photo-note__value { font-size: 17px; }
body .biz-photo-note__label { color: #cbd9e5; font-size: 11.5px; }

body .biz-proof {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 0 110px;
  border-top: 1px solid var(--client-line);
  border-bottom: 1px solid var(--client-line);
}
body .biz-proof__item { display: flex; min-height: 106px; flex-direction: column; justify-content: center; gap: 4px; padding: 20px 32px; border-right: 1px solid var(--client-line); }
body .biz-proof__item:first-child { padding-left: 0; }
body .biz-proof__item:last-child { border-right: 0; }
body .biz-proof__value { color: var(--client-navy-950); font-size: 20px; }
body .biz-proof__label { color: var(--client-muted); font-size: 12.5px; }

body .biz-section { padding: 92px 0; }
body .biz-section__heading { max-width: 790px; }
body .biz-section__heading h2 { max-width: 760px; margin: 0; }
body .biz-section__heading p { max-width: 660px; margin: 22px 0 0; color: var(--client-muted); font-size: 16px; line-height: 1.65; }
body .biz-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 60px; border-top: 1px solid var(--client-line); border-bottom: 1px solid var(--client-line); }
body .biz-feature { position: relative; min-height: 294px; padding: 34px 34px 38px; border-right: 1px solid var(--client-line); }
body .biz-feature:first-child { padding-left: 0; }
body .biz-feature:last-child { border-right: 0; }
body .biz-feature__icon { display: inline-flex; color: var(--client-blue-700); }
body .biz-feature__icon svg { width: 27px; height: 27px; stroke-width: 1.45; transition: transform 260ms var(--client-ease); }
body .biz-feature:hover .biz-feature__icon svg { transform: translateY(-4px) rotate(-3deg); }
body .biz-feature__number { position: absolute; top: 38px; right: 32px; color: #aab6c1; font-size: 11px; letter-spacing: .1em; }
body .biz-feature h3 { max-width: 240px; margin: 64px 0 14px; font-size: 25px !important; }
body .biz-feature p { max-width: 310px; margin: 0; color: var(--client-muted); font-size: 14px; line-height: 1.65; }

body .biz-split { display: grid; grid-template-columns: minmax(0, 1.07fr) minmax(390px, .93fr); gap: clamp(50px, 7vw, 96px); align-items: center; padding: 96px 0; }
body .biz-split--reverse .biz-split__media { order: 2; }
body .biz-split--reverse .biz-split__content { order: 1; }
body .biz-split__media { min-height: 520px; overflow: hidden; background: var(--client-canvas); }
body .biz-split__media img { display: block; width: 100%; height: 520px; object-fit: cover; transition: transform 700ms var(--client-ease); }
body .biz-split:hover .biz-split__media img { transform: scale(1.015); }
body .biz-split__content h2 { margin: 0; }
body .biz-split__content > p { margin: 23px 0 0; color: var(--client-muted); font-size: 15.5px; line-height: 1.68; }
body .biz-list { margin-top: 32px; border-top: 1px solid var(--client-line); }
body .biz-list__item { display: grid; grid-template-columns: 26px 1fr; gap: 14px; padding: 20px 0; border-bottom: 1px solid var(--client-line); color: var(--client-muted); font-size: 13px; line-height: 1.55; }
body .biz-list__icon { display: inline-flex; padding-top: 2px; color: var(--client-blue-700); }
body .biz-list__icon svg { width: 19px; height: 19px; stroke-width: 1.6; }
body .biz-list__title { display: block; margin-bottom: 4px; color: var(--client-navy-950); font-size: 15px; }
body .biz-text-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; color: var(--client-navy-950); font-size: 14px; text-decoration: none; }
body .biz-text-link::after { content: ""; position: absolute; }
body .biz-text-link svg { width: 18px; height: 18px; transition: transform 180ms var(--client-ease); }
body .biz-text-link:hover svg { transform: translateX(4px); }

body .biz-section--compliance { margin: 80px 0; padding: 82px clamp(30px, 5vw, 68px); background: var(--client-canvas); }
body .biz-control-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 52px; }
body .biz-control-item { display: flex; min-height: 188px; flex-direction: column; gap: 9px; padding: 26px 34px; border-left: 1px solid var(--client-line); color: var(--client-muted); font-size: 13px; line-height: 1.55; }
body .biz-control-item:first-child { padding-left: 0; border-left: 0; }
body .biz-control-item__icon { display: inline-flex; margin-bottom: 22px; color: var(--client-blue-700); }
body .biz-control-item__icon svg { width: 24px; height: 24px; stroke-width: 1.5; transition: transform 200ms var(--client-ease); }
body .biz-control-item:hover .biz-control-item__icon svg { transform: translateY(-3px); }
body .biz-control-item__title { color: var(--client-navy-950); font-size: 18px; }

body .biz-support-line { display: grid; grid-template-columns: 24px 1fr; gap: 13px; margin-top: 31px; padding: 21px 0; border-top: 1px solid var(--client-line); border-bottom: 1px solid var(--client-line); color: var(--client-muted); font-size: 13.5px; line-height: 1.6; }
body .biz-support-line__icon { display: inline-flex; color: var(--client-blue-700); }
body .biz-support-line__icon svg { width: 20px; height: 20px; stroke-width: 1.6; }

body .biz-onboarding { padding: 100px 0; }
body .biz-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 54px 0 0; padding: 0; border-top: 1px solid var(--client-line); border-bottom: 1px solid var(--client-line); list-style: none; }
body .biz-steps li { display: flex; min-height: 210px; flex-direction: column; padding: 30px 34px; border-right: 1px solid var(--client-line); color: var(--client-muted); font-size: 13px; line-height: 1.55; }
body .biz-steps li:first-child { padding-left: 0; }
body .biz-steps li:last-child { border-right: 0; }
body .biz-steps__number { color: var(--client-blue-700); font-size: 12px; letter-spacing: .08em; }
body .biz-steps__title { margin: auto 0 10px; color: var(--client-navy-950); font-size: 20px; }

body .biz-mobile { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .55fr); gap: 60px; align-items: end; margin: 38px 0 100px; padding: 54px 0; border-top: 1px solid var(--client-line); border-bottom: 1px solid var(--client-line); }
body .biz-mobile h2 { max-width: 720px; margin: 0; }
body .biz-mobile p { max-width: 680px; margin: 20px 0 0; color: var(--client-muted); font-size: 15px; line-height: 1.65; }
body .biz-mobile__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; }
body .biz-mobile__note { color: var(--client-muted); font-size: 11.5px; line-height: 1.5; }

body .biz-final { display: flex; align-items: center; justify-content: space-between; gap: 70px; padding: 65px 70px; color: #fff; background: var(--client-navy-950); }
body .biz-final h2 { max-width: 690px; margin: 0; color: #fff; }
body .biz-final__actions { display: flex; flex: 0 0 auto; flex-direction: column; gap: 9px; }
body .biz-final .biz-btn-light { border-color: #fff !important; color: var(--client-navy-950) !important; background: #fff !important; }
body .biz-final .biz-btn-outline { border-color: rgba(255,255,255,.34) !important; color: #fff !important; background: transparent !important; }
body .biz-final .biz-btn-outline:hover { border-color: #fff !important; background: rgba(255,255,255,.08) !important; }
body .biz-regulatory { margin: 22px 0 0; color: #83909c; font-size: 10.5px; line-height: 1.55; }

/* Authentication, registration, KYC and legal */
body .page-split--auth { display: grid !important; grid-template-columns: minmax(0, .88fr) minmax(360px, 1.12fr) !important; gap: 72px !important; align-items: stretch; }
body .page-split--auth .auth-form { padding: 44px 0 !important; }
body .page-split--auth .page-split__aside { overflow: hidden; border: 0 !important; border-radius: 0 !important; background: var(--client-navy-950) !important; box-shadow: none !important; }
body .auth-visual__img { min-height: 440px; object-fit: cover; opacity: .86; }
body .auth-visual__cap { color: #d9e5ee !important; background: var(--client-navy-950) !important; }

/* Sign in — a single composed surface, without nested cards. */
body .access-shell {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr);
  min-height: 610px;
  overflow: hidden;
  background: #fff;
}
body .access-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(48px, 6vw, 86px);
  color: #fff;
  background: var(--client-navy-950);
}
body .access-intro h1 {
  max-width: 590px;
  margin: 0;
  color: #fff;
  font-size: clamp(40px, 4vw, 56px) !important;
  line-height: 1.06 !important;
}
body .access-intro > p {
  max-width: 560px;
  margin: 28px 0 0;
  color: #bfd0dd;
  font-size: 17px;
  line-height: 1.65;
}
body .access-assurance {
  display: flex;
  flex-wrap: wrap;
  gap: 22px;
  margin-top: 42px;
  padding-top: 0;
  border-top: 0;
}
body .access-assurance > span { display: inline-flex; align-items: center; gap: 8px; color: #b9cbd8; font-size: 12.5px; }
body .access-assurance svg { width: 17px; height: 17px; color: #8cb9da; stroke-width: 1.7; }
body .access-form-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(46px, 6vw, 82px);
  border-top: 1px solid var(--client-line-soft);
  border-right: 1px solid var(--client-line-soft);
  border-bottom: 1px solid var(--client-line-soft);
}
body .access-form-head { max-width: 430px; }
body .access-kicker { margin-bottom: 13px; color: var(--client-blue-700); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
body .access-form-head h2 { margin: 0; font-size: clamp(36px, 4vw, 50px) !important; }
body .access-form-head p { margin: 14px 0 0; color: var(--client-muted); font-size: 14px; line-height: 1.6; }
body .access-form { display: grid; gap: 20px; max-width: 430px; margin-top: 34px; }
body .access-form label { display: grid; gap: 9px; color: var(--client-navy-800); font-size: 12.5px; }
body .access-form input { width: 100%; height: 50px; }
body .access-form input:focus { border-color: var(--client-blue-700) !important; }
body .access-submit { width: 100%; min-height: 50px !important; justify-content: space-between !important; margin-top: 6px; }
body .access-help { display: flex; flex-wrap: wrap; gap: 8px 16px; max-width: 430px; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--client-line-soft); color: var(--client-muted); font-size: 12px; }
body .access-help a { color: var(--client-navy-950); text-decoration: none; }
body .access-help a:hover { color: var(--client-blue-700); }
body .narrow { max-width: 540px !important; }
body .kyc-shell,
body .kyc-form,
body .loan-wizard,
body .transfer-shell { gap: 20px !important; }
body .kyc-stepper-min,
body .tr-stepper-min { padding: 18px 0 !important; border: 0 !important; border-top: 1px solid var(--client-line) !important; border-bottom: 1px solid var(--client-line) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body .kyc-step-iconWrap,
body .tr-step-iconWrap { border-radius: 0 !important; background: transparent !important; }
body .kyc-step-item.is-active .kyc-step-iconWrap,
body .tr-step-item.is-active .tr-step-iconWrap { color: var(--client-blue-700) !important; background: transparent !important; }
body .upload-card,
body .file-uploader-ui { border: 1px dashed #b6c4cf !important; border-radius: 4px !important; background: #fbfcfd !important; box-shadow: none !important; }
body .kyc-shell,
body .kyc-form,
body .loan-wizard { width: 100%; }
/* Visibility is controlled by kyc.js through inline display values. */
body .kyc-step { display: block; }
body .kyc-step.active,
body .kyc-step.is-active { display: block; }
body .kyc-title,
body .wz-title,
body .upload-title { color: var(--client-navy-950); font-size: 20px; font-weight: 400 !important; }
body .kyc-title .sub,
body .wz-sub { margin-top: 6px; color: var(--client-muted); font-size: 12.5px; }
body .kyc-form,
body .loan-wizard,
body .box { padding: 28px; border: 0; border-radius: var(--client-radius); background: #fff; box-shadow: var(--client-shadow); }
body .upload-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
body .upload-card { min-height: 170px; padding: 18px; }
body .upload-preview { display: grid; min-height: 86px; place-items: center; margin-top: 12px; overflow: hidden; background: var(--client-canvas); }
body .upload-preview img { max-height: 180px; object-fit: contain; }
body .file-uploader-ui { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px; }
body .file-uploader-left,
body .file-uploader-buttons { display: flex; align-items: center; gap: 12px; }
body .file-uploader-ico { display: inline-flex; color: var(--client-blue-700); }
body .file-uploader-text { display: flex; flex-direction: column; gap: 3px; }
body .file-uploader-sub,
body .file-uploader-note { color: var(--client-muted); font-size: 11px; }
body .kyc-review { display: grid; gap: 16px; }
body .kyc-review-block { padding: 18px 0; border-bottom: 1px solid var(--client-line-soft); }
body .kyc-review-title { margin-bottom: 12px; color: var(--client-navy-950); font-size: 17px; }
body .kyc-kv { display: grid; grid-template-columns: minmax(140px,.45fr) 1fr; gap: 10px 18px; }
body .kyc-kv .k { color: var(--client-muted); }
body .kyc-submit-overlay { position: fixed; inset: 0; z-index: 1400; display: none; place-items: center; color: #fff; background: rgba(7,26,47,.7); backdrop-filter: blur(5px); }
body .kyc-submit-overlay.is-active { display: grid; }
body .spinner { width: 28px; height: 28px; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; border-radius: 50%; animation: client-spin .8s linear infinite; }
@keyframes client-spin { to { transform: rotate(360deg); } }
body .status-card { display: grid; grid-template-columns: 54px 1fr; gap: 24px; max-width: 880px; margin: 30px auto; }
body .status-icon { display: inline-grid; width: 28px; height: 28px; place-items: center; color: var(--client-blue-700); background: transparent; }
body .status-title { margin: 0; font-size: clamp(28px,4vw,40px) !important; }
body .status-text { max-width: 730px; color: var(--client-muted); line-height: 1.7; }
body .status-meta { margin-top: 24px; border-top: 1px solid var(--client-line-soft); }
body .meta-row { display: grid; grid-template-columns: minmax(150px,.4fr) 1fr; gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--client-line-soft); }
body .meta-k { color: var(--client-muted); font-size: 11.5px; }
body .status-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
body .status-footnote { margin-top: 22px; color: var(--client-muted); font-size: 11px; }
body .kyc-status { display: inline-flex; align-items: center; gap: 7px; color: var(--client-warning); }
body .kyc-status[data-kind="approved"] { color: var(--client-success); }
body .kyc-status[data-kind="rejected"] { color: var(--client-danger); }
body .maintenance-panel { max-width: 800px; margin: 40px auto; }
body .maintenance-panel__head { display: flex; align-items: flex-start; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid var(--client-line-soft); }
body .maintenance-panel__title { font-size: 25px; }
body .maintenance-facts { margin-top: 20px; }
body .maintenance-facts__row { display: grid; grid-template-columns: minmax(150px,.4fr) 1fr; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--client-line-soft); }
body .maintenance-facts__label { color: var(--client-muted); }
body .legal-card { padding: clamp(28px, 5vw, 58px) !important; }
body .legal-card h2 { margin-top: 44px; font-size: 24px !important; }
body .legal-card p, body .legal-card li { color: #43566a; line-height: 1.75; }

/* Banking overview */
body[data-page="bank"] .banking-page { max-width: none !important; }
body[data-page="bank"] .banking-hero-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
body[data-page="bank"] .banking-hero-card__meta,
body[data-page="bank"] .banking-session { display: flex; align-items: center; gap: 7px; }
body[data-page="bank"] .banking-hero-card__meta { margin-top: 7px; font-size: 12px; }
body[data-page="bank"] .banking-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-page="bank"] .banking-card--full { grid-column: 1 / -1; }
body[data-page="bank"] .banking-card__head { display: flex; align-items: center; justify-content: space-between; }
body[data-page="bank"] .balance-structure,
body[data-page="bank"] .month-summary { margin-top: 12px; }
body[data-page="bank"] .month-summary { display: grid; grid-template-columns: repeat(3, 1fr); }
body[data-page="bank"] .month-summary__item { min-width: 0; padding: 17px 14px; }
body[data-page="bank"] .month-summary__label { color: var(--client-muted); font-size: 11.5px; }
body[data-page="bank"] .month-summary__value { margin-top: 4px; font-size: 17px; }
body[data-page="bank"] .banking-card__footer { margin-top: 22px; }
body[data-page="bank"] .qa-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; }
body[data-page="bank"] .qa-row--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-page="bank"] .qa-btn { display: flex; align-items: center; gap: 9px; text-decoration: none; }
body[data-page="bank"] .qa-btn__ico { display: inline-flex; }
body[data-page="bank"] .qa-btn__ico svg { width: 18px; height: 18px; }
body[data-page="bank"] .account-row,
body[data-page="bank"] .tx-row,
body[data-page="bank"] .notify-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; }
body[data-page="bank"] .banking-hero-card {
  min-height: auto !important;
  margin-bottom: 28px !important;
  padding: 0 0 24px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--client-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-page="bank"] .banking-hero-card__title { font-size: clamp(28px, 4vw, 42px) !important; font-weight: 400 !important; letter-spacing: -.04em; }
body[data-page="bank"] .banking-session { padding: 0 !important; border: 0 !important; border-radius: 0 !important; color: var(--client-success) !important; background: transparent !important; }
body[data-page="bank"] .banking-grid { gap: 18px !important; }
body[data-page="bank"] .banking-card { padding: 28px !important; }
body[data-page="bank"] .banking-card__head { padding-bottom: 16px !important; border-bottom: 1px solid var(--client-line-soft) !important; }
body[data-page="bank"] .banking-card__title { font-size: 17px !important; letter-spacing: -.02em; }
body[data-page="bank"] .banking-card__amount--xl { margin-top: 24px; font-size: clamp(32px, 4vw, 48px) !important; font-weight: 400 !important; }
body[data-page="bank"] .banking-subtitle { color: var(--client-muted) !important; font-size: 11px !important; font-weight: 400 !important; letter-spacing: .06em; text-transform: uppercase; }
body[data-page="bank"] .month-summary { border-top: 1px solid var(--client-line-soft) !important; border-bottom: 1px solid var(--client-line-soft) !important; }
body[data-page="bank"] .month-summary__item { border: 0 !important; border-right: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; }
body[data-page="bank"] .month-summary__item:last-child { border-right: 0 !important; }
body[data-page="bank"] .qa-row { gap: 0 !important; border-top: 1px solid var(--client-line-soft); }
body[data-page="bank"] .qa-btn {
  justify-content: flex-start !important;
  min-height: 54px;
  padding: 13px 10px !important;
  border: 0 !important;
  border-right: 1px solid var(--client-line-soft) !important;
  border-radius: 0 !important;
  color: var(--client-navy-800) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-weight: 400 !important;
}
body[data-page="bank"] .qa-btn:last-child { border-right: 0 !important; }
body[data-page="bank"] .qa-btn:hover { background: var(--client-canvas) !important; transform: none; }
body[data-page="bank"] .qa-btn__ico { color: var(--client-blue-700) !important; background: transparent !important; }
body[data-page="bank"] .account-row { border-bottom: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; }

/* Accounts */
body[data-page="accounts"] .ac-shell { display: grid; align-items: start; }
body[data-page="accounts"] .ac-tabs { display: none; }
body[data-page="accounts"] .ac-list__head,
body[data-page="accounts"] .ac-detail__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
body[data-page="accounts"] .ac-list__title,
body[data-page="accounts"] .ac-detail__title,
body[data-page="accounts"] .ac-activity__title { color: var(--client-navy-950); font-size: 17px; }
body[data-page="accounts"] .ac-detail__sub { margin-top: 4px; color: var(--client-muted); }
body[data-page="accounts"] .ac-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 15px 10px; color: inherit; text-align: left; }
body[data-page="accounts"] .ac-balance { display: grid; grid-template-columns: repeat(3, 1fr); margin: 20px 0; }
body[data-page="accounts"] .ac-balance__item { min-width: 0; padding: 17px; }
body[data-page="accounts"] .ac-balance__k,
body[data-page="accounts"] .ac-kv .k { color: var(--client-muted); font-size: 11.5px; }
body[data-page="accounts"] .ac-kv { display: grid; grid-template-columns: minmax(120px, .4fr) 1fr; gap: 11px 18px; padding: 18px 0; }
body[data-page="accounts"] .ac-actions { display: flex; flex-wrap: wrap; gap: 9px; padding: 18px 0; }
body[data-page="accounts"] .ac-activity__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
body[data-page="accounts"] .ac-table__head,
body[data-page="accounts"] .ac-row { display: grid; grid-template-columns: 120px minmax(0,1fr) minmax(110px,.35fr); gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--client-line-soft); }
body[data-page="accounts"] .ac-table__head { color: var(--client-muted); font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; }
body[data-page="accounts"] .ac-foot { padding-top: 13px; font-size: 11.5px; }
body[data-page="accounts"] .ac-shell { grid-template-columns: minmax(270px, .38fr) minmax(0, 1fr) !important; gap: 18px !important; }
body[data-page="accounts"] .ac-list,
body[data-page="accounts"] .ac-detail { padding: 26px !important; }
body[data-page="accounts"] .ac-list__head,
body[data-page="accounts"] .ac-detail__head { padding-bottom: 18px !important; }
body[data-page="accounts"] .ac-item { border: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; }
body[data-page="accounts"] .ac-item:hover,
body[data-page="accounts"] .ac-item.is-active { background: var(--client-canvas) !important; }
body[data-page="accounts"] .ac-balance { border-top: 1px solid var(--client-line-soft); border-bottom: 1px solid var(--client-line-soft); }
body[data-page="accounts"] .ac-balance__item { border: 0 !important; border-right: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; }
body[data-page="accounts"] .ac-balance__v { font-size: 19px !important; font-weight: 400 !important; }

/* Transfers, conversions and loans */
body[data-page="transfers"] .transfer-shell,
body[data-page="convert"] .convert-v2,
body[data-page="loans"] .loan-wrap { max-width: none !important; }
body .transfer-card,
body .convert-card,
body .loan-panel { overflow: hidden; }
body .transfer-head,
body .transfer-footer,
body .transfer-footer__right { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
body .transfer-title { display: flex; align-items: center; gap: 10px; }
body .transfer-title__ico { display: inline-flex; color: var(--client-blue-700); }
body .transfer-title__ico svg { width: 20px; height: 20px; }
body .transfer-head__right { font-size: 12px; text-align: right; }
body .tr-stepper-row,
body .kyc-stepper-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
body .tr-step-item,
body .kyc-step-item { display: flex; min-width: 68px; flex-direction: column; align-items: center; gap: 7px; color: var(--client-muted); text-align: center; }
body .tr-step-iconWrap,
body .kyc-step-iconWrap { position: relative; display: inline-grid; width: 38px; height: 38px; place-items: center; }
body .tr-step-iconWrap > svg,
body .kyc-step-iconWrap > svg { width: 18px; height: 18px; }
body .tr-step-check,
body .kyc-step-check { position: absolute; inset: 0; display: none; place-items: center; color: #fff; }
body .tr-step-item.completed .tr-step-check,
body .kyc-step-item.completed .kyc-step-check { display: grid; }
body .tr-step-item.completed .tr-step-iconWrap > svg,
body .kyc-step-item.completed .kyc-step-iconWrap > svg { visibility: hidden; }
body .tr-step-item.completed .tr-step-iconWrap,
body .kyc-step-item.completed .kyc-step-iconWrap { color: var(--client-success); background: transparent !important; }
body .tr-step-label,
body .kyc-step-label { font-size: 11px; }
body .tr-step-arrow,
body .kyc-step-arrow { flex: 1 1 auto; margin-top: 11px; color: #b9c3cc; text-align: center; }
body .tr-step-arrow svg,
body .kyc-step-arrow svg { width: 15px; height: 15px; }
body .tr-stepper-mobile-status { display: none; margin-top: 12px; color: var(--client-muted); font-size: 12px; text-align: center; }
body .step-panel { display: none; }
body .step-panel.is-active { display: block; }
body .wz-pane { display: none; }
body .wz-pane.is-active { display: block; }
body .transfer-mode-row { display: grid; grid-template-columns: repeat(2, 1fr); }
body .transfer-mode-btn,
body .qa-row--two .qa-btn { display: flex; align-items: center; justify-content: flex-start; gap: 10px; min-height: 70px; padding: 16px !important; color: var(--client-text); font: inherit; text-align: left; }
body .qa-btn__ico { display: inline-flex; color: var(--client-blue-700); }
body .qa-btn__ico svg { width: 21px; height: 21px; }
body .grid-2,
body .transfer-amount-layout { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
body .transfer-source-first { margin-bottom: 20px; }
body .transfer-amount-card,
body .transfer-purpose-card { display: block; }
body .transfer-money-field { display: flex; align-items: center; border-bottom: 1px solid var(--client-line); }
body .transfer-money-field__input { min-height: 62px !important; padding: 8px 0 !important; border: 0 !important; font-size: 30px !important; }
body .transfer-money-field__currency { padding-left: 12px; color: var(--client-muted); font-size: 16px; }
body .transfer-balance-summary { display: flex; align-items: center; gap: 12px; padding: 16px 0; }
body .transfer-balance-summary__icon { display: inline-flex; color: var(--client-blue-700); }
body .transfer-balance-summary__available { display: block; margin-top: 3px; font-size: 20px; }
body .transfer-maximum,
body .transfer-cost-item { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
body .transfer-maximum { padding: 16px 0; border-top: 1px solid var(--client-line-soft); }
body .transfer-maximum__label,
body .transfer-maximum__note { display: block; }
body .transfer-maximum__note { color: var(--client-muted); font-size: 11.5px; }
body .transfer-cost-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin: 14px 0; background: var(--client-line-soft); }
body .transfer-cost-item { padding: 15px; background: #fff; font-size: 12px; }
body .transfer-cost-item span { color: var(--client-muted); }
body .review-grid { margin-top: 18px; }
body .review-item { min-height: 72px; padding: 14px 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; }
body .error-box,
body .transfer-amount-error { margin-top: 12px; padding: 11px 13px; border-left: 2px solid var(--client-danger); color: var(--client-danger); background: #fbf0f1; }
body .transfer-head,
body .loan-panel__head,
body .review-card__title { border-bottom: 1px solid var(--client-line-soft) !important; background: transparent !important; }
body .transfer-mode-row,
body .qa-row--two { gap: 0 !important; border: 1px solid var(--client-line) !important; border-radius: 4px !important; overflow: hidden; }
body .transfer-mode-btn,
body .qa-row--two .qa-btn {
  border: 0 !important;
  border-right: 1px solid var(--client-line) !important;
  border-radius: 0 !important;
  background: var(--client-paper) !important;
  box-shadow: none !important;
}
body .transfer-mode-btn:last-child,
body .qa-row--two .qa-btn:last-child { border-right: 0 !important; }
body .transfer-mode-btn.active,
body .transfer-mode-btn.is-active { color: #fff !important; background: var(--client-navy-900) !important; }
body .transfer-amount-card,
body .transfer-purpose-card,
body .loan-kpi__item,
body .conv-metric,
body .fx-item,
body .review-item {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body .transfer-amount-card,
body .transfer-purpose-card { padding: 22px 0 !important; border-top: 1px solid var(--client-line-soft) !important; }
body .loan-dashboard,
body .loan-active-top,
body .loan-kpi,
body .conv-metrics { gap: 1px !important; background: var(--client-line-soft); }
body .loan-kpi__item,
body .conv-metric { padding: 20px !important; background: var(--client-paper) !important; }
body .loan-amount,
body .loan-kpi__v,
body .conv-metric__value { font-weight: 400 !important; }
body .loan-table__head,
body .loan-table__row { border: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; }
body .loan-dashboard,
body .loan-dashboard--v2 { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(300px,.85fr); gap: 18px; }
body .loan-top,
body .loan-active-top,
body .loan-statusline { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
body .loan-panel__title { display: flex; align-items: center; gap: 9px; }
body .loan-kv,
body .kv-table { display: grid; grid-template-columns: minmax(130px,.45fr) 1fr; gap: 11px 18px; }
body .loan-kv .k,
body .kv-table .k,
body .kv-row .k { color: var(--client-muted); font-size: 11.5px; }
body .kv-row { display: grid; grid-template-columns: minmax(130px,.45fr) 1fr; gap: 18px; padding: 10px 0; border-bottom: 1px solid var(--client-line-soft); }
body .loan-list,
body .loan-schedule { display: grid; gap: 12px; }
body .loan-table__head,
body .loan-table__row { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; align-items: center; padding: 12px 0; }
body .loan-table__head { color: var(--client-muted); font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; }
body .loan-review__head,
body .loan-review__title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
body .doc-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--client-line-soft); }
body .convert-v2__top,
body .convert-body,
body .convert-start-fields { display: grid; gap: 18px; }
body .convert-start-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
body .fx-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--client-line-soft); }
body .fx-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px !important; background: #fff !important; }
body .fx-left { display: flex; align-items: center; gap: 9px; }
body .conv-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
body .conv-summary__head,
body .conv-acc,
body .conv-request-intro { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
body .conv-accounts { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; }
body .conv-acc { padding: 16px 0; border-bottom: 1px solid var(--client-line-soft); }
body .conv-acc__ico,
body .conv-summary__ico { display: inline-flex; color: var(--client-blue-700); }
body .convert-disclaimer,
body .convert-terms,
body .loan-terms { color: var(--client-muted); font-size: 12px; line-height: 1.6; }

/* Support and chat */
body[data-page="support"] .support-table-wrap { overflow-x: auto; }
body[data-page="support"] .support-table-wrap,
body[data-page="support"] .chat { overflow: hidden; }
body[data-page="support"] .support-table-wrap { padding: 24px; }
body[data-page="support"] .tickets-cards { display: grid; gap: 1px; background: var(--client-line-soft); }
body[data-page="support"] .tickets-cards--mobile { display: none; }
body[data-page="support"] .ticket-card { padding: 16px 12px; }
body[data-page="support"] .ticket-card__top,
body[data-page="support"] .ticket-card__actions,
body[data-page="support"] .ticket-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
body[data-page="support"] .ticket-card__title { color: var(--client-navy-950); font-size: 15px; }
body[data-page="support"] .ticket-card__meta { justify-content: flex-start; flex-wrap: wrap; margin-top: 7px; color: var(--client-muted); font-size: 11.5px; }
body[data-page="support"] .chat { display: flex; min-height: 590px; flex-direction: column; }
body[data-page="support"] .chat-messages { flex: 1 1 auto; min-height: 390px; max-height: 610px; overflow-y: auto; padding: 24px; }
body[data-page="support"] .msg { display: flex; margin: 12px 0; }
body[data-page="support"] .msg-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; color: var(--client-muted); font-size: 10.5px; }
body[data-page="support"] .msg-body { width: fit-content; max-width: min(78%, 720px); padding: 11px 13px; line-height: 1.6; }
body[data-page="support"] .msg-who--me,
body[data-page="support"] .msg.mine { justify-content: flex-end; }
body[data-page="support"] .chat-compose { padding: 16px; }
body[data-page="support"] .chat-compose__box { display: flex; align-items: flex-end; gap: 10px; }
body[data-page="support"] .chat-input { flex: 1 1 auto; resize: vertical; }
body[data-page="support"] .chat-compose__actions,
body[data-page="support"] .chat-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
body[data-page="support"] .chat-send { flex: 0 0 auto; }
body[data-page="support"] .msg-image { display: block; max-width: min(100%, 520px); margin-top: 8px; border-radius: 4px; }
body[data-page="support"] .msg-file,
body[data-page="support"] .chat-file { display: inline-flex; align-items: center; gap: 8px; margin-top: 7px; }
body[data-page="support"] .support-table-wrap,
body[data-page="support"] .chat { border: 0 !important; border-radius: var(--client-radius) !important; background: var(--client-paper) !important; box-shadow: var(--client-shadow) !important; }
body[data-page="support"] .ticket-card { border: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body[data-page="support"] .ticket-card:hover { background: var(--client-canvas) !important; }
body[data-page="support"] .chat-messages { background: #f8fafb !important; }
body[data-page="support"] .msg-body {
  border: 0 !important;
  border-radius: 4px !important;
  background: var(--client-paper) !important;
  box-shadow: 0 1px 2px rgba(7,26,47,.06) !important;
  font-weight: 400 !important;
}
body[data-page="support"] .msg-who--me .msg-body,
body[data-page="support"] .msg-body.mine { color: #fff !important; background: var(--client-navy-900) !important; }
body[data-page="support"] .chat-compose { border-top: 1px solid var(--client-line-soft) !important; background: var(--client-paper) !important; }

/* Profile */
body[data-page="profile"] .pr3-shell { display: grid; grid-template-columns: minmax(245px,.34fr) minmax(0,1fr); align-items: start; }
body[data-page="profile"] .pr3-nav { display: grid; gap: 0; }
body[data-page="profile"] .pr3-nav__item { display: grid; grid-template-columns: 22px 1fr; gap: 11px; width: 100%; padding: 14px 10px; color: var(--client-text); font: inherit; text-align: left; }
body[data-page="profile"] .pr3-nav__ico,
body[data-page="profile"] .pr3-tab__ico { display: inline-flex; color: var(--client-blue-700); }
body[data-page="profile"] .pr3-nav__ico svg,
body[data-page="profile"] .pr3-tab__ico svg { width: 18px; height: 18px; }
body[data-page="profile"] .pr3-nav__stack { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
body[data-page="profile"] .pr3-nav__hint { color: var(--client-muted); font-size: 11px; }
body[data-page="profile"] .pr3-tabs { display: none; }
body[data-page="profile"] .pr3-section { display: none; }
body[data-page="profile"] .pr3-section.is-active { display: block; }
body[data-page="profile"] .pr3-panelBody { padding-top: 8px; }
body[data-page="profile"] .pr3-title { font-size: 22px !important; }
body[data-page="profile"] .pr3-text { max-width: 720px; margin-top: 8px; color: var(--client-muted); line-height: 1.65; }
body[data-page="profile"] .pr3-divider { margin: 22px 0; }
body[data-page="profile"] .pr3-infoGrid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--client-line-soft); }
body[data-page="profile"] .pr3-infoItem { min-height: 76px; padding: 15px; background: #fff; }
body[data-page="profile"] .pr3-infoSpan { grid-column: 1 / -1; }
body[data-page="profile"] .pr3-infoK { color: var(--client-muted); font-size: 11px; }
body[data-page="profile"] .pr3-infoV { margin-top: 4px; color: var(--client-navy-950); font-size: 14px; overflow-wrap: anywhere; }
body[data-page="profile"] .pr3-form { margin-top: 8px; }
body[data-page="profile"] .pr3-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 4px; }
body[data-page="profile"] .pr3-row__sub { margin-top: 4px; color: var(--client-muted); font-size: 11.5px; }
body[data-page="profile"] .pr3-fineprint { margin-top: 17px; color: var(--client-muted); font-size: 11px; line-height: 1.55; }
body[data-page="profile"] .pr3-shell { gap: 18px !important; }
body[data-page="profile"] .pr3-nav,
body[data-page="profile"] .pr3-panel { padding: 24px !important; }
body[data-page="profile"] .pr3-nav__item,
body[data-page="profile"] .pr3-tab,
body[data-page="profile"] .pr3-row { border: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body[data-page="profile"] .pr3-nav__item:hover,
body[data-page="profile"] .pr3-nav__item.is-active,
body[data-page="profile"] .pr3-tab.is-active { background: var(--client-canvas) !important; }
body[data-page="profile"] .pr3-title,
body[data-page="profile"] .pr3-row__title,
body[data-page="profile"] .pr3-infoV,
body[data-page="profile"] .pr3-nav__label { font-weight: 400 !important; }

/* Reveal motion and icon motion */
body[data-scope="marketing"] [data-reveal] { opacity: 1; transform: none; }
body[data-scope="marketing"].has-reveal [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 600ms var(--client-ease), transform 600ms var(--client-ease); }
body[data-scope="marketing"].has-reveal [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

/* Footer */
body .main-footer { flex: 0 0 auto; margin-top: 40px; border-top: 1px solid var(--client-line); color: var(--client-muted); background: var(--client-paper); }
body[data-scope="marketing"] .main-footer { margin-top: 80px; }
body .footer-top { padding: 52px 0 38px; }
body .footer-inner { display: grid; grid-template-columns: minmax(280px,1.25fr) repeat(3,minmax(150px,.65fr)); gap: 44px; }
body .footer-block { min-width: 0; }
body .footer-brand-row { display: flex; align-items: center; gap: 12px; }
body .footer-logo-img { width: 34px; height: 34px; object-fit: contain; }
body .footer-bankname { color: var(--client-navy-950); font-size: 18px; }
body .footer-tagline { color: var(--client-muted); font-size: 11px; }
body .footer-desc { max-width: 420px; margin: 18px 0; font-size: 11.5px; line-height: 1.65; }
body .footer-meta,
body .footer-item { display: flex; align-items: flex-start; gap: 9px; color: var(--client-muted); font-size: 11.5px; line-height: 1.5; }
body a.footer-item { padding: 6px 0; text-decoration: none; }
body .footer-ico { display: inline-flex; flex: 0 0 17px; color: var(--client-blue-700); }
body .footer-ico svg { width: 16px; height: 16px; }
body .footer-legal { margin-top: 15px; color: #7e8a95; font-size: 10px; line-height: 1.55; }
body .footer-acc { border: 0; }
body .footer-acc__summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--client-navy-950); font-size: 13px; list-style: none; cursor: default; }
body .footer-acc__summary::-webkit-details-marker { display: none; }
body .footer-acc__chev { display: none; }
body .footer-list,
body .footer-links { margin: 15px 0 0; padding: 0; list-style: none; }
body .footer-links li + li { margin-top: 7px; }
body .footer-links a { color: var(--client-muted); font-size: 11.5px; text-decoration: none; }
body .footer-links a:hover { color: var(--client-navy-950); }
body .footer-messengers { display: flex; gap: 8px; margin-top: 14px; }
body .footer-msg { display: inline-grid; width: 24px; height: 24px; place-items: center; color: var(--client-blue-700); background: transparent; }
body .footer-msg svg { width: 17px; height: 17px; }
body .footer-bottom { border-top: 1px solid var(--client-line-soft); }
body .footer-bottom-inner { display: flex; min-height: 54px; align-items: center; justify-content: space-between; }
body .footer-copy { color: #87939d; font-size: 10.5px; }

/* Desktop navigation is a fixed left rail. The same DOM becomes the burger drawer on mobile. */
@media (min-width: 761px) {
  body .site-header {
    position: fixed !important;
    inset: 0 auto 0 0;
    width: 238px;
    min-height: 100vh;
    overflow: hidden;
    border-right: 0 !important;
    border-bottom: 0 !important;
    background: transparent !important;
    backdrop-filter: none;
  }
  body .site-header .header-inner {
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    overflow: hidden;
    flex-direction: column;
    align-items: stretch;
    gap: 0 !important;
    padding: 27px 18px 20px !important;
  }
  body .site-header .logo {
    display: flex;
    min-height: 42px;
    align-items: center;
    margin: 0 8px 32px;
  }
  body .site-header .logo::after { margin-left: auto; }
  body .site-header .nav {
    width: 100%;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: stretch;
    gap: 2px !important;
  }
  body .site-header .nav-link {
    position: relative;
    width: 100%;
    min-height: 46px;
    justify-content: flex-start;
    gap: 11px;
    padding: 0 11px !important;
  }
  body .site-header .nav-link::after {
    top: 8px !important;
    right: auto !important;
    bottom: 8px !important;
    left: -18px !important;
    width: 2px !important;
    height: auto !important;
    transform: scaleY(0) !important;
    transform-origin: bottom;
  }
  body .site-header .nav-link:hover::after,
  body .site-header .nav-link.active::after { transform: scaleY(1) !important; transform-origin: top; }
  body .site-header .nav-link.active { color: var(--client-navy-950) !important; }
  body .site-header .nav-link.active .nav-ico { color: var(--client-blue-700) !important; opacity: 1; }
  body .site-header .nav-lang { width: 100%; margin-top: auto; padding-top: 18px; }
  body .site-header .nav-lang > .nav-link { border-top: 0 !important; }
  body .site-header .nav-lang .lang-dropdown { right: auto; bottom: 0; left: calc(100% + 12px); top: auto; }
  body .site-header .header-actions {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px !important;
    margin: 18px 0 0;
    padding-top: 18px;
    border-top: 0;
  }
  body:not([data-auth]) .site-header .header-actions .btn {
    width: 100%;
    min-height: 38px;
    justify-content: flex-start;
    padding: 7px 11px !important;
    border-color: transparent !important;
    color: var(--client-navy-800) !important;
    background: transparent !important;
  }
  body:not([data-auth]) .site-header .header-actions .btn.primary {
    color: var(--client-navy-950) !important;
  }
  body:not([data-auth]) .site-header .header-actions .btn:hover {
    color: var(--client-blue-700) !important;
    background: transparent !important;
    transform: none;
  }
  body .site-header .notif-dropdown,
  body .site-header .profile-dropdown { top: auto; right: auto; bottom: 0; left: calc(100% + 12px); }
  body main.page-content { margin-left: 238px; }
  body .main-footer { margin-left: 238px; }

  /* Marketing keeps the familiar horizontal header. Only authenticated workspaces use
     the fixed left navigation rail. */
  body[data-nav-mode="top"] .site-header {
    position: sticky !important;
    inset: 0 auto auto 0;
    width: 100%;
    min-height: 74px;
    overflow: visible;
    border-bottom: 1px solid rgba(7, 26, 47, .08) !important;
    background: rgba(255, 255, 255, .96) !important;
    backdrop-filter: blur(16px);
  }
  body[data-nav-mode="top"] .site-header .header-inner {
    width: min(100% - 48px, 1320px) !important;
    height: 74px !important;
    min-height: 74px !important;
    flex-direction: row;
    align-items: center;
    gap: 32px !important;
    overflow: visible;
    padding: 0 !important;
  }
  body[data-nav-mode="top"] .site-header .logo {
    min-height: 74px;
    margin: 0;
  }
  body[data-nav-mode="top"] .site-header .nav {
    width: auto;
    flex: 1 1 auto;
    flex-direction: row;
    align-items: center;
    gap: 24px !important;
  }
  body[data-nav-mode="top"] .site-header .nav-link {
    width: auto;
    min-height: 74px;
    justify-content: center;
    gap: 7px;
    padding: 0 !important;
  }
  body[data-nav-mode="top"] .site-header .nav-link::after {
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    transform: scaleX(0) !important;
    transform-origin: right;
  }
  body[data-nav-mode="top"] .site-header .nav-link:hover::after,
  body[data-nav-mode="top"] .site-header .nav-link.active::after {
    transform: scaleX(1) !important;
    transform-origin: left;
  }
  body[data-nav-mode="top"] .site-header .nav-lang {
    width: auto;
    margin: 0 0 0 auto;
    padding: 0;
  }
  body[data-nav-mode="top"] .site-header .nav-lang .lang-dropdown {
    top: calc(100% - 7px);
    right: 0;
    bottom: auto;
    left: auto;
  }
  body[data-nav-mode="top"] .site-header .header-actions {
    width: auto;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px !important;
    margin: 0;
    padding: 0;
  }
  body[data-nav-mode="top"]:not([data-auth]) .site-header .header-actions .btn {
    width: auto;
    min-height: 38px;
    justify-content: center;
    padding: 8px 13px !important;
  }
  body[data-nav-mode="top"]:not([data-auth]) .site-header .header-actions .btn.primary {
    padding-inline: 15px !important;
    color: #fff !important;
    background: var(--client-navy-950) !important;
  }
  body[data-nav-mode="top"] main.page-content,
  body[data-nav-mode="top"] .main-footer { margin-left: 0; }
}

@media (max-width: 980px) {
  body .site-header .nav-link { font-size: 12px !important; }
  body .biz-hero { grid-template-columns: 1fr; min-height: 0; padding-top: 48px; }
  body .biz-hero__content { max-width: 760px; }
  body .biz-hero__media, body .biz-hero__media img { min-height: 0; height: 520px; }
  body .biz-split { grid-template-columns: 1fr; gap: 38px; }
  body .biz-split--reverse .biz-split__media,
  body .biz-split--reverse .biz-split__content { order: initial; }
  body .biz-split__content { max-width: 750px; }
  body .biz-mobile { grid-template-columns: 1fr; gap: 30px; }
  body .biz-final { align-items: flex-start; flex-direction: column; }
  body .biz-final__actions { flex-direction: row; flex-wrap: wrap; }
  body .page-split--auth { grid-template-columns: 1fr !important; }
  body .page-split--auth .page-split__aside { display: none !important; }
  body .footer-inner { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body .footer-brand { grid-column: 1 / -1; }
  body[data-page="profile"] .pr3-shell { grid-template-columns: 1fr; }
  body[data-page="profile"] .pr3-nav { display: none; }
  body[data-page="profile"] .pr3-tabs { display: flex; overflow-x: auto; border-bottom: 1px solid var(--client-line-soft); }
  body[data-page="profile"] .pr3-tab { display: flex; min-width: 92px; flex: 1 0 auto; flex-direction: column; align-items: center; gap: 5px; padding: 11px 8px; color: var(--client-muted); font: inherit; font-size: 10.5px; }
  body[data-page="profile"] .pr3-tab.is-active { color: var(--client-navy-950); }
  body .loan-dashboard,
  body .loan-dashboard--v2 { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  body .container { width: min(100% - 28px, 1216px) !important; }
  body .page-content { padding: 28px 0 48px !important; }
  body .page-subhead { align-items: flex-start; flex-direction: column; gap: 18px; }
  body .page-actions { width: 100%; }
  body .page-actions .btn { width: auto !important; flex: 1 1 180px; }
  body .site-header .header-inner { min-height: 62px !important; }
  body .site-header .nav-toggle { display: inline-flex; order: -2; }
  body .site-header .logo::after { display: none; }
  body .site-header .nav {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 1002;
    display: flex;
    width: min(86vw, 330px);
    flex-direction: column;
    align-items: stretch;
    padding: 78px 18px 22px;
    overflow-y: auto;
    gap: 0 !important;
    border-right: 1px solid var(--client-line) !important;
    border-radius: 0 !important;
    background: var(--client-paper) !important;
    box-shadow: 16px 0 48px rgba(7,26,47,.12) !important;
    transform: translateX(-106%);
    transition: transform 240ms var(--client-ease);
  }
  html.nav-open body .site-header .nav { transform: translateX(0); }
  html.nav-open body { overflow: hidden; }
  body .site-header .nav-lang { margin-top: auto; }
  body .site-header .nav-lang .lang-dropdown { position: static; width: 100%; margin-top: 4px; border: 0 !important; box-shadow: none !important; }
  body .site-header .nav-link { min-height: 48px; padding: 0 14px !important; border-bottom: 1px solid var(--client-line-soft) !important; }
  body .site-header .nav-link::after { display: none !important; }
  body .site-header .nav-link.active { background: var(--client-canvas) !important; }
  body .header-actions .header-cta { display: none !important; }
  body .access-shell {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    overflow: visible;
  }
  body .access-intro { display: none; }
  body .access-form-wrap {
    min-width: 0;
    padding: 38px 22px 44px;
    border: 0;
  }
  body .access-form-head h2 { font-size: 36px !important; }
  body .access-form { gap: 18px; margin-top: 28px; }
  body .access-help { align-items: flex-start; flex-direction: column; gap: 7px; }
  body .biz-hero h1 { font-size: clamp(43px, 12vw, 62px) !important; }
  body .biz-hero__media, body .biz-hero__media img { height: 430px; }
  body .biz-proof { grid-template-columns: 1fr; margin-bottom: 70px; }
  body .biz-proof__item { min-height: 82px; padding: 18px 0 !important; border-right: 0; border-bottom: 1px solid var(--client-line); }
  body .biz-proof__item:last-child { border-bottom: 0; }
  body .biz-section, body .biz-split, body .biz-onboarding { padding: 68px 0; }
  body .biz-feature-grid, body .biz-control-grid, body .biz-steps { grid-template-columns: 1fr; }
  body .biz-feature { min-height: 230px; padding: 28px 0 !important; border-right: 0; border-bottom: 1px solid var(--client-line); }
  body .biz-feature:last-child { border-bottom: 0; }
  body .biz-feature__number { right: 0; }
  body .biz-feature h3 { margin-top: 44px; }
  body .biz-control-item { min-height: 0; padding: 26px 0 !important; border: 0; border-bottom: 1px solid var(--client-line); }
  body .biz-control-item:last-child { border-bottom: 0; }
  body .biz-control-item__icon { margin-bottom: 12px; }
  body .biz-steps li { min-height: 170px; padding: 25px 0 !important; border-right: 0; border-bottom: 1px solid var(--client-line); }
  body .biz-steps li:last-child { border-bottom: 0; }
  body .biz-section--compliance { margin: 45px -14px; padding: 58px 28px; }
  body .biz-final { margin: 0 -14px; padding: 48px 28px; }
  body .biz-final__actions { width: 100%; flex-direction: column; }
  body .biz-final__actions .btn { width: 100%; }
  body[data-page="bank"] .banking-card { padding: 22px !important; }
  body[data-page="bank"] .month-summary { grid-template-columns: 1fr !important; }
  body[data-page="bank"] .month-summary__item { border-right: 0 !important; border-bottom: 1px solid var(--client-line-soft) !important; }
  body[data-page="bank"] .month-summary__item:last-child { border-bottom: 0 !important; }
  body[data-page="bank"] .banking-grid { grid-template-columns: 1fr; }
  body[data-page="bank"] .banking-card--full { grid-column: auto; }
  body[data-page="bank"] .banking-hero-card { align-items: flex-start; flex-direction: column; }
  body[data-page="accounts"] .ac-shell { grid-template-columns: 1fr !important; }
  body[data-page="accounts"] .ac-tabs { display: flex; gap: 1px; margin-bottom: 12px; padding: 0; overflow: hidden; }
  body[data-page="accounts"] .ac-tab { flex: 1; min-height: 42px; border: 0; color: var(--client-muted); background: #fff; font: inherit; }
  body[data-page="accounts"] .ac-tab.is-active { color: #fff; background: var(--client-navy-900); }
  body .form-grid,
  body .pr3-grid,
  body .review-grid,
  body .loan-review__grid,
  body .grid-2,
  body .transfer-amount-layout,
  body .convert-start-fields { grid-template-columns: 1fr; }
  body .tr-stepper-row,
  body .kyc-stepper-row { display: none; }
  body .tr-stepper-mobile-status { display: block; }
  body .transfer-mode-row { grid-template-columns: 1fr; }
  body .transfer-mode-btn { border-right: 0 !important; border-bottom: 1px solid var(--client-line) !important; }
  body .transfer-mode-btn:last-child { border-bottom: 0 !important; }
  body .transfer-cost-grid,
  body .conv-metrics { grid-template-columns: 1fr; }
  body .transfer-footer { align-items: stretch; flex-direction: column; }
  body .transfer-footer__right { width: 100%; }
  body .transfer-footer__right .btn { flex: 1; }
  body .fx-list { grid-template-columns: 1fr; }
  body .conv-accounts { grid-template-columns: 1fr; }
  body .upload-grid { grid-template-columns: 1fr; }
  body .status-card { grid-template-columns: 1fr; }
  body .status-icon { width: 28px; height: 28px; }
  body .meta-row,
  body .maintenance-facts__row { grid-template-columns: 1fr; gap: 4px; }
  body[data-page="profile"] .pr3-infoGrid { grid-template-columns: 1fr; }
  body[data-page="profile"] .pr3-infoSpan { grid-column: auto; }
  body[data-page="support"] .support-table { display: none; }
  body[data-page="support"] .tickets-cards--mobile { display: grid; }
  body[data-page="support"] .msg-body { max-width: 90%; }
  body .footer-inner { grid-template-columns: 1fr; gap: 0; }
  body .footer-brand { grid-column: auto; padding-bottom: 24px; }
  body .footer-acc { padding: 14px 0; border-top: 1px solid var(--client-line-soft); }
  body .footer-acc__summary { cursor: pointer; }
  body .footer-acc__chev { display: inline-flex; }
  body .footer-acc__chev svg { width: 16px; height: 16px; transition: transform 180ms var(--client-ease); }
  body .footer-acc[open] .footer-acc__chev svg { transform: rotate(180deg); }
}

@media (max-width: 520px) {
  body .biz-hero { padding-top: 36px; }
  body .biz-hero__lead { font-size: 16px; }
  body .biz-hero__actions { flex-direction: column; }
  body .biz-hero__actions .btn { width: 100% !important; }
  body .biz-hero__media, body .biz-hero__media img { height: 350px; }
  body .biz-photo-note { right: 12px; bottom: 12px; left: 12px; min-width: 0; }
  body .biz-split__media, body .biz-split__media img { min-height: 0; height: 360px; }
  body .biz-mobile__actions, body .biz-mobile__actions .btn { width: 100%; }
  body .header-actions .header-cta { display: none !important; }
  body .header-actions .btn.ghost { min-width: 0; padding: 8px 10px !important; }
  body .loan-table__head { display: none; }
  body .loan-table__row { grid-template-columns: 1fr 1fr; }
  body .ac-table__head { display: none !important; }
  body[data-page="accounts"] .ac-row { grid-template-columns: 1fr auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  body[data-scope="marketing"].has-reveal [data-reveal] { opacity: 1; transform: none; }
}
