/**
 * PragmaApps V2 — Design Tokens
 * All CSS custom properties scoped under :root.
 * Prefix: --pav2-*  (avoids conflicts with Enfold / Elementor vars)
 */

:root {
  /* ── Color Palette ────────────────────────────────────────────────────────── */
  --pav2-black:       #0a0a0a;
  --pav2-black-soft:  #1a1a1a;
  --pav2-black-mid:   #2c2c2c;
  --pav2-red:         #d72638;
  --pav2-red-dark:    #b01e2d;
  --pav2-red-light:   #f5e0e3;
  --pav2-white:       #ffffff;
  --pav2-gray-50:     #f9f9f9;
  --pav2-gray-100:    #f2f2f2;
  --pav2-gray-200:    #e8e8e8;
  --pav2-gray-300:    #d1d1d1;
  --pav2-gray-500:    #8a8a8a;
  --pav2-gray-700:    #4a4a4a;

  /* ── Typography ───────────────────────────────────────────────────────────── */
  --pav2-font:        'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  /* ── Spacing Scale ────────────────────────────────────────────────────────── */
  --pav2-space-xs:    4px;
  --pav2-space-sm:    8px;
  --pav2-space-md:    16px;
  --pav2-space-lg:    24px;
  --pav2-space-xl:    48px;
  --pav2-space-2xl:   64px;
  --pav2-space-3xl:   96px;

  /* ── Border Radius ────────────────────────────────────────────────────────── */
  --pav2-radius:      12px;
  --pav2-radius-sm:   8px;
  --pav2-radius-pill: 40px;

  /* ── Shadows ──────────────────────────────────────────────────────────────── */
  --pav2-shadow-sm:   0 1px 4px rgba(0,0,0,0.07);
  --pav2-shadow-md:   0 4px 20px rgba(0,0,0,0.10);
  --pav2-shadow-lg:   0 8px 40px rgba(0,0,0,0.13);

  /* ── Transitions ──────────────────────────────────────────────────────────── */
  --pav2-transition:  0.22s ease;
  --pav2-transition-fast: 0.15s ease;

  /* ── Container ────────────────────────────────────────────────────────────── */
  --pav2-container-max: 1160px;
  --pav2-container-pad: 24px;

  /* ── Z-index ──────────────────────────────────────────────────────────────── */
  --pav2-z-header:  1000;
  --pav2-z-overlay: 500;
  --pav2-z-float:   10;
}