/* This site was custom designed by Sitethreesixty.com and is actively managed by Sitethreesixty.com */
/* ================================
   EFFECT TOKENS - CURLY TAIL SCREEN & WINDOW
   Apple-inspired soft shadows and subtle effects
   Light theme optimized
   ================================ */

:root {
  /* ================================
     BORDER RADIUS
     Slightly rounded for friendly feel
     ================================ */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* ================================
     SHADOWS - Apple-Inspired Soft Shadows
     Light, diffused, subtle depth
     ================================ */

  /* Shadows for cards and UI elements - more visible */
  --shadow-xs: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px -2px rgba(0, 0, 0, 0.12), 0 2px 6px -1px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 24px -4px rgba(0, 0, 0, 0.15), 0 4px 10px -2px rgba(0, 0, 0, 0.08);
  --shadow-xl: 0 20px 40px -8px rgba(0, 0, 0, 0.18), 0 10px 16px -6px rgba(0, 0, 0, 0.1);
  --shadow-2xl: 0 25px 60px -15px rgba(0, 0, 0, 0.25);

  /* Elevated card shadows - for hover states */
  --shadow-elevated: 0 16px 32px -6px rgba(0, 0, 0, 0.18), 0 6px 12px -3px rgba(0, 0, 0, 0.1);
  --shadow-elevated-hover: 0 20px 40px -6px rgba(0, 0, 0, 0.2), 0 8px 16px -4px rgba(0, 0, 0, 0.12);

  /* ================================
     FROSTED GLASS EFFECTS
     For panels and overlays
     ================================ */
  --shadow-glass: 0 4px 16px rgba(0, 0, 0, 0.06), inset 0 0 0 1px rgba(255, 255, 255, 0.8);
  --shadow-glass-hover: 0 8px 24px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.9);

  /* ================================
     ACCENT GLOWS
     Orange and blue brand accents
     ================================ */
  --glow-orange: 0 0 20px rgba(249, 115, 22, 0.15);
  --glow-orange-strong: 0 0 30px rgba(249, 115, 22, 0.25);
  --glow-blue: 0 0 20px rgba(30, 64, 175, 0.1);
  --glow-blue-strong: 0 0 30px rgba(30, 64, 175, 0.2);

  /* ================================
     BLUR EFFECTS
     ================================ */
  --blur-sm: blur(4px);
  --blur-md: blur(8px);
  --blur-lg: blur(12px);
  --blur-xl: blur(20px);

  /* Backdrop Filter - Frosted glass */
  --backdrop-glass: blur(12px) saturate(180%);
  --backdrop-glass-strong: blur(20px) saturate(200%);

  /* ================================
     TRANSITIONS
     Smooth, Apple-like motion
     ================================ */
  --transition-fast: 0.15s ease-out;
  --transition-base: 0.2s ease-out;
  --transition-slow: 0.3s ease-out;
  --transition-smooth: 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);

  /* ================================
     TRANSFORM VALUES
     Subtle lift and scale effects
     ================================ */
  --lift-sm: translateY(-2px);
  --lift-md: translateY(-4px);
  --lift-lg: translateY(-6px);
  --scale-hover: scale(1.02);
  --scale-press: scale(0.98);

  /* ================================
     Z-INDEX LAYERS
     ================================ */
  --z-base: 1;
  --z-dropdown: 10;
  --z-sticky: 100;
  --z-fixed: 500;
  --z-modal-backdrop: 900;
  --z-modal: 1000;
  --z-tooltip: 1100;

  /* ================================
     SPACING FOR CTA AREAS
     30-50px around buttons
     ================================ */
  --cta-padding-sm: 30px;
  --cta-padding-md: 40px;
  --cta-padding-lg: 50px;
}

/* This site was custom designed by Sitethreesixty.com and is actively managed by Sitethreesixty.com */
