/* Perfil público do Portfólio. Tudo aqui deriva das cinco cores de
   tokens.css por color-mix(): nenhum matiz novo, nenhum hex (lint-brand.py).
   O valor resultante e o contraste medido ficam no comentário de cada linha.
   Estoque e Financeiro não carregam este arquivo. */

/* Fallback com a métrica da Poppins: a troca de fonte não desloca o layout.
   Poppins: ascent 1050, descent 350, line-gap 100 em 1000 upm; a Arial é
   ~12,5% mais estreita. */
@font-face {
  font-family: "Poppins Fallback";
  src: local("Arial"), local("Helvetica Neue"), local("Helvetica");
  size-adjust: 112.5%;
  ascent-override: 93.3%;
  descent-override: 31.1%;
  line-gap-override: 8.9%;
}

:root {
  /* Texto sobre claro */
  --ink: var(--brand-blue);                                                        /* 14,6:1 no branco */
  --ink-2: color-mix(in srgb, var(--brand-blue) 80%, var(--brand-white));          /* 3F5569 · 7,7:1 */
  --ink-3: color-mix(in srgb, var(--brand-blue) 72%, var(--brand-white));          /* 526678 · 5,9:1 */
  --orange-ink: color-mix(in srgb, var(--brand-orange) 56%, black);                /* 895D14 · 5,8:1 */

  /* Texto sobre azul */
  --on-dark: var(--brand-white);                                                   /* 14,6:1 */
  --on-dark-2: color-mix(in srgb, var(--brand-white) 78%, var(--brand-blue));      /* CAD0D6 · 9,4:1 */
  --on-dark-3: color-mix(in srgb, var(--brand-white) 60%, var(--brand-blue));      /* 9FAAB4 · 6,2:1 */

  /* Linhas e superfícies */
  --field-border: color-mix(in srgb, var(--brand-blue) 50%, var(--brand-white));   /* 8794A2 · 3,1:1 */
  --line: color-mix(in srgb, var(--brand-blue) 10%, transparent);
  --line-strong: color-mix(in srgb, var(--brand-blue) 18%, transparent);
  --line-on-dark: color-mix(in srgb, var(--brand-white) 14%, transparent);
  --surface-gray: color-mix(in srgb, var(--brand-gray-100) 58%, var(--brand-white)); /* F4F4F4 */
  --surface-beige: color-mix(in srgb, var(--brand-beige) 22%, var(--brand-white));   /* F7F1E9 */
  --tint-orange: color-mix(in srgb, var(--brand-orange) 18%, var(--brand-white));    /* FDEFD7 */
  --tint-blue: color-mix(in srgb, var(--brand-blue) 8%, var(--brand-white));         /* ECEEF0 */
  --blue-900: color-mix(in srgb, var(--brand-blue) 78%, black);
  --focus-halo: color-mix(in srgb, var(--brand-orange) 45%, transparent);

  /* Painel: erro e sucesso. Os dois únicos matizes fora das cinco cores, pedidos
     pelo dono para o painel (docs/ui-premium/CONTRACT.md, emenda do painel) e
     listados em scripts/quality/lint-brand.py. Só texto, ícone e borda de
     estado; nunca fundo de página nem decoração. */
  --danger: #A3261B;                                                               /* 7,4:1 no branco */
  --success: #17663F;                                                              /* 7,0:1 no branco */

  /* Escala tipográfica: uma só para todas as páginas públicas. */
  --fs-display: clamp(1.75rem, 0.8rem + 5vw, 5.25rem);
  --fs-h2: clamp(1.75rem, 1.2rem + 2.2vw, 3rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
  --fs-lead: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.75rem;

  /* Layout */
  --wrap: 1240px;
  --gutter: 20px;
  --band-y: clamp(64px, 8vw, 128px);
  --header-h: 64px;
  --radius-icon: 14px;
  --grid-module: 32px;

  /* Movimento */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-hover: 200ms;
  --dur-ui: 320ms;
  --dur-hero: 900ms;
}

@media (min-width: 600px) {
  :root { --gutter: 32px; }
}
@media (min-width: 1024px) {
  :root { --gutter: 48px; --header-h: 76px; }
}

/* Contraste reforçado: o texto secundário sobe um degrau e as linhas ganham corpo. */
@media (prefers-contrast: more) {
  :root {
    --ink-2: var(--brand-blue);
    --ink-3: color-mix(in srgb, var(--brand-blue) 86%, var(--brand-white));
    --on-dark-2: var(--brand-white);
    --on-dark-3: color-mix(in srgb, var(--brand-white) 82%, var(--brand-blue));
    --field-border: var(--brand-blue);
    --line: color-mix(in srgb, var(--brand-blue) 40%, transparent);
    --line-strong: color-mix(in srgb, var(--brand-blue) 60%, transparent);
    --line-on-dark: color-mix(in srgb, var(--brand-white) 50%, transparent);
  }
}