:root{
      --bg:#070a11; --text:#e9eef8; --muted:#a9c2ff; --ring:rgba(255,255,255,.14);
      --grad: linear-gradient(135deg,#6aa0ff 0%, #be6bff 50%, #6bfff3 100%);
    }
    html,body{margin:0;height:100%;background:var(--bg);overflow-x:hidden}

    /* Canvas background: plein écran DERRIÈRE le contenu, mais PAS à z-index:-1 */
    #bg{
      position:fixed; inset:0; width:100%; height:100%; display:block;
      z-index:0; background:#070a11;
    }

    /* Petit texte d’aide */
    #ui{position:fixed;left:14px;bottom:14px;color:#a9c2ff;font:12px/1.35 system-ui,Segoe UI,Roboto,Arial,sans-serif;opacity:.7;user-select:none;z-index:2}

    /* Contenu du site au-dessus du canvas */
    .wrap{position:relative; z-index:1}
    .nav{
      width:min(1200px,92vw); margin:18px auto 0;
      display:flex; align-items:center; justify-content:space-between;
      padding:10px 14px; border-radius:12px;
      background:rgba(9,12,20,.35); border:1px solid var(--ring);
      backdrop-filter:saturate(120%) blur(6px);
    }
    .brand{font:700 18px/1 Poppins,Inter,system-ui; letter-spacing:4px; color:var(--text)}
    .nav a{color:var(--text); text-decoration:none; font:600 12px/1 Poppins,Inter,system-ui;
           opacity:.9; padding:9px 12px; border-radius:10px; border:1px solid transparent}
    .nav a:hover{border-color:var(--ring); background:rgba(255,255,255,.06)}

    .hero{width:min(1100px,92vw); margin:18vh auto 0; text-align:center; color:var(--text)}
    .kicker{letter-spacing:3px; font:600 11px/1.1 Inter,system-ui; color:#9fb2df; margin-bottom:14px}
    .title{font:800 clamp(32px,6vw,64px)/1.08 Poppins,Inter,system-ui; margin:0; text-shadow:0 0 24px rgba(20,40,120,.18)}
    .title .glow{color:transparent; background:var(--grad); -webkit-background-clip:text; background-clip:text; text-shadow:0 0 18px rgba(122,85,255,.22)}
    .sub{max-width:720px; margin:12px auto 0; color:#c6d2f5; opacity:.92; font:500 14px/1.6 Inter,system-ui}
    .cta{margin-top:22px; display:flex; gap:10px; justify-content:center; flex-wrap:wrap}
    .btn{padding:11px 16px; border-radius:10px; cursor:pointer; font:600 13px/1 Inter,system-ui;
         border:1px solid var(--ring); background:rgba(255,255,255,.06); color:var(--text);
         transition:.2s transform,.2s border-color,.2s filter}
    .btn:hover{transform:translateY(-2px); border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.1)}
    .btn.primary{background:var(--grad); border:none; color:#0d1020}
    .btn.primary:hover{filter:brightness(1.06)}