:root{--navy:#07395b;--green:#159447;--soft:#f2f7f9;--border:#d7e3e9;--muted:#657786}
*{box-sizing:border-box}.fx-page{margin:0;background:#edf3f6;color:#183044}.fx-header{position:sticky;top:0;z-index:20;background:#fff}.fx-header .nav-wrap{min-height:105px}.fx-nav{margin-left:auto;display:flex;gap:24px;align-items:center}.fx-nav a{font-weight:800;color:var(--navy)}.fx-nav span{font-weight:700;color:var(--green)}
.fx-hero{padding:50px 0 34px;color:#fff;background:linear-gradient(120deg,#052f50,#0b5b71 65%,#168551)}.fx-hero h1{color:#fff;font-size:clamp(2.3rem,4vw,4rem);margin:8px 0}.fx-hero p{margin:0}.demo-notice{margin-top:22px;max-width:930px;padding:14px 16px;border:1px solid #ffffff55;border-radius:12px;background:#ffffff14;line-height:1.5}
.fx-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:26px;margin-top:32px;margin-bottom:70px;align-items:start}.fx-steps-panel,.fx-wizard{background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:0 15px 45px #07395b12}.fx-steps-panel{position:sticky;top:130px;padding:22px}.fx-steps-panel h2{font-size:1rem;color:var(--navy)}.fx-steps-panel ol{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:8px}.fx-steps-panel li{display:flex;align-items:center;gap:10px;padding:10px;border-radius:11px;color:#84939d}.fx-steps-panel b{width:30px;height:30px;display:grid;place-items:center;border:1px solid #ccd8df;border-radius:50%}.fx-steps-panel li.active{background:#eef9f2;color:var(--navy);font-weight:800}.fx-steps-panel li.active b,.fx-steps-panel li.done b{background:var(--green);color:#fff;border-color:var(--green)}.fx-wizard{padding:clamp(20px,4vw,44px)}
.fx-step{display:none}.fx-step.active{display:block}.step-title{margin-bottom:25px}.step-title span{font-size:.75rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--green)}.step-title h2{font-size:clamp(1.8rem,3vw,2.7rem);color:var(--navy);margin:7px 0}.step-title p{color:var(--muted);margin:0}.centre{text-align:center}
.grid{display:grid;gap:17px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}label{display:grid;gap:7px;font-size:.88rem;font-weight:700;color:#2b4355}.full{grid-column:1/-1}input,select,textarea{width:100%;min-height:48px;border:1px solid #c7d5dd;border-radius:10px;padding:11px 13px;background:#fff;font:inherit}input:focus,select:focus{outline:3px solid #15944720;border-color:var(--green)}.bad{border-color:#c73838;background:#fff8f8}
.customer-type,.fx-direction,.funding-options,.settlement-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:22px}.funding-options,.settlement-options{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-type input,.fx-direction input,.funding-options input,.settlement-options input{position:absolute;opacity:0}.customer-type span,.fx-direction span,.funding-options span,.settlement-options span{display:block;height:100%;padding:19px;border:2px solid var(--border);border-radius:14px;background:#fff;font-size:1.4rem}.customer-type b,.customer-type small,.fx-direction b,.fx-direction small,.funding-options b,.funding-options small,.settlement-options b,.settlement-options small{display:block}.customer-type b,.fx-direction b,.funding-options b,.settlement-options b{margin-top:9px;color:var(--navy);font-size:.93rem}.customer-type small,.fx-direction small,.funding-options small,.settlement-options small{margin-top:5px;color:var(--muted);font-size:.74rem;line-height:1.4}.customer-type input:checked+span,.fx-direction input:checked+span,.funding-options input:checked+span,.settlement-options input:checked+span{border-color:var(--green);background:#effaf3}
.conditional,.funding-details,.settlement-details{display:none;margin-top:18px;padding:20px;border:1px solid var(--border);border-radius:14px;background:var(--soft)}.conditional.show,.funding-details.show,.settlement-details.show{display:block}
.fx-quote-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px}.currency-row{display:grid;grid-template-columns:1fr minmax(220px,.8fr);gap:10px}.fx-quote-card{padding:23px;border-radius:16px;color:#fff;background:linear-gradient(145deg,#063b60,#08706b)}.fx-quote-card div{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid #ffffff25}.fx-quote-card span{color:#ffffffbf;font-size:.82rem}.fx-quote-card b{text-align:right}.fx-quote-card .receive{margin-top:8px;padding:17px;border:0;border-radius:12px;background:#ffffff18}.fx-quote-card .receive b{color:#a4f2bb;font-size:1.2rem}.fx-quote-card small{display:block;margin-top:15px;color:#ffffffb8;line-height:1.45}
.paybill-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:17px}.paybill-card div{padding:15px;border-radius:11px;background:#fff}.paybill-card span,.paybill-card strong{display:block}.paybill-card span{color:var(--muted);font-size:.74rem}.paybill-card strong{margin-top:5px;color:var(--navy)}
.uploads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.upload{min-height:145px;place-content:center;text-align:center;padding:18px;border:2px dashed #b9cbd5;border-radius:14px;background:#f9fbfc;cursor:pointer}.upload input{position:absolute;opacity:0}.upload small,.upload em{display:block;color:var(--muted);font-style:normal}.upload em{margin-top:8px;color:var(--green);font-weight:800}.check{display:flex;align-items:flex-start;gap:10px;margin-top:20px;line-height:1.45}.check input{width:19px;height:19px;min-height:19px;margin-top:2px}
.review-block{padding:19px;border:1px solid var(--border);border-radius:14px;margin-bottom:15px}.review-block h3{margin:0 0 13px;color:var(--navy)}.review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}.review-item span{display:block;color:var(--muted);font-size:.74rem}.review-item b{display:block;margin-top:3px}.confirm{padding:18px;background:#f7fafb;border-radius:14px}.success{width:70px;height:70px;margin:0 auto 15px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-size:2rem;font-weight:800}.receipt{padding:24px;border:1px solid var(--border);border-radius:15px}.receipt-head{display:flex;justify-content:space-between;gap:20px;padding-bottom:16px;border-bottom:1px solid var(--border)}.receipt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.receipt-buttons{display:flex;justify-content:center;gap:12px;margin-top:22px}
.alert{display:none;margin-top:20px;padding:13px 15px;border-radius:10px;background:#fff0f0;color:#8b2525}.alert.show{display:block}.controls{display:flex;justify-content:space-between;margin-top:30px;padding-top:22px;border-top:1px solid var(--border)}#fxBack{visibility:hidden}.note{font-size:.8rem;color:#8a5a27}
@media(max-width:900px){.fx-layout{grid-template-columns:1fr}.fx-steps-panel{position:static}.fx-steps-panel ol{grid-template-columns:repeat(7,minmax(105px,1fr));overflow:auto}.fx-steps-panel li{display:grid;text-align:center}.fx-steps-panel b{margin:auto}}
@media(max-width:700px){.fx-nav span{display:none}.grid.two,.customer-type,.fx-direction,.funding-options,.settlement-options,.fx-quote-grid,.currency-row,.uploads,.paybill-card,.review-grid,.receipt-grid{grid-template-columns:1fr}.fx-wizard{padding:20px 15px}.receipt-head{display:grid}}
@media print{.site-header,.fx-hero,.fx-steps-panel,.controls,.receipt-buttons,.demo-notice{display:none!important}.fx-layout{display:block;margin:0}.fx-wizard{box-shadow:none;border:0}.fx-step{display:none!important}.fx-step[data-step="7"]{display:block!important}}

/* Version 19: simplified Buy/Sell FX quote */
.fx-simple-entry{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:17px;
  margin-bottom:22px;
}
.fx-simple-quote{max-width:760px;margin:0 auto}
@media(max-width:700px){.fx-simple-entry{grid-template-columns:1fr}}

/* Version 20: quote reference, payment instructions and branded confirmations */
.quote-reference-card,
.bank-instruction-card{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
}
.quote-reference-card div,
.bank-instruction-card div{
  padding:15px;
  border-radius:11px;
  background:#fff;
  border:1px solid var(--border);
}
.quote-reference-card span,
.quote-reference-card strong,
.bank-instruction-card span,
.bank-instruction-card strong{
  display:block;
}
.quote-reference-card span,
.bank-instruction-card span{
  color:var(--muted);
  font-size:.74rem;
}
.quote-reference-card strong,
.bank-instruction-card strong{
  margin-top:5px;
  color:var(--navy);
  overflow-wrap:anywhere;
}
.payment-proof-panel{
  margin-top:22px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#f8fbfc;
}
.payment-proof-panel h3{margin-top:0;color:var(--navy)}
.paybill-steps{line-height:1.7;color:var(--muted)}
.branded-receipt{
  position:relative;
  overflow:hidden;
  border-top:8px solid var(--green);
  background:
    linear-gradient(180deg,#fff 0%,#fff 78%,#f1f7f4 100%);
}
.branded-receipt:before{
  content:"Kingscross Money Remittance Ltd";
  display:block;
  margin:-24px -24px 20px;
  padding:18px 24px;
  color:#fff;
  background:linear-gradient(120deg,#07395b,#159447);
  font-size:1.25rem;
  font-weight:800;
}
.confirmation-channel{
  margin-top:20px;
  padding:20px;
  border-radius:14px;
  background:#eef9f2;
}
.confirmation-channel h3{margin-top:0;color:var(--navy)}
.notification-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.notification-grid div{
  padding:15px;
  border-radius:10px;
  background:#fff;
}
.notification-grid span,.notification-grid strong{display:block}
.notification-grid span{font-size:.75rem;color:var(--muted)}
.notification-grid strong{margin-top:5px;color:var(--navy)}
@media(max-width:700px){
  .quote-reference-card,
  .bank-instruction-card,
  .notification-grid{grid-template-columns:1fr}
}

.transaction-path{margin:18px 0}
.transaction-path[style*="display: none"]{display:none!important}
.payment-reference-highlight{margin:18px 0;padding:20px;border-radius:14px;background:linear-gradient(135deg,#07395b,#0c7882);color:#fff;display:grid;gap:6px}
.payment-reference-highlight span{font-size:.9rem;opacity:.9}
.payment-reference-highlight strong{font-size:1.5rem;letter-spacing:.04em;color:#8ff07b}
.payment-reference-highlight small{opacity:.9}
.payment-reference-highlight.compact{padding:14px 16px}
.payment-reference-highlight.compact strong{font-size:1.25rem}
.receipt-brand-block{display:grid;gap:4px;padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid rgba(0,85,111,.2)}
.receipt-brand-block strong{font-size:1.15rem;color:#07395b}
.receipt-contact-note{margin-top:18px;padding-top:14px;border-top:1px solid rgba(0,85,111,.18);font-size:.9rem}
.fx-prelaunch-note{margin-top:18px}