Symfony Profiler

"DiscipleshipSite\Controller\Discipleship::boltGospel"

"security.firewall.map.context.main"

Symfony\Component\WebLink\GenericLinkProvider {#3258
  -links: [
    3245 => Symfony\Component\WebLink\Link {#3245
      -href: "http://elcaminohaciadios.com/api/docs.jsonld"
      -rel: [
        "http://www.w3.org/ns/hydra/core#apiDocumentation" => "http://www.w3.org/ns/hydra/core#apiDocumentation"
      ]
      -attributes: []
    }
  ]
}

"boltGospel"

[
  "slug" => "purpose-gsd"
]

"_security_main"

"27e48a"

[
  "es"
]

[
  "en" => "ESV"
  "es" => "WTC"
  "fr" => "DBY"
  "pt" => "JFA"
  "id" => "NTV"
  "ru" => "S76"
  "ar" => "VDV"
  "hi" => "WTC"
]

1

[
  "template" => [
    1 => "@godlife/record/topic/blank.twig"
    2 => "gospel.html.twig"
    3 => "gospel.twig"
    5 => "@spanish/content.twig"
    6 => "record.html.twig"
  ]
  "title" => "Purpose GSD"
  "topic" => "purpose-gsd"
  "slug" => "purpose-gsd"
  "banner" => [
    "filename" => ""
    "path" => ""
    "media" => ""
    "thumbnail" => ""
    "fieldname" => "banner"
    "alt" => ""
    "url" => ""
    "extension" => ""
  ]
  "head" => ""
  "body" => """
    <style type="text/css">\r\n
        /* ==========================================================================\r\n
           BASE STYLES\r\n
           ========================================================================== */\r\n
    \r\n
        body {\r\n
          margin: 0;\r\n
        }\r\n
    \r\n
    \r\n
        .page-wrapper *,\r\n
        .page-wrapper *::before,\r\n
        .page-wrapper *::after {\r\n
          box-sizing: border-box;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           CSS CUSTOM PROPERTIES (VARIABLES)\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper {\r\n
    \r\n
          /* Box Model & Typography */\r\n
          /* font-family: Raleway, Helvetica, Arial, sans-serif; */\r\n
          font-family: 'Montserrat', sans-serif;\r\n
    \r\n
          /* Font Sizes */\r\n
          --font-body: 1rem;\r\n
          /* --h1: clamp(2.125rem, 4vw, 3rem); */\r\n
          --h1: clamp(2.125rem, 4vw, 3.35rem);\r\n
          --h2: clamp(1.75rem, 3.2vw, 2rem);\r\n
          /* --h2: clamp(1.75rem, 3.2vw, 2.25rem); */\r\n
          --h3: clamp(1.375rem, 2.6vw, 1.75rem);\r\n
          --h4: clamp(1.125rem, 2.2vw, 1.375rem);\r\n
          --h5: 1.125rem;\r\n
          --h6: 1rem;\r\n
          --p: 1rem;\r\n
          --p-lg: 1.125rem;\r\n
          --p-sm: 0.9375rem;\r\n
          --small: 0.875rem;\r\n
    \r\n
          /* Line Heights */\r\n
          --lh-heading: 1.2;\r\n
          --lh-body: 1.6;\r\n
    \r\n
          /* Color Palette */\r\n
          --page-white: #fff;\r\n
          --page-black: #000;\r\n
    \r\n
          /* Blues */\r\n
          --page-blue-dark-1: #1e639b;\r\n
          --page-blue-dark-2: #2d72aa;\r\n
          --page-blue-dark-3: #3d80b7;\r\n
          --page-blue-dark-4: #154567;\r\n
          --page-blue-light: #007fc7;\r\n
    \r\n
          /* Greens */\r\n
          --page-green-primary: #5DB85B;\r\n
          --page-green-secondary: #5CB85C;\r\n
          --page-green-border: #009688;\r\n
    \r\n
          /* Grays */\r\n
          --page-gray-dark: #6e6e6e;\r\n
          --page-gray-light: #cbd5e1;\r\n
          --page-gray-lighter: #e5e7eb;\r\n
          --page-gray-card: #a89678d7;\r\n
          --page-grey-footer: #aaaaaa;\r\n
    \r\n
          /* Text Colors */\r\n
          --page-text-dark: #3a3a3a;\r\n
          --page-text-body: #4a4a4a;\r\n
          --page-text-brown: #6b5d4f;\r\n
          --page-footer-text-color: var(--page-white);\r\n
    \r\n
          /* Background Colors */\r\n
          --page-beige-footer: #d9d6ca;\r\n
          --page-beige-accent: #eeeade;\r\n
    \r\n
          /* Step Colors */\r\n
          --page-step1-bg: var(--page-blue-dark-1);\r\n
          --page-step2-bg: var(--page-blue-dark-2);\r\n
          --page-step3-bg: var(--page-blue-dark-3);\r\n
          --page-step1-arrow-bg-color: var(--page-blue-dark-1);\r\n
          --page-step2-arrow-bg-color: var(--page-blue-dark-2);\r\n
          --page-step3-arrow-bg-color: var(--page-blue-dark-3);\r\n
    \r\n
          /* Split Journey  */\r\n
    \r\n
          /* --page-form-bg: var(--page-blue-dark-4); */\r\n
          --page-form-bg: #254687;\r\n
          --page-form-card-bg: #0B15281A;\r\n
          --page-form-text-color: #ffffff;\r\n
    \r\n
          --page-form-button-text-color: var(--page-black);\r\n
          --page-form-button-bg-color: #5CB85C;\r\n
          --page-form-button-border-color: #5CB85C;\r\n
    \r\n
          /* Form Colors */\r\n
          --page-blue-form: #1f3d74;\r\n
          --page-blue-hover: #0359a0;\r\n
    \r\n
    \r\n
          /* Utility Colors */\r\n
          --page-red-error: #e51520;\r\n
          --page-placeholder-gray: #CCCCCC;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           PAGE WRAPPER & LAYOUT\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper {\r\n
          overflow-x: hidden;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container {\r\n
          width: 100%;\r\n
          max-width: 1200px;\r\n
          margin: auto;\r\n
          padding: 0;\r\n
          background-color: var(--page-white);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container {\r\n
          margin: auto;\r\n
          position: relative;\r\n
          font-size: 20px;\r\n
          line-height: 1.2;\r\n
          font-style: normal;\r\n
          padding: 0;\r\n
          background-color: var(--page-white);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .clearfix:after,\r\n
        .page-wrapper .container-fluid:after,\r\n
        .page-wrapper .container:after,\r\n
        .page-wrapper .row:after {\r\n
          clear: both;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           TYPOGRAPHY\r\n
           ========================================================================== */\r\n
    \r\n
        /* Heading Base Styles */\r\n
        .page-wrapper #arrow-container h1,\r\n
        .page-wrapper #arrow-container h2,\r\n
        .page-wrapper #arrow-container h3,\r\n
        .page-wrapper #arrow-container h4,\r\n
        .page-wrapper #arrow-container h5,\r\n
        .page-wrapper #arrow-container h6 {\r\n
          text-transform: uppercase;\r\n
          line-height: 1.2em;\r\n
          letter-spacing: 0;\r\n
          font-style: normal;\r\n
          margin-top: 0;\r\n
          margin-bottom: 10px;\r\n
          /* font-family: Raleway, Helvetica, Arial, sans-serif; */\r\n
        }\r\n
    \r\n
        /* Individual Heading Styles */\r\n
        .page-wrapper #arrow-container h1 {\r\n
          font-size: var(--h1);\r\n
          line-height: var(--lh-heading);\r\n
          color: #ffffff;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container h2 {\r\n
          font-size: var(--h2);\r\n
          font-weight: 700;\r\n
          line-height: var(--lh-heading);\r\n
          color: #ffffff;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container h3 {\r\n
          font-size: var(--h3);\r\n
          line-height: var(--lh-heading);\r\n
          color: #ffffff;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container h4 {\r\n
          font-size: var(--h4);\r\n
          line-height: var(--lh-heading);\r\n
          color: #ffffff;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container h5 {\r\n
          font-size: var(--h5);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container h6 {\r\n
          font-size: var(--h6);\r\n
          font-size: 24px;\r\n
          color: var(--page-text-dark);\r\n
          font-weight: 700;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container small {\r\n
          font-size: var(--small);\r\n
        }\r\n
    \r\n
        /* Paragraph Styles */\r\n
        .page-wrapper #arrow-container p {\r\n
          font-size: var(--p);\r\n
          line-height: var(--lh-body);\r\n
          max-width: 70ch;\r\n
          color: #ffffff;\r\n
          font-family: 'Montserrat', sans-serif;\r\n
        }\r\n
    \r\n
        /* Specific Typography Overrides */\r\n
        .page-wrapper #arrow-container #arrow-inner-container .arrow-start h2 {\r\n
          text-transform: none;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .content-prayer h1 {\r\n
          color: var(--page-white);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container h3 {\r\n
          line-height: 68px;\r\n
          font-weight: 700;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .arrow-start .body-text {\r\n
          padding: 20px 10px;\r\n
          text-align: center;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .content .body-text {\r\n
          color: var(--page-text-body);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .content-prayer .body-text {\r\n
          text-align: center;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           ARROW LAYOUT & STEPS\r\n
           ========================================================================== */\r\n
    \r\n
        /* Header Section */\r\n
        .page-wrapper #arrow-container .arrow-start {\r\n
          display: flex;\r\n
          justify-content: center;\r\n
          align-items: center;\r\n
          background: #D9D6CA;\r\n
          background: url(https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Purpose-gsd/header-hero.jpg) no-repeat;\r\n
          /* background: linear-gradient(180deg, rgba(217, 214, 202, 0) 0%, rgba(217, 214, 202, 0.75) 85%, rgba(217, 214, 202, 1) 100%), url(https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Chaos-gsd/Chaos+Header.png) no-repeat; */\r\n
          /* background:\r\n
            radial-gradient(circle, rgba(255, 255, 255, 0) 75%, rgba(217, 214, 202, 0.2) 95%, rgba(217, 214, 202, 0.95) 100%),\r\n
            linear-gradient(0deg, rgba(217, 214, 202, 0) 75%, rgba(217, 214, 202, 0.1) 85%, rgba(217, 214, 202, 1) 100%), \r\n
            linear-gradient(180deg, rgba(217, 214, 202, 0) 75%, rgba(217, 214, 202, 0.4) 90%, rgba(217, 214, 202, 1) 100%),\r\n
            url(https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Chaos-gsd/Chaos+Header.png) no-repeat; */\r\n
          background-size: cover;\r\n
          position: relative;\r\n
          height: 399px;\r\n
          width: auto;\r\n
          padding: 40px 20px;\r\n
          background-position: center;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-start h1 {\r\n
          color: white;\r\n
          /* color: var(--page-text-dark); */\r\n
          text-shadow: 2px 2px rgba(185, 185, 185, 1);\r\n
          /* text-shadow: 2px 2px rgba(138, 138, 138, 0.9); */\r\n
          /* background: rgba(217, 214, 202, 0.1); */\r\n
          padding: 20px 30px;\r\n
          border-radius: 8px;\r\n
          backdrop-filter: blur(1/px);\r\n
          /* box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); */\r\n
          /* max-width: 800px; */\r\n
          text-align: center;\r\n
        }\r\n
    \r\n
        /* Step Containers */\r\n
        .page-wrapper #arrow-container .arrow-step1,\r\n
        .page-wrapper #arrow-container .arrow-step2,\r\n
        .page-wrapper #arrow-container .arrow-step3 {\r\n
          position: relative;\r\n
          padding: 49px;\r\n
          min-height: 200px;\r\n
          display: grid;\r\n
          grid-template-columns: 60% 40%;\r\n
          gap: 2rem;\r\n
          align-items: center;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step1 {\r\n
          background-color: var(--page-step1-bg);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step2 {\r\n
          background-color: var(--page-step2-bg);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step3 {\r\n
          background-color: var(--page-step3-bg);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step4 {\r\n
          background-color: var(--page-form-bg);\r\n
          position: relative;\r\n
          padding: 45px 45px 100px 45px;\r\n
          min-height: 560px;\r\n
        }\r\n
    \r\n
        /* Arrow Pointers */\r\n
        .page-wrapper #arrow-container .arrow-start .pointer,\r\n
        .page-wrapper #arrow-container .arrow-step1 .pointer,\r\n
        .page-wrapper #arrow-container .arrow-step2 .pointer,\r\n
        .page-wrapper #arrow-container .arrow-step3 .pointer,\r\n
        .page-wrapper #arrow-container .arrow-step4 .pointer {\r\n
          margin: auto;\r\n
          left: 0;\r\n
          bottom: -32px;\r\n
          width: 0;\r\n
          height: 0;\r\n
          z-index: 10;\r\n
          position: absolute;\r\n
          right: 0;\r\n
          border-left: 57px solid transparent;\r\n
          border-right: 57px solid transparent;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-start .pointer {\r\n
          border-top: 33px solid var(--page-beige-footer);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step1 .pointer {\r\n
          border-top: 33px solid var(--page-step1-arrow-bg-color);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step2 .pointer {\r\n
          border-top: 33px solid var(--page-step2-arrow-bg-color);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step3 .pointer {\r\n
          border-top: 33px solid var(--page-step3-arrow-bg-color);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-step4 .pointer {\r\n
          border-top: 33px solid var(--page-form-bg);\r\n
        }\r\n
    \r\n
        /* Content Areas */\r\n
        .page-wrapper #arrow-container .content {\r\n
          width: 100%;\r\n
          height: auto;\r\n
          grid-column: 1;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-start .content {\r\n
          width: 100%;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .arrow-step4 .content {\r\n
          width: 100%;\r\n
        }\r\n
    \r\n
        /* Images */\r\n
        .page-wrapper #arrow-container #arrow-inner-container img {\r\n
          width: 100%;\r\n
          height: auto;\r\n
          max-height: 350px;\r\n
          object-fit: contain;\r\n
          grid-column: 2;\r\n
        }\r\n
    \r\n
        .page-wrapper img.logo.my-class {\r\n
          width: 95px !important;\r\n
          height: auto !important;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           BUTTONS & INTERACTIVE ELEMENTS\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-button {\r\n
          background-color: var(--page-blue-dark-2);\r\n
          border-radius: 7px;\r\n
          box-shadow: 0 1px 0 0 var(--page-gray-dark) inset;\r\n
          color: var(--page-white);\r\n
          display: inline-block;\r\n
          font-size: 18px;\r\n
          font-style: normal;\r\n
          font-weight: 400;\r\n
          height: 65px;\r\n
          line-height: 65px;\r\n
          margin-bottom: 15px;\r\n
          margin-left: 0;\r\n
          margin-right: 15px;\r\n
          text-align: center;\r\n
          text-decoration: none !important;\r\n
          text-indent: 0;\r\n
          width: 250px;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-button:hover {\r\n
          background-color: var(--page-blue-hover);\r\n
        }\r\n
    \r\n
        .page-wrapper .btn {\r\n
          display: inline-flex;\r\n
          align-items: center;\r\n
          font-weight: bold;\r\n
          padding: .5rem 1rem;\r\n
          border-radius: 4px;\r\n
          cursor: pointer;\r\n
          text-decoration: none;\r\n
          font-size: 1rem;\r\n
          max-width: fit-content;\r\n
          background-color: var(--page-form-button-bg-color);\r\n
          border: 2px solid var(--page-form-button-border-color);\r\n
          /* border-radius: 0px; */\r\n
          color: var(--page-form-button-text-color);\r\n
          /* text-transform: uppercase; */\r\n
        }\r\n
    \r\n
        .page-wrapper a.btn:hover {\r\n
          color: var(--page-form-button-text-color);\r\n
        }\r\n
    \r\n
        .page-wrapper .btn span {\r\n
          margin-left: 0.5rem;\r\n
        }\r\n
    \r\n
        .page-wrapper .form-container .back-btn {\r\n
          background-color: unset;\r\n
          color: var(--page-green-primary);\r\n
          border: 1px solid var(--page-green-primary);\r\n
          padding: 0 10px;\r\n
          cursor: pointer;\r\n
          font-size: 14px;\r\n
          margin: 0 10px 0 0;\r\n
        }\r\n
    \r\n
        .page-wrapper .form-container .back-btn:hover {\r\n
          background-color: unset;\r\n
        }\r\n
    \r\n
        .page-wrapper .gmo-button {\r\n
          border: 0;\r\n
          color: var(--page-white);\r\n
          background-color: var(--page-black);\r\n
          border-radius: 3px;\r\n
          box-shadow: 1px 2px 4px;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           PRAYER SECTION (UNUSED BUT KEEPING FOR REFERENCE)\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-prayer {\r\n
          background-color: var(--page-white);\r\n
          background-image: url(//a.glcdn.co/images/gospel/arrow-praying-hands-1.jpg);\r\n
          position: relative;\r\n
          padding: 49px;\r\n
          background-size: cover;\r\n
          background-position: center;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-prayer .content-prayer {\r\n
          width: 100%;\r\n
          text-align: center;\r\n
          position: relative;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-prayer a,\r\n
        .page-wrapper #arrow-container .arrow-prayer p,\r\n
        .page-wrapper .arrow-prayer a:hover,\r\n
        .page-wrapper .arrow-prayer a:visited {\r\n
          color: var(--page-white);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .arrow-prayer .content-prayer p {\r\n
          width: 580px;\r\n
          margin: auto;\r\n
          text-align: center;\r\n
          padding-bottom: 10px;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           FOOTER\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper #arrow-container .footer {\r\n
          background-color: var(--page-blue-light);\r\n
          padding: 32px 18.28571px;\r\n
          /* margin: auto; */\r\n
          /* max-width: 1200px; */\r\n
          display: flex;\r\n
          justify-content: space-between;\r\n
          border-top: 2px solid var(--page-blue-light);\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .footer .footer-logo {\r\n
          flex: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container .footer-text-container {\r\n
          flex: 1;\r\n
          display: flex;\r\n
          flex-direction: column;\r\n
          align-items: center;\r\n
          gap: 5px;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container p.footer-text {\r\n
          font-size: 12px;\r\n
          color: var(--page-footer-text-color);\r\n
          display: block;\r\n
          margin-block-start: 0em;\r\n
          margin-block-end: 0em;\r\n
          margin: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container p.footer-links {\r\n
          padding-top: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container p.footer-text a,\r\n
        .page-wrapper #arrow-container p.footer-text a:hover,\r\n
        .page-wrapper #arrow-container p.footer-text a:visited {\r\n
          color: var(--page-footer-text-color);\r\n
          text-decoration: underline;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           NEXT STEPS CARDS SECTION\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper .next-steps-cards {\r\n
          display: flex;\r\n
          justify-content: space-between;\r\n
          gap: 1rem;\r\n
          align-items: stretch;\r\n
        }\r\n
    \r\n
        .page-wrapper .next-steps-left {\r\n
          flex: auto;\r\n
          display: flex;\r\n
          flex-direction: column;\r\n
          gap: 25px;\r\n
          min-width: 40%;\r\n
        }\r\n
    \r\n
        .page-wrapper .next-steps-title {\r\n
          font-size: 2rem;\r\n
          text-transform: uppercase;\r\n
          letter-spacing: 3px;\r\n
          color: var(--page-form-text-color);\r\n
        }\r\n
    \r\n
        .page-wrapper p.next-steps-paragraph1,\r\n
        .page-wrapper p.next-steps-paragraph2 {\r\n
          color: var(--page-form-text-color);\r\n
          font-size: 1.5rem;\r\n
          width: 1000px !important;\r\n
        }\r\n
    \r\n
        .page-wrapper .next-steps-heading {\r\n
          margin-bottom: 2rem;\r\n
        }\r\n
    \r\n
        .page-wrapper .card {\r\n
          background-color: var(--page-form-card-bg);\r\n
          padding: 1.5rem;\r\n
          border-radius: 4px;\r\n
          line-height: 2;\r\n
          border: 1px solid var(--page-form-card-bg);\r\n
        }\r\n
    \r\n
        .page-wrapper .card h3 {\r\n
          font-size: 21px !important;\r\n
          line-height: 0.5 !important;\r\n
          text-transform: none !important;\r\n
          text-align: left !important;\r\n
        }\r\n
    \r\n
        .page-wrapper .card p {\r\n
          margin: 0.5rem 0 1.2rem;\r\n
          font-size: 15px !important;\r\n
          color: var(--page-gray-lighter);\r\n
        }\r\n
    \r\n
        .page-wrapper .next-steps-right {\r\n
          flex: auto;\r\n
          min-width: 60%;\r\n
          border-radius: 4px;\r\n
          background-image: url(https://a.glcdn.co/godlife/cms/images/topics/banners/form-image.jpg);\r\n
          background-size: cover;\r\n
          background-position: center;\r\n
          height: auto;\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           RESPONSIVE DESIGN - TABLET\r\n
           ========================================================================== */\r\n
    \r\n
        @media only screen and (max-width:1024px) {\r\n
          .page-wrapper #arrow-container img {\r\n
            padding-left: 0;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-prayer {\r\n
            background-size: cover;\r\n
            background-position: center;\r\n
            height: auto;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-start,\r\n
          .page-wrapper .arrow-prayer {\r\n
            background-size: cover;\r\n
            background-position: center;\r\n
            height: 165px;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-start .content {\r\n
            margin: 0 5px 140px;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .content {\r\n
            width: 100%;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-step1,\r\n
          .page-wrapper #arrow-container .arrow-step2,\r\n
          .page-wrapper #arrow-container .arrow-step3 {\r\n
            grid-template-columns: 1fr;\r\n
            gap: 1rem;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container #arrow-inner-container img {\r\n
            display: none;\r\n
            grid-column: 1;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container h3,\r\n
          .page-wrapper h6 {\r\n
            text-align: center;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-prayer {\r\n
            padding: 40px 0 20px;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-step1,\r\n
          .page-wrapper .arrow-step4 {\r\n
            min-height: fit-content;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-step1,\r\n
          .page-wrapper .arrow-step2,\r\n
          .page-wrapper .arrow-step3,\r\n
          .page-wrapper .arrow-step4 {\r\n
            padding: 49px;\r\n
          }\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           RESPONSIVE DESIGN - MOBILE\r\n
           ========================================================================== */\r\n
    \r\n
        @media (max-width: 768px) {\r\n
          .page-wrapper #arrow-container h2 {\r\n
            margin-top: 0;\r\n
          }\r\n
    \r\n
          .page-wrapper .next-steps-cards {\r\n
            flex-direction: column;\r\n
          }\r\n
    \r\n
          .page-wrapper .next-steps-left {\r\n
            margin-right: 0;\r\n
            display: flex;\r\n
          }\r\n
    \r\n
          .page-wrapper p.next-steps-paragraph1,\r\n
          .page-wrapper p.next-steps-paragraph2 {\r\n
            width: auto !important;\r\n
          }\r\n
    \r\n
          .page-wrapper .card h3 {\r\n
            text-align: left !important;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .content {\r\n
            height: 100%;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .arrow-step4 {\r\n
            padding: 45px 40px 20px 40px;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .footer {\r\n
            display: flex;\r\n
            flex-direction: column;\r\n
            justify-content: center;\r\n
            align-items: center;\r\n
            border-top: 2px solid var(--page-grey-footer);\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .footer .footer-logo {\r\n
            flex: 0;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container .footer-text-container {\r\n
            flex: 1;\r\n
            display: flex;\r\n
            flex-direction: column;\r\n
            align-items: center;\r\n
            gap: 5px;\r\n
          }\r\n
    \r\n
          .page-wrapper .footer {\r\n
            width: 100%;\r\n
            padding: 32px 0px;\r\n
            display: block;\r\n
          }\r\n
    \r\n
          .page-wrapper p.footer-text {\r\n
            padding: 10px;\r\n
          }\r\n
    \r\n
          .page-wrapper .next-steps-title {\r\n
            font-size: 2.5rem !important;\r\n
            text-align: center !important;\r\n
          }\r\n
    \r\n
          .page-wrapper #arrow-container img {\r\n
            padding-left: 10px;\r\n
          }\r\n
    \r\n
          .page-wrapper .title.return {\r\n
            padding: 20px 0 25px 15px !important;\r\n
          }\r\n
    \r\n
          .page-wrapper #form-path form {\r\n
            width: 97% !important;\r\n
          }\r\n
        }\r\n
    \r\n
        /* ==========================================================================\r\n
           FORM STYLES\r\n
           ========================================================================== */\r\n
    \r\n
        .page-wrapper .gmo-form {\r\n
          width: 98%;\r\n
        }\r\n
    \r\n
        .page-wrapper #arrow-container #arrow-inner-container .form-container h3 {\r\n
          line-height: 100%;\r\n
          text-transform: none;\r\n
        }\r\n
    \r\n
        .page-wrapper .title.return {\r\n
          display: flex;\r\n
          padding: 20px 0 20px 45px;\r\n
          min-height: 34px;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path,\r\n
        .page-wrapper #form-hs {\r\n
          background-color: var(--page-blue-form);\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path #form {\r\n
          width: 100%;\r\n
          color: var(--page-white);\r\n
          padding-bottom: 20px;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path form {\r\n
          width: 93%;\r\n
          margin: auto;\r\n
        }\r\n
    \r\n
        /* Form Input Styles */\r\n
        .page-wrapper input[type=text]~label,\r\n
        .page-wrapper input[type=email]~label {\r\n
          color: var(--page-white) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper input[type=text]:focus~label,\r\n
        .page-wrapper input[type=text]:valid~label,\r\n
        .page-wrapper input[type=email]:focus~label,\r\n
        .page-wrapper input[type=email]:valid~label {\r\n
          color: var(--page-white) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper textarea:focus~label,\r\n
        .page-wrapper textarea:valid~label {\r\n
          color: var(--page-white) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper input[type="text"],\r\n
        .page-wrapper input[type="email"],\r\n
        .page-wrapper textarea {\r\n
          color: var(--page-white) !important;\r\n
          border: 1px solid var(--page-green-primary) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper textarea {\r\n
          height: 50px !important;\r\n
          padding: 10px !important;\r\n
        }\r\n
    \r\n
        .page-wrapper input[type=text]:focus,\r\n
        .page-wrapper input[type=text]:valid,\r\n
        .page-wrapper input[type=email]:focus,\r\n
        .page-wrapper input[type=email]:valid,\r\n
        .page-wrapper textarea:focus,\r\n
        .page-wrapper textarea:valid {\r\n
          border-bottom: 1px solid var(--page-green-primary) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper label[for=last_name] {\r\n
          display: flex;\r\n
          flex-direction: column-reverse;\r\n
          position: relative;\r\n
          font-size: 1.2rem !important;\r\n
        }\r\n
    \r\n
        .page-wrapper input[type=submit] {\r\n
          background: var(--page-green-primary) !important;\r\n
          border: 1px solid var(--page-green-primary) !important;\r\n
          padding: 1rem 2rem 1rem 2rem !important;\r\n
          font-size: 1.2rem !important;\r\n
          width: fit-content;\r\n
          /* width: auto !important; */\r\n
          max-width: 100%;\r\n
          white-space: normal;\r\n
        }\r\n
    \r\n
        .page-wrapper #hubspot-form-wrapper {\r\n
          width: 92%;\r\n
          margin: 0 auto;\r\n
          padding-bottom: 40px;\r\n
        }\r\n
    \r\n
        /* Path Form Specific Styles */\r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage form {\r\n
          display: flex;\r\n
          flex-direction: column;\r\n
          gap: 16px;\r\n
          margin: 0 auto;\r\n
          width: 92%;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container {\r\n
          display: flex;\r\n
          flex-direction: column-reverse;\r\n
          padding: 0;\r\n
          position: relative;\r\n
          margin-bottom: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type=select] {\r\n
          flex-direction: column;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type=select] select {\r\n
          white-space: normal;\r\n
          margin: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type=select] select option {\r\n
          background-color: #1f3d74;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type=checkbox] {\r\n
          flex-direction: row;\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type="checkbox"] {\r\n
          align-items: center;\r\n
          gap: 6px;\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type="checkbox"] label {\r\n
          flex: 1;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type=textarea][data-name=question] {\r\n
          margin-top: 0;\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-widget-inpage .pty-apolloapps-input-container[data-type="submit"] {\r\n
          margin-top: 10px;\r\n
        }\r\n
    \r\n
        .page-wrapper #form-path label {\r\n
          position: relative;\r\n
          font-size: 1.2rem;\r\n
          top: auto;\r\n
          left: auto;\r\n
          right: auto;\r\n
          bottom: auto;\r\n
        }\r\n
    \r\n
        /* Checkbox Styles */\r\n
        .page-wrapper .pty-apolloapps-input-container input[type="checkbox"] {\r\n
          appearance: none;\r\n
          -webkit-appearance: none;\r\n
          -moz-appearance: none;\r\n
          width: 20px;\r\n
          height: 20px;\r\n
          position: relative;\r\n
          cursor: pointer;\r\n
          border: 1px solid var(--page-green-primary);\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-input-container input[type="checkbox"]:checked {\r\n
          background-color: transparent !important;\r\n
          border-color: var(--page-green-border) !important;\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-input-container input[type="checkbox"]::after {\r\n
          content: "";\r\n
          position: absolute;\r\n
          left: 6px;\r\n
          top: 2px;\r\n
          width: 5px;\r\n
          height: 10px;\r\n
          border: solid white;\r\n
          border-width: 0 2px 2px 0;\r\n
          opacity: 0;\r\n
          transform: rotate(45deg);\r\n
        }\r\n
    \r\n
        .page-wrapper .pty-apolloapps-input-container input[type="checkbox"]:checked::after {\r\n
          opacity: 1;\r\n
        }\r\n
    \r\n
        .page-wrapper textarea:focus~label,\r\n
        .page-wrapper textarea:valid~label,\r\n
        .page-wrapper textarea~label {\r\n
          font-size: 18px !important;\r\n
          font-weight: 400 !important;\r\n
          font-style: normal !important;\r\n
        }\r\n
    \r\n
        .page-wrapper select {\r\n
          border: 1px solid var(--page-green-primary) !important;\r\n
          background: transparent !important;\r\n
          border-radius: 0 !important;\r\n
          height: 2.3em !important;\r\n
        }\r\n
    \r\n
        /* Form Responsive */\r\n
        @media (max-width: 768px) {\r\n
          .page-wrapper input[type=submit] {\r\n
            width: auto;\r\n
            max-width: 100%;\r\n
            white-space: normal;\r\n
          }\r\n
        }\r\n
      </style>\r\n
    \r\n
    \r\n
      <link href="//glcdn.co/grant/css/font-awesome.css" rel="stylesheet" type="text/css">\r\n
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">\r\n
      <script>\r\n
        document.addEventListener('DOMContentLoaded', () => {\r\n
          const initialContentWrapper = document.getElementById('cards-section');\r\n
          const form1Container = document.getElementById('form-hs');\r\n
          const form2Container = document.getElementById('form-path');\r\n
          const contentHeader1Container = document.getElementById('header-next-steps-paragraph1');\r\n
          const contentHeader2Container = document.getElementById('header-next-steps-paragraph2');\r\n
          const bodyElement = document.body;\r\n
    \r\n
    \r\n
          // Function to inject form content (Handles HubSpot and Generic Widget)\r\n
          const injectFormContent = (targetElement, formId) => {\r\n
            // Clear previous content to ensure a clean state before injecting\r\n
            targetElement.innerHTML = '';\r\n
    \r\n
            if (formId === 'form1') {\r\n
              targetElement.innerHTML = `\r\n
                   <div class="title return"><button class="back-btn"><i class="fa-solid fa-arrow-left"></i> Volver</button> <h3> Explorar por cuenta propia</h3></div>\r\n
                    <!-- <div class="hs-form-frame" data-region="na1" data-form-id="bdf12142-c0d7-4fd8-9c86-b48c065466b7" data-portal-id="19492707"></div> -->\r\n
    \t\t\t\t\t\t\t\t<div id="hubspot-form-wrapper"></div>\r\n
                `;\r\n
              setTimeout(() => {\r\n
                let queryString = window.location.search;\r\n
                let confirmhubspot = '/confirmation/subscribe-purpose-gsd' + queryString;\r\n
                hbspt.forms.create({\r\n
                  portalId: "19492707",\r\n
                  formId: "f6c39361-5cf0-4e71-86e6-486e8428ec5a",\r\n
                  region: "na1",\r\n
                  redirectUrl: confirmhubspot,\r\n
                  target: "#hubspot-form-wrapper",\r\n
                  css: `\r\n
                    form.hs-form {\r\n
                      color: #FFFFFF !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-form-field label {\r\n
                      color: #FFFFFF;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-form-field ul {\r\n
                      list-style: none;\r\n
                      margin-left: -35px;\r\n
                    }\r\n
                    .hs-fieldtype-text {\r\n
                      padding-bottom: 20px !important;\r\n
                    }\r\n
                    .hs-input {\r\n
                      background-color: transparent !important;\r\n
                      border: 1px solid #5DB85B !important;\r\n
                      color: #FFFFFF !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                      padding: 10px !important;\r\n
                      font-size: 16px !important;\r\n
                    }\r\n
                    .hs-input::placeholder {\r\n
                      color: #CCCCCC !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-button {\r\n
                      background-color: #5DB85B !important;\r\n
                      border-color: #5DB85B !important;\r\n
                      color: #FFFFFF !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                      padding: 5px !important;\r\n
                      font-size: 1.2rem !important;\r\n
                    }\r\n
                    .hs-error-msg {\r\n
                      color: #e51520 !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox-display, .hs-richtext, .legal-consent-container {\r\n
                      color: #FFFFFF !important;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox-display a, .hs-richtext a, .legal-consent-container a {\r\n
                      color: #FFFFFF !important;\r\n
                      text-decoration: underline;\r\n
                      font-family: 'Lato', sans-serif !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox {\r\n
                      list-style-type: none !important;\r\n
                      padding-left: 0 !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox-display {\r\n
                      display: flex !important;\r\n
                      align-items: flex-start !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox-display input {\r\n
                      margin-right: 10px !important;\r\n
                      margin-top: 4px !important;\r\n
                    }\r\n
                    .hs-form-booleancheckbox-display input[type="checkbox"] {\r\n
                      appearance: none;\r\n
                      -webkit-appearance: none;\r\n
                      -moz-appearance: none;\r\n
                      width: 20px;\r\n
                      height: 20px;\r\n
                      position: absolute;\r\n
                      cursor: pointer;\r\n
                    }\r\n
    \r\n
                    .hs-form-booleancheckbox-display input[type="checkbox"]:checked {\r\n
                      background-color: transparent !important;\r\n
                      border-color: #009688 !important;\r\n
                    }\r\n
    \r\n
                  .hs-form-booleancheckbox-display input[type="checkbox"]::after {\r\n
                      content: "";\r\n
                      position: absolute;\r\n
                      left: 6px;\r\n
                      top: 2px;\r\n
                      width: 5px;\r\n
                      height: 10px;\r\n
                      border: solid white;\r\n
                      border-width: 0 2px 2px 0;\r\n
                      opacity: 0;\r\n
                      transform: rotate(45deg);\r\n
                    }\r\n
    \r\n
                    .hs-form-booleancheckbox-display input[type="checkbox"]:checked::after {\r\n
                      opacity: 1;\r\n
                    }\r\n
                    \r\n
                    .legal-consent-container .hs-form-booleancheckbox-display>span {\r\n
                      margin-left: 40px !important;\r\n
                      margin-top: 4px !important;\r\n
                  }\r\n
                  `\r\n
                });\r\n
              }, 50);\r\n
    \r\n
    \r\n
            } else if (formId === 'form2') {\r\n
              targetElement.innerHTML = `\r\n
                    <div class="title return"><button class="back-btn"><i class="fa-solid fa-arrow-left"></i>Volver</button><h3>Hablar con alguien</h3></div>\r\n
                    <div id="form"></div>\r\n
    \t\t\t\t\t\t\t\t`;\r\n
              setTimeout(() => {\r\n
                $(document).ready(function () {\r\n
                  var tokenKey = "jl6874awmoky17btk3ofkh";\r\n
                  apolloApsWidget.init({\r\n
                    backend: "https://path-api-widget.globalmediaoutreach.com/",\r\n
                    token_key: tokenKey,\r\n
                    container: "body",\r\n
                    redirectUrl: '/confirmation/connect-purpose-gsd',\r\n
                    url: 'purpose-gsd.elcaminohaciadios.com',\r\n
                    social_networks: {\r\n
                      email: "conectar@elcaminohaciadios.com",\r\n
                      sms: "+12142394388",\r\n
                      telegram: "GodLife2Bot",\r\n
                      facebook: "100069279845339",\r\n
                      whatsapp: "+12142394388",\r\n
                    }\r\n
                  });\r\n
                });\r\n
              }, 50);\r\n
            }\r\n
          };\r\n
    \r\n
          bodyElement.addEventListener('click', (event) => {\r\n
            const clickedElement = event.target.closest('.show-form-btn');\r\n
    \r\n
            if (clickedElement) {\r\n
              event.preventDefault();\r\n
              const formId = clickedElement.dataset.formId;\r\n
    \r\n
              initialContentWrapper.style.display = 'none';\r\n
    \r\n
              form1Container.style.display = 'none';\r\n
              form2Container.style.display = 'none';\r\n
              contentHeader1Container.style.display = 'block';\r\n
              if (contentHeader2Container) contentHeader2Container.style.display = 'block';\r\n
    \r\n
              if (formId === 'form1') {\r\n
                form1Container.style.display = 'block';\r\n
                contentHeader1Container.style.display = 'none';\r\n
                if (contentHeader2Container) contentHeader2Container.style.display = 'none';\r\n
                injectFormContent(form1Container, 'form1');\r\n
              } else if (formId === 'form2') {\r\n
                form2Container.style.display = 'block';\r\n
                contentHeader1Container.style.display = 'none';\r\n
                if (contentHeader2Container) contentHeader2Container.style.display = 'none';\r\n
                injectFormContent(form2Container, 'form2');\r\n
              }\r\n
            }\r\n
    \r\n
            if (event.target.classList.contains('back-btn')) {\r\n
              form1Container.style.display = 'none';\r\n
              form2Container.style.display = 'none';\r\n
              initialContentWrapper.style.display = 'block'; // Or 'flex' as appropriate for your initial layout\r\n
              contentHeader1Container.style.display = 'block';\r\n
              if (contentHeader2Container) contentHeader2Container.style.display = 'block';\r\n
            }\r\n
          });\r\n
    \r\n
        });\r\n
      </script>\r\n
    \r\n
    \r\n
      <div></div>\r\n
    \r\n
      <div class="page-wrapper">\r\n
        <div id="arrow-container">\r\n
          <div id="arrow-inner-container">\r\n
            <div class="arrow-start row">\r\n
              <h1 class="body-text">¿Por Qué Estoy Aquí?</h1>\r\n
              <div class="pointer"></div>\r\n
            </div>\r\n
    \r\n
            <div class="row arrow-step1">\r\n
              <div class="content">\r\n
                <h2>¿Sientes que la vida está fuera de control?</h2>\r\n
                <div class="body-text">\r\n
                  <p>Estás respirando… pero no se siente como vivir.\r\n
                    Sonríes… pero por dentro te sientes vacío(a).\r\n
                    Estás rodeado(a) de gente, pero aún así te sientes invisible.\r\n
                  </p>\r\n
                  <p>No importa lo que intentes — más éxito, más amigos, más distracciones — nada llena ese vacío.\r\n
                  </p>\r\n
                  <p>\r\n
                    Ese anhelo profundo… está señalando algo más grande.\r\n
                  </p>\r\n
                  <p>\r\n
                    <strong>Hay esperanza. <br>\r\n
                      Hay una razón por la cual estás aquí.</strong>\r\n
                  </p>\r\n
                </div>\r\n
              </div>\r\n
              <img src="https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Purpose-gsd/Section1.png" alt="Caos">\r\n
              <div class="pointer"></div>\r\n
            </div>\r\n
    \r\n
            <div class="row arrow-step2">\r\n
              <div class="content">\r\n
                <h2>Lo que te falta tal vez no sea un “qué”… sino un Quién.</h2>\r\n
                <div class="body-text">\r\n
                  <p>Jesús es el Hijo de Dios.\r\n
                    Él lo dio todo para estar cerca de ti.\r\n
                  </p>\r\n
                  <p>Llevó el peso de cada error, cada arrepentimiento y cada herida —\r\n
                    y murió en tu lugar.\r\n
                  </p>\r\n
                  <p>Pero la historia no termina allí.\r\n
                  </p>\r\n
                  <p>Jesús resucitó, venciendo la muerte y ofreciendo vida eterna y un propósito duradero a todo el que\r\n
                    cree.</p>\r\n
                </div>\r\n
              </div>\r\n
              <img src="https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Purpose-gsd/Section2.png" alt="Paz">\r\n
              <div class="pointer"></div>\r\n
            </div>\r\n
    \r\n
            <div class="row arrow-step3">\r\n
              <div class="content">\r\n
                <h2>A través de Él, puedes encontrar lo que has estado buscando:</h2>\r\n
                <div class="body-text" style="margin-bottom: 30px;">\r\n
                  <p><strong>Pertenencia. Significado. Un nuevo comienzo.</strong></p>\r\n
                  <p>No tienes que seguir buscando solo(a).</p>\r\n
                  <p>Cuando le pides perdón a Jesús y confías en Él,\r\n
                    Él te recibe con amor.\r\n
                    Camina contigo.\r\n
                    Te da una paz que permanece — sin importar cómo se vea la vida.\r\n
                  </p>\r\n
                </div>\r\n
              </div>\r\n
              <img src="https://gmo-media.s3.us-east-1.amazonaws.com/websites/godlife/gospel/Purpose-gsd/Section3.png" alt="Cross">\r\n
              <div class="pointer"></div>\r\n
            </div>\r\n
    \r\n
            <div class="row arrow-step2">\r\n
              <div class="content">\r\n
                <h2>Puedes empezar a hablar con Él ahora mismo.</h2>\r\n
                <div class="body-text">\r\n
                  <p>Háblale como si fuera un amigo. <br>\r\n
                    <strong>Él está escuchando.</strong>\r\n
                  </p>\r\n
                </div>\r\n
              </div>\r\n
            </div>\r\n
    \r\n
            <div class="row arrow-step4">\r\n
              <div class="content">\r\n
                <h2 class="next-steps-title">¿CUÁL ES TU PRÓXIMO PASO?</h2>\r\n
    \r\n
                <p id="header-next-steps-paragraph1" class="next-steps-paragraph1">Ya sea que quieras explorar esto por tu\r\n
                  cuenta o hablar con alguien que te entienda, estamos aquí para ti.</p>\r\n
    \r\n
                <!-- <p id="header-next-steps-paragraph2" class="next-steps-paragraph2">Se você está pronto para explorar isso,\r\n
                  escolha o próximo passo que se encaixa melhor em sua jornada.</p> -->\r\n
    \r\n
                <h3 class="next-steps-heading">Próximos pasos</h3>\r\n
    \r\n
                <div id="form-hs" class="form-container"></div>\r\n
    \r\n
                <div id="form-path" class="form-container"></div>\r\n
    \r\n
                <div id="cards-section" class="body-text">\r\n
                  <div class="next-steps-cards">\r\n
                    <div class="next-steps-left">\r\n
                      <div class="card">\r\n
                        <h3>Explorar por mi cuenta</h3>\r\n
                        <p>Recibe contenido para ayudarte a entender lo que dice la Biblia sobre la vida, la muerte y la\r\n
                          esperanza eterna.</p>\r\n
                        <a class="btn show-form-btn" data-form-id="form1" href="#"> Subscribirme\r\n
                          <i class="fas fa-envelope" style="margin-left: 10px;"></i>\r\n
                        </a>\r\n
                      </div>\r\n
    \r\n
                      <div class="card">\r\n
                        <h3>Hablar con alguien</h3>\r\n
                        <p>Chatea ahora con un voluntario capacitado que puede ayudarte a explorar la fe y lo que significa\r\n
                          conocer a Jesús.</p>\r\n
                        <a class="btn show-form-btn" data-form-id="form2" href="#"> Conectar\r\n
                          <i class="fas fa-comment-dots" style="margin-left: 10px;"></i>\r\n
                        </a>\r\n
                      </div>\r\n
                    </div>\r\n
                    <div class="next-steps-right"></div>\r\n
                  </div>\r\n
                </div>\r\n
              </div>\r\n
            </div>\r\n
          </div>\r\n
    \r\n
          <footer class="footer">\r\n
            <a href="https://elcaminohaciadios.com" class="footer-logo">\r\n
              <img class="logo my-class" src="https://elcaminohaciadios.com/files/Bell/img/siglas_y_texto_horizontal_blanco_100px.png">\r\n
            </a>\r\n
            <!-- <a href="https://pt.godlife.com"><img class="logo my-class"\r\n
                src="https://gmo-media.s3.amazonaws.com/websites/godlife/cms/images/godlife-logo-white.png"></a> -->\r\n
    \r\n
            <div class="footer-text-container">\r\n
              <p class="footer-text">© 2025 elcaminohaciadios.com es una marca comercial de Global\r\n
                Media Outreach</p>\r\n
              <p class="footer-text footer-links">\r\n
                <a href="https://elcaminohaciadios.com/article/condiciones-de-uso">Condiciones de Uso</a> |\r\n
                <a href="https://elcaminohaciadios.com/article/politica-de-privacidad">Política de Privacidad</a>\r\n
              </p>\r\n
            </div>\r\n
          </footer>\r\n
    \r\n
          <script charset="utf-8" type="text/javascript" src="https://js.hsforms.net/forms/embed/v2.js"></script>\r\n
    \r\n
          <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>\r\n
          <link rel="stylesheet" href="https://path-widgetcdn.globalmediaoutreach.com/apolloapps.path.widget.css">\r\n
          <script src="https://path-widgetcdn.globalmediaoutreach.com/apolloapps.path.widget.js"></script>\r\n
        </div>\r\n
      </div>
    """
  "meta_title" => ""
  "meta_description" => ""
  "meta_keywords" => ""
  "link" => "/gospel/purpose-gsd?_locale=es"
  "canonical" => "purpose-gsd"
]

