:root {
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "Fira Code", "Courier New", monospace;
  --color-text: #3B2F2F;/*Dark brown*/
  --color-bg: #fff;
  --color-accent: #0073e6;
  --primary-color: #ed7014;
  --primary-color-alt: #be5504;
  --orange-light: #FFB06B;
  --orange-mid: #FF8C42;
  --orange-dark: #E66A00;
  --blue: #094463;;
  --contact-form-bg: #fff9f4;
  --max-width: 1200px;
  --max-width-1: 450px
  --gutter: 1rem;
  --line-height: 1.6;
  --transition: 0.2s ease-in-out;
  /* #094463;
     #878787;
 #f3bd48;
 #c6c6c6;

  /* Layout */
  --max-width-1: 500px;
  --line-height: 1.6;
  --transition: 0.2s ease-in-out;
  /* Spacing scale (1rem = 16px base) */
  /* Fine pixel control */
  --px-1: 0.0625rem;
  /* 1px */
  --px-2: 0.125rem;
  /* 2px */
  --px-3: 0.1875rem;
  /* 3px */
  /* Core spacing scale */
  --px-4: 0.25rem;
  /* 4px  */
  --px-8: 0.5rem;
  /* 8px  */
  --px-16: 1rem;
  /* 16px */
  --px-24: 1.5rem;
  /* 24px */
  --px-32: 2rem;
  /* 32px */
  --px-48: 3rem;
  /* 48px */
  --px-64: 4rem;
  /* 64px *


 /* Body text */
  --font-body: clamp(14px, 1vw + 0.5rem, 18px);

  /* Small text */
  --font-size-1: clamp(20px, 1.2vw + 0.25rem, 23px);

  /* Small text */
  --font-size-2: clamp(12px, 0.8vw + 0.25rem, 16px);

  /* H6 */
  --font-h6: clamp(16px, 1vw + 0.75rem, 20px);

  /* H5 */
  --font-h5: clamp(18px, 1.2vw + 0.75rem, 24px);

  /* H4 */
  --font-h4: clamp(20px, 1.5vw + 1rem, 28px);

  /* H3 */
  --font-h3: clamp(24px, 2vw + 1rem, 36px);

  /* H2 */
  --font-h2: clamp(28px, 2.5vw + 1rem, 48px);

  /* H1 */
  --font-h1: clamp(32px, 4vw + 1rem, 64px);