/* Privacy Policy and Terms of Use (privacy.php, terms-of-use.php) */

.legal-page {
   padding: 100px 20px 72px;
   background: linear-gradient(180deg, var(--bs-baby-blue) 0%, var(--bs-mist) 260px);
}

.legal-wrap {
   max-width: 760px;
   margin: 0 auto;
}

.legal-head h1 {
   margin: 0 0 6px;
   font-size: clamp(28px, 5vw, 38px);
   line-height: 1.15;
   font-weight: 800;
   letter-spacing: -0.02em;
   color: var(--bs-ink);
}

.legal-updated {
   margin: 0 0 24px;
   font-size: 14px;
   font-weight: 600;
   color: var(--bs-slate);
}

/* On this page */
.legal-toc {
   margin-bottom: 20px;
   padding: 18px 22px;
   background-color: white;
   border: 1px solid var(--bs-line);
   border-radius: 16px;
}

.legal-toc h2 {
   margin: 0 0 10px;
   font-size: 12px;
   font-weight: 700;
   letter-spacing: .08em;
   text-transform: uppercase;
   color: var(--bs-slate);
}

.legal-toc ol {
   columns: 2 240px;
   column-gap: 28px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.legal-toc li {
   margin: 0 0 6px;
   break-inside: avoid;
   font-size: 14.5px;
}

.legal-toc a {
   font-weight: 600;
   text-decoration: none;
}

/* The document */
.legal {
   padding: 28px 32px;
   background-color: white;
   border: 1px solid var(--bs-line);
   border-radius: 16px;
   color: var(--bs-ink);
   font-size: 15.5px;
   line-height: 1.7;
   overflow-wrap: break-word;
}

.legal p {
   margin: 0 0 14px;
}

.legal h2 {
   margin: 32px 0 10px;
   padding-top: 20px;
   border-top: 1px solid var(--bs-line);
   font-size: 20px;
   line-height: 1.3;
   font-weight: 800;
   letter-spacing: -0.01em;
   scroll-margin-top: 90px;
}

.legal h2:first-of-type {
   margin-top: 20px;
}

.legal ul,
.legal ol {
   margin: 0 0 14px;
   padding-left: 22px;
}

.legal li {
   margin-bottom: 8px;
}

.legal a {
   font-weight: 600;
   overflow-wrap: anywhere;
}

/* Terms of Use: sections 1, 2, ... with clauses 1.1, 1.2, ... (the text refers
   to clauses by these numbers), and lettered sub-items */
.legal-terms > ol {
   counter-reset: section;
   list-style: none;
   padding-left: 0;
}

.legal-terms > ol > li.bold {
   counter-increment: section;
   margin: 32px 0 10px;
   padding-top: 20px;
   border-top: 1px solid var(--bs-line);
   font-size: 20px;
   line-height: 1.3;
   font-weight: 800;
   scroll-margin-top: 90px;
}

.legal-terms > ol > li.bold::before {
   content: counter(section) ". ";
   color: var(--bs-lagoon);
}

.legal-terms > ol > ol {
   counter-reset: clause;
   list-style: none;
   padding-left: 0;
}

.legal-terms > ol > ol > li {
   counter-increment: clause;
   position: relative;
   padding-left: 46px;
}

.legal-terms > ol > ol > li::before {
   content: counter(section) "." counter(clause);
   position: absolute;
   left: 0;
   font-weight: 700;
   color: var(--bs-slate);
   font-variant-numeric: tabular-nums;
}

.legal-terms ol[type='a'] {
   list-style: lower-alpha;
   margin: 4px 0 12px 46px;
   padding-left: 22px;
}

@media (max-width: 599px) {
   .legal-page {
      padding: 90px 16px 56px;
   }

   .legal {
      padding: 20px 18px;
      font-size: 15px;
   }

   .legal-terms > ol > ol > li {
      padding-left: 38px;
   }

   .legal-terms ol[type='a'] {
      margin-left: 20px;
   }
}