/* Français avec Romain — color tokens
   Source: tailwind.config.js + globals.css + design-system/tokens/tokens.css */
:root {
  /* Brand triad (French art-de-vivre: gold / deep blue / burgundy) */
  --color-gold: #daa520;              /* primary — action, CTAs, navbar, H1 hero */
  --color-blue: #13598b;              /* secondary — trust, hover of gold, CTA band */
  --color-burgundy: #800020;          /* tertiary — premium accent, used sparingly */

  /* Tints (exact opacities used on the site) */
  --color-gold-tint-5:  rgba(218, 165, 32, 0.05);   /* hero veil */
  --color-gold-tint-10: rgba(218, 165, 32, 0.10);   /* icon chip backgrounds */
  --color-gold-tint-20: rgba(218, 165, 32, 0.20);   /* offer box on blue */
  --color-blue-tint-10: rgba(19, 89, 139, 0.10);
  --color-blue-tint-20: rgba(19, 89, 139, 0.20);    /* active testimonial ring */
  --color-burgundy-tint-10: rgba(128, 0, 32, 0.10);
  --color-white-tint-10: rgba(255, 255, 255, 0.10); /* trust badges on blue */

  /* Neutrals (Tailwind gray scale, verbatim) */
  --gray-50:  #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --gray-900: #111827;

  /* Semantic accents */
  --color-star: #facc15;         /* rating stars (yellow-400) */
  --color-alert: #ef4444;        /* −30% promo badge ONLY (red-500) */
  --color-success: #16a34a;      /* green-600 */
  --color-success-tint: #dcfce7; /* green-100 */

  /* Semantic aliases */
  --surface-page: #ffffff;
  --surface-alt: var(--gray-50);        /* alternating section background */
  --surface-card: #ffffff;
  --surface-footer: var(--gray-900);
  --surface-cta-band: var(--color-blue);
  --text-heading: var(--gray-800);
  --text-body: var(--gray-600);
  --text-muted: var(--gray-500);
  --text-default: var(--gray-900);
  --text-on-brand: #ffffff;
  --border-subtle: var(--gray-200);
  --carousel-dot-idle: var(--gray-300);

  /* Signature gradient (decorative text + reading progress only) */
  --gradient-brand: linear-gradient(135deg, var(--color-gold), var(--color-blue));
  --gradient-photo-protect: linear-gradient(to top, rgba(0,0,0,0.2), transparent); /* @kind color */
}