/**
 * Design tokens.
 *
 * Carried over verbatim from the React front end (src/styles/globals.css and
 * src/data/constants.js) so colour values stay identical.
 */

:root {
	--primary-red: #C0392B;
	--accent-red: #E74C3C;
	--deep-red: #922B21;
	--gold: #D4AF37;
	--light-gold: #F5E6A3;
	--dark-gold: #B8860B;
	--skin-light: #FFFFFF;
	--skin-warm: #F9F9F9;
	--skin-medium: #F0F0F0;
	--cream: #FFFFFF;
	--white: #FFFFFF;
	--charcoal: #2C2C2C;
	--muted: #596566;
	--light-text: #BDC3C7;
	--accent-green: #27AE60;
	--accent-orange: #E67E22;

	/* Chrome measurements taken from the React layout. */
	--nav-height: 72px;
	--page-gutter: 5vw;
	--content-max: 1200px;

	/* Motion values mirroring the framer-motion variants. */
	--ease-out-soft: cubic-bezier(0.25, 0.1, 0.25, 1);
	--reveal-duration: 0.7s;
	--reveal-distance: 60px;
	--stagger-step: 0.15s;
	--stagger-delay: 0.2s;
}