/* Shared styling for Remote2You legal and trust pages (served from /legal.css). Brand v2 tokens; 4px grid; type scale 12/14/16/18/20/24/32/40/48. */
:root{--navy:#0A1628;--navy-2:#1B3A5C;--blue:#2E7DFF;--blue-2:#2563EB;--ink:#111827;--ink-2:#4B5563;--ink-3:#6B7280;--canvas:#F5F7FA;--panel:#F3F4F6;--line:#E5E7EB;--line-2:#D1D5DB;--on-navy-2:#D1D5DB;--on-navy-3:#9CA3AF;--font:"Segoe UI",Inter,system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;--r:8px}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);background:var(--canvas);color:var(--ink);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
a{color:var(--blue-2);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:4px}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.util{background:var(--navy);color:var(--on-navy-2);font-size:14px}
.util .wrap{display:flex;justify-content:flex-end;gap:28px;height:36px;align-items:center}
.util a{color:var(--on-navy-2)}.util a:hover{color:#fff;text-decoration:none}
header.site{background:#fff;border-bottom:1px solid var(--line)}
.site .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none!important;color:var(--navy)}
.brand .word{font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1}
.brand .word b{color:var(--blue)}
.brand small{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-top:4px}
.btn{display:inline-flex;align-items:center;white-space:nowrap;font:600 16px var(--font);padding:12px 24px;min-height:48px;border-radius:var(--r);border:1px solid var(--line-2);color:var(--navy);text-decoration:none!important}
.btn:hover{background:var(--panel);border-color:var(--navy)}
.hero{background:var(--navy);color:#fff;padding:56px 0 48px;background-image:radial-gradient(60% 120% at 85% 0,rgba(46,125,255,.35),transparent 70%)}
.hero .kicker{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--on-navy-2);font-weight:700;margin-bottom:12px}
.hero h1{color:#fff;font-size:40px;font-weight:700;letter-spacing:-.015em;line-height:1.2}
.hero p{color:var(--on-navy-2);margin-top:12px;font-size:16px;max-width:760px}
main{padding:56px 0 80px}
.doc{display:grid;grid-template-columns:260px 1fr;gap:56px;align-items:start}
.toc{position:sticky;top:24px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px}
.toc h2{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
.toc ol{list-style:none;display:grid;gap:8px;font-size:14px}
.toc a{color:var(--ink-2)}.toc a:hover{color:var(--navy)}
article{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:44px 48px;max-width:860px}
article h2{color:var(--navy);font-size:24px;margin:36px 0 12px;letter-spacing:-.01em}
article h2:first-of-type{margin-top:0}
article h3{color:var(--navy);font-size:18px;margin:24px 0 8px}
article p,article li{color:var(--ink-2);font-size:16px}
article p{margin-bottom:12px}
article ul{margin:0 0 16px 24px}article li{margin-bottom:8px}
article code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;background:var(--panel);padding:0 4px;border-radius:4px}
article blockquote{border-left:4px solid var(--blue);padding:4px 16px;margin:16px 0;background:var(--canvas)}
article table{width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:14px}
article th,article td{text-align:left;padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
article th{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);background:var(--panel)}
article a,.meta a{text-decoration:underline;text-underline-offset:4px}
.body-wrap{padding:56px 0 80px}
.meta{font-size:14px;color:var(--ink-3);margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--line)}
footer{background:var(--navy);color:var(--on-navy-3);padding:36px 0;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px}
footer nav{display:flex;flex-wrap:wrap;gap:24px}
footer a{color:var(--on-navy-2)}footer a:hover{color:#fff}
@media (max-width:900px){.doc{grid-template-columns:1fr}.toc{position:static}article{padding:32px 24px;overflow-x:auto}.hero h1{font-size:32px}}
@media (max-width:640px){.wrap{padding:0 20px}.util .wrap{gap:16px;justify-content:center}.site .wrap{height:68px}.brand .word{font-size:20px}.brand small{display:none}}
