/* Guru chat launcher — ported 1:1 from the Frankel blue-harbor design
   (blue-harbor/site/assets/style.css in frankel-website). The floating
   intro card IS the site-wide chat launcher; the Optimize widget's own
   pill is hidden by guru.js. Values from the blue-harbor tokens:
   gold-500 #efaf26, gold-ink #132441, spring cubic-bezier(0.34,1.4,0.4,1). */

/* Podium's bubble lives in the same corner; Guru is the only chat button. */
#podium-bubble,
#podium-website-widget,
#podium-prompt { display: none !important; }

.hero-bot {
  /* Fixed bottom-right on every page, just below the widget's z-index so
     the open chat panel covers it. */
  position: fixed; right: 24px; bottom: 24px; z-index: 2147482000;
  cursor: pointer;
  display: flex; align-items: center; gap: 18px;
  background:
    radial-gradient(130% 160% at 8% 0%, rgba(47, 111, 178, 0.32), transparent 55%),
    linear-gradient(160deg, rgba(10, 24, 47, 0.95), rgba(5, 13, 28, 0.97));
  border-radius: 20px; padding: 18px 24px;
  max-width: 430px;
  isolation: isolate; overflow: hidden;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:
    0 24px 60px -18px rgba(3, 10, 24, 0.75),
    0 0 34px -6px rgba(124, 196, 245, 0.28),
    0 0 26px -8px rgba(246, 190, 63, 0.2);
}
.hero-bot::before {
  /* neon gradient border (mask trick keeps the middle hollow) */
  content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px;
  background: linear-gradient(115deg, rgba(124, 196, 245, 0.95), rgba(47, 111, 178, 0.45) 42%, rgba(246, 190, 63, 0.9));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}
.hero-bot > * { position: relative; z-index: 1; }
.hb-circuit { position: absolute; z-index: 0; pointer-events: none; }
.hb-circuit-tl { top: 0; left: 0; }
.hb-circuit-br { right: 0; bottom: 0; }
.hero-bot .bot-badge {
  flex: 0 0 106px; width: 106px; height: 106px;
  filter: drop-shadow(0 0 16px rgba(124, 196, 245, 0.3));
}
/* Guru hover: the owl lifts and tilts, the orbit spins up, the glow blooms,
   and the right eye winks (the whole card is the hover target). */
.bot-badge { transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.45s ease; }
.hero-bot:hover .bot-badge {
  transform: translateY(-5px) rotate(-4deg) scale(1.05);
  filter: drop-shadow(0 0 26px rgba(124, 196, 245, 0.55)) drop-shadow(0 10px 22px rgba(246, 190, 63, 0.22));
}
.nb-dash { transform-box: fill-box; transform-origin: center; animation: nb-spin 30s linear infinite; }
.hero-bot:hover .nb-dash { animation-duration: 2.4s; }
.nb-eyes { transform-box: fill-box; transform-origin: center; animation: nb-blink 5.4s ease-in-out infinite; }
.nb-eye { transform-box: fill-box; transform-origin: center; }
.hero-bot:hover .nb-eye-r { animation: nb-wink 0.9s ease-in-out 0.12s 1; }
.nb-orb { animation: nb-pulse 2.6s ease-in-out infinite; }
.hero-bot:hover .nb-orb { animation-duration: 0.8s; }
@keyframes nb-spin { to { transform: rotate(360deg); } }
@keyframes nb-blink { 0%, 91%, 100% { transform: scaleY(1); } 94.5% { transform: scaleY(0.1); } 98% { transform: scaleY(1); } }
@keyframes nb-pulse { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; } }
@keyframes nb-wink { 0%, 100% { transform: scaleY(1); } 35%, 65% { transform: scaleY(0.12); } }
.hero-bot-h { font-family: 'Playfair Display', Georgia, 'Times New Roman', serif; font-weight: 700; font-size: 19px; color: #edf6ff; margin: 0 0 2px; text-shadow: 0 0 16px rgba(124, 196, 245, 0.55); }
.hero-bot-p { font-size: 13px; color: #a9c3e4; margin: 0 0 12px; line-height: 1.45; }
.btn-chat {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(7, 18, 37, 0.72); color: #eaf4ff; border: 0; cursor: pointer;
  font-size: 11px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase;
  padding: 10px 16px; border-radius: 999px;
  box-shadow:
    inset 0 0 0 1.5px rgba(124, 196, 245, 0.6),
    0 0 18px -6px rgba(124, 196, 245, 0.55);
  text-shadow: 0 0 10px rgba(124, 196, 245, 0.5);
  transition: box-shadow 0.2s ease, color 0.15s ease, transform 0.18s cubic-bezier(0.34, 1.4, 0.4, 1);
}
.btn-chat:hover {
  transform: translateY(-1px); color: #fff;
  box-shadow:
    inset 0 0 0 1.5px rgba(246, 190, 63, 0.85),
    0 0 22px -5px rgba(246, 190, 63, 0.6);
}
.btn-chat .plus { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #efaf26; color: #132441; box-shadow: 0 0 12px rgba(246, 190, 63, 0.55); }

@media (prefers-reduced-motion: reduce) {
  .nb-dash, .nb-eyes, .nb-orb { animation: none !important; }
  .bot-badge { transition: none; }
  .hero-bot:hover .bot-badge { transform: none; }
  .hero-bot:hover .nb-eye-r { animation: none; }
}

@media (max-width: 920px) {
  .hero-bot { right: 14px; bottom: 14px; gap: 13px; padding: 13px 16px; max-width: min(400px, calc(100vw - 28px)); }
  .hero-bot .bot-badge { flex-basis: 76px; width: 76px; height: 76px; }
  .hero-bot-h { font-size: 17px; }
}
@media (max-width: 640px) {
  .hero-bot { max-width: calc(100vw - 24px); }
}
