*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; }
body {
  font-family: var(--font-sans);
  font-size: var(--type-body-size);
  line-height: var(--type-body-line-height);
  font-weight: var(--type-body-weight);
  letter-spacing: var(--type-body-letter-spacing);
  font-kerning: normal;
  color: var(--text-primary);
  background: var(--bg-page);
}
a { color: var(--brand-500); text-decoration: none; }
a:hover { color: var(--brand-300); }
a:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }
::selection { background: rgba(255, 158, 15, 0.35); color: var(--text-primary); }
img, video { max-width: 100%; display: block; }
.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: clamp(var(--space-2), 4vw, var(--space-4));
}
.section { padding-block: clamp(var(--space-5), 8vw, var(--space-6)); }
.h1 {
  font-size: clamp(var(--type-h3-size), 5vw, var(--type-h1-size));
  line-height: var(--type-h1-line-height);
  font-weight: var(--type-h1-weight);
  letter-spacing: var(--type-h1-letter-spacing);
  text-wrap: balance;
}
.h2 {
  font-size: clamp(var(--type-h3-size), 4vw, var(--type-h2-size));
  line-height: var(--type-h2-line-height);
  font-weight: var(--type-h2-weight);
  letter-spacing: var(--type-h2-letter-spacing);
  text-wrap: balance;
}
.h3 {
  font-size: var(--type-h3-size);
  line-height: var(--type-h3-line-height);
  font-weight: var(--type-h3-weight);
  letter-spacing: var(--type-h3-letter-spacing);
  text-wrap: balance;
}
.text-secondary { color: var(--text-secondary); }
.text-center { text-align: center; }
.grid-3 {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
}
.page-hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(80px, 12vw, 140px);
}
.page-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  opacity: 0.85;
}
.page-hero__content { position: relative; z-index: 1; }
