/* ═══════════════════════════════════════════════════════
 MonCanevas — Reset & Base Typography
 ═══════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 100%; scroll-behavior: smooth; }
body {
 font-family: var(--font-body);
 font-size: var(--text-base);
 line-height: 1.6;
 color: var(--laine-noire);
 background: var(--toile-ecru);
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font: inherit; }
ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6 {
 font-family: var(--font-display);
 line-height: 1.15;
 color: var(--laine-noire);
}
h1 { font-size: var(--text-3xl); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); }
code, pre, .mono {
 font-family: var(--font-mono);
 font-size: var(--text-sm);
}
::selection {
 background: var(--dmc-garance);
 color: var(--laine-blanche);
}
/* ═══════════════════════════════════════════════════════════════════
 MonCanevas — "La Grille" v3 Design System
 DMC Laine Colbert tapestry wool · Bazi-adjusted palette
 Grid 10×10 structural device · Geometric SVG icons
 ═══════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&family=Space+Grotesk:wght@400;500;600&family=JetBrains+Mono:wght@400;700&display=swap&subset=latin,latin-ext');
:root {
 
 --dmc-garance: #8B2E2E; 
 --dmc-vermillon: #C44536; 
 --dmc-rouge: #B22222; 
 --dmc-sauge: #5A7A5A; 
 --dmc-olive: #6B7B3A; 
 --dmc-moutarde: #C4A43E; 
 --toile-ecru: #F2EEE6; 
 --laine-noire: #1C1C1C; 
 --laine-blanche: #FFFFFF; 
 --laine-pierre: #6B6560; 
 
 --font-display: 'DM Serif Text', Georgia, 'Times New Roman', serif;
 --font-body: 'Space Grotesk', system-ui, -apple-system, sans-serif;
 --font-mono: 'JetBrains Mono', 'Courier New', monospace;
 --text-xs: 0.7rem;
 --text-sm: 0.875rem;
 --text-base: 1rem;
 --text-lg: 1.25rem;
 --text-xl: 1.563rem;
 --text-2xl: 1.953rem;
 --text-3xl: 2.441rem;
 
 --space-1: 0.625rem; 
 --space-2: 1.25rem; 
 --space-3: 2.5rem; 
 --space-4: 3.75rem; 
 --space-5: 5rem; 
 --max-width: 72rem; 
 
 --border-bold: 3px solid var(--laine-noire);
 --border-thin: 1px solid var(--dmc-olive);
 
 --radius-sm: 2px;
 --radius-md: 4px;
 --radius-lg: 8px;
 
 --shadow-card: 2px 2px 0 var(--laine-noire);
 --shadow-cta: 3px 3px 0 var(--dmc-garance);
 --shadow-lg: 4px 4px 0 var(--dmc-garance);
 
 --ease: cubic-bezier(0.4, 0, 0.2, 1);
 --fast: 150ms;
 --slow: 400ms;
 
 --bleu: #1E3A5F; 
 --blanc: #FFFFFF; 
 --pierre: #6B6560; 
 --terracotta:#C4553D; 
 --fil: #D4CFC6; 
 --encre: #1C1C1C; 
 --sauge: #5A7A5A; 
 --laine: #FAF7F2; 
 
 --space-xs: 0.4rem; 
 --space-sm: 0.8rem; 
 --space-md: 1.5rem; 
 --space-lg: 3rem; 
 --space-xl: 4rem; 
 --space-2xl: 6rem; 
 --space-3xl: 8rem; 
 --space-0: 0; 
 --error: #C44536; 
 --canvas: #F2EEE6; 
}
