.soleil::before {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(rgb(0 0 0 / 80%), rgb(0 0 0 / 80%)),
    url("images/le-soleil.png") center / cover no-repeat;
  pointer-events: none;
}

.soleil-contenu {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 28px;
  min-height: 100vh;
  min-height: 100svh;
  padding: max(32px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(32px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));
}

.soleil .citation {
  width: 100%;
  max-width: 400px;
  margin: 0;
  font-size: clamp(12px, 3.3vw, 15px);
  line-height: 1.8;
  animation: apparition 1.6s ease-out both;
}
.soleil .citation p + p { margin-top: 16px; }

.encart-logos {
  width: 100%;
  max-width: 400px;
  padding: 24px 16px 22px;
  overflow: hidden;
  border-radius: 2px;
  color-scheme: light;
  background: #fff;
  color: #111;
  animation: apparition .6s ease-out 1.4s both;
}
.logos-principaux {
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 9px;
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  animation: surgissement-logo .48s ease-out both;
  animation-delay: calc(2s + var(--ordre, 0) * .09s);
}
.logo img { display: block; object-fit: contain; width: 32px; height: 32px; }
.logo span { font: 10px/1.2 Arial, sans-serif; white-space: nowrap; }
.logos-principaux .logo img { width: 43px; height: 43px; }
.logos-principaux .logo:nth-child(2) img { width: 57px; height: 45px; }
.logos-principaux .logo:nth-child(3) { transform: translateY(-5px); }
.logos-principaux .logo:nth-child(4) { transform: translateY(5px); }
.logos-secondaires {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  column-gap: 17px;
  row-gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.logos-secondaires .logo:nth-child(1) { transform: rotate(-7deg) translateY(3px); }
.logos-secondaires .logo:nth-child(1) img { width: 37px; height: 37px; }
.logos-secondaires .logo:nth-child(2) { transform: translateY(-6px); }
.logos-secondaires .logo:nth-child(2) img { width: 23px; height: 23px; }
.logos-secondaires .logo:nth-child(3) { transform: rotate(8deg); }
.logos-secondaires .logo:nth-child(4) img { width: 42px; height: 30px; }
.logos-secondaires .logo:nth-child(5) { transform: translateY(5px); }
.logos-secondaires .logo:nth-child(5) img { width: 25px; height: 25px; }
.logos-secondaires .logo:nth-child(6) { transform: rotate(-5deg); }
.logos-secondaires .logo:nth-child(7) { transform: translateY(-3px); }
.logos-secondaires .logo:nth-child(7) img { width: 34px; height: 28px; }
.logos-secondaires .logo:nth-child(8) img { width: 27px; height: 27px; }
.logos-secondaires .logo:nth-child(9) { transform: rotate(7deg); }
.logos-secondaires .logo:nth-child(10) { transform: translateY(4px); }
.logos-secondaires .logo:nth-child(10) img { width: 40px; height: 28px; }
.logos-secondaires .logo:nth-child(11) { transform: rotate(-6deg); }
.fonts-pending .soleil .citation, .fonts-pending .encart-logos,
.fonts-pending .logo { opacity: 0; animation: none; }

@keyframes surgissement-logo {
  0% {
    opacity: 0;
    translate: var(--entree-x, 0px) var(--entree-y, 100px);
    scale: .45;
  }
  12% { opacity: 1; }
  65% { opacity: 1; translate: 0 0; scale: 1.12; }
  83% { translate: 0 0; scale: .97; }
  100% { opacity: 1; translate: 0 0; scale: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .soleil .citation, .encart-logos, .logo { animation: none; }
}