"purpose-gsd"

"purpose-gsd"

App\Domain\Visitor {#2140
  #euCountryList: [
    "at"
    "be"
    "bg"
    "hr"
    "cy"
    "cz"
    "dk"
    "ee"
    "fi"
    "fr"
    "de"
    "gr"
    "hu"
    "ie"
    "it"
    "lv"
    "lt"
    "lu"
    "mt"
    "nl"
    "pl"
    "pt"
    "ro"
    "sk"
    "si"
    "es"
    "se"
    "uk"
    "is"
    "li"
    "no"
    "ch"
    "br"
  ]
  #domain: "elcaminohaciadios.com"
  #locale: "es"
  #statsDomain: "purpose-gsd.elcaminohaciadios.com"
  #isMobile: false
  #visitorId: "17927900923321293"
  #vendorId: ""
  #campaignId: ""
  #adId: ""
  #geo: App\GeoLocation\GeoLocation {#2916 …}
  #device: App\Device\Storage\Device {#2915 …}
  #ip: "216.73.216.143"
  #userAgent: "Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)"
  #clickId: null
  #isPreviousVisitor: false
  #isGdprOptIn: false
  #isGdprRequested: false
}

"nowhere"

"*/*"

"gzip, br, zstd, deflate"

"AWSALB=7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/; AWSALBCORS=7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/"

