/* variables.css — os únicos valores "mágicos" do projeto */
:root {
  /* Cor */
  --color-ink:      #10151F;
  --color-paper:     #F1F3F8;
  --color-paper-alt: #E4E8F2;
  --color-line:      #D2D8E6;
  --color-muted:      #565F73;
  --color-primary:    #1638A4;
  --color-primary-dark: #102B7D;
  --color-accent:     #F2A93B;
  --color-accent-dark:  #D68A16;
  --color-white:       #FFFFFF;

  /* Tipografia */
  --font-display: 'Space Grotesk', sans-serif;
  --font-body:    'IBM Plex Sans', sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;

  /* Largura de contêiner */
  --container-wide:   1140px;
  --container-read:    900px;
  --container-form:    560px;

  /* Ritmo vertical */
  --section-padding:      96px;
  --section-padding-md:    64px;
  --section-padding-sm:    48px;

  /* Raio e sombra */
  --radius-sm:  6px;
  --radius-md: 14px;
  --radius-lg: 28px;
  --shadow-card: 0 1px 2px rgba(16, 22, 21, 0.06), 0 12px 28px rgba(16, 22, 21, 0.08);
  --shadow-card-hover: 0 4px 10px rgba(16, 22, 21, 0.08), 0 20px 40px rgba(16, 22, 21, 0.12);

  /* Transição padrão */
  --ease: cubic-bezier(.4, 0, .2, 1);
  --transition-fast: 0.2s var(--ease);
  --transition-base: 0.3s var(--ease);
}