@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color-scheme: light;
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: var(--fs-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
  overflow-x: clip;
}

h1, h2, h3, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
a, button { touch-action: manipulation; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

/* Escala tipográfica: tracking e leading dependem do tamanho */
.display {
  font-size: var(--fs-display);
  font-weight: 650;
  line-height: 1.03;
  letter-spacing: -.04em;
  text-wrap: balance;
}
.h2 {
  font-size: var(--fs-h2);
  font-weight: 650;
  line-height: 1.08;
  letter-spacing: -.03em;
  text-wrap: balance;
}
.h3 {
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.015em;
}
.label {
  font-size: var(--fs-label);
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--action-text);
}
.muted { color: var(--muted); }
.lead { font-size: 1.125rem; line-height: 1.5; color: var(--muted); text-wrap: pretty; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

:focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
  border-radius: 6px;
}

::selection { background: rgba(31, 184, 102, .22); }

@media (prefers-reduced-transparency: reduce) {
  :root { --glass: var(--bg); --glass-filter: none; }
}

@media (prefers-contrast: more) {
  :root { --border: rgba(0, 0, 0, .35); --muted: #48484C; }
}
