/* NS Contabilidade — tokens. Valores oficiais do Manual de Identidade 2026 (docs/brand). */

@font-face {
  font-family: "Outfit";
  src: url("../fonts/outfit-latin-wght.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-latin-wght.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
/* Fallback com métricas próximas para reduzir CLS enquanto a fonte carrega. */
@font-face {
  font-family: "Outfit Fallback";
  src: local("Arial");
  size-adjust: 100%;
  ascent-override: 100%;
  descent-override: 26%;
}

:root {
  /* marca (nunca mudar) */
  --ns-blue: #0141a5;          /* Azul NS — solidez */
  --ns-green: #00bda7;         /* Verde NS — movimento (só fundo/ícone/traço; nunca texto sobre branco) */
  --ns-graphite: #262b33;      /* Grafite — nome e textos */

  /* escuros */
  --ns-night: #0a1e3d;         /* fundo escuro */
  --ns-layer: #0f2a52;         /* camada */
  --ns-surface: #163566;       /* superfície */

  /* claros */
  --ns-white: #ffffff;         /* fundo claro (padrão do site) */
  --ns-paper: #f4f6f8;         /* papel */
  --ns-line: #d9dee5;          /* linhas */

  /* texto */
  --ns-text: #262b33;
  --ns-text-2: #4e5866;
  --ns-text-on-dark: #eef2f7;
  --ns-text-on-dark-2: #a8b6cc;

  /* estados */
  --ns-blue-hover: #01368a;
  --ns-green-hover: #00a893;
  --ns-focus: #0141a5;
  --ns-error: #b42318;
  --ns-success: #067a6c;

  /* tipografia */
  --ns-font-display: "Outfit", "Outfit Fallback", system-ui, sans-serif;
  --ns-font-text: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ns-fs-display: clamp(2.6rem, 1.2rem + 5.4vw, 6rem);
  --ns-fs-h2: clamp(2rem, 1.3rem + 2.8vw, 3.5rem);
  --ns-fs-h3: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  --ns-fs-lead: clamp(1.0625rem, 1rem + 0.35vw, 1.3125rem);
  --ns-fs-base: clamp(1rem, 0.97rem + 0.12vw, 1.0625rem);
  --ns-fs-small: 0.875rem;
  --ns-fs-eyebrow: 0.75rem;

  /* layout */
  --ns-container: 80rem;
  --ns-gutter: clamp(1rem, 3vw, 2.5rem);
  --ns-section-space: clamp(4.5rem, 9vw, 8.5rem);
  --ns-header-h: 5.75rem;  /* pílula de 4rem + 0,875rem do topo + respiro */

  /* espaço */
  --ns-s-1: 0.25rem; --ns-s-2: 0.5rem; --ns-s-3: 0.75rem; --ns-s-4: 1rem; --ns-s-6: 1.5rem;
  --ns-s-8: 2rem; --ns-s-12: 3rem; --ns-s-16: 4rem; --ns-s-24: 6rem;

  /* raios */
  --ns-r-sm: 0.375rem; --ns-r-md: 0.75rem; --ns-r-lg: 1.25rem; --ns-r-pill: 999px;

  /* z */
  --ns-z-raised: 10; --ns-z-float: 90; --ns-z-header: 100; --ns-z-overlay: 200; --ns-z-focus: 400;

  /* motion */
  --ns-dur-micro: 200ms; --ns-dur-ui: 350ms;
  --ns-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ns-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* sombras (uso mínimo: só em superfícies que flutuam) */
  --ns-shadow-float: 0 18px 40px -18px rgba(10, 30, 61, 0.35);
}

@media (max-width: 767px) {
  :root { --ns-header-h: 5rem; }
}