/* ---------------------------------------------------------------
   Color — extracted from the Mariana França logo (brief, verbatim hexes)
   --------------------------------------------------------------- */

:root {
  /* Brand primitives */
  --green-forest: #3D6B5D;   /* dark — headings, primary CTA, wordmark */
  --green-forest-dark: #2C5346; /* pressed/hover-darken of forest */
  --green-mint: #5A9B7F;     /* medium — hover states, borders, secondary */
  --green-lime: #A4C639;     /* light accent — tagline, highlights, small pops */
  --green-lime-dark: #8CAA2E;

  --white: #FFFFFF;
  --gray-50: #F5F5F5;   /* secondary backgrounds, cards */
  --gray-200: #E4E4E4;  /* hairline borders */
  --gray-400: #999999;  /* secondary text, placeholders */
  --gray-700: #333333;  /* primary body text, headings on light */
  --black: #1A1A1A;

  /* Semantic aliases — use these in product code */
  --color-bg-page: var(--white);
  --color-bg-surface: var(--white);
  --color-bg-surface-muted: var(--gray-50);
  --color-bg-inverse: var(--green-forest);

  --color-text-primary: var(--gray-700);
  --color-text-secondary: var(--gray-400);
  --color-text-heading: var(--green-forest);
  --color-text-on-brand: var(--white);
  --color-text-link: var(--green-forest);
  --color-text-link-hover: var(--green-mint);

  --color-border: var(--gray-200);
  --color-border-strong: var(--green-mint);

  --color-brand-primary: var(--green-forest);
  --color-brand-primary-hover: var(--green-forest-dark);
  --color-brand-secondary: var(--green-mint);
  --color-brand-secondary-hover: var(--green-forest);
  --color-brand-accent: var(--green-lime);
  --color-brand-accent-hover: var(--green-lime-dark);

  --color-focus-ring: var(--green-mint);
  --color-success: var(--green-mint);
  --color-overlay: rgba(26, 41, 36, 0.55);
}