/* ---------- Page intro ---------- */
.page-intro {
  padding-block: var(--space-2xl);
  text-align: center;
}

.page-intro p {
  margin: var(--space-sm) auto 0;
  font-size: var(--fs-sm);
  opacity: 0.8;
}

/* ---------- Long-form text ---------- */
.prose h2 {
  margin: var(--space-xl) 0 var(--space-sm);
  font-size: var(--fs-lg);
}

.prose h2:first-child {
  margin-top: 0;
}

.prose p + p {
  margin-top: var(--space-sm);
}

.prose a {
  color: var(--color-orange-dark);
  font-weight: var(--fw-semibold);
}

.prose a:hover {
  color: var(--color-charcoal);
}

.prose code {
  padding: 0 var(--space-2xs);
  background-color: var(--color-grey-100);
  border-radius: var(--radius-sm);
  font-size: 0.9em;
}

/* ---------- Cookie table ---------- */
.table-wrap {
  margin-block: var(--space-md);
  overflow-x: auto;
}

.prose table {
  width: 100%;
  min-width: 32rem;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}

.prose th,
.prose td {
  padding: var(--space-sm);
  border-bottom: 1px solid var(--color-grey-200);
  text-align: left;
  vertical-align: top;
}

.prose th {
  background-color: var(--color-charcoal);
  color: var(--color-white);
}

.prose td:first-child {
  font-weight: var(--fw-semibold);
  white-space: nowrap;
}

/* ---------- Cookie settings form ---------- */
.cookie-settings {
  display: grid;
  gap: var(--space-md);
  margin-top: var(--space-md);
  padding: var(--space-lg);
  background-color: var(--color-grey-100);
  border-top: 4px solid var(--color-orange);
}

.cookie-settings__option {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
}

.cookie-settings__option input {
  flex: none;
  width: 1.25rem;
  height: 1.25rem;
  margin-top: 0.15rem;
  accent-color: var(--color-orange);
}

.cookie-settings__option label {
  display: grid;
  cursor: pointer;
}

.cookie-settings__option input:disabled + label {
  cursor: default;
}

.cookie-settings__option label span {
  font-size: var(--fs-sm);
  color: var(--color-grey-500);
}

.cookie-settings .button {
  justify-self: start;
}

.cookie-settings__status {
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
}

.cookie-settings__status:empty {
  display: none;
}