diff --git a/.github/workflows/rubyonrails.yml b/.github/workflows/rubyonrails.yml
index 67d8a841..244200ef 100644
--- a/.github/workflows/rubyonrails.yml
+++ b/.github/workflows/rubyonrails.yml
@@ -59,3 +59,22 @@ jobs:
 
       - name: Lint Ruby files
         run: bundle exec rubocop --parallel
+
+  brakeman:
+      runs-on: ubuntu-latest
+      steps:
+        - name: Checkout code
+          uses: actions/checkout@v3
+        - name: Install Ruby and gems
+          uses: ruby/setup-ruby@55283cc23133118229fd3f97f9336ee23a179fcf # v1.146.0
+          with:
+            bundler-cache: true
+        - name: Install dependencies
+          run: bundle install
+        - name: Run Brakeman
+          run: bundle exec brakeman -f sarif -o output.sarif.json
+          continue-on-error: true
+        - name: Upload SARIF
+          uses: github/codeql-action/upload-sarif@v2
+          with:
+            sarif_file: output.sarif.json
diff --git a/.slugignore b/.slugignore
index ef9d84b4..3ee05081 100644
--- a/.slugignore
+++ b/.slugignore
@@ -34,6 +34,9 @@ spec/**
 .gitignore
 .dockerignore
 
+# Ignore contributing files
+CONTRIBUTING.md
+
 # Ignore yml files generated by VCR.
 spec/fixtures/cassettes/ApplicantTrackingSystem/*.yml
 
diff --git a/Gemfile b/Gemfile
index d45eb469..21705ade 100644
--- a/Gemfile
+++ b/Gemfile
@@ -77,8 +77,9 @@ gem "ruby-openai"
 gem 'meta-tags'
 # gem 'sitemap_generator' # TODO: install this gem for sitemap generation
 
-# Email
-# gem 'sendgrid-ruby' # TODO: install this gem for sending emails
+# Email & CRM
+# gem 'hubspot-api-client'
+gem 'sendgrid-ruby'
 
 # Importing, Parsing & APIs
 gem 'csv' # can probably use ruby standard library
@@ -88,7 +89,7 @@ gem 'rails-html-sanitizer'
 gem "flipper-active_record", "~> 1.3"
 
 # Monitoring
-# gem 'newrelic_rpm' # TODO: install this gem for monitoring
+gem 'newrelic_rpm'
 
 # Analytics
 # gem 'analytics-ruby', '~> 2.4.0', :require => 'segment/analytics' # TODO: install this gem for analytics
@@ -103,8 +104,7 @@ gem "flipper-active_record", "~> 1.3"
 # gem 'sentry-raven' # TODO: install this gem for error tracking
 
 # Front-end
-gem 'will_paginate', '~> 4.0' # TODO: Update to kaminari now index page is fixed (better maintained / looks nicer)
-# gem 'kaminari'
+gem 'kaminari'
 gem "high_voltage", "~> 3.1"
 gem 'tinymce-rails' # TODO: now have trix and action text (check whether we need to replace)
 
@@ -124,6 +124,9 @@ group :development, :test do
   gem 'rubocop-rails'
   gem 'rubocop-rspec'
 
+  # Security
+  gem 'brakeman', require: false
+
   # Email
   # gem 'letter_opener' # TODO: install this gem for email testing
 end
@@ -135,9 +138,6 @@ group :development do
   gem "better_errors"
   gem "binding_of_caller"
 
-  # Security
-  # gem 'brakeman', require: false # TODO: install this gem for security checks
-
   # Performance
   # Add speed badges [https://github.com/MiniProfiler/rack-mini-profiler]
   # gem "rack-mini-profiler" # TODO: install this gem for performance monitoring
diff --git a/Gemfile.lock b/Gemfile.lock
index 6a1402a5..34644f68 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -1,35 +1,35 @@
 GEM
   remote: https://rubygems.org/
   specs:
-    actioncable (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actioncable (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       nio4r (~> 2.0)
       websocket-driver (>= 0.6.1)
       zeitwerk (~> 2.6)
-    actionmailbox (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      activejob (= 7.1.3.2)
-      activerecord (= 7.1.3.2)
-      activestorage (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actionmailbox (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      activejob (= 7.1.3.3)
+      activerecord (= 7.1.3.3)
+      activestorage (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       mail (>= 2.7.1)
       net-imap
       net-pop
       net-smtp
-    actionmailer (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      actionview (= 7.1.3.2)
-      activejob (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actionmailer (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      actionview (= 7.1.3.3)
+      activejob (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       mail (~> 2.5, >= 2.5.4)
       net-imap
       net-pop
       net-smtp
       rails-dom-testing (~> 2.2)
-    actionpack (7.1.3.2)
-      actionview (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actionpack (7.1.3.3)
+      actionview (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       nokogiri (>= 1.8.5)
       racc
       rack (>= 2.2.4)
@@ -37,15 +37,15 @@ GEM
       rack-test (>= 0.6.3)
       rails-dom-testing (~> 2.2)
       rails-html-sanitizer (~> 1.6)
-    actiontext (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      activerecord (= 7.1.3.2)
-      activestorage (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actiontext (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      activerecord (= 7.1.3.3)
+      activestorage (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       globalid (>= 0.6.0)
       nokogiri (>= 1.8.5)
-    actionview (7.1.3.2)
-      activesupport (= 7.1.3.2)
+    actionview (7.1.3.3)
+      activesupport (= 7.1.3.3)
       builder (~> 3.1)
       erubi (~> 1.11)
       rails-dom-testing (~> 2.2)
@@ -53,22 +53,22 @@ GEM
     active_link_to (1.0.5)
       actionpack
       addressable
-    activejob (7.1.3.2)
-      activesupport (= 7.1.3.2)
+    activejob (7.1.3.3)
+      activesupport (= 7.1.3.3)
       globalid (>= 0.3.6)
-    activemodel (7.1.3.2)
-      activesupport (= 7.1.3.2)
-    activerecord (7.1.3.2)
-      activemodel (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    activemodel (7.1.3.3)
+      activesupport (= 7.1.3.3)
+    activerecord (7.1.3.3)
+      activemodel (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       timeout (>= 0.4.0)
-    activestorage (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      activejob (= 7.1.3.2)
-      activerecord (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    activestorage (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      activejob (= 7.1.3.3)
+      activerecord (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       marcel (~> 1.0)
-    activesupport (7.1.3.2)
+    activesupport (7.1.3.3)
       base64
       bigdecimal
       concurrent-ruby (~> 1.0, >= 1.0.2)
@@ -83,7 +83,7 @@ GEM
     ast (2.4.2)
     autoprefixer-rails (10.4.16.0)
       execjs (~> 2)
-    avo (3.6.1)
+    avo (3.7.4)
       actionview (>= 6.1)
       active_link_to
       activerecord (>= 6.1)
@@ -105,15 +105,17 @@ GEM
       erubi (>= 1.0.0)
       rack (>= 0.9.0)
       rouge (>= 1.0.0)
-    bigdecimal (3.1.7)
+    bigdecimal (3.1.8)
     bindex (0.8.1)
     binding_of_caller (1.0.1)
       debug_inspector (>= 1.2.0)
     bootsnap (1.18.3)
       msgpack (~> 1.2)
-    bootstrap (5.3.2)
+    bootstrap (5.3.3)
       autoprefixer-rails (>= 9.1.0)
       popper_js (>= 2.11.8, < 3)
+    brakeman (6.1.2)
+      racc
     builder (3.2.4)
     bullet (7.1.6)
       activesupport (>= 3.0.0)
@@ -151,9 +153,9 @@ GEM
       warden (~> 1.2.3)
     diff-lcs (1.5.1)
     docile (1.4.0)
-    dotenv (3.1.0)
-    dotenv-rails (3.1.0)
-      dotenv (= 3.1.0)
+    dotenv (3.1.2)
+    dotenv-rails (3.1.2)
+      dotenv (= 3.1.2)
       railties (>= 6.1)
     drb (2.2.1)
     dry-initializer (3.1.1)
@@ -185,10 +187,12 @@ GEM
       flipper (~> 1.3.0)
     font-awesome-sass (6.5.2)
       sassc (~> 2.0)
-    fugit (1.10.1)
-      et-orbi (~> 1, >= 1.2.7)
+    fugit (1.11.0)
+      et-orbi (~> 1, >= 1.2.11)
       raabro (~> 1.4)
-    geocoder (1.8.2)
+    geocoder (1.8.3)
+      base64 (>= 0.1.0)
+      csv (>= 3.0.0)
     globalid (1.2.1)
       activesupport (>= 6.1)
     hashdiff (1.1.0)
@@ -197,10 +201,11 @@ GEM
       actionpack
       nokogiri
       rubyzip (>= 1.0)
-    httparty (0.21.0)
+    httparty (0.22.0)
+      csv
       mini_mime (>= 1.0.0)
       multi_xml (>= 0.5.2)
-    i18n (1.14.4)
+    i18n (1.14.5)
       concurrent-ruby (~> 1.0)
     importmap-rails (2.0.1)
       actionpack (>= 6.0.0)
@@ -210,10 +215,22 @@ GEM
       activesupport (>= 3.0)
       nokogiri (>= 1.6)
     io-console (0.7.2)
-    irb (1.12.0)
-      rdoc
+    irb (1.13.1)
+      rdoc (>= 4.0.0)
       reline (>= 0.4.2)
     json (2.7.2)
+    kaminari (1.2.2)
+      activesupport (>= 4.1.0)
+      kaminari-actionview (= 1.2.2)
+      kaminari-activerecord (= 1.2.2)
+      kaminari-core (= 1.2.2)
+    kaminari-actionview (1.2.2)
+      actionview
+      kaminari-core (= 1.2.2)
+    kaminari-activerecord (1.2.2)
+      activerecord
+      kaminari-core (= 1.2.2)
+    kaminari-core (1.2.2)
     language_server-protocol (3.17.0.3)
     loofah (2.22.0)
       crass (~> 1.0.2)
@@ -230,14 +247,15 @@ GEM
     method_source (1.1.0)
     mime-types (1.25.1)
     mini_mime (1.1.5)
-    minitest (5.22.3)
+    minitest (5.23.0)
     msgpack (1.7.2)
-    multi_xml (0.6.0)
-    multipart-post (2.4.0)
+    multi_xml (0.7.1)
+      bigdecimal (~> 3.1)
+    multipart-post (2.4.1)
     mutex_m (0.2.0)
     net-http (0.4.1)
       uri
-    net-imap (0.4.10)
+    net-imap (0.4.11)
       date
       net-protocol
     net-pop (0.1.2)
@@ -246,7 +264,8 @@ GEM
       timeout
     net-smtp (0.5.0)
       net-protocol
-    nio4r (2.7.1)
+    newrelic_rpm (9.9.0)
+    nio4r (2.7.3)
     nokogiri (1.16.5-aarch64-linux)
       racc (~> 1.4)
     nokogiri (1.16.5-arm-linux)
@@ -260,9 +279,9 @@ GEM
     nokogiri (1.16.5-x86_64-linux)
       racc (~> 1.4)
     orm_adapter (0.5.0)
-    pagy (8.2.0)
+    pagy (8.4.0)
     parallel (1.24.0)
-    parser (3.3.0.5)
+    parser (3.3.1.0)
       ast (~> 2.4.1)
       racc
     pg (1.5.6)
@@ -285,20 +304,20 @@ GEM
     rackup (1.0.0)
       rack (< 3)
       webrick
-    rails (7.1.3.2)
-      actioncable (= 7.1.3.2)
-      actionmailbox (= 7.1.3.2)
-      actionmailer (= 7.1.3.2)
-      actionpack (= 7.1.3.2)
-      actiontext (= 7.1.3.2)
-      actionview (= 7.1.3.2)
-      activejob (= 7.1.3.2)
-      activemodel (= 7.1.3.2)
-      activerecord (= 7.1.3.2)
-      activestorage (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    rails (7.1.3.3)
+      actioncable (= 7.1.3.3)
+      actionmailbox (= 7.1.3.3)
+      actionmailer (= 7.1.3.3)
+      actionpack (= 7.1.3.3)
+      actiontext (= 7.1.3.3)
+      actionview (= 7.1.3.3)
+      activejob (= 7.1.3.3)
+      activemodel (= 7.1.3.3)
+      activerecord (= 7.1.3.3)
+      activestorage (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       bundler (>= 1.15.0)
-      railties (= 7.1.3.2)
+      railties (= 7.1.3.3)
     rails-dom-testing (2.2.0)
       activesupport (>= 5.0.0)
       minitest
@@ -306,9 +325,9 @@ GEM
     rails-html-sanitizer (1.6.0)
       loofah (~> 2.21)
       nokogiri (~> 1.14)
-    railties (7.1.3.2)
-      actionpack (= 7.1.3.2)
-      activesupport (= 7.1.3.2)
+    railties (7.1.3.3)
+      actionpack (= 7.1.3.3)
+      activesupport (= 7.1.3.3)
       irb
       rackup (>= 1.0.0)
       rake (>= 12.2)
@@ -319,8 +338,8 @@ GEM
     rdoc (6.6.3.1)
       psych (>= 4.0.0)
     redis (4.8.1)
-    regexp_parser (2.9.0)
-    reline (0.5.2)
+    regexp_parser (2.9.2)
+    reline (0.5.7)
       io-console (~> 0.5)
     responders (3.1.1)
       actionpack (>= 5.2)
@@ -333,7 +352,7 @@ GEM
     rspec-expectations (3.13.0)
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.13.0)
-    rspec-mocks (3.13.0)
+    rspec-mocks (3.13.1)
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.13.0)
     rspec-rails (6.1.2)
@@ -345,7 +364,7 @@ GEM
       rspec-mocks (~> 3.13)
       rspec-support (~> 3.13)
     rspec-support (3.13.1)
-    rubocop (1.63.2)
+    rubocop (1.63.5)
       json (~> 2.3)
       language_server-protocol (>= 3.17.0)
       parallel (~> 1.10)
@@ -356,8 +375,8 @@ GEM
       rubocop-ast (>= 1.31.1, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 3.0)
-    rubocop-ast (1.31.2)
-      parser (>= 3.3.0.4)
+    rubocop-ast (1.31.3)
+      parser (>= 3.3.1.0)
     rubocop-capybara (2.20.0)
       rubocop (~> 1.41)
     rubocop-factory_bot (2.25.1)
@@ -365,23 +384,24 @@ GEM
     rubocop-performance (1.21.0)
       rubocop (>= 1.48.1, < 2.0)
       rubocop-ast (>= 1.31.1, < 2.0)
-    rubocop-rails (2.24.1)
+    rubocop-rails (2.25.0)
       activesupport (>= 4.2.0)
       rack (>= 1.1)
       rubocop (>= 1.33.0, < 2.0)
       rubocop-ast (>= 1.31.1, < 2.0)
-    rubocop-rspec (2.29.1)
+    rubocop-rspec (2.29.2)
       rubocop (~> 1.40)
       rubocop-capybara (~> 2.17)
       rubocop-factory_bot (~> 2.22)
       rubocop-rspec_rails (~> 2.28)
     rubocop-rspec_rails (2.28.3)
       rubocop (~> 1.40)
-    ruby-openai (6.5.0)
+    ruby-openai (7.0.1)
       event_stream_parser (>= 0.3.0, < 2.0.0)
       faraday (>= 1)
       faraday-multipart (>= 1)
     ruby-progressbar (1.13.0)
+    ruby_http_client (3.5.5)
     rubyzip (2.3.2)
     rufus-scheduler (3.9.1)
       fugit (~> 1.1, >= 1.1.6)
@@ -398,6 +418,8 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
+    sendgrid-ruby (6.7.0)
+      ruby_http_client (~> 3.4)
     shoulda-matchers (6.1.0)
       activesupport (>= 5.2.0)
     sidekiq (6.5.12)
@@ -427,7 +449,7 @@ GEM
     thor (1.3.1)
     tilt (2.3.0)
     timeout (0.4.1)
-    tinymce-rails (7.0.1)
+    tinymce-rails (7.1.0)
       railties (>= 3.1.1)
     turbo-rails (2.0.5)
       actionpack (>= 6.0.0)
@@ -441,7 +463,7 @@ GEM
     uniform_notifier (1.16.0)
     uri (0.13.0)
     vcr (6.2.0)
-    view_component (3.12.0)
+    view_component (3.12.1)
       activesupport (>= 5.2.0, < 8.0)
       concurrent-ruby (~> 1.0)
       method_source (~> 1.0)
@@ -464,12 +486,11 @@ GEM
     websocket-driver (0.7.6)
       websocket-extensions (>= 0.1.0)
     websocket-extensions (0.1.5)
-    will_paginate (4.0.0)
     xpath (3.2.0)
       nokogiri (~> 1.8)
     yomu (0.1.10)
       mime-types (~> 1.23)
-    zeitwerk (2.6.13)
+    zeitwerk (2.6.14)
 
 PLATFORMS
   aarch64-linux
@@ -486,6 +507,7 @@ DEPENDENCIES
   binding_of_caller
   bootsnap
   bootstrap
+  brakeman
   bullet
   capybara
   cloudinary
@@ -503,7 +525,9 @@ DEPENDENCIES
   htmltoword
   importmap-rails
   json (~> 2.6, >= 2.6.3)
+  kaminari
   meta-tags
+  newrelic_rpm
   nokogiri
   pg (~> 1.1)
   pg_search
@@ -518,6 +542,7 @@ DEPENDENCIES
   ruby-openai
   sassc-rails
   selenium-webdriver (~> 4.18.1)
+  sendgrid-ruby
   shoulda-matchers (= 6.1.0)
   sidekiq (~> 6.5.5)
   sidekiq-failures (~> 1.0)
@@ -532,7 +557,6 @@ DEPENDENCIES
   watir
   web-console
   webmock
-  will_paginate (~> 4.0)
   yomu
 
 RUBY VERSION
diff --git a/app/assets/stylesheets/components/_button.scss b/app/assets/stylesheets/components/_button.scss
index 020b7173..7f1cb81e 100644
--- a/app/assets/stylesheets/components/_button.scss
+++ b/app/assets/stylesheets/components/_button.scss
@@ -19,23 +19,6 @@
   text-decoration: none;
 }
 
-#search-button {
-  background-color: $main-color;
-  color: white;
-  // font-weight: 500;
-  text-decoration: none;
-  border: none;
-  border-radius: 8px;
-  padding: 10px 20px;
-  // margin-right: 6px;
-  margin-left: 6px;
-}
-
-#search-button:hover {
-  opacity: 85%;
-  color: white;
-}
-
 .btn-add-info, #btn-add-job {
   background-color: $main-color;
   opacity: 0.7;
diff --git a/app/assets/stylesheets/components/_footer.scss b/app/assets/stylesheets/components/_footer.scss
index 691fb117..0345a0ee 100644
--- a/app/assets/stylesheets/components/_footer.scss
+++ b/app/assets/stylesheets/components/_footer.scss
@@ -9,49 +9,8 @@
 }
 
 .footer {
-  background: #F4F4F4;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  height: 160px;
-  padding: 0px 50px;
-  color: rgba(0,0,0,0.3);
-  flex-shrink: 0;
+  border-top: 1px solid rgba(0,0,0,0.1);
+  height: 20vh;
   width: 100%;
-  margin-top: 24px;
-}
-
-.footer-links {
-  display: flex;
-  align-items: center;
+  color: rgba(0, 0, 0, 0.5);
 }
-
-.footer-links a {
-  color: black;
-  opacity: 0.3;
-  text-decoration: none;
-  font-size: 24px;
-  padding: 0px 10px;
-}
-
-.footer-links a:hover {
-  opacity: 1;
-}
-
-.footer .fa-heart {
-  color: #D23333;
-}
-
-.page-links a {
-  color: black;
-  opacity: 0.3;
-  text-decoration: none;
-  font-size: 16px;
-  padding: 0px 10px;
-}
-
-// .footer-copyright {
-//   display: flex;
-//   justify-content: right;
-//   align-items: right;
-// }
diff --git a/app/assets/stylesheets/components/_search_bar.scss b/app/assets/stylesheets/components/_search_bar.scss
index 74dc894f..f5b757f3 100644
--- a/app/assets/stylesheets/components/_search_bar.scss
+++ b/app/assets/stylesheets/components/_search_bar.scss
@@ -9,7 +9,8 @@
 
 #search-jobs {
   width: 600px;
-  border-radius: 10px;
+  border-top-left-radius: 10px;
+  border-bottom-left-radius: 10px;
 }
 
 .clear-search-icon {
@@ -19,7 +20,17 @@
   top: 10px;
 }
 
-.sticky-top {
-  top: 0;
-  z-index: 1020; /* High enough to stay above other content */
+#search-button {
+  border-top-right-radius: 10px;
+  border-bottom-right-radius: 10px;
+  background-color: $main-color;
+  color: white;
+  text-decoration: none;
+  border: none;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+#search-button:hover {
+  opacity: 85%;
+  color: white;
 }
