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

/* Global font scale (you can tweak these) */
:root {
  --font-size-body: 16px;      /* standard text */
  --font-size-sm: 14px;        /* notes / labels */
  --font-size-h1: 38px;        /* big hero titles */
  --font-size-h2: 24px;        /* section titles */

  --line-height-body: 1.5;
  --line-height-tight: 1.2;
}

html,
body {
  margin: 0;
  padding: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
  background-color: #050712;
  color: #f8f8ff;

  /* global text calibration */
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* default heading sizes (if you use raw h1/h2) */
h1 {
  font-size: var(--font-size-h1);
  line-height: var(--line-height-tight);
}

h2 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-tight);
}

button,
input,
textarea {
  font-family: inherit;
}

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