/* Polish layer: brighter blues, vibrant Book a call, always-on CTA, mobile tuning. */
:root {
  --accent: #6f9bff;
  --accent-deep: #a9c4ff;
  --accent-fill: #4f7cff;
  --blue-bright: #7fa8ff;
  --blue-max: #b8d0ff;
  --glow-blue: rgba(79, 124, 255, 0.85);
}

/* Brighter blue text everywhere it already was blue (no glow) */
.eyebrow, .beat__idx, .pcard__kicker, .pcard__link { color: var(--blue-bright); }
.beat__idx { font-weight: 600; font-size: 0.86rem; }
.shift__col--on .shift__label { color: var(--blue-bright); }
.shift__col--on b, .sum--on b { color: var(--blue-max); }


/* $40,000: the brightest thing on the page */
.mark { color: var(--blue-max); font-weight: inherit; }
.mark::after { background: var(--blue-bright) !important; }

/* "Already built" eyebrow with a glowing dot */
.eyebrow--dot { display: inline-flex; align-items: center; gap: 10px; }
.live-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--blue-bright);
  box-shadow: 0 0 10px var(--glow-blue), 0 0 20px rgba(79, 124, 255, 0.6);
  animation: dotPulse 2.2s ease-in-out infinite;
}
@keyframes dotPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.55; } }

/* Book a call: vibrant blue with a strong glow, follows the whole scroll */
.stickycta, .btn--glow {
  background: linear-gradient(120deg, #5b8cff, #2f6bff);
  color: #fff;
  animation: ctaGlow 2.6s ease-in-out infinite;
}
.stickycta { border: 1px solid rgba(255, 255, 255, 0.18); }
@keyframes ctaGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(79,124,255,.7), 0 0 44px rgba(47,107,255,.45), 0 8px 30px rgba(47,107,255,.5); }
  50% { box-shadow: 0 0 32px rgba(111,155,255,.95), 0 0 70px rgba(47,107,255,.6), 0 8px 36px rgba(47,107,255,.6); }
}

/* See what's built: brighter outline button */
.bridge__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.btn--ghost-blue {
  background: rgba(111, 155, 255, 0.1);
  color: var(--blue-max);
  border: 1px solid var(--blue-bright);
}
.btn--ghost-blue:hover { background: rgba(111, 155, 255, 0.2); color: #fff; border-color: var(--blue-max); }

/* Cleaner motion: nothing waits to fade in */
.reveal, .word, .pcard { opacity: 1 !important; }
.reveal { transform: none !important; transition: none !important; }

/* Mobile */
@media (max-width: 600px) {
  .stickycta {
    left: 16px; right: 16px;
    bottom: max(14px, env(safe-area-inset-bottom));
    justify-content: center; padding: 15px 20px;
  }
  .bridge__actions { flex-direction: column; align-items: stretch; }
  .bridge__actions .btn, .hero__actions .btn { justify-content: center; width: 100%; }
  .footer { padding-bottom: 90px; }
}

/* Live page thumbnails */
.thumb__live { position: absolute; inset: 26px 0 0 0; overflow: hidden; opacity: 0; transition: opacity 0.35s ease; background: var(--surface-2); pointer-events: none; }
.thumb__live.is-ready { opacity: 1; }
.thumb__live iframe { max-width: none !important; max-height: none !important; position: absolute; top: 0; left: 0; border: 0; transform-origin: 0 0; pointer-events: none; }

/* Soft ambient glow drifting behind everything */
body::before {
  content: ""; position: fixed; inset: -20vmax; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38vmax 38vmax at 20% 25%, rgba(79,124,255,0.10), transparent 60%),
    radial-gradient(32vmax 32vmax at 80% 70%, rgba(47,107,255,0.08), transparent 60%);
  animation: ambientDrift 26s ease-in-out infinite alternate;
}
@keyframes ambientDrift {
  0% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(4vmax,-3vmax,0); }
  100% { transform: translate3d(-3vmax,4vmax,0); }
}
@media (prefers-reduced-motion: reduce) { body::before { animation: none; } }

/* Bottom-right Book a call: static, no pulsing or movement */
.stickycta { animation: none !important; box-shadow: 0 0 22px rgba(79,124,255,.7), 0 8px 30px rgba(47,107,255,.5) !important; }
.stickycta.is-visible, .stickycta.is-visible:hover { transform: none !important; }
.stickycta__dot { animation: none !important; }

/* Buttons stay put on hover */
.btn:hover, .btn--primary:hover, .btn--ghost:hover, .btn--ghost-blue:hover, .btn--glow:hover { transform: none !important; }
.pcard[data-live] .thumb__img { transition: none; }

/* Hero video: solid black placeholder stage until a real video is embedded */
.hplayer__stage { background: #05070d; }
.hplayer__stage[data-state="idle"] .hplayer__scrim { opacity: 0; }
