/* css/tokens.css
 * Global design tokens.
 * Component-scoped overrides (e.g. .cr-roi for the dark ROI calculator) live
 * in their component CSS. This file holds defaults that apply site-wide.
 */
:root {
  /* === Brand & surface ============================ */
  --primary: #F7931A;
  --primary-rgb: 247, 147, 26;
  --accent: #6AD6FF;
  --dark: #111;
  --light: #f9f9f9;
  --bg-color: #121212; /* unified background for features & robots sections */
  --color-bg-footer: #0f0f0f;
  --color-text-muted: #777;

  /* === Spacing scale ============================= */
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;

  /* === Header / layout chrome ==================== */
  --header-height: 80px;     /* visual height of header chrome (JS may update) */
  --header-offset: 96px;     /* sticky-anchor offset (top gap + header height) */
  --footer-offset: 96px;     /* JS may update this on resize */
  --banner-pad: 2.3rem;
  --mobile-viewport-top: 0px;

  /* === Type scale ================================ */
  --fs-300: clamp(0.95rem, 0.20vw + 0.90rem, 1.00rem);
  --fs-400: clamp(1.00rem, 0.35vw + 0.92rem, 1.10rem);
  --fs-500: clamp(1.10rem, 0.55vw + 0.98rem, 1.25rem);
  --fs-600: clamp(1.25rem, 0.85vw + 1.05rem, 1.50rem);
  --fs-700: clamp(1.50rem, 1.20vw + 1.15rem, 1.90rem);
  --fs-800: clamp(1.90rem, 1.80vw + 1.35rem, 2.60rem);

  /* === Line heights ============================== */
  --lh-tight: 1.3;
  --lh-regular: 1.6;
  --lh-loose: 1.8;

  /* === Cleaning Robotics namespace =============== */
  /* Light defaults; dark variants are scoped on .cr-roi etc. */
  --cr-text: #16202b;
  --cr-muted: #5f6c7b;
  --cr-surface: #ffffff;
  --cr-surface-warm: rgba(255, 250, 243, 0.97);
  --cr-border: rgba(22, 32, 43, 0.08);
  --cr-dark: #0d131a;
  --cr-primary: #F7931A;
  --cr-primary-rgb: 247, 147, 26;
  --cr-radius: 1.5rem;
  --cr-radius-sm: 0.85rem;
}