.elementor-16 .elementor-element.elementor-element-3e5cc1d{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-2f2088b *//* ============================
   CONTINUITY — MOBILE FIX PACK
   Fixes header overflow + mobile CTA layout
   ============================ */

/* 1) Stop horizontal scroll everywhere */
html, body {
  overflow-x: hidden !important;
}

/* Avoid wide children creating scroll (common in Elementor) */
* {
  max-width: 100%;
}

/* 2) Header: prevent overflow and force clean wrapping */
header {
  width: 100%;
}

header .container,
header .nav {
  min-width: 0;
}

@media (max-width: 768px) {
  /* Stack header content safely */
  header .nav {
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
  }

  /* Brand should not force width */
  header .brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  /* Keep logo + name from pushing layout */
  header .brand-text strong,
  header .brand-text span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 48vw !important;
  }

  /* CTA cluster: allow wrapping without overflow */
  header .nav-cta {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
  }

  /* Phone pill: shrink nicely and never overflow */
  header .phone-pill {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 10px 12px !important;
  }

  /* Make phone text never wrap or break */
  header .phone-pill span,
  header .phone-pill strong {
    white-space: nowrap !important;
  }

  /* If your phone pill has 2-line text, hide the small label on mobile */
  header .phone-pill small {
    display: none !important;
  }

  /* Schedule button: keep it visible but prevent it from pushing off screen */
  header .btn.btn-primary {
    flex: 0 0 auto !important;
    padding: 10px 12px !important;
    font-size: 0.95rem !important;
    max-width: 100% !important;
  }

  /* OPTIONAL: If you’d rather the schedule button drop below the phone on mobile */
  header .btn.btn-primary {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* 3) Hero CTAs on mobile: stack + full width (fixes that button run-over too) */
@media (max-width: 768px) {
  .hero-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .hero-actions .btn {
    width: 100% !important;
    justify-content: center !important;
    white-space: normal !important;
  }

  /* Chips stack cleanly */
  .trustline {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .chip {
    width: 100% !important;
  }
}

/* 4) Section header “right CTA” overflow fix (buttons pushed offscreen) */
@media (max-width: 980px) {
  .section-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .section-cta,
  .section-cta .btn {
    width: 100% !important;
  }
  .section-cta .btn {
    justify-content: center !important;
  }
}
/* ============================
   MOBILE FIX: Stakes / Math Row
   ============================ */

/* Prevent any horizontal overflow from the math strip */
.math, .math-row { max-width: 100%; overflow: hidden; }

/* Mobile: stack into a clean 2-column grid */
@media (max-width: 560px){
  .math-row{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  /* Put the symbols on their own row, centered, spanning both columns */
  .math-sym{
    grid-column: 1 / -1 !important;
    text-align: center !important;
    line-height: 1 !important;
    font-size: 1.1rem !important;
    opacity: .75 !important;
  }

  /* Ensure boxes fit and text wraps nicely */
  .math-box{
    min-width: 0 !important;
    width: 100% !important;
    padding: 12px !important;
  }
  .math-box strong{
    font-size: 1.05rem !important;
  }
  .math-box span{
    font-size: .88rem !important;
    word-break: normal !important;
  }
/* =========================================
   FIX: Center the $300M × 5% = $15M stack
   Works even if the row is grid or flex now
   ========================================= */

@media (max-width: 600px){

  /* Force the math row into a centered vertical stack */
  .math-row{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    gap: 12px !important;
  }

  /* Make each box a consistent centered width */
  .math-row .math-box{
    width: min(280px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* Center the symbols and give them breathing room */
  .math-row .math-sym{
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
    opacity: .75 !important;
  }
  /* =========================================================
   MOBILE CLEANUP (center buttons + sticky phone bottom)
   ========================================================= */

/* Stop horizontal scroll */
html, body { overflow-x: hidden !important; }

/* ---------- 1) CENTER + CLEAN BUTTONS ON MOBILE ---------- */
@media (max-width: 820px){

  /* Hero button stack: centered, consistent width, good spacing */
  .hero-actions{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
  }
  .hero-actions .btn{
    width: 100% !important;
    max-width: 380px !important;   /* keeps buttons from feeling too wide */
    justify-content: center !important;
    text-align: center !important;
  }

  /* Section CTA buttons (the ones on the right in desktop): center + full width */
  .section-cta{
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }
  .section-cta .btn{
    width: 100% !important;
    max-width: 380px !important;
    justify-content: center !important;
  }

  /* Chips: stack and center so nothing overflows */
  .trustline{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
  }
  .chip{
    width: 100% !important;
    max-width: 520px !important;
  }
}

/* ---------- 2) HEADER: CLEAN ON MOBILE (NO CROWDING) ---------- */
@media (max-width: 820px){

  /* Keep header sticky (works if not broken by Elementor wrappers) */
  header{
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
  }

  /* Hide desktop nav links on mobile */
  header nav{ display: none !important; }

  /* Keep header simple: brand left, menu right */
  header .nav{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }

  /* Hide schedule button in header on mobile (prevents ugly wrapping) */
  header .nav-cta .btn.btn-primary{
    display: none !important;
  }
}

/* ---------- 3) STICKY PHONE BUTTON AT BOTTOM (MOBILE) ---------- */
/* We convert the existing header phone-pill into a bottom sticky button */
@media (max-width: 820px){

  /* Make sure content isn't hidden behind the sticky phone button */
  body{ padding-bottom: 92px !important; }

  /* If your phone button is inside header and uses .phone-pill */
  header .phone-pill{
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    z-index: 10000 !important;

    width: auto !important;
    max-width: 520px !important;
    margin: 0 auto !important;

    justify-content: center !important;
    border-radius: 16px !important;
    padding: 14px 14px !important;

    background: rgba(250,250,247,.98) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(11,31,51,.14) !important;
    box-shadow: 0 16px 40px rgba(11,31,51,.20) !important;

    white-space: nowrap !important;
  }

  /* Prevent the number from breaking */
  header .phone-pill span,
  header .phone-pill strong{
    white-space: nowrap !important;
  }
}

/* Extra-small phones: slightly tighter padding */
@media (max-width: 420px){
  header .phone-pill{
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    padding: 13px 12px !important;
  }
  body{ padding-bottom: 98px !important; }
}
/* ===============================
   FORCE sticky phone at bottom
   =============================== */
@media (max-width: 820px){

  /* Make sure page doesn't hide behind sticky phone */
  body{ padding-bottom: 92px !important; }

  /* Target phone pill anywhere, not just inside header */
  a.phone-pill{
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;

    z-index: 999999 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    max-width: 520px !important;
    margin: 0 auto !important;

    padding: 14px 14px !important;
    border-radius: 16px !important;

    background: rgba(250,250,247,.98) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(11,31,51,.14) !important;
    box-shadow: 0 16px 40px rgba(11,31,51,.20) !important;

    white-space: nowrap !important;
  }

  /* Prevent the number from splitting */
  a.phone-pill span,
  a.phone-pill strong{
    white-space: nowrap !important;
  }
}
/* ===== Bulletproof “Sticky” Header (Fixed + Spacer) ===== */
header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 999999 !important;
  background: rgba(250,250,247,.96) !important;
  backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(11,31,51,.10) !important;
}

/* Spacer takes the header height so content doesn't jump under it */
.header-spacer{
  height: 84px; /* default fallback */
}

/* Mobile: header usually taller */
@media (max-width: 820px){
  .header-spacer{ height: 104px; }
}/* End custom CSS */