:root { --ink:#18282e; --muted:#627178; --line:#dce3e2; --paper:#fffefd; --accent:#0c7067; --accent-dark:#07534d; --error:#b42318; --wash:#f0f5f3; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#f7f8f6; font-family:"DM Sans",Arial,sans-serif; line-height:1.5; }
.shell { width:min(100% - 32px, 824px); margin:0 auto; padding:24px 0 56px; }
.header { display:flex; align-items:center; justify-content:space-between; padding-bottom:58px; }
.brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-size:14px; font-weight:700; line-height:1.03; letter-spacing:.02em; }
.brand small { font-size:12px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; }.brand-mark { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--ink); border-radius:50%; font-family:"Playfair Display",serif; font-size:12px; }
.secure,.eyebrow { margin:0; color:var(--muted); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }.secure span { color:var(--accent); font-size:16px; vertical-align:-1px; }
.intro { max-width:650px; margin-bottom:42px; }.eyebrow { color:var(--accent); font-weight:700; }.intro h1 { margin:10px 0 12px; font:700 clamp(35px,6vw,54px)/1.1 "Playfair Display",Georgia,serif; letter-spacing:-.035em; }.intro > p:last-child { max-width:610px; margin:0; color:var(--muted); font-size:17px; }
.form-section { border-top:1px solid var(--line); padding:28px 0 31px; }.section-heading { display:flex; gap:15px; margin-bottom:27px; }.section-heading>span { color:var(--accent); font:600 13px/1.7 "DM Sans"; }.section-heading h2 { margin:0; font-size:18px; letter-spacing:-.01em; }.section-heading p { margin:4px 0 0; color:var(--muted); font-size:14px; }
.fields { display:grid; grid-template-columns:1fr 1fr; gap:20px; }.field { display:block; font-size:14px; font-weight:600; }.field.full { grid-column:1/-1; }.field b { color:var(--accent); }.field input,.field textarea { display:block; width:100%; margin-top:7px; padding:12px 13px; border:1px solid #bdc9c7; border-radius:4px; color:var(--ink); background:var(--paper); font:400 16px/1.35 inherit; outline:none; transition:border .15s,box-shadow .15s; resize:vertical; }.field input:focus,.field textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(12,112,103,.13); }.field.invalid input,.field.invalid textarea { border-color:var(--error); }.error { display:block; min-height:18px; padding-top:4px; color:var(--error); font-size:12px; font-weight:500; }
.dropzone { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:186px; padding:24px; border:1px dashed #8fa7a3; border-radius:6px; color:var(--muted); background:#fbfcfb; text-align:center; cursor:pointer; transition:.15s; }.dropzone:hover,.dropzone.dragging { border-color:var(--accent); background:#f1f8f6; }.dropzone input { position:absolute; width:100%; height:100%; opacity:0; cursor:pointer; }.dropzone strong { color:var(--ink); font-size:15px; }.dropzone u { color:var(--accent); text-underline-offset:3px; }.dropzone span { margin-top:6px; font-size:13px; }.upload-icon { display:grid; place-items:center; width:36px; height:36px; margin-bottom:13px; border-radius:50%; background:#dcefea; color:var(--accent); font-size:22px; }.documents-error { margin:8px 0 0; }.file-list { display:grid; gap:8px; padding:0; margin:16px 0 0; list-style:none; }.file-item { display:flex; align-items:center; gap:12px; padding:11px 12px; border:1px solid var(--line); border-radius:4px; background:var(--paper); }.file-type { display:grid; place-items:center; flex:0 0 33px; height:33px; border-radius:3px; background:#eaf1ef; color:var(--accent-dark); font-size:10px; font-weight:700; }.file-name { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; font-weight:600; }.file-size { color:var(--muted); font-size:12px; }.file-remove { padding:3px; border:0; color:var(--muted); background:transparent; cursor:pointer; font-size:18px; }.file-remove:hover { color:var(--error); }
.signature-pad { position:relative; overflow:hidden; border:1px solid #bdc9c7; border-radius:5px; background:var(--paper); }.signature-pad:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px rgba(12,112,103,.13); }.signature-pad canvas { display:block; width:100%; height:180px; cursor:crosshair; touch-action:none; }.signature-pad::after { content:"Sign here"; position:absolute; bottom:43px; left:12%; width:76%; border-bottom:1px solid #9eaaa8; color:#8a9996; font-size:12px; text-align:center; pointer-events:none; }.clear-signature { position:absolute; right:11px; bottom:10px; padding:5px 7px; border:0; color:var(--accent-dark); background:var(--paper); font:600 12px inherit; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }.signature-error { margin:8px 0 0; }
.privacy-note { display:flex; align-items:flex-start; gap:10px; padding:15px 17px; margin:3px 0 24px; border-radius:4px; background:var(--wash); color:#526662; font-size:13px; }.privacy-note span { color:var(--accent); }.privacy-note p { margin:0; }.submit { display:flex; align-items:center; justify-content:space-between; width:100%; padding:16px 20px; border:0; border-radius:4px; color:#fff; background:var(--accent); font:600 16px inherit; cursor:pointer; transition:background .15s,transform .15s; }.submit:hover { background:var(--accent-dark); }.submit:disabled { cursor:wait; opacity:.74; }.submit:not(:disabled):active { transform:translateY(1px); }.submit-note { margin:12px 0 0; color:var(--muted); font-size:12px; text-align:center; }.status { margin:0 0 18px; padding:13px 14px; border-radius:4px; font-size:14px; }.status.loading { background:#e6f1ef; color:#175d57; }.status.success { background:#e7f5ea; color:#17683d; }.status.failure { background:#fff0ef; color:var(--error); }
@media (max-width:580px) { .shell { width:min(100% - 28px,824px); padding-top:18px; }.header { padding-bottom:39px; }.secure { display:none; }.intro { margin-bottom:33px; }.intro > p:last-child { font-size:16px; }.fields { grid-template-columns:1fr; gap:15px; }.field.full { grid-column:auto; }.form-section { padding:24px 0; }.section-heading { margin-bottom:22px; } }
