@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Nunito+Sans:wght@400;500;600;700&display=swap');

:root{
  --blue:#2563f5;
  --blue-deep:#1846c4;
  --blue-soft:#eaf0ff;
  --blue-softer:#f5f8ff;
  --ink:#12183a;
  --ink-soft:#4a527a;
  --line:#e2e7f7;
  --white:#ffffff;
  --sans:'Nunito Sans', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --display:'Nunito', var(--sans);
  color-scheme: light;
}

*{box-sizing:border-box}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:var(--sans);
  font-size:19px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--blue); text-decoration-thickness:2px}
::selection{background:var(--blue-soft); color:var(--blue-deep)}

.wrap{max-width:880px; margin:0 auto; padding-inline:24px}
@media(min-width:820px){.wrap{padding-inline:48px}}

/* header (shared with landing page) */
header{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.bar{display:flex; align-items:center; justify-content:space-between; padding-block:16px; gap:16px; max-width:1080px; margin:0 auto; padding-inline:24px}
@media(min-width:820px){.bar{padding-inline:48px}}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand img{width:40px; height:40px; border-radius:50%}
.brand span{font-family:var(--display); font-weight:800; font-size:20px; color:var(--ink)}
.back-link{font-family:var(--sans); font-weight:700; font-size:16px; color:var(--blue); text-decoration:none}
.back-link:hover{text-decoration:underline}

/* legal content */
.legal-hero{padding-block:48px 32px; border-bottom:1px solid var(--line); background:var(--blue-softer)}
.legal-hero .eyebrow{font-family:var(--sans); font-weight:700; font-size:15px; letter-spacing:.04em; text-transform:uppercase; color:var(--blue)}
.legal-hero h1{font-family:var(--display); font-weight:800; font-size:36px; margin:14px 0 8px; color:var(--ink)}
@media(min-width:640px){.legal-hero h1{font-size:44px}}
.legal-hero .updated{font-size:16px; color:var(--ink-soft); font-weight:600}

.legal-body{padding-block:48px 80px}
.legal-body section{margin-bottom:44px}
.legal-body h2{
  font-family:var(--display); font-weight:800; font-size:24px; color:var(--ink);
  margin:0 0 16px; padding-bottom:12px; border-bottom:2px solid var(--blue-soft);
}
.legal-body h3{font-family:var(--display); font-weight:700; font-size:19px; color:var(--ink); margin:22px 0 10px}
.legal-body p{margin:0 0 14px; color:var(--ink-soft)}
.legal-body ul{margin:0 0 14px; padding-left:22px; color:var(--ink-soft)}
.legal-body li{margin-bottom:8px}
.legal-body strong{color:var(--ink)}

footer{background:var(--ink); color:rgba(255,255,255,.72); padding-block:44px}
.footer-inner{display:flex; flex-wrap:wrap; gap:20px; align-items:center; justify-content:space-between; max-width:1080px; margin:0 auto; padding-inline:24px}
@media(min-width:820px){.footer-inner{padding-inline:48px}}
.footer-brand{display:flex; align-items:center; gap:12px}
.footer-brand img{width:32px; height:32px; border-radius:50%}
.footer-brand span{font-family:var(--display); font-weight:800; color:#fff; font-size:17px}
.footer-links{display:flex; flex-wrap:wrap; gap:20px; font-size:15px}
.footer-links a{text-decoration:none; color:rgba(255,255,255,.72)}
.footer-links a:hover{color:#fff}
.footer-bottom{margin-top:28px; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); font-size:14px; color:rgba(255,255,255,.5); max-width:1080px; margin-inline:auto; padding-inline:24px}
@media(min-width:820px){.footer-bottom{padding-inline:48px}}