diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 7a945f0..227dacc 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -35,6 +35,8 @@ jobs:
           VITE_APP_CONTENTFUL_API_KEY: ${{ secrets.VITE_APP_CONTENTFUL_API_KEY }}
           VITE_APP_CONTENTFUL_SPACE_ID: ${{ secrets.VITE_APP_CONTENTFUL_SPACE_ID }}
           VITE_APP_CONTENTFUL_ENVIRONMENT: ${{ secrets.VITE_APP_CONTENTFUL_ENVIRONMENT }}
+      - name: Copy CNAME
+        run: cp CNAME dist/
       - name: Deploy
         uses: peaceiris/actions-gh-pages@v4
         with:
diff --git a/CNAME b/CNAME
new file mode 100644
index 0000000..614635b
--- /dev/null
+++ b/CNAME
@@ -0,0 +1 @@
+geekylifehacks.com
diff --git a/package.json b/package.json
index 27db7a6..1c843b7 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,7 @@
         "@ant-design/icons"                   : "^5.5.1",
         "@contentful/rich-text-html-renderer" : "^17.0.0",
         "antd"                                : "^5.22.1",
-        "contentful"                          : "^11.2.1",
+        "contentful"                          : "^11.2.2",
         "i18next"                             : "^23.16.5",
         "i18next-browser-languagedetector"    : "^8.0.0",
         "mdb-react-ui-kit"                    : "^9.0.0",
