/* Tokens de design — partilhados pelo site público e pelo painel.
   Escalas fechadas: nada de valores inventados por ecrã. */

@font-face { font-family: "Inter"; font-weight: 400; font-display: swap; src: url("../fonts/inter-400.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-display: swap; src: url("../fonts/inter-500.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-display: swap; src: url("../fonts/inter-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 600; font-display: swap; src: url("../fonts/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 700; font-display: swap; src: url("../fonts/barlow-700.woff2") format("woff2"); }

:root {
  /* Cinzentos quentes (puxados ao castanho do estuque, não ao azul clínico) */
  --ink-950: #141210;
  --ink-900: #1c1a17;
  --ink-800: #2a2723;
  --ink-700: #403b35;
  --ink-600: #5a544b;
  --ink-500: #6b645a;
  --ink-400: #9a9288;
  --ink-300: #c4bdb2;
  --ink-200: #e4ded3;
  --ink-100: #f2eee7;
  --ink-50:  #faf8f4;
  --white:   #ffffff;

  /* Âmbar da marca (do logótipo) */
  --amber-50:  #fff7e0;
  --amber-100: #ffebb3;
  --amber-300: #ffc947;
  --amber-500: #ffb000;
  --amber-600: #e09a00;
  --amber-700: #8a5700; /* único âmbar que passa como texto sobre papel claro */

  /* Estados (sempre acompanhados de texto/ícone, nunca só cor) */
  --ok-600: #2b7a4b;   --ok-100: #e2f2e8;
  --erro-600: #b3261e; --erro-100: #fbe7e4;
  --info-600: #245b94; --info-100: #e3edf8;

  /* Papéis semânticos */
  --texto: var(--ink-900);
  --texto-2: var(--ink-600);
  --texto-3: var(--ink-500);
  --fundo: var(--ink-50);
  --fundo-2: var(--ink-100);
  --superficie: var(--white);
  --linha: var(--ink-200);
  --marca: var(--amber-500);
  --marca-escura: var(--amber-600);
  --marca-texto: var(--amber-700);
  --foco: #1a56c4;

  /* Espaço */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;

  /* Tipo */
  --fonte-corpo: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fonte-titulo: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
  --t-12: 0.75rem; --t-14: 0.875rem; --t-16: 1rem; --t-18: 1.125rem; --t-20: 1.25rem;
  --t-24: 1.5rem; --t-30: 1.875rem; --t-36: 2.25rem; --t-48: 3rem; --t-64: 4rem;

  /* Raios: 6 controlos · 12 cartões · pílula para etiquetas */
  --r-1: 6px; --r-2: 12px; --r-pilula: 999px;

  /* Sombras: cada uma tem uma parte larga (luz direta) e uma curta (ambiente) */
  --sombra-1: 0 1px 2px rgba(28,26,23,.06), 0 1px 1px rgba(28,26,23,.04);
  --sombra-2: 0 4px 12px rgba(28,26,23,.08), 0 1px 3px rgba(28,26,23,.06);
  --sombra-3: 0 12px 28px rgba(28,26,23,.12), 0 3px 8px rgba(28,26,23,.06);
  --sombra-4: 0 24px 48px rgba(28,26,23,.16), 0 6px 14px rgba(28,26,23,.08);
  --sombra-5: 0 40px 80px rgba(28,26,23,.24), 0 12px 24px rgba(28,26,23,.1);

  /* Movimento */
  --mov-rapido: 120ms; --mov-medio: 220ms; --mov-lento: 400ms;
  --curva: cubic-bezier(0.2, 0, 0, 1);
  --curva-entrar: cubic-bezier(0.05, 0.7, 0.1, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --mov-rapido: 0ms; --mov-medio: 0ms; --mov-lento: 0ms; }
  html { scroll-behavior: auto !important; }
}