/* Dotto public site — shared by the landing page and the legal/support pages. */
:root {
  --bg: #F4F5FB; --surface: #fff; --ink: #1C1F3B; --muted: #5E6385; --primary: #4B57E0;
  --primary-step: #3640B8; --track: #E9EBF5; --cell: #EEF0F7; --hint: #FFD34D; --star: #F5B300;
  --red: #EF4B4B; --blue: #2F6FEB; --yellow: #F2B705; --green: #22A55B; --purple: #8B5CF6; --orange: #F97316;
  --font: ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); -webkit-font-smoothing: antialiased; }
a { color: var(--primary); font-weight: 800; text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Brand ---------- */
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-weight: 900; font-size: 26px; letter-spacing: -.5px; }
.brand:hover { text-decoration: none; }
.brand svg { width: 38px; height: 38px; }

/* ---------- Footer ---------- */
.site-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px;
  font-size: 14px; font-weight: 700; color: var(--muted); }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.site-footer a { color: var(--muted); font-weight: 800; }
.site-footer a:hover { color: var(--ink); text-decoration: none; }

/* ---------- Document pages (privacy / terms / support) ---------- */
.doc { max-width: 760px; margin: 0 auto; padding: 32px 24px 48px; }
.doc header { margin-bottom: 28px; }
.doc main { background: var(--surface); border-radius: 28px; padding: 36px 40px; box-shadow: 0 10px 40px rgba(28, 31, 59, .06); }
.doc h1 { font-size: 36px; font-weight: 900; margin: 0 0 6px; letter-spacing: -.5px; }
.doc h2 { font-size: 20px; font-weight: 900; margin: 30px 0 8px; }
.doc p, .doc li { font-size: 16px; line-height: 1.65; color: #3A3E5C; font-weight: 500; }
.doc .updated { color: var(--muted); font-weight: 700; margin: 0 0 18px; }
.doc .note { background: #FFF3C4; color: #6B4E00; border-radius: 16px; padding: 14px 18px; font-weight: 700; }
.doc .site-footer { margin-top: 28px; }
@media (max-width: 600px) { .doc main { padding: 26px 22px; } .doc h1 { font-size: 30px; } }
