/* ══════════════════════════════════════════════════════════════
   CRYSTAL — BASE
   Reset, corpo, tipografia e utilitários globais.
   ══════════════════════════════════════════════════════════════ */

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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  background: var(--c-bg);
  color: var(--c-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
  overflow-x: hidden;
  line-height: 1.5;
}

a       { color: inherit; text-decoration: none; }
img     { display: block; max-width: 100%; }
strong  { font-weight: 500; }

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
  padding: 0;
}


/* ─── Seleção de texto ──────────────────────────────────────── */
::selection {
  background: #D4C4A8;
  color: var(--c-ink);
}


/* ─── Famílias tipográficas ──────────────────────────────────
   Classes usadas inline para alternar fonte dentro de frases,
   preservando a hierarquia sem criar elementos extras.
─────────────────────────────────────────────────────────── */

/* Serif redonda — para trechos de ênfase estruturada */
.serif {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.005em;
}

/* Serif itálico — emoção, ênfase, acento de impacto */
.serif-i {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.005em;
}

/* Mono — rótulos, métricas, referências editoriais */
.mono {
  font-family: var(--font-mono);
  font-feature-settings: "tnum";
}


/* ─── Utilitários de texto ───────────────────────────────────── */
.text-balance { text-wrap: balance; }

/* Atenuação de cor — "mas contratam outro." no H1 */
.muted        { color: var(--c-ink-3); }
.muted-accent { color: var(--c-accent); }

/* Texto em fundos escuros */
.text-light   { color: var(--c-surface-2); }
.text-dim     { color: #E8DFCC; }


/* ─── Acessibilidade ─────────────────────────────────────────── */
/* Respeita a preferência do sistema por menos movimento */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;   /* sequências escalonadas aparecem juntas */
    scroll-behavior: auto !important;
  }
}