body { background-color:#E8D8BC; color:#182039; margin:0; padding:0; }

.entrance-animation{
  position: fixed;
  inset: 0;
  /* background:#182039;  */
  z-index: 9999;
  overflow: hidden;
  perspective-origin: 50% 50%;
  perspective: 1200px;
}

/* les deux SVG superposés */
.envelope-base,
.envelope-top{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

/* on cache le #top du SVG base (il sera animé par le 2e SVG) */
.envelope-base #top{ opacity:0; }

/* le rabat animé (HTML) : charnière en bas-centre */
.envelope-top{
  transform-origin: 50% 0;
  transform-style: preserve-3d;
  will-change: transform;
}

/* header / main révélés après l’ouverture */
header, main{
  opacity:0;
  transform: translateY(12px);
  transition: opacity .3s ease, transform .3s ease;
}

/* ton CSS nav etc. inchangés */


header {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
}

nav ul {
    display: flex;
    list-style-type: none;
}

nav ul li:not(:last-child) {
    padding-right: 30px;
}