:root {
  --color-bg: #ffffff;
  --color-bg-inverse: #000000;
  --color-text: #000000;
  --color-text-muted: #6b6b6b;
  --color-text-on-dark: #ffffff;
  --color-text-muted-on-dark: #5a5a5a;
  --color-border: #e5e5e5;
  --color-border-dark: #333333;
  --color-overlay: rgba(0, 0, 0, 0.5);

  --font-family: "Manrope", system-ui, sans-serif;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --text-display-xl: clamp(2rem, 4vw, 3.5rem);
  --text-display-lg: clamp(1.75rem, 3vw, 2.625rem);
  --text-section-tag: 0.8125rem;
  --text-body: 1rem;
  --text-body-lg: 1.125rem;
  --text-caption: 0.75rem;

  --space-section-y: clamp(4rem, 8vw, 7.5rem);
  --space-container-x: clamp(1.25rem, 4vw, 2.5rem);
  --layout-max-width: 75rem;
  --header-height: 5rem;

  --radius-card: 1.25rem;
  --radius-pill: 999px;

  --shadow-btn-hover: 0 15px 30px -10px rgba(0, 11, 48, 0.2);
  --shadow-card-hover: 0 18px 40px -16px rgba(0, 0, 0, 0.18);
  --transition-fast: 0.2s ease;
  --transition-reveal: 0.5s ease;

  --z-header: 100;
  --z-modal: 200;
  --z-widget: 90;
}