/* BJH public-site motion + global conversion widgets (see static/js/bjh-motion.js). */

/* Pre-animation state. .m-js is set in <head> only when motion is allowed and
   removed again if Motion fails, so content is never stuck invisible. */
.m-js .reveal,
.m-js [data-m]:not([data-m-done]),
.m-js [data-m-stagger] > :not([data-m-done]),
.m-js #bjhWaFloat:not([data-m-done]) {
  opacity: 0;
}

/* ── Scroll progress ─────────────────────────────────────────── */
.bjh-scroll-progress {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 3px;
  z-index: 60;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, #0f766e, #10b981 60%, #34d399);
  pointer-events: none;
}

/* ── Floating WhatsApp consultation ──────────────────────────── */
.bjh-wa-float {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 50;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 52px;
  padding: 0 1.15rem 0 .95rem;
  border-radius: 999px;
  background: #128c4b; /* WhatsApp green, darkened to 4.9:1 against white text */
  color: #fff;
  font-weight: 700;
  font-size: .92rem;
  text-decoration: none;
  box-shadow: 0 10px 28px rgba(18, 140, 75, .38), 0 2px 6px rgba(0, 0, 0, .12);
  transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
  cursor: pointer;
}
.bjh-wa-float:hover { background: #0f7a41; box-shadow: 0 14px 34px rgba(18, 140, 75, .45), 0 2px 6px rgba(0, 0, 0, .12); transform: translateY(-2px); }
.bjh-wa-float:active { transform: translateY(0) scale(.97); }
.bjh-wa-float:focus-visible { outline: 3px solid #34d399; outline-offset: 3px; }
.bjh-wa-float svg { flex-shrink: 0; }
.bjh-wa-float .bjh-wa-label small { display: block; font-size: .68rem; font-weight: 600; opacity: .85; line-height: 1.1; }
.bjh-wa-float .bjh-wa-label strong { display: block; line-height: 1.15; }
@media (max-width: 640px) {
  /* Icon-only on phones so it never covers content; label stays for screen readers. */
  .bjh-wa-float { width: 56px; height: 56px; padding: 0; justify-content: center; }
  .bjh-wa-float .bjh-wa-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media print { .bjh-wa-float, .bjh-scroll-progress { display: none; } }

/* ── Shared WhatsApp CTA button (hero, final CTA, institutions) ─ */
.bjh-btn-wa {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px;
  padding: .8rem 1.6rem;
  border-radius: 999px;
  background: #128c4b;
  color: #fff;
  font-weight: 700; font-size: .95rem;
  text-decoration: none;
  transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
  cursor: pointer;
}
.bjh-btn-wa:hover { background: #0f7a41; transform: translateY(-2px); box-shadow: 0 8px 22px rgba(18, 140, 75, .35); color: #fff; }
.bjh-btn-wa:active { transform: translateY(0) scale(.97); }
.bjh-btn-wa:focus-visible { outline: 3px solid #34d399; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .bjh-wa-float, .bjh-btn-wa { transition: none; }
  .bjh-wa-float:hover, .bjh-btn-wa:hover { transform: none; }
}