*{box-sizing:border-box}html,body{height:100%}body{position:relative;margin:0;background:#000;color:#fff;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;overflow:hidden}

:root{--accent:rgba(255,255,255,.9);--glow:0 0 40px rgba(255,255,255,.2),0 0 100px rgba(255,255,255,.08)}

#bg{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero{position:relative;z-index:1;min-height:100vh;display:grid;place-items:center;text-align:center;padding:2rem}

/* Titre central flottant */
.floating{font-size:clamp(3rem,8vw,8rem);line-height:1.05;margin:0;font-weight:900;letter-spacing:.02em;color:#fff;text-shadow:0 10px 30px rgba(0,0,0,.6),0 0 60px rgba(255,255,255,.18)}

/* Effet flottant + reflet subtil */
.floating{animation:float 6s ease-in-out infinite, glowPulse 4s ease-in-out infinite; text-decoration:none; cursor:pointer}
@keyframes float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-14px) scale(1.01)}}
@keyframes glowPulse{0%,100%{text-shadow:0 10px 30px rgba(0,0,0,.6),0 0 30px rgba(255,255,255,.15)}50%{text-shadow:0 10px 30px rgba(0,0,0,.6),0 0 80px rgba(255,255,255,.35)}}

/* Accessibilité focus visible si on ajoute des liens plus tard */
:focus-visible{outline:2px dashed rgba(255,255,255,.6);outline-offset:4px}