*, *::before, *::after { box-sizing: border-box; }

html {
  color: var(--cacs-color-ink);
  background: var(--cacs-color-paper);
  font-family: var(--cacs-font-body);
  font-size: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--cacs-color-ink);
  background: var(--cacs-color-paper);
  font-family: var(--cacs-font-body);
  font-size: var(--cacs-font-size-base);
  line-height: var(--cacs-line-body);
  overflow-wrap: anywhere;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--cacs-color-brand-strong);
  font-family: var(--cacs-font-display);
  line-height: var(--cacs-line-heading);
  text-wrap: balance;
}

h1 { font-size: var(--cacs-font-size-xl); }
h2 { font-size: var(--cacs-font-size-lg); }
h3 { font-size: var(--cacs-font-size-md); }

p, li, dd { max-width: var(--cacs-measure); }

a {
  color: var(--cacs-color-brand);
  text-decoration-thickness: 0.09em;
  text-underline-offset: 0.18em;
}

a:hover { color: var(--cacs-color-action-hover); }

img, svg, video { max-width: 100%; height: auto; }

button, input, select, textarea { font: inherit; }

table { width: 100%; border-collapse: collapse; }
th, td { padding: var(--cacs-space-3); border: 1px solid var(--cacs-color-border); text-align: start; }
th { background: var(--cacs-color-surface); }