diff --git a/app/assets/stylesheets/components/_utility_classes.scss b/app/assets/stylesheets/components/_utility_classes.scss
index fc003879..9a1258dc 100644
--- a/app/assets/stylesheets/components/_utility_classes.scss
+++ b/app/assets/stylesheets/components/_utility_classes.scss
@@ -17,3 +17,11 @@
 .small-text {
   font-size: 0.8rem;
 }
+
+.bg-main {
+  background-color: $main-color;
+}
+
+.tc-main {
+  color: $main-color;
+}
diff --git a/app/assets/stylesheets/pages/_about.scss b/app/assets/stylesheets/pages/_about.scss
index 35c8588c..e69de29b 100644
--- a/app/assets/stylesheets/pages/_about.scss
+++ b/app/assets/stylesheets/pages/_about.scss
@@ -1,134 +0,0 @@
-#about-page {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  margin-top: 24px;
-  color: $main-color;
-  text-align: center;
-  width: 100%;
-
-  h1 {
-    font-weight: bold;
-    margin: 16px 0;
-
-  }
-
-  h3 {
-    font-weight: normal;
-    margin: 16px 0;
-    width: 60%;
-    font-size: 1.4rem;
-  }
-
-  #about-text-logo {
-    width: 15%;
-    margin-bottom: 16px;
-  }
-
-  #about-logo {
-    width: 10%;
-  }
-
-  .about-team-row {
-    display: flex;
-    align-items: flex-start;
-    justify-content: space-around;
-    width: 60%;
-  }
-
-  .about-team-card {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
-    width: 25%;
-
-      h3 {
-        width: 100%;
-      }
-
-      #charlie-avatar, #ilya-avatar, #dan-avatar, #alejandro-avatar, #chris-avatar, #jamie-avatar {
-        height: 200px;
-        width: 200px;
-        background-size: cover;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: 50%;
-
-        &:hover {
-          .team-icons {
-            display: flex;
-            width: 60%;
-            justify-content: space-around;
-            align-items: center;
-            filter: brightness(1) !important;
-          }
-        }
-      }
-
-      #charlie-avatar {
-        background-image: image-url("team/charlie_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/charlie_avatar.png");
-        }
-      }
-
-      #ilya-avatar {
-        background-image: image-url("team/ilya_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/ilya_avatar.png");
-        }
-      }
-
-      #dan-avatar {
-        background-image: image-url("team/dan_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/dan_avatar.png");
-        }
-      }
-
-      #alejandro-avatar {
-        background-image: image-url("team/alejandro_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/alejandro_avatar.png");
-        }
-      }
-
-      #chris-avatar {
-        background-image: image-url("team/chris_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/chris_avatar.png");
-        }
-      }
-
-      #jamie-avatar {
-        background-image: image-url("team/jamie_avatar.png");
-
-        &:hover {
-          background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), image-url("team/jamie_avatar.png");
-        }
-      }
-
-      .team-icons {
-        display: none;
-
-        i {
-          color: white;
-          font-size: 2rem;
-
-          &:hover {
-            color: #ff9433;
-          }
-        }
-      }
-  }
-
-}
diff --git a/app/assets/stylesheets/pages/_apply.scss b/app/assets/stylesheets/pages/_apply.scss
index 560baca5..f6d46915 100644
--- a/app/assets/stylesheets/pages/_apply.scss
+++ b/app/assets/stylesheets/pages/_apply.scss
@@ -1,4 +1,10 @@
 // Application Summary
