/* ============================================================================
   Base — global element defaults built on the design tokens.
   (Component styling lives in components.css; tokens in design-tokens.css.)
   ========================================================================== */

html {
  font-size: 16px; /* body floor — min 16px everywhere */
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  margin: 0;
  font-family: var(--mt-font-body);
  font-size: var(--mt-text-base);
  line-height: var(--mt-leading-body);
  color: var(--mt-color-ink);
  background-color: var(--mt-color-surface);
  -webkit-font-smoothing: antialiased;
}

/* Sticky footer: content fills the space between header and footer */
.page-content {
  flex: 1 0 auto;
  width: 100%;
}

/* Headings — geometric display face, tight leading */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--mt-font-heading);
  font-weight: var(--mt-weight-bold);
  line-height: var(--mt-leading-heading);
  color: var(--mt-color-ink);
  margin-top: 0;
  margin-bottom: var(--mt-space-4);
}
h1 { font-size: var(--mt-text-h1); letter-spacing: var(--mt-tracking-heading); }
h2 { font-size: var(--mt-text-h2); letter-spacing: var(--mt-tracking-heading); }
h3 { font-size: var(--mt-text-h3); }
h4 { font-size: var(--mt-text-h4); }
h5 { font-size: var(--mt-text-h5); }
h6 { font-size: var(--mt-text-lg); }

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

small, .text-caption {
  font-size: var(--mt-text-caption);
}
.text-uppercase, .text-caption--upper {
  text-transform: uppercase;
  letter-spacing: var(--mt-tracking-caption);
}

hr {
  border: 0;
  border-top: 1px solid var(--mt-color-border);
  margin-block: var(--mt-space-8);
}

/* Warm, visible focus ring everywhere (replaces the old blue #258cfb ring) */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus,
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: var(--mt-focus-outline);
  outline-offset: var(--mt-focus-offset);
  box-shadow: var(--mt-focus-ring);
}