/*!
 * [CALLBACK 2026-08-31] Sitewide phone-first capture: mobile call pill,
 * callback modal, desktop slide-in, and the inline .ll-cb-form rows baked
 * into the generated pages (green CTA band and mid-page sections).
 * Scoped .llcb- / .ll-cb- throughout. Ships in <head> so first layout is
 * final (zero CLS).
 *
 * [CONSISTENCY 2026-08-31 v10] Every identity property is pinned with
 * !important, ll-chat.js style: the legacy signup pages carry hostile
 * globals (body{font-weight:300}, template h3/p/input/button/a rules) that
 * restyled the popup. Within this sheet the cascade order is base rule ->
 * variant rule -> media rule, so equal-importance later rules still win as
 * designed. Transitions/transforms/opacity states keep their specificity
 * ladder. Page CSS must never restyle the widget.
 */
/* [AUDIT r5 2026-09-01] .ll-cb-next lives OUTSIDE the form element on the page
   sections, so it is pinned here too. */
.llcb-overlay *,.llcb-slidein *,.ll-cb-form *,.llcb-pill *,.ll-cb-next *{box-sizing:border-box !important}
.llcb-overlay,.llcb-slidein,.ll-cb-form,.llcb-pill,.ll-cb-next{box-sizing:border-box !important}
.llcb-overlay,.llcb-overlay *,.llcb-slidein,.llcb-slidein *,.ll-cb-form,.ll-cb-form *,.llcb-pill,.llcb-pill *,.ll-cb-next,.ll-cb-next *{font-family:Rubik,Lato,Arial,sans-serif !important;text-transform:none !important;letter-spacing:normal !important}
a[data-ll-callback]{cursor:pointer}

