/* MMAGA — base visual (tirada da Apresentação da Marca) */
:root {
  /* Cores principais */
  --azul-royal: #10294A;
  --azul:       #2C3E70;
  --azul-cel:   #B8D7FA;
  --branco-gelo:#EDF2ED;

  /* Grafite */
  --g-900: #0f1010; --g-800: #2f3030; --g-700: #4d4e4e; --g-600: #606061; --g-500: #878888;
  --g-400: #a8a9a9; --g-300: #cdcece; --g-200: #e0e1e1; --g-100: #ededed; --g-50: #f6f7f7;

  /* Tipografia */
  --font-display: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-text:    "Sora", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Espaçamento lateral */
  --gutter: clamp(20px, 4.2vw, 64px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--branco-gelo);
  color: var(--g-900);
  font-family: var(--font-text);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-family: var(--font-display); margin: 0; text-wrap: balance; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--azul-cel); outline-offset: 3px; border-radius: 4px; }