/* Comm'une Couleur Landing Page - Colors & design tokens

1. Variables (couleurs + z-index)
2. Elements

/*------------------------------------------------------------------------------------------*/
/* 1. Variables */
/*------------------------------------------------------------------------------------------*/

:root {
    /* Échelle de z-index — utiliser ces variables plutôt que des valeurs en dur */
    --z-behind: -1;
    --z-base: 1;
    --z-floating: 10;
    --z-sticky: 100;
    --z-overlay: 1000;
    --z-modal: 10000;
    --z-toast: 100000;

    --white: #fff;
    --black:#111;
    --light:#f5f5f5;
    --gray:#333;
    --gray-light:#999;
    --primary: #c0ae7e;
}

/*------------------------------------------------------------------------------------------*/
/* 2. Elements */
/*------------------------------------------------------------------------------------------*/

body {
    background: var(--white);
}

a,
a:hover,
#header.nav-solid nav a:hover,
#header.nav-solid .active,
.la-ball-triangle-path,
.icon i,
.button:hover,
input[type="submit"]:hover,
#banner .button:hover {
    color: var(--primary);
}

.pricing-block-content:hover,
#banner .section-heading:before,
#header.nav-solid .active,
.testimonial.classic footer:before,
.primary-color,
.section-heading h2:after,
.featured .pricing {
    background: var(--primary);
}

body,
#banner h1,
#banner h2,
.section-title,
.testimonial.classic q,
.testimonial.classic footer,
h1,
h2,
h3,
h4,
h5,
h6,
#header nav a,
#header i,
.button,
input[type="submit"],
#banner .button {
    color: var(--black);
}

#header.nav-solid,
#header.nav-solid a,
#header.nav-solid i,
#nav-mobile ul li a {
    color: var(--gray)
}

.primary-color,
.primary-color .icon i,
.primary-color i,
.primary-color .section-title,
.primary-color .section-subtitle,
#header.nav-solid .active,
.featured .pricing,
.featured .pricing p {
    color: var(--white);
}

.secondary-color {
    background-color: var(--light);
}

.button,
input[type="submit"],
#banner .button  {
    border-color: var(--black);
}

.button:hover,
#banner .button:hover,
input[type="submit"]:hover {
    border-color: var(--primary);
}

.section-subtitle,
#landing-footer,
#landing-footer p,
#landing-footer a,
#landing-footer i {
    color: var(--gray-light);
}