/* PAAN — vídeo no hero (direita), chat por baixo */

.paan {
  width: 100%;
}

.paan[hidden] {
  display: none !important;
}

.paan__btn {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  max-height: min(22rem, 52vh);
  padding: 0;
  border: 1px solid rgba(34, 211, 238, 0.3);
  border-radius: 1rem;
  overflow: hidden;
  background: #020617;
  cursor: pointer;
  box-shadow: 0 0 15px rgba(34, 211, 238, 0.3);
  transition: transform 0.3s var(--ease, cubic-bezier(0.22, 1, 0.36, 1)),
    box-shadow 0.3s ease;
}

.paan__btn:hover {
  transform: scale(1.02);
  box-shadow: 0 0 22px rgba(34, 211, 238, 0.45);
}

.paan__btn:focus-visible {
  outline: 2px solid rgba(34, 211, 238, 0.7);
  outline-offset: 3px;
}

.paan__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

.paan__ring {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  pointer-events: none;
}

.paan__unmute {
  position: absolute;
  left: 50%;
  bottom: 0.55rem;
  transform: translateX(-50%);
  z-index: 2;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  border: 1px solid rgba(103, 232, 249, 0.4);
  background: rgba(2, 6, 23, 0.88);
  color: #ecfeff;
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  backdrop-filter: blur(8px);
  pointer-events: auto;
}

/* Neural docked sob o vídeo */
.neural--docked {
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  inset: auto !important;
  width: 100%;
  justify-items: stretch;
  gap: 0.55rem;
  z-index: 70;
}

.neural--docked .neural__launcher {
  width: 100%;
  justify-content: center;
}

.neural--docked .neural__launcher.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: none;
  display: none !important;
}

.neural--docked .neural__panel {
  width: 100% !important;
  height: min(42vh, 28rem) !important;
  max-height: none !important;
  animation: none;
}

.neural--docked .neural__nudge {
  width: 100%;
  order: -1;
}

.hero__assist.is-floating .neural--docked .neural__panel {
  height: min(50vh, 26rem) !important;
}

/*
 * Chat aberto: vídeo some + painel maior e em destaque
 * (body.neural-chat-open é definido em neural.js — fiável)
 */
body.neural-chat-open #paanHost,
body.neural-chat-open .paan,
body.neural-chat-open .paan__btn {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.neural-chat-open .hero__assist,
.hero__assist.is-chat-open {
  width: min(100%, 26rem) !important;
  max-width: min(26rem, calc(100vw - 1.5rem));
}

body.neural-chat-open .neural,
body.neural-chat-open .neural--docked,
.neural.neural--expanded {
  width: 100% !important;
  max-width: 26rem;
  justify-items: stretch !important;
}

body.neural-chat-open .neural__panel,
body.neural-chat-open .neural--docked .neural__panel,
.neural.neural--open.neural--expanded .neural__panel,
.neural.neural--open.neural--docked .neural__panel {
  display: grid !important;
  width: min(26rem, calc(100vw - 1.25rem)) !important;
  height: min(78vh, 42rem) !important;
  max-height: calc(100dvh - 5rem) !important;
  border: 1px solid rgba(0, 229, 255, 0.5) !important;
  background: rgba(2, 8, 18, 0.97) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.65),
    0 0 60px rgba(0, 229, 255, 0.28) !important;
  transform: none !important;
}

body.neural-chat-open .hero__assist.is-floating {
  width: min(26rem, calc(100vw - 1.25rem)) !important;
  right: max(0.75rem, env(safe-area-inset-right));
  bottom: max(0.75rem, env(safe-area-inset-bottom));
}

@media (max-width: 520px) {
  .paan__btn {
    border-radius: 0.85rem;
    max-height: min(16rem, 40vh);
  }

  .paan__unmute {
    font-size: 0.55rem;
    padding: 0.22rem 0.5rem;
  }

  .neural--docked .neural__panel {
    height: min(48vh, 24rem) !important;
  }

  body.neural-chat-open .neural__panel,
  body.neural-chat-open .neural--docked .neural__panel,
  .neural.neural--open.neural--expanded .neural__panel {
    width: calc(100vw - 1.1rem) !important;
    height: min(82dvh, 40rem) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .paan__btn {
    transition: none;
  }
  .paan__btn:hover {
    transform: none;
  }
}