/*
 * Design tokens — single source of truth for the LGV brand.
 * Every other stylesheet references these custom properties instead of
 * hard-coding colours, fonts, spacing, radius or shadows.
 */

:root {
	/* Brand palette */
	--color-ink: #232326;            /* near-black: footer background, nav text */
	--color-ink-soft: #4d4d52;
	--color-text: #252626;           /* default body / card copy */
	--color-text-muted: #555;
	--color-text-faint: #444;
	--color-heading: #7c7c7c;        /* legacy h2 grey */

	--color-brand-green: #89b63f;
	--color-brand-teal: #21a0a0;
	--color-brand-teal-dark: #187a7a;
	--color-brand-gold: #f0b44d;
	--color-taupe: #c8c2b5;

	--color-surface: #fff;
	--color-surface-muted: #f4faf9;  /* card detail rows */
	--color-surface-chip: #eef6f5;   /* kicker / contact chips */
	--color-surface-soft: #ededed;
	--color-surface-tint-green: #edf3e5;

	--color-border: rgba(33, 160, 160, 0.22);
	--color-border-strong: rgba(33, 160, 160, 0.30);
	--color-hairline: rgba(35, 35, 38, 0.10);
	--color-ring: var(--color-brand-teal);

	/* Call-to-action button */
	--color-action: #0073aa;
	--color-action-hover: #005885;

	/* Brand gradients */
	--gradient-brand: linear-gradient(90deg, var(--color-brand-green), var(--color-brand-teal));
	--gradient-brand-tri: linear-gradient(90deg, var(--color-brand-green), var(--color-brand-teal), var(--color-brand-gold));

	/* Typography */
	--font-heading: 'Montserrat', sans-serif;
	--font-body: 'Montserrat Light', sans-serif;
	--font-size-base: 16px;
	--line-height-base: 1.5;

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

	/* Radius */
	--radius: 8px;
	--radius-pill: 999px;

	/* Shadows */
	--shadow-card: 0 18px 45px rgba(37, 38, 38, 0.12);
	--shadow-card-hover: 0 26px 60px rgba(37, 38, 38, 0.18);
	--shadow-overlay: 0 22px 55px rgba(37, 38, 38, 0.18);
	--shadow-overlay-hover: 0 30px 75px rgba(37, 38, 38, 0.24);

	/* Layout */
	--container: 1170px;
	--container-content: 1120px;

	/* Motion */
	--ease: 180ms ease;
	--ease-media: 220ms ease;
	--touch-target: 44px;
}