/* Polices locales : la page fonctionne aussi sans connexion Internet. */
@font-face { font-family: Lato; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/lato.ttf) format('truetype'); }
@font-face { font-family: Montserrat; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/montserrat.ttf) format('truetype'); }
* { box-sizing: border-box; }
html { background: #333; }
body { margin: 0; padding: 20px; color: #fff; font-family: Lato, Arial, sans-serif; }
main {
  min-height: 1120px;
  background: linear-gradient(rgba(0,0,0,.25), rgba(0,0,0,.25)), url('img/fond.jpg') center / cover no-repeat;
  text-align: center;
  padding: 120px 30px 60px;
}
.contenu { max-width: 1020px; margin: 0 auto; }
h1 {
  margin: 0;
  color: #404040;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 72px;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 4px;
  text-shadow: 2px 2px 8px rgba(66,84,101,.4);
}
.message { margin-top: 60px; font-size: 24px; line-height: 1.4; text-shadow: 2px 2px 8px rgba(0,0,0,.4); }
.message p { margin: 0 0 1.4em; }
.message p:last-child { margin-bottom: 0; }
@media (max-width: 1199px) {
  main { min-height: calc(100svh - 40px); padding-top: 100px; }
  h1 { font-size: clamp(34px, 6vw, 72px); }
}
@media (max-width: 575px) {
  body { padding: 12px; }
  main { min-height: calc(100svh - 24px); padding: 50px 18px; }
  h1 { font-size: clamp(24px, 7vw, 34px); letter-spacing: 2px; overflow-wrap: break-word; }
  .message { margin-top: 50px; font-size: 20px; }
}