/* Tokens do site. Para personalizar a identidade, troque só o bloco "MARCA DO CLIENTE".
   Ao trocar a marca, mantenha: --on-brand sobre --brand com contraste >= 4,5
   e --brand sobre --bg com contraste >= 4,5 (texto de destaque e links). */

@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/instrument-sans-var-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-var-latin.woff2") format("woff2");
  font-weight: 400 600;
  font-display: swap;
}

:root {
  /* ===== MARCA DO CLIENTE: troque só este bloco ===== */
  --brand:        #0B6B4D; /* verde-sinal: botões, palavra de destaque, ícones de check */
  --brand-strong: #09573F; /* hover/active do botão */
  --brand-tint:   #DCEBE3; /* fundo de etiqueta da marca */
  --brand-on-dark:#5BD49C; /* acento sobre a faixa escura */
  --on-brand:     #FBFBF9; /* texto sobre --brand */
  --signal:       #F2B300; /* âmbar de demarcação: só preenchimento/linhas, NUNCA texto sobre claro */
  --on-signal:    #14181A;
  /* ===== fim do bloco de marca ===== */

  --bg:          #F3F4F1;
  --surface:     #FBFBF9;
  --surface-2:   #E7EAE5;
  --ink:         #14181A;
  --ink-soft:    #4A5355;
  --ink-mute:    #5E686A;
  --line:        #D3D8D3;
  --line-strong: #848D88;
  --night:       #101416;
  --night-2:     #192024;
  --on-night:    #E8ECE9;
  --on-night-soft:#A3ADAA;
  --danger:      #B42318;
  --focus:       var(--brand);
  --photo-tint:  var(--brand);

  /* Tipografia */
  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", monospace;
  --fs-display: clamp(2.375rem, 1.6rem + 3.6vw, 4.5rem);
  --fs-h2:      clamp(1.875rem, 1.35rem + 2.2vw, 3.25rem);
  --fs-h3:      clamp(1.25rem, 1.05rem + 0.9vw, 1.75rem);
  --fs-lead:    clamp(1.0625rem, 0.98rem + 0.45vw, 1.3125rem);
  --fs-body:    clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --fs-small:   0.875rem;
  --fs-tag:     0.75rem;
  --fs-button:  0.9375rem;

  /* Espaço e grade */
  --space-3: .75rem; --space-4: 1rem; --space-5: 1.5rem;
  --space-6: 2rem; --space-7: 3rem; --space-8: 4rem;
  --section-y: clamp(4rem, 2.5rem + 5vw, 7.5rem);
  --container: 1320px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --grid-gap: clamp(1rem, 2vw, 1.5rem);
  --header-h: 64px;

  /* Forma: botões = pílula; painel/foto/campo = 6px; etiqueta = 4px. */
  --radius-pill: 999px; --radius-panel: 6px; --radius-tag: 4px;

  --shadow-1: 0 1px 2px rgb(20 24 26 / .06), 0 12px 32px -16px rgb(20 24 26 / .22);
  --shadow-press: inset 0 1px 0 rgb(255 255 255 / .12);

  /* Movimento */
  --dur-1: 160ms;
  --dur-2: 240ms;
  --dur-3: 420ms;
  --dur-4: 480ms;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --reveal-y: 12px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: .01ms; --dur-2: .01ms; --dur-3: .01ms; --dur-4: .01ms; --reveal-y: 0px; }
}