/* ============================================================
   Lagrange, la page de ce qui manque.
   Memes jetons que styles.css, meme bascule jour / nuit.
   Le HTML de cette page est ecrit par outils/construire.py.
   ============================================================ */

.bar__mark { color: inherit; text-decoration: none; }

.afaire {
  padding: calc(var(--barh) + 10vh) var(--pad) 6vh;
  max-width: 56rem;
}

.afaire__titre {
  font-family: var(--display);
  font-variation-settings: 'wdth' 124, 'wght' 800;
  font-size: clamp(2.8rem, 9vw, 6.5rem);
  line-height: .9; letter-spacing: -.03em; text-transform: uppercase;
  margin: 0 0 1.6rem; text-shadow: var(--glow);
}

.afaire__lede p {
  font-size: clamp(1.05rem, 1.2vw + .7rem, 1.35rem);
  max-width: 40ch; margin: 0 0 1rem;
}

.afaire__compte {
  font-family: var(--mono); font-size: .74rem; color: var(--dim);
  border-left: 1px solid var(--rule); padding-left: 1rem;
  margin: 2.4rem 0 0; max-width: 46ch; line-height: 1.7;
}

.afaire__bloc {
  margin-top: 10vh; border-top: 1px solid var(--rule); padding-top: 2.4rem;
}
.afaire__bloc > h2.eyebrow { font-weight: 400; }
.afaire__bloc > p { max-width: 46ch; color: var(--dim); margin: 0 0 2.4rem; }

/* --- une nuit et ses trous --- */
.nuit {
  border-left: 1px solid var(--beam);
  padding: .2rem 0 .4rem 1.2rem; margin: 0 0 3rem; max-width: 44rem;
}
.nuit__quand {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--beam); margin: 0 0 .5rem;
}
.nuit__titre {
  font-family: var(--display);
  font-variation-settings: 'wdth' 112, 'wght' 700;
  font-size: clamp(1.6rem, 4vw, 2.6rem); line-height: .98;
  letter-spacing: -.02em; text-transform: uppercase; margin: 0 0 .4rem;
}
.nuit__ou { font-family: var(--mono); font-size: .72rem; color: var(--dim); margin: 0 0 1.2rem; }

.manque { margin: 0; }
.manque dt {
  font-family: var(--mono); font-size: .68rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--dim); margin: 1rem 0 .3rem;
}
.manque dt:first-child { margin-top: 0; }
.manque dd { margin: 0 0 .4rem; max-width: 48ch; }
.manque dd b { font-weight: 600; }

.nuit__piste {
  font-family: var(--mono); font-size: .74rem; color: var(--text);
  margin: 1.4rem 0 0; line-height: 1.7; max-width: 48ch;
}
.nuit__piste span {
  color: var(--beam); letter-spacing: .1em; text-transform: uppercase; margin-right: .6rem;
}

/* --- les noms --- */
.noms, .mur-sans { list-style: none; margin: 0; padding: 0; }

.nom { border-top: 1px solid var(--rule); padding: 1.2rem 0; max-width: 44rem; }
.nom:first-child { border-top: none; padding-top: 0; }
.nom__titre {
  font-family: var(--display);
  font-variation-settings: 'wdth' 106, 'wght' 640;
  font-size: clamp(1.3rem, 3vw, 2rem); text-transform: uppercase;
  letter-spacing: -.015em; margin: 0 0 .2rem;
  display: flex; gap: .7rem; align-items: baseline; flex-wrap: wrap;
}
.nom__type {
  font-family: var(--mono); font-size: .62rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--dim);
  border: 1px solid var(--rule); border-radius: 999px; padding: .2rem .6rem;
}
.nom__variantes { font-family: var(--mono); font-size: .72rem; color: var(--dim); margin: 0 0 .6rem; }
.nom p:last-child { margin: 0; max-width: 48ch; }

.mur-sans li { border-top: 1px solid var(--rule); padding: .9rem 0; max-width: 44rem; }
.mur-sans li:first-child { border-top: none; padding-top: 0; }
.mur-sans b {
  font-family: var(--display);
  font-variation-settings: 'wdth' 106, 'wght' 640;
  font-size: clamp(1.15rem, 2.4vw, 1.6rem); text-transform: uppercase;
  letter-spacing: -.015em; font-weight: normal; display: block; margin-bottom: .15rem;
}
.mur-sans span { color: var(--dim); font-size: .92rem; }
.mur-sans__col {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--dim); margin: 2.4rem 0 1rem;
}

/* --- pied --- */
.afaire__pied { display: block; }
.afaire__pied p { max-width: 46ch; }

@media (max-width: 720px) {
  .afaire { padding-top: calc(var(--barh) + 6vh); }
  .nuit { margin-bottom: 2.4rem; }
}