/* ==========================================================================
   RIVAL Shoes - Design Tokens
   Premium B2B Luxury Shoe Design
   ========================================================================== */

:root {
  /* ---- Colors ---- */
  --color-black: #000000;
  --color-white: #ffffff;
  --color-off-white: #f5f5f5;
  --color-gray-100: #e8e8e8;
  --color-gray-200: #d0d0d0;
  --color-gray-300: #a0a0a0;
  --color-gray-400: #666666;
  --color-gray-500: #333333;
  --color-gray-600: #222222;
  --color-gray-700: #111111;
  --color-accent: #cd8013;
  --color-accent-hover: #b57010;
  --color-error: #c0392b;
  --color-success: #27ae60;

  /* ---- Typography ---- */
  --font-primary: 'Josefin Sans', sans-serif;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ---- Spacing ---- */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 6rem;
  --space-2xl: 8rem;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --container-wide: 1400px;
  --header-height: 80px;
  --ticker-height: 36px;

  /* ---- Transitions ---- */
  --ease-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
  --duration-fast: 0.2s;
  --duration-normal: 0.4s;
  --duration-slow: 0.8s;

  /* ---- Shadows ---- */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.16);
}