/* ==========================================================================
   Nexo · nueva imagen visual (v2)
   Archivo independiente: se carga DESPUÉS de estilos.css y solo agrega/anula
   lo necesario. Para volver atrás basta con quitar la línea <link> de index.php.
   Colores de marca: azul #0C2254 · dorado #C89A3C
   ========================================================================== */

:root {
  --nexo-gold: #C89A3C;
  --nexo-navy: #0C2254;
  --nexo-stage-bg: #e9edf5;
}

/* ---------- Portada: Nexo dentro de un disco luminoso ---------- */
.nexus-mascot-scene { position: relative; }
.nexus-orbit { pointer-events: none; }
.hero-floating-card { z-index: 3; }

.nexo-hero-stage {
  position: relative;
  z-index: 2;
  display: block;
  width: min(340px, 72vw);
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  border-radius: 50%;
  overflow: hidden;
  isolation: isolate;
  cursor: pointer;
  background: radial-gradient(circle at 50% 35%, #f6f8fc 0%, #dde3f0 100%);
  box-shadow:
    0 0 0 3px rgba(200, 154, 60, .95),
    0 0 0 11px rgba(200, 154, 60, .16),
    0 26px 60px rgba(4, 10, 40, .55),
    0 0 90px rgba(200, 154, 60, .22);
  animation: nexoFloat 6s ease-in-out infinite;
  outline-offset: 6px;
}

.nexo-hero-stage video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  transform: scale(1.1);
  transform-origin: 50% 58%;
  transition: opacity .3s ease;
}

.nexo-hero-stage .nexo-v-greet { opacity: 0; }
.nexo-hero-stage.is-greeting .nexo-v-greet { opacity: 1; }

@keyframes nexoFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

/* ---------- Botón flotante del chat: avatar con la cara de Nexo ---------- */
.nexus-assistant-toggle__robot.nexo-avatar {
  position: relative;
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  background: var(--nexo-stage-bg);
  box-shadow: 0 0 0 2px var(--nexo-gold);
}

.nexo-avatar video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- Panel del chat: saludo de Nexo al abrir ---------- */
.nexo-greeter {
  position: relative;
  height: 150px;
  margin: 0 0 .75rem;
  border-radius: 14px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 35%, #f6f8fc 0%, #dde3f0 100%);
  box-shadow: inset 0 0 0 1px rgba(12, 34, 84, .12);
}

.nexo-greeter video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 35%;
}

.nexo-greeter.is-hidden { display: none; }

/* ---------- Accesibilidad: respetar "reducir movimiento" ---------- */
@media (prefers-reduced-motion: reduce) {
  .nexo-hero-stage { animation: none; }
}