/* Bluo à côté du formulaire de l'accueil (Aziz, 03/11/2026) : le dessin de l'espace (illustrations-espace.tsx), derrière la case E-mail.
   La boule est coupée au ras du formulaire ; le halo ne l'est pas, il s'efface en douceur derrière les cases. */
.hero-form{position:relative;z-index:0}
.hero-pastille{z-index:1}
.hero-gauche .lead{position:relative;z-index:1}
.bluo{--d:180px;--vu:78px;position:absolute;z-index:-1;left:404px;bottom:calc(100% - 1px);width:var(--d);height:var(--vu);margin-left:calc(var(--d) / -2);pointer-events:none}
html:not(.js) .bluo{display:none}
.bluo-halo{position:absolute;left:50%;top:calc(var(--d) / 2);width:calc(var(--d) * 1.9);height:calc(var(--d) * 1.9);margin:calc(var(--d) * -.95) 0 0 calc(var(--d) * -.95);-webkit-mask-image:linear-gradient(#000 calc(var(--d) * .45 + var(--vu) - 26px),transparent calc(var(--d) * .45 + var(--vu) + 30px));mask-image:linear-gradient(#000 calc(var(--d) * .45 + var(--vu) - 26px),transparent calc(var(--d) * .45 + var(--vu) + 30px))}
.bluo-halo::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(closest-side,rgba(59,130,246,.34) 0%,rgba(59,130,246,.26) 45%,rgba(59,130,246,.11) 68%,rgba(59,130,246,.03) 88%,rgba(59,130,246,0) 100%);animation:bluoHalo 2.4s ease-in-out infinite alternate}
@keyframes bluoHalo{from{opacity:.7}to{opacity:1}}
.bluo-coupe{position:absolute;inset:0;clip-path:inset(-90px -90px 0 -90px)}
.bluo-nait,.bluo-flotte,.bluo-corps{position:absolute;left:0;top:0;width:var(--d);height:var(--d)}
.bluo-flotte{animation:bluoFlotte 1.9s ease-in-out infinite alternate}
@keyframes bluoFlotte{to{transform:translateY(-4px)}}
.bluo-boule{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle calc(var(--d) * .85) at 34% 30%,#DBEAFE 0%,#60A5FA 22%,#2563EB 58%,#1E3A8A 100%);box-shadow:0 0 34px rgba(37,99,235,.22)}
.bluo-oeil{position:absolute;left:50%;top:50%;width:calc(var(--d) * .125);height:calc(var(--d) * .216);margin:calc(var(--d) * -.108) 0 0 calc(var(--d) * -.0625);border-radius:50%;background:radial-gradient(ellipse 72% 62% at 50% 34%,#fff 0%,#fff 62%,#DCE8FF 100%);box-shadow:0 calc(var(--d) * .012) calc(var(--d) * .035) rgba(13,35,100,.38),0 0 calc(var(--d) * .05) rgba(255,255,255,.42);opacity:0;will-change:transform}
/* Tant que le script n'a pas pris la main, rien ne se voit : pas de boule qui apparaît puis redescend. */
.js .bluo-nait{transform:translateY(calc(var(--vu) + 10px))}
.js .bluo-halo{opacity:0}
/* Sur un écran plus étroit, la place manque : il rétrécit. Tablette : la pastille est au centre, il passe à droite. */
@media (max-width:1279px){.bluo{--d:146px;--vu:56px;left:384px}}
@media (max-width:1119px){.bluo{--d:106px;left:362px}}
@media (max-width:999px){.bluo{left:88%}}
@media (prefers-reduced-motion:reduce){.bluo-flotte,.bluo-halo::before{animation:none}.bluo-halo::before{opacity:.85}}