/* ------------------------------------------------------------------
   ANDRÉA MAIA · design tokens
   Conceito "camada por camada": base clara de papel, areia para dar ritmo,
   cobre como acento e carvão só no rodapé. Display condensada (Archivo)
   contra uma serifa de leitura (Newsreader) — o inverso dos outros sites.
   ------------------------------------------------------------------ */
:root {
  /* — cor — */
  --coal: #141110;
  --coal-2: #1C1816;
  --coal-3: #29221E;
  --paper: #EDE6DC;
  --paper-2: #E2D9CC;
  --bone: #F4EFE7;
  --smoke: #9A8F84;
  --copper: #C98B5A;
  --copper-2: #A66B3F;
  --clay: #7A4A30;

  --sand: #E4D9C9;
  --bg: var(--paper);
  --fg: var(--coal);
  --fg-soft: #3B322C;
  --muted: #6E6258;
  --hair: rgba(20, 17, 16, .16);
  --accent: var(--copper);

  /* — tipografia — */
  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Newsreader", "Iowan Old Style", Georgia, serif;

  --fs-hero: clamp(4.2rem, 17vw, 21rem);
  --fs-display-l: clamp(3rem, 8.5vw, 9.5rem);
  --fs-display-m: clamp(2rem, 4.6vw, 4.8rem);
  --fs-display-s: clamp(1.4rem, 2.2vw, 2.2rem);
  --fs-lede: clamp(1.15rem, 1.5vw, 1.45rem);
  --fs-body: clamp(1.02rem, 1.12vw, 1.15rem);
  --fs-small: .875rem;
  --fs-micro: .7rem;

  --lh-body: 1.55;
  --tracking-micro: .18em;

  /* — grid — */
  --gutter: clamp(1rem, 2.4vw, 2.5rem);
  --margin: clamp(1.25rem, 5vw, 6rem);
  --measure: 32rem;
  --section-gap: clamp(6rem, 13vw, 13rem);

  /* — motion system — */
  --m-fast: .4s;
  --m-med: .85s;
  --m-slow: 1.5s;
  --ease-standard: cubic-bezier(.22, 1, .36, 1);
  --ease-editorial: cubic-bezier(.77, 0, .18, 1);
  --ease-reveal: cubic-bezier(.16, 1, .3, 1);

  --z-nav: 50;
  --z-grain: 60;
}

/* base clara; o escuro fica só no rodapé, o cobre no CTA */
[data-theme="light"] { --bg: var(--paper); }
[data-theme="sand"] { --bg: var(--sand); }
[data-theme="dark"] {
  --bg: var(--coal);
  --fg: var(--bone);
  --fg-soft: #D9D0C5;
  --muted: var(--smoke);
  --hair: rgba(244, 239, 231, .14);
}
[data-theme="accent"] {
  --bg: var(--copper);
  --fg: var(--coal);
  --fg-soft: #2A1E16;
  --muted: #5E3F28;
  --hair: rgba(20, 17, 16, .22);
}