/* ==========================================================================
   /cxbot page ("MoP ッ - Machi") - page specific styles, scoped under body.page-cxbot.
   Sections: dark hero, About (intro + stats + use cases + caso de éxito + PanelCRM tabs),
   Nuestro proceso, Casos reales (cards + tags), results grid overrides, FAQ variant, CTA variant.
   The live phone breakpoint (< 768px) shows different component variants / copy: .only-d / .only-m
   ========================================================================== */
@media (min-width: 768px) { body.page-cxbot .only-m { display: none !important; } }
@media (max-width: 767px) { body.page-cxbot .only-d { display: none !important; } }

/* ---------- dots texture figure (Framer "Abstract Dots", almost invisible) ---------- */
body.page-cxbot .cx-dots { position: absolute; inset: -2px 0; margin: 0; border-radius: inherit; overflow: hidden; pointer-events: none; z-index: 0; }
body.page-cxbot .cx-dots img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Hero ---------- */
body.page-cxbot .cx-hero { position: relative; display: flex; justify-content: center; align-items: center; min-height: 751px; background: var(--c-dark); overflow: hidden; }
body.page-cxbot .cx-hero__bg { position: absolute; inset: 0; z-index: 0; filter: brightness(0.59) contrast(0.91); } /* live "Wrap" filter: darkens photo + robot + noise */
body.page-cxbot .cx-hero__photo { position: absolute; left: 0; top: -72px; width: 100%; height: 823px; object-fit: cover; }
body.page-cxbot .cx-hero__robot { position: absolute; left: 50%; top: -56px; width: 663px; height: 1110px; margin-left: -332px; object-fit: cover; filter: brightness(0.89) contrast(0.87); } /* live robot container filter (on top of the Wrap one) */
body.page-cxbot .cx-hero__noise { position: absolute; inset: 0; background: url("../assets/rR6HYXBrMmX4cRpXfXUOvpvpB0.png") repeat; background-size: 256px; opacity: 0.05; }
body.page-cxbot .cx-hero__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 36px; width: 100%; max-width: 872px; padding: 98px 0 120px; }
body.page-cxbot .cx-hero__content { display: flex; flex-direction: column; align-items: center; gap: 32px; width: 100%; padding: 68px 0 40px; }
body.page-cxbot .cx-hero__title { font-family: var(--f-dm); font-weight: 300; font-size: 74px; line-height: 74px; letter-spacing: -0.06em; color: #f4f2ef; text-align: center; }
body.page-cxbot .cx-hero__lead { max-width: 500px; font-family: var(--f-general); font-weight: 400; font-size: 23px; line-height: 1.2; letter-spacing: -0.02em; color: var(--c-bg); text-align: center; }
body.page-cxbot .cx-hero__cta { display: flex; justify-content: center; }
body.page-cxbot .cx-hero__btn { display: inline-flex; align-items: center; justify-content: center; gap: 4px; width: 291px; height: 36px; padding: 8px; background: var(--c-green); border-radius: 36px; font-family: var(--f-is); font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.01em; color: var(--c-text); transition: background-color 0.2s var(--ease-out), color 0.2s var(--ease-out); }
body.page-cxbot .cx-hero__btn:hover { background: rgb(17, 250, 141); color: rgb(145, 125, 145); } /* live: hover variant of the Framer pill */
body.page-cxbot .cx-hero__btn span { padding: 0 4px; }
body.page-cxbot .cx-hero__btn svg { width: 20px; height: 20px; }
body.page-cxbot .cx-pills { display: flex; justify-content: center; align-items: center; gap: 10px; width: 100%; }
body.page-cxbot .cx-pill { position: relative; flex: none; border-radius: 47px; }
body.page-cxbot .cx-pill__box { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; padding: 13px 22px; background: var(--c-white); border-radius: 76px; }
body.page-cxbot .cx-pill__icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 8px; background: #12fb8d; border-radius: 30px; flex: none; }
body.page-cxbot .cx-pill__icon svg { width: 20px; height: 20px; fill: rgba(0, 0, 0, 0.6); }
body.page-cxbot .cx-pill__text { font-family: var(--f-dm); font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: -0.5px; color: var(--c-text); white-space: nowrap; }

/* ---------- About wrapper ---------- */
body.page-cxbot .cx-about { display: flex; flex-direction: column; align-items: center; padding: 0 50px 70px; background: var(--c-bg); }
body.page-cxbot .cx-about__container { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 1340px; padding-top: 112px; border-radius: 70px; }

/* intro */
body.page-cxbot .cx-intro { display: flex; flex-direction: column; align-items: center; gap: var(--sp-5); width: 100%; max-width: 1280px; padding: 0 var(--sp-6); }
body.page-cxbot .cx-intro__title { max-width: 899px; font-family: var(--f-dm); font-weight: 300; font-size: 48px; line-height: 1.1; letter-spacing: -0.05em; color: #4a4848; text-align: center; }
body.page-cxbot .cx-intro__title strong { font-weight: 400; }
body.page-cxbot .cx-intro__lead { max-width: 640px; font-family: var(--f-satoshi); font-weight: 400; font-size: 20px; line-height: 30px; letter-spacing: -0.02em; color: #262423; text-align: center; }
body.page-cxbot .cx-stats { width: 85%; padding: 56px 32px 4px; border-radius: var(--r-md); } /* live: row 28px lower inside the same 196px box */
body.page-cxbot .cx-stats__row { display: flex; justify-content: center; align-items: center; gap: var(--sp-7); }
body.page-cxbot .cx-stat { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; width: 313px; flex: none; padding-bottom: 26px; border-bottom: 1px solid rgba(230, 230, 230, 0.1); }
body.page-cxbot .cx-stat__n { font-family: var(--f-dm); font-weight: 300; font-size: 46px; line-height: 1; letter-spacing: -0.05em; color: #3d3c3c; }
/* live gives each desktop stat its own grey (2nd and 3rd differ from the 1st) */
body.page-cxbot .cx-stats--d .cx-stat:nth-child(2) .cx-stat__n { color: #474545; }
body.page-cxbot .cx-stats--d .cx-stat:nth-child(2) .cx-stat__t { color: #383635; }
body.page-cxbot .cx-stats--d .cx-stat:nth-child(3) .cx-stat__n { color: #333130; }
body.page-cxbot .cx-stats--d .cx-stat:nth-child(3) .cx-stat__t { color: #262524; }
body.page-cxbot .cx-stat__t { max-width: 245px; font-family: var(--f-satoshi); font-weight: 400; font-size: 18px; line-height: 1.5; color: #3b3a39; }
body.page-cxbot .cx-intro__sub { max-width: 899px; font-family: var(--f-is); font-weight: 400; font-size: 33px; line-height: 1.1; letter-spacing: -0.04em; color: #302f2e; text-align: center; }

/* use cases */
body.page-cxbot .cx-cases { width: 100%; max-width: 1280px; padding: 0 60px; }
body.page-cxbot .cx-cases__inner { display: flex; justify-content: center; align-items: flex-start; gap: 96px; border-radius: var(--r-lg); }
body.page-cxbot .cx-cases__col { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 504px; flex: none; }
body.page-cxbot .cx-case { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--sp-5); width: 100%; height: 900px; }
body.page-cxbot .cx-cases__sticky { position: sticky; top: 0; width: 560px; height: 900px; flex: none; }
body.page-cxbot .cx-cat { display: inline-flex; align-items: center; gap: 12px; padding: 7px 15px; border: 1px solid rgba(17, 16, 17, 0.1); border-radius: var(--r-md); font-family: var(--f-satoshi); font-weight: 500; font-size: 14px; line-height: 21px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-ink-60); }
body.page-cxbot .cx-cat svg { width: 24px; height: 24px; flex: none; }
body.page-cxbot .cx-case__title { text-wrap: balance; font-family: var(--f-dm); font-weight: 300; font-size: 36px; line-height: 1.2; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-cxbot .cx-case__text { max-width: 640px; font-family: var(--f-satoshi); font-weight: 400; font-size: 20px; line-height: 30px; letter-spacing: -0.02em; color: var(--c-text); }
body.page-cxbot .cx-case__img { width: 100%; height: 263px; border-radius: var(--r-md); overflow: hidden; }
body.page-cxbot .cx-case__img img { width: 100%; height: 100%; object-fit: cover; }

/* caso de exito */
body.page-cxbot .cx-success { display: flex; flex-direction: column; align-items: center; gap: 60px; width: 100%; padding-bottom: 77px; }
body.page-cxbot .cx-success__top { display: flex; flex-direction: column; align-items: center; gap: 30px; width: 100%; max-width: 680px; padding: 0 120px; box-sizing: content-box; }
body.page-cxbot .cx-tag { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px; border-radius: 40px; font-family: var(--f-dm); font-weight: 500; font-size: 14px; line-height: 26px; letter-spacing: -0.5px; color: #131313; }
body.page-cxbot .cx-tag--grey { padding: 6px 16px 6px 6px; background: #f7f6f5; }
body.page-cxbot .cx-tag--white { background: var(--c-white); }
body.page-cxbot .cx-tag--dark { background: linear-gradient(rgba(255, 255, 255, 0.08) -100%, rgba(255, 255, 255, 0.05) 100%); border: 1px solid rgba(79, 26, 214, 0.15); }
body.page-cxbot .cx-tag__icon { display: flex; align-items: center; justify-content: center; width: 29px; height: 29px; padding: 8px; background: #7842ed; border-radius: 30px; flex: none; }
body.page-cxbot .cx-tag__icon svg { width: 13px; height: 13px; }
body.page-cxbot .cx-success__title { display: flex; flex-direction: column; align-items: center; width: 100%; }
body.page-cxbot .cx-success__h { font-family: var(--f-dm); font-weight: 300; font-size: 46px; line-height: 50px; letter-spacing: -1.9px; color: #080808; text-align: center; }
body.page-cxbot .cx-success__h--serif { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--c-text); }
body.page-cxbot .cx-success__body { max-width: 463px; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #131313; text-align: center; }
body.page-cxbot .cx-compare { display: flex; justify-content: space-between; align-items: center; width: 100%; max-width: 1148px; padding: 40px; background: #f7f6f5; border-radius: 30px; }
body.page-cxbot .cx-compare__card { display: flex; flex-direction: column; align-items: center; width: 450px; max-width: 100%; }
body.page-cxbot .cx-compare__h { align-self: stretch; padding-left: 35px; font-family: var(--f-dm); font-weight: 400; font-size: 20px; line-height: 50px; letter-spacing: -1.9px; color: var(--c-text); text-align: left; }
body.page-cxbot .cx-compare__h--serif { font-family: "Playfair Display", "Playfair Display Placeholder", serif; font-style: italic; }
body.page-cxbot .cx-list { position: relative; display: flex; flex-direction: column; gap: 22px; width: 100%; padding: 30px; border-radius: 20px; }
body.page-cxbot .cx-list--pos { background: var(--c-bg); }
body.page-cxbot .cx-list__dots { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; }
body.page-cxbot .cx-list__dots img { width: 100%; height: 100%; object-fit: cover; }
body.page-cxbot .cx-list li:not(.cx-list__dots) { position: relative; display: flex; align-items: flex-start; gap: 10px; width: 100%; }
body.page-cxbot .cx-list__icon { width: 23px; height: 23px; flex: none; margin-top: 1px; }
body.page-cxbot .cx-list__icon svg { width: 23px; height: 23px; }
body.page-cxbot .cx-list__icon--neg { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 23 23'%3E%3Cpath d='M 21.323 11.5 C 21.304 10.825 21.098 10.167 20.727 9.601 C 20.357 9.037 19.836 8.585 19.224 8.299 C 19.457 7.664 19.506 6.977 19.37 6.315 C 19.233 5.653 18.913 5.042 18.448 4.552 C 17.957 4.087 17.347 3.768 16.684 3.63 C 16.023 3.494 15.336 3.543 14.701 3.776 C 14.416 3.162 13.965 2.641 13.4 2.271 C 12.834 1.9 12.176 1.693 11.5 1.677 C 10.825 1.695 10.169 1.899 9.605 2.271 C 9.04 2.642 8.592 3.163 8.308 3.776 C 7.673 3.543 6.984 3.492 6.32 3.63 C 5.656 3.766 5.044 4.085 4.553 4.552 C 4.088 5.043 3.77 5.655 3.635 6.316 C 3.499 6.978 3.551 7.665 3.786 8.299 C 3.172 8.585 2.649 9.036 2.277 9.6 C 1.905 10.165 1.697 10.823 1.677 11.5 C 1.698 12.176 1.905 12.834 2.277 13.399 C 2.649 13.964 3.172 14.416 3.786 14.701 C 3.551 15.335 3.499 16.021 3.635 16.683 C 3.771 17.346 4.088 17.957 4.552 18.448 C 5.043 18.911 5.654 19.229 6.316 19.366 C 6.977 19.504 7.664 19.454 8.299 19.224 C 8.585 19.836 9.036 20.357 9.601 20.728 C 10.166 21.098 10.825 21.304 11.5 21.323 C 12.176 21.306 12.834 21.1 13.4 20.73 C 13.965 20.36 14.416 19.837 14.701 19.225 C 15.333 19.475 16.025 19.534 16.691 19.396 C 17.356 19.258 17.966 18.929 18.447 18.448 C 18.928 17.967 19.258 17.357 19.396 16.691 C 19.534 16.025 19.475 15.332 19.224 14.701 C 19.836 14.415 20.357 13.964 20.728 13.398 C 21.098 12.834 21.304 12.175 21.323 11.5 Z M 10.101 15.525 L 6.516 11.941 L 7.868 10.58 L 10.034 12.746 L 14.634 7.734 L 16.042 9.037 Z' fill='rgb%28255,4,0%29'%3E%3C/path%3E%3Cpath d='M 6 16 L 6 7 L 17 7 L 17 16 Z' fill='rgb%28255,4,0%29'%3E%3C/path%3E%3Cpath d='M 15.207 9.414 L 13.793 8 L 11.5 10.293 L 9.207 8 L 7.793 9.414 L 10.086 11.707 L 7.793 14 L 9.207 15.414 L 11.5 13.121 L 13.793 15.414 L 15.207 14 L 12.914 11.707 Z' fill='rgb%28255,255,255%29'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat; }
body.page-cxbot .cx-list h4 { font-family: var(--f-dm); font-weight: 300; font-size: 18px; line-height: 26px; letter-spacing: -0.5px; color: var(--c-text); }
body.page-cxbot .cx-list p { font-family: var(--f-dm); font-weight: 300; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #000; }
body.page-cxbot .cx-tower { max-width: 899px; font-family: var(--f-dm); font-weight: 300; font-size: 72px; line-height: 1.1; letter-spacing: -0.05em; color: var(--c-ink); text-align: center; }

/* PanelCRM feature with tabs */
body.page-cxbot .cx-feature { width: 100%; padding-bottom: 53px; }
body.page-cxbot .cx-feature__inner { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 49px; width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 60px; }
body.page-cxbot .cx-tabs { position: absolute; top: 8px; right: 60px; display: flex; gap: var(--sp-6); }
body.page-cxbot .cx-tab { display: flex; flex-direction: column; gap: 12px; flex: none; cursor: pointer; }
body.page-cxbot .cx-tab p { font-family: var(--f-satoshi); font-weight: 500; font-size: 18px; line-height: 1.2; letter-spacing: -0.02em; color: rgba(17, 16, 17, 0.4); white-space: nowrap; }
body.page-cxbot .cx-tab.is-active p { color: var(--c-text); }
body.page-cxbot .cx-tab__line { display: block; height: 2px; background: var(--c-ink-60); border-radius: 4px; opacity: 0.12; }
body.page-cxbot .cx-tab.is-active .cx-tab__line { opacity: 1; }
/* live: inactive tabs brighten slightly on hover (text .4 -> .6, underline .12 -> .24) */
body.page-cxbot .cx-tab p, body.page-cxbot .cx-tab__line { transition: color 0.3s var(--ease-out), opacity 0.3s var(--ease-out); }
body.page-cxbot .cx-tab:not(.is-active):hover p { color: rgba(17, 16, 17, 0.6); }
body.page-cxbot .cx-tab:not(.is-active):hover .cx-tab__line { opacity: 0.24; }
body.page-cxbot .cx-feature__content { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 409px; padding-top: 34px; } /* live: title starts 34px below the tabs row (ref y=6433 vs tabs 6406) */
body.page-cxbot .cx-feature__title { font-family: var(--f-dm); font-weight: 300; font-size: 46px; line-height: 1.1; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-cxbot .cx-feature__title strong { font-weight: 400; }
body.page-cxbot .cx-feature__text { font-family: var(--f-satoshi); font-weight: 400; font-size: 18px; line-height: 1.5; color: var(--c-text); }
body.page-cxbot .cx-feature__images { display: flex; justify-content: center; align-items: flex-end; gap: var(--sp-5); width: 100%; height: 375px; }
body.page-cxbot .cx-feature__img1 { width: 410px; height: 375px; border-radius: 64px; flex: none; }
body.page-cxbot .cx-feature__img1 svg { width: 100%; height: 100%; }
body.page-cxbot .cx-feature__img2 { display: flex; align-items: center; justify-content: center; width: 546px; height: 514px; flex: none; background: #f7f6f5; border-radius: 60px; }
body.page-cxbot .cx-feature__img2 img { width: 493px; height: 395px; object-fit: cover; }

/* ---------- Nuestro proceso ---------- */
body.page-cxbot .cx-process { display: flex; flex-direction: column; align-items: center; gap: 60px; }
body.page-cxbot .cx-process__top { display: flex; flex-direction: column; align-items: center; gap: 30px; width: 100%; max-width: 630px; padding-top: 100px; }
body.page-cxbot .cx-process__title { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 100%; }
body.page-cxbot .cx-process__h { font-family: var(--f-dm); font-weight: 400; font-size: 54px; line-height: 50px; letter-spacing: -1.9px; color: #080808; text-align: center; }
body.page-cxbot .cx-process__text { max-width: 520px; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #131313; text-align: center; }
body.page-cxbot .cx-steps { display: flex; justify-content: center; align-items: center; width: 100%; max-width: 1200px; padding: 30px; background: var(--c-white); border-radius: 30px; }
body.page-cxbot .cx-step { position: relative; display: flex; flex-direction: column; align-items: center; width: 380px; padding: 30px; background: var(--c-white); border-radius: 20px; }
body.page-cxbot .cx-step__body { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: var(--sp-4); width: 100%; }
body.page-cxbot .cx-step__h { font-family: var(--f-dm); font-weight: 400; font-size: 28px; line-height: 30px; letter-spacing: -0.6px; color: var(--c-text); text-align: center; }
body.page-cxbot .cx-step__p { font-family: var(--f-dm); font-weight: 400; font-size: 17px; line-height: 26px; letter-spacing: -0.5px; color: var(--c-ink-60); text-align: center; }

/* ---------- Casos reales de uso ---------- */
body.page-cxbot .cx-services { display: flex; flex-direction: column; align-items: center; padding: 109px 80px 0; }
body.page-cxbot .cx-services__container { display: flex; flex-direction: column; align-items: center; gap: 60px; width: 100%; max-width: 1280px; padding: 0 80px 60px; border-radius: 20px; }
body.page-cxbot .cx-services__head { display: flex; flex-direction: column; align-items: center; gap: 19px; width: 100%; max-width: 800px; }
body.page-cxbot .cx-services__h { font-family: var(--f-dm); font-weight: 400; font-size: 37px; line-height: 33px; letter-spacing: -1.9px; color: #2b2b2b; text-align: center; }
body.page-cxbot .cx-services__p { max-width: 450px; font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #1c1c1c; text-align: center; }
body.page-cxbot .cx-services__cta { display: flex; justify-content: center; }
body.page-cxbot .cx-services__cta .btn { min-height: 46px; }
body.page-cxbot .cx-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); width: 100%; max-width: 1160px; }
body.page-cxbot .cx-card { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; min-height: 255px; padding: 30px; background: var(--c-white); border-radius: 20px; } /* live: no hover effect on the cards */
body.page-cxbot .cx-card__content { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 19px; width: 100%; }
body.page-cxbot .cx-card__mid { display: flex; flex-direction: column; width: 100%; }
body.page-cxbot .cx-card h4 { font-family: var(--f-dm); font-weight: 500; font-size: 24px; line-height: 26px; letter-spacing: -0.5px; color: #3d3d3d; }
body.page-cxbot .cx-card p { font-family: var(--f-dm); font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: -0.2px; color: #3d3d3d; }
body.page-cxbot .cx-card__sep { display: block; width: 230px; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 100%); }
body.page-cxbot .cx-tags { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 20px; width: 100%; max-width: 896px; }
body.page-cxbot .cx-tagpill { position: relative; flex: none; padding: 13px 14px; background: var(--c-white); border-radius: 17px; }
body.page-cxbot .cx-tagpill span { position: relative; z-index: 1; font-family: var(--f-dm); font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: -0.5px; color: #424242; white-space: nowrap; }

/* ---------- Results grid: coloured cards on this page ---------- */
body.page-cxbot .results__container { padding: 120px 0 128px; }
body.page-cxbot .results__title { text-wrap: balance; }
body.page-cxbot .results__stat { font-weight: 500; letter-spacing: -0.72px; }
body.page-cxbot .results__stat .n { letter-spacing: -2px; line-height: 1.2; }
body.page-cxbot .results__card--c1 { background: linear-gradient(rgb(255, 255, 255) 49.9067%, rgb(169, 223, 172) 100%); }
body.page-cxbot .results__card--c1 .results__stat, body.page-cxbot .results__card--c1 .results__caption { color: #6f9954; }
body.page-cxbot .results__card--c2 { background: #e5dbeb; }
body.page-cxbot .results__card--c2 .results__caption { color: #987da5; }
body.page-cxbot .results__card--c3 { background: linear-gradient(rgb(255, 255, 255) 0%, rgb(216, 200, 250) 100%); }
body.page-cxbot .results__card--c3 .results__caption { color: #94a1aa; }
body.page-cxbot .results__card--c4 { background: linear-gradient(rgb(253, 253, 255) 0%, rgb(250, 228, 208) 100%); }
body.page-cxbot .results__card--c4 .results__stat, body.page-cxbot .results__card--c4 .results__caption { color: #c28951; }

/* ---------- FAQ: heading lives inside the white container on this page ---------- */
body.page-cxbot .faq { gap: 0; }
body.page-cxbot .faq__container { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-8); padding: 120px 60px; }
body.page-cxbot .faq__heading { justify-content: center; width: 100%; padding: 0; }
body.page-cxbot .faq__list { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 var(--sp-8); }

/* ---------- Closing CTA: "Tablet" variant on this page (full width card, 51px title) ---------- */
body.page-cxbot .cta-final { padding: 0 0 50px; }
body.page-cxbot .cta-final__container { padding: 15px 30px 80px; }
body.page-cxbot .cta-final__card { width: 100%; min-height: 327px; margin: 0; gap: 38px; padding: 69px 0; border-radius: var(--r-md); }
body.page-cxbot .cta-final__title { max-width: 1132px; font-size: 51px; line-height: 0.9; letter-spacing: -0.04em; color: var(--c-ink); }
body.page-cxbot .site-footer__social { padding: 0; }

/* ========================================================================== tablet */
@media (max-width: 1199px) {
  body.page-cxbot .cx-stats { width: 100%; }
  body.page-cxbot .cx-stats__row { flex-wrap: wrap; }
  body.page-cxbot .cx-stat { width: calc(50% - 24px); }
  body.page-cxbot .cx-success__top { padding: 0 30px; box-sizing: border-box; }
  body.page-cxbot .cx-cases__inner { gap: var(--sp-6); }
  body.page-cxbot .cx-cases__col { width: 60%; }
  body.page-cxbot .cx-cases__sticky { width: 40%; flex: 1; }
  body.page-cxbot .cx-case { height: auto; min-height: 420px; }
  body.page-cxbot .cx-compare { flex-direction: column; gap: 20px; }
  body.page-cxbot .cx-tower { font-size: 56px; }
  body.page-cxbot .cx-feature__inner { padding: 0 20px; }
  body.page-cxbot .cx-tabs { position: static; width: 100%; gap: clamp(0px, calc((100vw - 768px) / 6), 32px); overflow-x: auto; scrollbar-width: none; }
  body.page-cxbot .cx-tabs::-webkit-scrollbar { display: none; }
  body.page-cxbot .cx-feature__inner { overflow: hidden; }
  body.page-cxbot .cx-feature__images { height: auto; flex-wrap: wrap; }
  body.page-cxbot .cx-feature__img2 { width: 100%; height: auto; padding: 40px 20px; }
  body.page-cxbot .cx-feature__img2 img { width: 100%; height: auto; }
  body.page-cxbot .cx-steps { flex-direction: column; }
  body.page-cxbot .cx-step { width: 100%; }
  body.page-cxbot .cx-services { padding: 80px 30px 0; }
  body.page-cxbot .cx-services__container { padding: 0 0 60px; }
  body.page-cxbot .cx-cards { grid-template-columns: repeat(2, 1fr); }
}

/* ========================================================================== phone */
@media (max-width: 767px) {
  body.page-cxbot .cx-hero { min-height: 0; height: 590px; align-items: flex-start; overflow: clip visible; } /* live: section is 590px, the badge row (536-598) hangs 8px over the next section */
  body.page-cxbot .cx-hero__bg { overflow: hidden; }
  body.page-cxbot .cx-hero__photo { top: -5px; height: 589px; }
  body.page-cxbot .cx-hero__robot { left: 50%; top: 305px; width: 244px; height: 450px; margin-left: -122px; }
  body.page-cxbot .cx-hero__inner { gap: 28px; padding: 52px 0 0; }
  body.page-cxbot .cx-hero__content { gap: 28px; padding: 0 20px 0; }
  body.page-cxbot .cx-hero__title { letter-spacing: -0.06em; }
  body.page-cxbot .cx-hero__lead { font-family: var(--f-inter); font-size: 16px; line-height: 1.2; letter-spacing: normal; }
  body.page-cxbot .cx-hero__cta { padding-top: 10px; }

  body.page-cxbot .cx-about { padding: 0 15px 20px; }
  body.page-cxbot .cx-about__container { gap: var(--sp-5); padding-top: 49px; border-radius: 43px; }
  body.page-cxbot .cx-intro { padding: 0 20px; }
  body.page-cxbot .cx-intro__title { max-width: 270px; }
  body.page-cxbot .cx-intro__lead { font-size: 16px; line-height: 1.4; letter-spacing: normal; }
  body.page-cxbot .cx-stats { width: 100%; padding: 68px 0 4px; } /* live: row 28px lower inside the same 593px box */
  body.page-cxbot .cx-stats__row { flex-direction: column; gap: var(--sp-6); }
  body.page-cxbot .cx-stat { align-items: center; width: 100%; padding-bottom: 31px; } /* live stat box 160px */
  body.page-cxbot .cx-stat__n { font-size: 73px; letter-spacing: -0.08em; color: var(--c-text); text-align: center; }
  body.page-cxbot .cx-stat__t { width: 244px; max-width: none; font-size: 16px; line-height: 1.4; color: var(--c-ink); text-align: center; }
  body.page-cxbot .cx-stat:first-child .cx-stat__t { width: 100%; }
  body.page-cxbot .cx-stat:nth-child(2) .cx-stat__n { width: 221px; text-align: center; }
  body.page-cxbot .cx-intro__sub { font-size: 30px; }

  body.page-cxbot .cx-cases { padding: 0 20px; }
  body.page-cxbot .cx-cases__inner { gap: 0; }
  body.page-cxbot .cx-cases__col { width: 100%; gap: var(--sp-8); }
  body.page-cxbot .cx-case { height: auto; min-height: 0; }
  body.page-cxbot .cx-case__title { font-size: 24px; letter-spacing: -0.02em; }
  body.page-cxbot .cx-case__text { font-size: 16px; line-height: 1.4; letter-spacing: normal; color: var(--c-ink); }

  body.page-cxbot .cx-success { gap: 50px; padding-bottom: 0; }
  body.page-cxbot .cx-success__top { padding: 0 30px; box-sizing: border-box; }
  body.page-cxbot .cx-success__h { font-size: 28px; line-height: 33px; }
  body.page-cxbot .cx-success__body { max-width: 254px; font-family: var(--f-satoshi); font-size: 16px; line-height: 1.4; letter-spacing: normal; color: var(--c-ink); }
  body.page-cxbot .cx-compare { flex-direction: column; gap: 10px; width: calc(100% - 20px); padding: 10px; }
  body.page-cxbot .cx-compare__card { width: 100%; }
  body.page-cxbot .cx-compare__h { padding-left: 0; font-size: 23px; text-align: center; }
  body.page-cxbot .cx-compare__h--serif { font-size: 24px; line-height: 36px; letter-spacing: -2px; margin: 7px 0; }
  body.page-cxbot .cx-tower { max-width: 292px; font-size: 43px; padding-top: 30px; }

  body.page-cxbot .cx-feature { padding: 17px 0 13px; } /* live: 17/40 padding but the inner box is 626px and the card overflows it by 29px -> section 683px */
  body.page-cxbot .cx-feature__inner { gap: var(--sp-7); padding: 0 20px; }
  body.page-cxbot .cx-tabs { position: static; width: 100%; gap: 32px; overflow: hidden; } /* live 375: tabs 32px apart, row clipped at the container edge */
  body.page-cxbot .cx-feature__content { gap: 20px; width: 100%; }
  body.page-cxbot .cx-feature__title { font-size: 32px; letter-spacing: -0.02em; }
  body.page-cxbot .cx-feature__title strong { font-family: var(--f-inter); font-weight: 700; }
  body.page-cxbot .cx-feature__text { max-width: 280px; font-size: 16px; line-height: 1.4; color: var(--c-ink); }
  body.page-cxbot .cx-feature__images { height: auto; padding-top: 12px; margin-top: -7px; } /* live: 41px between the text and the card */
  body.page-cxbot .cx-feature__img2 { width: 100%; height: 242px; padding: 0; border-radius: var(--r-md); }
  body.page-cxbot .cx-feature__img2 img { width: 217px; height: 174px; }

  body.page-cxbot .cx-process { gap: 50px; padding: 64px 30px; }
  body.page-cxbot .cx-process__top { padding-top: 0; }
  body.page-cxbot .cx-process__title { gap: 3px; }
  body.page-cxbot .cx-process__text { font-family: var(--f-satoshi); line-height: 1.4; letter-spacing: normal; color: var(--c-ink); }
  body.page-cxbot .cx-steps { flex-direction: column; gap: 10px; padding: 0; }
  body.page-cxbot .cx-step { width: 100%; }

  body.page-cxbot .cx-services { padding: 0; }
  body.page-cxbot .cx-services__container { gap: 50px; padding: 10px 20px 60px; }
  body.page-cxbot .cx-services__h { font-size: 33px; line-height: 34px; letter-spacing: -2px; }
  body.page-cxbot .cx-services__p { font-family: var(--f-satoshi); line-height: 1.4; letter-spacing: normal; }
  body.page-cxbot .cx-cards { grid-template-columns: 1fr; }
  body.page-cxbot .cx-card { min-height: 0; }
  body.page-cxbot .cx-card:first-child { padding-bottom: 18px; } /* live: first card is 217px (the rest 255/281) */
  body.page-cxbot .cx-tags { gap: var(--sp-4); }
  body.page-cxbot .cx-tagpill:first-child { padding: 10px 16px; } /* live mobile: first pill 236x46, the rest 52px tall */

  body.page-cxbot .results__container { padding: 34px 0 63px; }
  body.page-cxbot .results__col--up { flex-direction: column-reverse; } /* live phone order: 3 Arroyos, caption card, UTN */

  body.page-cxbot .faq__container { gap: var(--sp-6); padding: 60px 24px 40px; }
  body.page-cxbot .faq__heading { justify-content: flex-start; }
  body.page-cxbot .faq__title { text-align: left; }
  body.page-cxbot .faq__list { padding: 0; }

  body.page-cxbot .cta-final { padding: 0 0 10px; }
  body.page-cxbot .cta-final__container { gap: 37px; padding: 19px 10px; }
  body.page-cxbot .cta-final__title { font-size: 48px; letter-spacing: -0.04em; color: var(--c-text); }
  body.page-cxbot .site-footer__copy { font-size: 15px; line-height: 18px; }
}