:root {
  --citta-primary: #ffffff;
  --citta-secondary: #111111;
  --citta-accent: #32a435;
  --citta-action: #c82222;

  --citta-surface: var(--citta-primary);
  --citta-surface-raised: color-mix(in srgb, var(--citta-secondary) 3%, var(--citta-primary));
  --citta-surface-sunken: color-mix(in srgb, var(--citta-secondary) 6%, var(--citta-primary));
  --citta-surface-inverse: var(--citta-secondary);

  --citta-tint-accent: color-mix(in srgb, var(--citta-accent) 24%, var(--citta-primary));
  --citta-tint-accent-strong: color-mix(in srgb, var(--citta-accent) 42%, var(--citta-primary));
  --citta-tint-action: color-mix(in srgb, var(--citta-action) 19%, var(--citta-primary));
  --citta-tint-action-strong: color-mix(in srgb, var(--citta-action) 34%, var(--citta-primary));

  --citta-text: var(--citta-secondary);
  --citta-text-muted: color-mix(in srgb, var(--citta-secondary) 58%, var(--citta-primary));
  --citta-text-faint: color-mix(in srgb, var(--citta-secondary) 38%, var(--citta-primary));
  --citta-text-inverse: var(--citta-primary);

  --citta-line: color-mix(in srgb, var(--citta-secondary) 13%, var(--citta-primary));
  --citta-line-strong: color-mix(in srgb, var(--citta-secondary) 28%, var(--citta-primary));

  --citta-accent-hover: color-mix(in srgb, var(--citta-accent) 82%, var(--citta-secondary));
  --citta-action-hover: color-mix(in srgb, var(--citta-action) 82%, var(--citta-secondary));
  --citta-on-accent: var(--citta-secondary);
  --citta-on-action: var(--citta-primary);

  --citta-font-display: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --citta-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --citta-display-1: clamp(2.85rem, 7.4vw, 6rem);
  --citta-display-2: clamp(2.3rem, 5.2vw, 4.15rem);
  --citta-h2: clamp(1.95rem, 3.9vw, 3.15rem);
  --citta-h3: clamp(1.35rem, 2.1vw, 1.85rem);
  --citta-h4: clamp(1.1rem, 1.5vw, 1.3rem);
  --citta-body: clamp(1rem, 1.05vw, 1.0625rem);
  --citta-small: 0.875rem;
  --citta-micro: 0.75rem;

  --citta-leading-display: 0.94;
  --citta-leading-title: 1.08;
  --citta-leading-body: 1.65;
  --citta-tracking-display: -0.035em;
  --citta-tracking-title: -0.02em;
  --citta-tracking-eyebrow: 0.16em;

  --citta-s1: 0.5rem;
  --citta-s2: 1rem;
  --citta-s3: 1.5rem;
  --citta-s4: 2rem;
  --citta-s5: 3rem;
  --citta-s6: 4rem;
  --citta-s7: 6rem;
  --citta-s8: 8rem;
  --citta-section: clamp(4rem, 9vw, 8rem);

  --citta-r-sm: 0.75rem;
  --citta-r-md: 1.25rem;
  --citta-r-lg: 1.75rem;
  --citta-r-xl: 2.25rem;
  --citta-r-pill: 999px;

  --citta-shadow-sm: 0 2px 8px color-mix(in srgb, var(--citta-secondary) 6%, transparent);
  --citta-shadow-md: 0 12px 32px color-mix(in srgb, var(--citta-secondary) 9%, transparent);
  --citta-shadow-lg: 0 28px 64px color-mix(in srgb, var(--citta-secondary) 12%, transparent);

  --citta-container: 1200px;
  --citta-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

body[class*='elementor-kit-'] {
  --e-global-color-primary: var(--citta-secondary);
  --e-global-color-secondary: var(--citta-text-muted);
  --e-global-color-text: var(--citta-text);
  --e-global-color-accent: var(--citta-accent);
  --e-global-typography-primary-font-family: 'Outfit';
  --e-global-typography-secondary-font-family: 'Outfit';
  --e-global-typography-text-font-family: 'Inter';
  --e-global-typography-accent-font-family: 'Inter';
}