/* ============================================================
   tokens.css — Design tokens (04_DIRECAO_DE_ARTE_E_DESIGN_SYSTEM)
   ============================================================ */
:root {
  /* Paleta */
  --green-950: #0b2f28;
  --green-900: #173e35;
  --green-800: #145144;
  --green-700: #0e7259;
  --mint-500: #2bfc97;
  --aqua-400: #67c8c8;
  --gold-500: #d1b45b;
  --ivory-100: #f5f5f1;
  --white: #ffffff;
  --ink-950: #13221f;
  --muted-600: #65736f;
  --border: rgba(19, 62, 53, 0.14);
  --overlay: rgba(11, 47, 40, 0.78);

  /* Derivados de superfície */
  --surface-light: var(--ivory-100);
  --surface-dark: var(--green-950);
  --surface-footer: #071f1a;
  --border-on-dark: rgba(245, 245, 241, 0.16);
  --mint-soft: rgba(43, 252, 151, 0.12);

  /* Tipografia */
  --font-display: "Manrope", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;

  --fs-display: clamp(2.55rem, 5.4vw, 4.85rem);
  --fs-h1: clamp(2.2rem, 4vw, 3.9rem);
  --fs-h2: clamp(1.8rem, 3vw, 2.75rem);
  --fs-h3: clamp(1.25rem, 2vw, 1.65rem);
  --fs-body: clamp(1rem, 1.1vw, 1.125rem);
  --fs-small: 0.875rem;

  /* Geometria */
  --radius-btn: 10px;
  --radius-card: 16px;
  --radius-chip: 8px;

  /* Espaçamento vertical de seção */
  --section-y: clamp(3rem, 7vw, 6rem);

  /* Layout */
  --container: 1180px;
  --gutter: clamp(1rem, 4vw, 2rem);

  /* Movimento */
  --ease: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 260ms;
  --dur-reveal: 560ms;
}