PageSourceSearch

https://www.ariefinance.com/onboarding-requirements

html ariefinance.com collected 2026-10-08 01:29:30 UTC 19,730 bytes, 307 lines download raw bytes

1<!doctype html>
2<html lang="en">
3<head>
4<meta charset="utf-8">
5<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
6<meta name="robots" content="noindex, follow">
7<title>Onboarding Requirements — ARIE Finance</title>
8<link rel="icon" type="image/png" href="/favicon.png">
9<link rel="apple-touch-icon" href="/favicon.png">
10<link rel="preconnect" href="https://fonts.googleapis.com">
11<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=DM+Serif+Display&display=swap" rel="stylesheet">
13<style>
14*{margin:0;padding:0;box-sizing:border-box}
15:root{
16  --navy:#06113A;--indigo:#201485;--indigo-deep:#0F0566;
17  --gold:#b8a070;--gold-deep:#9a8560;--gold-wash:#fffdf5;--gold-line:#f5ecc8;--amber-ink:#92400e;
18  --cream:#fafaf8;--surface:#fff;--rule:#e8e8e5;--rule-soft:#f0f0ee;--sand:#f5f5f3;
19  --ink:#1a1a1a;--mute:#777;--mute-2:#888;--mute-3:#aaa;--placeholder:#ccc;
20  --amber-bg:#fffbeb;--amber-brd:#fde68a;--amber-tag:#fef3c7;
21}
22html,body{height:100%}
23body{background:var(--cream);font-family:'DM Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
24a{color:var(--indigo)}
25a:hover{color:var(--indigo-deep)}
26button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
27button:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;border-radius:4px}
28img{display:block;max-width:100%}
29@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
30@keyframes modalIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
31
32/* ----- Header ----- */
33.site-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--surface);border-bottom:1px solid #eee;position:sticky;top:0;z-index:40}
34.site-hdr img{height:26px;width:auto}
35.site-hdr .ver{font-size:11px;color:#bbb}
36
37/* ----- Container ----- */
38.wrap{max-width:780px;margin:0 auto;padding:40px 20px 60px;animation:fadeIn .4s ease}
39.preview-wrap{max-width:700px;margin:0 auto;padding:32px 20px 60px;animation:fadeIn .4s ease}
40
41/* ----- Landing hero ----- */
42.hero{text-align:center;margin-bottom:36px}
43.eyebrow{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:3px;color:var(--indigo);margin-bottom:12px}
44.h1{font-family:'DM Serif Display',serif;font-size:clamp(28px,5vw,44px);line-height:1.1;color:#0a0a0a;margin-bottom:14px}
45.lead{font-size:clamp(13px,1.5vw,15px);line-height:1.8;color:var(--mute);max-width:520px;margin:0 auto}
46
47/* ----- Two journey cards ----- */
48.cards{display:flex;gap:20px;margin-bottom:28px;flex-wrap:wrap}
49.card{flex:1;min-width:280px;background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:32px 28px 28px;text-align:center;position:relative;overflow:hidden;transition:border-color .2s,box-shadow .2s}
50.card:hover{border-color:#d0cee8;box-shadow:0 4px 24px rgba(32,20,133,.06)}
51.card--recommended{background:linear-gradient(180deg,#fff 0%,#faf9ff 100%);border:2px solid var(--indigo);box-shadow:0 4px 24px rgba(32,20,133,.08)}
52.card--recommended:hover{box-shadow:0 8px 32px rgba(32,20,133,.12)}
53.card-top-rule{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#e8e5dd,#d0cee8,#e8e5dd)}
54.card--recommended .card-top-rule{background:linear-gradient(90deg,var(--indigo),var(--gold),var(--indigo))}
55.card-badge{position:absolute;top:0;right:20px;background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#fff;font-size:9px;font-weight:700;padding:4px 14px;border-radius:0 0 8px 8px;text-transform:uppercase;letter-spacing:1px;box-shadow:0 2px 6px rgba(184,160,112,.3)}
56.card-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
57.card-icon--outline{background:linear-gradient(145deg,#f5f3ff,#ece8ff);box-shadow:0 2px 8px rgba(32,20,133,.08)}
58.card-icon--primary{background:linear-gradient(145deg,var(--indigo),var(--indigo-deep));box-shadow:0 4px 12px rgba(15,5,102,.25)}
59.card h2{font-size:16px;font-weight:600;color:var(--ink);margin-bottom:6px}
60.card p{font-size:13px;color:var(--mute-2);line-height:1.6;margin-bottom:22px}
61.card--recommended p{color:var(--mute)}
62.btn{display:inline-block;padding:10px 26px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s,box-shadow .15s,border-color .15s;line-height:1.2}
63.btn-outline{background:var(--surface);border:1.5px solid var(--indigo);color:var(--indigo)}
64.btn-outline:hover{background:#f8f7ff}
65.btn-primary{background:linear-gradient(135deg,var(--navy),var(--indigo-deep));color:#fff;border:0;box-shadow:0 2px 8px rgba(6,17,58,.25)}
66.btn-primary:hover{box-shadow:0 4px 16px rgba(6,17,58,.35)}
67.card .btn{margin-bottom:12px}
68.card .btn-text{font-size:11px;color:var(--indigo);cursor:pointer;opacity:.7;background:none;border:0;padding:4px 0}
69.card .btn-text:hover{opacity:1}
70
71/* ----- Onboarding pack row ----- */
72.pack{background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:20px;margin-bottom:24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
73.pack-icon{width:48px;height:48px;background:var(--indigo);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;flex-shrink:0}
74.pack-text{flex:1;
74min-width:200px}
75.pack-text .t{font-size:14px;font-weight:600;color:var(--ink)}
76.pack-text .s{font-size:12px;color:var(--mute-2);line-height:1.5;margin-top:2px}
77.pack .btn{padding:8px 20px;border-radius:6px;font-size:12px;flex-shrink:0;margin:0;text-decoration:none}
78.pack .btn-outline{border-width:1.5px}
79
80/* ----- Info note ----- */
81.note{padding:12px 16px;background:var(--gold-wash);border:1px solid var(--gold-line);border-radius:8px;margin-bottom:24px;font-size:11px;color:#8a7530;line-height:1.6}
82
83/* ----- Section accordions ----- */
84.sec-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--mute-3);margin-bottom:14px}
85.acc{background:var(--surface);border:1px solid var(--rule);border-radius:10px;overflow:hidden;margin-bottom:12px}
86.acc-head{width:100%;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;background:none;border:0;text-align:left}
87.acc-head[aria-expanded=true]{border-bottom:1px solid var(--rule-soft)}
88.acc-head-left{display:flex;align-items:center;gap:12px}
89.acc-num{width:36px;height:36px;background:linear-gradient(135deg,var(--indigo),var(--indigo-deep));border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;flex-shrink:0}
90.acc-title{font-size:15px;font-weight:600;color:var(--ink)}
91.acc-chev{font-size:11px;color:#999;transition:transform .15s}
92.acc-head[aria-expanded=true] .acc-chev{transform:rotate(180deg)}
93.acc-ppn{padding:8px 20px;font-size:11px;color:var(--mute-2);font-style:italic;background:#f8f8f6;border-bottom:1px solid var(--rule-soft)}
94.acc-item{padding:10px 20px;border-bottom:1px solid #f8f8f6;font-size:13px;color:#333}
95.acc-item:last-child{border-bottom:0}
96.acc-item.cond{background:#fffdf5}
97.acc-item.cond.may{background:#fefaf0}
98.acc-item .n{display:block}
99.acc-item .note-s{display:block;font-size:11px;color:var(--mute-3);margin-top:2px}
100.acc-item .tag{display:inline-flex;margin-top:4px;padding:1px 8px;background:var(--amber-tag);border-radius:3px;font-size:10px;color:var(--amber-ink);font-weight:500}
101.acc-item .inline-dl{margin-top:4px;font-size:11px}
102.acc-item .inline-dl a{color:var(--indigo);text-decoration:none}
103.acc-item .inline-dl a:hover{text-decoration:underline}
104.acc-item .inline-dl .hint{font-size:10px;color:var(--mute-3);margin-left:6px}
105
106/* ----- Download CTA under requirements ----- */
107.dl-cta{text-align:center;padding:16px;background:var(--surface);border:1px solid var(--rule);border-radius:10px;margin-bottom:24px}
108.dl-cta .lbl{font-size:13px;color:#555;margin-bottom:10px}
109
110/* ----- Footer ----- */
111.site-foot{text-align:center;padding:16px 0}
112.site-foot img{height:18px;width:auto;opacity:.35;margin:0 auto 8px}
113.site-foot .c{font-size:10px;color:#ccc}
114
115/* ----- Preview page ----- */
116.preview-bar{padding:18px 24px;background:var(--surface);border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
117.preview-bar .back{font-size:13px;color:var(--indigo);background:none;border:0;cursor:pointer;padding:4px 0}
118.preview-bar .back:hover{text-decoration:underline}
119.preview-actions{display:flex;gap:10px;flex-wrap:wrap}
120.preview-actions .btn-ed{padding:7px 16px;background:var(--surface);border:1.5px solid #888;border-radius:6px;font-size:12px;color:#555;cursor:pointer}
121.preview-actions .btn-dl{padding:7px 16px;background:var(--navy);color:#fff;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:0}
122.preview-head{margin-bottom:20px}
123.preview-head .k{font-size:11px;color:var(--indigo);font-weight:600;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px}
124.preview-head .co{font-family:'DM Serif Display',serif;font-size:clamp(24px,4vw,28px);color:#0a0a0a;margin-bottom:6px;word-break:break-word}
125.preview-head .meta{font-size:12px;color:#999;line-height:1.6}
126
127/* ----- Modal ----- */
128dialog#gen-modal{padding:0;border:0;background:transparent;max-width:none;max-height:none;overflow:visible}
129dialog#gen-modal::backdrop{background:rgba(10,10,20,.55);backdrop-filter:blur(4px)}
130.modal-shell{background:var(--surface);border-radius:14px;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 64px);display:flex;flex-direction:column;animation:modalIn .18s ease;box-shadow:0 24px 64px rgba(10,10,20,.35)}
131.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--rule-soft)}
132.modal-head .step{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--mute-2)}
133.modal-head .title{font-family:'DM Serif Display',serif;font-size:18px;color:var(--navy);margin-top:2px}
134.modal-close{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--mute-2);font-size:20px;line-height:1}
135.modal-close:hover{background:var(--sand);color:var(--ink)}
136.modal-body{padding:22px;overflow-y:auto}
137.field{margin-bottom:18px}
138.field label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--mute-2);margin-bottom:6px}
139.field input[type=text]{width:100%;padding:11px 13px;border:1px solid var(--rule);border-radius:8px;font:inherit;font-size:14px;color:var(--ink);background:#fff}
140.field input[type=text]:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 3px rgba(32,20,133,.1)}
141.field input[type=text].err{border-color:#c2410c}
142.field .err-msg{display:none;color:#c2410c;font-size:12px;margin-top:6px}
143.field .err-msg.show{display:block}
144.sub-label{font-size:12px;color:var(--mute-2);margin-bottom:10px;line-height:1.5}
145.cat-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:4px}
146.cat-chip{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;cursor:pointer;transition:background .12s,border-color .12s;width:100%;text-align:left}
147.cat-chip .ck{width:18px;height:18px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
148.cat-chip .lbl{font-size:13px;flex:1}
149.cat-chip .always{font-size:10px;text-transform:uppercase;letter-spacing:1px;opacity:.8}
150.cond-q{margin-bottom:18px}
151.cond-q.sep{border-bottom:1px solid var(--rule-soft);padding-bottom:18px}
152.cond-q .q{font-size:13px;color:var(--ink);margin-bottom:4px;line-height:1.5}
153.cond-q .help{font-size:11px;color:var(--mute-2);margin-bottom:8px;line-height:1.5}
154.cond-row{display:flex;gap:8px;flex-wrap:wrap}
155.cond-row button{padding:8px 18px;border-radius:8px;font-size:12px;font-weight:500;flex:1;min-width:72px;transition:background .1s,border-color .1s}
156.cond-err{display:none;background:#fef3f2;border:1px solid #fecaca;color:#b91c1c;font-size:12px;padding:10px 14px;border-radius:8px;margin-bottom:12px}
157.cond-err.show{display:block}
158.modal-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px;border-top:1px solid var(--rule-soft);background:#fafafa;border-radius:0 0 14px 14px}
159.modal-foot .btn-back{font-size:12px;color:var(--mute);background:none;border:0;padding:6px 10px;cursor:pointer}
160.modal-foot .btn-back:disabled{color:var(--placeholder);cursor:default}
161.modal-foot .btn-next,.modal-foot .btn-gen{padding:9px 22px;background:linear-gradient(135deg,var(--navy),var(--indigo-deep));color:#fff;border-radius:8px;font-size:13px;font-weight:500;border:0;cursor:pointer}
162.modal-foot .btn-next:hover,.modal-foot .btn-gen:hover{box-shadow:0 4px 12px rgba(6,17,58,.3)}
163
164/* ----- Small screens ----- */
165@media (max-width:520px){
166  .site-hdr{padding:14px 16px}
167  .site-hdr .ver{display:none}
168  .wrap{padding:28px 16px 48px}
169  .preview-wrap{padding:24px 16px 48px}
170  .card{padding:28px 20px 24px}
171  .pack .btn{width:100%;text-align:center}
172  .cond-row button{min-width:0}
173}
174
175/* ----- Print safety: suppress on-screen chrome ----- */
176@media print{.no-print,.site-hdr,.site-foot,dialog{display:none !important}}
177</style>
178</head>
179<body>
180
181<header class="site-hdr no-print">
182  <a href="/" aria-label="ARIE Finance home"><img src="/onboarding-requirements/assets/arie-logo.png" alt="ARIE Finance"></a>
183  <span class="ver">Requirements v<span id="ver-n">1.0</span> · <span id="ver-d">October 2026</span></span>
184</header>
185
186<main>
187  <!-- Landing view -->
188  <section id="view-landing" class="wrap">
189    <div class="hero">
190      <div class="eyebrow">ARIE Finance</div>
191      <h1 class="h1">Onboarding<br>Requirements</h1>
192      <p class="lead">The standard documentation required for your onboarding with ARIE Finance.</p>
193    </div>
194
195    <div class="cards">
196      <article class="card">
197        <div class="card-top-rule" aria-hidden="true"></div>
198        <div class="card-icon card-icon--outline" aria-hidden="true">
199          <svg width="22" height="22" viewBox="0 0 22 22" fill="none"><rect x="3" y="5" width="16" height="1.5" rx=".75" fill="#201485"/><rect x="3" y="10.25" width="12" height="1.5" rx=".75" fill="#201485" opacity=".6"/><rect x="3" y="15.5" width="14" height="1.5" rx=".75" fill="#201485" opacity=".35"/></svg>
200        </div>
201        <h2>View full requirements</h2>
202        <p>
202Browse all onboarding document requirements, grouped by category.</p>
203        <button type="button" class="btn btn-outline" id="btn-view-reqs">View Requirements ↓</button>
204        <button type="button" class="btn-text" id="btn-dl-generic-hero">Download Generic Checklist</button>
205      </article>
206
207      <article class="card card--recommended">
208        <div class="card-top-rule" aria-hidden="true"></div>
209        <div class="card-badge" aria-hidden="true">Recommended</div>
210        <div class="card-icon card-icon--primary" aria-hidden="true">
211          <svg width="22" height="22" viewBox="0 0 22 22" fill="none"><path d="M11 2l2.5 5.5L19 8.5l-4 4 1 5.5L11 15.5 6 18l1-5.5-4-4 5.5-1L11 2z" fill="#b8a070" stroke="#b8a070" stroke-width=".5"/></svg>
212        </div>
213        <h2>Generate my checklist</h2>
214        <p>Answer a few questions to generate a checklist tailored to your company structure.</p>
215        <button type="button" class="btn btn-primary" id="btn-open-modal">Generate Checklist →</button>
216      </article>
217    </div>
218
219    <div class="pack">
220      <div class="pack-icon" aria-hidden="true">PDF</div>
221      <div class="pack-text">
222        <div class="t">Corporate Onboarding Pack</div>
223        <div class="s">Complete ARIE Finance's corporate onboarding forms and declarations.</div>
224      </div>
225      <a class="btn btn-outline" href="/documents/ARIE_Finance_Corporate_Onboarding_Pack.pdf" download="ARIE_Finance_Corporate_Onboarding_Pack.pdf">Download Onboarding Pack ↓</a>
226    </div>
227
228    <p class="note">This checklist identifies standard documentation. ARIE Finance may request additional information or documentation depending on the entity, ownership structure, jurisdiction, business activities and compliance review.</p>
229
230    <div id="reqs-anchor" class="sec-label">Full requirements</div>
231    <div id="landing-sections"></div>
232
233    <div class="dl-cta">
234      <div class="lbl">Need a printable copy of all requirements?</div>
235      <button type="button" class="btn btn-outline" id="btn-dl-generic-bottom">Download Generic Checklist (PDF)</button>
236    </div>
237
238    <div class="site-foot">
239      <a href="/" aria-label="ARIE Finance home"><img src="/onboarding-requirements/assets/arie-logo.png" alt="ARIE Finance"></a>
240      <div class="c">© 2026 ARIE Finance Ltd · FSC-Licensed Payment Intermediary · Mauritius</div>
241    </div>
242  </section>
243
244  <!-- Preview view -->
245  <section id="view-preview" hidden>
246    <div class="preview-bar">
247      <button type="button" class="back" id="btn-back-landing">← Back to requirements</button>
248      <div class="preview-actions">
249        <button type="button" class="btn-ed" id="btn-edit-details">Edit Details</button>
250        <button type="button" class="btn-dl" id="btn-dl-personalised">Download Personalised Checklist</button>
251      </div>
252    </div>
253    <div class="preview-wrap">
254      <div class="preview-head">
255        <div class="k">Your onboarding checklist</div>
256        <div class="co" id="pv-company"></div>
257        <div class="meta"><span id="pv-structure"></span><br><span id="pv-conds"></span></div>
258      </div>
259      <div id="preview-sections"></div>
260    </div>
261  </section>
262</main>
263
264<!-- Modal -->
265<dialog id="gen-modal" aria-labelledby="modal-title" aria-describedby="modal-step">
266  <div class="modal-shell" role="document">
267    <div class="modal-head">
268      <div>
269        <div class="step" id="modal-step">Step <span id="m-step-n">1</span> of 2</div>
270        <div class="title" id="modal-title">Company &amp; Structure</div>
271      </div>
272      <button type="button" class="modal-close" id="btn-modal-close" aria-label="Close dialog">&times;</button>
273    </div>
274
275    <div class="modal-body">
276      <!-- Step 1 -->
277      <div id="m-s1">
278        <div class="field">
279          <label for="m-company">Company name</label>
280          <input type="text" id="m-company" name="company" maxlength="150" autocomplete="organization" placeholder="e.g. Example Holdings Ltd" required>
281          <div class="err-msg" id="m-company-err">Please enter the company name.</div>
282        </div>
283        <div class="sub-label">Which of these apply to your company?</div>
284        <div class="cat-grid" id="m-cat-grid" role="group" aria-label="Applicable company structure"></div>
285      </div>
286
287      <!-- Step 2 -->
288      <div id="m-s2" hidden>
289        <div class="sub-label">Please answer all three to tailor your checklist.</div>
290        <div class="cond-err" id="m-cond-err">Please answer all three questions before generating.</div>
291        <div id="m-cond-list"></div>
292      </div>
293    </div>
294
295    <div class="modal-foot">
296      <button type="button" class="btn-back" id="btn-modal-back">← Back</button>
297      <button type="button" class="btn-next" id="btn-modal-next">Continue →</button>
298      <button type="button" class="btn-gen" id="btn-modal-gen" hidden>Generate Checklist</button>
299    </div>
300  </div>
301</dialog>
302
303<script src="/onboarding-requirements/vendor/html2canvas.min.js" defer></script>
vendor: 1 bytes, line 303
303
304<script src="/onboarding-requirements/vendor/jspdf.umd.min.js" defer></script>
vendor: 1 bytes, line 304
304
305<script src="/onboarding-requirements/app.js?v=2026-10-02-r2" defer></script>
305
306</body>
307</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.