/* Canonical brand values. Reference: docs/charte-graphique.md. */
:root {
    --mpb-color-bordeaux: #9b2f45;
    --mpb-color-encre: #474746;
    --mpb-color-texte: #5f5f5d;
    --mpb-color-texte-discret: #737371;
    --mpb-color-rose: #f6dce0;
    --mpb-color-peche: #fce2d2;
    --mpb-color-sauge: #e2ece1;
    --mpb-color-trait: #ebdcda;
    --mpb-color-sur-bordeaux: #ffffff;
    --mpb-color-fond: #ffffff;
    --mpb-color-fond-poudre: #fbf5f3;
    --mpb-color-gris-bouton: #f3eeec;

    --font-body: "Mulish", sans-serif;
    --font-heading: var(--font-body);
    --font-display: var(--font-body);
    --font-handwritten: "Nothing You Could Do", cursive;
    --font-sans: var(--font-body);
    --font-serif: var(--font-heading);
    --font-editorial: var(--font-display);

    --mpb-font-weight-title: 200;
    --mpb-font-weight-body: 300;
    --mpb-font-weight-strong: 600;
    --mpb-font-size-hero: 62px;
    --mpb-font-line-hero: 1.18;
    --mpb-font-size-section: 44px;
    --mpb-font-line-section: 1.25;
    --mpb-font-size-block: 20px;
    --mpb-font-line-block: 1.3;
    --mpb-font-size-step: 56px;
    --mpb-font-line-step: 1;
    --mpb-font-size-lead: 19px;
    --mpb-font-line-lead: 1.7;
    --mpb-font-size-body: 17px;
    --mpb-font-line-body: 1.65;
    --mpb-font-size-small: 15px;
    --mpb-font-line-small: 1.6;
    --mpb-font-size-caption: 13px;
    --mpb-font-line-caption: 1.5;
    --mpb-font-size-label: 13px;
    --mpb-font-line-label: 16px;
    --mpb-font-tracking-label: .16em;
    --mpb-font-size-button: 13px;
    --mpb-font-line-button: 16px;
    --mpb-font-tracking-button: .07em;
    --mpb-font-size-handwritten: 1.12em;
    --mpb-font-size-name: 38px;
    --mpb-font-line-name: 1.15;

    --mpb-space-1: 4px;
    --mpb-space-2: 8px;
    --mpb-space-3: 14px;
    --mpb-space-4: 24px;
    --mpb-space-5: 40px;
    --mpb-space-6: 56px;
    --mpb-space-7: 64px;
    --mpb-space-8: 104px;
    --mpb-radius-photo-petite: 18px;
    --mpb-radius-photo: 24px;
    --mpb-radius-pilule: 999px;
    --mpb-radius-rond: 50%;
    --mpb-content-max: 1240px;
    --mpb-gutter: var(--mpb-space-7);
    --mpb-section-space: var(--mpb-space-8);
}

@media (max-width: 767px) {
    :root {
        --mpb-gutter: var(--mpb-space-4);
        --mpb-section-space: 72px;
    }
}