/* ------------------------- inline forms ------------------------- */
.ll-cb-form{margin:0 !important}
.ll-cb-fields{display:flex !important;gap:10px !important;flex-wrap:wrap !important;max-width:680px}
.ll-cb-fields input{flex:1 1 180px;min-width:0;height:48px !important;margin:0 !important;border:0 !important;border-radius:9px !important;padding:0 14px !important;font-size:16px !important;font-weight:400 !important;line-height:normal !important;color:#20303c !important;background:#fff !important;outline:none;box-shadow:none !important;-webkit-appearance:none;appearance:none}
.ll-cb-fields input::placeholder{color:#8a98a3 !important;opacity:1 !important}
.ll-cb-fields input[aria-invalid="true"]{box-shadow:0 0 0 3px rgba(200,54,43,.55) !important}
/* [ZIP 2026-09-01] The ZIP box is narrower on the horizontal inline rows so name,
   mobile, ZIP and the button still fit one 680px line; the modal column rule
   below (equal specificity, later) widens it back to 100% there. */
.ll-cb-fields input[name="zip"]{flex:0 1 130px !important;min-width:110px}
/* [AUDIT r5 2026-09-01] Phones: the inline rows stack as full-width fields and
   a full-width button. Without this the 130px ZIP box sat alone on its own
   line next to nothing while name and mobile stretched. */
@media (max-width:767px){
  .ll-cb-fields input,.ll-cb-fields input[name="zip"],.ll-cb-fields .ll-cb-submit{flex:1 1 100% !important;width:100% !important;min-width:0 !important}
  .ll-cb-next .ll-cb-next-lead{flex:1 1 100% !important;margin:0 !important}
  .ll-cb-next .ll-cb-btn{flex:1 1 calc(50% - 6px) !important;padding:0 12px !important}
}
.ll-cb-submit{flex:0 0 auto;-webkit-appearance:none !important;appearance:none !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;height:48px !important;margin:0 !important;padding:0 26px !important;border:0 !important;border-radius:9px !important;font-size:16px !important;font-weight:600 !important;line-height:normal !important;letter-spacing:.2px !important;text-decoration:none !important;cursor:pointer}
.ll-cb-submit[disabled]{opacity:.65;cursor:default}
.ll-cb-hp{position:absolute !important;left:-9999px !important;top:-9999px !important;height:0 !important;width:0 !important;overflow:hidden !important}
.ll-cb-status{display:none;margin:10px 0 0 !important;padding:10px 14px !important;border-radius:8px !important;font-size:14px !important;font-weight:400 !important;line-height:1.5 !important;max-width:680px}
.ll-cb-status.ll-cb-err{display:block;background:#fdecec !important;border:1px solid #f3c6c1 !important;color:#b3261e !important}
.ll-cb-done{margin:6px 0 !important;font-size:16px !important;font-weight:500 !important;line-height:1.5 !important}
.ll-cb-lead{font-size:16px !important;font-weight:400 !important;line-height:1.6 !important;margin:0 0 12px !important}


/* [CAPTCHA] Badge hidden sitewide. [RECAPTCHA-FOOTER 2026-09-04] The Google
   attribution Google requires in exchange is printed ONCE, in the site footer
   partial (and the signup pages' own copyright line); no capture surface
   renders it, so the old .ll-cb-rc rules are gone. */
.grecaptcha-badge{visibility:hidden !important}

/* On the green CTA band (#259457) */
.ll-cb-band .ll-cb-lead{color:#eafaf1 !important;max-width:680px}
.ll-cb-band .ll-cb-fields input{border:1px solid rgba(255,255,255,.35) !important}
.ll-cb-band .ll-cb-fields input:focus{box-shadow:0 0 0 3px rgba(255,255,255,.35) !important}
.ll-cb-band .ll-cb-submit{background:#fff !important;color:#1d7a48 !important}
.ll-cb-band .ll-cb-submit:hover{background:#e9f5ee !important;color:#1d7a48 !important}
.ll-cb-band .ll-cb-done{color:#fff !important}
.ll-cb-band .ll-cb-status.ll-cb-err{background:rgba(255,255,255,.95) !important}
.ll-cb-tel{color:#fff !important;font-weight:600 !important;text-decoration:none !important}
.ll-cb-tel:hover,.ll-cb-tel:focus{color:#eafaf1 !important;text-decoration:none !important}

/* On the soft-green mid-page section (#e9f5ee) */
.ll-cb-mid .ll-cb-fields input{border:1px solid #ccd7de !important}
.ll-cb-mid .ll-cb-fields input:focus{border-color:#259457 !important;box-shadow:0 0 0 3px rgba(37,148,87,.14) !important}
.ll-cb-mid .ll-cb-fields input[aria-invalid="true"]{border-color:#c8362b !important;box-shadow:0 0 0 3px rgba(200,54,43,.12) !important}
.ll-cb-mid .ll-cb-submit{background:#259457 !important;color:#fff !important}
.ll-cb-mid .ll-cb-submit:hover{background:#1d7a48 !important;color:#fff !important}
.ll-cb-mid .ll-cb-done{color:#1d7a48 !important}
/* [CALLBACK r3 2026-09-01] No-call exits under the mid-page form: See Pricing
   (site dark yellow) + Sign Up Now (header red), same colors as the popup. */
.ll-cb-next{display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:10px 12px !important;margin:16px 0 0 !important;max-width:680px}
.ll-cb-next-lead{font-size:15px !important;font-weight:500 !important;color:#42525d !important;margin:0 4px 0 0 !important}
.ll-cb-btn{display:inline-flex !important;align-items:center !important;justify-content:center !important;height:44px !important;margin:0 !important;padding:0 22px !important;border:0 !important;border-radius:9px !important;color:#fff !important;font-size:15px !important;font-weight:600 !important;line-height:normal !important;letter-spacing:.2px !important;text-decoration:none !important;cursor:pointer;white-space:nowrap !important}
.ll-cb-btn-pricing{background:#de9600 !important;box-shadow:0 6px 16px rgba(222,150,0,.22) !important}
.ll-cb-btn-pricing:hover,.ll-cb-btn-pricing:focus{background:#c68600 !important;color:#fff !important;text-decoration:none !important}
.ll-cb-btn-signup{background:#de0000 !important;box-shadow:0 6px 16px rgba(222,0,0,.2) !important}
.ll-cb-btn-signup:hover,.ll-cb-btn-signup:focus{background:#c40000 !important;color:#fff !important;text-decoration:none !important}

/* ---------------------- mobile bottom pill row -------------------- */
/* [MOBILE-ROW r3] Three floating pills fill the row: equal thirds of
   (100vw - 44px), 12px edges, 10px gaps, centered content. Keep the width
   formula identical in all three rules. */
.llcb-pill{display:none}
@media (max-width:767px){
  /* [AUDIT r2] All three pills carry an EXPLICIT height:44px: each one
     otherwise derives height from a different inherited line-height (page
     template vs chat widget vs ours) and they visibly mismatch. Keep the
     height identical in all three rules below. */
  .llcb-pill{display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:5px !important;position:fixed !important;left:50% !important;transform:translateX(-50%);bottom:20px !important;z-index:999;width:calc((100vw - 44px)/3) !important;height:44px !important;background-color:#1570b3 !important;color:#fff !important;padding:0 6px !important;font-size:16px !important;font-weight:700 !important;line-height:normal !important;text-decoration:none !important;border-radius:50px !important;box-shadow:2px 2px 5px rgba(0,0,0,.3) !important;cursor:pointer;white-space:nowrap !important}
  .llcb-pill svg{width:16px !important;height:16px !important;flex:0 0 auto}
  .llcb-pill:hover,.llcb-pill:focus,.llcb-pill:active{background-color:#115e96 !important;color:#fff !important;text-decoration:none !important}

  /* Demo pill: darker yellow so the label reads WHITE (site orange token) */
  html body .mobile-demo-button{display:flex !important;align-items:center !important;justify-content:center !important;box-sizing:border-box !important;width:calc((100vw - 44px)/3) !important;height:44px !important;background-color:#de9600 !important;color:#fff !important;left:12px !important;bottom:20px !important;padding:0 6px !important;font-size:16px !important;font-weight:700 !important;line-height:normal !important;box-shadow:2px 2px 5px rgba(0,0,0,.3) !important;white-space:nowrap !important}
  html body .mobile-demo-button i{color:#fff !important;margin-right:5px !important;font-size:15px !important}

  /* Chat pill (runtime launcher AND the static boot placeholder) */
  html body .llwc-launcher,html body #llwc-boot{justify-content:center !important;box-sizing:border-box !important;width:calc((100vw - 44px)/3) !important;height:44px !important;right:12px !important;bottom:20px !important;padding:0 6px !important;font-size:16px !important;font-weight:700 !important;line-height:normal !important;gap:5px !important;box-shadow:2px 2px 5px rgba(0,0,0,.3) !important;white-space:nowrap !important}
  html body .llwc-launcher svg,html body #llwc-boot svg{width:16px !important;height:16px !important}
}

/* ------------------------- desktop slide-in --------------------- */
/* [SLIDEIN-CARD 2026-09-01] The slide-in IS the modal card, corner
   anchored: same borderless white shell, radius and shadow, and its
   markup reuses llcb-head/llcb-title/llcb-sub/llcb-body, so the modal
   rules below style the inside (column fields, gradient submit). Only
   the fixed corner position, width, and entrance motion live here. */
.llcb-slidein{display:none}
@media (min-width:992px){
  .llcb-slidein{display:flex !important;flex-direction:column !important;position:fixed !important;left:35px !important;bottom:104px !important;z-index:1001;width:420px !important;max-width:calc(100vw - 70px) !important;max-height:calc(100vh - 130px) !important;background:#fff !important;border:0 !important;border-radius:14px !important;box-shadow:0 24px 64px rgba(10,20,30,.35) !important;padding:0 !important;margin:0 !important;color:#33434e !important;font-size:15px !important;font-weight:400 !important;line-height:1.5 !important;text-align:left !important;transform:translateY(16px);opacity:0;transition:transform .3s cubic-bezier(.22,.61,.36,1),opacity .3s ease}
  .llcb-slidein.llcb-on{transform:none;opacity:1}
  .llcb-si-alt{margin:14px 0 0 !important;font-size:13.5px !important;font-weight:400 !important;line-height:1.5 !important;color:#5b6b76 !important;text-align:center !important}
  .llcb-si-alt a{color:#1d7a48 !important;font-weight:600 !important;text-decoration:none !important;white-space:nowrap !important}
}

/* ----------------------------- modal ---------------------------- */
/* Explicit top/right/bottom/left ride alongside inset:0 on purpose:
   Safari before 14.5 ignores inset and would otherwise lose the overlay
   geometry entirely (same fix applied to ll-contact.css). */
.llcb-overlay{position:fixed !important;inset:0;top:0 !important;right:0 !important;bottom:0 !important;left:0 !important;z-index:2147481000;display:flex !important;align-items:center !important;justify-content:center !important;margin:0 !important;padding:20px !important;background:rgba(15,26,36,.55) !important;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .18s ease}
.llcb-overlay.llcb-show{opacity:1}
/* The card is a flex column with a scrollable body: the call slide-up
   (call button + form + checkbox + signup + footer) is taller than an
   iPhone SE viewport, and without this the top clips unreachably. */
.llcb-card{position:relative !important;display:flex !important;flex-direction:column !important;width:100% !important;max-width:480px !important;max-height:calc(100vh - 40px) !important;margin:0 !important;padding:0 !important;background:#fff !important;border:0 !important;border-radius:14px !important;box-shadow:0 24px 64px rgba(10,20,30,.35) !important;color:#33434e !important;font-size:15px !important;font-weight:400 !important;line-height:1.5 !important;text-align:left !important;transform:translateY(14px);transition:transform .18s ease}
.llcb-overlay.llcb-show .llcb-card{transform:translateY(0)}
.llcb-head{flex:0 0 auto;margin:0 !important;padding:22px 56px 12px 26px !important;border:0 !important;background:none !important}
.llcb-title{margin:0 !important;padding:0 !important;font-size:22px !important;line-height:28px !important;font-weight:600 !important;color:#20303c !important;border:0 !important;background:none !important;text-align:left !important}
.llcb-sub{margin:6px 0 0 !important;padding:0 !important;font-size:14px !important;font-weight:400 !important;line-height:1.55 !important;color:#5b6b76 !important;text-align:left !important}
.llcb-x{-webkit-appearance:none !important;appearance:none !important;position:absolute !important;top:14px !important;right:14px !important;width:34px !important;height:34px !important;margin:0 !important;padding:0 !important;border:0 !important;border-radius:8px !important;background:transparent !important;color:#5b6b76 !important;font-size:22px !important;font-weight:400 !important;line-height:1 !important;cursor:pointer;z-index:1}
.llcb-x:hover{background:#eef3f6 !important;color:#20303c !important}
.llcb-body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;margin:0 !important;padding:14px 26px 24px !important}
.llcb-body .ll-cb-fields{flex-direction:column !important;gap:10px !important}
.llcb-body .ll-cb-fields input{flex:1 1 auto;width:100% !important;border:1px solid #ccd7de !important}
.llcb-body .ll-cb-fields input[name="zip"]{flex:1 1 auto !important;min-width:0 !important}
.llcb-body .ll-cb-fields input:focus{border-color:#259457 !important;box-shadow:0 0 0 3px rgba(37,148,87,.14) !important}
.llcb-body .ll-cb-fields input[aria-invalid="true"]{border-color:#c8362b !important;box-shadow:0 0 0 3px rgba(200,54,43,.12) !important}
/* [COLUMN-FIX 2026-09-04] The phone media rule above hands every inline field
   flex:1 1 100% so the horizontal band rows stack. Inside the card the field
   list is a COLUMN, so that 100% is a share of the scroll body's HEIGHT: the
   name, mobile and Call Me Back rows collapsed to about 20px on phones in
   every browser while ZIP (flex auto from the rule above) kept 48px. In the
   column the items never flex; they are fixed 48px rows, full width. Keep
   this after the media rule and at higher specificity so it always wins. */
.llcb-body .ll-cb-fields input,.llcb-body .ll-cb-fields input[name="zip"],.llcb-body .ll-cb-fields .ll-cb-submit{flex:0 0 auto !important;width:100% !important;min-width:0 !important;height:48px !important}
.llcb-body .ll-cb-submit{width:100% !important;background:linear-gradient(135deg,#2aa261,#1f8a50) !important;color:#fff !important;box-shadow:0 6px 16px rgba(31,138,80,.28) !important}
.llcb-body .ll-cb-submit:hover{background:linear-gradient(135deg,#249257,#1b7a46) !important}
.llcb-body .ll-cb-done{color:#1d7a48 !important;font-size:17px !important;text-align:center !important;padding:14px 0 !important}
/* [MOBILE-ROW] Call slide-up: tap-to-call button + divider above the form */
.llcb-callbtn{display:flex !important;align-items:center !important;justify-content:center !important;gap:8px !important;width:100% !important;height:50px !important;margin:0 !important;border:0 !important;border-radius:9px !important;background:#1570b3 !important;color:#fff !important;font-size:17px !important;font-weight:600 !important;line-height:normal !important;letter-spacing:.2px !important;text-decoration:none !important;cursor:pointer;box-shadow:0 6px 16px rgba(21,112,179,.28) !important}
.llcb-callbtn:hover,.llcb-callbtn:focus,.llcb-callbtn:active{background:#115e96 !important;color:#fff !important;text-decoration:none !important}
.llcb-or{margin:14px 0 10px !important;font-size:13.5px !important;font-weight:500 !important;color:#7a8893 !important;text-align:center !important}

/* [ROUTER v9] Modal first step: three equal full-width direction buttons
   (Please Call Me / See Pricing / Sign Up Now), then the centered footer. */
.llcb-gate{margin:0 !important;padding:2px 0 4px !important}
.llcb-gate-lead{margin:0 0 16px !important;font-size:15px !important;font-weight:400 !important;line-height:1.6 !important;color:#33434e !important;text-align:left !important}
.llcb-gate-btn{display:flex !important;align-items:center !important;justify-content:center !important;width:100% !important;height:48px !important;margin:0 0 10px !important;padding:0 !important;border:0 !important;border-radius:9px !important;background:linear-gradient(135deg,#2aa261,#1f8a50) !important;color:#fff !important;font-size:16px !important;font-weight:600 !important;line-height:normal !important;letter-spacing:.2px !important;text-decoration:none !important;cursor:pointer;box-shadow:0 6px 16px rgba(31,138,80,.28) !important}
.llcb-gate-btn:hover,.llcb-gate-btn:focus{background:linear-gradient(135deg,#249257,#1b7a46) !important;color:#fff !important;text-decoration:none !important}
/* Router button colors (owner 2026-08-31): blue call, dark-yellow pricing,
   green signup. These come AFTER the base rule so their !important wins. */
.llcb-gate-btn.llcb-gate-call{background:#1570b3 !important;box-shadow:0 6px 16px rgba(21,112,179,.28) !important}
.llcb-gate-btn.llcb-gate-call:hover,.llcb-gate-btn.llcb-gate-call:focus{background:#115e96 !important}
.llcb-gate-btn.llcb-gate-pricing{background:#de9600 !important;box-shadow:0 6px 16px rgba(222,150,0,.28) !important}
.llcb-gate-btn.llcb-gate-pricing:hover,.llcb-gate-btn.llcb-gate-pricing:focus{background:#c68600 !important}
/* [SIGNUP-RED 2026-09-01] Sign Up Now is the header SIGN UP red (#de0000, the
   site red also used by the strapline) in the router AND under the form. */
.llcb-gate-btn.llcb-gate-signup{background:#de0000 !important;box-shadow:0 6px 16px rgba(222,0,0,.24) !important}
.llcb-gate-btn.llcb-gate-signup:hover,.llcb-gate-btn.llcb-gate-signup:focus{background:#c40000 !important}
/* [NEXT-STEPS 2026-09-01] Under the popup form: a hairline rule, then See
   Pricing (dark yellow) and Sign Up Now (green) reuse the router button
   rules above. Replaces the pricing checkbox + the old outline signup
   button (.llcb-signup-alt, removed) so the area under Call Me Back is
   two buttons, not a paragraph. */
.llcb-next{margin:0 !important;padding:0 !important}
.llcb-divider{display:block !important;height:1px !important;margin:18px 0 16px !important;padding:0 !important;border:0 !important;background:#e3e9ed !important}
.llcb-next .llcb-gate-btn:last-child{margin-bottom:0 !important}

/* [LAYOUT v9] Centered footer stack at the very bottom of the popup:
   the two tap-to-call lines, the verify line, then the attribution last. */
.llcb-foot{margin:16px 0 0 !important;padding:0 !important;text-align:center !important}
.llcb-foot p{margin:0 !important;padding:0 !important;text-align:center !important}
.llcb-foot-l1{font-size:14px !important;font-weight:400 !important;line-height:1.5 !important;color:#5b6b76 !important}
.llcb-foot-l2{margin:2px 0 0 !important;font-size:14px !important;font-weight:400 !important;line-height:1.5 !important;color:#5b6b76 !important}
.llcb-foot-verify{margin:10px 0 0 !important;font-size:12px !important;font-weight:400 !important;line-height:1.5 !important;color:#7a8893 !important}
.llcb-alt-tel{color:#1d7a48 !important;font-weight:600 !important;text-decoration:none !important}
.llcb-alt-tel:hover{color:#259457 !important;text-decoration:none !important}
@media (max-width:640px){
  .llcb-overlay{padding:0 !important;align-items:flex-end !important}
  .llcb-card{max-width:none !important;max-height:94vh !important;border-radius:16px 16px 0 0 !important;transform:translateY(30px)}
  .llcb-head{padding:20px 52px 10px 20px !important}
  .llcb-body{padding:12px 20px calc(20px + env(safe-area-inset-bottom)) !important}
}
