/**
 * Maison & Déclic — design tokens.
 *
 * Couleurs principales : #403226 (brun profond) et #A47C68 (cuivre, accent).
 * Les autres valeurs sont des neutres chauds ou des nuances dérivées fonctionnelles.
 * Contrastes indiqués : ratio WCAG 2.2.
 */

:root {
	/* Couleurs principales */
	--md-brown: #403226;          /* fonds sombres : header, bandeau pros, footer — ivoire dessus 11,4:1 */
	--md-copper: #A47C68;         /* accent : filets, numéros, étoiles, éléments graphiques */

	/* Nuances dérivées */
	--md-brown-900: #2E241B;      /* voiles photo sur fond sombre */
	--md-copper-btn: #936B57;     /* fond des boutons cuivre — texte blanc 4,69:1 */
	--md-copper-btn-hover: #7F5B49;
	--md-copper-on-dark: #C79B78; /* accent sur fond brun — 4,93:1 */
	--md-copper-50: #FBF6F2;

	/* Neutres chauds */
	--md-ivory: #F8F6F1;
	--md-offwhite: #FBFAF7;
	--md-sand: #EAE4DA;
	--md-line: #E6DFD5;
	--md-line-strong: #8C8177;    /* bordure de champ ≥ 3:1 */
	--md-ink: #1C1B19;            /* noir doux : titres et texte */
	--md-ink-muted: #5E5651;      /* texte secondaire — 6,6:1 sur ivoire */
	--md-on-dark: #F8F6F1;
	--md-on-dark-muted: #E6DCD2;  /* 9,1:1 sur brun */

	/* Utilitaire (bouton d'envoi du formulaire, voir maquette) */
	--md-night: #13202D;

	/* États */
	--md-demo: #86591A;
	--md-demo-bg: #F5EAD6;

	/* Typographie */
	--md-font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
	--md-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--md-fs-display: clamp(2.4rem, 1.4rem + 2.9vw, 3.9rem);
	--md-fs-h2: clamp(1.75rem, 1.4rem + 1vw, 2.35rem);
	--md-fs-h3: 1.35rem;
	--md-fs-lead: 1.125rem;
	--md-fs-body: 1rem;
	--md-fs-small: 0.875rem;
	--md-fs-xs: 0.75rem;

	/* Espacements et mise en page */
	--md-pad: clamp(1.25rem, 0.2rem + 4.2vw, 4rem);
	--md-container: 90rem;
	--md-section: clamp(3.5rem, 2.5rem + 3vw, 5rem);

	/* Formes */
	--md-radius: 4px;
	--md-radius-card: 6px;
	--md-shadow-card: 0 12px 30px -14px rgb(46 36 27 / 0.3);
	--md-shadow-form: 0 24px 60px -20px rgb(0 0 0 / 0.45);

	/* Mouvement */
	--md-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--md-duration: 200ms;

	--md-target: 44px;
}

@media (prefers-reduced-motion: reduce) {
	:root { --md-duration: 0ms; }
}