/* ==========================================================================
   Sticky mobile CTA bar — appears < 768px, bottom of viewport.
   Two one-tap actions: Request Info → /inquire/ and Call Us → tel:
   A11Y: fixed bar with role="region" aria-label; respects safe-area inset;
   pairs an icon with a text label on each control (never icon-only).
   ========================================================================== */
.sticky-mobile-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-mobile-cta);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-1);
  padding: var(--space-1);
  padding-bottom: calc(var(--space-1) + env(safe-area-inset-bottom, 0px));
  background: rgb(255 255 255 / 0.96);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--color-border);
  box-shadow: 0 -4px 16px rgb(8 33 65 / 0.08);
}
.sticky-mobile-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 52px;
  border-radius: var(--radius-md);
  font-weight: var(--weight-semibold);
  font-size: var(--text-base);
  text-decoration: none;
}
.sticky-mobile-cta .smc-primary { background: var(--color-accent); color: #ffffff; }
.sticky-mobile-cta .smc-call {
  background: transparent;
  color: var(--color-primary);
  border: 1.5px solid var(--color-border-strong);
}

/* Only show on small viewports. */
@media (min-width: 768px) { .sticky-mobile-cta { display: none; } }

/* When the mobile bar is present, pad the page bottom so it never covers
   footer content or the Birdeye bubble's resting position. */
@media (max-width: 767.98px) {
  body.has-mobile-cta { padding-bottom: 72px; }
}

/* Lift the Birdeye chat bubble above the sticky CTA bar on mobile so it doesn't
   sit on top of the "Call Us" button. #bewebchat is Birdeye's fixed floating
   iframe (default bottom: 20px). This stylesheet only loads on pages that have
   the CTA bar, so the lift applies exactly where it's needed. The env() term
   also clears the safe-area inset on notched phones. */
@media (max-width: 767.98px) {
  #bewebchat { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
}