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

html { font-size: 16px; scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  transition: background-color var(--transition), color var(--transition);
}

img { max-width: 100%; display: block; }
a   { color: inherit; text-decoration: none; }
ul  { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; color: inherit; }

:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; border-radius: 8px; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* Utility helpers */
.text-blue  { color: var(--blue); }
.text-green { color: var(--green); }
.text-amber { color: var(--amber); }
.text-red   { color: var(--red); }
.text-muted { color: var(--gray-4); }
.hidden     { display: none !important; }
.row        { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.grow       { flex: 1; }

/* Scrollbar sutil */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #3a3a3a; }