/* ================================================================
   ANCROVIA TECHNOLOGIES PRIVATE LIMITED
   CSS Design System – Variables & Tokens
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@400;500;600;700;800&display=swap');

:root {

  /* ============================================================
     COLORS
     ============================================================ */

  /* Primary – Brand Blue */
  --primary-color:      #1a56db;
  --primary-dark:       #1440a8;
  --primary-light:      #3b82f6;
  --primary-50:     rgba(26, 86, 219, 0.05);
  --primary-100:    rgba(26, 86, 219, 0.10);
  --primary-200:    rgba(26, 86, 219, 0.20);

  /* Secondary – Indigo */
  --secondary-color:    #4f46e5;
  --secondary-dark:     #3730a3;
  --secondary-light:    #818cf8;

  /* Accent – Cyan */
  --accent-color:       #06b6d4;
  --accent-dark:        #0891b2;
  --accent-light:       #67e8f9;

  /* Neutrals */
  --bg-color:           #f8fafc;
  --surface-color:      #ffffff;
  --surface-alt:        #f1f5f9;
  --text-color:         #374151;
  --text-muted:         #6b7280;
  --text-light:         #9ca3af;
  --heading-color:      #111827;
  --border-color:       #e5e7eb;
  --border-light:       #f3f4f6;

  /* Dark Surfaces */
  --dark-bg:            #0f172a;
  --dark-surface:       #1e293b;
  --dark-surface-2:     #334155;
  --dark-text:          #e2e8f0;
  --dark-text-muted:    #94a3b8;
  --dark-border:        rgba(255, 255, 255, 0.08);

  /* State Colors */
  --success:            #10b981;
  --success-light:      rgba(16, 185, 129, 0.10);
  --warning:            #f59e0b;
  --error:              #ef4444;
  --error-light:        rgba(239, 68, 68, 0.10);

  /* ============================================================
     TYPOGRAPHY
     ============================================================ */

  --font-primary:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display:   'Poppins', 'Inter', sans-serif;

  --font-size-xs:   0.75rem;    /* 12px */
  --font-size-sm:   0.875rem;   /* 14px */
  --font-size-base: 1rem;       /* 16px */
  --font-size-lg:   1.125rem;   /* 18px */
  --font-size-xl:   1.25rem;    /* 20px */
  --font-size-2xl:  1.5rem;     /* 24px */
  --font-size-3xl:  1.875rem;   /* 30px */
  --font-size-4xl:  2.25rem;    /* 36px */
  --font-size-5xl:  3rem;       /* 48px */
  --font-size-6xl:  3.75rem;    /* 60px */

  /* ============================================================
     SPACING
     ============================================================ */

  --spacing-unit:   8px;
  --spacing-xs:     4px;
  --spacing-sm:     8px;
  --spacing-md:     16px;
  --spacing-lg:     24px;
  --spacing-xl:     32px;
  --spacing-2xl:    48px;
  --spacing-3xl:    64px;
  --spacing-4xl:    96px;
  --spacing-5xl:    128px;

  /* ============================================================
     LAYOUT
     ============================================================ */

  --container-width:    1200px;
  --container-wide:     1400px;
  --nav-height:         72px;

  /* ============================================================
     BORDER RADIUS
     ============================================================ */

  --border-radius:      8px;
  --border-radius-sm:   4px;
  --border-radius-md:   12px;
  --border-radius-lg:   16px;
  --border-radius-xl:   24px;
  --border-radius-2xl:  32px;
  --border-radius-full: 9999px;

  /* ============================================================
     SHADOWS
     ============================================================ */

  --shadow-xs:          0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-sm:          0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md:          0 4px 16px rgba(0, 0, 0, 0.07), 0 2px 4px rgba(0, 0, 0, 0.05);
  --shadow-lg:          0 10px 40px rgba(0, 0, 0, 0.09), 0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-xl:          0 20px 60px rgba(0, 0, 0, 0.10);
  --shadow-primary:     0 8px 32px rgba(26, 86, 219, 0.25);
  --shadow-primary-lg:  0 16px 48px rgba(26, 86, 219, 0.35);
  --shadow-card:        0 2px 8px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.04);
  --shadow-card-hover:  0 8px 32px rgba(0, 0, 0, 0.10), 0 16px 48px rgba(0, 0, 0, 0.06);

  /* ============================================================
     GRADIENTS
     ============================================================ */

  --gradient-primary:   linear-gradient(135deg, #1a56db 0%, #4f46e5 100%);
  --gradient-secondary: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  --gradient-accent:    linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
  --gradient-hero:      linear-gradient(135deg, #0f172a 0%, #1e3a8a 55%, #1a56db 100%);
  --gradient-dark:      linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  --gradient-card:      linear-gradient(135deg, rgba(26, 86, 219, 0.04) 0%, rgba(79, 70, 229, 0.04) 100%);
  --gradient-card-hover:linear-gradient(135deg, rgba(26, 86, 219, 0.08) 0%, rgba(79, 70, 229, 0.08) 100%);
  --gradient-teal:      linear-gradient(135deg, #0d9488 0%, #06b6d4 100%);
  --gradient-violet:    linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
  --gradient-amber:     linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
  --gradient-rose:      linear-gradient(135deg, #e11d48 0%, #f43f5e 100%);
  --gradient-emerald:   linear-gradient(135deg, #059669 0%, #10b981 100%);

  /* ============================================================
     TRANSITIONS
     ============================================================ */

  --transition-fast:    all 0.15s ease;
  --transition:         all 0.3s ease;
  --transition-slow:    all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce:  all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ============================================================
     Z-INDICES
     ============================================================ */

  --z-base:     1;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
}