/* ══ OVERLAY ══ */
.modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  overflow-y: auto;
  background: rgba(13,27,42,.97);
  padding: 60px var(--px) 80px;
}

.modal.active {
  display: block;
}

/* ══ BOÎTE DE CONTENU ══ */
.modal-box {
  max-width: 720px;
  margin: 0 auto;
}

/* ══ BOUTON RETOUR ══ */
.modal-close {
  font-family: 'Lexend Zetta', sans-serif;
  font-size: 10px;
  font-weight: 200;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--beige);
  opacity: .45;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  margin-bottom: 48px;
  display: block;
  transition: opacity .25s;
}

.modal-close:hover {
  opacity: 1;
}

/* ══ TITRES ══ */
.modal-box h2 {
  font-family: 'Lexend Zetta', sans-serif;
  font-size: 13px;
  font-weight: 200;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 36px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--bord-lt);
}

.modal-box h3 {
  font-family: 'Lexend Zetta', sans-serif;
  font-size: 10px;
  font-weight: 200;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--red);
  margin: 32px 0 12px;
}

/* ══ TEXTE ══ */
.modal-box p,
.modal-box li {
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  color: var(--beige);
  opacity: .72;
  line-height: 1.85;
  margin-bottom: 10px;
}

.modal-box ul {
  padding-left: 20px;
  margin-bottom: 10px;
}

.modal-box li {
  margin-bottom: 6px;
}

.modal-box strong {
  color: var(--white);
  opacity: 1;
  font-weight: 400;
}