/*
 * Brand design tokens for Mi Astróloga de Cabecera.
 * Colors sampled directly from docs/servicios.jpg (navy service banners,
 * gold ornamental borders/title, cream card background) and cross-checked
 * against docs/instagram_assets/instagram_header.jpeg.
 *
 * Dark theme: semantic roles below invert light-on-dark (dark navy
 * background, cream text, gold accents) rather than the original
 * cream-background/navy-text pairing. The underlying palette primitives
 * (--color-navy, --color-cream, etc.) are unchanged — only which role each
 * one plays was reassigned, so components that reference a semantic role
 * (--color-background, --color-text, ...) adapt automatically.
 */

:root {
  /* Palette */
  --color-navy: #1e3a5c;
  --color-navy-dark: #142944;
  --color-gold: #98885c;
  --color-gold-light: #c9b98f;
  --color-gold-dark: #7d6f49;
  --color-cream: #f8f0e8;
  --color-white: #ffffff;

  /* Semantic roles */
  --color-background: var(--color-navy-dark);
  --color-surface: var(--color-navy);
  --color-text: var(--color-cream);
  --color-heading: var(--color-cream);
  --color-accent: var(--color-gold);
  --color-border: var(--color-gold-light);

  /* One gold tone for every gold surface — header/footer band, primary
     buttons, pricing pills — always with white text (4.95:1, AA at every
     size). --color-gold / --color-gold-light remain foreground-only roles
     (--color-accent, --color-border) against the dark navy page. */
  --color-header-bg: var(--color-gold-dark);
  --color-header-text: var(--color-white);

  /* Typography */
  --font-heading: 'Cormorant Garamond', serif;
  --font-body: 'Nunito', sans-serif;
}