/* Oikeudellinen. The privacy notice and the booking terms: long text read
 * once, carefully, often on a phone. One column at reading width, plain
 * headings, and nothing that competes with the words.
 *
 * Loaded after kokko.css and varaa.css; only roles from the token contract.
 */

.teksti-sivu {
  max-width: 46rem;
  padding: clamp(2rem, 6vh, 3.5rem) var(--sivu) clamp(3rem, 8vh, 5rem);
}
.teksti-sivu .paivitetty {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.8125rem;
  color: var(--teksti-3);
}
.teksti-sivu h2 {
  margin-top: clamp(2rem, 5vh, 2.75rem);
  font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  font-weight: 600;
  line-height: 1.25;
  color: var(--otsikko);
}
.teksti-sivu h2:first-of-type { margin-top: 1.5rem; }
.teksti-sivu p,
.teksti-sivu li { color: var(--teksti-2); line-height: 1.65; }
.teksti-sivu p { margin-top: 0.85rem; max-width: 68ch; }
.teksti-sivu ul { margin-top: 0.85rem; padding-left: 1.25rem; max-width: 66ch; }
.teksti-sivu li + li { margin-top: 0.4rem; }
.teksti-sivu b { color: var(--otsikko); font-weight: 600; }
.teksti-sivu a { color: var(--otsikko); text-underline-offset: 0.2em; text-decoration-color: var(--korostus); }

/* The "who, for how long" summary: a table on a wide screen, stacked rows on
   a phone, so nothing scrolls sideways. */
.teksti-sivu table {
  width: 100%;
  margin-top: 1rem;
  border-collapse: collapse;
  font-size: 0.9375rem;
}
.teksti-sivu th,
.teksti-sivu td {
  padding: 0.6rem 0.75rem 0.6rem 0;
  border-top: 1px solid var(--viiva);
  text-align: left;
  vertical-align: top;
  color: var(--teksti-2);
}
.teksti-sivu th { color: var(--otsikko); font-weight: 600; }
.teksti-sivu thead th {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--teksti-3);
  border-top: 0;
}
@media (max-width: 40rem) {
  .teksti-sivu thead { display: none; }
  .teksti-sivu tr { display: block; padding: 0.6rem 0; border-top: 1px solid var(--viiva); }
  .teksti-sivu th, .teksti-sivu td { display: block; padding: 0.15rem 0; border-top: 0; }
}