/* BeastBrowser motion — always on (Windows reduced-motion used to hide everything) */
html {
  scroll-behavior: smooth;
}

body.nb-site .saas-sky-1 {
  animation: bbBlobDrift 16s ease-in-out infinite alternate;
}
body.nb-site .saas-sky-2 {
  animation: bbBlobDrift 20s ease-in-out infinite alternate-reverse;
}

@keyframes bbBlobDrift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(-4%, 5%, 0) scale(1.08); }
}

@keyframes bbRise {
  from { opacity: 0; transform: translate3d(0, 40px, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes bbMascotFloat {
  0%, 100% { transform: translate3d(0, 0, 0) translateZ(16px); }
  50% { transform: translate3d(0, -14px, 0) translateZ(16px); }
}

@keyframes bbSoftGlow {
  0%, 100% { box-shadow: 0 10px 24px rgba(239, 43, 36, 0.18); }
  50% { box-shadow: 0 14px 32px rgba(239, 43, 36, 0.34); }
}

body.bb-home-page .nb-hero-copy > * {
  animation: bbRise 0.95s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.bb-home-page .nb-hero-copy > *:nth-child(1) { animation-delay: 0.05s; }
body.bb-home-page .nb-hero-copy > *:nth-child(2) { animation-delay: 0.16s; }
body.bb-home-page .nb-hero-copy > *:nth-child(3) { animation-delay: 0.28s; }
body.bb-home-page .nb-hero-copy > *:nth-child(4) { animation-delay: 0.4s; }
body.bb-home-page .nb-hero-copy > *:nth-child(5) { animation-delay: 0.52s; }

body.bb-home-page .fire-hero-art {
  animation: bbRise 1.05s cubic-bezier(0.22, 1, 0.36, 1) 0.2s both;
}

body.bb-home-page .fire-hero-stage .fire-mascot {
  animation: bbMascotFloat 5.5s ease-in-out infinite;
}

body.bb-home-page .nb-hero-ctas .nb-btn-dark {
  animation: bbRise 0.95s cubic-bezier(0.22, 1, 0.36, 1) 0.4s both, bbSoftGlow 2.8s ease-in-out infinite 1.2s;
}

#bb-nav-shell {
  transition: background 0.35s ease, box-shadow 0.35s ease, backdrop-filter 0.35s ease;
}
#bb-nav-shell.is-scrolled {
  background: rgba(255, 249, 247, 0.92);
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 30px rgba(17, 24, 39, 0.08);
}

[data-bb-reveal] {
  opacity: 0;
  transform: translate3d(0, 36px, 0);
  transition:
    opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-bb-reveal].is-in {
  opacity: 1;
  transform: none;
}

.nb-btn-dark,
.nb-btn-ghost,
.nb-btn,
.saas-textlink {
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease,
    background 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}
.saas-card:hover {
  box-shadow: 0 22px 48px rgba(239, 43, 36, 0.16), 0 10px 20px rgba(17, 24, 39, 0.08);
}
.nb-btn-dark {
  background-image:
    radial-gradient(
      140px circle at var(--mx, 50%) var(--my, 40%),
      rgba(255, 255, 255, 0.34),
      transparent 58%
    ),
    linear-gradient(90deg, var(--nb-red) 0%, var(--nb-orange) 100%);
}

.nb-rotate {
  display: inline-block;
  min-width: 7.2ch;
  transition: opacity 0.28s ease, transform 0.28s ease;
}
.nb-rotate.nb-fade {
  opacity: 0;
  transform: translateY(8px);
}

/* Mouse craft — ring lags, spotlight follows, magnets pull */
.bb-spot {
  position: fixed;
  top: 0;
  left: 0;
  width: 42rem;
  height: 42rem;
  margin: -21rem 0 0 -21rem;
  border-radius: 50%;
  pointer-events: none;
  z-index: 40;
  background: radial-gradient(circle, rgba(239, 43, 36, 0.14) 0%, rgba(255, 176, 156, 0.08) 38%, transparent 70%);
  mix-blend-mode: multiply;
  will-change: transform;
}
.bb-cur {
  position: fixed;
  inset: 0;
  width: 0;
  height: 0;
  pointer-events: none;
  z-index: 9998;
  overflow: visible;
}
.bb-cur i,
.bb-cur b {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  pointer-events: none;
  will-change: transform;
}
.bb-cur i {
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  border-radius: 50%;
  background: #ef2b24;
  box-shadow: 0 0 16px rgba(239, 43, 36, 0.55);
}
.bb-cur b {
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border: 1.5px solid rgba(239, 43, 36, 0.55);
  border-radius: 50%;
  transition: width 0.22s ease, height 0.22s ease, margin 0.22s ease, border-color 0.22s ease;
}
.bb-cur.is-hot b {
  width: 56px;
  height: 56px;
  margin: -28px 0 0 -28px;
  border-color: #ef2b24;
}
html.bb-pointer body.nb-site,
html.bb-pointer body.nb-site a,
html.bb-pointer body.nb-site button {
  cursor: none;
}
html.bb-pointer body.nb-site input,
html.bb-pointer body.nb-site textarea,
html.bb-pointer body.nb-site select {
  cursor: text;
}

.bb-trail {
  position: fixed;
  inset: 0;
  width: 0;
  height: 0;
  pointer-events: none;
  z-index: 9997;
  overflow: visible;
}
.bb-trail-dot {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(11px - var(--n) * 1px);
  height: calc(11px - var(--n) * 1px);
  margin: calc((11px - var(--n) * 1px) / -2) 0 0 calc((11px - var(--n) * 1px) / -2);
  border-radius: 50%;
  background: radial-gradient(circle, #ef2b24 0%, #ffb09c 55%, transparent 70%);
  opacity: calc(0.55 - var(--n) * 0.05);
  will-change: transform;
  transform: translate3d(-80px, -80px, 0);
}
.bb-gly {
  display: inline-block;
  will-change: transform;
}
.bb-gly-space {
  width: 0.28em;
}

.saas-card {
  position: relative;
  overflow: hidden;
}
.saas-card::after,
.fire-hero-art::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  border-radius: inherit;
  background: radial-gradient(
    340px circle at var(--mx, 50%) var(--my, 50%),
    rgba(255, 255, 255, 0.42),
    transparent 46%
  );
  opacity: 0.85;
  mix-blend-mode: soft-light;
}
.fire-hero-art {
  --mx: 52%;
  --my: 46%;
}
.fire-hero-art::after {
  border-radius: 1.5rem;
  z-index: 3;
}

.saas-sky {
  --bb-sky: 0px;
  transform: translate3d(0, var(--bb-sky), 0);
  will-change: transform;
}

.saas-card .saas-ico,
.saas-card img,
.nb-frame-round img {
  transform: scale(var(--iz, 1)) rotate(var(--ir, 0deg));
  transform-origin: center center;
  will-change: transform;
  transition: transform 0.14s ease-out;
}

.nb-frame-round {
  transform: perspective(900px) rotateX(var(--cx, 0deg)) rotateY(var(--cy, 0deg));
  transform-style: preserve-3d;
}

.saas-sec .bb-word {
  display: inline-block;
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.saas-sec.is-in .bb-word,
[data-bb-reveal].is-in .bb-word {
  opacity: 1;
  transform: none;
}

.nb-fw-mask:hover .nb-fw-track {
  animation-duration: 55s !important;
}

@media (hover: none), (pointer: coarse) {
  .bb-spot, .bb-cur, .bb-trail { display: none !important; }
  .saas-sky { transform: none; will-change: auto; }
}