/* ==========================================================================
   OBRA — Design Tokens
   Direção: Brutalista contemporâneo
   Alterar estes valores muda a identidade visual do site inteiro.
   ========================================================================== */

:root {

  /* ---- Cor ------------------------------------------------------------- */
  --color-paper:        #F6F4EF;  /* fundo principal */
  --color-paper-dim:     #EEEAE1; /* fundo secundário, hairlines sobre paper */
  --color-ink:           #141414; /* texto, estrutura, grid */
  --color-ink-soft:       #3A3936; /* texto secundário sobre paper */
  --color-oak:           #C9A876; /* massa gráfica — imagens, blocos grandes */
  --color-oak-dark:       #A98956; /* hover / estados sobre oak */
  --color-green:         #5A7D3D; /* accent primário — ação: CTAs, links ativos */
  --color-green-dark:     #46612F; /* hover sobre green */
  --color-cement:        #A6A199; /* accent secundário — massa construída, sem função interativa */
  --color-cement-dark:    #8B867C; /* hover / bordas sobre cement */
  --color-paper-on-ink:  #F6F4EF; /* texto sobre fundos escuros */

  /* ---- Tipografia -------------------------------------------------------- */
  /* PP Neue Montreal (Display + Text) é a família principal do site.
     É uma fonte licenciada — ver /fonts/README.txt e styles/fonts.css.
     Archivo/Inter só aparecem como fallback caso os ficheiros da PP Neue
     Montreal ainda não tenham sido adicionados. */
  /* TESTE: 'Neue Montreal (teste)' está à frente para aprovação visual local.
     Quando comprares a licença da PP Neue Montreal e substituíres os
     ficheiros em /fonts (ver styles/fonts.css), basta apagar
     "'Neue Montreal (teste)', " daqui — o resto já está pronto. */
  --font-display: 'Neue Montreal (teste)', 'PP Neue Montreal Display', 'Archivo', 'Helvetica Neue', Arial, sans-serif;   /* títulos, hero */
  --font-body:    'Neue Montreal (teste)', 'PP Neue Montreal Text', 'Inter', 'Helvetica Neue', Arial, sans-serif;         /* corpo de texto */
  --font-mono:    'Neue Montreal (teste)', 'PP Neue Montreal Text', 'Inter', 'Helvetica Neue', Arial, sans-serif;         /* labels/metadados — deixou de ser monospace */

  --size-hero:      clamp(2.75rem, 8vw, 7.5rem);
  --size-h1:        clamp(2rem, 4.5vw, 3.5rem);
  --size-h2:        clamp(1.375rem, 2.75vw, 2rem);
  --size-manifesto: clamp(1.75rem, 3.5vw, 2.75rem);
  --size-lede:      clamp(1rem, 1.4vw, 1.125rem);
  --size-h3:        1.25rem;
  --size-card-title: 1.25rem;
  --size-body:      1rem;
  --size-small:     0.8125rem;
  --size-meta:      0.75rem;

  --leading-tight:  0.94;
  --leading-snug:   1.2;
  --leading-body:   1.65;

  --tracking-tight: -0.02em;
  --tracking-wide:  0.04em;

  --line-max: 34ch;   /* limite de largura de linha para texto de leitura */

  --weight-light:   300;   /* hero, títulos grandes, frases editoriais */
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-bold:    700;

  /* ---- Espaçamento --------------------------------------------------------- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;
  --space-4xl: 12rem;

  /* ---- Grid --------------------------------------------------------------- */
  --grid-columns: 6;
  --grid-gap: 1px;                 /* linhas de grid expostas, 1px = hairline */
  --grid-margin: 1.5rem;

  /* ---- Bordas / raio ------------------------------------------------------- */
  --border-hairline: 1px solid var(--color-ink);
  --border-hairline-soft: 1px solid var(--color-cement);
  --radius: 0;                     /* brutalismo: sem arredondamentos */

  /* ---- Motion --------------------------------------------------------------- */
  --transition-instant: 0ms;
  --transition-fast: 120ms;
  --transition-base: 200ms;
  --ease-hard: cubic-bezier(0.4, 0, 0.2, 1);

  /* Duração de uma volta completa do marquee de projetos na homepage.
     Mais alto = mais lento. Este é o único valor a mudar para ajustar a velocidade. */
  --marquee-duration: 200s;

  /* ---- Breakpoints (referência — usados em media queries) ------------------- */
  /* mobile: até 767px | tablet: 768–1199px | desktop: 1200px+ */
}