/* ==========================================================================
   launch.css — refonte visuelle du modal post-login AEXIUM (2026-10-05)
   Direction : premium navy/cyan/chrome. Scopé sous .ax-launch : ne touche
   pas au formulaire de login ni au reste de la landing.
   Hooks JS préservés : #loginDone, #doneLabsHead, #qrCanvas, #qrUser,
   #sandboxBanner, [data-close-login], [data-ax-labs-*], [data-i18n].
   ========================================================================== */

/* Teinte cyan du cadre quand le modal affiche l'écran de lancement */
.modal:has(.ax-launch){
  border-color:rgba(0,212,255,.32);
  box-shadow:0 30px 90px rgba(0,0,0,.65), 0 0 70px rgba(0,212,255,.07);
  /* scrollbar discrète (la barre bleue "bug" des captures d'Eric) */
  scrollbar-width:thin;
  scrollbar-color:rgba(0,212,255,.30) transparent;
}
.modal:has(.ax-launch)::-webkit-scrollbar{width:8px}
.modal:has(.ax-launch)::-webkit-scrollbar-thumb{
  background:rgba(0,212,255,.28);border-radius:99px;
}
.modal:has(.ax-launch)::-webkit-scrollbar-track{background:transparent}

/* ---------- conteneur ---------- */
.ax-launch{
  text-align:center;
  padding:10px 6px 6px;
  --ax-cyan:#00d4ff;
  --ax-cyan-soft:rgba(0,212,255,.12);
  --ax-gold:#d3ab63;
}

/* ---------- hero : logo chrome + accroche ---------- */
.ax-launch-hero{margin-bottom:30px}
.ax-launch-logo{
  display:block;
  width:min(300px,72%);
  height:auto;
  margin:2px auto 22px;
  filter:drop-shadow(0 6px 26px rgba(0,212,255,.22));
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) both;
}
.ax-launch-kicker{
  font-size:clamp(21px,2.6vw,26px);
  font-weight:800;
  letter-spacing:-.015em;
  color:#f4f2ec;
  margin:0 0 10px;
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) .08s both;
}
.ax-launch-note{
  color:var(--muted);
  font-size:14.5px;
  line-height:1.65;
  max-width:42ch;
  margin:0 auto;
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) .14s both;
}
@keyframes axRise{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}

/* ---------- cartes de choix (PC / mobile) ---------- */
.ax-launch-card{
  position:relative;
  border:1px solid rgba(0,212,255,.14);
  border-radius:20px;
  background:
    linear-gradient(180deg,rgba(0,212,255,.05),rgba(255,255,255,.015) 40%),
    rgba(10,12,22,.55);
  padding:30px 28px 28px;
  margin:0 0 18px;
  overflow:hidden;
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) .2s both;
}
.ax-launch-card + .ax-launch-card{animation-delay:.28s}
.ax-launch-card::before{ /* filet lumineux supérieur */
  content:"";
  position:absolute;inset:0 0 auto 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,212,255,.55),transparent);
}
.ax-launch-card-icon{
  width:58px;height:58px;border-radius:50%;
  margin:0 auto 16px;
  display:flex;align-items:center;justify-content:center;
  color:var(--ax-cyan);
  background:radial-gradient(circle at 50% 35%,rgba(0,212,255,.22),rgba(0,212,255,.05) 70%);
  border:1px solid rgba(0,212,255,.35);
  box-shadow:0 0 28px rgba(0,212,255,.18), inset 0 0 14px rgba(0,212,255,.10);
}
.ax-launch-card-icon svg{width:26px;height:26px}
.ax-launch-card h3{
  font-size:clamp(19px,2.4vw,23px);
  font-weight:800;
  letter-spacing:-.01em;
  color:#f4f2ec;
  margin:0 0 8px;
}
.ax-launch-card > p{
  color:var(--muted);
  font-size:14.5px;
  line-height:1.6;
  margin:0 0 6px;
}

