/* ==========================================================================
   Studio Escaut — Legal document page
   Rides on the tokens, the font faces and the type styles in styles.css.
   Adds only the reading column that the coming-soon frame does not have.
   ========================================================================== */

.doc {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 16px 96px;
}

.doc__logo { display: inline-block; margin-bottom: 56px; }
.doc__logo img { width: 191px; height: 22px; }

.doc__title { margin-bottom: 16px; }

.doc__meta {
  margin-bottom: 56px;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: .0324em;
  color: var(--ink-hover);
}

.doc h2, .doc h3 { margin: 0 0 16px; }
.doc h3 {
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: .0324em;
}

.doc section { margin-bottom: 48px; }
.doc section:last-of-type { margin-bottom: 0; }

.doc p, .doc ul { margin: 0 0 16px; }
.doc p:last-child, .doc ul:last-child { margin-bottom: 0; }

.doc ul { padding-left: 20px; }
.doc li { margin-bottom: 10px; }
.doc li:last-child { margin-bottom: 0; }

.doc a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.doc a:hover { color: var(--ink-hover); }
.doc a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.doc__back {
  display: inline-block;
  margin-top: 56px;
  font-size: 9px;
  font-weight: 500;
  line-height: 8px;
  text-transform: uppercase;
}

/* Values the client still has to supply. The highlight is deliberate: no
   version of this page should go live with a lime box still in it. Delete
   this rule together with the last placeholder. */
.fill {
  padding: 0 5px;
  background: var(--lime);
  box-shadow: 0 0 0 1px var(--rule);
}

@media (min-width: 1280px) {
  .doc { padding: 64px 24px 120px; }
  .doc__title { font-size: 52px; line-height: 58px; }
  .doc__logo { margin-bottom: 72px; }
}