@@ -38,16 +38,16 @@
         "usehooks-ts"                         : "^3.1.0"
     },
     "devDependencies" : {
-        "@eslint/eslintrc"            : "^3.1.0",
-        "@eslint/js"                  : "^9.14.0",
+        "@eslint/eslintrc"            : "^3.2.0",
+        "@eslint/js"                  : "^9.15.0",
         "@stylistic/eslint-plugin-ts" : "^2.10.1",
         "@types/eslint__js"           : "^8.42.3",
         "@types/node"                 : "^22.9.0",
         "@types/react"                : "^18.3.12",
         "@types/react-dom"            : "^18.3.1",
-        "@typescript-eslint/parser"   : "^8.14.0",
+        "@typescript-eslint/parser"   : "^8.15.0",
         "@vitejs/plugin-react-swc"    : "^3.7.1",
-        "eslint"                      : "^9.14.0",
+        "eslint"                      : "^9.15.0",
         "eslint-plugin-import"        : "^2.31.0",
         "eslint-plugin-prefer-arrow"  : "^1.2.3",
         "eslint-plugin-react"         : "^7.37.2",
@@ -57,7 +57,7 @@
         "prop-types"                  : "^15.8.1",
         "rollup-plugin-visualizer"    : "^5.12.0",
         "typescript"                  : "^5.6.3",
-        "typescript-eslint"           : "^8.14.0",
+        "typescript-eslint"           : "^8.15.0",
         "vite"                        : "^5.4.11"
     },
     "engines"         : {
diff --git a/src/pages/SecureZone.tsx b/src/pages/SecureZone.tsx
index b5c89e8..4ee6513 100644
--- a/src/pages/SecureZone.tsx
+++ b/src/pages/SecureZone.tsx
@@ -65,10 +65,10 @@ export const SecureZone = () => {
                         </Typography.Text>
                         <Button
                             style={{
-                                margin     : 48,
-                                padding    : 32,
-                                fontSize   : '1.25rem',
-                                fontWeight : 600,
+                                margin          : 48,
+                                padding         : 32,
+                                fontSize        : '1.25rem',
+                                fontWeight      : 600,
                                 backgroundColor : 'rgb(44, 54, 22)',
                             }}
                             size='large'
@@ -77,32 +77,47 @@ export const SecureZone = () => {
                             onClick={handleDownload}>
                             {t('actions.download')}
                         </Button>
+                        <a
+                            style={{
+                                display        : 'flex',
+                                alignItems     : 'center',
+                                justifyContent : 'center',
+                            }}
+                            href='https://my.home-assistant.io/redirect/supervisor_add_addon_repository/?repository_url=https%3A%2F%2Fgithub.com%2Fayltai%2Fgeekylifehacks-ha-addons'
+                            target='_blank'
+                            rel='noreferrer noopener'>
+                            <img
+                                src='https://my.home-assistant.io/badges/supervisor_add_addon_repository.svg'
+                                alt='Open your Home Assistant instance and show the add add-on repository dialog with a specific repository URL pre-filled.' />
+                        </a>
                     </div>
                 </section>
-                <section style={{
-                    display        : 'flex',
-                    flexDirection  : 'column',
-                    alignItems     : 'center',
-                    justifyContent : 'center',
-                }}>
-                    <div style={{
-                        width          : isDesktop ? PAGE_WIDTH : '100%',
-                        height         : '100%',
-                        paddingTop     : '8rem',
-                        paddingBottom  : '8rem',
+                <section
+                    style={{
                         display        : 'flex',
                         flexDirection  : 'column',
                         alignItems     : 'center',
                         justifyContent : 'center',
                     }}>
+                    <div
+                        style={{
+                            width          : isDesktop ? PAGE_WIDTH : '100%',
+                            height         : '100%',
+                            paddingTop     : '8rem',
+                            paddingBottom  : '8rem',
+                            display        : 'flex',
+                            flexDirection  : 'column',
+                            alignItems     : 'center',
+                            justifyContent : 'center',
+                        }}>
                         <Row style={{
                             marginTop    : 24,
                             marginBottom : 96,
                         }}>
-                            <Col span={12}>
+                            <Col span={15}>
                                 <div style={{
-                                    width              : 450,
-                                    height             : 450,
+                                    width              : 550,
+                                    height             : 550,
                                     backgroundImage    : 'url("../matt-jones-xpDHTc-pkog-unsplash.jpg")',
                                     backgroundSize     : 'cover',
                                     backgroundPosition : 'center',
@@ -115,8 +130,8 @@ export const SecureZone = () => {
                                     flexDirection  : 'column',
                                     justifyContent : 'center',
                                 }}
-                                span={12}>
-                                <Typography.Title level={2}>
+                                span={9}>
+                                <Typography.Title level={1}>
                                     {t('sections.products.0.tagline.0')}
                                 </Typography.Title>
                                 <Typography.Text style={{
@@ -137,8 +152,8 @@ export const SecureZone = () => {
                                     flexDirection  : 'column',
                                     justifyContent : 'center',
                                 }}
-                                span={12}>
-                                <Typography.Title level={2}>
+                                span={9}>
+                                <Typography.Title level={1}>
                                     {t('sections.products.0.tagline.1')}
                                 </Typography.Title>
                                 <Typography.Text style={{
@@ -147,10 +162,10 @@ export const SecureZone = () => {
                                     {t('sections.products.0.summary.1')}
                                 </Typography.Text>
                             </Col>
-                            <Col span={12}>
+                            <Col span={15}>
                                 <div style={{
-                                    width              : 450,
-                                    height             : 450,
+                                    width              : 550,
+                                    height             : 550,
                                     marginLeft         : 'auto',
                                     marginRight        : 0,
                                     backgroundImage    : 'url("../kutan-ural-MZPwImQUDM0-unsplash.jpg")',
@@ -163,10 +178,10 @@ export const SecureZone = () => {
                             marginTop    : 24,
                             marginBottom : 96,
                         }}>
-                            <Col span={12}>
+                            <Col span={15}>
                                 <div style={{
-                                    width              : 450,
-                                    height             : 450,
+                                    width              : 550,
+                                    height             : 550,
                                     backgroundImage    : 'url("../possessed-photography-zbLW0FG8XU8-unsplash.jpg")',
                                     backgroundSize     : 'cover',
                                     backgroundPosition : 'center',
@@ -179,8 +194,8 @@ export const SecureZone = () => {
                                     flexDirection  : 'column',
                                     justifyContent : 'center',
                                 }}
-                                span={12}>
-                                <Typography.Title level={2}>
+                                span={9}>
+                                <Typography.Title level={1}>
                                     {t('sections.products.0.tagline.2')}
                                 </Typography.Title>
                                 <Typography.Text style={{
@@ -219,13 +234,13 @@ export const SecureZone = () => {
                                         returnObjects : true,
                                     }) as string[]).map(plan => (
                                         <th
-                                            key={plan }
+                                            key={plan}
                                             scope='col'>
                                             <Typography.Title
                                                 style={{
                                                     fontWeight : 'bold',
                                                 }}
-                                                level={4}>
+                                                level={2}>
                                                 {plan}
                                             </Typography.Title>
                                         </th>
@@ -258,19 +273,19 @@ export const SecureZone = () => {
                                         {t('label.upgrade.plans.price')}
                                     </th>
                                     <td style={{
-                                        fontSize   : '2rem',
+                                        fontSize   : '2.5rem',
                                         fontWeight : 'bold',
                                     }}>
                                         {t('label.upgrade.plans.0.price')}
                                     </td>
                                     <td style={{
-                                        fontSize   : '2rem',
+                                        fontSize   : '2.5rem',
                                         fontWeight : 'bold',
                                     }}>
                                         {t('label.upgrade.plans.1.price')}
                                     </td>
                                     <td style={{
-                                        fontSize   : '2rem',
+                                        fontSize   : '2.5rem',
                                         fontWeight : 'bold',
                                     }}>
                                         {t('label.upgrade.plans.2.price')}
@@ -382,12 +397,12 @@ export const SecureZone = () => {
                                 </tr>
                                 <tr>
                                     <th
-                                        style={ {
+                                        style={{
                                             textAlign : 'end',
-                                        } }
+                                        }}
                                         scope='row'>
                                         <InfoText
-                                            title={ t('label.upgrade.rich_notifications_tooltip') }>{ t('label.upgrade.rich_notifications') }</InfoText>
+                                            title={t('label.upgrade.rich_notifications_tooltip')}>{t('label.upgrade.rich_notifications')}</InfoText>
                                     </th>
                                     <td>
                                         <CloseOutlined style={{
@@ -418,7 +433,7 @@ export const SecureZone = () => {
                                     }) as string[]).map((option, index) => (
                                         <td
                                             key={index}>
-                                            { option }
+                                            {option}
                                         </td>
                                     ))}
                                 </tr>
@@ -426,6 +441,9 @@ export const SecureZone = () => {
                                     <td />
                                     <td>
                                         <Button
+                                            style={{
+                                                backgroundColor : 'rgb(60, 74, 22)',
+                                            }}
                                             size='large'
                                             type='primary'
                                             onClick={handleDownload}>
@@ -434,6 +452,9 @@ export const SecureZone = () => {
                                     </td>
                                     <td>
                                         <Button
+                                            style={{
+                                                backgroundColor : 'rgb(60, 74, 22)',
+                                            }}
                                             size='large'
                                             type='primary'
                                             onClick={handleDownload}>
@@ -442,6 +463,9 @@ export const SecureZone = () => {
                                     </td>
                                     <td>
                                         <Button
+                                            style={{
+                                                backgroundColor : 'rgb(60, 74, 22)',
+                                            }}
                                             size='large'
                                             type='primary'
                                             onClick={handleDownload}>