/* ============================================================
   GIO · GUIA DO CANDIDATO · DESIGN SYSTEM WEB · D1
   Tokens — fundação visual herdada do ebook
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* ===== Cores primárias ===== */
  --green:        #214544;   /* mata profunda — cor-âncora */
  --green-deep:   #15302f;   /* hover / fundo escuro */
  --green-soft:   #2e5251;   /* alternância */

  /* ===== Terras quentes ===== */
  --terra:        #B05824;   /* terra queimada — destaques */
  --terra-soft:   #d8a07a;   /* fundo quente */
  --argila:       #c47b4d;
  --caramel:      #d8a07a;

  /* ===== Neutros ===== */
  --paper:        #F4F1EA;   /* respiro / fundo claro */
  --bg:           #DBE1E0;   /* alternância de fundo */
  --ink:          #0E1716;   /* grafite — corpo */
  --muted:        #4a5a59;   /* secundário */
  --line:         rgba(33,69,68,.18);
  --line-strong:  rgba(33,69,68,.32);

  /* ===== Acentos (parcimônia) ===== */
  --gold:         #E7CA1B;   /* amarelo solar */
  --steel:        #7C9EB7;   /* azul desbotado */
  --olive:        #B6A331;
  --lilac:        #BC84CB;

  /* ===== Estados ===== */
  --success:      #4d7a4f;
  --warning:      #c69a2a;
  --error:        #B05824;
  --focus-ring:   #E7CA1B;

  /* ===== Tipografia ===== */
  --serif:        'Instrument Serif', 'Times New Roman', serif;
  --serif-display:'Instrument Serif', 'Times New Roman', serif;
  --serif-body:   'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;
  --sans:   'DM Sans', system-ui, -apple-system, sans-serif;
  --mono:   'JetBrains Mono', 'SF Mono', Menlo, monospace;

  /* Escala (rem-based, fluida) */
  --fs-display:   clamp(48px, 7vw, 96px);
  --fs-h1:        clamp(36px, 4.6vw, 64px);
  --fs-h2:        clamp(28px, 3.2vw, 44px);
  --fs-h3:        clamp(20px, 2.1vw, 28px);
  --fs-h4:        18px;
  --fs-lede:      clamp(18px, 1.5vw, 22px);
  --fs-body:      16px;
  --fs-small:     14px;
  --fs-micro:     12px;
  --fs-eyebrow:   12px;

  --lh-display:   0.98;
  --lh-heading:   1.1;
  --lh-body:      1.6;

  --tracking-tight:   -0.025em;
  --tracking-normal:   0;
  --tracking-wide:     0.18em;

  /* ===== Espaçamento — 8pt grid ===== */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  64px;
  --s-9:  96px;
  --s-10: 128px;
  --s-11: 160px;

  /* ===== Layout ===== */
  --container:    1280px;
  --container-narrow: 840px;
  --gutter:       clamp(24px, 4vw, 64px);

  /* ===== Bordas / sombras ===== */
  --radius-xs:    2px;
  --radius-sm:    4px;
  --radius-md:    8px;
  --shadow-soft:  0 2px 12px -4px rgba(14,23,22,.08);
  --shadow-card:  0 12px 32px -16px rgba(14,23,22,.18);

  /* ===== Motion ===== */
  --ease-out:     cubic-bezier(.2,.6,.2,1);
  --ease-in-out:  cubic-bezier(.65,.05,.36,1);
  --dur-fast:     160ms;
  --dur-base:     240ms;
  --dur-slow:     420ms;
}

/* ===== Reset enxuto ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; }

::selection { background: var(--gold); color: var(--green); }

/* Foco visível */
:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: var(--radius-xs);
}
