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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  
  scroll-padding-block-start: calc(var(--header-height) + 12px);
}
@media (max-width: 767px) {
  html { scroll-padding-block-start: 117px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  margin: 0;
  background: var(--bg-base);
  color: var(--text-secondary);
  font-family: var(--font-sans);
  font-size: var(--size-body);
  font-weight: 400;
  line-height: var(--lh-body);
  letter-spacing: 0;
  text-align: start;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin: 0; }

.wrap {
  max-width: var(--page-max);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

[hidden] {
  display: none !important;
}

.section { position: relative; }

.skip {
  position: absolute;
  inset-inline-start: -9999px;
  top: 0;
  z-index: 200;
  background: var(--text-primary);
  color: var(--bg-base);
  padding: 14px 22px;
  font-weight: 500;
  font-size: 16px;
  text-decoration: none;
}
.skip:focus {
  inset-inline-start: 0;
}

a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: 2px;
}

.js-ready [data-reveal] {
  opacity: 0;
  transform: translateY(var(--motion-distance));
  transition: opacity var(--motion-duration) var(--motion-easing),
              transform var(--motion-duration) var(--motion-easing);
}
.js-ready [data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .js-ready [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}