/* style de base utile pour toutes les pages*/

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
  text-decoration: none;
  list-style: none;
  scroll-behavior: smooth;
}

:root {
  --main-color: #f24f04;
  --text-color: #252429;
  --bg-color: #fffefb;
  --rr-color: #ffa50a;
  --other-color: #95949a;
  --bb-color: #fff2de;

  --big-font: 4.4rem;
  --h2-font: 3rem;
  --p-font: 1rem;
}

body {
  background: var(--bb-color);
  color: var(--text-color);
}

/* RESPONSIVE */
@media screen and (max-width: 1200px) {
  :root {
    --big-font: 3.6rem;
    --h2-font: 2.4rem;
    --p-font: 1.1rem;
  }
}

@media screen and (max-width: 1023px) {
  :root {
    --big-font: 3.2rem;
    --h2-font: 2.2rem;
    --p-font: 0.9rem;
  }
}

@media screen and (max-width: 980px) {
  :root {
    --big-font: 3rem;
    --h2-font: 1.9rem;
    --p-font: 0.8rem;
  }
}

@media screen and (max-width: 700px) {
  :root {
    --big-font: 2.9rem;
    --h2-font: 1.7rem;
    --p-font: 0.9rem;
  }
}

@media screen and (max-width: 500px) {
  :root {
    --big-font: 2.8rem;
    --h2-font: 1.5rem;
    --p-font: 0.9rem;
  }
}