"elcaminohaciadios.com"

"http://elcaminohaciadios.com/gospel/purpose-gsd"

"Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)"

"Root=1-6adbce4c-085428fd78de6bcd588e2174"

"216.73.216.143"

"443"

"https"

"1"

"no-cache, private"

"text/html; charset=UTF-8"

"Fri, 23 Oct 2026 21:14:53 GMT"

"<http://elcaminohaciadios.com/api/docs.jsonld>; rel="http://www.w3.org/ns/hydra/core#apiDocumentation""

"no-referrer, strict-origin-when-cross-origin"

"gl=eyJ2aXNpdG9ySWQiOiIxNzkyNzkwMDkyMzMyMTI5MyIsImVudHJ5RG9tYWluIjoicHVycG9zZS1nc2QuZWxjYW1pbm9oYWNpYWRpb3MuY29tIiwiZW50cnlMb2NhbGUiOiJlcyIsImxhc3RWaXNpdCI6MTc5Mjc5MDA5MywibGFzdFBhZ2UiOiJodHRwOlwvXC9lbGNhbWlub2hhY2lhZGlvcy5jb21cL2dvc3BlbFwvcHVycG9zZS1nc2QiLCJ2ZXJzaW9uIjoyfQ%3D%3D; path=/; domain=elcaminohaciadios.com; samesite=lax"

