/* Signulu design tokens — single source of truth. Extracted from index.html. */
:root {
  /* Brand */
  --sg-primary: #5A30F1;
  --sg-primary-600: #4726C9;
  --sg-secondary: #5A30F1;
  --sg-accent: #5A30F1;
  --sg-accent-600: #4726C9;
  --sg-accent-light: #FFD15D;
  --sg-accent-soft: rgba(90, 48, 241, 0.10);
  --sg-secondary-soft: #EDF0FF;
  --sg-secondary-soft-hover: #DCE2FF;
  --sg-secondary-border: #C4CDFF;
  --sg-secondary-ink: #3B23A8;
  --sg-accent-soft-dark: rgba(255, 209, 93, 0.16);

  /* Surfaces */
  --sg-surface-dark: #221C52;
  --sg-surface-dark-2: #191441;
  --sg-footer-bg: #2D2192;
  --sg-band-bg: #2D2192;
  --sg-surface-light: #F9FBFD;
  --sg-surface: #FFFFFF;
  --sg-hero-overlay: rgba(29, 22, 58, 0.80);

  --sg-heading: #333333;

  /* Text */
  --sg-text: #555555;
  --sg-muted: #6B7280;
  --sg-on-dark: #FFFFFF;
  --sg-on-dark-muted: rgba(255, 255, 255, 0.78);
  --sg-border: #E5E7EB;
  --sg-border-dark: rgba(255, 255, 255, 0.12);

  /* Semantic */
  --sg-success: #10B981;
  --sg-warning: #F59E0B;
  --sg-info: #3B82F6;
  --sg-danger: #EF4444;

  /* Typography */
  --sg-font-heading: 'Lato', 'Segoe UI', system-ui, sans-serif;
  --sg-font-body: 'Lato', 'Segoe UI', system-ui, sans-serif;
  --sg-h1: clamp(2.5rem, 5vw, 4rem);
  --sg-h2: clamp(2rem, 4vw, 2.5rem);
  --sg-h3: clamp(1.5rem, 3vw, 2rem);
  --sg-h4: 1.25rem;
  --sg-h5: 1.125rem;
  --sg-h6: 1rem;
  --sg-body: 1rem;
  --sg-small: 0.875rem;
  --sg-lh-tight: 1.1;
  --sg-lh-heading: 1.25;
  --sg-lh-body: 1.6;
  --sg-ls-tight: -0.02em;
  --sg-ls-wide: 0.12em;

  /* Layout */
  --sg-container: 1280px;
  --sg-section-y: 5rem;
  --sg-section-y-sm: 3rem;
  --sg-prose: 800px;

  /* Radii */
  --sg-radius-sm: 4px;
  --sg-radius-md: 8px;
  --sg-radius-lg: 8px;
  --sg-radius-xl: 20px;
  --sg-radius-pill: 50rem;

  /* Elevation */
  --sg-shadow-sm: 0 5px 15px rgba(0, 0, 0, 0.03);
  --sg-shadow-md: 0 10px 25px rgba(0, 0, 0, 0.08);
  --sg-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.10);
  --sg-shadow-xl: 0 20px 45px rgba(0, 0, 0, 0.18);

  /* Motion */
  --sg-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --sg-t-fast: 140ms;
  --sg-t: 220ms;

  /* Bootstrap 5 variable overrides so native utilities inherit the brand */
  --bs-primary: #5A30F1;
  --bs-primary-rgb: 90, 48, 241;
  --bs-secondary: #6B7280;
  --bs-secondary-rgb: 107, 114, 128;
  --bs-warning: #F59E0B;
  --bs-warning-rgb: 245, 158, 11;
  --bs-success: #10B981;
  --bs-success-rgb: 16, 185, 129;
  --bs-info: #3B82F6;
  --bs-info-rgb: 59, 130, 246;
  --bs-body-color: #555555;
  --bs-body-color-rgb: 85, 85, 85;
  --bs-body-bg: #FFFFFF;
  --bs-body-font-family: var(--sg-font-body);
  --bs-body-font-size: 1rem;
  --bs-body-line-height: 1.6;
  --bs-border-color: #E5E7EB;
  --bs-border-radius: 8px;
  --bs-border-radius-lg: 8px;
  --bs-link-color: #5A30F1;
  --bs-link-color-rgb: 90, 48, 241;
  --bs-link-hover-color: #4726C9;
  --bs-emphasis-color: #333333;
}