/* madefromfile — policy pages
 *
 * The holding page is one screen of drawing. These are documents, so they
 * borrow its frame, its film and its ink and then get out of the way: a measure
 * a person can actually read, headings that separate rather than shout, and no
 * ornament competing with the words. Somebody is here because Meta sent them or
 * because they want to know what happens to their uploaded model, and both of
 * them are reading rather than looking.
 *
 * Loaded after styles.css and depends on its tokens.
 */

/* No fixed canvas on these pages, so nothing to sit above; the sheet grows with
   the document instead of filling one screen. */
.policybody .sheet { min-height: 0; }

.masthead__home {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: inherit;
  text-decoration: none;
}
.masthead__home:hover .wordmark { color: var(--live-ink); }

.policy {
  /* 68 characters or so at the sizes above. Legal prose is the text people are
     least willing to read, so it gets the most readable measure on the site. */
  max-width: 40rem;
  margin: clamp(1.5rem, 4vw, 2.5rem) 0 0;
  display: grid;
  gap: 1rem;
}

.policy__title {
  font-size: clamp(1.75rem, 4.2vw, 2.6rem);
  font-stretch: 112%;
  line-height: 1.05;
  letter-spacing: -0.015em;
  margin: 0;
  text-wrap: balance;
}

/* The version, in the monospace the rest of the site uses for anything that is
   a value rather than a sentence. It is the field Google and Meta ask us to
   keep stable, and the one a customer quotes back at us. */
.policy__ver {
  margin: 0;
  font-family: var(--mono);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mid);
}

.policy__lede { margin: 0.5rem 0 0; font-size: 1.05rem; color: var(--ink); }

.policy h2 {
  margin: 1.4rem 0 0;
  font-size: 1.05rem;
  font-stretch: 108%;
  letter-spacing: 0.01em;
  padding-top: 1.1rem;
  border-top: 1px solid var(--rule);
}

.policy p { margin: 0; }
.policy ul { margin: 0; padding-left: 1.15rem; display: grid; gap: 0.45rem; }
.policy li { line-height: 1.6; }

.policy a { color: var(--live-ink); text-underline-offset: 0.15em; }
.policy a:hover { color: var(--live); }

/* The one instruction on the deletion page that somebody has to act on, set
   apart from the paragraphs around it. A support address buried in a sentence
   is one people miss and then write to us to ask for. */
.policy__do {
  display: grid;
  gap: 0.3rem;
  margin: 0.4rem 0;
  padding: 0.9rem 1rem;
  border: 1px solid var(--rule);
  background: var(--film-2);
  font-size: 1.05rem;
}
.policy__do__sub { font-family: var(--mono); font-size: 0.72rem; color: var(--ink-mid); }

.policy__contact { line-height: 1.7; }

/* Every policy links to every other one, above the title block. A validator and
   a person both arrive on one of these from somewhere else and need to reach
   the rest without going via a home page. */
.polnav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.4rem;
  margin: clamp(2rem, 5vw, 3rem) 0 1.25rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--rule);
  font-family: var(--mono);
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}
.polnav a { color: var(--ink-mid); text-decoration: none; }
.polnav a:hover { color: var(--live-ink); text-decoration: underline; }
.polnav__here { color: var(--ink); }

/* The title block is a footer of fields on the holding page and it stays one
   here, pushed to the end of the document rather than the end of the screen. */
.policybody .titleblock { margin-top: 0; }

/* On the holding page the same row sits under the title block, where a footer
   normally is, rather than above it. */
.polnav--home { margin: 1.25rem 0 0; padding-top: 1rem; }