/* Privacy and Support, readable text in the app's look, and fermozi.com's not-found page. */

.text-page { padding: 40px 0 96px; }

/* About 70 characters a line */
.prose { max-width: 35em; font-size: 18px; line-height: 1.6; overflow-wrap: break-word; }

.prose h1 {
  margin: 0;
  font-family: var(--bricolage);
  font-weight: 800;
  font-size: clamp(40px, 5.2vw, 64px);
  line-height: 1;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.prose h2 {
  margin: 56px 0 0;
  padding-top: 24px;
  border-top: 2px solid #D3DAD8;
  font-family: var(--bricolage);
  font-weight: 800;
  font-size: clamp(26px, 3vw, 32px);
  line-height: 1.15;
  letter-spacing: -0.01em;
}

.prose h1 + h2 { margin-top: 40px; }
.prose h3 { margin: 32px 0 0; font-family: var(--bricolage); font-weight: 700; font-size: 22px; line-height: 1.2; }
.prose p, .prose ul, .prose ol { margin: 16px 0 0; }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li + li { margin-top: 8px; }
.prose li::marker { color: #0F5C63; }
.prose strong { font-weight: 700; }

/* The permissions table */
.table-frame { margin-top: 24px; border: 2px solid #0F5C63; border-radius: 14px; overflow: hidden; background: #FFFFFF; }
.prose table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.prose th, .prose td { padding: 12px 14px; text-align: left; vertical-align: top; }
.prose th { font-weight: 700; }
.prose thead th { background: #EEF1F0; }
.prose tbody tr { border-top: 1px solid #D3DAD8; }

/* On a phone each row stacks, with its column names shown. The table keeps its roles for screen readers. */
@media (max-width: 560px) {
  .prose table, .prose tbody, .prose tr, .prose th, .prose td { display: block; }

  .prose thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .prose tbody tr { padding: 14px 16px 16px; }
  .prose tbody tr:first-child { border-top: 0; }
  .prose tbody th { padding: 0; font-size: 17px; }
  .prose tbody td { padding: 8px 0 0; }

  .prose tbody td::before {
    content: attr(data-label);
    content: attr(data-label) / "";
    display: block;
    color: #0F5C63;
    font-size: 14px;
    font-weight: 700;
  }
}

/* fermozi.com's not-found page */
.message { padding: 56px 0 120px; }

.message-title {
  margin: 0;
  max-width: 16em;
  font-family: var(--bricolage);
  font-weight: 800;
  font-size: clamp(36px, 4.6vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.message-text { margin: 16px 0 0; max-width: 34em; font-size: 20px; line-height: 1.5; text-wrap: pretty; overflow-wrap: break-word; }
.message-actions { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
