/* Paty Connect — Color tokens
 * Brand: White, Dark Gray, Royal Blue, Light Gray. Premium / minimalist.
 */
:root {
  /* ---- Brand core ---- */
  --pc-white: #FFFFFF;
  --pc-ink: #1A1A1A;          /* near-black, primary text */
  --pc-blue: #2563EB;         /* royal blue — primary brand */
  --pc-gray-50: #F5F5F5;      /* light gray surface */

  /* ---- Blue scale ---- */
  --pc-blue-100: #DBEAFE;
  --pc-blue-200: #BFDBFE;
  --pc-blue-400: #60A5FA;
  --pc-blue-500: #3B82F6;     /* gradient highlight (CONNECT) */
  --pc-blue-600: #2563EB;     /* = brand blue */
  --pc-blue-700: #1D4ED8;     /* hover / pressed */
  --pc-blue-800: #1E40AF;
  --pc-blue-900: #14306E;     /* deep promo band */
  --pc-navy: #0B1F3A;         /* wordmark dark, deep navy */

  /* Brand gradient (logo "CONNECT" + buttons) */
  --pc-gradient-blue: linear-gradient(90deg, #1D4ED8 0%, #2563EB 45%, #3B82F6 100%); /* @kind color */
  --pc-gradient-hero: radial-gradient(circle at 70% 40%, #2563EB 0%, #1D4ED8 60%, #14306E 100%); /* @kind color */

  /* ---- Neutral scale ---- */
  --pc-gray-0: #FFFFFF;
  --pc-gray-25: #FAFAFB;
  --pc-gray-100: #EDEEF0;
  --pc-gray-200: #E2E4E8;
  --pc-gray-300: #CACDD4;
  --pc-gray-400: #9AA0AB;
  --pc-gray-500: #6B717C;
  --pc-gray-600: #4A4F58;
  --pc-gray-700: #33373E;
  --pc-gray-900: #1A1A1A;

  /* ---- Semantic / utility ---- */
  --pc-success: #16A34A;
  --pc-warning: #F59E0B;
  --pc-danger:  #DC2626;
  --pc-discount: #DC2626;     /* price-drop red */
  --pc-whatsapp: #25D366;     /* WhatsApp community CTAs */
  --pc-whatsapp-dark: #1FAE54;

  /* ---- Semantic aliases ---- */
  --text-primary: var(--pc-ink);
  --text-secondary: var(--pc-gray-500);
  --text-muted: var(--pc-gray-400);
  --text-inverse: var(--pc-white);
  --text-link: var(--pc-blue-600);

  --surface-page: var(--pc-white);
  --surface-muted: var(--pc-gray-50);
  --surface-card: var(--pc-white);
  --surface-inverse: var(--pc-navy);
  --surface-promo: var(--pc-blue-900);

  --border-subtle: var(--pc-gray-200);
  --border-strong: var(--pc-gray-300);

  --accent: var(--pc-blue-600);
  --accent-hover: var(--pc-blue-700);
  --accent-soft: var(--pc-blue-100);
}