/* Animation de bienvenue : 100 % CSS pour l'apparition, le JavaScript ne sert qu'a la fermer. */
.bienvenue { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; overflow: hidden; background: #000; transition: opacity .7s ease, visibility .7s; }
.bienvenue--sortie { opacity: 0; visibility: hidden; }
html.bienvenue-ouverte { overflow: hidden; }

.bienvenue-lueur { position: absolute; width: 90vmax; height: 90vmax; left: 50%; top: 50%; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgba(var(--accent-rgb,249,192,65),.22), rgba(var(--accent-rgb,249,192,65),.06) 34%, transparent 62%); animation: b-lueur 5s ease-in-out infinite alternate, b-fondu 1.6s ease both; }
.bienvenue-faisceau { position: absolute; inset: -20%; background: linear-gradient(115deg, transparent 42%, rgba(var(--accent-rgb,249,192,65),.10) 50%, transparent 58%); animation: b-faisceau 4.5s cubic-bezier(.4,0,.2,1) .6s both; }

.bienvenue-scene { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 560px; }
.bienvenue-logo { height: 39px; width: auto; animation: b-logo 1.1s cubic-bezier(.2,.7,.2,1) .2s both; }
.bienvenue-filet { display: block; height: 2px; width: 120px; margin: 34px 0 30px; background: linear-gradient(90deg, transparent, #F9C041, transparent); transform-origin: center; animation: b-filet 1.1s cubic-bezier(.2,.7,.2,1) .9s both; }
.bienvenue-petit { margin: 0; font-size: 13px; letter-spacing: 6px; text-transform: uppercase; color: var(--yellow); font-weight: 600; animation: b-monte .9s cubic-bezier(.2,.7,.2,1) 1.3s both; }
.bienvenue-nom { margin: 10px 0 22px; font-size: clamp(40px, 8vw, 68px); font-weight: 700; letter-spacing: -1.5px; line-height: 1.05; background: linear-gradient(180deg, #fff 30%, #D8D1C4); -webkit-background-clip: text; background-clip: text; color: transparent; animation: b-monte 1s cubic-bezier(.2,.7,.2,1) 1.55s both; }
.bienvenue-texte { margin: 0 0 34px; max-width: 460px; color: var(--text-muted); font-size: 16px; line-height: 25px; animation: b-monte .9s cubic-bezier(.2,.7,.2,1) 2s both; }
.bienvenue-bouton { padding: 14px 32px; font-size: 15px; animation: b-monte .9s cubic-bezier(.2,.7,.2,1) 2.4s both, b-halo 2.6s ease-in-out 3.4s infinite; }
.bienvenue-passer { position: absolute; right: 24px; top: 20px; background: none; border: 0; color: var(--text-faint); font: 13px Montserrat, sans-serif; cursor: pointer; padding: 8px; animation: b-fondu 1s ease 1.2s both; }
.bienvenue-passer:hover { color: var(--yellow); }

@keyframes b-fondu { from { opacity: 0; } to { opacity: 1; } }
@keyframes b-lueur { from { scale: .92; opacity: .8; } to { scale: 1.08; opacity: 1; } }
@keyframes b-faisceau { from { transform: translateX(-70%); opacity: 0; } 30% { opacity: 1; } to { transform: translateX(70%); opacity: 0; } }
@keyframes b-logo { from { opacity: 0; transform: scale(.86); filter: blur(10px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes b-filet { from { transform: scaleX(0); opacity: 0; } to { transform: scaleX(1); opacity: 1; } }
@keyframes b-monte { from { opacity: 0; transform: translateY(22px); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes b-halo { 0%, 100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb,249,192,65),.0); } 50% { box-shadow: 0 0 0 10px rgba(var(--accent-rgb,249,192,65),.14); } }

@media (prefers-reduced-motion: reduce) {
  .bienvenue *, .bienvenue { animation: none !important; transition-duration: .01s !important; }
}