/* vdc.studio — tokens. Fonte única. Base Lattice (spec §3.3). */
:root {
  /* canvas e tinta */
  --parchment: #f7f6f2;
  --paper: #ffffff;
  --ink: #001f1f;
  --ink-hover: #1e3938;
  --lichen: #5c7070;
  --slate: #455252;
  --mist: #889494;      /* só sobre --ink */

  /* marca e destaque */
  --cyan: #22b8b5;      /* ponto, foco, acento sobre --ink; nunca texto sobre parchment */
  --cyan-deep: #0b6f6c; /* link sobre parchment */
  --amber: #d7a84a;     /* destaque sobre --ink */
  --saffron: #8d5c11;   /* destaque sobre parchment */

  /* produtos */
  --product-pavicycle: #22b8b5;
  --product-estrata: #c5973a;
  --estrata-asphalt: #0e1824;

  --line: rgba(0, 31, 31, 0.12);
  --line-on-ink: rgba(247, 246, 242, 0.14);

  /* tipografia */
  --font-display: "Space Grotesk", system-ui, sans-serif;
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  --fs-display: clamp(2.5rem, 1.2rem + 5.2vw, 4.5rem);
  --fs-h2: clamp(1.75rem, 1.2rem + 2.2vw, 2.9375rem);
  --fs-h3: 1.1875rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.6875rem;

  /* forma */
  --r-sm: 7px;
  --r-input: 12px;
  --r-card: 14px;
  --r-badge: 22px;
  --r-pill: 29px;

  --shadow-lattice:
    0 12px 12px -6px rgba(0, 31, 31, 0.04),
    0 6px 6px -3px rgba(0, 31, 31, 0.04),
    0 3px 3px -1.5px rgba(0, 31, 31, 0.04),
    0 1px 1px -0.5px rgba(0, 31, 31, 0.08),
    0 0 0 1px rgba(0, 31, 31, 0.04);

  /* movimento */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --t-state: 150ms;
  --t-panel: 220ms;

  /* espaço */
  --page-max: 1320px;
  --gutter: clamp(1rem, 4vw, 3rem);
}