/* ===================================
   SCAMPI - CSS Variables & Design Tokens
   Integrated with Kadence Theme
   =================================== */

:root {
   /* Scampi Brand Colors */
   --scampi-color-deep: #1E3A5F;
   --scampi-color-deep-light: #2d5078;
   --scampi-color-coral: #FF6B35;
   --scampi-color-orange: #FF8A50;
   --scampi-color-text: #2D3748;
   --scampi-color-bg: #F7FAFC;
   --scampi-color-white: #FFFFFF;
   --scampi-color-gray-100: #F3F4F6;
   --scampi-color-gray-200: #E5E7EB;
   --scampi-color-gray-400: #9CA3AF;
   --scampi-color-gray-500: #6B7280;
   --scampi-color-gray-600: #4B5563;
   --scampi-color-blue-400: #60A5FA;

   /* Kadence Integration Note:
     Możesz też używać Kadence CSS variables:
     var(--global-palette1) - Palette 1 (Primary)
     var(--global-palette2) - Palette 2 (Accent)
     itd.
  */

   /* Typography */
   --scampi-font-sans: 'Satoshi', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   --scampi-font-serif: 'Erode', Georgia, serif;

   --scampi-text-xs: 0.75rem;
   --scampi-text-sm: 0.875rem;
   --scampi-text-base: 1rem;
   --scampi-text-lg: 1.125rem;
   --scampi-text-xl: 1.25rem;
   --scampi-text-2xl: 1.5rem;
   --scampi-text-3xl: 1.875rem;
   --scampi-text-4xl: 2.25rem;
   --scampi-text-5xl: 3rem;
   --scampi-text-6xl: 3.75rem;
   --scampi-text-7xl: 4.5rem;
   --scampi-text-8xl: 6rem;
   /* Matches prototype */
   --scampi-text-9xl: 8rem;
   /* Matches prototype massive size */

   --scampi-font-weight-400: 400;
   --scampi-font-weight-700: 700;
   --scampi-font-weight-900: 900;

   /* Spacing */
   --scampi-space-0: 0;
   --scampi-space-1: 0.25rem;
   --scampi-space-2: 0.5rem;
   --scampi-space-3: 0.75rem;
   --scampi-space-4: 1rem;
   --scampi-space-6: 1.5rem;
   --scampi-space-8: 2rem;
   --scampi-space-12: 3rem;
   --scampi-space-16: 4rem;
   --scampi-space-20: 5rem;
   --scampi-space-24: 6rem;
   --scampi-space-32: 8rem;

   /* Border Radius */
   --scampi-radius-sm: 0.375rem;
   --scampi-radius-md: 0.5rem;
   --scampi-radius-lg: 0.75rem;
   --scampi-radius-xl: 1rem;
   --scampi-radius-2xl: 1.5rem;
   --scampi-radius-3xl: 2rem;

   /* Transitions */
   --scampi-duration-fast: 150ms;
   --scampi-duration-normal: 300ms;
   --scampi-duration-slow: 500ms;
   --scampi-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
   --scampi-ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);

   /* Shadows */
   --scampi-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   --scampi-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
   --scampi-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
   --scampi-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
   --scampi-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

   /* Breakpoints (Kadence compatible)
     Mobile: <= 767px
     Tablet: 768px - 1024px
     Desktop: >= 1025px
  */
}