/*
 * Guest Post Buddy – design tokens (CSS custom properties)
 */

:root {
  /* ── Brand ── */
  --clr-primary:       #6366F1;
  --clr-primary-dark:  #4F46E5;
  --clr-primary-light: #EEEEFF;
  --clr-primary-glow:  rgba(99,102,241,0.25);
  --clr-accent:        #8B5CF6;
  --clr-accent-pink:   #EC4899;
  --clr-success:       #10B981;
  --clr-warning:       #F59E0B;
  --clr-danger:        #EF4444;
  --clr-info:          #3B82F6;

  /* ── Neutrals ── */
  --clr-bg:            #F5F5F9;
  --clr-surface:       #FFFFFF;
  --clr-border:        rgba(0,0,0,0.07);
  --clr-border-subtle: rgba(0,0,0,0.04);
  --clr-text:          #09090B;
  --clr-text-muted:    #3F3F46;
  --clr-text-light:    #71717A;

  /* ── Dark Palette ── */
  --clr-dark:          #09090B;
  --clr-dark-800:      #0E0E10;
  --clr-dark-700:      #141416;
  --clr-dark-surface:  #1A1A1E;
  --clr-dark-border:   rgba(255,255,255,0.07);

  /* ── Hero / on-dark text ── */
  --clr-on-dark:         #FFFFFF;
  --clr-on-dark-muted:   #94A3B8;
  --clr-hero-start:      #0F0C29;
  --clr-hero-mid:        #302B63;
  --clr-hero-end:        #24243E;
  --gradient-hero-classic: linear-gradient(135deg, var(--clr-hero-start), var(--clr-hero-mid), var(--clr-hero-end));

  /* ── Gradients ── */
  --gradient-primary:  linear-gradient(135deg, #6366F1 0%, #4F46E5 50%, #7C3AED 100%);
  --gradient-hero:     linear-gradient(145deg, #09090B 0%, #0D0D1A 50%, #13102E 100%);
  --gradient-card:     linear-gradient(145deg, #ffffff 0%, #fafafe 100%);
  --gradient-glow:     radial-gradient(ellipse at center, rgba(99,102,241,.15) 0%, transparent 70%);

  /* ── Glass ── */
  --glass-bg:          rgba(255,255,255,0.75);
  --glass-bg-dark:     rgba(9,9,11,0.75);
  --glass-border:      rgba(255,255,255,0.22);
  --glass-border-dark:   rgba(255,255,255,0.08);
  --glass-blur:        blur(20px);
  --glass-blur-sm:     blur(10px);

  /* ── Typography ── */
  --font-body:         'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading:      'Plus Jakarta Sans', 'Inter', sans-serif;
  --font-mono:         'JetBrains Mono', 'Fira Code', monospace;

  /* ── Spacing ── */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 6rem;

  /* ── Border Radius ── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-xl:   24px;
  --radius-2xl:  32px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-xs:   0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm:   0 1px 4px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.03);
  --shadow-md:   0 4px 16px rgba(0,0,0,0.06), 0 1px 4px rgba(0,0,0,0.04);
  --shadow-lg:   0 12px 40px rgba(0,0,0,0.09), 0 4px 12px rgba(0,0,0,0.05);
  --shadow-xl:   0 24px 80px rgba(0,0,0,0.14), 0 8px 24px rgba(0,0,0,0.07);
  --shadow-card: 0 2px 8px rgba(0,0,0,0.05), 0 0 0 1px rgba(0,0,0,0.04);
  --shadow-card-hover: 0 20px 60px rgba(99,102,241,0.18), 0 4px 20px rgba(0,0,0,0.08);
  --shadow-primary: 0 8px 24px rgba(99,102,241,0.38), 0 2px 8px rgba(0,0,0,0.1);
  --shadow-glow: 0 0 60px rgba(99,102,241,0.22), 0 0 120px rgba(124,58,237,0.1);

  /* ── Transitions ── */
  --transition-fast:   0.12s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base:   0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow:   0.35s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-spring: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Layout ── */
  --container-max:  1280px;
  --sidebar-width:  300px;
  --header-height:  70px;

  /* ── Surfaces ── */
  --clr-elevated:      #FFFFFF;
  --clr-header-bg:     rgba(255, 255, 255, 0.82);
  --clr-header-bg-2:   rgba(255, 255, 255, 0.97);
  --clr-shadow:        rgba(9,9,11,0.07);
}