@font-face {
  font-family: "Garet";
  src: url("./assets/fonts/Garet-Heavy.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Touvlo";
  src: url("./assets/fonts/touvlo-regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --tm-laranja: #e4541b;
  --tm-laranja-tint: #fbe4da;
  --n-200: #d6dcdf;
  --n-500: #7c8a8c;
  --bg-page: #f4f6f9;
  --bg-surface: #fff;
  --bg-sunken: #e8ecef;
  --fg-default: #101920;
  --fg-muted: #5a686c;
  --fg-subtle: #7c8a8c;
  --border-subtle: #d6dcdf;
  --border-default: #bcc5c7;
  --success: #1fa463;
  --success-bg: #e4f4ec;
  --danger: #d92d20;
  --danger-bg: #fbe5e3;
  --font-display: "Garet", system-ui, sans-serif;
  --font-body: "Touvlo", system-ui, sans-serif;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --shadow-md: 0 6px 16px rgba(16, 25, 32, .1), 0 2px 4px rgba(16, 25, 32, .06);
  --shadow-brand: 0 12px 28px rgba(228, 84, 27, .3);
  --dur: 160ms;
}

html {
  color: var(--fg-default);
  background: var(--bg-page);
  font-family: var(--font-body);
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1 {
  margin: 0;
  color: var(--fg-default);
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.05;
}

p { margin: 0; }