:root {
  /* Colors */
  --color-bg: #424143;
  --color-surface: #161820;
  --color-surface-2: #1d2030;
  --color-text: #f5f6f8;
  --color-text-muted: rgba(245, 246, 248, 0.76);
  --color-text-dim: rgba(245, 246, 248, 0.56);

  --color-brand: #ffb400; /* amarelo Datawake */
  --color-brand-2: #ffd36a;
  --color-ink: #424143;

  --color-light-bg: #fff3c2;
  --color-light-surface: #ffffff;
  --color-light-text: #424143;
  --color-light-muted: rgba(66, 65, 67, 0.72);

  /* Typography */
  --font-sans: Inter, sans-serif;

  --fs-11: 0.6875rem;
  --fs-12: 0.75rem;
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-19: 1.1875rem;
  --fs-20: 1.25rem;
  --fs-24: 1.5rem;
  --fs-25: 1.5625rem;
  --fs-26: 1.625rem;
  --fs-32: 2rem;
  --fs-34: clamp(1.5rem, 4.6vw, 34px);
  --fs-39: clamp(1.625rem, 5.2vw, 39px);
  --fs-40: 2.5rem;
  --fs-54: clamp(2rem, 7vw, 54px);
  --fs-56: 3.5rem;
  --fs-66: clamp(2.25rem, 8.6vw, 66px);

  --lh-tight: 1.08;
  --lh-snug: 1.2;
  --lh-body: 1.5;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* Spacing (8px base) */
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Radius */
  --radius-8: 0.5rem;
  --radius-12: 0.75rem;
  --radius-16: 1rem;
  --radius-24: 1.5rem;

  /* Shadows */
  --shadow-1: 0 10px 30px rgba(0, 0, 0, 0.35);
  --shadow-2: 0 18px 50px rgba(0, 0, 0, 0.45);

  /* Layout */
  --container: 1120px;
  --header-h: 76px;
  /* 30% menor que o valor base anterior */
  --page-pad: calc(24px * 0.7);
  --section-pad-y: 90px;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.9, 0.2, 1);
  --dur-1: 120ms;
  --dur-2: 220ms;
  --dur-3: 360ms;
  /* Vídeo → imagem (pôster): transição leve */
  --video-poster-fade: 520ms;
  --video-poster-ease: cubic-bezier(0.33, 1, 0.68, 1);
}

@media (min-width: 860px) {
  :root {
    --page-pad: calc(300px * 0.7);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 1ms;
    --dur-2: 1ms;
    --dur-3: 1ms;
    --video-poster-fade: 1ms;
  }
}
