/* ==========================================================================
   Pablo's Clean Up Services LLC — Design Tokens
   Colors sampled directly from the approved PCS logo.
   ========================================================================== */

:root {
  /* Brand colors — sampled from logo */
  --pcs-green: #0B6E12;
  --pcs-green-dark: #054A0C;
  --pcs-green-light: #3FA84C;
  --pcs-orange: #F97D02;
  --pcs-orange-dark: #D96700;
  /* Accessible variants — used wherever text or focus indicators sit
     directly on/against the orange (WCAG AA requires 4.5:1 for text,
     3:1 for focus outlines/graphics). The original --pcs-orange stays
     available for decorative uses where no white text sits on top of it. */
  --pcs-orange-accessible: #A85401;
  --pcs-orange-accessible-dark: #8A4501;
  --pcs-orange-accessible-light: #B25901;

  /* Neutrals */
  --pcs-black: #121212;
  --pcs-near-black: #1A1A1A;
  --pcs-white: #FFFFFF;
  --pcs-gray-50: #F7F7F5;
  --pcs-gray-100: #EEEEEC;
  --pcs-gray-300: #C9C9C6;
  --pcs-gray-600: #55564F;
  --pcs-gray-900: #232420;

  /* Semantic aliases */
  --color-bg: var(--pcs-white);
  --color-bg-alt: var(--pcs-gray-50);
  --color-bg-dark: var(--pcs-black);
  --color-text: var(--pcs-near-black);
  --color-text-muted: var(--pcs-gray-600);
  --color-text-on-dark: var(--pcs-white);
  --color-primary: var(--pcs-green);
  --color-primary-dark: var(--pcs-green-dark);
  --color-accent: var(--pcs-orange-accessible);
  --color-accent-dark: var(--pcs-orange-accessible-dark);
  --color-border: var(--pcs-gray-100);

  /* Typography */
  --font-display: 'Oswald', 'Arial Narrow', sans-serif;
  --font-body: 'Work Sans', 'Segoe UI', Arial, sans-serif;

  --fs-h1: clamp(2.25rem, 4vw + 1rem, 3.75rem);
  --fs-h2: clamp(1.75rem, 2.4vw + 1rem, 2.5rem);
  --fs-h3: clamp(1.25rem, 1.2vw + 1rem, 1.5rem);
  --fs-body-lg: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;

  --lh-tight: 1.15;
  --lh-normal: 1.5;
  --lh-loose: 1.7;

  /* Spacing scale (8px base) */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: 8rem;

  /* Layout */
  --container-max: 1200px;
  --container-pad: var(--space-3);
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;

  /* Motion */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-normal: 250ms;

  /* Elevation */
  --shadow-sm: 0 1px 3px rgba(18, 18, 18, 0.08);
  --shadow-md: 0 6px 20px rgba(18, 18, 18, 0.12);
  --shadow-lg: 0 16px 40px rgba(18, 18, 18, 0.18);

  /* Header height (used for sticky offset / scroll-margin) */
  --header-height: 92px;
  --header-height-mobile: 68px;
}