:root {
  /* ═════════════════════════════════════════
     SOLTECH DESIGN TOKENS v2.1.0
     Konzept 5: Logo-Blau #0A395B + Warmes Grau #9A948E
     ═════════════════════════════════════════ */

  /* Primitive: Blue Scale (navy / logo family) */
  --st-navy-900: #001a2e;
  --st-navy-800: #052942;
  --st-navy-700: #073654;
  --st-navy-600: #0A395B;
  --st-navy-500: #0d4570;
  --st-navy-400: #105783;
  --st-navy-300: #3a7ca3;
  --st-navy-200: #a9cce6;
  --st-navy-100: #d6e7f4;
  --st-navy-50: #f0f6fb;

  /* Primitive: Blue Accent — auf Logo-Familie reduziert */
  --st-blue-600: #0A395B;
  --st-blue-500: #0d4570;
  --st-blue-400: #105783;
  --st-blue-300: #3a7ca3;
  --st-blue-200: #a9cce6;
  --st-blue-100: #d6e7f4;
  --st-blue-50: #f0f6fb;

  /* Primitive: Cool Accent (Cyan) — neutralisiert zu warmem Graublau */
  --st-cyan-500: #9A948E;
  --st-cyan-400: #b0aba6;
  --st-cyan-300: #c8c4c0;
  --st-cyan-100: #f0eeec;
  --st-cyan-50: #f9f8f7;

  /* Primitive: Neutrals — warmes Grau */
  --st-neutral-950: #141413;
  --st-neutral-900: #232221;
  --st-neutral-800: #3d3b3a;
  --st-neutral-700: #575553;
  --st-neutral-600: #787572;
  --st-neutral-500: #9A948E;
  --st-neutral-400: #aba7a2;
  --st-neutral-300: #d6d3d0;
  --st-neutral-200: #e8e6e5;
  --st-neutral-100: #f4f3f2;
  --st-neutral-50: #fbfaf9;
  --st-white: #ffffff;

  /* Primitive: Semantic */
  --st-success: #10b981;
  --st-success-text: #146c43;
  --st-warning: #f59e0b;
  --st-error: #ef4444;
  --st-error-text: #b42318;
  --st-info: #0A395B;

  /* Primitive: Typography */
  --st-font-heading: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --st-font-body: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;

  /* Primitive: Spacing */
  --st-space-0: 0;
  --st-space-1: 0.25rem;
  --st-space-2: 0.5rem;
  --st-space-3: 0.75rem;
  --st-space-4: 1rem;
  --st-space-5: 1.5rem;
  --st-space-6: 2rem;
  --st-space-7: 2.5rem;
  --st-space-8: 3rem;
  --st-space-9: 5rem;
  --st-space-10: 8rem;
  --st-space-11: 10rem;
  --st-space-12: 14rem;

  /* Primitive: Radii */
  --st-radius-sm: 8px;
  --st-radius-md: 16px;
  --st-radius-lg: 24px;
  --st-radius-xl: 32px;
  --st-radius-pill: 100px;

  /* Primitive: Shadows */
  --st-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --st-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
  --st-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08), 0 2px 4px -2px rgba(15, 23, 42, 0.04);
  --st-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);
  --st-shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 8px 10px -6px rgba(15, 23, 42, 0.04);
  --st-shadow-blue: 0 10px 40px -10px rgba(10, 57, 91, 0.25);
  --st-shadow-cyan: 0 8px 32px -8px rgba(154, 148, 142, 0.25);

  /* Primitive: Transitions */
  --st-transition-fast: 200ms cubic-bezier(0.25, 1, 0.5, 1);
  --st-transition-base: 400ms cubic-bezier(0.25, 1, 0.5, 1);
  --st-transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
  --st-transition-slow: 800ms cubic-bezier(0.25, 1, 0.5, 1);

  /* Primitive: Breakpoints (reference) */
  --st-bp-sm: 640px;
  --st-bp-md: 768px;
  --st-bp-lg: 1024px;
  --st-bp-xl: 1280px;

  /* Semantic: Colors */
  --st-bg: var(--st-neutral-50);
  --st-surface: var(--st-white);
  --st-surface-alt: var(--st-neutral-100);
  --st-surface-dark: var(--st-navy-900);
  --st-text-primary: var(--st-neutral-900);
  --st-text-secondary: var(--st-neutral-600);
  --st-text-tertiary: var(--st-neutral-400);
  --st-text-on-dark: var(--st-white);
  --st-border: var(--st-neutral-200);
  --st-border-light: var(--st-neutral-100);
  --st-primary: var(--st-navy-600);
  --st-primary-hover: var(--st-navy-700);
  --st-secondary: var(--st-neutral-500);
  --st-secondary-hover: var(--st-neutral-700);
  --st-accent: var(--st-primary);
  --st-accent-hover: var(--st-primary-hover);
  --st-on-primary: var(--st-white);
  --st-on-secondary: var(--st-neutral-900);
  --st-on-accent: var(--st-white);

  /* Component: Buttons */
  --st-btn-primary-bg: var(--st-primary);
  --st-btn-primary-bg-hover: var(--st-primary-hover);
  --st-btn-primary-text: var(--st-on-primary);
  --st-btn-secondary-bg: var(--st-secondary);
  --st-btn-secondary-bg-hover: var(--st-secondary-hover);
  --st-btn-secondary-text: var(--st-on-secondary);
  --st-btn-outline-border: var(--st-primary);
  --st-btn-outline-text: var(--st-primary);
  --st-btn-outline-bg-hover: var(--st-primary);
  --st-btn-outline-text-hover: var(--st-on-primary);
  --st-btn-radius: var(--st-radius-pill);
  --st-btn-padding: 1rem 2rem;
  --st-btn-padding-sm: 0.75rem 1.5rem;
  --st-btn-font-size: 0.95rem;
  --st-btn-font-weight: 600;

  /* Component: Cards */
  --st-card-bg: var(--st-surface);
  --st-card-radius: var(--st-radius-lg);
  --st-card-shadow: var(--st-shadow-md);
  --st-card-shadow-hover: var(--st-shadow-xl);
  --st-card-padding: var(--st-space-6);

  /* Component: Navigation */
  --st-nav-height: 80px;
  --st-nav-bg-scrolled: rgba(255, 255, 255, 0.92);
  --st-nav-text: var(--st-neutral-700);
  --st-nav-text-hover: var(--st-primary);
  --st-nav-text-active: var(--st-primary);
  --st-nav-link-underline: var(--st-primary);

  /* Component: Sections */
  --st-section-padding-y: var(--st-space-11);
  --st-section-padding-y-mobile: var(--st-space-9);
  --st-section-label-line: var(--st-primary);

  /* Component: Inputs */
  --st-input-bg: var(--st-surface);
  --st-input-border: var(--st-border);
  --st-input-border-focus: var(--st-primary);
  --st-input-radius: var(--st-radius-md);
  --st-input-padding: 1rem 1.25rem;
}
