/* ===== RESET ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ===== BASE PAGE ===== */
html, body {
  width: 100%;
  height: 100%;
}

body {
  display: flex;
  justify-content: center;
  align-items: center;

  /* BACKGROUND IMAGE */
  background-image: url("./assets/images/background/background_index2.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-color: #000;

  color: #f2f2f2;
  font-family: system-ui, Arial, sans-serif;
}

/* ===== CONTENEUR MENU ===== */
.menu {
  width: min(900px, 92vw);
  padding: 52px;

  background-color: rgba(0, 0, 0, 0.6);
  border: 1px solid #2b2b2b;
  border-radius: 18px;

  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.75);
}

/* ===== TITRE ===== */
.title {
  font-family: "Rubik Dirt", system-ui, sans-serif;
  font-size: 72px;
  letter-spacing: 8px;
  text-transform: uppercase;

  color: #f2f2f2;

  text-shadow:
    2px 2px 0 #000,
    -2px -2px 0 #000,
    6px 6px 14px rgba(0, 0, 0, 0.9);
}

/* ===== SLOGAN ===== */
.subtitle {
  margin: 18px 0 44px;

  font-family: "Metal Mania", cursive;
  font-size: 28px;

  color: #d6d6d6;

  text-shadow:
    1px 1px 0 #000,
    3px 3px 10px rgba(0, 0, 0, 0.85);
}

/* ===== ZONE BOUTONS ===== */
.buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* ===== BOUTONS ===== */
button {
  font-family: "Rubik Dirt", system-ui, sans-serif;
  font-size: 20px;
  letter-spacing: 2px;
  text-transform: uppercase;

  padding: 14px 30px;

  border-radius: 12px;
  border: 1px solid #3a3a3a;

  background: linear-gradient(180deg, #151515, #0d0d0d);
  color: #f2f2f2;

  cursor: pointer;

  text-shadow: 1px 1px 0 #000;

  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

/* ===== SURVOL ===== */
button:hover {
  transform: scale(1.05);

  background: linear-gradient(180deg, #262626, #141414);
  border-color: #6a6a6a;

  color: #b7410e;

  text-shadow:
    1px 1px 0 #000,
    0 0 6px rgba(183, 65, 14, 0.6);
}

/* ===== CLIC ====*