/* ============================================================================
   BASE / RESET — element defaults
   Body uses the active theme tokens; headings inherit color and are MEDIUM.
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font--primary-family);
  font-size: var(--text-main--font-size);
  font-weight: var(--font--primary-regular);
  line-height: var(--line-height--1-5);
  color: var(--theme--text);
  background-color: var(--theme--background);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0 0 var(--space--3) 0;
  font-family: var(--heading--font-family);
  font-weight: var(--heading--font-weight);   /* medium, never bold */
  color: inherit;
}
h1 { font-size: var(--h1--font-size); line-height: var(--line-height--1);   letter-spacing: var(--heading--letter-spacing); }
h2 { font-size: var(--h2--font-size); line-height: var(--line-height--1);   letter-spacing: var(--heading--letter-spacing); }
h3 { font-size: var(--h3--font-size); line-height: var(--line-height--1-1); letter-spacing: var(--heading--letter-spacing); }
h4 { font-size: var(--h4--font-size); line-height: var(--line-height--1-3); }
h5 { font-size: var(--h5--font-size); line-height: var(--line-height--1-3); }
h6 { font-size: var(--h6--font-size); line-height: var(--line-height--1-3); }

p { margin: 0 0 var(--space--4) 0; }

a { color: var(--swatch--brand-1); text-decoration: underline; text-underline-offset: 0.15em; }
a:hover { color: var(--swatch--dark); }

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

:focus-visible { outline: var(--focus--width) solid var(--swatch--brand-1); outline-offset: var(--focus--offset-outer); }