:root { --lueur-intro-ready:1; }
.lueur-intro { --hand-width:clamp(160px,22vw,240px); position:fixed; inset:0; overflow:hidden; z-index:2147483646; background:#080a09; display:grid; place-items:center; pointer-events:none; animation:lueur-intro-exit 2.65s linear forwards; }
.lueur-intro-brand { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; color:#fff; animation:lueur-logo-touch 2.65s ease-in-out both; }
.lueur-intro-brand img { display:block; width:clamp(110px,14vw,170px); height:auto; margin:0 auto; max-height:45vh; object-fit:contain; }
.lueur-intro-brand p { margin:18px 0 0; font:500 11px/1.5 Inter,'Segoe UI',sans-serif; letter-spacing:.35em; white-space:nowrap; color:#c9a463; }
.lueur-intro-hand { position:absolute; width:var(--hand-width); height:auto; max-width:none; left:calc(50% - var(--hand-width) * .42); top:calc(50% - var(--hand-width) * .06); transform-origin:42% 4%; animation:lueur-hand-touch 2.65s cubic-bezier(.22,.61,.36,1) both; mask-image:linear-gradient(#000 75%,transparent 99%); }
.lueur-intro-contact { position:absolute; top:50%; left:50%; width:22px; aspect-ratio:1; border:1px solid #c9a463; border-radius:50%; box-shadow:0 0 20px #c9a46366; animation:lueur-contact 2.65s ease-out both; }
@keyframes lueur-logo-touch { 0%{opacity:0} 18%,49%{opacity:1;filter:none} 58%{opacity:1;filter:drop-shadow(0 0 14px #c9a463aa)} 77%,100%{opacity:1;filter:none} }
@keyframes lueur-hand-touch { 0%,20%{opacity:0;transform:translate(35px,65vh) rotate(9deg)} 43%{opacity:1;transform:translate(0,14px) rotate(0)} 52%,58%{opacity:1;transform:translate(0,0) scale(.98)} 73%{opacity:1;transform:translate(15px,50px)} 87%,100%{opacity:0;transform:translate(35px,65vh) rotate(7deg)} }
@keyframes lueur-contact { 0%,51%{opacity:0;transform:translate(-50%,-50%) scale(.4)} 56%{opacity:.8} 79%,100%{opacity:0;transform:translate(-50%,-50%) scale(10)} }
@keyframes lueur-intro-exit { 0%,86%{opacity:1;visibility:visible} 100%{opacity:0;visibility:hidden} }
@media(prefers-reduced-motion:reduce) { .lueur-intro { display:none !important; } .lueur-intro * { animation:none !important; } }