{"id":11929,"date":"2025-11-17T10:41:31","date_gmt":"2025-11-17T10:41:31","guid":{"rendered":"https:\/\/staging-site.citationcanada.com\/?page_id=11929"},"modified":"2026-08-27T11:17:54","modified_gmt":"2026-08-27T11:17:54","slug":"cc-658-test-page","status":"publish","type":"page","link":"https:\/\/staging-site.citationcanada.com\/fr\/cc-658-test-page\/","title":{"rendered":"CC-658 &#8211; Test page"},"content":{"rendered":"<section class=\"block block--fifty-fifty\">\n  <div class=\"block__inner pt-30 pt-lg-40 pb-30 pb-lg-40 bg-color-grey bg-swirls-none fg-color-black\">\n        <div class=\"container\">\n      <div class=\"row gutter-x-lg-60 mb-40- flex-middle\">\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-first\">\n            <div class=\"column-content--text max-w-490w\">\n  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium atque, amet odit vero quisquam, in eveniet quo voluptas, perferendis natus repudiandae illo, eaque voluptate ut commodi similique placeat laboriosam ipsa.<\/p>\n<ul>\n<li>Bullet 1<\/li>\n<li>Bullet 2<\/li>\n<li>Bullet 3<\/li>\n<\/ul>\n\n<\/div>\n\n          <\/div>\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-last\">\n            \n          <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--fifty-fifty\">\n  <div class=\"block__inner pt-30 pt-lg-40 pb-30 pb-lg-40 bg-color-grey bg-swirls-none fg-color-white\">\n        <div class=\"container\">\n      <div class=\"row gutter-x-lg-60 mb-40- flex-middle\">\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-first\">\n            <div class=\"column-content--text max-w-490w\">\n  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium atque, amet odit vero quisquam, in eveniet quo voluptas, perferendis natus repudiandae illo, eaque voluptate ut commodi similique placeat laboriosam ipsa.<\/p>\n<ul>\n<li>Bullet 1<\/li>\n<li>Bullet 2<\/li>\n<li>Bullet 3<\/li>\n<\/ul>\n\n<\/div>\n\n          <\/div>\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-last\">\n            \n          <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--fifty-fifty\">\n  <div class=\"block__inner pt-30 pt-lg-40 pb-30 pb-lg-40 bg-color-grey bg-swirls-none fg-color-black\">\n        <div class=\"container\">\n      <div class=\"row gutter-x-lg-60 mb-40- flex-middle\">\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-first\">\n            <div class=\"column-content--text max-w-490w\">\n  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium atque, amet odit vero quisquam, in eveniet quo voluptas, perferendis natus repudiandae illo, eaque voluptate ut commodi similique placeat laboriosam ipsa.<\/p>\n<ul>\n<li>Bullet 1<\/li>\n<li>Bullet 2<\/li>\n<li>Bullet 3<\/li>\n<\/ul>\n\n<\/div>\n\n          <\/div>\n                  <div class=\"col-12 col-lg-6 remove-end-margins mb-40 order-lg-last\">\n            \n          <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--call-to-action-banner\">\n  <div class=\"block__inner fg-color-white border-radius-50px fg-color-black border-radius-default\">\n        <div class=\"d-flex flex-middle pt-50 position-relative z-5\">\n      <div class=\"position-absolute top-50px right-0 bottom-0 left-0 bg-color-black border-radius-50px -z-1 pointer-events-none\"><\/div>\n      <div class=\"d-none d-lg-block position-absolute top-50px right-0 bottom-0 left-0 border-radius-50px -z-1 pointer-events-none bg-swirls-custom bg-swirls-custom--position-bottom-left bg-swirls-custom--style-gradient\"><\/div>\n      <div class=\"d-none d-lg-block position-relative align-self-end flex-0 w-50 w-xl-40 px-67 mt-50-\">\n        <img decoding=\"async\" width=\"252\" height=\"316\" src=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png\" class=\"attachment-medium_large size-medium_large\" alt=\"\" srcset=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png 252w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-239x300.png 239w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-80x100.png 80w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-150x188.png 150w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-192x241.png 192w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/>\n      <\/div>\n      <div class=\"flex-fill pt-45 pr-60 w-50 w-xl-60 pb-35 pl-40\">\n        <div class=\"extra-tight-headers remove-end-margins m-0 h2\">\n          <p>Banner content<\/p>\n\n        <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--call-to-action-banner\">\n  <div class=\"block__inner fg-color-white border-radius-50px fg-color-black border-radius-default\">\n        <div class=\"d-flex flex-middle pt-50 position-relative z-5\">\n      <div class=\"position-absolute top-50px right-0 bottom-0 left-0 bg-color-black border-radius-50px -z-1 pointer-events-none\"><\/div>\n      <div class=\"d-none d-lg-block position-absolute top-50px right-0 bottom-0 left-0 border-radius-50px -z-1 pointer-events-none bg-swirls-custom bg-swirls-custom--position-bottom-left bg-swirls-custom--style-safety-orange\"><\/div>\n      <div class=\"d-none d-lg-block position-relative align-self-end flex-0 w-50 w-xl-40 px-67 mt-50-\">\n        <img decoding=\"async\" width=\"252\" height=\"316\" src=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png\" class=\"attachment-medium_large size-medium_large\" alt=\"\" srcset=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png 252w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-239x300.png 239w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-80x100.png 80w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-150x188.png 150w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-192x241.png 192w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/>\n      <\/div>\n      <div class=\"flex-fill pt-45 pr-60 w-50 w-xl-60 pb-35 pl-40\">\n        <div class=\"extra-tight-headers remove-end-margins m-0 h2\">\n          <p>Banner content<\/p>\n\n        <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--call-to-action-banner\">\n  <div class=\"block__inner fg-color-white border-radius-50px fg-color-black border-radius-default\">\n        <div class=\"d-flex flex-middle pt-50 position-relative z-5\">\n      <div class=\"position-absolute top-50px right-0 bottom-0 left-0 bg-color-black border-radius-50px -z-1 pointer-events-none\"><\/div>\n      <div class=\"d-none d-lg-block position-absolute top-50px right-0 bottom-0 left-0 border-radius-50px -z-1 pointer-events-none bg-swirls-custom bg-swirls-custom--position-bottom-left bg-swirls-custom--style-hr-violet\"><\/div>\n      <div class=\"d-none d-lg-block position-relative align-self-end flex-0 w-50 w-xl-40 px-67 mt-50-\">\n        <img decoding=\"async\" width=\"252\" height=\"316\" src=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png\" class=\"attachment-medium_large size-medium_large\" alt=\"\" srcset=\"https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner.png 252w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-239x300.png 239w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-80x100.png 80w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-150x188.png 150w, https:\/\/staging-site-media.citationcanada.com\/app\/uploads\/2025\/05\/29173952\/Web-sector-retail-banner-192x241.png 192w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/>\n      <\/div>\n      <div class=\"flex-fill pt-45 pr-60 w-50 w-xl-60 pb-35 pl-40\">\n        <div class=\"extra-tight-headers remove-end-margins m-0 h2\">\n          <p>Banner content<\/p>\n\n        <\/div>\n              <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<section class=\"block block--calculator-pricing\" data-block-ref=block_acf-block-6a901cdfd318b>\n  <div class=\"block__inner pt-30 pt-lg-40 pb-30 pb-lg-40 bg-color-white bg-swirls-none fg-color-black\">\n              <div class=\"container max-w-745px\">\n        <div class=\"row\">\n          <div class=\"col remove-end-margins mb-35\">\n            <p>Can t seem to change the employee count text \ud83d\ude41<\/p>\n\n          <\/div>\n        <\/div>\n      <\/div>\n        <div class=\"container max-w-1055px\">\n              <div class=\"row\">\n          <div class=\"col\">\n            <div class=\"w-fit-content mx-auto mb-50 bg-color-white border-radius-full px-19 py-11 box-shadow-equal-subtle overflow-hidden\">\n              <form class=\"inline-form\" action=\"\">\n                <label for=\"employee-count\">S\u00e9lectionnez le nombre d&#039;employ\u00e9s<\/label>\n                <select id=\"employee-count\" class=\"select2\" name=\"employee-count\">\n                  <option selected hidden disabled>Possibilit\u00e9s<\/option>\n                                      <option value=\"$30,000\">$30,000<\/option>\n                                      <option value=\"$40,000\">$40,000<\/option>\n                                      <option value=\"$50,000\">$50,000<\/option>\n                                      <option value=\"$60,000\">$60,000<\/option>\n                                      <option value=\"$70,000\">$70,000<\/option>\n                                      <option value=\"$80,000\">$80,000<\/option>\n                                      <option value=\"$90,000\">$90,000<\/option>\n                                      <option value=\"$100,000\">$100,000<\/option>\n                                      <option value=\"$110,000\">$110,000<\/option>\n                                      <option value=\"$120,000\">$120,000<\/option>\n                                  <\/select>\n              <\/form>\n            <\/div>\n          <\/div>\n        <\/div>\n            <div class=\"pricing-calc__columns mb-25\">\n                  <div class=\"pricing-calc-column mb-40  pricing-calc-column--recommended\">\n\n      <div class=\"pricing-calc-column__type font-size-18 font-weight-bold text-center pt-8 pb-4 px-20\">\n      <span>what does this do?<\/span>\n    <\/div>\n  \n  <div class=\"pricing-calc-column__header-container d-flex flex-column flex-end box-shadow-equal-subtle\">\n    <div class=\"pricing-calc-column__header d-flex flex-column position-relative flex-fill pt-15 pb-25 px-20 z-5\">\n      <h3 class=\"pricing-calc-column__title font-size-32 m-0 mb-10\">4% test<\/h3>\n              <h4 class=\"pricing-calc-column__subtitle font-size-20 font-weight-semibold m-0 mb-5\">does this do anything<\/h4>\n            <div class=\"pricing-calc-column__description remove-end-margins\">\n        <p>4% test<\/p>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"pricing-calc-column__body-container d-flex flex-column\">\n    <div class=\"pricing-calc-column__body d-flex flex-column flex-fill bg-color-white py-15 px-20 box-shadow-equal-subtle remove-end-margins\">\n      <div class=\"pricing-calc-features__intro font-size-14 font-weight-bold remove-end-margins mb-10\">\n        <p>Testing stuff<\/p>\n\n      <\/div>\n\n      \n      <div class=\"pricing-calc-column__pricing d-flex flex-column flex-end flex-fill mt-32\">\n        <span class=\"pricing-calc-column__price-from font-family-header font-weight-bold\">\u00c0 partir de<\/span>\n        <div class=\"pricing-calc-column__price d-flex flex-middle\">\n          <span class=\"price__price font-size-45 font-weight-black fg-color-black\"><span data-price-value=\"0\">$ &#8211;<\/span><\/span>\n          <span class=\"price__smallprint font-size-10 ml-12 fg-color-black\">Vacation Pay<\/span>\n        <\/div>\n        <div class=\"pricing-calc-column__button px-5\">\n          <div class=\"button button--full\">\n            <button class=\"button__link font-size-20\" data-popup-target=\"pricing_calc-block_acf-block-6a901cdfd318b\"><span>Demander un devis<\/span><\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n                  <div class=\"pricing-calc-column mb-40  \">\n\n  \n  <div class=\"pricing-calc-column__header-container d-flex flex-column flex-end box-shadow-equal-subtle\">\n    <div class=\"pricing-calc-column__header d-flex flex-column position-relative flex-fill pt-15 pb-25 px-20 z-5\">\n      <h3 class=\"pricing-calc-column__title font-size-32 m-0 mb-10\">6% test<\/h3>\n            <div class=\"pricing-calc-column__description remove-end-margins\">\n        <p>6% test<\/p>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"pricing-calc-column__body-container d-flex flex-column\">\n    <div class=\"pricing-calc-column__body d-flex flex-column flex-fill bg-color-white py-15 px-20 box-shadow-equal-subtle remove-end-margins\">\n      <div class=\"pricing-calc-features__intro font-size-14 font-weight-bold remove-end-margins mb-10\">\n        <p>second testing stuff<\/p>\n\n      <\/div>\n\n      \n      <div class=\"pricing-calc-column__pricing d-flex flex-column flex-end flex-fill mt-32\">\n        <span class=\"pricing-calc-column__price-from font-family-header font-weight-bold\">\u00c0 partir de<\/span>\n        <div class=\"pricing-calc-column__price d-flex flex-middle\">\n          <span class=\"price__price font-size-45 font-weight-black fg-color-black\"><span data-price-value=\"1\">$ &#8211;<\/span><\/span>\n          <span class=\"price__smallprint font-size-10 ml-12 fg-color-black\">Vacation Pay<\/span>\n        <\/div>\n        <div class=\"pricing-calc-column__button px-5\">\n          <div class=\"button button--full\">\n            <button class=\"button__link font-size-20\" data-popup-target=\"pricing_calc-block_acf-block-6a901cdfd318b\"><span>Demander un devis<\/span><\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n                  <div class=\"pricing-calc-column mb-40  \">\n\n  \n  <div class=\"pricing-calc-column__header-container d-flex flex-column flex-end box-shadow-equal-subtle\">\n    <div class=\"pricing-calc-column__header d-flex flex-column position-relative flex-fill pt-15 pb-25 px-20 z-5\">\n      <h3 class=\"pricing-calc-column__title font-size-32 m-0 mb-10\">8% test<\/h3>\n            <div class=\"pricing-calc-column__description remove-end-margins\">\n        <p>8% test<\/p>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"pricing-calc-column__body-container d-flex flex-column\">\n    <div class=\"pricing-calc-column__body d-flex flex-column flex-fill bg-color-white py-15 px-20 box-shadow-equal-subtle remove-end-margins\">\n      <div class=\"pricing-calc-features__intro font-size-14 font-weight-bold remove-end-margins mb-10\">\n        <p>Even more testing stuff<\/p>\n\n      <\/div>\n\n      \n      <div class=\"pricing-calc-column__pricing d-flex flex-column flex-end flex-fill mt-32\">\n        <span class=\"pricing-calc-column__price-from font-family-header font-weight-bold\">\u00c0 partir de<\/span>\n        <div class=\"pricing-calc-column__price d-flex flex-middle\">\n          <span class=\"price__price font-size-45 font-weight-black fg-color-black\"><span data-price-value=\"2\">$ &#8211;<\/span><\/span>\n          <span class=\"price__smallprint font-size-10 ml-12 fg-color-black\">Vacation Pay<\/span>\n        <\/div>\n        <div class=\"pricing-calc-column__button px-5\">\n          <div class=\"button button--full\">\n            <button class=\"button__link font-size-20\" data-popup-target=\"pricing_calc-block_acf-block-6a901cdfd318b\"><span>Demander un devis<\/span><\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n              <\/div>\n\n      <div class=\"row\">\n        <div class=\"col text-center\">\n                      <div class=\"pricing-calc__extra-boxed font-size-22 bg-color-pink-light border-radius-20px p-13 mb-15 mx-auto remove-end-margins\">\n              <p>Lorem Ipsum<\/p>\n\n            <\/div>\n                                <div class=\"pricing-calc__extra-info font-size-18 mb-6 remove-end-margins\">\n              <p>Ipsum lorem<\/p>\n\n            <\/div>\n                                <div class=\"pricing-calc__extra-smallprint font-size-12\">\n              <p>Testing smallprint<\/p>\n\n            <\/div>\n                  <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n  <script>window.citation_pricing_calc = window.citation_pricing_calc ?? {};window.citation_pricing_calc[\"block_acf-block-6a901cdfd318b\"] = {\"tiers\":{\"$30,000\":[\"$1,200\",\"$1,800\",\"$2,400\"],\"$40,000\":[\"$1,600\",\"$2,400\",\"$3,200\"],\"$50,000\":[\"$2,000\",\"$3,000\",\"$4,000\"],\"$60,000\":[\"$2,400\",\"$3,600\",\"$4,800\"],\"$70,000\":[\"$2,800\",\"$4,200\",\"$5,600\"],\"$80,000\":[\"$3,200\",\"$4,800\",\"$6,400\"],\"$90,000\":[\"$3,600\",\"$5,400\",\"$7,200\"],\"$100,000\":[\"$4,000\",\"$6,000\",\"$8,000\"],\"$110,000\":[\"$4,400\",\"$6,600\",\"$8,800\"],\"$120,000\":[\"$4,800\",\"$7,200\",\"$9,600\"]}}<\/script>\n  <div class=\"popup__overlay popup-hidden\" data-popup-id=pricing_calc-block_acf-block-6a901cdfd318b>\n  <button href=\"#\" class=\"popup__close\" aria-label=\"Close popup\">Close<\/button>\n  <div class=\"popup__content\">\n    <p>What is pop up content?<\/p>\n\n  <\/div>\n<\/div>\n\n<\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":29,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"content-type":"","footnotes":""},"acf":[],"_links":{"self":[{"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/pages\/11929"}],"collection":[{"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/users\/29"}],"replies":[{"embeddable":true,"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/comments?post=11929"}],"version-history":[{"count":6,"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/pages\/11929\/revisions"}],"predecessor-version":[{"id":12270,"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/pages\/11929\/revisions\/12270"}],"wp:attachment":[{"href":"https:\/\/staging-site.citationcanada.com\/fr\/wp-json\/wp\/v2\/media?parent=11929"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}