/* ============================================================
   pilot.css — styles custom de la page Pilot, EN COMPLÉMENT de
   Tailwind (/dist/styles.css). Le gros de la mise en page vit en
   classes Tailwind/Material dans pilot.html ; ici uniquement :
   - révélations au scroll
   - halo de la démo hero
   - mini-LGO « avant / allumé » (constat → déclic)
   - état de chargement du bouton waitlist
   ============================================================ */

/* ---------- Révélations au scroll ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.9,.3,1.05);}
.reveal.in{opacity:1;transform:none;}

/* ---------- Halo vert diffus derrière la démo hero (discret, thème clair) ---------- */
.pilot-hero-glow{position:absolute;z-index:0;pointer-events:none;right:-8%;top:8%;
  width:680px;height:680px;max-width:80vw;
  background:radial-gradient(circle at 60% 50%,rgba(0,107,77,.10),rgba(0,107,77,0) 62%);}

/* ============================================================
   Mini-LGO réutilisable (Le constat = neutre ; Le déclic = allumé)
   ============================================================ */
.lgo-mini{position:relative;border-radius:12px;overflow:hidden;border:1px solid #c3ccd8;
  box-shadow:0 18px 40px rgba(0,55,38,.12);
  font-family:"Segoe UI",Tahoma,Geneva,sans-serif;color:#1c2533;background:#eef1f5;
  transition:box-shadow .8s ease;}
.lgo-mini__bar{height:30px;background:linear-gradient(180deg,#2f5b9e,#244a83);color:#fff;
  display:flex;align-items:center;gap:8px;padding:0 11px;font-size:12px;font-weight:600;}
.lgo-mini__bar .dotwin{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55);}
.lgo-mini__bar .wb{margin-left:auto;opacity:.7;font-weight:400;}
.lgo-mini__body{padding:14px;}
.lgo-mini__row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #c3ccd8;
  border-radius:6px;padding:9px 12px;font-size:12.5px;margin-bottom:8px;}
.lgo-mini__row .cip{font-family:Consolas,monospace;color:#5b6675;font-size:11px;margin-left:auto;}
.lgo-mini__row .px{font-weight:700;font-variant-numeric:tabular-nums;color:#27313f;min-width:54px;text-align:right;}
.lgo-mini__tot{display:flex;align-items:center;gap:12px;padding:10px 12px;border-top:1px solid #c3ccd8;}
.lgo-mini__tot .k{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:#5b6675;}
.lgo-mini__tot .v{font-weight:800;font-variant-numeric:tabular-nums;}
.lgo-mini__tot .enc{margin-left:auto;background:#2f5b9e;color:#fff;font-weight:700;font-size:12px;padding:7px 15px;border-radius:6px;}
.lgo-mini__flat{margin-top:10px;display:flex;align-items:center;gap:9px;font-size:11.5px;color:#7c8794;
  border:1px dashed #b7c0cc;border-radius:6px;padding:10px 12px;background:#fbfcfd;}
.lgo-mini__flat .flat-ic{width:18px;height:18px;border-radius:50%;border:2px solid #aab4c2;flex:none;}

/* Le constat : version légèrement éteinte */
.lgo-mini:not(.lit-trigger){filter:saturate(.85) brightness(.99);}

/* Le déclic : pastilles vertes (écho de l'orbital) + badge Pilot + ligne verte */
.spark{position:absolute;z-index:3;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:#0b3b2a;border:2px solid #2bd06a;box-shadow:0 0 16px rgba(0,107,77,.55);color:#9ef4cd;
  opacity:0;transform:scale(.5);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.9,.3,1.05);}
.spark svg{width:20px;height:20px;}
.lit .spark{opacity:1;transform:scale(1);}
.spark.s1{top:-14px;left:60%;transition-delay:.15s;}
.spark.s2{top:26%;right:-16px;transition-delay:.3s;}
.spark.s3{bottom:-12px;left:22%;transition-delay:.45s;}
.spark.s4{top:42%;left:-16px;transition-delay:.6s;}
.lgo-mini__pilot{position:absolute;left:12px;top:38px;z-index:4;display:inline-flex;align-items:center;gap:7px;
  font-family:"Plus Jakarta Sans",system-ui,sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.3px;
  color:#fff;background:#005039;padding:5px 11px;border-radius:20px;box-shadow:0 6px 16px rgba(0,80,57,.4);
  opacity:0;transform:translateY(8px);transition:opacity .5s ease .5s,transform .5s ease .5s;}
.lit .lgo-mini__pilot{opacity:1;transform:none;}
.lgo-mini.lit-trigger.lit{box-shadow:0 18px 50px rgba(0,80,57,.18),0 0 0 1px rgba(0,107,77,.4),0 0 40px rgba(0,107,77,.14);}
.lit .lgo-mini__flat{border:1px solid rgba(0,107,77,.45);color:#005039;background:#eafcf1;font-weight:600;}
.lit .lgo-mini__flat .flat-ic{border-color:#006b4d;background:#d6f5e3;}

/* ---------- Bouton waitlist : état de chargement ---------- */
.wl-spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;animation:wlspin .7s linear infinite;display:none;}
button[aria-busy="true"] .wl-spinner{display:inline-block;}
button[aria-busy="true"] .wl-label{opacity:.85;}
button[aria-busy="true"]{cursor:progress;}
@keyframes wlspin{100%{transform:rotate(360deg);}}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .lit .spark,.lit .lgo-mini__pilot{opacity:1!important;transform:none!important;transition:none!important;}
  .wl-spinner{animation:none!important;}
}