/* bouton d'action principal (lien protocole aexium-labs://) */
.ax-btn-primary{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:16px;
  padding:15px 34px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-family:var(--font);
  font-weight:800;font-size:15px;letter-spacing:.04em;
  color:#04121a;text-decoration:none;
  background:linear-gradient(120deg,#37e2ff,#00b8e6);
  box-shadow:0 12px 34px rgba(0,212,255,.30);
  transition:transform .25s,box-shadow .25s,filter .25s;
}
.ax-btn-primary:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:0 18px 44px rgba(0,212,255,.40);
}
.ax-btn-primary:focus-visible{outline:2px solid var(--ax-cyan);outline-offset:3px}
.ax-btn-primary svg{width:17px;height:17px}
.ax-btn-primary::after{
  content:"\2192"; /* → : le JS remplace textContent du lien, pas de SVG inline */
  font-size:17px;line-height:1;
}

/* ---------- QR ---------- */
.ax-launch .login-qr-wrap{
  display:flex;justify-content:center;
  margin:20px 0 6px;
}
.ax-launch-qr-frame{
  background:#fff;
  border-radius:20px;
  padding:20px;
  box-shadow:0 16px 48px rgba(0,0,0,.5), 0 0 0 1px rgba(0,212,255,.18), 0 0 34px rgba(0,212,255,.10);
}
.ax-launch #qrCanvas{
  display:block;
  width:220px;height:220px; /* == taille imposée en inline par AX_drawQr (landing.js) */
  image-rendering:pixelated;
}
.ax-launch .qr-url-label{
  font-size:10.5px;color:var(--faint);
  letter-spacing:.22em;text-transform:uppercase;
  margin:20px 0 6px;
}
.ax-launch .qr-url{
  font-size:13px;margin:0 0 4px;word-break:break-all;
}
.ax-launch .qr-url a{
  color:var(--ax-cyan);
  text-decoration:none;
  border-bottom:1px solid rgba(0,212,255,.35);
  transition:border-color .2s,color .2s;
}
.ax-launch .qr-url a:hover{color:#7fe9ff;border-bottom-color:#7fe9ff}

/* session */
.ax-launch .qr-user{
  font-size:13px;color:var(--faint);letter-spacing:.05em;
  margin:14px 0 0;
}
.ax-launch .qr-user strong{
  color:var(--ax-gold);
  font-weight:800;letter-spacing:.02em;
}

/* bannière sandbox */
.ax-launch .sandbox-banner{
  margin:18px 0 0;
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) .34s both;
}

/* ---------- pied : bouton retour ---------- */
.ax-launch-foot{
  margin-top:24px;
  animation:axRise .7s cubic-bezier(.2,.7,.2,1) .38s both;
}
.ax-btn-ghost{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 38px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.03);
  color:var(--muted);
  font-family:var(--font);
  font-weight:700;font-size:14px;letter-spacing:.06em;
  cursor:pointer;
  transition:border-color .2s,color .2s,background .2s,transform .2s;
}
.ax-btn-ghost:hover{
  border-color:rgba(0,212,255,.5);
  color:#eaf6ff;
  background:rgba(0,212,255,.07);
  transform:translateY(-1px);
}
.ax-btn-ghost:focus-visible{outline:2px solid var(--ax-cyan);outline-offset:3px}

/* ---------- responsive ---------- */
@media (max-width:480px){
  .ax-launch{padding:6px 0 2px}
  .ax-launch-logo{width:min(230px,74%);margin-bottom:18px}
  .ax-launch-hero{margin-bottom:22px}
  .ax-launch-card{padding:24px 18px 22px;border-radius:16px}
  .ax-launch #qrCanvas{width:220px;height:220px}
  .ax-btn-primary{width:100%;justify-content:center;padding:15px 20px}
}

/* ---------- mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  .ax-launch-logo,.ax-launch-kicker,.ax-launch-note,
  .ax-launch-card,.ax-launch .sandbox-banner,.ax-launch-foot{
    animation:none;
  }
  .ax-btn-primary,.ax-btn-ghost{transition:none}
  .ax-btn-primary:hover,.ax-btn-ghost:hover{transform:none}
}