"nosniff"

"c78418"

"DENY"

"1; mode=block"

"7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/"

"7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/"

App\Domain\Cookie\VisitorCookie {#3279
  #name: "gl"
  #value: null
  #domain: "elcaminohaciadios.com"
  #expire: 0
  #path: "/"
  #secure: false
  #httpOnly: false
  -raw: false
  -sameSite: "lax"
  -secureDefault: false
  #properties: Symfony\Component\HttpFoundation\ParameterBag {#3321 …}
}

"Fri, 23 Oct 26 16:14:52 -0500"

"Fri, 23 Oct 26 16:14:52 -0500"

1209600

"es"

"dev"

"b816d0a8065837ac9b08c0740659a8d9"

"^https?://(localhost|127\.0\.0\.1)(:[0-9]+)?$"

"mysql://db_user:db_password@localhost:3306/db_name?serverVersion=5.7"

"smtp://localhost"

"127.0.0.0/8"

"1"

"/var/www/discipleship/spanish/public"

""

"/var/www/discipleship/spanish/public"

"RESPONDER"

"CGI/1.1"

"/usr/share/httpd"

"*/*"

"gzip, br, zstd, deflate"

"AWSALB=7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/; AWSALBCORS=7ZJrhTrFv9Sfx9b+eGEBYydlX6esMFRiF8ITLV8X6YyMbbec1W+5sr5osDgcu76mvOVgXtwXniMIJAbIkiYGihF5VdE/36nFtfiIvODv+pp9cvliktfhfwEuN6r/"

"elcaminohaciadios.com"

"http://elcaminohaciadios.com/gospel/purpose-gsd"

"Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)"

"Root=1-6adbce4c-085428fd78de6bcd588e2174"

"216.73.216.143"

"443"

"https"

"/usr/share/Modules/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin"

"production"

"/index.php"

""

"http://elcaminohaciadios.com/gospel/purpose-gsd"

"/gospel/purpose-gsd"

"200"

"atvOTFvrUUFQbfAn415WvwAAAJg"

"/gospel/purpose-gsd"

"172.30.0.31"

"34886"

"GET"

"http"

1792790092

1792790092.6057

"/gospel/purpose-gsd"

"/var/www/discipleship/spanish/public/index.php"

"/index.php"

"http://elcaminohaciadios.com/gospel/purpose-gsd"

"/gospel/purpose-gsd"

"172.30.1.149"

"root@localhost"

"elcaminohaciadios.com"

"80"

"HTTP/1.1"

""

"Apache"

"APP_ENV,APP_SECRET,TRUSTED_PROXIES,DATABASE_URL,CORS_ALLOW_ORIGIN,MAILER_DSN"

"atvOTFvrUUFQbfAn415WvwAAAJg"

"apache"

"1"