/* ============================================================
   RESILIO PADEL — COLOR TOKENS
   Base values are exact hex/rgb pulled from the Figma file's
   logo lockups, colour-swatch frame and "Colors" variable
   collection (Primary / Base / Base-Black). Never rounded.
   ============================================================ */

:root {
  /* ---- Base palette (literal brand values) ---- */
  --rp-black: #000000;
  --rp-white: #FFFFFF;
  --rp-teal-900: #0E2E33;      /* deep teal — logo lockup background */
  --rp-lime-500: #C6F03C;      /* electric lime — icon mark / accent */
  --rp-orange-500: #FF5100;    /* brand primary — CTAs, accents */
  --rp-orange-600: #DC3500;    /* brand primary, hover/pressed */
  --rp-gray-200: #D9D9D9;      /* neutral — moodboard swatch */

  /* ---- Semantic aliases ---- */
  --color-bg-page: var(--rp-white);
  --color-bg-inverse: var(--rp-black);
  --color-bg-brand: var(--rp-teal-900);
  --color-bg-surface: var(--rp-white);
  --color-bg-surface-muted: var(--rp-gray-200);

  --color-accent-primary: var(--rp-orange-500);
  --color-accent-primary-hover: var(--rp-orange-600);
  --color-accent-secondary: var(--rp-lime-500);

  --color-text-primary: var(--rp-black);
  --color-text-oninverse: var(--rp-white);
  --color-text-onbrand: var(--rp-white);
  --color-text-onaccent: var(--rp-white);
  --color-text-muted: rgba(0,0,0,0.5);

  --color-border: var(--rp-black);
  --color-border-onbrand: var(--rp-white);

  /* Link colors (semantic default — no links defined in source) */
  --color-link: var(--rp-orange-500);
  --color-link-hover: var(--rp-orange-600);
}