:root {

  --color-primary-50: #e6ebff;
  --color-primary-100: #c0ccff;
  --color-primary-200: #8fa5ff;
  --color-primary-300: #5c78ff;
  --color-primary-400: #2f4ff0;
  --color-primary-500: #0033d6;
  --color-primary-600: #0a2aa0;
  --color-primary-700: #0a2075;
  --color-primary-800: #0a1550;
  --color-primary-900: #050530;
  --color-primary-vivid: #0033d6;

  --color-secondary-50: #e3f8ee;
  --color-secondary-100: #b9edd6;
  --color-secondary-200: #86dcb6;
  --color-secondary-300: #4fc793;
  --color-secondary-400: #22b074;
  --color-secondary-500: #0e9f5b;
  --color-secondary-600: #0c7a49;
  --color-secondary-700: #0b5a3c;
  --color-secondary-800: #0a3f31;
  --color-secondary-900: #0a2c2c;
  --color-secondary-vivid: #0e9f5b;

  --color-tertiary-50: #fbe6fb;
  --color-tertiary-100: #f3c0f3;
  --color-tertiary-200: #e88ee8;
  --color-tertiary-300: #db5cdb;
  --color-tertiary-400: #cc2ecc;
  --color-tertiary-500: #c400c4;
  --color-tertiary-600: #9e0a90;
  --color-tertiary-700: #7e0a6e;
  --color-tertiary-800: #6a0a58;
  --color-tertiary-900: #5c0a4a;
  --color-tertiary-vivid: #c400c4;

  --color-warm-50: #fdefe3;
  --color-warm-100: #fbd5b8;
  --color-warm-200: #f7b184;
  --color-warm-300: #f58f4f;
  --color-warm-400: #f5701c;
  --color-warm-500: #d1550f;
  --color-warm-600: #a83b0a;
  --color-warm-700: #7f2408;
  --color-warm-800: #661007;
  --color-warm-900: #5c0505;
  --color-warm-vivid: #f5701c;

  --color-olive-50: #fdf7e1;
  --color-olive-100: #fbebb0;
  --color-olive-200: #f7dc78;
  --color-olive-300: #f5c542;
  --color-olive-400: #d9a92f;
  --color-olive-500: #b08a22;
  --color-olive-600: #8a6c1a;
  --color-olive-700: #6e5613;
  --color-olive-800: #63630c;
  --color-olive-900: #4a4a08;
  --color-olive-vivid: #f5c542;

  --color-accent: var(--color-olive-300);
  --color-accent-strong: var(--color-olive-400);
  --color-accent-soft: var(--color-olive-200);

  --color-background: var(--color-primary-900);
  --color-background-alt: var(--color-secondary-900);
  --color-background-institutional: #f4f1e8;
  --color-hero-bg: #000000;
  --color-header-glass: rgba(0, 0, 0, 0.18);
  --color-header-glass-scrolled: rgba(0, 0, 0, 0.42);
  --color-surface-light: #ffffff;
  --color-surface: rgba(255, 255, 255, 0.05);
  --color-surface-strong: rgba(255, 255, 255, 0.09);
  --color-border: rgba(255, 255, 255, 0.16);
  --color-border-strong: rgba(255, 255, 255, 0.28);

  --color-text-primary: #ffffff;
  --color-text-secondary: rgba(255, 255, 255, 0.72);
  --color-text-disabled: rgba(255, 255, 255, 0.44);
  --color-text-on-dark: #ffffff;
  --color-text-on-dark-secondary: rgba(255, 255, 255, 0.7);
  --color-text-on-accent: var(--color-primary-900);
  --color-text-on-light: var(--color-primary-900);

  --color-link: var(--color-secondary-300);
  --color-link-hover: var(--color-secondary-200);
  --color-focus-ring: var(--color-accent);

  --color-cta: var(--color-primary-500);
  --color-cta-hover: var(--color-primary-600);

  --color-success: var(--color-secondary-500);
  --color-success-text: var(--color-secondary-200);
  --color-warning: var(--color-olive-300);
  --color-warning-text: var(--color-olive-100);
  --color-error: #d92d20;
  --color-error-text: var(--color-warm-200);
  --color-info: var(--color-primary-400);
  --color-info-text: var(--color-primary-200);

  --font-primary: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;

  --font-secondary: "Zipline", "Manrope", system-ui, sans-serif;

  --fw-thin: 100;
  --fw-extralight: 200;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: clamp(1.125rem, 0.95rem + 0.9vw, 1.5rem);
  --fs-xl: clamp(1.5rem, 1.1rem + 2vw, 2.25rem);
  --fs-2xl: clamp(2rem, 1.3rem + 3.4vw, 3.25rem);
  --fs-3xl: clamp(2.5rem, 1.4rem + 5.4vw, 4.5rem);

  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-normal: 1.6;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.08em;
  --tracking-wider: 0.16em;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-28: 7rem;
  --space-32: 8rem;

  --section-gap: clamp(var(--space-8), 5vw, var(--space-16));

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-xl: 40px;
  --radius-full: 999px;

  --shadow-xs: 0 1px 2px rgba(5, 5, 48, 0.5);
  --shadow-sm: 0 2px 8px rgba(5, 5, 48, 0.5);
  --shadow-md: 0 6px 18px rgba(5, 5, 48, 0.55);
  --shadow-lg: 0 12px 34px rgba(5, 5, 48, 0.6);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 140ms;
  --duration-base: 260ms;
  --duration-slow: 520ms;

  --container-max: 1440px;
  --container-content: 1120px;
  --container-padding: clamp(1.25rem, 5vw, 4rem);
  --header-h: 76px;

  --dot-color: #ffffff;
  --dot-tile: 16px;
  --dot-radius: 1px;
  --dot-opacity: 0.05;
  --dot-opacity-edge: 0.08;
  --festival-dot-red: var(--color-warm-vivid);
  --festival-dot-yellow: var(--color-olive-vivid);
  --festival-dot-green: var(--color-secondary-vivid);
  --festival-dot-pink: var(--color-tertiary-300);
  --festival-dots-opacity: 0.46;
  --festival-dots-opacity-soft: 0.28;
  --festival-dots-field: clamp(260px, 38vw, 560px);

  --contour-1: var(--color-secondary-vivid);
  --contour-2: var(--color-tertiary-vivid);
  --contour-3: var(--color-warm-vivid);
  --contour-4: var(--color-olive-vivid);
  --contour-5: var(--color-primary-300);
  --contour-quiet: var(--color-border);
  --contour-weight: 6;

  --lozenge-size: 7px;
  --lozenge-color: var(--color-secondary-300);

  --step: 10px;

  /* Onda cromática: preto (hero) -> azul -> marinho -> magenta, em ondas */
  --wave-void: var(--color-hero-bg);
  --wave-navy: var(--color-primary-900);
  --wave-navy-rise: var(--color-primary-700);
  --wave-blue: var(--color-primary-500);
  --wave-navy-dip: var(--color-primary-800);
  --wave-indigo: #2a0a45;
  --wave-magenta: var(--color-tertiary-600);
  --wave-navy-dip-2: #170a30;
  --wave-blue-2: var(--color-primary-600);
}