From fedfec8f972555ee788a281dc7ae1a499bd44990 Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Fri, 4 Aug 2023 21:15:48 -0400
Subject: [PATCH 1/7] financial well-being wonky no-js

---
 .../apps/financial-well-being/css/main.less          |  2 ++
 .../apps/financial-well-being/css/no-js.less         | 12 ++++++++++++
 .../wellbeing/jinja2/wellbeing/_templates/no_js.html | 11 +++++++++++
 cfgov/wellbeing/jinja2/wellbeing/home.html           |  3 +++
 4 files changed, 28 insertions(+)
 create mode 100644 cfgov/unprocessed/apps/financial-well-being/css/no-js.less
 create mode 100644 cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html

diff --git a/cfgov/unprocessed/apps/financial-well-being/css/main.less b/cfgov/unprocessed/apps/financial-well-being/css/main.less
index 42724b06574..ef428391983 100644
--- a/cfgov/unprocessed/apps/financial-well-being/css/main.less
+++ b/cfgov/unprocessed/apps/financial-well-being/css/main.less
@@ -1,3 +1,5 @@
+@import (less) './no-js.less';
+
 .save-links {
   padding-bottom: 15px;
   border-bottom: 1px solid #b4b5b6;
diff --git a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
new file mode 100644
index 00000000000..648f780a138
--- /dev/null
+++ b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
@@ -0,0 +1,12 @@
+.no-js {
+  /* Show the no-js notification when Javascript is disabled. */
+  .m-notification__no-js {
+    display: block;
+    margin: 30px;
+  }
+
+  /* Hide ROUT when JavaScript is disabled. */
+  #quiz-form {
+    display: none;
+  }
+}
diff --git a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
new file mode 100644
index 00000000000..ea8e577430f
--- /dev/null
+++ b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
@@ -0,0 +1,11 @@
+<div class="m-notification
+            m-notification__error
+            m-notification__no-js">
+    {{ svg_icon('error-round') }}
+    <div class="m-notification_content">
+        <div class="h4 m-notification_message">
+            This form is not supported in your browser.
+            Please try a newer browser or confirm that JavaScript is enabled.
+        </div>
+     </div>
+</div>
\ No newline at end of file
diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 7bbf7b101b9..4cd40f041ea 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -20,6 +20,8 @@
 
 {% block css -%}
     {{ super() }}
