@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-latin-wght.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-latin-wght.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-latin-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Marca */
  --brand-blue-500: #1f5af6;
  --brand-blue-600: #1747c9;
  --brand-blue-300: #7aa2ff;
  --brand-teal-500: #0fa3a3;
  --brand-teal-300: #4fd1c5;
  --brand-navy-950: #0a1324;
  --brand-navy-900: #111d35;
  --brand-navy-800: #1f2c47;
  --brand-slate-50: #f7f9fc;
  --brand-slate-100: #eef2f8;
  --brand-slate-200: #e2e8f0;
  --brand-slate-500: #55657e;
  --brand-slate-900: #0f172a;
  --brand-white: #ffffff;

  /* Semânticos (tema claro) */
  --color-primary: var(--brand-blue-500);
  --color-primary-hover: var(--brand-blue-600);
  --color-secondary: var(--brand-teal-500);
  --color-bg: var(--brand-slate-50);
  --color-bg-alt: var(--brand-white);
  --color-surface: var(--brand-white);
  --color-card: var(--brand-white);
  --color-card-hover: var(--brand-white);
  --color-fg: var(--brand-slate-900);
  --color-muted: var(--brand-slate-500);
  --color-border: var(--brand-slate-200);
  --color-border-strong: #cbd5e1;
  --color-accent-soft: #e8efff;
  --color-focus: var(--brand-blue-500);
  --color-success: #0f8a5f;
  --color-success-soft: #e6f6ef;
  --color-danger: #c62828;
  --color-danger-soft: #fdecec;

  /* CTAs */
  --cta-bg: var(--color-primary);
  --cta-bg-hover: var(--color-primary-hover);
  --cta-fg: var(--brand-white);
  --cta-secondary-bg: transparent;
  --cta-secondary-bg-hover: var(--brand-slate-100);
  --cta-secondary-fg: var(--color-fg);
  --cta-secondary-border: var(--color-border-strong);

  /* Header */
  --header-bg: rgb(247 249 252 / 0.88);
  --header-border: var(--color-border);
  --header-height: 4.5rem;

  /* Tipografia */
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Manrope", "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-lg: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.15rem + 0.4vw, 1.4rem);
  --text-h2: clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem);
  --text-h1: clamp(2.25rem, 1.6rem + 2.8vw, 3.5rem);

  /* Espaçamento e forma */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --section-padding: clamp(4.5rem, 3rem + 6vw, 8rem);
  --container-max: 75rem;
  --container-gutter: clamp(1.25rem, 0.75rem + 2vw, 2rem);
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 2px rgb(15 23 42 / 0.05);
  --shadow-md: 0 1px 2px rgb(15 23 42 / 0.04), 0 8px 24px -12px rgb(15 23 42 / 0.12);
  --transition: 180ms cubic-bezier(0.2, 0, 0, 1);
}

/* Seções escuras redefinem os mesmos tokens semânticos */
.theme-dark {
  --color-bg: var(--brand-navy-950);
  --color-bg-alt: var(--brand-navy-950);
  --color-surface: var(--brand-navy-900);
  --color-card: var(--brand-navy-900);
  --color-card-hover: #15233f;
  --color-fg: #e8eef8;
  --color-muted: #9aabc6;
  --color-border: var(--brand-navy-800);
  --color-border-strong: #2c3c5e;
  --color-accent-soft: rgb(31 90 246 / 0.16);
  --color-primary: var(--brand-blue-300);
  --color-secondary: var(--brand-teal-300);
  --color-focus: var(--brand-blue-300);
  --cta-bg: var(--brand-blue-500);
  --cta-bg-hover: #2a62fa;
  --cta-secondary-bg-hover: rgb(255 255 255 / 0.06);
  --cta-secondary-fg: var(--color-fg);
  --cta-secondary-border: #34466b;
}