/* =========================================================
   Metrica — base styles
   Reset + element defaults. Loaded after tokens.css.
   ========================================================= */

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: #ffffff;
  max-width: 100%;
}

body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.55;
  /* Inter benefits from a touch of positive tracking on body sizes.
     0.03em ≈ 0.5px at 16px base — proportional via em so it scales. */
  letter-spacing: 0.03em;
  color: var(--ink-900);
  background: #ffffff;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}

button {
  font: inherit;
  cursor: pointer;
}

/* Safe-area support for notched phones */
@supports (padding: max(0px)) {
  .topbar-inner,
  .hero-inner,
  .container,
  .footer > div {
    padding-left:  max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
  }
}

/* Anchor scroll offset under sticky topbar */
section { scroll-margin-top: 80px; }