+    <link rel="stylesheet"
+    href="{{ static('apps/financial-well-being/css/main.css') }}">
     <style>
         .m-hero {
             background-color: #7eb7e8;
@@ -102,6 +104,7 @@ <h2>{{ _('Here’s how it works:') }}</h2>
         </div>
     </div>
 
+    {% include "_templates/no_js.html" %}
     <form id="quiz-form" action="{{ url('fwb_results_' + current_language) }}" method="POST">
         <div class="block">
             <h2>{{ _('Part 1: How well does this statement describe you or your situation?') }}</h2>

From 52a4d63e3ca3da8a15be07e9ffd6431682fb5f43 Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 12:04:31 -0400
Subject: [PATCH 2/7] u-hide-if-js adjustments

---
 .../unprocessed/apps/financial-well-being/css/no-js.less  | 8 +-------
 cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html    | 2 +-
 cfgov/wellbeing/jinja2/wellbeing/home.html                | 2 +-
 3 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
index 648f780a138..88445d95e6e 100644
--- a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
+++ b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
@@ -1,11 +1,5 @@
 .no-js {
-  /* Show the no-js notification when Javascript is disabled. */
-  .m-notification__no-js {
-    display: block;
-    margin: 30px;
-  }
-
-  /* Hide ROUT when JavaScript is disabled. */
+  /* Hide 'Financial Well Being' form when JavaScript is disabled. */
   #quiz-form {
     display: none;
   }
diff --git a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
index ea8e577430f..aa3f7517c9e 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
@@ -1,6 +1,6 @@
 <div class="m-notification
             m-notification__error
-            m-notification__no-js">
+            u-hide-if-js">
     {{ svg_icon('error-round') }}
     <div class="m-notification_content">
         <div class="h4 m-notification_message">
diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 4cd40f041ea..64c00e2225c 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -21,7 +21,7 @@
 {% block css -%}
     {{ super() }}
     <link rel="stylesheet"
-    href="{{ static('apps/financial-well-being/css/main.css') }}">
+          href="{{ static('apps/financial-well-being/css/main.css') }}">
     <style>
         .m-hero {
             background-color: #7eb7e8;

From 20458b9e610f50c66ee83555402b8d26ae8cbf3f Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 15:02:59 -0400
Subject: [PATCH 3/7] main content adjustment

---
 .../apps/financial-well-being/css/no-js.less  |   12 +-
 cfgov/wellbeing/jinja2/wellbeing/home.html    | 1717 +++++++++--------
 2 files changed, 867 insertions(+), 862 deletions(-)

diff --git a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
index 88445d95e6e..299f0691394 100644
--- a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
+++ b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
@@ -1,6 +1,8 @@
-.no-js {
-  /* Hide 'Financial Well Being' form when JavaScript is disabled. */
-  #quiz-form {
-    display: none;
-  }
+.u-hide-if-js > * {
+  display: block;
+}
+
+/* Hide 'Financial Well Being' form when JavaScript is disabled. */
+.no-js-hide {
+  display: none;
 }
diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 64c00e2225c..7e91eb177da 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -59,888 +59,891 @@ <h1 class="m-hero_heading">{{ _('Find out your financial well-being') }}</h1>
 {%- endblock %}
 
 {% block content_main -%}
+{% include "_templates/no_js.html" %}
 
-    <p>
-      {% if (current_language == 'en') %}
-      <a href="{{ url('fwb_home_es') }}" hreflang="es" lang="es">Ver página en español</a>
-      {% else %}
-      <a href="{{ url('fwb_home_en') }}" hreflang="en" lang="en">View page in English</a>
-      {% endif %}
-    </p>
+    <div class="no-js-hide"
 
-    <h2>{{ _('Here’s how it works:') }}</h2>
+        <p>
+        {% if (current_language == 'en') %}
+        <a href="{{ url('fwb_home_es') }}" hreflang="es" lang="es">Ver página en español</a>
+        {% else %}
+        <a href="{{ url('fwb_home_en') }}" hreflang="en" lang="en">View page in English</a>
+        {% endif %}
+        </p>
 
-    <p>
-        <b>{{ _('Answer the questions and get your score.') }}</b>
-        {{ _('You won’t be asked about any personal financial data—it’s not that kind of questionnaire.') }}
-        <a href="{{ url('fwb_about_' + current_language) }}">{{ _('See how and why we developed it.') }}</a>
-    </p>
-    <p>
-        <b>{{ _('Review steps you can take') }}</b>
-        {{ _('if you want to be able to answer the questions differently.') }}
-    </p>
+        <h2>{{ _('Here’s how it works:') }}</h2>
 
-    <p>
-        <b>{{ _('See how your score compares') }}</b>
-        {{ _('to other U.S. adults from our national survey.') }}
-    </p>
+        <p>
+            <b>{{ _('Answer the questions and get your score.') }}</b>
+            {{ _('You won’t be asked about any personal financial data—it’s not that kind of questionnaire.') }}
+            <a href="{{ url('fwb_about_' + current_language) }}">{{ _('See how and why we developed it.') }}</a>
+        </p>
+        <p>
+            <b>{{ _('Review steps you can take') }}</b>
+            {{ _('if you want to be able to answer the questions differently.') }}
+        </p>
 
-    <div class="m-notification
-                m-notification__visible
-                m-notification__warning">
-        {{ svg_icon('warning-round') }}
-        <div class="m-notification_content">
-            <p class="h4 m-notification_message">
-                {{ _('We never collect or store the answers you provide.') }}
-            </p>
-            <ul class="m-list m-list__links">
-                <li class="m-list_item">
-                    <a class="m-list_link"
-                       href="/privacy/website-privacy-policy/">
-                        {{ _('See how your privacy is protected.') }}
-                    </a>
-                </li>
-            </ul>
-        </div>
-    </div>
+        <p>
+            <b>{{ _('See how your score compares') }}</b>
+            {{ _('to other U.S. adults from our national survey.') }}
+        </p>
 
-    {% include "_templates/no_js.html" %}
-    <form id="quiz-form" action="{{ url('fwb_results_' + current_language) }}" method="POST">
-        <div class="block">
-            <h2>{{ _('Part 1: How well does this statement describe you or your situation?') }}</h2>
-            <div class="o-well">
-                <fieldset class="o-form_fieldset o-scale" id="question_1">
-                    <h3 class="a-legend">
-                        {{ _('I could handle a major unexpected expense') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }}</div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_1-completely"
-                                   name="question_1"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I could handle a major unexpected expense"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_1-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_1-very-well"
-                                   name="question_1"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I could handle a major unexpected expense"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_1-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_1-somewhat"
-                                   name="question_1"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I could handle a major unexpected expense"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_1-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_1-very-little"
-                                   name="question_1"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I could handle a major unexpected expense"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_1-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_1-not-at-all"
-                                   name="question_1"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I could handle a major unexpected expense"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_1-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_2">
-                    <h3 class="a-legend">
-                        {{ _('I am securing my financial future') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_2-completely"
-                                   name="question_2"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am securing my financial future"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_2-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_2-very-well"
-                                   name="question_2"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am securing my financial future"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_2-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_2-somewhat"
-                                   name="question_2"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am securing my financial future"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_2-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_2-very-little"
-                                   name="question_2"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am securing my financial future"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_2-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_2-not-at-all"
-                                   name="question_2"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am securing my financial future"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_2-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_3">
-                    <h3 class="a-legend">
-                        {{ _('Because of my money situation, I feel like I will never have the things I want in life') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_3-completely"
-                                   name="question_3"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_3-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_3-very-well"
-                                   name="question_3"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_3-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_3-somewhat"
-                                   name="question_3"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_3-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_3-very-little"
-                                   name="question_3"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_3-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_3-not-at-all"
-                                   name="question_3"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_3-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_4">
-                    <h3 class="a-legend">
-                        {{ _('I can enjoy life because of the way I’m managing my money') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_4-completely"
-                                   name="question_4"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I can enjoy life because of the way I’m managing my money"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_4-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_4-very-well"
-                                   name="question_4"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I can enjoy life because of the way I’m managing my money"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_4-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_4-somewhat"
-                                   name="question_4"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I can enjoy life because of the way I’m managing my money"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_4-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_4-very-little"
-                                   name="question_4"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I can enjoy life because of the way I’m managing my money"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_4-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_4-not-at-all"
-                                   name="question_4"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I can enjoy life because of the way I’m managing my money"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_4-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_5">
-                    <h3 class="a-legend">
-                        {{ _('I am just getting by financially') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_5-completely"
-                                   name="question_5"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am just getting by financially"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_5-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_5-very-well"
-                                   name="question_5"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am just getting by financially"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_5-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_5-somewhat"
-                                   name="question_5"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am just getting by financially"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_5-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_5-very-little"
-                                   name="question_5"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am just getting by financially"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_5-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_5-not-at-all"
-                                   name="question_5"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am just getting by financially"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_5-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_6">
-                    <h3 class="a-legend">
-                        {{ _('I am concerned that the money I have or will save won’t last') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_6-completely"
-                                   name="question_6"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am concerned that the money I have or will save won’t last"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_6-completely">
-                                {{ _('Completely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_6-very-well"
-                                   name="question_6"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am concerned that the money I have or will save won’t last"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_6-very-well">
-                                {{ _('Very well') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_6-somewhat"
-                                   name="question_6"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am concerned that the money I have or will save won’t last"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_6-somewhat">
-                                {{ _('Somewhat') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_6-very-little"
-                                   name="question_6"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am concerned that the money I have or will save won’t last"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_6-very-little">
-                                {{ _('Very little') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_6-not-at-all"
-                                   name="question_6"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am concerned that the money I have or will save won’t last"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_6-not-at-all">
-                                {{ _('Not at all') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
+        <div class="m-notification
+                    m-notification__visible
+                    m-notification__warning">
+            {{ svg_icon('warning-round') }}
+            <div class="m-notification_content">
+                <p class="h4 m-notification_message">
+                    {{ _('We never collect or store the answers you provide.') }}
+                </p>
+                <ul class="m-list m-list__links">
+                    <li class="m-list_item">
+                        <a class="m-list_link"
+                        href="/privacy/website-privacy-policy/">
+                            {{ _('See how your privacy is protected.') }}
+                        </a>
+                    </li>
+                </ul>
             </div>
         </div>
-        <div class="block">
-            <h2>{{ _('Part 2: How often does this statement apply to you?') }}</h2>
-            <div class="o-well">
-                <fieldset class="o-form_fieldset o-scale" id="question_7">
-                    <h3 class="a-legend">
-                        {{ _('Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_7-always"
-                                   name="question_7"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_7-always">
-                                {{ _('Always') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_7-often"
-                                   name="question_7"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_7-often">
-                                {{ _('Often') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_7-sometimes"
-                                   name="question_7"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_7-sometimes">
-                                {{ _('Sometimes') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_7-rarely"
-                                   name="question_7"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_7-rarely">
-                                {{ _('Rarely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_7-never"
-                                   name="question_7"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_7-never">
-                                {{ _('Never') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_8">
-                    <h3 class="a-legend">
-                        {{ _('I have money left over at the end of the month') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_8-always"
-                                   name="question_8"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I have money left over at the end of the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction"> <label class="a-label" for="question_8-always">
-                                {{ _('Always') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_8-often"
-                                   name="question_8"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I have money left over at the end of the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_8-often">
-                                {{ _('Often') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_8-sometimes"
-                                   name="question_8"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I have money left over at the end of the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_8-sometimes">
-                                {{ _('Sometimes') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_8-rarely"
-                                   name="question_8"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I have money left over at the end of the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_8-rarely">
-                                {{ _('Rarely') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_8-never"
-                                   name="question_8"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I have money left over at the end of the month"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_8-never">
-                                {{ _('Never') }}
-                            </label>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_9">
-                    <h3 class="a-legend">
-                        {{ _('I am behind with my finances') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_9-always"
-                                   name="question_9"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am behind with my finances"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_9-always">
-                                {{ _('Always') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_9-often"
-                                   name="question_9"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am behind with my finances"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_9-often">
-                                {{ _('Often') }}
-                            </label>
-                        </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_9-sometimes"
-                                   name="question_9"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am behind with my finances"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_9-sometimes">
-                                {{ _('Sometimes') }}
-                            </label>
+
+        <form id="quiz-form" action="{{ url('fwb_results_' + current_language) }}" method="POST">
+            <div class="block">
+                <h2>{{ _('Part 1: How well does this statement describe you or your situation?') }}</h2>
+                <div class="o-well">
+                    <fieldset class="o-form_fieldset o-scale" id="question_1">
+                        <h3 class="a-legend">
+                            {{ _('I could handle a major unexpected expense') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }}</div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_1-completely"
+                                    name="question_1"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I could handle a major unexpected expense"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_1-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_1-very-well"
+                                    name="question_1"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I could handle a major unexpected expense"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_1-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_1-somewhat"
+                                    name="question_1"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I could handle a major unexpected expense"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_1-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_1-very-little"
+                                    name="question_1"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I could handle a major unexpected expense"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_1-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_1-not-at-all"
+                                    name="question_1"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I could handle a major unexpected expense"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_1-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_9-rarely"
-                                   name="question_9"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am behind with my finances"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_9-rarely">
-                                {{ _('Rarely') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_2">
+                        <h3 class="a-legend">
+                            {{ _('I am securing my financial future') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_2-completely"
+                                    name="question_2"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am securing my financial future"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_2-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_2-very-well"
+                                    name="question_2"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am securing my financial future"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_2-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_2-somewhat"
+                                    name="question_2"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am securing my financial future"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_2-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_2-very-little"
+                                    name="question_2"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am securing my financial future"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_2-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_2-not-at-all"
+                                    name="question_2"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am securing my financial future"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_2-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_9-never"
-                                   name="question_9"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="I am behind with my finances"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_9-never">
-                                {{ _('Never') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_3">
+                        <h3 class="a-legend">
+                            {{ _('Because of my money situation, I feel like I will never have the things I want in life') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_3-completely"
+                                    name="question_3"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_3-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_3-very-well"
+                                    name="question_3"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_3-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_3-somewhat"
+                                    name="question_3"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_3-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_3-very-little"
+                                    name="question_3"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_3-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_3-not-at-all"
+                                    name="question_3"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Because of my money situation, I feel like I will never have the things I want in life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_3-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                    </div>
-                </fieldset>
-                <fieldset class="o-form_fieldset o-scale" id="question_10">
-                    <h3 class="a-legend">
-                        {{ _('My finances control my life') }}
-                    </h3>
-                    <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
-                    <div class="o-scale_answer-options">
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_10-always"
-                                   name="question_10"
-                                   value="0"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="My finances control my life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_10-always">
-                                {{ _('Always') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_4">
+                        <h3 class="a-legend">
+                            {{ _('I can enjoy life because of the way I’m managing my money') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_4-completely"
+                                    name="question_4"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I can enjoy life because of the way I’m managing my money"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_4-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_4-very-well"
+                                    name="question_4"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I can enjoy life because of the way I’m managing my money"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_4-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_4-somewhat"
+                                    name="question_4"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I can enjoy life because of the way I’m managing my money"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_4-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_4-very-little"
+                                    name="question_4"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I can enjoy life because of the way I’m managing my money"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_4-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_4-not-at-all"
+                                    name="question_4"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I can enjoy life because of the way I’m managing my money"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_4-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_10-often"
-                                   name="question_10"
-                                   value="1"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="My finances control my life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_10-often">
-                                {{ _('Often') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_5">
+                        <h3 class="a-legend">
+                            {{ _('I am just getting by financially') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_5-completely"
+                                    name="question_5"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am just getting by financially"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_5-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_5-very-well"
+                                    name="question_5"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am just getting by financially"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_5-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_5-somewhat"
+                                    name="question_5"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am just getting by financially"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_5-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_5-very-little"
+                                    name="question_5"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am just getting by financially"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_5-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_5-not-at-all"
+                                    name="question_5"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am just getting by financially"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_5-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_10-sometimes"
-                                   name="question_10"
-                                   value="2"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="My finances control my life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_10-sometimes">
-                                {{ _('Sometimes') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_6">
+                        <h3 class="a-legend">
+                            {{ _('I am concerned that the money I have or will save won’t last') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement describes me') }} </div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_6-completely"
+                                    name="question_6"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am concerned that the money I have or will save won’t last"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_6-completely">
+                                    {{ _('Completely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_6-very-well"
+                                    name="question_6"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am concerned that the money I have or will save won’t last"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_6-very-well">
+                                    {{ _('Very well') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_6-somewhat"
+                                    name="question_6"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am concerned that the money I have or will save won’t last"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_6-somewhat">
+                                    {{ _('Somewhat') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_6-very-little"
+                                    name="question_6"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am concerned that the money I have or will save won’t last"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_6-very-little">
+                                    {{ _('Very little') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_6-not-at-all"
+                                    name="question_6"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am concerned that the money I have or will save won’t last"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_6-not-at-all">
+                                    {{ _('Not at all') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_10-rarely"
-                                   name="question_10"
-                                   value="3"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="My finances control my life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_10-rarely">
-                                {{ _('Rarely') }}
-                            </label>
+                    </fieldset>
+                </div>
+            </div>
+            <div class="block">
+                <h2>{{ _('Part 2: How often does this statement apply to you?') }}</h2>
+                <div class="o-well">
+                    <fieldset class="o-form_fieldset o-scale" id="question_7">
+                        <h3 class="a-legend">
+                            {{ _('Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_7-always"
+                                    name="question_7"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_7-always">
+                                    {{ _('Always') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_7-often"
+                                    name="question_7"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_7-often">
+                                    {{ _('Often') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_7-sometimes"
+                                    name="question_7"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_7-sometimes">
+                                    {{ _('Sometimes') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_7-rarely"
+                                    name="question_7"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_7-rarely">
+                                    {{ _('Rarely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_7-never"
+                                    name="question_7"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="Giving a gift for a wedding, birthday or other occasion would put a strain on my finances for the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_7-never">
+                                    {{ _('Never') }}
+                                </label>
+                            </div>
                         </div>
-                        <div class="m-form-field m-form-field__radio">
-                            <input class="a-radio"
-                                   type="radio"
-                                   id="question_10-never"
-                                   name="question_10"
-                                   value="4"
-                                   data-gtm-action="Questionnaire Radio Button Clicked"
-                                   data-gtm-label="My finances control my life"
-                                   data-gtm-category="Financial Well-Being Tool Interaction">
-                            <label class="a-label" for="question_10-never">
-                                {{ _('Never') }}
-                            </label>
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_8">
+                        <h3 class="a-legend">
+                            {{ _('I have money left over at the end of the month') }}
+                        </h3>
+                        <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_8-always"
+                                    name="question_8"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I have money left over at the end of the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction"> <label class="a-label" for="question_8-always">
+                                    {{ _('Always') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_8-often"
+                                    name="question_8"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I have money left over at the end of the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_8-often">
+                                    {{ _('Often') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_8-sometimes"
+                                    name="question_8"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I have money left over at the end of the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_8-sometimes">
+                                    {{ _('Sometimes') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_8-rarely"
+                                    name="question_8"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I have money left over at the end of the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_8-rarely">
+                                    {{ _('Rarely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_8-never"
+                                    name="question_8"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I have money left over at the end of the month"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_8-never">
+                                    {{ _('Never') }}
+                                </label>
+                            </div>
                         </div>
-                    </div>
-                </fieldset>
-            </div>
-        </div>
-        <div class="block u-mb30">
-            <h2>{{ _('About you') }}</h2>
-            <div class="o-well">
-                <div class="o-form_group">
-                    <fieldset class="o-form_fieldset" id="age">
+                    </fieldset>
+                    <fieldset class="o-form_fieldset o-scale" id="question_9">
                         <h3 class="a-legend">
-                            {{ _('Select your age group. This changes the scoring calculation.') }}
+                            {{ _('I am behind with my finances') }}
                         </h3>
-                        <ul class="m-list m-list__unstyled content-l">
-                            <li class="content-l_col content-l_col-1-2">
-                                <div class="m-form-field m-form-field__radio m-form-field__lg-target">
-                                    <input class="a-radio"
-                                           type="radio"
-                                           name="age"
-                                           id="age-18-61"
-                                           value="18-61"
-                                           data-gtm-action="Questionnaire Radio Button Clicked"
-                                           data-gtm-label="Select your age group: 18-61"
-                                           data-gtm-category="Financial Well-Being Tool Interaction">
-                                    <label class="a-label" for="age-18-61">
-                                        18–61
-                                    </label>
-                                </div>
-                            </li>
-                            <li class="content-l_col content-l_col-1-2">
-                                <div class="m-form-field m-form-field__radio m-form-field__lg-target">
-                                    <input class="a-radio"
-                                           type="radio"
-                                           name="age"
-                                           id="age-62-plus"
-                                           value="62-plus"
-                                           data-gtm-action="Questionnaire Radio Button Clicked"
-                                           data-gtm-label="Select your age group: 62+"
-                                           data-gtm-category="Financial Well-Being Tool Interaction">
-                                    <label class="a-label" for="age-62-plus">
-                                        62+
-                                    </label>
-                                </div>
-                            </li>
-                        </ul>
+                        <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_9-always"
+                                    name="question_9"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am behind with my finances"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_9-always">
+                                    {{ _('Always') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_9-often"
+                                    name="question_9"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am behind with my finances"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_9-often">
+                                    {{ _('Often') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_9-sometimes"
+                                    name="question_9"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am behind with my finances"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_9-sometimes">
+                                    {{ _('Sometimes') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_9-rarely"
+                                    name="question_9"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am behind with my finances"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_9-rarely">
+                                    {{ _('Rarely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_9-never"
+                                    name="question_9"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="I am behind with my finances"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_9-never">
+                                    {{ _('Never') }}
+                                </label>
+                            </div>
+                        </div>
                     </fieldset>
-                </div>
-                <div>
-                    <fieldset class="o-form_fieldset" id="method">
+                    <fieldset class="o-form_fieldset o-scale" id="question_10">
                         <h3 class="a-legend">
-                            {{ _('Select how you completed the questionnaire. This changes the scoring calculation.') }}
+                            {{ _('My finances control my life') }}
                         </h3>
-                        <ul class="m-list m-list__unstyled content-l">
-                            <li class="content-l_col content-l_col-1-2">
-                                <div class="m-form-field m-form-field__radio m-form-field__lg-target">
-                                    <input class="a-radio"
-                                           type="radio"
-                                           name="method"
-                                           id="read-self"
-                                           value="read-self"
-                                           data-gtm-action="Questionnaire Radio Button Clicked"
-                                           data-gtm-label="Select how you completed the questionnaire: I read and answered the questions myself"
-                                           data-gtm-category="Financial Well-Being Tool Interaction"
-                                           checked>
-                                    <label class="a-label" for="read-self">
-                                        {{ _('I read and answered the questions myself') }}
-                                    </label>
-                                </div>
-                            </li>
-                            <li class="content-l_col content-l_col-1-2">
-                                <div class="m-form-field m-form-field__radio m-form-field__lg-target">
-                                    <input class="a-radio"
-                                           type="radio"
-                                           name="method"
-                                           id="read-to-me"
-                                           value="read-to-me"
-                                           data-gtm-action="Questionnaire Radio Button Clicked"
-                                           data-gtm-label="Select how you completed the questionnaire: I read the questions to someone else and recorded their answers"
-                                           data-gtm-category="Financial Well-Being Tool Interaction">
-                                    <label class="a-label" for="read-to-me">
-                                        {{ _('I read the questions to someone else and recorded their answers') }}
-                                    </label>
-                                </div>
-                            </li>
-                        </ul>
+                        <div class="o-scale_answer-prefix">{{ _('This statement applies to me') }}</div>
+                        <div class="o-scale_answer-options">
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_10-always"
+                                    name="question_10"
+                                    value="0"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="My finances control my life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_10-always">
+                                    {{ _('Always') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_10-often"
+                                    name="question_10"
+                                    value="1"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="My finances control my life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_10-often">
+                                    {{ _('Often') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_10-sometimes"
+                                    name="question_10"
+                                    value="2"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="My finances control my life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_10-sometimes">
+                                    {{ _('Sometimes') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_10-rarely"
+                                    name="question_10"
+                                    value="3"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="My finances control my life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_10-rarely">
+                                    {{ _('Rarely') }}
+                                </label>
+                            </div>
+                            <div class="m-form-field m-form-field__radio">
+                                <input class="a-radio"
+                                    type="radio"
+                                    id="question_10-never"
+                                    name="question_10"
+                                    value="4"
+                                    data-gtm-action="Questionnaire Radio Button Clicked"
+                                    data-gtm-label="My finances control my life"
+                                    data-gtm-category="Financial Well-Being Tool Interaction">
+                                <label class="a-label" for="question_10-never">
+                                    {{ _('Never') }}
+                                </label>
+                            </div>
+                        </div>
                     </fieldset>
                 </div>
             </div>
-        </div>
+            <div class="block u-mb30">
+                <h2>{{ _('About you') }}</h2>
+                <div class="o-well">
+                    <div class="o-form_group">
+                        <fieldset class="o-form_fieldset" id="age">
+                            <h3 class="a-legend">
+                                {{ _('Select your age group. This changes the scoring calculation.') }}
+                            </h3>
+                            <ul class="m-list m-list__unstyled content-l">
+                                <li class="content-l_col content-l_col-1-2">
+                                    <div class="m-form-field m-form-field__radio m-form-field__lg-target">
+                                        <input class="a-radio"
+                                            type="radio"
+                                            name="age"
+                                            id="age-18-61"
+                                            value="18-61"
+                                            data-gtm-action="Questionnaire Radio Button Clicked"
+                                            data-gtm-label="Select your age group: 18-61"
+                                            data-gtm-category="Financial Well-Being Tool Interaction">
+                                        <label class="a-label" for="age-18-61">
+                                            18–61
+                                        </label>
+                                    </div>
+                                </li>
+                                <li class="content-l_col content-l_col-1-2">
+                                    <div class="m-form-field m-form-field__radio m-form-field__lg-target">
+                                        <input class="a-radio"
+                                            type="radio"
+                                            name="age"
+                                            id="age-62-plus"
+                                            value="62-plus"
+                                            data-gtm-action="Questionnaire Radio Button Clicked"
+                                            data-gtm-label="Select your age group: 62+"
+                                            data-gtm-category="Financial Well-Being Tool Interaction">
+                                        <label class="a-label" for="age-62-plus">
+                                            62+
+                                        </label>
+                                    </div>
+                                </li>
+                            </ul>
+                        </fieldset>
+                    </div>
+                    <div>
+                        <fieldset class="o-form_fieldset" id="method">
+                            <h3 class="a-legend">
+                                {{ _('Select how you completed the questionnaire. This changes the scoring calculation.') }}
+                            </h3>
+                            <ul class="m-list m-list__unstyled content-l">
+                                <li class="content-l_col content-l_col-1-2">
+                                    <div class="m-form-field m-form-field__radio m-form-field__lg-target">
+                                        <input class="a-radio"
+                                            type="radio"
+                                            name="method"
+                                            id="read-self"
+                                            value="read-self"
+                                            data-gtm-action="Questionnaire Radio Button Clicked"
+                                            data-gtm-label="Select how you completed the questionnaire: I read and answered the questions myself"
+                                            data-gtm-category="Financial Well-Being Tool Interaction"
+                                            checked>
+                                        <label class="a-label" for="read-self">
+                                            {{ _('I read and answered the questions myself') }}
+                                        </label>
+                                    </div>
+                                </li>
+                                <li class="content-l_col content-l_col-1-2">
+                                    <div class="m-form-field m-form-field__radio m-form-field__lg-target">
+                                        <input class="a-radio"
+                                            type="radio"
+                                            name="method"
+                                            id="read-to-me"
+                                            value="read-to-me"
+                                            data-gtm-action="Questionnaire Radio Button Clicked"
+                                            data-gtm-label="Select how you completed the questionnaire: I read the questions to someone else and recorded their answers"
+                                            data-gtm-category="Financial Well-Being Tool Interaction">
+                                        <label class="a-label" for="read-to-me">
+                                            {{ _('I read the questions to someone else and recorded their answers') }}
+                                        </label>
+                                    </div>
+                                </li>
+                            </ul>
+                        </fieldset>
+                    </div>
+                </div>
+            </div>
 
-        <div class="o-form_group">
-            <input class="submit-quiz a-btn"
-                   id="submit-quiz"
-                   type="submit"
-                   value="{{ _('Get my score') }}"
-                   title="Please answer all questions to get your score"
-                   data-gtm-action="Questionnaire Submitted"
-                   data-gtm-label="Get my score"
-                   data-gtm-category="Financial Well-Being Tool Interaction">
-        </div>
-    </form>
+            <div class="o-form_group">
+                <input class="submit-quiz a-btn"
+                    id="submit-quiz"
+                    type="submit"
+                    value="{{ _('Get my score') }}"
+                    title="Please answer all questions to get your score"
+                    data-gtm-action="Questionnaire Submitted"
+                    data-gtm-label="Get my score"
+                    data-gtm-category="Financial Well-Being Tool Interaction">
+            </div>
+        </form>
+    </div>
 {%- endblock %}
 
 {% block content_sidebar -%}

From 2f87e4765cc0f60153e5ce6254d044750ea3ccfb Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 18:13:47 -0400
Subject: [PATCH 4/7] no-js update

---
 .../unprocessed/apps/financial-well-being/css/no-js.less  | 8 ++------
 cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html    | 2 +-
 cfgov/wellbeing/jinja2/wellbeing/home.html                | 4 ++--
 3 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
index 299f0691394..3f0373d14e0 100644
--- a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
+++ b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
@@ -1,8 +1,4 @@
-.u-hide-if-js > * {
-  display: block;
-}
-
 /* Hide 'Financial Well Being' form when JavaScript is disabled. */
-.no-js-hide {
-  display: none;
+.no-js {
+  display: block !important;
 }
diff --git a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
index aa3f7517c9e..a2fb9667879 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
@@ -1,6 +1,6 @@
 <div class="m-notification
             m-notification__error
-            u-hide-if-js">
+            no-js">
     {{ svg_icon('error-round') }}
     <div class="m-notification_content">
         <div class="h4 m-notification_message">
diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 7e91eb177da..39578e52e40 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -59,9 +59,9 @@ <h1 class="m-hero_heading">{{ _('Find out your financial well-being') }}</h1>
 {%- endblock %}
 
 {% block content_main -%}
-{% include "_templates/no_js.html" %}
 
-    <div class="no-js-hide"
+    {% include "_templates/no_js.html" %}
+    <div class="u-hide-if-js">
 
         <p>
         {% if (current_language == 'en') %}

From 040fd2a06b0a30d971139940586402fca72b07d0 Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 18:25:26 -0400
Subject: [PATCH 5/7] backwards logic

---
 cfgov/unprocessed/apps/financial-well-being/css/main.less  | 2 --
 cfgov/unprocessed/apps/financial-well-being/css/no-js.less | 4 ----
 cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html     | 2 +-
 cfgov/wellbeing/jinja2/wellbeing/home.html                 | 2 +-
 4 files changed, 2 insertions(+), 8 deletions(-)
 delete mode 100644 cfgov/unprocessed/apps/financial-well-being/css/no-js.less

diff --git a/cfgov/unprocessed/apps/financial-well-being/css/main.less b/cfgov/unprocessed/apps/financial-well-being/css/main.less
index ef428391983..42724b06574 100644
--- a/cfgov/unprocessed/apps/financial-well-being/css/main.less
+++ b/cfgov/unprocessed/apps/financial-well-being/css/main.less
@@ -1,5 +1,3 @@
-@import (less) './no-js.less';
-
 .save-links {
   padding-bottom: 15px;
   border-bottom: 1px solid #b4b5b6;
diff --git a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less b/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
deleted file mode 100644
index 3f0373d14e0..00000000000
--- a/cfgov/unprocessed/apps/financial-well-being/css/no-js.less
+++ /dev/null
@@ -1,4 +0,0 @@
-/* Hide 'Financial Well Being' form when JavaScript is disabled. */
-.no-js {
-  display: block !important;
-}
diff --git a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
index a2fb9667879..aa3f7517c9e 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
@@ -1,6 +1,6 @@
 <div class="m-notification
             m-notification__error
-            no-js">
+            u-hide-if-js">
     {{ svg_icon('error-round') }}
     <div class="m-notification_content">
         <div class="h4 m-notification_message">
diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 39578e52e40..16bab109b9c 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -61,7 +61,7 @@ <h1 class="m-hero_heading">{{ _('Find out your financial well-being') }}</h1>
 {% block content_main -%}
 
     {% include "_templates/no_js.html" %}
-    <div class="u-hide-if-js">
+    <div class="u-js-only">
 
         <p>
         {% if (current_language == 'en') %}

From ec59ee935b13293a47f1dbaef4eae31a1d6baf0e Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 18:32:53 -0400
Subject: [PATCH 6/7] new line

---
 cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
index aa3f7517c9e..be762e608cd 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/_templates/no_js.html
@@ -8,4 +8,4 @@
             Please try a newer browser or confirm that JavaScript is enabled.
         </div>
      </div>
-</div>
\ No newline at end of file
+</div>

From 52315f1160abb1fa06dffcb99387ae1b7787b3ac Mon Sep 17 00:00:00 2001
From: Joshua Allen <130792942+BrewCityBoy@users.noreply.github.com>
Date: Tue, 8 Aug 2023 18:55:52 -0400
Subject: [PATCH 7/7] unneeded code

---
 cfgov/wellbeing/jinja2/wellbeing/home.html | 2 --
 1 file changed, 2 deletions(-)

diff --git a/cfgov/wellbeing/jinja2/wellbeing/home.html b/cfgov/wellbeing/jinja2/wellbeing/home.html
index 16bab109b9c..08fcad0a579 100644
--- a/cfgov/wellbeing/jinja2/wellbeing/home.html
+++ b/cfgov/wellbeing/jinja2/wellbeing/home.html
@@ -20,8 +20,6 @@
 
 {% block css -%}
     {{ super() }}
-    <link rel="stylesheet"
-          href="{{ static('apps/financial-well-being/css/main.css') }}">
     <style>
         .m-hero {
             background-color: #7eb7e8;