/* ============================================================
   GLOBAL — reset, base typographique, mise en page
   Règles communes et identiques aux 4 pages.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

img, svg { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

ul { list-style: none; }

body {
            font-family: var(--font-sans);
            font-size: 17px;
            line-height: 1.6;
            color: var(--primary);
            background: var(--white);
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

h1, h2, h3, h4 { font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; color: var(--primary); }

h1 { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 800; }

h2 { font-size: clamp(1.875rem, 3.5vw, 2.75rem); }

h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); }

h4 { font-size: 1.125rem; }

p { color: var(--muted); }

.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }

:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: var(--radius-sm); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (min-width: 901px) { .nav-mobile { display: none; } }

section { padding: var(--section-py) 0; }

.section-eyebrow {
            display: inline-block; padding: 6px 14px; background: var(--cream);
            color: var(--primary); border-radius: var(--radius-pill);
            font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
            margin-bottom: 16px;
        }

@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } }

@media (max-width: 540px) { .footer-grid { grid-template-columns: 1fr; } }