/* ==========================================================================
   Solivra Agency — Design Tokens
   Single source of truth for the entire design system.
   ========================================================================== */

:root {
  /* Brand - Solivra Agency Logo Colors */
  --sv-primary:       #0A84FF;
  --sv-primary-600:   #1E90FF;
  --sv-primary-700:   #2FA7FF;
  --sv-primary-300:   #4FC3FF;
  --sv-secondary:     #1E90FF;
  --sv-cyan:          #4FC3FF;
  --sv-accent-glow:   #2FA7FF;

  /* Light backgrounds */
  --sv-white:         #FFFFFF;
  --sv-light-blue:    #F4F9FF;
  --sv-very-light:    #EAF5FF;
  --sv-section-alt:   #F7FBFF;

  /* Deep blue for footer */
  --sv-deep-blue:     #0057D9;
  --sv-deep-blue-dark: #0A84FF;

  /* Ink (text) - Light theme */
  --sv-ink:           #111827;
  --sv-ink-strong:    #111827;
  --sv-ink-muted:     #4B5563;
  --sv-ink-subtle:    #6B7280;
  --sv-ink-faint:     #9CA3AF;

  /* Lines & surfaces - Light theme */
  --sv-line:          rgba(10, 132, 255, 0.12);
  --sv-line-strong:   rgba(10, 132, 255, 0.2);
  --sv-glass:         rgba(255, 255, 255, 0.8);
  --sv-glass-strong:  rgba(255, 255, 255, 0.95);
  --sv-glass-light:   rgba(244, 249, 255, 0.6);
  --sv-card:          #FFFFFF;
  --sv-card-hover:    #F4F9FF;

  /* Radii */
  --sv-radius-xs:     6px;
  --sv-radius-sm:     10px;
  --sv-radius:        16px;
  --sv-radius-lg:     24px;
  --sv-radius-xl:     32px;
  --sv-radius-pill:   999px;

  /* Shadows - Light theme */
  --sv-shadow-xs:     0 1px 2px rgba(10, 132, 255, 0.08);
  --sv-shadow-sm:     0 2px 8px rgba(10, 132, 255, 0.12);
  --sv-shadow:        0 12px 32px rgba(10, 132, 255, 0.15);
  --sv-shadow-lg:     0 24px 64px rgba(10, 132, 255, 0.18);
  --sv-shadow-glow:   0 0 60px rgba(10, 132, 255, 0.25);
  --sv-shadow-inset:  inset 0 1px 0 rgba(255, 255, 255, 0.8);

  /* Gradients - Solivra Brand */
  --sv-gradient-brand:  linear-gradient(135deg, #0A84FF 0%, #1E90FF 50%, #2FA7FF 100%);
  --sv-gradient-blue:   linear-gradient(135deg, #0A84FF 0%, #1E90FF 100%);
  --sv-gradient-cyan:   linear-gradient(135deg, #1E90FF 0%, #4FC3FF 100%);
  --sv-gradient-text:   linear-gradient(135deg, #0A84FF 0%, #1E90FF 100%);
  --sv-gradient-mesh:   radial-gradient(at 20% 20%, rgba(10, 132, 255, 0.15) 0px, transparent 50%),
                        radial-gradient(at 80% 0%, rgba(79, 195, 255, 0.1) 0px, transparent 50%),
                        radial-gradient(at 50% 80%, rgba(30, 144, 255, 0.12) 0px, transparent 50%);
  --sv-gradient-footer: linear-gradient(135deg, #0A84FF 0%, #0057D9 100%);

  /* Typography */
  --sv-font-display:  'Space Grotesk', 'Plus Jakarta Sans', system-ui, sans-serif;
  --sv-font-body:     'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --sv-font-mono:     'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --sv-fs-xs:         0.75rem;     /* 12 */
  --sv-fs-sm:         0.875rem;    /* 14 */
  --sv-fs-base:       1rem;        /* 16 */
  --sv-fs-md:         1.125rem;    /* 18 */
  --sv-fs-lg:         1.25rem;     /* 20 */
  --sv-fs-xl:         1.5rem;      /* 24 */
  --sv-fs-2xl:        1.875rem;    /* 30 */
  --sv-fs-3xl:        2.25rem;     /* 36 */
  --sv-fs-4xl:        3rem;        /* 48 */
  --sv-fs-5xl:        3.75rem;     /* 60 */
  --sv-fs-6xl:        4.5rem;      /* 72 */
  --sv-fs-7xl:        5.5rem;      /* 88 */
  --sv-fs-8xl:        6.5rem;      /* 104 */

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

  /* Container */
  --sv-container:     1280px;
  --sv-container-sm:  960px;

  /* Motion */
  --sv-ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --sv-ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --sv-ease-smooth:   cubic-bezier(0.65, 0, 0.35, 1);
  --sv-dur-fast:      150ms;
  --sv-dur:           300ms;
  --sv-dur-slow:      600ms;
  --sv-dur-slower:    1000ms;

  /* Z-index */
  --sv-z-base:        1;
  --sv-z-dropdown:    100;
  --sv-z-sticky:      900;
  --sv-z-navbar:      1000;
  --sv-z-overlay:     1100;
  --sv-z-modal:       1200;
  --sv-z-toast:       1300;
}

/* Selection */
::selection {
  background: rgba(10, 132, 255, 0.2);
  color: #111827;
}

/* Scrollbar (webkit) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--sv-light-blue); }
::-webkit-scrollbar-thumb {
  background: var(--sv-primary-300);
  border-radius: var(--sv-radius-pill);
  border: 2px solid var(--sv-light-blue);
}
::-webkit-scrollbar-thumb:hover { background: var(--sv-primary); }