:root {
    --color-white: #7c2a00;
    --color-black: #5c0700;
    --color-light: #ffb5af;
    --color-dark: #d95005;

    --weight-h1: 100;
    --weight-h2_h4: 900;
    --weight-text: 400;

    --size-h1: 150px;
    --size-h2_h4: 50px;
    --size-text: 12px;

	/* === Boutons === */
    --button-color: #831100;
    --button-hover-color: #831100;
    --button-border-radius: 13px;
}

/* ========== Styles de base ========== */

body {
    font-family: "Devonshire", sans-serif;
    font-weight: var(--weight-text);
    font-size: var(--size-text);
    color: var(--color-black);
    background: var(--color-white);
}

h1 {
    font-family: Arial, sans-serif;
    font-weight: var(--weight-h1);
    font-size: var(--size-h1);
    color: var(--color-dark);
}

h2, h3, h4 {
    font-family: "Boldonse", sans-serif;
    font-weight: var(--weight-h2_h4);
    font-size: var(--size-h2_h4);
    color: var(--color-black);
}

p, li {
    color: var(--color-black);
}

a {
    color: var(--color-dark);
    text-decoration: underline;
}

a:hover {
    color: var(--color-light);
    text-decoration: none;
}

/* ========== Boutons ========== */

.button,
.wp-block-button__link,
.banner-button {
    display: inline-block;
    padding: 12px 25px;
    background: var(--button-color);
    color: #fff;
    border-radius: var(--button-border-radius);
    text-decoration: none;
    transition: background 0.3s;
}

.button:hover,
.wp-block-button__link:hover,
.banner-button:hover {
    background: var(--button-hover-color);
    color: #fff;
}