/*
  The two documents Google asks for before it will let anybody sign in with
  their account, and that this product needs on its own account: it stores
  customers' names and numbers, and their guests' names and numbers too.

  Deliberately outside the app. A hash route is invisible to a crawler with no
  JavaScript, and these two pages exist to be read by one — so they are plain
  files at real paths, served by the same rewrite that serves `share.php`.
  That also means they keep working on a day the bundle does not.

  No web fonts and no scripts: what a reader needs from a privacy policy is the
  text, immediately, on whatever connection they have.
*/

:root {
  --ink: #2f2a26;
  --muted: #6b6058;
  --plum: #4a1f3d;
  --accent: #a8863f;
  --paper: #fbf7f1;
  --line: #e6ddd0;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Segoe UI", Tahoma, "Noto Naskh Arabic", "Times New Roman", serif;
  font-size: 17px;
  line-height: 1.9;
}

.wrap {
  max-width: 46rem;
  margin: 0 auto;
  padding: 2.5rem 1.25rem 4rem;
}

header.mast {
  border-bottom: 1px solid var(--line);
  padding-bottom: 1.25rem;
  margin-bottom: 2rem;
}

.brand {
  color: var(--plum);
  font-size: 1.5rem;
  font-weight: 700;
  text-decoration: none;
  /* 44px on a phone: it is the only way back from these two pages. */
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

/* The same, for the addresses at the foot of each document. */
section a[href^="mailto:"],
section a[href^="https://wa.me"],
footer.foot a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.updated {
  color: var(--muted);
  font-size: 0.85rem;
  margin-top: 0.35rem;
}

h1 {
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 2rem 0 0.5rem;
  color: var(--plum);
}

h2 {
  font-size: 1.2rem;
  margin: 2.25rem 0 0.6rem;
  color: var(--plum);
}

p,
li {
  margin: 0.7rem 0;
}

ul {
  padding-inline-start: 1.4rem;
}

a {
  color: var(--plum);
}

strong {
  color: var(--ink);
}

.note {
  border: 1px solid var(--line);
  border-inline-start: 3px solid var(--accent);
  background: #fff;
  padding: 0.9rem 1.1rem;
  margin: 1.4rem 0;
  border-radius: 0.5rem;
}

.divider {
  margin: 3.5rem 0 0;
  border: 0;
  border-top: 1px solid var(--line);
}

section[lang="en"] {
  direction: ltr;
  text-align: left;
}

section[lang="ar"] {
  direction: rtl;
  text-align: right;
}

footer.foot {
  margin-top: 3rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.85rem;
}