/* /legal . the reference document.
   Loads on top of site.css. Smaller copy, longer measure, built to be
   scanned and scrolled rather than sold from. Nav, footer and tokens all
   come from site.css so this page cannot drift from the rest of the site. */

.legal{padding:0 0 20px}
.legal .wrap{max-width:860px}

/* the anchor rail. sticky under the main nav on desktop, stacked on mobile */
.legalnav{position:sticky;top:55px;z-index:50;background:#1B232B;border-bottom:1px solid rgba(255,255,255,.09)}
.legalnav .wrap{display:flex;gap:26px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}
.legalnav a{font-size:12px;font-weight:700;letter-spacing:2.2px;text-transform:uppercase;color:#8E98A2;border-bottom:2px solid transparent;padding-bottom:3px}
.legalnav a:hover{color:var(--ink)}
.legalnav a.on{color:var(--coral);border-bottom-color:var(--coral)}
@media(max-width:760px){.legalnav{position:static}.legalnav .wrap{gap:16px}}

.legal section{padding:44px 0;border-top:1px solid rgba(255,255,255,.07)}
.legal .lede{padding:64px 0 40px;border-top:none}
.legal .lede h1{font-size:2.6rem;max-width:none}
.legal .lede p{font-size:1.1rem;color:#DCE2E8;max-width:60ch;margin-top:16px}

/* section headings: ONE. Terms. */
.legal .sect{font-size:1.9rem;font-weight:800;letter-spacing:-.6px;max-width:none;margin:0 0 6px}
.legal .sect .no{color:var(--coral)}
.legal h3{font-size:1.16rem;font-weight:700;margin:30px 0 8px;color:var(--ink)}
.legal h4{font-size:.98rem;font-weight:700;margin:20px 0 4px;color:#C3CBD3}
.legal p{font-size:.95rem;line-height:1.62;max-width:72ch;color:#A6B0BA}
.legal p+p{margin-top:11px}
.legal p b,.legal p strong{color:var(--ink);font-weight:600}
.legal a[href^="mailto"],.legal a[href^="/legal"]{color:var(--coral);text-decoration:underline;text-underline-offset:3px}

/* the numbered runs in Your data, and the arrow lists in Privacy */
.legal .step{margin-top:16px}
.legal .step b{display:block;color:var(--ink);font-weight:700;font-size:1rem;margin-bottom:3px}
.legal .arrows{list-style:none;margin-top:12px}
.legal .arrows li{font-size:.95rem;line-height:1.62;color:#A6B0BA;padding:7px 0 7px 26px;position:relative;max-width:72ch}
.legal .arrows li:before{content:"\2192";position:absolute;left:0;top:7px;color:var(--coral);font-weight:700}

/* the definition-style runs: What we collect, How long we keep it */
.legal .defs{margin-top:14px}
.legal .defs div{padding:11px 0;border-top:1px solid rgba(255,255,255,.09);font-size:.95rem;line-height:1.62;color:#A6B0BA;max-width:72ch}
.legal .defs div:last-child{border-bottom:1px solid rgba(255,255,255,.09)}
.legal .defs b{color:var(--ink);font-weight:600}

.legal .who{margin-top:14px;font-size:.95rem;line-height:1.7;color:#A6B0BA}
.legal .who b{color:var(--ink);font-weight:600}

.legal .callout{margin-top:18px;border-left:4px solid var(--coral);background:rgba(255,255,255,.03);border-radius:0 10px 10px 0;padding:16px 20px}
.legal .callout p{max-width:64ch}

.legal .endmatter{padding:38px 0 60px;border-top:1px solid rgba(255,255,255,.07);font-size:.86rem;line-height:1.7;color:#7D8791}
.legal .endmatter b{color:#A6B0BA;font-weight:600}
.legal .endmatter .promise{margin-top:16px;color:#A6B0BA;font-size:.95rem;max-width:60ch}