+
+.sticky-top {
+  top: 0;
+  z-index: 1020;
+}
+
 .company-apply-summary {
   width: 600px;
   border-radius: 8px;
diff --git a/app/assets/stylesheets/pages/_faqs.scss b/app/assets/stylesheets/pages/_faqs.scss
index faa2ca4f..7861a6aa 100644
--- a/app/assets/stylesheets/pages/_faqs.scss
+++ b/app/assets/stylesheets/pages/_faqs.scss
@@ -1,114 +1,70 @@
-.faq-section {
-  background: #fdfdfd;
-  min-height: 100vh;
-  padding: 10vh 0 0;
-}
-.faq-title h2 {
+/*===========================
+  about-06 css
+===========================*/
+.about-six {
+  padding-top: 90px;
+  padding-bottom: 120px;
   position: relative;
-  margin-bottom: 45px;
-  display: inline-block;
-  font-weight: 600;
-  line-height: 1;
 }
-.faq-title h2::before {
-  content: "";
-  position: absolute;
-  left: 50%;
-  width: 60px;
-  height: 2px;
-  background-color: #6007C6;
-  bottom: -25px;
-  margin-left: -30px;
+.about-six .faq-title .sub-title {
+  color: var(--primary);
+  text-transform: uppercase;
 }
-.faq-title p {
-  padding: 0 190px;
-  margin-bottom: 10px;
+.about-six .faq-title .title {
+  padding-top: 10px;
 }
-
-.faq {
-  background: #fdfdfd;
-  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06);
-  border-radius: 4px;
+.about-six .faq-accordion {
+  margin-top: 45px;
 }
-
-.faq .card {
-  border: none;
+.about-six .faq-accordion .accordion .card {
+  border: 0;
   background: none;
-  border-bottom: 1px dashed #CEE1F8;
 }
-
-.faq .card .card-header {
-  padding: 0px;
-  border: none;
+.about-six .faq-accordion .accordion .card .card-header {
+  padding: 0;
+  border: 0;
   background: none;
-  -webkit-transition: all 0.3s ease 0s;
-  -moz-transition: all 0.3s ease 0s;
-  -o-transition: all 0.3s ease 0s;
-  transition: all 0.3s ease 0s;
+  margin-top: 40px;
+}
+.about-six .faq-accordion .accordion .card .card-header a {
+  font-size: 18px;
+  font-weight: 500;
+  color: var(--black);
+  display: block;
+  position: relative;
+  padding-right: 20px;
 }
-
-.faq .card .card-header:hover {
-  background: rgba(136, 66, 216, 0.8);
-  padding-left: 10px;
+@media only screen and (min-width: 992px) and (max-width: 1199px) {
+  .about-six .faq-accordion .accordion .card .card-header a {
+    font-size: 16px;
+  }
 }
-.faq .card .card-header .faq-title {
-  width: 100%;
-  text-align: left;
-  padding: 0px;
-  padding-left: 30px;
-  padding-right: 30px;
-  font-weight: 400;
-  font-size: 15px;
-  letter-spacing: 1px;
-  color: #3B566E;
-  text-decoration: none !important;
-  -webkit-transition: all 0.3s ease 0s;
-  -moz-transition: all 0.3s ease 0s;
-  -o-transition: all 0.3s ease 0s;
-  transition: all 0.3s ease 0s;
-  cursor: pointer;
-  padding-top: 20px;
-  padding-bottom: 20px;
+@media (max-width: 767px) {
+  .about-six .faq-accordion .accordion .card .card-header a {
+    font-size: 16px;
+  }
 }
-
-.faq .card .card-header .faq-title .badge {
-  display: inline-block;
-  width: 20px;
-  height: 20px;
-  line-height: 14px;
-  float: left;
-  -webkit-border-radius: 100px;
-  -moz-border-radius: 100px;
-  border-radius: 100px;
-  text-align: center;
-  background: #FFEC00;
-  color: #fff;
-  font-size: 12px;
-  margin-right: 20px;
+.about-six .faq-accordion .accordion .card .card-header a::before {
+  content: "\eb30";
+  font-family: "LineIcons";
+  position: absolute;
+  top: 50%;
+  right: 0;
+  -webkit-transform: translateY(-50%);
+  -moz-transform: translateY(-50%);
+  -ms-transform: translateY(-50%);
+  -o-transform: translateY(-50%);
+  transform: translateY(-50%);
 }
-
-.faq .card .card-body {
-  padding: 30px;
-  padding-left: 35px;
-  padding-bottom: 16px;
-  font-weight: 400;
-  font-size: 16px;
-  color: #6F8BA4;
-  line-height: 28px;
-  letter-spacing: 1px;
-  border-top: 1px solid #F3F8FF;
+.about-six .faq-accordion .accordion .card .card-header .collapsed::before {
+  content: "\eb5c";
 }
-
-.faq .card .card-body p {
-  margin-bottom: 14px;
+.about-six .faq-accordion .accordion .card .card-body {
+  padding: 20px 20px 0;
 }
-
-@media (max-width: 991px) {
-  .faq {
-    margin-bottom: 30px;
-  }
-  .faq .card .card-header .faq-title {
-    line-height: 26px;
-    margin-top: 10px;
-  }
+.about-six .faq-image {
+  margin-top: 50px;
+}
+.about-six .faq-image img {
+  width: 100%;
 }
diff --git a/app/assets/stylesheets/pages/_jobs_index.scss b/app/assets/stylesheets/pages/_jobs_index.scss
index 6034e769..937a214c 100644
--- a/app/assets/stylesheets/pages/_jobs_index.scss
+++ b/app/assets/stylesheets/pages/_jobs_index.scss
@@ -1,6 +1,9 @@
 .category-select {
   border-top: 1px solid #e3e6f0;
-  padding: 16px 8px;
+  padding-top: 8px;
+  padding-bottom: 16px;
+  padding-left: 4px;
+  padding-right: 4px;
 }
 
 .category-label {
@@ -34,3 +37,9 @@
   padding-right: 6px;
   margin-right: 12px;
 }
+
+.pagination {
+  span {
+    margin: 0 4px;
+  }
+}
diff --git a/app/controllers/emails_controller.rb b/app/controllers/emails_controller.rb
new file mode 100644
index 00000000..1b44120c
--- /dev/null
+++ b/app/controllers/emails_controller.rb
@@ -0,0 +1,19 @@
+class EmailsController < ApplicationController
+  def create
+    email = params[:email]
+
+    # TODO: Integrate Hubspot via OAuth - at the moment we're using Sendgrid and this doesn't work
+    # hubspot_service = Email::Hubspot.new
+    sendgrid_service = Email::Sendgrid.new
+
+    # hubspot_response = hubspot_service.add_contact(email)
+    sendgrid_response = sendgrid_service.add_contact(email)
+
+    if sendgrid_response.status_code.to_i == 202
+      sendgrid_service.send_confirmation_email(email)
+      redirect_to root_path, notice: 'Subscription successful. Please check your email for confirmation.'
+    else
+      redirect_to root_path, alert: 'Subscription failed. Please try again later.'
+    end
+  end
+end
diff --git a/app/controllers/jobs_controller.rb b/app/controllers/jobs_controller.rb
index 6d3d1ad1..f18e8704 100644
--- a/app/controllers/jobs_controller.rb
+++ b/app/controllers/jobs_controller.rb
@@ -7,7 +7,7 @@ class JobsController < ApplicationController
   before_action :job_show_page_status, only: [:show]
 
   def index
-    @jobs = jobs_and_associated_tables.filter_and_sort(params).paginate(page: params[:page], per_page: 20)
+    @jobs = jobs_and_associated_tables.filter_and_sort(params).order(sort_order(params[:sort])).page(params[:page]).per(20)
     @resources = CategorySidebar.build_with(params)
 
     @saved_jobs = SavedJob.all
@@ -29,6 +29,25 @@ def add_job
 
   private
 
+  def sort_order(sort_param)
+    case sort_param
+    when 'title'
+      'jobs.title ASC'
+    when 'title_desc'
+      'jobs.title DESC'
+    when 'company'
+      'companies.name ASC'
+    when 'company_desc'
+      'companies.name DESC'
+    when 'created_at'
+      'jobs.created_at DESC'
+    when 'created_at_asc'
+      'jobs.created_at ASC'
+    else # rubocop:disable Lint/DuplicateBranch
+      'jobs.created_at DESC'
+    end
+  end
+
   def job_show_page_status
     redirect_to jobs_path, notice: 'Job show page coming soon!' unless Flipper.enabled?(:job_show_page)
   end
diff --git a/app/controllers/pages_controller.rb b/app/controllers/pages_controller.rb
index 25e98787..a64d5da2 100644
--- a/app/controllers/pages_controller.rb
+++ b/app/controllers/pages_controller.rb
@@ -1,10 +1,10 @@
 class PagesController < ApplicationController
-  skip_before_action :authenticate_user!, only: %i[home test faqs how_it_works about jobs landing privacy ts_and_cs]
+  skip_before_action :authenticate_user!, only: %i[home faqs how_it_works about landing privacy ts_and_cs]
 
   def home
   end
 
-  def test
+  def about
   end
 
   def faqs
@@ -13,21 +13,12 @@ def faqs
   def how_it_works
   end
 
-  def jobs
-  end
-
-  def temp
-  end
-
   def climate
   end
 
   def landing
   end
 
-  def about
-  end
-
   def privacy
   end
 
diff --git a/app/javascript/controllers/select_by_job_type_controller.js b/app/javascript/controllers/select_by_job_type_controller.js
index 39e3db2b..5302ebc3 100644
--- a/app/javascript/controllers/select_by_job_type_controller.js
+++ b/app/javascript/controllers/select_by_job_type_controller.js
@@ -5,6 +5,7 @@ export default class extends Controller {
   static targets = [ 'jobRow', 'search', 'cheddar', 'posted', 'role', 'company', 'location', 'seniority', 'employment' ]
 
   connect() {
+    this.searchTarget.addEventListener('input', this.checkEmptySearch.bind(this));
   }
 
   combinedSearch(event) {
@@ -41,6 +42,12 @@ export default class extends Controller {
     window.location.href = `/jobs${filterQueryString}`;
   }
 
+  checkEmptySearch() {
+    if (this.searchTarget.value.trim() === '') {
+      window.location.href = `/jobs`;
+    }
+  }
+
   buildQueryString(searchTerms) {
     const queryStringParams = []
 
diff --git a/app/mailers/user_mailer.rb b/app/mailers/user_mailer.rb
new file mode 100644
index 00000000..74ecdb37
--- /dev/null
+++ b/app/mailers/user_mailer.rb
@@ -0,0 +1,8 @@
+class UserMailer < ApplicationMailer
+  default from: 'charlie@cheddar.jobs'
+
+  def confirmation_email(email)
+    @email = email
+    mail(to: @email, subject: 'Subscription Confirmation')
+  end
+end
diff --git a/app/models/job.rb b/app/models/job.rb
index e89d20b9..eace028f 100644
--- a/app/models/job.rb
+++ b/app/models/job.rb
@@ -55,15 +55,6 @@ def application_criteria
     read_attribute(:application_criteria).with_indifferent_access
   end
 
-  # def update_application_criteria
-  #   if posting_url.include?('greenhouse')
-  #     extra_fields = GetFormFieldsJob.perform_later(posting_url)
-  #     # p extra_fields
-  #   else
-  #     p "No additional fields to add"
-  #   end
-  # end
-
   CONVERT_TO_DAYS = {
     'today' => 0,
     '3-days' => 3,
diff --git a/app/services/category_sidebar.rb b/app/services/category_sidebar.rb
index 67c02b48..59f9f7c3 100644
--- a/app/services/category_sidebar.rb
+++ b/app/services/category_sidebar.rb
@@ -73,9 +73,7 @@ class CategorySidebar
   def self.build_with(params)
     @params = params
     @jobs = Job.includes(:roles, :locations).select("jobs.id, jobs.date_posted, jobs.seniority, jobs.remote, jobs.employment_type")
-    Rails.cache.fetch("category_sidebar #{@params.except(:page, :controller, :action)}", expires_in: 2.hours, race_condition_ttl: 10.seconds) do
-      fetch_sidebar_data
-    end
+    fetch_sidebar_data
   end
 
   private
diff --git a/app/services/email/hubspot.rb b/app/services/email/hubspot.rb
new file mode 100644
index 00000000..4df4f336
--- /dev/null
+++ b/app/services/email/hubspot.rb
@@ -0,0 +1,28 @@
+module Email
+  class Hubspot # rubocop:disable Lint/EmptyClass
+    # require 'hubspot-api-client'
+
+    # def initialize
+    #   @client = Hubspot::Client.new(access_token: ENV.fetch('HUBSPOT_API_KEY'))
+    # end
+
+    # def add_contact(email)
+    #   contact_properties = {
+    #     properties: {
+    #       email:
+    #     }
+    #   }
+
+    #   begin
+    #     response = @client.crm.contacts.basic_api.create(contact_properties)
+    #     p "HubSpot contact created: #{response.to_json}"
+    #     Rails.logger.info("HubSpot contact created: #{response.to_json}")
+    #     true
+    #   rescue Hubspot::ApiError => e
+    #     p "Error creating HubSpot contact: #{e.response_body}"
+    #     Rails.logger.error("Error creating HubSpot contact: #{e.response_body}")
+    #     false
+    #   end
+    # end
+  end
+end
diff --git a/app/services/email/sendgrid.rb b/app/services/email/sendgrid.rb
new file mode 100644
index 00000000..5973f069
--- /dev/null
+++ b/app/services/email/sendgrid.rb
@@ -0,0 +1,45 @@
+module Email
+  class Sendgrid
+    require 'sendgrid-ruby'
+    include SendGrid
+
+    def initialize
+      @sg = SendGrid::API.new(api_key: ENV.fetch('SENDGRID_API_KEY'))
+    end
+
+    def add_contact(email)
+      data = {
+        contacts: [
+          {
+            email:
+          }
+        ]
+      }
+
+      response = @sg.client.marketing.contacts.put(request_body: data.to_json)
+      log_response(response)
+      response
+    end
+
+    def send_confirmation_email(email)
+      from = SendGrid::Email.new(email: 'charlie@cheddar.jobs')
+      to = SendGrid::Email.new(email:)
+      subject = 'Cheddar sign up confirmation'
+      content = SendGrid::Content.new(type: 'text/plain', value: 'Thank you for subscribing!')
+
+      mail = SendGrid::Mail.new(from, subject, to, content)
+
+      response = @sg.client.mail._('send').post(request_body: mail.to_json)
+      log_response(response)
+      response
+    end
+
+    private
+
+    def log_response(response)
+      puts response.status_code
+      puts response.body
+      puts response.headers
+    end
+  end
+end
diff --git a/app/views/job_applications/new.html.erb b/app/views/job_applications/new.html.erb
index ee1817b4..67bc2c56 100644
--- a/app/views/job_applications/new.html.erb
+++ b/app/views/job_applications/new.html.erb
@@ -1,5 +1,6 @@
 <%= provide(:title, 'New job applications') %>
 
+<script type="text/javascript" src="/assets/tinymce.js"></script>
 <script>
   const applicationCarouselElement = document.querySelector('#applicationCarousel')
 
diff --git a/app/views/jobs/_add_job_to_basket.html.erb b/app/views/jobs/_add_job_to_basket.html.erb
new file mode 100644
index 00000000..4ac2b1ee
--- /dev/null
+++ b/app/views/jobs/_add_job_to_basket.html.erb
@@ -0,0 +1,23 @@
+<div class="d-flex align-items-center justify-content-center me-3">
+  <% if user_signed_in? %>
+    <% if @saved_job_ids.include?(job.id) %>
+      <%= link_to saved_job_path(job.saved_job_ids), data: {turbo_method: :delete} do %>
+        <i class="fa-solid fa-bookmark pe-2"></i>
+      <% end %>
+    <% else %>
+      <%= link_to job_saved_jobs_path(job), data: {turbo_method: :post} do %>
+        <i class="fa-regular fa-bookmark pe-2"></i>
+      <% end %>
+    <% end %>
+    <% include_checkboxes ||= false %>
+    <% if include_checkboxes %>
+      <div class="ms-3">
+        <%= check_box_tag "job_ids[]", job.id, onclick: "document.getElementById('apply_button').disabled = false" %>
+      </div>
+    <% end %>
+  <% end %>
+
+  <%= link_to job.posting_url, target: "_blank" do %>
+    <i class="fa-solid fa-arrow-up-right-from-square"></i>
+  <% end %>
+</div>
diff --git a/app/views/jobs/_basic_info.html.erb b/app/views/jobs/_basic_info.html.erb
new file mode 100644
index 00000000..264e8161
--- /dev/null
+++ b/app/views/jobs/_basic_info.html.erb
@@ -0,0 +1,13 @@
+<div class="basic-info d-flex flex-column align-items-end justify-space-between text-sm">
+  <div class="salaryBudget"><%= job.salary.present? ? job.salary : "<br>".html_safe %></div>
+  <div class="my-1"><%= job.employment_type %> •
+    <% if job.remote %>
+      <%= "Remote"%>
+    <% elsif job.hybrid %>
+      <%= "Hybrid" %>
+    <% else %>
+      <%= "In-office" %>
+    <% end %>
+  </div>
+  <div><%= job.date_posted.strftime("%d/%m") %> <span class="meter"><hr class="line-horizontal"><div class="triangle-inverted-blue" style="left:<%= (job.deadline.nil? || job.deadline < Date.today) ? 50 : (Date.today - job.date_posted).to_i.fdiv((job.deadline - job.date_posted).to_i) * 100 %>%;"></div></span> <%= (job.deadline.nil? || job.deadline < Date.today) ? "Rolling" : job.deadline.strftime("%d/%m") %></div>
+</div>
diff --git a/app/views/jobs/_category_sidebar.html.erb b/app/views/jobs/_category_sidebar.html.erb
index 0794c6e1..69907be9 100644
--- a/app/views/jobs/_category_sidebar.html.erb
+++ b/app/views/jobs/_category_sidebar.html.erb
@@ -1,24 +1,26 @@
-<div class="col-sm-3" data-job-index-toggle-target="leftSection">
+<div data-job-index-toggle-target="leftSection">
 
-  <div class = "d-flex">
-    <p class="pb-0"><%= @jobs.count %> jobs • <%= link_to 'Clear filters', jobs_path %></p>
-  </div>
+  <div class="row">
+    <div class = "col-11 d-flex justify-content-between align-items-center mb-1">
+      <p class="py-2 mb-0"><%= @jobs.count %> jobs • <%= link_to 'Clear filters', jobs_path %></p>
+      <%= render 'sort_by' %>
+    </div>
 
-  <% if Flipper.enabled?(:apply_with_cheddar) %>
-    <div class="row">
-      <div class="col-10">
+    <% if Flipper.enabled?(:apply_with_cheddar) %>
+      <div class="col-11">
         <div class="category-select">
           <div class="form-check form-switch"><input type="checkbox" class="form-check-input" role="switch" id="cheddar-jobs-switch" data-action="change->select-by-job-type#combinedSearch" data-select-by-job-type-target="cheddar"><label class="form-check-label" for="cheddar-jobs-switch">Only show Cheddar jobs</label></div>
         </div>
       </div>
-    </div>
-  <% end %>
+    <% end %>
 
-  <% section_titles = ['Job Posted', 'Seniority', 'Location', 'Job Roles', 'Employment Type'] %>
-  <% icons = ["fa-solid fa-calendar-days", "fa-solid fa-stairs", "fa-solid fa-earth-americas", "fa-solid fa-person-chalkboard", "fa-solid fa-id-card"] %>
-
-  <% @resources.each_with_index do |(resource, data), index| %>
-    <%= render partial: 'category_sidebar_section', locals: {title: section_titles[index], resource: resource, resources: data, icon: icons[index]} %>
-  <% end %>
+    <% section_titles = ['Job Posted', 'Seniority', 'Location', 'Job Roles', 'Employment Type'] %>
+    <% icons = ["fa-solid fa-calendar-days", "fa-solid fa-stairs", "fa-solid fa-earth-americas", "fa-solid fa-person-chalkboard", "fa-solid fa-id-card"] %>
 
+    <div class="d-flex flex-wrap d-lg-block">
+      <% @resources.each_with_index do |(resource, data), index| %>
+        <%= render partial: 'category_sidebar_section', locals: {title: section_titles[index], resource: resource, resources: data, icon: icons[index]} %>
+      <% end %>
+    </div>
+  </div>
 </div>
diff --git a/app/views/jobs/_category_sidebar_section.html.erb b/app/views/jobs/_category_sidebar_section.html.erb
index cd5eaf4e..1924570b 100644
--- a/app/views/jobs/_category_sidebar_section.html.erb
+++ b/app/views/jobs/_category_sidebar_section.html.erb
@@ -1,20 +1,17 @@
-<turbo-frame id="category-select-frame-<%= resource %>">
-  <div class="row">
-    <div class="col-10">
-      <ul class="category-select">
-        <h5 class="mt-3 mb-3 category-label"><i class="<%= icon %>"></i> <%= title || resource.titleize %></h5>
-        <div>
-          <% resources.each do |type, resource_name, resource_id, count, checked| %>
-            <div class="category-select-item d-flex flex-row justify-content-between">
-              <label for="<%= resource_name %>" class="category-select-item-label d-flex align-items-center">
-                <input class="category-select-item-<%= type %>" type="<%= type %>" name="<%= type == 'radio' ? resource : resource_name %>" id="<%= resource_id %>" <%= "checked " if checked %> data-action="change->select-by-job-type#combinedSearch" data-select-by-job-type-target="<%= resource.split('-').map.with_index { |word, index| index > 0 ? word.capitalize : word }.join('') %>">
-                <%= resource_name.titleize %>
-              </label>
-              <div class="ms-2 text-sm"><%= count %></div>
-            </div>
-          <% end %>
+<div class="col-11 d-none d-lg-block">
+  <%# TODO: Tidy and refactor - can be improved %>
+  <ul class="category-select mb-0">
+    <h5 class="mt-3 mb-3 category-label"><i class="<%= icon %>"></i> <%= title || resource.titleize %></h5>
+    <div>
+      <% resources.each do |type, resource_name, resource_id, count, checked| %>
+        <div class="category-select-item d-flex flex-row justify-content-between">
+          <label for="<%= resource_name %>" class="category-select-item-label d-flex align-items-center">
+            <input class="category-select-item-<%= type %>" type="<%= type %>" name="<%= type == 'radio' ? resource : resource_name %>" id="<%= resource_id %>" <%= "checked " if checked %> data-action="change->select-by-job-type#combinedSearch" data-select-by-job-type-target="<%= resource.split('-').map.with_index { |word, index| index > 0 ? word.capitalize : word }.join('') %>">
+            <%= resource_name.titleize %>
+          </label>
+          <div class="ms-2 text-sm"><%= count %></div>
         </div>
-      </ul>
+      <% end %>
     </div>
-  </div>
-</turbo-frame>
+  </ul>
+</div>
diff --git a/app/views/jobs/_climate_rating.html.erb b/app/views/jobs/_climate_rating.html.erb
new file mode 100644
index 00000000..f23cfa1f
--- /dev/null
+++ b/app/views/jobs/_climate_rating.html.erb
@@ -0,0 +1,3 @@
+<div class="d-flex flex-column align-items-center justify-content-center text-sm">
+  <div class="climate-rating"><%# job.company.carbon_pledge || 'no data' %>no data</div>
+</div>
diff --git a/app/views/jobs/_difficulty_rating.html.erb b/app/views/jobs/_difficulty_rating.html.erb
new file mode 100644
index 00000000..9d6703b8
--- /dev/null
+++ b/app/views/jobs/_difficulty_rating.html.erb
@@ -0,0 +1,13 @@
+<div class="d-flex flex-column align-items-center justify-content-center text-sm">
+  <div class="apply-rating">
+    <%# TODO: Create a difficulty column for jobs table and transfer this logic to JobCreator; eventually GetFormFieldsJob will distinguish between input and text fields (for longer responses), which will help with accurate classification %>
+    <% if job.requirement.no_of_qs < 8 && !job.requirement.cover_letter %>
+      <% apply_rating = 'no data' %>
+    <% elsif job.requirement.no_of_qs > 15 %>
+      <% apply_rating = 'hard' %>
+    <% else %>
+      <% apply_rating = 'medium' %>
+    <% end %>
+    <%= apply_rating %>
+  </div>
+</div>
diff --git a/app/views/jobs/_job_card.html.erb b/app/views/jobs/_job_card.html.erb
index 2f64adf3..3c8abc3f 100644
--- a/app/views/jobs/_job_card.html.erb
+++ b/app/views/jobs/_job_card.html.erb
@@ -1,102 +1,20 @@
 <div class="card job-card mb-2" data-select-by-job-type-target="jobRow">
   <div class="row card-body">
-    <%# TODO: Store company logo, use clearbit when we don't have one %>
-
-    <%# Logo %>
-    <div class="col-5 d-flex flex-row align-items-center">
-      <div class="d-flex justify-content-center align-items-center mx-2">
-        <%= link_to company_path(job.company), target: "_blank" do %>
-          <%= image_tag("https://logo.clearbit.com/#{job.company.url_website}", onerror: "this.src='https://i.pinimg.com/736x/ec/d9/c2/ecd9c2e8ed0dbbc96ac472a965e4afda.jpg'", style: "width: 60px; height: 60px; padding-right: 0.5rem;") %>
-        <% end %>
-      </div>
-
-      <%# Job Title, Company, Location %>
-      <div class="d-flex flex-column justify-content-center align-items-start" data-role="<%= job.title %>">
-        <%= link_to job_path(job), target: "_blank" do %>
-          <strong><%= job.title.truncate(35) %></strong>
-        <% end %>
-
-        <%= link_to company_path(job.company), target: "_blank" do %>
-          <strong class="text-sm"><%= job.company.name %></strong>
-        <% end %>
-
-        <div class="text-sm">
-          <% if job.remote || job.locations.empty? %>
-            Remote
-          <% else %>
-            <%= job.locations.map(&:city).join(' | ') %>
-          <% end %>
-          <% if job.countries.loaded? || job.countries.count == 1 %>
-            <%= " | #{job.countries.first.name}" if job.countries.count == 1 %>
-          <% else %>
-            <%= " | #{job.countries.first.name}" if job.countries.size == 1 %>
-          <% end %>
-        </div>
-      </div>
+    <%# Logo & Info %>
+    <div class="col-12 col-sm-12 col-md-5 col-lg-5 d-flex flex-row align-items-center mb-3 mb-md-0">
+      <%= render partial: 'jobs/logo', locals: { job: job } %>
+      <%= render partial: 'jobs/job_info', locals: { job: job } %>
     </div>
 
     <%# Job Details %>
-    <div class="col-7 d-flex flex-row justify-content-between align-items-center">
-
-      <%# Salary etc. %>
-      <div class="basic-info d-flex flex-column align-items-end justify-space-between text-sm">
-        <div class="salaryBudget"><%= job.salary.present? ? job.salary : "<br>".html_safe %></div>
-        <div class="my-1"><%= job.employment_type %> •
-          <% if job.remote %>
-            <%= "Remote"%>
-          <% elsif job.hybrid %>
-            <%= "Hybrid" %>
-          <% else %>
-            <%= "In-office" %>
-          <% end %>
-        </div>
-        <div><%= job.date_posted.strftime("%d/%m") %> <span class="meter"><hr class="line-horizontal"><div class="triangle-inverted-blue" style="left:<%= (job.deadline.nil? || job.deadline < Date.today) ? 50 : (Date.today - job.date_posted).to_i.fdiv((job.deadline - job.date_posted).to_i) * 100 %>%;"></div></span> <%= (job.deadline.nil? || job.deadline < Date.today) ? "Rolling" : job.deadline.strftime("%d/%m") %></div>
+    <div class="col-12 col-lg-7 d-flex flex-column flex-md-row justify-content-between align-items-center">
+      <div class="pb-3 pb-md-0 pe-md-5">
+        <%= render partial: 'jobs/basic_info', locals: { job: job } %>
       </div>
-
-      <%# Net Zero Rating %>
-      <div class="d-flex flex-column align-items-center justify-content-center text-sm">
-        <div class="climate-rating"><%# job.company.carbon_pledge || 'no data' %>no data</div>
-      </div>
-
-      <%# Ease of Applying %>
-      <div class="d-flex flex-column align-items-center justify-content-center text-sm">
-        <div class="apply-rating">
-          <%# To-do: Create a difficulty column for jobs table and transfer this logic to JobCreator; eventually GetFormFieldsJob will distinguish between input and text fields (for longer responses), which will help with accurate classification %>
-          <% if job.requirement.no_of_qs < 8 && !job.requirement.cover_letter %>
-            <% apply_rating = 'no data' %>
-          <% elsif job.requirement.no_of_qs > 15 %>
-            <% apply_rating = 'hard' %>
-          <% else %>
-            <% apply_rating = 'medium' %>
-          <% end %>
-          <%= apply_rating %>
-        </div>
-      </div>
-
-
-      <%# Add job to basket %>
-      <div class="d-flex align-items-center justify-content-center me-3">
-        <% if user_signed_in? %>
-          <% if @saved_job_ids.include?(job.id) %>
-            <%= link_to saved_job_path(job.saved_job_ids), data: {turbo_method: :delete} do %>
-              <i class="fa-solid fa-bookmark pe-2"></i>
-            <% end %>
-          <% else %>
-            <%= link_to job_saved_jobs_path(job), data: {turbo_method: :post} do %>
-              <i class="fa-regular fa-bookmark pe-2"></i>
-            <% end %>
-          <% end %>
-          <% include_checkboxes ||= false %>
-          <% if include_checkboxes %>
-            <div class="ms-3">
-              <%= check_box_tag "job_ids[]", job.id, onclick: "document.getElementById('apply_button').disabled = false" %>
-            </div>
-          <% end %>
-        <% end %>
-
-        <%= link_to job.posting_url, target: "_blank" do %>
-          <i class="fa-solid fa-arrow-up-right-from-square"></i>
-        <% end %>
+      <div class="d-flex flex-row justify-content-between align-items-center w-100">
+        <%= render partial: 'jobs/climate_rating', locals: { job: job } %>
+        <%= render partial: 'jobs/difficulty_rating', locals: { job: job } %>
+        <%= render partial: 'jobs/add_job_to_basket', locals: { job: job, saved_job_ids: @saved_job_ids } %>
       </div>
     </div>
   </div>
diff --git a/app/views/jobs/_job_cards_container.html.erb b/app/views/jobs/_job_cards_container.html.erb
index ab9871d8..f42a5895 100644
--- a/app/views/jobs/_job_cards_container.html.erb
+++ b/app/views/jobs/_job_cards_container.html.erb
@@ -1,14 +1,10 @@
-<div class="col-sm-9">
+<div>
   <turbo-frame id="job-cards-frame">
     <%= render partial: 'job_card', collection: @jobs, as: :job %>
   </turbo-frame>
 
-  <div class="digg_pagination">
-    <div class="page_info">
-      <%= page_entries_info @jobs %>
-    </div>
-
-    <%= will_paginate @jobs, container: false %>
-
+  <div class="pt-2 d-flex flex-column align-items-end">
+    <div><%= page_entries_info @jobs %></div>
+    <div class="pagination pt-1"><%= paginate @jobs %></div>
   </div>
 </div>
diff --git a/app/views/jobs/_job_info.html.erb b/app/views/jobs/_job_info.html.erb
new file mode 100644
index 00000000..86127fb0
--- /dev/null
+++ b/app/views/jobs/_job_info.html.erb
@@ -0,0 +1,22 @@
+<div class="d-flex flex-column justify-content-center align-items-start" data-role="<%= job.title %>">
+  <%= link_to job_path(job), target: "_blank" do %>
+    <strong><%= job.title.truncate(35) %></strong>
+  <% end %>
+
+  <%= link_to company_path(job.company), target: "_blank" do %>
+    <strong class="text-sm"><%= job.company.name %></strong>
+  <% end %>
+
+  <div class="text-sm">
+    <% if job.remote || job.locations.empty? %>
+      Remote
+    <% else %>
+      <%= job.locations.map(&:city).join(' | ') %>
+    <% end %>
+    <% if job.countries.loaded? || job.countries.count == 1 %>
+      <%= " | #{job.countries.first.name}" if job.countries.count == 1 %>
+    <% else %>
+      <%= " | #{job.countries.first.name}" if job.countries.size == 1 %>
+    <% end %>
+  </div>
+</div>
diff --git a/app/views/jobs/_logo.html.erb b/app/views/jobs/_logo.html.erb
new file mode 100644
index 00000000..cbe9aec4
--- /dev/null
+++ b/app/views/jobs/_logo.html.erb
@@ -0,0 +1,5 @@
+<div class="d-flex justify-content-center align-items-center mx-2">
+  <%= link_to company_path(job.company), target: "_blank" do %>
+    <%= image_tag("https://logo.clearbit.com/#{job.company.url_website}", onerror: "this.src='https://i.pinimg.com/736x/ec/d9/c2/ecd9c2e8ed0dbbc96ac472a965e4afda.jpg'", style: "width: 60px; height: 60px; padding-right: 0.5rem;") %>
+  <% end %>
+</div>
diff --git a/app/views/jobs/_search.html.erb b/app/views/jobs/_search.html.erb
index d49d4630..80b3b685 100644
--- a/app/views/jobs/_search.html.erb
+++ b/app/views/jobs/_search.html.erb
@@ -1,15 +1,13 @@
-<div id="jobs-search-bar" class="search-bar-background">
-  <%= form_tag jobs_path, method: :get, class: 'd-flex', data: { action: "submit->select-by-job-type#combinedSearch" } do %>
+<div id="jobs-search-bar">
+  <%# TODO: Fix search - currently slow and not using the pg_search gem properly (check with @Dan) %>
+  <%= form_tag jobs_path, method: :get, class: 'd-flex justify-content-center', data: { action: "submit->select-by-job-type#combinedSearch" } do %>
     <%= text_field_tag :query,
         params[:query],
-        class: 'form-control',
-        placeholder: 'Search for any job, company or role... ', id: 'search-jobs',
+        id: 'search-jobs',
+        class: 'form-control bg-white fs-6',
+        style: 'box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);',
+        placeholder: 'Search for any job, company or role... ',
         data: { 'select-by-job-type-target': 'search' } %>
-
-    <%= link_to jobs_path, class: 'clear-search-icon' do %>
-      <i class="fa-solid fa-x"></i>
-    <% end %>
-
     <%= submit_tag 'Search', id: 'search-button' %>
   <% end %>
 </div>
diff --git a/app/views/jobs/_sort_by.html.erb b/app/views/jobs/_sort_by.html.erb
new file mode 100644
index 00000000..83d67927
--- /dev/null
+++ b/app/views/jobs/_sort_by.html.erb
@@ -0,0 +1,13 @@
+<div class="dropdown">
+  <button class="btn btn-sm dropdown-toggle rounded-4" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+    Sort by
+  </button>
+  <ul class="dropdown-menu dropdown-menu-end bg-white">
+    <li><%= link_to 'Title (A-Z)', jobs_path(request.params.merge(sort: 'title')), class: 'btn tc-main' %></li>
+    <li><%= link_to 'Title (Z-A)', jobs_path(request.params.merge(sort: 'title_desc')), class: 'btn tc-main' %></li>
+    <li><%= link_to 'Company (A-Z)', jobs_path(request.params.merge(sort: 'company')), class: 'btn tc-main' %></li>
+    <li><%= link_to 'Company (Z-A)', jobs_path(request.params.merge(sort: 'company_desc')), class: 'btn tc-main' %></li>
+    <li><%= link_to 'Newest', jobs_path(request.params.merge(sort: 'created_at')), class: 'btn tc-main' %></li>
+    <li><%= link_to 'Oldest', jobs_path(request.params.merge(sort: 'created_at_asc')), class: 'btn tc-main' %></li>
+  </ul>
+</div>
diff --git a/app/views/jobs/index.html.erb b/app/views/jobs/index.html.erb
index 407cf02b..98857f8e 100644
--- a/app/views/jobs/index.html.erb
+++ b/app/views/jobs/index.html.erb
@@ -1,16 +1,19 @@
-<%# The title meta tag here seems to be affecting the filter_category_sidebar. Not sure how to fix because I don't want to break anything but uncomment the title "All Jobs" below to see what I mean %>
-
-<%# <% title "All Jobs" %>
-<% description "Discover thousands of jobs on our platform. With Cheddar's innovative one-click applciation process, you can select multiple positions that interest you and apply to all of them at once without having to leave our site." %>
+<% title "Find Jobs" %>
+<% description "Discover and apply to thousands of jobs with Cheddar's one-click application process." %>
 
 <div class="container" data-controller="select-by-job-type">
-
-  <div class="d-flex justify-content-center align-items-center pb-4">
-    <%= render 'search' %>
-  </div>
-  
-  <div class="row">
-    <%= render 'category_sidebar' %>
-    <%= render 'job_cards_container' %>
+  <div class="row d-flex justify-content-center align-items-center pb-4">
+    <div class="col-12 col-md-8">
+      <%= render 'search' %>
+    </div>
   </div>
+
+  <turbo-frame id="job-results" class="row">
+    <div class="col-12 col-lg-3 mb-4 mb-md-0">
+      <%= render 'category_sidebar' %>
+    </div>
+    <div class="col-12 col-lg-9">
+      <%= render 'job_cards_container' %>
+    </div>
+  </turbo-frame>
 </div>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 1dc4e650..35cd6c07 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,14 +1,23 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <%= display_meta_tags site: "Cheddar" %>
+    <!-- Tags -->
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <%= display_meta_tags site: "Cheddar" %>
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
     <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
-    <%= javascript_importmap_tags %>
+
+    <!-- Favicon -->
     <%= favicon_link_tag asset_path("cheddar_logo_new_3.svg") %>
-    <script type="text/javascript" src="/assets/tinymce.js"></script>
+
+    <!-- Importmaps -->
+    <%= javascript_importmap_tags %>
+
+    <!-- Analytics -->
+    <%= render "shared/google_analytics" %>
+    <%= render "shared/hotjar" %>
+    <%= render "shared/hubspot" %>
   </head>
 
   <body id="page-container">
diff --git a/app/views/pages/_footer.html.erb b/app/views/pages/_footer.html.erb
index 979bb7e2..9d92c3d0 100644
--- a/app/views/pages/_footer.html.erb
+++ b/app/views/pages/_footer.html.erb
@@ -1,39 +1,36 @@
-<div class="footer">
-  <div class="container">
-    <div class="d-flex justify-content-between">
-      <div class="d-flex flex-column align-items-start justify-content-start">
-        <div>
-          A <%= link_to "Net Zero from Day Zero", "/#" %> company
-        </div>
-        <div class="footer-links">
-          <a href="https://github.com/Ches-ctrl/Cheddar"><i class="fab fa-github"></i></a>
-          <a href="#"><i class="fab fa-linkedin"></i></a>
-          <a href="#"><i class="fab fa-twitter"></i></a>
-        </div>
-      </div>
-      <div>
-        <div>For Applicants</div>
-        <%= link_to "How It Works", how_it_works_path %>
+<div class="footer mt-4">
+  <div class="container py-4">
+    <div class="row d-flex justify-content-between">
+      <div class="col-12 col-lg-5 mb-4 mb-lg-0">
+        <h5 class="mb-2">Subscribe</h5>
+        <p class="text-secondary mw-xs mb-3">Get the latest roles in your inbox</p>
+        <%= render 'shared/email_signup' %>
       </div>
-      <div>
-        <div>For Employers</div>
-        <a href="/business">Cheddar For Business</a>
-      </div>
-      <div class="page-links d-flex">
-        <div class="d-flex flex-column me-4">
-          <a href="/about">About</a>
-          <a href="/faqs">FAQs</a>
-          <a href="/d&i">D&I</a>
-          <a href="/careers">Careers</a>
+      <div class="col-12 col-lg-7 d-flex flex-column flex-lg-row justify-content-lg-end">
+        <div class="d-flex flex-column me-lg-4 mb-4 mb-lg-0 pe-4">
+          <%# <h6 class="mb-3">Company</h6> %>
+          <%# <a href="/how_it_works" class="mb-1 text-decoration-none text-secondary">How It Works</a>
+          <a href="/about" class="mb-1 text-decoration-none text-secondary">About</a>
+          <a href="/mission" class="mb-1 text-decoration-none text-secondary">Mission</a>
+          <a href="/climate" class="mb-1 text-decoration-none text-secondary">Climate</a> %>
         </div>
         <div class="d-flex flex-column">
-          <a href="/contact">Contact</a>
-          <a href="/ts&cs">Terms</a>
-          <a href="/privacy">Privacy</a>
+          <%# <h6 class="mb-3">Company</h6> %>
+          <%# <a href="/contact" class="mb-1 text-decoration-none text-secondary">Contact</a>
+          <a href="/terms" class="mb-1 text-decoration-none text-secondary">Terms</a>
+          <a href="/privacy" class="mb-1 text-decoration-none text-secondary">Privacy</a> %>
         </div>
       </div>
     </div>
+
+    <div class="row pt-2 mt-4 border-top">
+      <div class="col-12 col-md-6 text-center text-md-start mb-3 mb-md-0">
+        <p class="fs-9 text-secondary mb-0">&copy; 2024 Cheddar. All Rights Reserved</p>
+      </div>
+      <div class="col-12 col-md-6 d-flex justify-content-center justify-content-md-end">
+        <a href="https://www.linkedin.com/company/cheddarjobs", target="_blank" class="text-secondary me-3"><i class="fab fa-linkedin-in"></i></a>
+        <a href="https://github.com/Ches-ctrl/Cheddar", target="_blank" class="text-secondary"><i class="fab fa-github"></i></a>
+      </div>
+    </div>
   </div>
 </div>
-
-<%# TODO: Change this to vertical columns on RHS for better alignnment %>
diff --git a/app/views/pages/about.html.erb b/app/views/pages/about.html.erb
index 27102dd9..e69de29b 100644
--- a/app/views/pages/about.html.erb
+++ b/app/views/pages/about.html.erb
@@ -1,8 +0,0 @@
-<div id="about-page">
-  <%= image_tag "cheddar-3d-icon.png", alt: "Cheddar 3D Icon", id: "about-logo" %>
-  <h1>The all-in-one job application platform for grads</h1>
-  <h3>Navigating the labyrinth of job applications, graduates often find themselves drowning in a sea of platforms and forms. Cheddar aims to alleviate these burdens by streamlining the application process.</h3>
-  <h3>By integrating all job postings into a single platform and securely storing applicant data, Cheddar makes job hunting a seamless experience. With the initial focus on the UK graduate market, which comprises approximately 1 million individuals annually, Cheddar empowers graduates to efficiently discover, review, and apply to multiple positions—all in one place.</h3>
-  <h3>Our goal is simple: to remove unnecessary steps from the application process, granting applicants valuable time without compromising application quality. Drawing inspiration from e-commerce platforms like Amazon, Cheddar operates as a one-stop shop for job seekers, allowing them to select positions like products and complete applications in one transaction.</h3>
-  <h3>Think of it as a common app for jobs, where Cheddar saves employment data and interfaces directly with company websites, enabling students to batch apply without sacrificing attention to detail. By enhancing the applicant experience tenfold, Cheddar not only serves individuals but also offers an unparalleled proposition for companies, positioning itself as the ultimate job marketplace.</h3>
-</div>
diff --git a/app/views/pages/faqs.html.erb b/app/views/pages/faqs.html.erb
index 81031cac..e0a9480a 100644
--- a/app/views/pages/faqs.html.erb
+++ b/app/views/pages/faqs.html.erb
@@ -1,114 +1,173 @@
-<section class="faq-section">
-  <div class="container">
-    <div class="row">
-      <!-- ***** FAQ Start ***** -->
-      <div class="col-md-6 offset-md-3">
-        <div class="faq-title text-center pb-3">
-            <h2>FAQ</h2>
-        </div>
-      </div>
-      <div class="col-md-6 offset-md-3">
-          <div class="faq" id="accordion">
-              <div class="card">
-                  <div class="card-header" id="faqHeading-1">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
-                              <span class="badge">1</span>What is Lorem Ipsum?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. </p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-2">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-2" data-aria-expanded="false" data-aria-controls="faqCollapse-2">
-                              <span class="badge">2</span> Where does it come from?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-2" class="collapse" aria-labelledby="faqHeading-2" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.</p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-3">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-3" data-aria-expanded="false" data-aria-controls="faqCollapse-3">
-                              <span class="badge">3</span>Why do we use it?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-3" class="collapse" aria-labelledby="faqHeading-3" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here.</p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-4">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-4" data-aria-expanded="false" data-aria-controls="faqCollapse-4">
-                              <span class="badge">4</span> Where can I get some?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-4" class="collapse" aria-labelledby="faqHeading-4" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-5">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-5" data-aria-expanded="false" data-aria-controls="faqCollapse-5">
-                              <span class="badge">5</span> What is Lorem Ipsum?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-5" class="collapse" aria-labelledby="faqHeading-5" data-parent="#accordion">
-                      <div class="card-body">
-                          <p> It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing</p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-6">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-6" data-aria-expanded="false" data-aria-controls="faqCollapse-6">
-                              <span class="badge">6</span> Where does it come from?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-6" class="collapse" aria-labelledby="faqHeading-6" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.</p>
-                      </div>
-                  </div>
-              </div>
-              <div class="card">
-                  <div class="card-header" id="faqHeading-7">
-                      <div class="mb-0">
-                          <h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-7" data-aria-expanded="false" data-aria-controls="faqCollapse-7">
-                              <span class="badge">7</span> Why do we use it?
-                          </h5>
-                      </div>
-                  </div>
-                  <div id="faqCollapse-7" class="collapse" aria-labelledby="faqHeading-7" data-parent="#accordion">
-                      <div class="card-body">
-                          <p>Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>
-                      </div>
+<!--====== ABOUT SIX PART START ======-->
+<section class="about-area about-six">
+   <div class="container">
+      <div class="row">
+         <div class="col-lg-5">
+            <div class="faq-content">
+               <div class="faq-title">
+                  <h5 class="sub-title fw-light">A Little More About Us</h5>
+                  <h3 class="title fw-bold">
+                     Frequently Asked Questions <br />
+                     About Our Site
+                  </h3>
+               </div>
+               <!-- faq title -->
+               <div class="faq-accordion">
+                  <div class="accordion" id="accordionExample">
+                     <div class="card">
+                        <div class="card-header" id="headingOne">
+                           <a
+                              href="javascript:void(0)"
+                              data-bs-toggle="collapse"
+                              data-bs-target="#collapseOne"
+                              aria-expanded="true"
+                              aria-controls="collapseOne"
+                              >Frequently Asked Question One</a
+                              >
+                        </div>
+                        <div
+                           id="collapseOne"
+                           class="collapse show"
+                           aria-labelledby="headingOne"
+                           data-bs-parent="#accordionExample"
+                           >
+                           <div class="card-body">
+                              <p class="text">
+                                 Morbi vehicula arcu et pellentesque tincidunt. Nunc
+                                 ligula nulla, lobortis a elementum non, vulputate ut
+                                 arcu. Aliquam erat volutpat. Nullam lacinia felis.
+                              </p>
+                           </div>
+                        </div>
+                     </div>
+                     <!-- card -->
+                     <div class="card">
+                        <div class="card-header" id="headingTwo">
+                           <a
+                              href="javascript:void(0)"
+                              class="collapsed"
+                              data-bs-toggle="collapse"
+                              data-bs-target="#collapseTwo"
+                              aria-expanded="false"
+                              aria-controls="collapseTwo"
+                              >Frequently Asked Question Two</a
+                              >
+                        </div>
+                        <div
+                           id="collapseTwo"
+                           class="collapse"
+                           aria-labelledby="headingTwo"
+                           data-bs-parent="#accordionExample"
+                           >
+                           <div class="card-body">
+                              <p class="text">
+                                 Morbi vehicula arcu et pellentesque tincidunt. Nunc
+                                 ligula nulla, lobortis a elementum non, vulputate ut
+                                 arcu. Aliquam erat volutpat. Nullam lacinia felis.
+                              </p>
+                           </div>
+                        </div>
+                     </div>
+                     <!-- card -->
+                     <div class="card">
+                        <div class="card-header" id="headingThree">
+                           <a
+                              href="javascript:void(0)"
+                              class="collapsed"
+                              data-bs-toggle="collapse"
+                              data-bs-target="#collapseThree"
+                              aria-expanded="false"
+                              aria-controls="collapseThree"
+                              >Frequently Asked Question Three</a
+                              >
+                        </div>
+                        <div
+                           id="collapseThree"
+                           class="collapse"
+                           aria-labelledby="headingThree"
+                           data-bs-parent="#accordionExample"
+                           >
+                           <div class="card-body">
+                              <p class="text">
+                                 Morbi vehicula arcu et pellentesque tincidunt. Nunc
+                                 ligula nulla, lobortis a elementum non, vulputate ut
+                                 arcu. Aliquam erat volutpat. Nullam lacinia felis.
+                              </p>
+                           </div>
+                        </div>
+                     </div>
+                     <!-- card -->
+                     <div class="card">
+                        <div class="card-header" id="headingFore">
+                           <a
+                              href="javascript:void(0)"
+                              class="collapsed"
+                              data-bs-toggle="collapse"
+                              data-bs-target="#collapseFore"
+                              aria-expanded="false"
+                              aria-controls="collapseFore"
+                              >Frequently Asked Question Four</a
+                              >
+                        </div>
+                        <div
+                           id="collapseFore"
+                           class="collapse"
+                           aria-labelledby="headingFore"
+                           data-bs-parent="#accordionExample"
+                           >
+                           <div class="card-body">
+                              <p class="text">
+                                 Morbi vehicula arcu et pellentesque tincidunt. Nunc
+                                 ligula nulla, lobortis a elementum non, vulputate ut
+                                 arcu. Aliquam erat volutpat. Nullam lacinia felis.
+                              </p>
+                           </div>
+                        </div>
+                     </div>
+                     <!-- card -->
+                     <div class="card">
+                        <div class="card-header" id="headingFive">
+                           <a
+                              href="javascript:void(0)"
+                              class="collapsed"
+                              data-bs-toggle="collapse"
+                              data-bs-target="#collapseFive"
+                              aria-expanded="false"
+                              aria-controls="collapseFive"
+                              >Frequently Asked Question Five</a
+                              >
+                        </div>
+                        <div
+                           id="collapseFive"
+                           class="collapse"
+                           aria-labelledby="headingFive"
+                           data-bs-parent="#accordionExample"
+                           >
+                           <div class="card-body">
+                              <p class="text">
+                                 Morbi vehicula arcu et pellentesque tincidunt. Nunc
+                                 ligula nulla, lobortis a elementum non, vulputate ut
+                                 arcu. Aliquam erat volutpat. Nullam lacinia felis.
+                              </p>
+                           </div>
+                        </div>
+                     </div>
+                     <!-- card -->
                   </div>
-              </div>
-          </div>
+               </div>
+               <!-- faq accordion -->
+            </div>
+            <!-- faq content -->
+         </div>
+         <div class="col-lg-7">
+            <div class="faq-image">
+               <img src="https://cdn.ayroui.com/1.0/images/about/faq.jpg" alt="faq" />
+            </div>
+            <!-- faq image -->
+         </div>
       </div>
-    </div>
-  </div>
+      <!-- row -->
+   </div>
+   <!-- container -->
 </section>
+<!--====== ABOUT SIX PART ENDS ======-->
diff --git a/app/views/pages/home.html.erb b/app/views/pages/home.html.erb
index 7ff96193..a2be97c6 100644
--- a/app/views/pages/home.html.erb
+++ b/app/views/pages/home.html.erb
@@ -1,4 +1,4 @@
-<% title "Home" %>
+<% title "Homepage" %>
 <section id="animated-cta-bar">
   <div class="cta-content">
     <div class="background" id="landing-page-background">
@@ -16,7 +16,7 @@
     </div>
   </div>
   <ul class="floating-icons">
-    <%# TODO: Update brands drifting across %>
+    <%# TODO: Delete and replace %>
     <li class="drift drift-1 delay-1"><div class="float float-1"><i <i class="fa-brands fa-aws fa-lg"></i></div></li>
     <li class="drift drift-2 delay-3"><div class="float float-2"><i <i class="fa-brands fa-apple fa-lg"></i></div></li>
     <li class="drift drift-3"><div class="float float-3"><i <i class="fa-brands fa-google fa-lg"></i></div></li>
diff --git a/app/views/pages/temp.html.erb b/app/views/pages/temp.html.erb
deleted file mode 100644
index ed4522c2..00000000
--- a/app/views/pages/temp.html.erb
+++ /dev/null
@@ -1,5 +0,0 @@
-<iframe class="airtable-embed pt-3" src="https://airtable.com/embed/appYRiv6CmUfTPswb/shrJ8qtDsvGhXoo4C?backgroundColor=blue&viewControls=on" frameborder="0" onmousewheel="" width="100%" height="700" style="background: transparent; border: 1px solid #ccc;">
-</iframe>
-<div class="d-flex align-items-center justify-content-center">
-  <button class="btn btn-apply mt-3" onclick="window.location.href='https://blocksurvey.io/cheddar-job-site-signup-form-rR5ZN6QFSxyQu4gFR1r9BQ?v=o';">Sign up to the waitlist</button>
-</div>
diff --git a/app/views/pages/test.html.erb b/app/views/pages/test.html.erb
deleted file mode 100644
index e69de29b..00000000
diff --git a/app/views/shared/_email_signup.html.erb b/app/views/shared/_email_signup.html.erb
new file mode 100644
index 00000000..c5697535
--- /dev/null
+++ b/app/views/shared/_email_signup.html.erb
@@ -0,0 +1,6 @@
+<%= form_with url: emails_path, method: :post, local: true do |form| %>
+  <div class="input-group mw-md mb-3 bg-white">
+    <%= form.text_field :email, class: 'rounded-start-pill form-control bg-white', placeholder: 'Type your email', aria: { label: 'Email' } %>
+    <%= form.submit 'Subscribe', class: 'input-group-text rounded-end-pill bg-main text-white' %>
+  </div>
+<% end %>
diff --git a/app/views/shared/_google_analytics.html.erb b/app/views/shared/_google_analytics.html.erb
new file mode 100644
index 00000000..27d94b66
--- /dev/null
+++ b/app/views/shared/_google_analytics.html.erb
@@ -0,0 +1,8 @@
+<script async src="https://www.googletagmanager.com/gtag/js?id=G-V8MMX60F1R"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', 'G-V8MMX60F1R');
+</script>
diff --git a/app/views/shared/_hotjar.html.erb b/app/views/shared/_hotjar.html.erb
new file mode 100644
index 00000000..21657abc
--- /dev/null
+++ b/app/views/shared/_hotjar.html.erb
@@ -0,0 +1,10 @@
+<script>
+    (function(h,o,t,j,a,r){
+        h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+        h._hjSettings={hjid:4987825,hjsv:6};
+        a=o.getElementsByTagName('head')[0];
+        r=o.createElement('script');r.async=1;
+        r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+        a.appendChild(r);
+    })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
+</script>
diff --git a/app/views/shared/_hubspot.html.erb b/app/views/shared/_hubspot.html.erb
new file mode 100644
index 00000000..c8fd0092
--- /dev/null
+++ b/app/views/shared/_hubspot.html.erb
@@ -0,0 +1 @@
+<script type="text/javascript" id="hs-script-loader" async defer src="//js-eu1.hs-scripts.com/143835533.js"></script>
diff --git a/app/views/user_mailer/confirmation_email.html.erb b/app/views/user_mailer/confirmation_email.html.erb
new file mode 100644
index 00000000..b2f77ad7
--- /dev/null
+++ b/app/views/user_mailer/confirmation_email.html.erb
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta content='text/html; charset=UTF-8' http-equiv='Content-Type' />
+  </head>
+  <body>
+    <h1>Thank you for subscribing!</h1>
+    <p>
+      You have successfully subscribed with the email: <%= @email %>.
+    </p>
+  </body>
+</html>
diff --git a/app/views/user_mailer/confirmation_email.text.erb b/app/views/user_mailer/confirmation_email.text.erb
new file mode 100644
index 00000000..5c873cbc
--- /dev/null
+++ b/app/views/user_mailer/confirmation_email.text.erb
@@ -0,0 +1,3 @@
+Thank you for subscribing!
+
+You have successfully subscribed with the email: <%= @email %>.
diff --git a/config/environments/development.rb b/config/environments/development.rb
index 1c7019b5..3ebea1f1 100644
--- a/config/environments/development.rb
+++ b/config/environments/development.rb
@@ -10,6 +10,17 @@
     Bullet.add_footer    = true
   end
 
+  config.action_mailer.delivery_method = :smtp
+  config.action_mailer.smtp_settings = {
+    user_name: 'apikey',
+    password: ENV.fetch('SENDGRID_API_KEY'),
+    domain: 'localhost',
+    address: 'smtp.sendgrid.net',
+    port: 587,
+    authentication: :plain,
+    enable_starttls_auto: true
+  }
+
   config.action_mailer.default_url_options = { host: "http://localhost:3000" }
   # Settings specified here will take precedence over those in config/application.rb.
 
diff --git a/config/environments/production.rb b/config/environments/production.rb
index bc347e3d..c2594fbd 100644
--- a/config/environments/production.rb
+++ b/config/environments/production.rb
@@ -1,7 +1,18 @@
 require "active_support/core_ext/integer/time"
 
 Rails.application.configure do
-  config.action_mailer.default_url_options = { host: "http://TODO_PUT_YOUR_DOMAIN_HERE" }
+  config.action_mailer.delivery_method = :smtp
+  config.action_mailer.smtp_settings = {
+    user_name: 'apikey',
+    password: ENV.fetch('SENDGRID_API_KEY'),
+    domain: 'cheddar.jobs',
+    address: 'smtp.sendgrid.net',
+    port: 587,
+    authentication: :plain,
+    enable_starttls_auto: true
+  }
+
+  config.action_mailer.default_url_options = { host: "www.cheddar.jobs", protocol: "https" }
   # Settings specified here will take precedence over those in config/application.rb.
 
   # Code is not reloaded between requests.
diff --git a/config/newrelic.yml b/config/newrelic.yml
new file mode 100644
index 00000000..e975b4a4
--- /dev/null
+++ b/config/newrelic.yml
@@ -0,0 +1,66 @@
+#
+# This file configures the New Relic Agent.  New Relic monitors Ruby, Java,
+# .NET, PHP, Python, Node, and Go applications with deep visibility and low
+# overhead.  For more information, visit www.newrelic.com.
+#
+# Generated October 28, 2022
+#
+# This configuration file is custom generated for NewRelic Administration
+#
+# For full documentation of agent configuration options, please refer to
+# https://docs.newrelic.com/docs/agents/ruby-agent/installation-configuration/ruby-agent-configuration
+
+common: &default_settings
+  # Required license key associated with your New Relic account.
+  license_key: '<%= ENV["NEW_RELIC_LICENSE_KEY"] %>'
+
+  # Your application name. Renaming here affects where data displays in New
+  # Relic.  For more details, see https://docs.newrelic.com/docs/apm/new-relic-apm/maintenance/renaming-applications
+  app_name: 'cheddar'
+
+  distributed_tracing:
+    enabled: true
+
+  # To disable the agent regardless of other settings, uncomment the following:
+
+  # agent_enabled: false
+
+  # Logging level for log/newrelic_agent.log
+  log_level: info
+
+  application_logging:
+    # If `true`, all logging-related features for the agent can be enabled or disabled
+    # independently. If `false`, all logging-related features are disabled.
+    enabled: true
+    forwarding:
+      # If `true`, the agent captures log records emitted by this application.
+      enabled: true
+      # Defines the maximum number of log records to buffer in memory at a time.
+      max_samples_stored: 10000
+    metrics:
+      # If `true`, the agent captures metrics related to logging for this application.
+      enabled: true
+    local_decorating:
+      # If `true`, the agent decorates logs with metadata to link to entities, hosts, traces, and spans.
+      # This requires a log forwarder to send your log files to New Relic.
+      # This should not be used when forwarding is enabled.
+      enabled: false
+
+# Environment-specific settings are in this section.
+# RAILS_ENV or RACK_ENV (as appropriate) is used to determine the environment.
+# If your application has other named environments, configure them here.
+development:
+  <<: *default_settings
+  app_name: 'cheddar (Development)'
+
+test:
+  <<: *default_settings
+  # It doesn't make sense to report to New Relic from automated test runs.
+  monitor_mode: false
+
+staging:
+  <<: *default_settings
+  app_name: 'cheddar (Staging)'
+
+production:
+  <<: *default_settings
diff --git a/config/routes.rb b/config/routes.rb
index e8de5218..05073724 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -5,7 +5,7 @@
     mount Sidekiq::Web => '/sidekiq'
   end
 
-  mount ActionCable.server => "/cable"
+  mount ActionCable.server => "/cable" # TODO: fix as not found at the moment
   mount Avo::Engine, at: '/avo'
 
   devise_for :users, except: [:fetch_template]
@@ -18,11 +18,12 @@
 
   # Pages
   root to: "pages#home"
-  get 'landing', to: 'pages#landing', as: 'landing'
   get 'about', to: 'pages#about', as: 'about'
   get 'how_it_works', to: 'pages#how_it_works', as: 'how_it_works'
   get 'privacy', to: 'pages#privacy', as: 'privacy'
   get 'ts&cs', to: 'pages#ts_and_cs', as: 'ts_and_cs'
+  get 'landing', to: 'pages#landing', as: 'landing'
+  get 'faqs', to: 'pages#faqs', as: 'faqs'
 
   # Users
   get 'profile', to: 'users#show', as: 'profile'
@@ -50,7 +51,7 @@
     end
   end
 
+  resources :emails, only: [:create]
   resources :saved_jobs, only: [:index, :show, :destroy]
   resources :educations, only: [:new, :create]
-
 end
diff --git a/spec/rails_helper.rb b/spec/rails_helper.rb
index 645c2628..d45c3950 100644
--- a/spec/rails_helper.rb
+++ b/spec/rails_helper.rb
@@ -1,5 +1,6 @@
 # This file is copied to spec/ when you run 'rails generate rspec:install'
 require 'spec_helper'
+require 'factory_bot_rails'
 
 ENV['RAILS_ENV'] ||= 'test'
 require_relative '../config/environment'
diff --git a/spec/requests/emails_spec.rb b/spec/requests/emails_spec.rb
new file mode 100644
index 00000000..30fd9c6e
--- /dev/null
+++ b/spec/requests/emails_spec.rb
@@ -0,0 +1,7 @@
+require 'rails_helper'
+
+RSpec.describe "Emails", type: :request do
+  describe "GET /index" do
+    pending "add some examples (or delete) #{__FILE__}"
+  end
+end
diff --git a/spec/spec_helper.rb b/spec/spec_helper.rb
index f189d7df..ad3b8b4c 100644
--- a/spec/spec_helper.rb
+++ b/spec/spec_helper.rb
@@ -15,6 +15,7 @@
 # See https://rubydoc.info/gems/rspec-core/RSpec/Core/Configuration
 require 'rails_helper'
 require 'capybara/rspec'
+require 'vcr'
 require 'webmock/rspec'
 
 Capybara.configure do |config|