/* NJEE au travail — vue 360° (3 nov. 2026). Voir public/njee360.js. */
.n360 { position: absolute; right: clamp(16px, 3vw, 54px); top: 22px; bottom: 22px; width: clamp(360px, 46vw, 640px); z-index: 1; display: flex; flex-direction: column; gap: 10px; }
.n360-stage { position: relative; flex: 1; min-height: 400px; border-radius: 24px; overflow: hidden; cursor: grab; touch-action: pan-y; user-select: none; outline: none;
  background: radial-gradient(60% 55% at 50% 52%, rgba(255, 194, 26, .10), transparent 70%), radial-gradient(90% 90% at 50% 100%, rgba(227, 29, 29, .22), transparent 70%), rgba(6, 7, 11, .55);
  border: 1px solid rgba(255, 255, 255, .09); backdrop-filter: blur(3px); box-shadow: inset 0 0 80px rgba(0, 0, 0, .55), 0 24px 60px -24px rgba(0, 0, 0, .8); }
.n360-stage:active { cursor: grabbing; }
.n360-stage:focus-visible { box-shadow: 0 0 0 2px #ffc21a, inset 0 0 80px rgba(0, 0, 0, .55); }
.n360-cv { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
/* anneaux d'orbite : ellipses inclinées qui tournent, effet gyroscope */
.n360-ring { position: absolute; left: 50%; top: 66%; border-radius: 50%; border: 1px solid rgba(255, 194, 26, .28); transform: translate(-50%, -50%) rotateX(72deg); pointer-events: none; z-index: 1; }
.n360-ring.r1 { width: 82%; aspect-ratio: 1; border-color: rgba(255, 255, 255, .16); box-shadow: 0 0 30px rgba(255, 194, 26, .08), inset 0 0 30px rgba(255, 194, 26, .06); animation: n360-spin 38s linear infinite; border-style: dashed; }
.n360-ring.r2 { width: 62%; aspect-ratio: 1; border-color: rgba(227, 29, 29, .4); animation: n360-spin 26s linear infinite reverse; }
.n360-ring.r3 { width: 100%; aspect-ratio: 1; border-color: rgba(255, 255, 255, .07); }
@keyframes n360-spin { to { transform: translate(-50%, -50%) rotateX(72deg) rotateZ(360deg); } }
/* cœur : NJEE */
.n360-core { position: absolute; left: 50%; top: 40%; width: 36%; aspect-ratio: 1; transform: translate(-50%, -50%) perspective(700px) rotateY(var(--ry, 0deg)) rotateX(var(--rx, 0deg)); transition: transform .25s ease-out; z-index: 80; display: grid; place-items: center; }
.n360-av { position: relative; width: 78%; aspect-ratio: 1; border-radius: 50%; padding: 0; border: 0; cursor: pointer; z-index: 3;
  background: conic-gradient(from 0deg, #ffc21a, #e31d1d, #7c3aed, #3b82f6, #ffc21a); padding: 3px; box-shadow: 0 0 40px rgba(255, 194, 26, .35), 0 0 90px rgba(227, 29, 29, .35); animation: n360-flot 5s ease-in-out infinite; }
.n360-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: 50% 12%; background: #0b0d14; }
.n360-sweep { position: absolute; inset: -6%; border-radius: 50%; background: conic-gradient(from 0deg, rgba(255, 194, 26, 0) 0deg, rgba(255, 194, 26, .0) 250deg, rgba(255, 194, 26, .42) 350deg, rgba(255, 194, 26, 0) 360deg); animation: n360-rot 3.6s linear infinite; z-index: 1; -webkit-mask: radial-gradient(circle, transparent 38%, #000 40%); mask: radial-gradient(circle, transparent 38%, #000 40%); }
.n360-pulse { position: absolute; inset: 8%; border-radius: 50%; border: 2px solid rgba(255, 194, 26, .5); animation: n360-onde 3.2s ease-out infinite; z-index: 1; }
.n360-pulse.p2 { animation-delay: 1.6s; border-color: rgba(227, 29, 29, .5); }
.n360-tag { position: absolute; top: -9%; left: 50%; transform: translateX(-50%); z-index: 4; display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; padding: 5px 13px; border-radius: 99px; font: 700 11.5px var(--display, inherit); letter-spacing: .04em; background: rgba(8, 9, 14, .85); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(8px); }
.n360-tag i { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 10px #22c55e; animation: n360-clig 1.4s ease-in-out infinite; }
@keyframes n360-rot { to { transform: rotate(360deg); } }
@keyframes n360-onde { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes n360-flot { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes n360-clig { 50% { opacity: .35; } }
/* postes en orbite */
.n360-n { position: absolute; left: 0; top: 0; display: flex; align-items: center; gap: 9px; padding: 8px 14px 8px 8px; width: max-content; max-width: 210px; border-radius: 16px; will-change: transform, opacity;
  background: linear-gradient(160deg, rgba(24, 26, 36, .94), rgba(11, 12, 18, .94)); border: 1px solid rgba(255, 255, 255, .13); box-shadow: 0 10px 28px -8px rgba(0, 0, 0, .8); color: #fff; text-decoration: none; transition: border-color .2s, box-shadow .2s; }
.n360-n:hover, .n360-n:focus-visible { border-color: #ffc21a; box-shadow: 0 0 0 1px #ffc21a, 0 0 30px rgba(255, 194, 26, .35); outline: none; }
.n360-n.on { border-color: rgba(227, 29, 29, .6); }
.n360-ic { display: grid; place-items: center; width: 38px; height: 38px; flex: none; border-radius: 12px; background: linear-gradient(160deg, #e31d1d, #8f0f0f); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25); }
.n360-ic svg { width: 20px; height: 20px; }
.n360-t { display: grid; line-height: 1.12; min-width: 0; }
.n360-t b { font: 800 22px var(--display, inherit); letter-spacing: -.02em; }
.n360-t em { font-style: normal; font-weight: 700; font-size: 12.5px; }
.n360-t small { color: #9aa0b4; font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 128px; }
.n360-dot { position: absolute; top: -3px; right: -3px; width: 11px; height: 11px; border-radius: 50%; background: #ffc21a; box-shadow: 0 0 0 0 rgba(255, 194, 26, .7); animation: n360-ping 1.8s infinite; }
@keyframes n360-ping { 70% { box-shadow: 0 0 0 11px rgba(255, 194, 26, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 194, 26, 0); } }
/* console : ce que NJEE examine */
.n360-cons { border-radius: 18px; padding: 12px 15px 11px; background: rgba(6, 7, 11, .72); border: 1px solid rgba(255, 255, 255, .1); backdrop-filter: blur(10px); font-size: 13px; }
.n360-cons-h { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #9aa0b4; letter-spacing: .06em; text-transform: uppercase; }
.n360-cons-h b { color: #ffc21a; font-weight: 800; }
.n360-heure { margin-left: auto; font-variant-numeric: tabular-nums; }
.n360-led { width: 8px; height: 8px; border-radius: 50%; background: #ffc21a; box-shadow: 0 0 10px #ffc21a; animation: n360-clig 1s ease-in-out infinite; }
.n360-tache { min-height: 2.5em; margin: 6px 0 7px; font-weight: 700; font-size: 14.5px; line-height: 1.25; }
.n360-tache::after { content: "▌"; color: #ffc21a; animation: n360-clig .8s steps(2) infinite; margin-left: 2px; }
.n360-bar { height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .09); overflow: hidden; }
.n360-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #e31d1d, #ffc21a); box-shadow: 0 0 10px #ffc21a; }
.n360-cons-b { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 9px; }
.n360-lui { border: 0; cursor: pointer; padding: 6px 13px; border-radius: 99px; font: 700 12px inherit; font-family: inherit; color: #14110a; background: #ffc21a; }
.n360-lui:hover { filter: brightness(1.1); }
.n360-tout { font-size: 12px; color: #c7cbdb; }
.n360-tout:hover { color: #fff; }
.n360-log { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 2px; font-size: 11.5px; color: #aab0c6; }
.n360-log time { color: #6b7088; margin-right: 8px; font-variant-numeric: tabular-nums; }
/* l'accueil fait de la place à la scène */
.ax-hero:has(.n360) { min-height: 640px; }
.ax-hero:has(.n360) .ax-hero-txt { max-width: min(560px, calc(100% - clamp(400px, 49vw, 690px))); }
@media (max-width: 1100px) {
  .ax-hero:has(.n360) { flex-direction: column; align-items: stretch; min-height: 0; }
  .n360 { position: relative; right: auto; top: auto; bottom: auto; width: auto; margin: 16px 14px 0; }
  .n360-stage { min-height: 360px; }
  .ax-hero:has(.n360) .ax-hero-txt { max-width: none; }
}
@media (max-width: 560px) {
  .n360-stage { min-height: 340px; }
  .n360-n { padding: 6px 11px 6px 6px; gap: 7px; max-width: 170px; }
  .n360-ic { width: 32px; height: 32px; } .n360-t b { font-size: 18px; } .n360-t em { font-size: 11.5px; } .n360-t small { max-width: 96px; }
}
@media (prefers-reduced-motion: reduce) { .n360 *, .n360 *::before { animation: none !important; } }
/* NJEE flottant : caché tout en haut de la page, glisse dans le côté dès qu'on descend (3 nov. 2026, Alexandre) */
.ax-dock { transition: transform .45s cubic-bezier(.2, .8, .2, 1), opacity .35s; }
.ax-dock.ax-haut { transform: translateX(calc(100% + 40px)); opacity: 0; pointer-events: none; }
@media print { .n360 { display: none; } }

.ax-rond-o .ax-rond-img { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: 50% 12%; background: #0b0d14; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); }