@layer ancien {
/* Intro animée d'IA NOVATION : voir intro.py. */
#ian-intro {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(ellipse 80% 70% at 50% 44%, #0d2f66 0%, #071c40 42%, #030c1d 100%);
  cursor: pointer;
  transition: opacity .6s ease-in-out, transform .6s ease-in-out;
  will-change: opacity, transform;
  -webkit-user-select: none;
  user-select: none;
}
html[data-entree] .hero__contenu { animation-play-state: paused; }

.intro__scene { position: absolute; inset: 0; pointer-events: none; }

.intro__coeur { position: relative; z-index: 2; text-align: center; padding: 0 24px; }
.intro__logo {
  display: block;
  width: min(460px, 74vw);
  height: auto;
  margin: 0 auto;
  filter: brightness(1.7) saturate(1.1) drop-shadow(0 0 22px rgba(0, 200, 255, .3));
  animation: ian-intro-logo .85s cubic-bezier(.2, .8, .3, 1) .35s both;
}
.intro__mot {
  max-width: 34em;
  margin: 22px auto 0;
  color: rgba(214, 226, 255, .7);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .28em;
  text-transform: uppercase;
  text-wrap: balance;
  animation: ian-intro-mot .8s ease .8s both;
}
@keyframes ian-intro-logo { from { opacity: 0; transform: translateY(10px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes ian-intro-mot { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }





@media (max-width: 600px) {
  .intro__mot { font-size: 11px; letter-spacing: .22em; }
}
.intro__passer { position: absolute; z-index: 5; right: 24px; bottom: 24px; min-height: 44px; padding: 10px 18px; border: 1px solid #7586aa; border-radius: 10px; background: #fff; color: #0b1450; font: 600 14px/1.4 Satoshi,sans-serif; cursor: pointer; }
.intro__passer:focus-visible { outline: 3px solid #075bff; outline-offset: 4px; }

/* i « Traversée immersive » (l'intro d'arrivée, seule gardée dans la V6, T16) : scène de profondeur plein écran. */
#ian-intro.intro--nouvelle {
  background: transparent; cursor: default; transition: none; transform: none;
  isolation: isolate; will-change: auto;
}
.intro--nouvelle .intro__scene { z-index: auto; }
.intro--nouvelle .intro__coeur { z-index: 2; pointer-events: none; }
.intro--nouvelle .intro__logo,.intro--nouvelle .intro__mot {
  animation: none; opacity: 1; transform: none; filter: none;
}
.intro--nouvelle .intro__mot { color: #253967; letter-spacing: .17em; }
.intro__profondeur { position: absolute; inset: 0; display: grid; place-items: center; perspective: 1100px; transform-style: preserve-3d; }
.intro__strate {
  position: absolute; width: min(84vw,1100px); height: 72vh;
  border: 3px solid #a8dff2; border-radius: 34px;
  background: linear-gradient(125deg,#d9faff88,#7776ff10 45%,#c34bee33);
  box-shadow: inset 4px 2px 0 #f0ffffcc,inset -4px -3px 0 #b48ce388,0 10px 60px #5d73a322;
  backface-visibility: hidden; will-change: transform;
}
.intro__porte { position: absolute; inset: 0; display: flex; transform: translateZ(-950px) scale(1.864); }
.intro__vantail { position: relative; width: 50%; height: 100%; flex-shrink: 0; background: linear-gradient(115deg,#e9f8ff,#f0f0fb 65%,#e7dff5); background-size: 200% 100%; backface-visibility: hidden; }
.intro__vantail--gauche { transform-origin: left center; background-position: left top; }
.intro__vantail--droite { transform-origin: right center; background-position: right top; }
.intro__vantail::after { content: ''; position: absolute; top: 0; bottom: 0; width: 1px; background: linear-gradient(#e5fbff,#a8d4f0,#c8b7eb); opacity: var(--intro-jointure,0); }
.intro__vantail--gauche::after { right: 0; }
.intro__vantail--droite::after { left: 0; }
.intro--nouvelle .intro__passer { z-index: 5; }
@media(max-width:600px) {
  .intro__strate { width: 88vw; height: 66vh; border-radius: 24px; }
  .intro--nouvelle .intro__logo { width: min(460px,82vw); }
  .intro--nouvelle .intro__mot { font-size: 10px; letter-spacing: .12em; }
  .intro--nouvelle .intro__passer { right: 14px; bottom: 18px; }
  }

}