:root {
  --navy: #0b1729;
  --navy-2: #11233b;
  --ink: #152033;
  --slate: #536275;
  --steel: #8b9bad;
  --line: #d7dee6;
  --line-dark: rgba(255,255,255,.15);
  --canvas: #f4f6f7;
  --paper: #ffffff;
  --soft: #eaf0f4;
  --gold: #c99835;
  --gold-pale: #f8efd9;
  --green: #1aaf7a;
  --green-pale: #e5f6ef;
  --orange: #b16d2b;
  --radius: 8px;
  --shadow: 0 10px 30px rgba(12,25,42,.08);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font: 16px/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
.code-gate { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 1.5rem; color: #f6f8fa; background: radial-gradient(circle at 80% 15%, rgba(201,152,53,.16), transparent 32%), linear-gradient(135deg, #081424 0%, #102841 100%); }
.code-gate-card { width: min(100%, 480px); padding: clamp(2rem, 6vw, 4.2rem); background: rgba(8,20,36,.78); border: 1px solid rgba(255,255,255,.18); box-shadow: 0 24px 80px rgba(0,0,0,.3); }
.gate-brand { display: flex; align-items: center; gap: .6rem; margin-bottom: 4rem; font-size: 1.15rem; letter-spacing: -.03em; }.gate-brand img { width: 31px; height: 31px; }.gate-brand strong { font-weight: 800; }
.code-gate .eyebrow { color: #d9b86c; }.code-gate h1 { margin: 0 0 .8rem; font: 500 clamp(2.2rem, 6vw, 3.7rem)/1.03 var(--serif); letter-spacing: -.045em; }.gate-copy { max-width: 32rem; margin: 0 0 2rem; color: #bfccda; }.code-gate form { display: grid; gap: .65rem; }.code-gate label { color: #d8e1e9; font-size: .72rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }.code-gate input { width: 100%; padding: .8rem .9rem; color: #fff; background: #0c1b2e; border: 1px solid #607389; border-radius: 4px; font-size: 1.15rem; letter-spacing: .18em; }.code-gate input:focus { border-color: var(--gold); outline: 2px solid rgba(201,152,53,.3); }.code-gate .button { margin-top: .45rem; width: 100%; }.code-error { margin: .3rem 0 0; color: #ffb0a7; font-size: .78rem; }.gate-note { margin: 2.5rem 0 0; padding-top: 1rem; color: #8295a8; border-top: 1px solid rgba(255,255,255,.14); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
body.modal-open, body.menu-open { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
a, button { transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(32, 178, 126, .42); outline-offset: 3px; }
[hidden] { display: none !important; }
.skip-link { position: fixed; top: .75rem; left: .75rem; z-index: 100; transform: translateY(-200%); background: var(--paper); color: var(--navy); border: 1px solid var(--navy); padding: .7rem 1rem; border-radius: 4px; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.site-header { height: 76px; padding: 0 clamp(1.25rem, 4.3vw, 5.4rem); display: flex; align-items: center; gap: 2.5rem; background: var(--navy); color: #f5f7fb; border-bottom: 1px solid rgba(255,255,255,.12); position: sticky; top: 0; z-index: 30; }
.brand { flex: 0 0 auto; display: inline-flex; gap: .6rem; align-items: center; letter-spacing: -.04em; font-size: 1.15rem; font-weight: 500; white-space: nowrap; }
.brand strong { font-weight: 750; }
.brand-mark { position: relative; display: inline-flex; align-items: center; width: 25px; height: 18px; }
.brand-mark i { display: block; width: 9px; height: 9px; border: 2px solid var(--gold); transform: rotate(45deg); position: absolute; }
.brand-mark i:first-child { left: 0; }.brand-mark i:nth-child(2) { right: 0; }.brand-mark b { position: absolute; left: 9px; top: 7px; width: 7px; height: 4px; background: var(--green); border-radius: 1px; }
.desktop-nav { flex: 1; display: flex; justify-content: center; gap: clamp(.85rem, 1.8vw, 1.75rem); height: 100%; }
.desktop-nav a { display: inline-flex; align-items: center; font-size: .82rem; color: #c3ccd7; white-space: nowrap; }
.desktop-nav a:hover, .desktop-nav a.is-active { color: #fff; box-shadow: inset 0 -2px 0 var(--gold); }
.header-actions { margin-left: auto; display: flex; align-items: center; gap: 1.25rem; }
.text-action { color: inherit; border: 0; background: transparent; font-size: .84rem; padding: .45rem 0; }
.text-action:hover { color: var(--gold); }
.button { min-height: 44px; padding: .68rem 1.05rem; display: inline-flex; align-items: center; justify-content: center; gap: .6rem; border: 1px solid transparent; border-radius: 5px; text-align: center; font-weight: 700; font-size: .86rem; letter-spacing: -.01em; }
.button span { font-size: 1.15em; line-height: 0; transition: transform .18s ease; }.button:hover span { transform: translateX(3px); }
.button-primary { color: #0c192b; background: var(--gold); box-shadow: 0 5px 13px rgba(0,0,0,.17); }.button-primary:hover { background: #dfa946; transform: translateY(-1px); }
.button-quiet { color: var(--navy); background: transparent; border-color: #c4ced9; }.button-quiet:hover { color: #fff; border-color: var(--navy); background: var(--navy); }
.header-cta { min-height: 38px; padding: .48rem .85rem; font-size: .78rem; }
.menu-toggle { display: none; border: 0; background: transparent; width: 36px; height: 36px; padding: 8px; }.menu-toggle span { display: block; width: 20px; height: 1px; background: #fff; margin: 5px auto; }
.mobile-nav { position: fixed; inset: 76px 0 0; z-index: 28; padding: 1.5rem 1.4rem 2rem; color: #fff; background: var(--navy); overflow-y: auto; }.mobile-nav-top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line-dark); }.mobile-nav > a { padding: 1rem 0; display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--line-dark); font-size: 1.25rem; font-weight: 630; }.mobile-nav > a span { font-size: .68rem; color: var(--gold); letter-spacing: .1em; }.mobile-signin { color: #cbd3df; margin: 1.2rem 0; }.mobile-nav .full { width: 100%; }
.icon-button { color: inherit; border: 1px solid currentColor; background: transparent; width: 34px; height: 34px; border-radius: 50%; font-size: 1.45rem; line-height: 1; display: grid; place-content: center; }
.page { min-height: calc(100vh - 76px); }.home-page { background: var(--canvas); }
.hero-band { padding: clamp(3rem, 7vw, 6.7rem) clamp(1.25rem, 8vw, 10.5rem) clamp(2.3rem, 5vw, 4.7rem); color: #f6f8fa; background: linear-gradient(120deg, #0b1729 0%, #112943 100%); display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 370px); gap: 4rem; align-items: end; position: relative; overflow: hidden; }.hero-band:after { content: ''; position: absolute; width: 42vw; height: 42vw; right: -17vw; top: -27vw; border: 1px solid rgba(196, 152, 53, .32); transform: rotate(45deg); }.hero-copy, .prototype-note { position: relative; z-index: 1; }.eyebrow { margin: 0 0 .75rem; color: var(--steel); letter-spacing: .14em; font-size: .68rem; font-weight: 780; }.hero-copy .eyebrow { color: #b9c7d5; }.live-dot { display: inline-block; width: 7px; height: 7px; margin: 0 .45rem .1rem 0; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(34, 195, 137,.12); }.hero-copy h1, .page-intro h1, .security-hero h1, .signin-card h1 { max-width: 780px; margin: 0; font-size: clamp(2.65rem, 5.9vw, 5.55rem); letter-spacing: -.065em; line-height: .99; font-weight: 530; }.hero-copy h1 em, .page-intro h1 em, .security-hero h1 em { font-family: var(--serif); font-weight: 500; }.hero-copy .lead { max-width: 620px; color: #c4d0dc; font-size: clamp(1rem, 1.6vw, 1.16rem); line-height: 1.65; margin: 1.5rem 0 1.8rem; }.hero-actions { display: flex; gap: .7rem; flex-wrap: wrap; }.hero-actions .button-quiet { color: #f1f5fa; border-color: rgba(255,255,255,.3); }.hero-actions .button-quiet:hover { color: var(--navy); background: #fff; }.prototype-note { display: flex; align-items: flex-start; gap: .75rem; padding: 1rem; color: #cbd5de; font-size: .78rem; line-height: 1.55; border: 1px solid rgba(255,255,255,.19); background: rgba(3,13,26,.27); }.prototype-note p { margin: 0; }.prototype-note strong { display: block; margin-bottom: .15rem; color: #fff; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }.note-icon { flex: 0 0 19px; width: 19px; height: 19px; border: 1px solid #d6e1ec; border-radius: 50%; display: grid; place-items: center; font: 700 .7rem var(--serif); }
.workspace-section { max-width: 1440px; margin: -1.3rem auto 0; padding: 0 clamp(1.25rem, 4.3vw, 5.4rem) 4rem; position: relative; z-index: 3; }.desk-heading { padding: 1.35rem 1.5rem; background: #fff; border: 1px solid var(--line); border-bottom: 0; display: flex; justify-content: space-between; align-items: center; }.desk-heading .eyebrow { margin-bottom: .25rem; }.desk-heading h2 { margin: 0; font-size: 1.12rem; letter-spacing: -.03em; }.desk-heading h2 span { margin-left: .5rem; color: var(--slate); font: 650 .7rem var(--sans); letter-spacing: .07em; }.desk-status { color: #206b52; background: var(--green-pale); padding: .4rem .6rem; font-size: .73rem; font-weight: 700; }.status-dot { width: 7px; height: 7px; display: inline-block; margin-right: .35rem; border-radius: 50%; background: var(--green); }
.trade-desk { display: grid; grid-template-columns: minmax(270px, 1fr) minmax(275px, .76fr) minmax(270px, 1fr); background: var(--paper); border: 1px solid var(--line); }.trade-side { padding: 1.55rem; min-height: 454px; display: flex; flex-direction: column; }.partner-side { border-left: 1px solid var(--line); }.panel-top { display: flex; justify-content: space-between; gap: .75rem; }.side-label { margin: 0 0 .65rem; font-size: .65rem; font-weight: 800; letter-spacing: .12em; color: var(--steel); }.person { display: flex; gap: .65rem; align-items: center; }.person h3 { margin: 0; font-size: .95rem; line-height: 1.2; letter-spacing: -.02em; }.person p { margin: .08rem 0 0; color: var(--slate); font-size: .72rem; }.avatar { width: 31px; height: 31px; display: grid; place-content: center; border-radius: 50%; font-size: .65rem; font-weight: 800; }.avatar-you { color: #fff; background: var(--navy); }.avatar-partner { color: #798797; background: #e4e9ee; }.panel-edit { color: var(--navy); border: 0; border-bottom: 1px solid currentColor; background: transparent; padding: 0; height: fit-content; font-size: .72rem; font-weight: 750; }.panel-edit:hover { color: var(--gold); }.item-overview { margin: 2rem 0 1.7rem; padding: 1rem 0; display: flex; gap: .85rem; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.item-icon { width: 48px; height: 48px; flex: 0 0 48px; border: 1px solid #a8b8c8; border-radius: 6px; position: relative; background: #eff3f6; }.box-icon:before { content: ''; position: absolute; width: 21px; height: 16px; left: 12px; top: 17px; border: 1.5px solid #37516a; }.box-icon:after { content: ''; position: absolute; width: 15px; height: 7px; left: 15px; top: 12px; border: 1.5px solid #37516a; border-bottom: 0; transform: perspective(10px) rotateX(9deg); }.item-kind { margin: 0 0 .1rem; color: #607488; font-size: .67rem; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }.item-overview h4 { margin: 0 0 .17rem; font-size: .9rem; letter-spacing: -.02em; }.item-overview p:last-child { margin: 0; color: var(--slate); font-size: .77rem; }.side-details { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.3rem; }.side-details div { min-width: 0; }.side-details dt { color: var(--slate); font-size: .67rem; }.side-details dd { margin: .15rem 0 0; color: var(--ink); font-size: .78rem; font-weight: 690; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.mini-check { color: var(--green); font-weight: 900; }.side-details.muted dd { color: #8492a0; font-weight: 550; }.side-footer { margin-top: auto; padding-top: 1.5rem; display: flex; align-items: center; justify-content: space-between; }.field-label { color: var(--steel); font-size: .61rem; font-weight: 800; letter-spacing: .1em; }.state-label { font-size: .7rem; color: var(--slate); }.state-label.active { color: #187353; }.awaiting-mark { color: #697988; font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 750; }.partner-empty { flex: 1; margin: 1.45rem 0 1rem; padding: 1.1rem 0; display: flex; align-items: center; gap: .85rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.empty-token { flex: 0 0 43px; width: 43px; height: 43px; display: grid; place-content: center; color: #8ca0b4; border: 1px dashed #aab6c2; font-size: 1.3rem; }.partner-empty h4 { margin: 0 0 .2rem; font-size: .85rem; }.partner-empty p { margin: 0; color: var(--slate); font-size: .72rem; line-height: 1.45; }
.bridge-panel { padding: 1.55rem 1.3rem; color: #edf3f8; background: var(--navy); min-height: 454px; }.bridge-top { display: flex; justify-content: space-between; align-items: flex-start; }.bridge-panel .side-label { color: #94a7ba; }.draft-badge { color: #0f3026; background: #69d7ae; padding: .23rem .42rem; font-size: .58rem; letter-spacing: .09em; font-weight: 900; }.bridge-panel h3 { margin: 0; font-size: 1rem; letter-spacing: -.02em; }.bridge-visual { margin: 1.2rem 0 .75rem; height: 37px; display: flex; align-items: center; }.bridge-line { height: 1px; background: #587088; flex: 1; }.bridge-node { display: block; width: 10px; height: 10px; border: 2px solid #b8c8d8; transform: rotate(45deg); }.bridge-node.right { border-color: var(--gold); }.bridge-exchange { width: 31px; height: 31px; margin: 0 .5rem; display: grid; place-content: center; border: 1px solid #536b82; border-radius: 50%; color: var(--gold); font-size: 1rem; }.compare-row { padding-bottom: .85rem; display: grid; grid-template-columns: 1fr 20px 1fr; align-items: center; text-align: center; gap: .2rem; color: #c4d2de; font-size: .65rem; border-bottom: 1px solid rgba(255,255,255,.14); }.compare-row span:nth-child(2) { color: var(--gold); }.summary-list { margin: .85rem 0 0; }.summary-list div { padding: .44rem 0; display: flex; justify-content: space-between; gap: .3rem; font-size: .7rem; }.summary-list dt { color: #a6b8c9; }.summary-list dd { margin: 0; color: #edf5fb; font-weight: 680; text-align: right; }.summary-icon { display: inline-block; width: 9px; height: 9px; margin-right: .45rem; border: 1px solid currentColor; vertical-align: -.04rem; }.clock { border-radius: 50%; }.handling { transform: rotate(45deg); }.shield { border-radius: 1px 1px 4px 4px; }.review { border-radius: 50%; border-color: var(--gold); }.agreement-message { margin: .8rem 0 0; padding: .7rem; color: #c2d4e3; background: #142a43; font-size: .66rem; line-height: 1.45; }.agreement-message span { color: var(--gold); margin-right: .25rem; }.desk-footer { padding: .9rem 1.5rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; color: var(--slate); background: #fff; border: 1px solid var(--line); border-top: 0; font-size: .7rem; }.desk-footer p { margin: 0; }.desk-footer .compact { min-height: 34px; padding: .35rem .65rem; font-size: .7rem; }
.capability-strip { max-width: 1440px; margin: 0 auto; padding: 0 clamp(1.25rem, 4.3vw, 5.4rem) 2rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }.capability-strip > div { padding: 1rem; display: flex; gap: .8rem; background: var(--canvas); }.capability-strip p { margin: 0; color: var(--slate); font-size: .72rem; line-height: 1.45; }.capability-strip strong { display: block; color: var(--ink); margin-bottom: .15rem; }.strip-index { color: var(--gold); font-size: .66rem; font-weight: 800; }
.dark-intro { min-height: 430px; padding: clamp(4rem, 9vw, 8rem) clamp(1.25rem, 11vw, 14rem); background: var(--navy); color: #fff; }.dark-intro > p:last-of-type { color: #b8c7d5; max-width: 550px; font-size: 1.05rem; }.dark-intro .button { margin-top: 1rem; }.workspace-guide { max-width: 1180px; margin: -3rem auto 0; padding: 0 1.25rem; display: grid; grid-template-columns: repeat(3, 1fr); position: relative; z-index: 2; }.workspace-guide div { min-height: 175px; padding: 1.5rem; background: #fff; border: 1px solid var(--line); }.workspace-guide div+div { border-left: 0; }.guide-number { color: var(--gold); font-size: .72rem; font-weight: 800; }.workspace-guide h2 { margin: 2.2rem 0 .25rem; font-size: 1rem; letter-spacing: -.02em; }.workspace-guide p { margin: 0; color: var(--slate); font-size: .8rem; }.mini-desk-wrap { max-width: 910px; margin: 4rem auto; padding: 0 1.25rem; text-align: center; }.mini-desk { min-height: 115px; display: grid; grid-template-columns: 1fr 1fr 1.3fr 1fr 1fr; align-items: center; color: #f8fafb; background: var(--navy); border: 8px solid #fff; outline: 1px solid var(--line); box-shadow: var(--shadow); }.mini-desk span { font-size: .75rem; color: #c9d7e3; }.mini-desk i { height: 1px; background: #61768b; }.mini-desk b { color: var(--gold); font-size: .9rem; }.mini-desk-wrap > p { color: var(--slate); font-size: .82rem; }
.content-page { max-width: 1280px; margin: 0 auto; padding: clamp(4rem, 8vw, 7.2rem) clamp(1.25rem, 4.3vw, 5.4rem) 5.5rem; }.page-intro { max-width: 825px; margin-bottom: 4rem; }.page-intro h1, .signin-card h1 { color: var(--navy); font-size: clamp(2.6rem, 6vw, 5rem); }.page-intro > p:last-child { max-width: 640px; color: var(--slate); font-size: 1.05rem; line-height: 1.65; }.split-intro { max-width: none; display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 4rem; }.split-intro > p:last-child { margin: 0 0 .4rem; }.process-list { padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--line); }.process-list li { min-height: 135px; display: grid; grid-template-columns: 75px 1fr 35px; gap: .5rem; align-items: center; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }.process-list li > span { align-self: start; color: var(--gold); font-weight: 800; font-size: .72rem; padding-top: .3rem; }.process-list h2 { margin: 0 0 .3rem; font-size: 1.35rem; letter-spacing: -.035em; }.process-list p { margin: 0; color: var(--slate); font-size: .88rem; }.process-list i { color: var(--slate); font-style: normal; justify-self: end; }.process-list .future { background: #edf1f4; padding-left: 1rem; padding-right: 1rem; }.future-label { color: #a16c1d !important; font-size: .62rem !important; letter-spacing: .08em; font-weight: 800; margin-bottom: .15rem !important; }
.trade-type-grid { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.trade-type-grid article { min-height: 312px; position: relative; padding: 1.15rem; display: flex; flex-direction: column; background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }.trade-type-grid article:hover { z-index: 1; box-shadow: 0 9px 22px rgba(12,27,47,.11); }.type-number { color: #8496a8; font-size: .62rem; font-weight: 800; }.type-icon { width: 37px; height: 37px; margin: 1.45rem 0 1.25rem; position: relative; border: 1.5px solid #354f68; }.type-icon:before, .type-icon:after { content: ''; position: absolute; border: 1px solid #354f68; }.type-icon.freight:before { width: 20px; height: 12px; left: 7px; top: 10px; }.type-icon.freight:after { width: 13px; height: 5px; left: 10px; top: 5px; border-bottom: 0; }.type-icon.machine { border-radius: 0 50% 50% 0; }.type-icon.machine:before { width: 17px; height: 17px; border-radius: 50%; left: 6px; top: 8px; }.type-icon.machine:after { width: 1px; height: 24px; left: 17px; top: 5px; background: #354f68; }.type-icon.art { transform: rotate(45deg); }.type-icon.art:before { inset: 7px; }.type-icon.art:after { width: 7px; height: 7px; border-radius: 50%; left: 8px; top: 8px; }.type-icon.digital { border-radius: 50%; }.type-icon.digital:before { width: 22px; height: 1px; background: #354f68; border: 0; left: 6px; top: 17px; }.type-icon.digital:after { width: 1px; height: 22px; background: #354f68; border: 0; left: 17px; top: 6px; }.type-icon.key { border-radius: 50%; width: 20px; height: 20px; margin-bottom: 2.3rem; }.type-icon.key:before { width: 19px; height: 1px; background: #354f68; border: 0; left: 15px; top: 9px; }.type-icon.key:after { width: 1px; height: 7px; background: #354f68; border: 0; left: 29px; top: 9px; }.type-icon.bank:before { width: 24px; height: 14px; left: 5px; top: 14px; }.type-icon.bank:after { width: 28px; height: 1px; background: #354f68; border: 0; left: 3px; top: 8px; }.type-icon.wallet { border-radius: 4px; }.type-icon.wallet:before { width: 13px; height: 9px; right: -5px; top: 13px; border-radius: 2px; }.type-icon.wallet:after { width: 3px; height: 3px; right: 1px; top: 16px; border-radius: 50%; background: #354f68; }.type-icon.crypto { border-radius: 50%; }.type-icon.crypto:before { content: '₿'; border: 0; left: 8px; top: 5px; font-size: 1.05rem; }.type-icon.crypto:after { display: none; }.type-icon.nft { border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }.type-icon.nft:before { width: 7px; height: 7px; border-radius: 50%; left: 13px; top: 12px; }.type-icon.nft:after { display:none; }.type-icon.specialist { border-radius: 50%; border-style: dashed; }.type-icon.specialist:before { width: 11px; height: 11px; border-radius: 50%; left: 11px; top: 11px; }.type-icon.specialist:after { display:none; }.trade-type-grid h2 { margin: 0 0 .5rem; font-size: 1rem; letter-spacing: -.03em; }.trade-type-grid p { margin: 0; color: var(--slate); font-size: .74rem; line-height: 1.5; }.trade-type-grid button { color: var(--navy); margin: auto 0 0; padding: 0; text-align: left; border: 0; background: transparent; font-size: .7rem; font-weight: 800; }.trade-type-grid button span { color: var(--gold); margin-left: .2rem; }.trade-type-grid button:hover { color: var(--gold); }
.security-page { max-width: none; padding: 0; }.security-hero { min-height: 480px; padding: clamp(4rem, 9vw, 8rem) clamp(1.25rem, 12vw, 15rem); color: #edf3f7; background: var(--navy); position: relative; overflow: hidden; }.security-hero:after { content: 'TB'; position: absolute; right: 8vw; bottom: -6rem; color: rgba(255,255,255,.035); font: 20rem/.8 var(--serif); }.security-hero > * { max-width: 630px; position: relative; z-index: 1; }.security-hero h1 { color: #fff; }.security-hero > p:not(.eyebrow) { color: #b7c8d8; font-size: 1rem; }.security-warning { padding: .8rem 1rem; color: #e6be72 !important; border-left: 2px solid var(--gold); background: rgba(201,152,53,.11); font-size: .8rem !important; }.security-grid { max-width: 1180px; margin: -2rem auto 0; padding: 0 1.25rem 5rem; display: grid; grid-template-columns: repeat(3,1fr); position: relative; z-index: 2; }.security-grid article { min-height: 220px; padding: 1.4rem; background: #fff; border: 1px solid var(--line); margin: -1px 0 0 -1px; }.security-grid article span { color: var(--gold); font-size: .65rem; font-weight: 800; }.security-grid h2 { margin: 2.4rem 0 .4rem; font-size: 1.1rem; letter-spacing: -.03em; }.security-grid p { margin: 0; color: var(--slate); font-size: .78rem; }.security-grid .future-security { color: #d9e6f1; background: #183149; }.future-security h2 { color: #fff; }.future-security p { color: #bfd0df; }
.pricing-table { background: #fff; border: 1px solid var(--line); }.pricing-table > div { display: grid; grid-template-columns: 1.05fr 1.75fr .7fr; gap: 1rem; align-items: center; padding: 1.1rem 1.35rem; border-bottom: 1px solid var(--line); }.pricing-table > div:last-child { border-bottom: 0; }.pricing-head { color: #6e8193; background: #eaf0f4; font-size: .64rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.pricing-table strong { font-size: .92rem; letter-spacing: -.02em; }.pricing-table p { margin: 0; color: var(--slate); font-size: .8rem; }.pricing-table b { text-align: right; color: var(--navy); font-size: 1rem; }.pricing-table small { display: block; color: var(--slate); font-size: .62rem; font-weight: 500; }.pricing-bottom { padding: 1.35rem 0; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }.pricing-bottom p { margin: 0; color: var(--slate); font-size: .8rem; }
.help-layout { padding-top: 2rem; border-top: 1px solid var(--line); }.help-search { max-width: 600px; }.help-search label { display: block; margin-bottom: .4rem; color: var(--slate); font-size: .72rem; font-weight: 700; }.help-search > div { position: relative; }.help-search input { width: 100%; padding: .85rem 2.8rem .85rem .9rem; color: var(--ink); border: 1px solid #bac7d3; border-radius: 5px; background: #fff; }.help-search span { position: absolute; right: .9rem; top: .7rem; color: var(--slate); font-size: 1.3rem; }.help-grid { margin-top: 2.5rem; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }.help-grid button { min-height: 74px; padding: 1.1rem; display: flex; align-items: center; justify-content: space-between; color: var(--ink); background: #fff; border: 0; text-align: left; font-size: .85rem; font-weight: 700; }.help-grid button:hover { color: var(--navy); background: var(--gold-pale); }.help-grid span { color: var(--gold); }.support-callout { margin-top: 3.5rem; padding: 1.7rem; display: flex; gap: 1rem; justify-content: space-between; align-items: center; color: #f7fafc; background: var(--navy); }.support-callout .eyebrow { color: #aebdcc; }.support-callout h2 { margin: 0 0 .3rem; font-size: 1.2rem; letter-spacing: -.025em; }.support-callout p { max-width: 640px; margin: 0; color: #bbcad8; font-size: .8rem; }.support-callout .button { color: #fff; border-color: rgba(255,255,255,.35); white-space: nowrap; }.support-callout .button:hover { color: var(--navy); background: #fff; }
.signin-page { min-height: calc(100vh - 76px); padding: 3rem 1.25rem; display: grid; place-content: center; background: linear-gradient(120deg, #e9eff3, #f5f6f7); }.signin-card { width: min(100%, 620px); padding: clamp(2rem, 6vw, 5rem); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }.signin-card .brand { color: var(--navy); margin-bottom: 4rem; }.signin-card .brand-mark i { border-color: var(--gold); }.signin-card h1 { font-size: clamp(2.1rem, 5vw, 3.5rem); }.signin-card div > p:last-of-type { color: var(--slate); line-height: 1.65; }.form-note { margin: 3rem 0 0; color: #788a9a; font-size: .72rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.site-footer { padding: 4rem clamp(1.25rem, 4.3vw, 5.4rem) 1.2rem; color: #d3dce5; background: #081321; }.footer-main { display: grid; grid-template-columns: 2.2fr repeat(4, 1fr); gap: 2rem; max-width: 1440px; margin: 0 auto; }.footer-brand { padding-right: 2.5rem; }.footer-brand p { max-width: 270px; color: #9cafc0; font-size: .78rem; line-height: 1.6; }.footer-brand .prototype-footer { color: #d9b86c; font-size: .67rem; }.footer-main h2 { margin: .2rem 0 1rem; color: #879aab; font-size: .63rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.footer-main a:not(.brand) { display: block; width: fit-content; margin: .45rem 0; color: #e1e8ef; font-size: .73rem; }.footer-main a:not(.brand):hover { color: var(--gold); }.footer-bottom { max-width: 1440px; margin: 3rem auto 0; padding-top: 1.2rem; display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.12); color: #7f92a3; font-size: .67rem; }.footer-bottom p { margin: 0; }.footer-bottom div { display: flex; gap: 1rem; }.footer-bottom a { color: #abb9c7; font-weight: 700; }
.modal-backdrop { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 1rem; background: rgba(4,12,23,.72); backdrop-filter: blur(3px); }.trade-modal { width: min(100%, 620px); max-height: min(760px, calc(100vh - 2rem)); overflow-y: auto; color: var(--ink); background: #fff; border: 1px solid #65768a; box-shadow: 0 25px 55px rgba(0,0,0,.35); }.modal-head { padding: 1.5rem 1.5rem 1rem; display: flex; justify-content: space-between; gap: 1rem; }.modal-head .eyebrow { margin-bottom: .35rem; }.modal-head h2 { margin: 0; color: var(--navy); font-size: 1.55rem; letter-spacing: -.045em; }.modal-head .icon-button { color: var(--navy); border-color: var(--line); }.modal-progress { height: 3px; display: flex; gap: 2px; padding: 0 1.5rem; }.modal-progress span { height: 2px; flex: 1; background: #d8e0e7; }.modal-progress .is-current { background: var(--gold); }.modal-body { padding: 1.1rem 1.5rem 1.6rem; }.modal-intro { color: var(--slate); font-size: .87rem; }.choice-stack { display: grid; gap: .65rem; margin-top: 1.2rem; }.choice-card { padding: 1rem; display: grid; grid-template-columns: 37px 1fr 18px; gap: .75rem; align-items: center; color: var(--ink); text-align: left; background: #fff; border: 1px solid #c3ced8; border-radius: 5px; }.choice-card:hover { border-color: var(--navy); box-shadow: 0 5px 15px rgba(9,25,43,.08); }.choice-card strong, .choice-card small { display: block; }.choice-card strong { font-size: .9rem; }.choice-card small { color: var(--slate); font-size: .72rem; }.choice-card b { color: var(--gold); }.choice-icon { width: 35px; height: 35px; position: relative; border: 1.5px solid #49647f; border-radius: 4px; }.code-icon:before { content: '••••'; position: absolute; left: 5px; top: 4px; letter-spacing: 1px; color: #49647f; font-size: .9rem; }.code-icon:after { content:''; position:absolute; width: 20px; left: 6px; bottom: 7px; border-top: 1px solid #49647f; }.new-icon { border-radius: 50%; }.new-icon:before, .new-icon:after { content: ''; position: absolute; top: 16px; left: 8px; width: 17px; height: 1px; background: #49647f; }.new-icon:after { transform: rotate(90deg); }.form-block { margin-top: 1.1rem; }.form-block label { display: block; margin-bottom: .4rem; color: #4c6074; font-size: .74rem; font-weight: 760; }.form-block input, .form-block textarea, .form-block select { width: 100%; padding: .7rem .75rem; color: var(--ink); border: 1px solid #b9c6d1; border-radius: 4px; background: #fff; }.form-block textarea { min-height: 88px; resize: vertical; }.form-block input:focus, .form-block textarea:focus, .form-block select:focus { border-color: var(--navy); }.modal-actions { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-top: 1.3rem; }.modal-actions .back-step { color: var(--slate); border: 0; background: transparent; padding: 0; font-size: .8rem; font-weight: 700; }.pending-verification { padding: 1rem; color: #70501a; background: #fbf3e1; border-left: 2px solid var(--gold); font-size: .78rem; }.pending-verification strong { display: block; margin-bottom: .2rem; color: #4a3513; }.item-options { display: grid; gap: .55rem; margin-top: 1rem; }.item-option { padding: .9rem; display: grid; grid-template-columns: 35px 1fr 18px; gap: .75rem; align-items: center; text-align: left; color: var(--ink); background: #fff; border: 1px solid #c6d0da; border-radius: 5px; }.item-option.is-selected { color: var(--navy); background: #edf6f2; border-color: var(--green); }.item-option strong { display: block; font-size: .88rem; }.item-option small { display: block; color: var(--slate); font-size: .68rem; line-height: 1.4; }.modal-type-icon { width: 32px; height: 32px; border: 1.5px solid #49647f; border-radius: 3px; position: relative; }.modal-type-icon.physical:before { content:''; position: absolute; inset: 8px 5px 6px; border: 1px solid #49647f; }.modal-type-icon.value { border-radius: 50%; }.modal-type-icon.value:before { content:'↔'; position:absolute; top: 2px; left: 7px; font-size: 1rem; }.modal-type-icon.digital { border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }.modal-type-icon.digital:before { content:''; position:absolute; width: 7px; height: 7px; border-radius:50%; left: 11px; top: 10px; border: 1px solid #49647f; }.category-select { display: grid; grid-template-columns: repeat(2,1fr); gap: .45rem; margin-top: .7rem; }.category-select button { padding: .55rem; color: #465c71; text-align: left; background: #f5f7f9; border: 1px solid #d1dae2; border-radius: 4px; font-size: .7rem; }.category-select button.is-selected { color: var(--navy); background: var(--gold-pale); border-color: var(--gold); font-weight: 720; }.timing-box { margin: 1rem 0; padding: .8rem; color: #263d52; background: #eaf0f4; font-size: .74rem; }.timing-box strong { display: block; color: var(--navy); font-size: .88rem; }.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }.wide { grid-column: 1 / -1; }.details-label { margin: 1rem 0 .2rem; color: var(--navy); font-size: .9rem; font-weight: 760; }.upload-box { padding: .8rem; color: #506679; border: 1px dashed #93a6b7; background: #f8fafb; font-size: .75rem; }.upload-box strong { color: var(--navy); }.checkbox-row { display: flex; align-items: flex-start; gap: .55rem; margin-top: .9rem; color: #41576b; font-size: .75rem; }.checkbox-row input { margin: .2rem 0 0; accent-color: var(--green); }.insurance-cost { padding: .75rem; margin-top: .5rem; color: #375365; background: #edf4f5; font-size: .74rem; }.insurance-cost strong { color: var(--navy); }.handling-options { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }.handling-option { padding: .7rem; color: #455b70; background: #f6f8f9; border: 1px solid #d1dbe3; border-radius: 4px; text-align: left; }.handling-option.is-selected { color: #183b36; background: var(--green-pale); border-color: var(--green); }.handling-option strong, .handling-option small { display: block; }.handling-option strong { font-size: .74rem; }.handling-option small { margin-top: .12rem; font-size: .63rem; line-height: 1.35; }.expert-choice { display: flex; gap: .5rem; margin-top: .5rem; }.expert-choice button { padding: .48rem .55rem; color: #506476; background: #f7f8fa; border: 1px solid #cbd5de; border-radius: 4px; font-size: .68rem; }.expert-choice button.is-selected { color: #4d360f; border-color: var(--gold); background: var(--gold-pale); }.prototype-detail-note { margin: 1rem 0 0; color: #6b7e8f; font-size: .66rem; line-height: 1.45; }.toast { position: fixed; z-index: 100; right: 1rem; bottom: 1rem; max-width: 320px; padding: .85rem 1rem; color: #fff; background: var(--navy); box-shadow: var(--shadow); font-size: .78rem; }
@media (max-width: 1080px) { .site-header { gap: 1.2rem; }.desktop-nav { gap: .9rem; }.desktop-nav a { font-size: .73rem; }.trade-desk { grid-template-columns: minmax(220px, 1fr) minmax(230px, .78fr) minmax(220px, 1fr); }.trade-side { padding: 1.15rem; }.bridge-panel { padding: 1.15rem 1rem; }.trade-type-grid { grid-template-columns: repeat(3,1fr); }.footer-main { grid-template-columns: 2fr repeat(4, 1fr); gap: 1.2rem; } }
@media (max-width: 850px) { .desktop-nav, .header-actions .text-action, .header-cta { display: none; }.menu-toggle { display: block; }.site-header { height: 67px; }.mobile-nav { top: 67px; }.page { min-height: calc(100vh - 67px); }.hero-band { grid-template-columns: 1fr; gap: 2rem; padding-top: 4rem; }.prototype-note { max-width: 520px; }.workspace-section { margin-top: -1rem; }.trade-desk { grid-template-columns: 1fr 1fr; }.bridge-panel { grid-column: 1 / -1; min-height: auto; order: 2; }.your-side { order: 1; }.partner-side { order: 3; border-left: 1px solid var(--line); }.bridge-panel h3, .bridge-panel .bridge-visual, .bridge-panel .compare-row { display: none; }.summary-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; }.summary-list div { padding: .55rem 0; }.agreement-message { margin-top: .6rem; }.workspace-guide { grid-template-columns: 1fr; max-width: 550px; }.workspace-guide div+div { border-left: 1px solid var(--line); border-top: 0; }.split-intro { grid-template-columns: 1fr; gap: 1rem; }.security-grid { grid-template-columns: repeat(2,1fr); }.footer-main { grid-template-columns: 2fr repeat(2, 1fr); }.footer-brand { grid-column: 1 / -1; padding-right: 0; }.footer-brand p { max-width: 400px; } }
@media (max-width: 610px) { .site-header { padding: 0 1.1rem; }.brand { font-size: 1rem; }.hero-band { padding: 3.2rem 1.25rem 2.3rem; }.hero-copy h1 { font-size: clamp(2.5rem, 12vw, 3.6rem); }.hero-copy .lead { font-size: .94rem; }.hero-actions { display: grid; grid-template-columns: 1fr; }.hero-actions .button { width: 100%; }.workspace-section { padding: 0 .8rem 2rem; }.desk-heading { padding: 1rem; align-items: flex-start; gap: .7rem; flex-direction: column; }.trade-desk { display: flex; flex-direction: column; }.trade-side, .bridge-panel { min-height: auto; padding: 1.15rem; }.partner-side { border-left: 0; border-top: 1px solid var(--line); }.bridge-panel { order: 2; }.summary-list { grid-template-columns: 1fr; }.desk-footer { padding: .8rem 1rem; flex-direction: column; align-items: flex-start; }.desk-footer .button { width: 100%; }.capability-strip { padding: 0 .8rem 1.6rem; grid-template-columns: 1fr; }.capability-strip > div { padding: .8rem; }.content-page { padding: 3.5rem 1.25rem 4rem; }.page-intro { margin-bottom: 2.4rem; }.page-intro h1 { font-size: clamp(2.45rem, 12vw, 3.5rem); }.page-intro > p:last-child { font-size: .95rem; }.process-list li { min-height: 0; grid-template-columns: 45px 1fr 15px; padding: 1.15rem 0; }.process-list h2 { font-size: 1.12rem; }.process-list p { font-size: .78rem; }.trade-type-grid { grid-template-columns: 1fr 1fr; }.trade-type-grid article { min-height: 275px; padding: .95rem; }.security-hero { min-height: 430px; padding: 4rem 1.25rem; }.security-hero h1 { font-size: clamp(2.7rem, 13vw, 4rem); }.security-grid { grid-template-columns: 1fr; padding: 0 .8rem 3rem; }.security-grid article { min-height: 170px; }.security-grid h2 { margin-top: 1.5rem; }.pricing-table { overflow-x: auto; }.pricing-table > div { min-width: 550px; }.pricing-bottom, .support-callout { flex-direction: column; align-items: flex-start; }.pricing-bottom .button, .support-callout .button { width: 100%; }.help-grid { grid-template-columns: 1fr; }.footer-main { grid-template-columns: 1fr 1fr; }.footer-brand { grid-column: 1 / -1; }.footer-bottom { margin-top: 2rem; }.modal-backdrop { padding: 0; place-items: end center; }.trade-modal { width: 100%; max-height: calc(100vh - 1rem); }.modal-head, .modal-body { padding-left: 1.1rem; padding-right: 1.1rem; }.modal-progress { padding: 0 1.1rem; }.detail-grid, .handling-options { grid-template-columns: 1fr; }.category-select { grid-template-columns: 1fr; }.modal-actions { flex-direction: column-reverse; align-items: stretch; }.modal-actions .button { width: 100%; }.modal-actions .back-step { padding: .65rem; }.toast { left: 1rem; right: 1rem; max-width: none; } }

/* Launch refinements: heritage identity, editorial restraint, and a clearly separate sponsor rail. */
.brand { gap: .7rem; }
.brand-mark { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid rgba(201,152,53,.8); border-radius: 2px; background: transparent; }
.brand-mark span { color: var(--gold); font-size: .54rem; font-weight: 850; letter-spacing: .08em; }
.brand-copy { display: inline-grid; line-height: .9; }
.brand-copy small { display: block; margin-top: .28rem; color: #94a5b5; font-size: .43rem; font-weight: 760; letter-spacing: .19em; }
.hero-rail { position: relative; z-index: 1; display: grid; gap: .8rem; align-self: end; }
.commitment-note { display: flex; align-items: flex-start; gap: .75rem; padding: 1rem; color: #cbd5de; font-size: .78rem; line-height: 1.55; border: 1px solid rgba(255,255,255,.19); background: rgba(3,13,26,.27); }
.commitment-note p { margin: 0; }.commitment-note strong { display: block; margin-bottom: .15rem; color: #fff; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.hsbc-ad { padding: .9rem 1rem .85rem; color: #d4dee7; border: 1px solid rgba(255,255,255,.16); background: #091a2d; }
.hsbc-ad .ad-label { margin: 0 0 .6rem; color: #8295a8; font-size: .53rem; font-weight: 800; letter-spacing: .15em; }
.hsbc-name { color: #fff; font-size: 1.05rem; font-weight: 800; letter-spacing: -.03em; }.hsbc-name:before { content: '◇'; margin-right: .32rem; color: #d61e30; font-size: 1rem; }.hsbc-name span { margin-left: .32rem; color: #b7c5d3; font-size: .68rem; font-weight: 650; letter-spacing: 0; }
.hsbc-ad > p:not(.ad-label) { margin: .35rem 0 .7rem; color: #b6c5d4; font-size: .72rem; line-height: 1.45; }.hsbc-ad a { color: #fff; font-size: .7rem; font-weight: 760; }.hsbc-ad a:hover { color: var(--gold); }.hsbc-ad a span { margin-left: .2rem; color: var(--gold); }.hsbc-ad small { display: block; margin-top: .7rem; padding-top: .55rem; color: #758a9f; border-top: 1px solid rgba(255,255,255,.1); font-size: .55rem; line-height: 1.4; }
.empty-item-icon:before, .empty-item-icon:after { content: ''; position: absolute; left: 12px; top: 23px; width: 21px; height: 1px; background: #7890a5; }.empty-item-icon:after { transform: rotate(90deg); }
.value-side-icon { border-radius: 50%; }.value-side-icon:before { content: '↔'; position: absolute; top: 12px; left: 12px; color: #37516a; font-size: 1rem; }.digital-side-icon { border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }.digital-side-icon:before { content: ''; position: absolute; left: 17px; top: 17px; width: 9px; height: 9px; border: 1px solid #37516a; border-radius: 50%; }
.process-list .agreement-step { background: #edf1f4; padding-left: 1rem; padding-right: 1rem; }.step-label { color: #a16c1d !important; font-size: .62rem !important; letter-spacing: .08em; font-weight: 800; margin-bottom: .15rem !important; }
.security-grid .service-security { color: #d9e6f1; background: #183149; }.service-security h2 { color: #fff; }.service-security p { color: #bfd0df; }.footer-brand .service-footer { color: #d9b86c; font-size: .67rem; }
.signin-card .brand-mark { border-color: var(--gold); }.signin-card .brand-copy small { color: #75899d; }
.agreement-notice { padding: 1rem; color: #70501a; background: #fbf3e1; border-left: 2px solid var(--gold); font-size: .78rem; }.agreement-notice strong { display: block; margin-bottom: .2rem; color: #4a3513; }
.detail-note { margin: 1rem 0 0; color: #6b7e8f; font-size: .66rem; line-height: 1.45; }
.button:disabled { cursor: not-allowed; opacity: .45; transform: none; }
.hero-band { isolation: isolate; background: linear-gradient(120deg, #091526 0%, #10243b 100%); }.hero-band:after { z-index: 0; }
.hero-concierge-image { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: 64% center; opacity: .19; filter: grayscale(.18) saturate(.68) contrast(.9); pointer-events: none; }
.concierge-line { display: flex; align-items: center; gap: .55rem; max-width: 560px; margin: 1.25rem 0 0; color: #c1cbd6; font-size: .71rem; letter-spacing: .01em; }.concierge-line span { flex: 0 0 auto; color: #e3bd72; font-size: .6rem; font-weight: 800; letter-spacing: .12em; }
@media (max-width: 850px) { .hero-rail { max-width: 520px; }.commitment-note { max-width: 520px; } }
@media (max-width: 610px) { .hero-concierge-image { object-position: 72% center; opacity: .16; }.concierge-line { align-items: flex-start; flex-direction: column; gap: .25rem; } }

/* TradeGuard identity and private-concierge route desk */
.brand-mark { width: 31px; height: 31px; padding: 0; overflow: hidden; border: 0; background: transparent; }
.brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-mark span { display: none; }
.concierge-line { max-width: 675px; align-items: center; gap: .55rem; }
.concierge-line > p { margin: 0; color: #c1cbd6; }
.route-planner { display: inline-flex; min-width: 168px; margin-left: .25rem; padding: .38rem .5rem; align-items: center; gap: .38rem; color: #f3f6f8; border-left: 1px solid rgba(255,255,255,.24); }
.route-planner:hover { color: #fff; background: rgba(255,255,255,.07); }
.route-planner svg { width: 18px; height: 24px; flex: 0 0 auto; color: #d61e30; }
.route-copy { display: grid; gap: .02rem; color: inherit; letter-spacing: 0; }
.route-copy b { color: inherit; font-size: .66rem; font-weight: 800; }
.route-copy small { color: #aab9c7; font-size: .56rem; }
.route-planner > i { margin-left: auto; color: var(--gold); font-size: .8rem; font-style: normal; }
.contact-page { max-width: 1180px; }
.contact-intro { margin-bottom: 2.4rem; }
.contact-layout { display: grid; grid-template-columns: minmax(290px, .82fr) minmax(360px, 1.18fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.route-card, .contact-form { padding: clamp(1.4rem, 4vw, 3rem); background: #fff; }
.route-card { display: grid; grid-template-columns: minmax(115px, .7fr) 1fr; gap: 1.4rem; align-items: center; background: #f2f5f7; }
.uk-map-large { width: min(100%, 190px); margin: 0 auto; filter: drop-shadow(0 8px 10px rgba(10, 25, 42, .12)); }
.uk-map-large svg { display: block; width: 100%; height: auto; }
.route-card h2 { margin: .25rem 0 .6rem; color: var(--navy); font-size: clamp(1.25rem, 2.6vw, 1.8rem); line-height: 1.08; letter-spacing: -.045em; }
.route-card p:last-child { margin: 0; color: var(--slate); font-size: .78rem; line-height: 1.55; }
.contact-form { display: grid; gap: 1rem; align-content: start; }
.contact-form label { display: grid; gap: .4rem; color: #41576b; font-size: .72rem; font-weight: 760; }
.contact-form input, .contact-form textarea { width: 100%; padding: .72rem .75rem; color: var(--ink); border: 1px solid #b9c6d1; border-radius: 4px; background: #fff; }
.contact-form textarea { min-height: 90px; resize: vertical; }
.contact-form .button { width: fit-content; margin-top: .25rem; }
.contact-form .form-note { margin: 0; padding-top: .85rem; color: #788a9a; border-top: 1px solid var(--line); font-size: .67rem; line-height: 1.45; }
.help-grid a { padding: .9rem 1rem; display: flex; align-items: center; justify-content: space-between; color: var(--ink); border: 1px solid var(--line); background: #fff; font-size: .78rem; font-weight: 700; }
.help-grid a:hover { color: var(--navy); border-color: var(--navy); }
.help-grid a span { color: var(--gold); }
@media (max-width: 760px) { .contact-layout { grid-template-columns: 1fr; }.route-card { grid-template-columns: 125px 1fr; }.concierge-line { align-items: flex-start; flex-wrap: wrap; }.route-planner { margin-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.24); } }
@media (max-width: 610px) { .brand-mark { width: 27px; height: 27px; }.concierge-line > p { width: 100%; }.route-planner { width: min(100%, 218px); }.route-card { grid-template-columns: 90px 1fr; gap: 1rem; }.contact-form .button { width: 100%; } }

/* Friendlier wallet-style product layer: original Trade Bridge treatment. */
:root { --navy: #0b3557; --navy-2: #145f91; --ink: #102f49; --slate: #46647c; --steel: #7796ad; --line: #d6e5ef; --canvas: #f5faff; --paper: #fff; --soft: #eaf4fa; --gold: #117ebc; --gold-pale: #e3f3fc; --green: #0f7f5d; --green-pale: #e0f5ed; --radius: 15px; --shadow: 0 14px 35px rgba(11, 53, 87, .12); }
.site-header { height: 78px; background: linear-gradient(105deg, #082d4b 0%, #0d527e 100%); box-shadow: 0 2px 16px rgba(5, 37, 64, .22); }
.desktop-nav a { color: #eaf6fc; }.desktop-nav a:hover, .desktop-nav a.is-active { color: #fff; box-shadow: inset 0 -3px 0 #8ad0ee; }
.button { border-radius: 11px; }.button-primary { color: #fff; background: #0f7f5d; box-shadow: 0 8px 18px rgba(10, 97, 70, .26); }.button-primary:hover { background: #0b684c; }.button-quiet { color: #0b3557; border-color: #bfd8e6; background: #fff; }.button-quiet:hover { color: #fff; background: #0d527e; border-color: #0d527e; }
.hero-band { padding-top: clamp(3.4rem, 7vw, 6.9rem); padding-bottom: clamp(2.8rem, 5vw, 5rem); background: linear-gradient(108deg, #0b3e66 0%, #106e9f 61%, #0d5686 100%); border-radius: 0 0 30px 30px; }
.hero-band:before { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(90deg, rgba(5, 38, 65, .82) 0%, rgba(7, 62, 99, .65) 55%, rgba(8, 78, 118, .48) 100%); }
.hero-band:after { border-color: rgba(177, 226, 246, .38); }.hero-copy, .hero-rail { position: relative; z-index: 1; }.hero-copy h1 { letter-spacing: -.055em; }.hero-copy .lead { color: #f4fbff; max-width: 600px; font-size: clamp(1rem, 1.6vw, 1.13rem); }
.live-dot { background: #7be4c5; box-shadow: 0 0 0 4px rgba(123, 228, 197, .16); }.hero-copy .eyebrow { color: #e6f6fc; }
.guard-strip { max-width: 490px; display: flex; align-items: center; gap: .6rem; margin: -0.45rem 0 1.35rem; padding: .52rem .7rem; border-radius: 12px; background: rgba(1, 26, 47, .42); border: 1px solid rgba(206, 238, 250, .3); }
.guard-strip img { width: 27px; height: 27px; }.guard-strip p { display: grid; gap: .04rem; margin: 0; }.guard-strip strong { color: #fff; font-size: .75rem; }.guard-strip span { color: #e9f8ff; font-size: .7rem; line-height: 1.35; }
.hero-actions .button-quiet { color: #0b3557; border-color: #fff; background: #fff; }.hero-actions .button-quiet:hover { color: #fff; background: transparent; }
.commitment-note, .hsbc-ad { border-radius: 14px; }.commitment-note { background: rgba(255,255,255,.13); border-color: rgba(255,255,255,.2); backdrop-filter: blur(5px); }.hsbc-ad { color: var(--ink); background: #fff; border: 0; box-shadow: 0 14px 28px rgba(34, 3, 45, .18); }
.commitment-note { background: rgba(2, 28, 49, .58); border-color: rgba(208, 237, 249, .28); }.commitment-note p { color: #edf8fd; }.commitment-note strong { color: #fff; }
.hsbc-ad .ad-label { color: #52728a; font-size: .63rem; }.hsbc-name { display: flex; align-items: center; gap: .48rem; color: var(--ink); }.hsbc-name:before { content: none; }.hsbc-name img { display: block; width: 86px; height: auto; }.hsbc-name span { margin: 0; color: #45637b; font-size: .72rem; }.hsbc-ad > p:not(.ad-label) { color: #3f5d74; font-size: .78rem; }.hsbc-ad a { color: #0b5f93; }.hsbc-ad a:hover { color: #0b7fb9; }.hsbc-ad a span { color: #0b7fb9; }.hsbc-ad small { color: #617f94; border-color: #dfeaf1; font-size: .63rem; }
.workspace-section { margin-top: -1.55rem; }.desk-heading { border-radius: 16px 16px 0 0; border-bottom: 0; box-shadow: 0 8px 22px rgba(11, 53, 87, .08); }.desk-status { border-radius: 999px; }.trade-desk { overflow: hidden; border-radius: 0; box-shadow: 0 14px 28px rgba(11, 53, 87, .08); }.bridge-panel { background: linear-gradient(165deg, #0b3d66, #0e6e9f); }.draft-badge { border-radius: 999px; }.desk-footer { border-radius: 0 0 16px 16px; box-shadow: 0 12px 24px rgba(11, 53, 87, .08); }.capability-strip { margin-top: 1.5rem; border-radius: 16px; overflow: hidden; background: #d6e5ef; }.capability-strip > div { background: #fff; }
.trade-side, .bridge-panel { min-height: 430px; }.item-icon, .empty-token { border-radius: 12px; }.panel-edit { color: #0b669d; }.state-label.active { color: #087557; }.service-footer { color: #53b8e2 !important; }
.contact-layout, .pricing-table { border-radius: 16px; overflow: hidden; }.route-card { background: linear-gradient(145deg, #e8f5fb, #fff); }.contact-form input:focus, .contact-form textarea:focus { outline: 3px solid rgba(15, 127, 93, .17); border-color: #0f7f5d; }
@media (max-width: 610px) { .site-header { height: 68px; }.page { min-height: calc(100vh - 68px); }.hero-band { border-radius: 0 0 23px 23px; }.guard-strip { margin-top: -.7rem; }.workspace-section { margin-top: -1rem; }.desk-heading { border-radius: 13px 13px 0 0; }.desk-footer { border-radius: 0 0 13px 13px; } }

/* Active TradeGuard agreement variables */
.desk-heading h2 span { color: var(--navy); font-family: var(--sans); font-size: .78rem; font-weight: 760; letter-spacing: .1em; }
.trade-code-line { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem .55rem; margin: .85rem 0 .6rem; padding: .5rem .58rem; color: #c9e2f2; border: 1px solid rgba(208, 236, 249, .24); background: rgba(0, 26, 48, .26); }
.trade-code-line > span { color: #aad1e7; font-size: .58rem; font-weight: 820; letter-spacing: .12em; }
.trade-code-line strong { color: #fff; font-size: .84rem; letter-spacing: .1em; }
.trade-code-line i { margin-left: auto; padding: .16rem .32rem; color: #06362a; background: #8ae4c8; border-radius: 999px; font-size: .52rem; font-style: normal; font-weight: 860; letter-spacing: .07em; }
.agreement-lanes { display: grid; grid-template-columns: minmax(0, 1fr) 27px minmax(0, 1fr); gap: .4rem; align-items: stretch; margin: .85rem 0; }
.agreement-lane { min-width: 0; padding: .66rem .58rem; border: 1px solid rgba(213, 238, 250, .2); background: rgba(3, 30, 52, .26); }
.agreement-lane p { margin: 0 0 .38rem; color: #a7cce2; font-size: .53rem; font-weight: 820; letter-spacing: .12em; }
.agreement-lane h4 { margin: 0; color: #fff; font-size: .76rem; line-height: 1.18; letter-spacing: -.02em; }
.agreement-lane strong, .agreement-lane span { display: block; }
.agreement-lane strong { margin-top: .34rem; color: #a8e9d4; font-size: .68rem; }
.agreement-lane span { margin-top: .32rem; color: #c6d9e6; font-size: .58rem; line-height: 1.38; }
.item-lane strong { color: #f4d690; }
.lane-flow { display: grid; grid-template-rows: 1fr auto 1fr; align-items: center; justify-items: center; color: #a8d4e8; }
.lane-flow span { width: 1px; height: 100%; min-height: 10px; background: rgba(181, 220, 239, .5); }.lane-flow b { display: grid; width: 22px; height: 22px; place-content: center; color: #fff; border: 1px solid #7ab8d4; border-radius: 50%; background: #124e77; font-size: .67rem; }
.variable-summary { margin-top: .55rem; }.variable-summary div { gap: .55rem; }.variable-summary dt { display: flex; align-items: center; }.variable-summary dd { max-width: 53%; white-space: normal; line-height: 1.25; }
.summary-icon.wallet { border-radius: 2px; }.summary-icon.confirm { border-radius: 50%; border-color: #85dfc5; }.summary-icon.release { border-radius: 1px 1px 5px 5px; border-color: #f3d895; }.summary-icon.keycode { transform: rotate(45deg); border-color: #a6cfe2; }
.agreement-message #agreement-message-text { color: inherit; margin: 0; }
.partner-side .item-kind { margin-bottom: .18rem; }.partner-side .partner-empty { align-items: flex-start; }.partner-side .item-icon { margin-top: .05rem; }.partner-side .side-details dd { white-space: normal; }
@media (max-width: 850px) { .bridge-panel h3 { display: block; }.agreement-lanes { max-width: 560px; }.variable-summary { grid-template-columns: 1fr 1fr; } }
@media (max-width: 610px) { .trade-code-line i { margin-left: 0; }.agreement-lanes { grid-template-columns: 1fr; gap: .55rem; }.lane-flow { grid-template-columns: 1fr auto 1fr; grid-template-rows: 1fr; min-height: 24px; }.lane-flow span { width: 100%; height: 1px; }.variable-summary { grid-template-columns: 1fr; }.agreement-lane { padding: .75rem; } }