/* Sierra, les pages légales : une colonne de lecture, les jetons du site. */
.lg {
  padding: calc(64px + clamp(48px, 7vw, 120px)) var(--margin) var(--gap-section);
}

.lg-head {
  display: grid;
  gap: 18px;
  max-width: 820px;
}

.lg-title {
  font-size: clamp(44px, 5.4vw, 104px);
  font-weight: 900;
  font-stretch: 86%;
  line-height: 0.92;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.lg-lede {
  max-width: 44ch;
  font-size: clamp(18px, 1.5vw, 24px);
  line-height: 1.4;
}

.lg-date {
  font-size: 15px;
  color: var(--muted);
}

.lg-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: clamp(32px, 4vw, 56px) 0;
}

.lg-switch a {
  padding: 10px 18px;
  border-radius: var(--radius-pill);
  background: var(--raised);
  color: var(--ink);
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
}

.lg-switch a[aria-current="page"] {
  background: var(--lime);
  color: var(--on-lime);
}

.lg-body {
  display: grid;
  gap: clamp(32px, 3vw, 48px);
  max-width: 760px;
}

.lg-body section {
  display: grid;
  gap: 14px;
}

.lg-body h2 {
  font-size: clamp(22px, 1.8vw, 30px);
  font-weight: 750;
  line-height: 1.2;
}

.lg-body p,
.lg-body li {
  font-size: 17px;
  line-height: 1.6;
}

.lg-body ul {
  display: grid;
  gap: 8px;
  padding-left: 22px;
}

.lg-body li::marker {
  color: var(--lime);
}

.lg-body a,
.lg-page .footer-legal a {
  color: var(--lime);
}

.lg-todo {
  padding: 0 6px;
  border-radius: 6px;
  background: var(--lime);
  color: var(--on-lime);
}

@media (max-width: 1099px), (max-aspect-ratio: 1/1) {
  .lg {
    padding: 112px 20px 72px;
  }
}