diff --git a/.env b/.env
index 5340f29..a302198 100644
--- a/.env
+++ b/.env
@@ -2,16 +2,17 @@
 # For others consider to use .env.local
 
 # Disable google analytics when running app in dev mode
-NEXT_PUBLIC_DISABLE_GA_IN_DEV_MODE=true
+DISABLE_GA_IN_DEV_MODE=true
 
-NEXT_PUBLIC_INSTAGRAM_ADDRESS="https://www.instagram.com/salsavivayerevan/"
-NEXT_PUBLIC_FACEBOOK_ADDRESS="https://www.facebook.com/SalsaVivaYerevan/"
-NEXT_PUBLIC_WHATSAPP_ADDRESS="https://wa.me/37443108588"
-NEXT_PUBLIC_TELEGRAM_ADDRESS="https://t.me/SV_Yerevan"
-NEXT_PUBLIC_CONTACT_EMAIL="sv.yerevan@gmail.com"
-NEXT_PUBLIC_CONTACT_PHONE="+374 431 085 88"
-
-NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK="https://shorturl.at/gsuK5"
-NEXT_PUBLIC_LOCATION_ADDRESS_TEXT=" 41, 4 Abovyan St, Yerevan 0009"
+# Socials
+INSTAGRAM_ADDRESS="https://www.instagram.com/salsavivayerevan/"
+FACEBOOK_ADDRESS="https://www.facebook.com/SalsaVivaYerevan/"
+WHATSAPP_ADDRESS="https://wa.me/37443108588"
+TELEGRAM_ADDRESS="https://t.me/SV_Yerevan"
+CONTACT_EMAIL="sv.yerevan@gmail.com"
+CONTACT_PHONE="+374 431 085 88"
+LOCATION_GOOGLE_MAPS_LINK="https://shorturl.at/gsuK5"
+LOCATION_ADDRESS_TEXT=" 41, 4 Abovyan St, Yerevan 0009"
 
+# Base path to load assets, used in production on github pages
 BASE_PATH="/salsaviva"
diff --git a/.env.sample b/.env.sample
index 84021a4..fcad5dc 100644
--- a/.env.sample
+++ b/.env.sample
@@ -2,7 +2,12 @@
 # Copy contents of this file to .env.local
 # Replace values with your own
 
-NEXT_PUBLIC_GA_TRACKING_ID=""
-NEXT_PUBLIC_HOTJAR_ID=""
-NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION=""
-NEXT_PUBLIC_FORMSPREE_ID=""
+# Google analytics tracking id
+GA_TRACKING_ID=""
+
+# Hotjar id and version
+HOTJAR_ID=""
+HOTJAR_SNIPPET_VERSION=""
+
+# Fromspree id to send form data
+FORMSPREE_ID=""
diff --git a/.eslintrc.json b/.eslintrc.json
index a0552bd..b0f6e70 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -57,7 +57,8 @@
         "newlines-between": "never",
         "warnOnUnassignedImports": true
       }
-    ]
+    ],
+    "no-duplicate-imports": 1
   },
   "overrides": [
     {
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 4d697d2..3591984 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -10,11 +10,6 @@ on:
         description: 'Inject public path'
         required: false
         default: ''
-      branch:
-        type: string
-        description: 'Branch to build'
-        required: true
-        default: 'master'
 
 jobs:
   build:
@@ -23,8 +18,6 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
-        with:
-          ref: ${{ github.event.inputs.branch }}
 
       - name: Setup Nodejs
         uses: actions/setup-node@v3
@@ -36,17 +29,18 @@ jobs:
           npm pkg delete scripts.prepare
           npm ci
 
-      - name: Make envfile
-        uses: SpicyPizza/create-envfile@v2.0
-        with:
-            envkey_NEXT_PUBLIC_GA_TRACKING_ID: "${{ secrets.NEXT_PUBLIC_GA_TRACKING_ID }}"
-            envkey_NEXT_PUBLIC_FORMSPREE_ID: "${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }}"
-            envkey_NEXT_PUBLIC_HOTJAR_ID: ${{ secrets.NEXT_PUBLIC_HOTJAR_ID }}
-            envkey_NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION: ${{ secrets.NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION }}
-            envkey_PUBLIC_PATH: ${{ github.event.inputs.public_path }}
-            directory: '.'
-            file_name: .env.local
-            fail_on_empty: false
+      - name: Setup envfile
+        run: |
+          config='
+            PUBLIC_PATH = "${{ github.event.inputs.public_path }}""
+
+            GA_TRACKING_ID = "${{ secrets.GA_TRACKING_ID }}"
+            FORMSPREE_ID = "${{ secrets.FORMSPREE_ID }}"
+            HOTJAR_ID = "${{ secrets.HOTJAR_ID }}"
+            HOTJAR_SNIPPET_VERSION = "${{ secrets.HOTJAR_SNIPPET_VERSION }}"
+          '
+          echo "$config" > env.production
+          echo env.production
 
       - name: Lint
         run: |
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index a1c6e9c..c207f8b 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -42,12 +42,12 @@ jobs:
       - name: Deploy
         uses: JamesIves/github-pages-deploy-action@3.6.2
         with:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          BRANCH: gh-pages
-          FOLDER: out
+          token: ${{ secrets.GITHUB_TOKEN }}
+          branch: gh-pages
+          folder: out
           CLEAN: true
-          TARGET_FOLDER: .
-          GIT_CONFIG_NAME: ${{ github.actor }}
-          GIT_CONFIG_EMAIL: ${{ github.actor }}@users.noreply.github.com
-          COMMIT_MESSAGE: Deploy from commit ${{ github.sha }}
+          target-folder: .
+          git-config-name: ${{ github.actor }}
+          git-config-email: ${{ github.actor }}@users.noreply.github.com
+          commit-message: Deploy from commit ${{ github.sha }}
 
diff --git a/.husky/pre-commit b/.husky/pre-commit
index d24fdfc..cf0c46b 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1,4 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-npx lint-staged
+npx --no-install lint-staged
diff --git a/app/env.mjs b/app/env.mjs
index be97ead..d53d70b 100644
--- a/app/env.mjs
+++ b/app/env.mjs
@@ -1,36 +1,44 @@
 import {createEnv} from '@t3-oss/env-nextjs';
 import {z} from 'zod';
 
+/**
+ * Checks if a string is not empty.
+ */
 const notEmptyString = z.string().min(1);
-const number = z
-  .string()
-  .refine(v => !Number.isNaN(Number(v)))
+/**
+ * Checks if a value is a number.
+ */
+const number = notEmptyString
+  .refine(v => {
+    return !isNaN(Number(v)) || !isNaN(Number(v.replace(/"'/g, '')));
+  })
   .transform(Number);
+/**
+ * Checks if a value is a boolean.
+ */
 const boolean = z
   .string()
   .refine(v => v === 'true' || v === 'false' || v === '')
   .transform(value => value === 'true');
 
-const server = {};
-
-const client = {
-  NEXT_PUBLIC_GA_TRACKING_ID: notEmptyString,
-  NEXT_PUBLIC_FORMSPREE_ID: notEmptyString,
-  NEXT_PUBLIC_DISABLE_GA_IN_DEV_MODE: boolean,
-  NEXT_PUBLIC_INSTAGRAM_ADDRESS: notEmptyString.url(),
-  NEXT_PUBLIC_FACEBOOK_ADDRESS: notEmptyString.url(),
-  NEXT_PUBLIC_WHATSAPP_ADDRESS: notEmptyString.url(),
-  NEXT_PUBLIC_TELEGRAM_ADDRESS: notEmptyString.url(),
-  NEXT_PUBLIC_CONTACT_EMAIL: notEmptyString.email(),
-  NEXT_PUBLIC_CONTACT_PHONE: notEmptyString,
-  NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK: notEmptyString.url(),
-  NEXT_PUBLIC_LOCATION_ADDRESS_TEXT: notEmptyString,
-  NEXT_PUBLIC_GA_TRACKING_ID: notEmptyString,
-  NEXT_PUBLIC_HOTJAR_ID: notEmptyString,
-  NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION: number,
-  NEXT_PUBLIC_FORMSPREE_ID: notEmptyString,
+const server = {
+  INSTAGRAM_ADDRESS: notEmptyString.url(),
+  FACEBOOK_ADDRESS: notEmptyString.url(),
+  WHATSAPP_ADDRESS: notEmptyString.url(),
+  TELEGRAM_ADDRESS: notEmptyString.url(),
+  DISABLE_GA_IN_DEV_MODE: boolean,
+  GA_TRACKING_ID: notEmptyString,
+  HOTJAR_ID: notEmptyString,
+  HOTJAR_SNIPPET_VERSION: number,
+  FORMSPREE_ID: notEmptyString,
+  CONTACT_EMAIL: notEmptyString.email(),
+  CONTACT_PHONE: notEmptyString,
+  LOCATION_GOOGLE_MAPS_LINK: notEmptyString.url(),
+  LOCATION_ADDRESS_TEXT: notEmptyString,
 };
 
+const client = {};
+
 const shared = {
   NODE_ENV: z.enum(['development', 'production']),
 };
@@ -39,20 +47,20 @@ export const env = createEnv({
   server,
   client,
   shared,
-  experimental__runtimeEnv: {
+  runtimeEnv: {
     NODE_ENV: process.env.NODE_ENV,
-    NEXT_PUBLIC_GA_TRACKING_ID: process.env.NEXT_PUBLIC_GA_TRACKING_ID,
-    NEXT_PUBLIC_FORMSPREE_ID: process.env.NEXT_PUBLIC_FORMSPREE_ID,
-    NEXT_PUBLIC_DISABLE_GA_IN_DEV_MODE: process.env.NEXT_PUBLIC_DISABLE_GA_IN_DEV_MODE,
-    NEXT_PUBLIC_INSTAGRAM_ADDRESS: process.env.NEXT_PUBLIC_INSTAGRAM_ADDRESS,
-    NEXT_PUBLIC_FACEBOOK_ADDRESS: process.env.NEXT_PUBLIC_FACEBOOK_ADDRESS,
-    NEXT_PUBLIC_WHATSAPP_ADDRESS: process.env.NEXT_PUBLIC_WHATSAPP_ADDRESS,
-    NEXT_PUBLIC_TELEGRAM_ADDRESS: process.env.NEXT_PUBLIC_TELEGRAM_ADDRESS,
-    NEXT_PUBLIC_CONTACT_EMAIL: process.env.NEXT_PUBLIC_CONTACT_EMAIL,
-    NEXT_PUBLIC_CONTACT_PHONE: process.env.NEXT_PUBLIC_CONTACT_PHONE,
-    NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK: process.env.NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK,
-    NEXT_PUBLIC_LOCATION_ADDRESS_TEXT: process.env.NEXT_PUBLIC_LOCATION_ADDRESS_TEXT,
-    NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION: process.env.NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION,
-    NEXT_PUBLIC_HOTJAR_ID: process.env.NEXT_PUBLIC_HOTJAR_ID,
+    INSTAGRAM_ADDRESS: process.env.INSTAGRAM_ADDRESS,
+    FACEBOOK_ADDRESS: process.env.FACEBOOK_ADDRESS,
+    WHATSAPP_ADDRESS: process.env.WHATSAPP_ADDRESS,
+    TELEGRAM_ADDRESS: process.env.TELEGRAM_ADDRESS,
+    DISABLE_GA_IN_DEV_MODE: process.env.DISABLE_GA_IN_DEV_MODE,
+    GA_TRACKING_ID: process.env.GA_TRACKING_ID,
+    HOTJAR_ID: process.env.HOTJAR_ID,
+    HOTJAR_SNIPPET_VERSION: process.env.HOTJAR_SNIPPET_VERSION,
+    FORMSPREE_ID: process.env.FORMSPREE_ID,
+    CONTACT_EMAIL: process.env.CONTACT_EMAIL,
+    CONTACT_PHONE: process.env.CONTACT_PHONE,
+    LOCATION_GOOGLE_MAPS_LINK: process.env.LOCATION_GOOGLE_MAPS_LINK,
+    LOCATION_ADDRESS_TEXT: process.env.LOCATION_ADDRESS_TEXT,
   },
 });
diff --git a/app/layout.tsx b/app/layout.tsx
index 952ce6f..d288129 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,12 +1,15 @@
 import clsx from 'clsx';
 import '@/lib/fontawesome/configure';
 import Footer from '@/components/shared/Footer/Footer';
-import WithGtag from '@/lib/gtag/WithGtag';
+import WithGtagScript from '@/lib/gtag/WithGtagScript';
 import CustomCursor from '@/lib/customCursor/CustomCursor';
 import WebVitals from '@/components/shared/WebVitals/WebVitals';
+import WithHotjarScript from '@/lib/hotjar/WithHotjarScript';
+import {LocationChangeTracker} from '@/lib/gtag/LocationChangeTracker';
 import meta from './metadata';
 import viewportData from './viewport';
 import {kumbhSans, robotoMono} from './fonts';
+import {env} from './env.mjs';
 import './styles.css';
 
 export const metadata = meta;
@@ -33,12 +36,15 @@ const mainCn = clsx('flex', 'flex-col', 'items-center', 'justify-start', 'grow')
  * @returns Global layout.
  */
 export default function RootLayout({children}: {children: React.ReactNode}) {
+  const {GA_TRACKING_ID} = env;
   return (
     <html lang="en">
       <body className={bodyCn}>
-        <WithGtag />
+        <WithGtagScript />
+        <WithHotjarScript />
         <CustomCursor />
         <WebVitals />
+        <LocationChangeTracker trackingId={GA_TRACKING_ID} />
         <main className={mainCn}>{children}</main>
         <Footer />
       </body>
diff --git a/app/page.tsx b/app/page.tsx
index 732fbc2..be31eed 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -5,7 +5,7 @@ import CATLink from '@/components/shared/CATLink/CATLink';
 import SocialIcons from '@/components/shared/SocialIcons/SocialIcons';
 
 const containerCn = clsx('relative', 'z-10', 'flex', 'flex-col', 'items-center', 'grow');
-const titleCn = clsx('font-light', 'text-8xl', 'mt-24');
+const titleCn = clsx('font-light', 'text-8xl', 'mt-24', 'text-center');
 const subtitleCn = clsx('text-1.5xl', 'font-light', 'tracking-widest', 'text-center');
 const titleContainerCn = clsx('font-sans', 'select-none');
 const exploreCn = clsx('mt-auto');
diff --git a/app/sitemap.ts b/app/sitemap.ts
index 80473a2..a9a0c16 100644
--- a/app/sitemap.ts
+++ b/app/sitemap.ts
@@ -1,30 +1,25 @@
+import fs from 'fs';
+import {default as pathModule} from 'node:path';
 import {MetadataRoute} from 'next';
 import {origin} from './origin';
 
+// eslint-disable-next-line jsdoc/require-jsdoc
+function getDirectories(path: string) {
+  return fs.readdirSync(path).filter(function (file) {
+    return fs.statSync(pathModule.join(path, file)).isDirectory();
+  });
+}
+
+const pageFolders = getDirectories(process.cwd() + '/app');
+
 /**
  * @returns Sitemap template.
  */
 export default function sitemap(): MetadataRoute.Sitemap {
-  return [
-    {
-      url: origin,
-      lastModified: new Date(),
-    },
-    {
-      url: `${origin}/about`,
-      lastModified: new Date(),
-    },
-    {
-      url: `${origin}/gallery`,
-      lastModified: new Date(),
-    },
-    {
-      url: `${origin}/contact`,
-      lastModified: new Date(),
-    },
-    {
-      url: `${origin}/teachers`,
+  return pageFolders.map(folder => {
+    return {
+      url: `${origin}/${folder}`,
       lastModified: new Date(),
-    },
-  ];
+    };
+  });
 }
diff --git a/app/template.tsx b/app/template.tsx
index 007a65d..802309a 100644
--- a/app/template.tsx
+++ b/app/template.tsx
@@ -1,7 +1,6 @@
 'use client';
 
 import {LazyMotion} from 'framer-motion';
-import {LocationChangeTracker} from '@/lib/gtag/LocationChangeTracker';
 import useDynamicFavicon from '@/lib/dynamicFavicon/useDynamicFavicon';
 import TopMenu from '@/components/shared/TopMenu/TopMenu';
 import {loadFeatures} from '@/lib/framerMotion/loadFeatures';
@@ -16,7 +15,6 @@ export default function Template({children}: {children: React.ReactNode}) {
 
   return (
     <LazyMotion features={loadFeatures}>
-      <LocationChangeTracker />
       <TopMenu />
       <ScrollToTopButton
         bottom={50}
diff --git a/components/pages/Contact/Form/Form.tsx b/components/pages/Contact/Form/Form.tsx
index 3f76963..84adf2d 100644
--- a/components/pages/Contact/Form/Form.tsx
+++ b/components/pages/Contact/Form/Form.tsx
@@ -21,7 +21,7 @@ const initialValues = {
   message: '',
 } satisfies ContactFormData;
 
-const {NEXT_PUBLIC_FORMSPREE_ID} = env;
+const {FORMSPREE_ID} = env;
 
 /**
  * @param {FormProps} props Props.
@@ -30,7 +30,7 @@ const {NEXT_PUBLIC_FORMSPREE_ID} = env;
 export default function Form({onSubmit: onSuccessSubmit, onErrorSubmit}: FormProps) {
   const mottoCn = 'text-center text-gray-300 mt-16';
   const btnCn = 'mt-8';
-  const [{status}, submit] = useFormspree<ContactFormData>(NEXT_PUBLIC_FORMSPREE_ID!);
+  const [{status}, submit] = useFormspree<ContactFormData>(FORMSPREE_ID!);
   // eslint-disable-next-line jsdoc/require-jsdoc
   const onSubmit = async (values: ContactFormData) => {
     try {
diff --git a/components/shared/Footer/Location.tsx b/components/shared/Footer/Location.tsx
index 8fa69b9..cd86c88 100644
--- a/components/shared/Footer/Location.tsx
+++ b/components/shared/Footer/Location.tsx
@@ -3,7 +3,7 @@ import {memo} from 'react';
 import {env} from '@/app/env.mjs';
 import UniversalLink from '../UniversalLink/UniversalLink';
 
-const {NEXT_PUBLIC_LOCATION_ADDRESS_TEXT, NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK} = env;
+const {LOCATION_ADDRESS_TEXT, LOCATION_GOOGLE_MAPS_LINK} = env;
 
 const containerCn = clsx('flex', 'justify-center', 'flex-nowrap', 'gap-4');
 const addressCn = clsx('not-italic');
@@ -16,11 +16,11 @@ function Location() {
   return (
     <div className={containerCn}>
       <UniversalLink
-        href={NEXT_PUBLIC_LOCATION_GOOGLE_MAPS_LINK ?? ''}
+        href={LOCATION_GOOGLE_MAPS_LINK ?? ''}
         target="_blank"
         className={linkCn}
       >
-        <address className={addressCn}>{NEXT_PUBLIC_LOCATION_ADDRESS_TEXT}</address>
+        <address className={addressCn}>{LOCATION_ADDRESS_TEXT}</address>
       </UniversalLink>
     </div>
   );
diff --git a/components/shared/Footer/Mail.tsx b/components/shared/Footer/Mail.tsx
index 5abbc76..e998f1a 100644
--- a/components/shared/Footer/Mail.tsx
+++ b/components/shared/Footer/Mail.tsx
@@ -3,7 +3,7 @@ import {memo} from 'react';
 import {env} from '@/app/env.mjs';
 import UniversalLink from '../UniversalLink/UniversalLink';
 
-const {NEXT_PUBLIC_CONTACT_EMAIL} = env;
+const {CONTACT_EMAIL} = env;
 
 const containerCn = clsx('flex', 'justify-center');
 const anchorCn = clsx('animated-link');
@@ -16,9 +16,9 @@ function Mail() {
     <div className={containerCn}>
       <UniversalLink
         className={anchorCn}
-        href={`mailto:${NEXT_PUBLIC_CONTACT_EMAIL}`}
+        href={`mailto:${CONTACT_EMAIL}`}
       >
-        {NEXT_PUBLIC_CONTACT_EMAIL}
+        {CONTACT_EMAIL}
       </UniversalLink>
     </div>
   );
diff --git a/components/shared/Footer/Phone.tsx b/components/shared/Footer/Phone.tsx
index 593fbee..1aaa270 100644
--- a/components/shared/Footer/Phone.tsx
+++ b/components/shared/Footer/Phone.tsx
@@ -2,7 +2,7 @@ import clsx from 'clsx';
 import {memo} from 'react';
 import {env} from '@/app/env.mjs';
 
-const {NEXT_PUBLIC_CONTACT_PHONE} = env;
+const {CONTACT_PHONE} = env;
 
 const containerCn = clsx('flex', 'justify-center');
 const telCn = clsx('animated-link', 'tracking-wider');
@@ -15,9 +15,9 @@ function Phone() {
     <div className={containerCn}>
       <a
         className={telCn}
-        href={`tel:${NEXT_PUBLIC_CONTACT_PHONE}`}
+        href={`tel:${CONTACT_PHONE}`}
       >
-        {NEXT_PUBLIC_CONTACT_PHONE}
+        {CONTACT_PHONE}
       </a>
     </div>
   );
diff --git a/components/shared/SocialIcons/SocialIcons.tsx b/components/shared/SocialIcons/SocialIcons.tsx
index 6ff5c90..274b6c2 100644
--- a/components/shared/SocialIcons/SocialIcons.tsx
+++ b/components/shared/SocialIcons/SocialIcons.tsx
@@ -1,13 +1,12 @@
 'use client';
 
-import {FontAwesomeIcon, FontAwesomeIconProps} from '@fortawesome/react-fontawesome';
+import {FontAwesomeIconProps} from '@fortawesome/react-fontawesome';
 import clsx from 'clsx';
 import {twMerge} from 'tailwind-merge';
 import {memo} from 'react';
 import {m} from 'framer-motion';
 import iconsConfig from './iconsConfig';
 import AppearInViewport from '../AppearInViewport/AppearInViewport';
-import UniversalLink from '../UniversalLink/UniversalLink';
 
 /**
  * Direction.
@@ -34,7 +33,6 @@ const iconsCn = (direction: SocialIconsProps['direction']) =>
     'select-none',
     'z-10',
   );
-const iconCn = clsx('transition-transform hover:-translate-y-0.5 hover:scale-105');
 
 const variants = {
   // eslint-disable-next-line jsdoc/require-jsdoc
@@ -65,22 +63,13 @@ function SocialIcons({iconSize, direction = 'row', className}: SocialIconsProps)
       className={twMerge(iconsCn(direction), className)}
       transition={{delay: 0.6, staggerChildren: 0.2, delayChildren: 0.5}}
     >
-      {iconsConfig.map(({href, target, className, ...rest}) => (
+      {iconsConfig.map(({icon}, idx) => (
         <m.div
-          key={href}
+          key={idx}
           variants={variants}
           custom={direction}
         >
-          <UniversalLink
-            href={href}
-            target={target}
-          >
-            <FontAwesomeIcon
-              className={twMerge(iconCn, className)}
-              size={iconSize}
-              {...rest}
-            />
-          </UniversalLink>
+          {icon}
         </m.div>
       ))}
     </AppearInViewport>
diff --git a/components/shared/SocialIcons/iconsConfig.ts b/components/shared/SocialIcons/iconsConfig.ts
deleted file mode 100644
index 089e662..0000000
--- a/components/shared/SocialIcons/iconsConfig.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import {faFacebook, faInstagram, faTelegram, faWhatsapp} from '@fortawesome/free-brands-svg-icons';
-import {FontAwesomeIconProps} from '@fortawesome/react-fontawesome';
-import {env} from '@/app/env.mjs';
-
-/**
- * Icon configuration.
- */
-type IconConfig = {
-  href: string;
-} & FontAwesomeIconProps;
-
-const {
-  NEXT_PUBLIC_FACEBOOK_ADDRESS,
-  NEXT_PUBLIC_INSTAGRAM_ADDRESS,
-  NEXT_PUBLIC_TELEGRAM_ADDRESS,
-  NEXT_PUBLIC_WHATSAPP_ADDRESS,
-} = env;
-
-/**
- * Social icons config.
- */
-const iconsConfig: IconConfig[] = [
-  {
-    icon: faInstagram,
-    href: NEXT_PUBLIC_INSTAGRAM_ADDRESS ?? '',
-    target: '_blank',
-  },
-  {
-    icon: faTelegram,
-    href: NEXT_PUBLIC_TELEGRAM_ADDRESS ?? '',
-    target: '_blank',
-  },
-  {
-    icon: faFacebook,
-    href: NEXT_PUBLIC_FACEBOOK_ADDRESS ?? '',
-    target: '_blank',
-  },
-  {
-    icon: faWhatsapp,
-    href: NEXT_PUBLIC_WHATSAPP_ADDRESS ?? '',
-    target: '_blank',
-  },
-];
-
-export default iconsConfig;
diff --git a/components/shared/SocialIcons/iconsConfig.tsx b/components/shared/SocialIcons/iconsConfig.tsx
new file mode 100644
index 0000000..1dc4698
--- /dev/null
+++ b/components/shared/SocialIcons/iconsConfig.tsx
@@ -0,0 +1,77 @@
+import {faFacebook, faInstagram, faTelegram, faWhatsapp} from '@fortawesome/free-brands-svg-icons';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import clsx from 'clsx';
+import {ReactNode} from 'react';
+import {env} from '@/app/env.mjs';
+import UniversalLink from '../UniversalLink/UniversalLink';
+
+/**
+ * Icon configuration.
+ */
+type IconConfig = {
+  icon: ReactNode;
+};
+
+const {FACEBOOK_ADDRESS, INSTAGRAM_ADDRESS, TELEGRAM_ADDRESS, WHATSAPP_ADDRESS} = env;
+
+const iconCn = clsx('transition-transform hover:-translate-y-0.5 hover:scale-105');
+
+/**
+ * Social icons config.
+ */
+const iconsConfig: IconConfig[] = [
+  {
+    icon: (
+      <UniversalLink
+        href={INSTAGRAM_ADDRESS ?? ''}
+        target="_blank"
+      >
+        <FontAwesomeIcon
+          className={iconCn}
+          icon={faInstagram}
+        />
+      </UniversalLink>
+    ),
+  },
+  {
+    icon: (
+      <UniversalLink
+        href={TELEGRAM_ADDRESS ?? ''}
+        target="_blank"
+      >
+        <FontAwesomeIcon
+          className={iconCn}
+          icon={faTelegram}
+        />
+      </UniversalLink>
+    ),
+  },
+  {
+    icon: (
+      <UniversalLink
+        href={FACEBOOK_ADDRESS ?? ''}
+        target="_blank"
+      >
+        <FontAwesomeIcon
+          className={iconCn}
+          icon={faFacebook}
+        />
+      </UniversalLink>
+    ),
+  },
+  {
+    icon: (
+      <UniversalLink
+        href={WHATSAPP_ADDRESS ?? ''}
+        target="_blank"
+      >
+        <FontAwesomeIcon
+          className={iconCn}
+          icon={faWhatsapp}
+        />
+      </UniversalLink>
+    ),
+  },
+];
+
+export default iconsConfig;
diff --git a/components/shared/TopMenu/TopMenu.tsx b/components/shared/TopMenu/TopMenu.tsx
index 964a76c..6cef2c5 100644
--- a/components/shared/TopMenu/TopMenu.tsx
+++ b/components/shared/TopMenu/TopMenu.tsx
@@ -15,7 +15,6 @@ const variants = {
   },
 };
 
-const linkCn = clsx('animated-link');
 const socialLiksListCn = clsx('flex', 'gap-8', 'mt-auto', 'mb-16');
 const socialLinkMenuItem = clsx('text-xs');
 const itemsListCn = clsx('mt-24');
@@ -39,22 +38,17 @@ export default function TopMenu() {
           <Menu.Item className={homeMenuItem}>
             <UniversalLink
               href="/"
-              className={linkCn}
+              className="animated-link"
             >
               SALSAVIVA
             </UniversalLink>
           </Menu.Item>
-          {menuItemsConfig.map(({href, text, bgImgPath}, idx) => (
+          {menuItemsConfig.map(({icon, bgImgPath}, idx) => (
             <Menu.Item
               key={idx}
               bgImgPath={bgImgPath}
             >
-              <UniversalLink
-                href={href}
-                className={linkCn}
-              >
-                {text}
-              </UniversalLink>
+              {icon}
             </Menu.Item>
           ))}
         </m.ul>
@@ -62,18 +56,12 @@ export default function TopMenu() {
           variants={variants}
           className={socialLiksListCn}
         >
-          {socialLinksConfig.map(({href, text}, idx) => (
+          {socialLinksConfig.map(({link}, idx) => (
             <Menu.Item
               key={idx}
               className={socialLinkMenuItem}
             >
-              <UniversalLink
-                href={href}
-                className={linkCn}
-                target="_blank"
-              >
-                {text.toUpperCase()}
-              </UniversalLink>
+              {link}
             </Menu.Item>
           ))}
         </m.ul>
diff --git a/components/shared/TopMenu/topMenuCongif.ts b/components/shared/TopMenu/topMenuCongif.ts
deleted file mode 100644
index bd6f416..0000000
--- a/components/shared/TopMenu/topMenuCongif.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-import {env} from '@/app/env.mjs';
-
-const {
-  NEXT_PUBLIC_FACEBOOK_ADDRESS,
-  NEXT_PUBLIC_INSTAGRAM_ADDRESS,
-  NEXT_PUBLIC_TELEGRAM_ADDRESS,
-  NEXT_PUBLIC_WHATSAPP_ADDRESS,
-} = env;
-
-/**
- * Top menu configuration.
- */
-const menuItemsConfig = [
-  {
-    href: '/about',
-    text: 'About',
-    bgImgPath: 'top-menu.0.jpg',
-  },
-  {
-    href: '/gallery',
-    text: 'Gallery',
-    bgImgPath: 'top-menu.1.jpg',
-  },
-  {
-    href: '/teachers',
-    text: 'Teachers',
-    bgImgPath: 'top-menu.2.jpg',
-  },
-  {
-    href: '/contact',
-    text: 'Contact',
-    bgImgPath: 'top-menu.3.jpg',
-  },
-] as const;
-
-const socialLinksConfig = [
-  {
-    href: NEXT_PUBLIC_INSTAGRAM_ADDRESS ?? '',
-    text: 'Instagram',
-  },
-  {
-    href: NEXT_PUBLIC_TELEGRAM_ADDRESS ?? '',
-    text: 'Telegram',
-  },
-  {
-    href: NEXT_PUBLIC_FACEBOOK_ADDRESS ?? '',
-    text: 'Facebook',
-  },
-  {
-    href: NEXT_PUBLIC_WHATSAPP_ADDRESS ?? '',
-    text: 'Whatsapp',
-  },
-] as const;
-
-export {menuItemsConfig, socialLinksConfig};
diff --git a/components/shared/TopMenu/topMenuCongif.tsx b/components/shared/TopMenu/topMenuCongif.tsx
new file mode 100644
index 0000000..ca0bfe8
--- /dev/null
+++ b/components/shared/TopMenu/topMenuCongif.tsx
@@ -0,0 +1,118 @@
+import clsx from 'clsx';
+import {env} from '@/app/env.mjs';
+import UniversalLink from '../UniversalLink/UniversalLink';
+
+const {FACEBOOK_ADDRESS, INSTAGRAM_ADDRESS, TELEGRAM_ADDRESS, WHATSAPP_ADDRESS} = env;
+
+const linkCn = clsx('animated-link');
+
+/**
+ * Top menu configuration.
+ */
+const menuItemsConfig = [
+  {
+    href: '/about',
+    text: 'About',
+    bgImgPath: 'top-menu.0.jpg',
+    icon: (
+      <UniversalLink
+        href="/about"
+        className={linkCn}
+        target="_blank"
+      >
+        ABOUT
+      </UniversalLink>
+    ),
+  },
+  {
+    icon: (
+      <UniversalLink
+        href="/gallery"
+        className={linkCn}
+        target="_blank"
+      >
+        GALLERY
+      </UniversalLink>
+    ),
+    href: '/gallery',
+    text: 'Gallery',
+    bgImgPath: 'top-menu.1.jpg',
+  },
+  {
+    icon: (
+      <UniversalLink
+        href="/teachers"
+        className={linkCn}
+        target="_blank"
+      >
+        TEACHERS
+      </UniversalLink>
+    ),
+    href: '/teachers',
+    text: 'Teachers',
+    bgImgPath: 'top-menu.2.jpg',
+  },
+  {
+    icon: (
+      <UniversalLink
+        href="/contact"
+        className={linkCn}
+        target="_blank"
+      >
+        CONTACT
+      </UniversalLink>
+    ),
+    href: '/contact',
+    text: 'Contact',
+    bgImgPath: 'top-menu.3.jpg',
+  },
+] as const;
+
+const socialLinksConfig = [
+  {
+    link: (
+      <UniversalLink
+        href={INSTAGRAM_ADDRESS}
+        className={linkCn}
+        target="_blank"
+      >
+        INSTAGRAM
+      </UniversalLink>
+    ),
+  },
+  {
+    link: (
+      <UniversalLink
+        href={TELEGRAM_ADDRESS}
+        className={linkCn}
+        target="_blank"
+      >
+        TELEGRAM
+      </UniversalLink>
+    ),
+  },
+  {
+    link: (
+      <UniversalLink
+        href={FACEBOOK_ADDRESS}
+        className={linkCn}
+        target="_blank"
+      >
+        FACEBOOK
+      </UniversalLink>
+    ),
+  },
+  {
+    link: (
+      <UniversalLink
+        href={WHATSAPP_ADDRESS}
+        className={linkCn}
+        target="_blank"
+      >
+        WHATSAPP
+      </UniversalLink>
+    ),
+  },
+] as const;
+
+export {menuItemsConfig, socialLinksConfig};
diff --git a/components/shared/WebVitals/WebVitals.tsx b/components/shared/WebVitals/WebVitals.tsx
index a230650..6824525 100644
--- a/components/shared/WebVitals/WebVitals.tsx
+++ b/components/shared/WebVitals/WebVitals.tsx
@@ -1,7 +1,6 @@
 'use client';
 
 import {useReportWebVitals} from 'next/web-vitals';
-import * as gtag from '@/lib/gtag/gtag';
 
 /**
  * Returns web vitals report.
@@ -11,7 +10,7 @@ export default function WebVitals() {
   useReportWebVitals(metric => {
     const {name, value, id} = metric;
 
-    gtag.event(name, {
+    window.gtag('event', name, {
       event_label: id,
       value: Math.round(name === 'CLS' ? value * 1000 : value),
       non_interaction: true,
diff --git a/lib/gtag/LocationChangeTracker.tsx b/lib/gtag/LocationChangeTracker.tsx
index 672f557..13b34d7 100644
--- a/lib/gtag/LocationChangeTracker.tsx
+++ b/lib/gtag/LocationChangeTracker.tsx
@@ -2,19 +2,28 @@
 
 import {useEffect} from 'react';
 import {usePathname, useSearchParams} from 'next/navigation';
-import * as gtag from './gtag';
 
 /**
+ * Location change tracker props.
+ */
+type LocationChangeTrackerProps = {
+  trackingId: string;
+};
+
+/**
+ * @param {LocationChangeTrackerProps} props Props.
  * @returns React component.
  */
-export function LocationChangeTracker() {
+export function LocationChangeTracker({trackingId}: LocationChangeTrackerProps) {
   const pathname = usePathname();
   const searchParams = useSearchParams();
   const url = pathname + searchParams.toString();
 
   useEffect(() => {
-    gtag.pageview(url);
-  }, [url]);
+    window.gtag('config', trackingId, {
+      page_path: url,
+    });
+  }, [url, trackingId]);
 
   return null;
 }
diff --git a/lib/gtag/WithGtag.tsx b/lib/gtag/WithGtagScript.tsx
similarity index 68%
rename from lib/gtag/WithGtag.tsx
rename to lib/gtag/WithGtagScript.tsx
index 6b66250..70d8f28 100644
--- a/lib/gtag/WithGtag.tsx
+++ b/lib/gtag/WithGtagScript.tsx
@@ -1,22 +1,24 @@
 import {ReactElement} from 'react';
 import Script from 'next/script';
 import {env} from '@/app/env.mjs';
-import * as gtag from './gtag';
 
 /**
  * Injects Gtag script. Supposed to use in root layout.
  * Credits {@link https://stackoverflow.com/questions/60411351/how-to-use-google-analytics-with-next-js-app}.
  * @returns Layout.
  */
-const WithGtag = (): ReactElement => {
-  if (gtag.disableInDevMode && env.NODE_ENV !== 'production') {
+const WithGtagScript = (): ReactElement => {
+  const disableInDevMode = env.DISABLE_GA_IN_DEV_MODE;
+  const {GA_TRACKING_ID} = env;
+
+  if (disableInDevMode && env.NODE_ENV !== 'production') {
     return <></>;
   }
 
   return (
     <>
       <Script
-        src={`https://www.googletagmanager.com/gtag/js?id=${gtag.GA_TRACKING_ID}`}
+        src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
         strategy="afterInteractive"
       />
       <Script
@@ -28,14 +30,14 @@ const WithGtag = (): ReactElement => {
             function gtag(){dataLayer.push(arguments);}
             gtag('js', new Date());
 
-            gtag('config', '${gtag.GA_TRACKING_ID}', {
+            gtag('config', '${GA_TRACKING_ID}', {
               page_path: window.location.pathname,
             });
         `}
       </Script>
       <noscript>
         <iframe
-          src={`https://www.googletagmanager.com/ns.html?id=${gtag.GA_TRACKING_ID}`}
+          src={`https://www.googletagmanager.com/ns.html?id=${GA_TRACKING_ID}`}
           height="0"
           width="0"
           style={{display: 'none', visibility: 'hidden'}}
@@ -46,4 +48,4 @@ const WithGtag = (): ReactElement => {
   );
 };
 
-export default WithGtag;
+export default WithGtagScript;
diff --git a/lib/gtag/gtag.ts b/lib/gtag/gtag.ts
deleted file mode 100644
index 0c3444f..0000000
--- a/lib/gtag/gtag.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import {env} from '@/app/env.mjs';
-
-export const disableInDevMode = env.NEXT_PUBLIC_DISABLE_GA_IN_DEV_MODE;
-export const GA_TRACKING_ID = env.NEXT_PUBLIC_GA_TRACKING_ID;
-
-if (!disableInDevMode && !GA_TRACKING_ID) {
-  throw new Error('NEXT_PUBLIC_GA_TRACKING_ID environment variable should be set.');
-}
-
-/**
- * @param url Url.
- */
-export const pageview = (url: string) => {
-  if (disableInDevMode) {
-    return;
-  }
-
-  window.gtag('config', GA_TRACKING_ID!, {
-    page_path: url,
-  });
-};
-
-/**
- * @param event Event.
- * @param params Params.
- */
-export const event = (
-  event: Gtag.EventNames,
-  params: Pick<Gtag.EventParams, 'event_category' | 'event_label' | 'value'> & Gtag.CustomParams,
-) => {
-  if (disableInDevMode) {
-    return;
-  }
-
-  window.gtag('event', event, params);
-};
diff --git a/lib/hotjar/WithHotjarScript.tsx b/lib/hotjar/WithHotjarScript.tsx
new file mode 100644
index 0000000..529cc82
--- /dev/null
+++ b/lib/hotjar/WithHotjarScript.tsx
@@ -0,0 +1,36 @@
+import Script from 'next/script';
+import {env} from '@/app/env.mjs';
+
+const {NODE_ENV, HOTJAR_ID, HOTJAR_SNIPPET_VERSION} = env;
+
+/**
+ * Hotjar script to embed in the head of the document.
+ * @returns React component.
+ */
+export default function WithHotjarScript() {
+  if (NODE_ENV === 'development') {
+    return <></>;
+  }
+
+  if ([HOTJAR_ID, HOTJAR_SNIPPET_VERSION].some(v => v === undefined)) {
+    return <></>;
+  }
+
+  return (
+    <Script
+      id="hotjar"
+      strategy="afterInteractive"
+    >
+      {`
+        (function(h,o,t,j,a,r){
+          h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+          h._hjSettings={hjid:${HOTJAR_ID},hjsv:${HOTJAR_SNIPPET_VERSION}};
+          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/lib/hotjar/useInitHotjar.ts b/lib/hotjar/useInitHotjar.ts
deleted file mode 100644
index e81e43a..0000000
--- a/lib/hotjar/useInitHotjar.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-'use client';
-
-import {useEffect} from 'react';
-import Hotjar from '@hotjar/browser';
-import {env} from '@/app/env.mjs';
-
-const {NODE_ENV, NEXT_PUBLIC_HOTJAR_ID, NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION} = env;
-
-/**
- * Initialize Hotjar.
- */
-export default function useInitHotjar() {
-  useEffect(() => {
-    if (NODE_ENV !== 'production') {
-      return;
-    }
-
-    if ([NEXT_PUBLIC_HOTJAR_ID, NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION].some(v => v === undefined)) {
-      return;
-    }
-
-    Hotjar.init(Number(NEXT_PUBLIC_HOTJAR_ID), Number(NEXT_PUBLIC_HOTJAR_SNIPPET_VERSION));
-  }, []);
-}
diff --git a/next.config.mjs b/next.config.mjs
index dbf4720..bd34a34 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -8,7 +8,8 @@ const nextConfig = {
   images: {
     unoptimized: true,
   },
-  basePath: process.env.BASE_PATH,
+  basePath: process.env.NODE_ENV === 'production' ? process.env.BASE_PATH : '',
+  assetPrefix: process.env.NODE_ENV === 'production' ? process.env.BASE_PATH : '',
 };
 
 const withAnalyzer = withBundleAnalyzer({
diff --git a/package-lock.json b/package-lock.json
index f5fbf05..32517f7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,6 @@
         "@fortawesome/free-brands-svg-icons": "^6.4.0",
         "@fortawesome/free-solid-svg-icons": "^6.4.0",
         "@fortawesome/react-fontawesome": "^0.2.0",
-        "@hotjar/browser": "^1.0.9",
         "@t3-oss/env-nextjs": "^0.7.0",
         "@tailwindcss/forms": "^0.5.6",
         "@types/node": "20.1.1",
@@ -25,6 +24,7 @@
         "focus-trap-react": "^10.2.3",
         "formik": "^2.4.1",
         "framer-motion": "^10.12.16",
+        "gsap": "^3.12.5",
         "lodash": "^4.17.21",
         "next": "^14.1.1",
         "photoswipe": "^5.3.8",
@@ -320,11 +320,6 @@
         "react": ">=16.3"
       }
     },
-    "node_modules/@hotjar/browser": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@hotjar/browser/-/browser-1.0.9.tgz",
-      "integrity": "sha512-n9akDMod8BLGpYEQCrHwlYWWd63c1HlhUSXNIDfClZtKYXbUjIUOFlNZNNcUxgHTCsi4l2i+SWKsGsO0t93S8w=="
-    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.11.8",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz",
@@ -4832,6 +4827,11 @@
       "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==",
       "dev": true
     },
+    "node_modules/gsap": {
+      "version": "3.12.5",
+      "resolved": "https://registry.npmjs.org/gsap/-/gsap-3.12.5.tgz",
+      "integrity": "sha512-srBfnk4n+Oe/ZnMIOXt3gT605BX9x5+rh/prT2F1SsNJsU1XuMiP0E2aptW481OnonOGACZWBqseH5Z7csHxhQ=="
+    },
     "node_modules/gzip-size": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-6.0.0.tgz",
@@ -10016,11 +10016,6 @@
         "prop-types": "^15.8.1"
       }
     },
-    "@hotjar/browser": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@hotjar/browser/-/browser-1.0.9.tgz",
-      "integrity": "sha512-n9akDMod8BLGpYEQCrHwlYWWd63c1HlhUSXNIDfClZtKYXbUjIUOFlNZNNcUxgHTCsi4l2i+SWKsGsO0t93S8w=="
-    },
     "@humanwhocodes/config-array": {
       "version": "0.11.8",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz",
@@ -13320,6 +13315,11 @@
       "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==",
       "dev": true
     },
+    "gsap": {
+      "version": "3.12.5",
+      "resolved": "https://registry.npmjs.org/gsap/-/gsap-3.12.5.tgz",
+      "integrity": "sha512-srBfnk4n+Oe/ZnMIOXt3gT605BX9x5+rh/prT2F1SsNJsU1XuMiP0E2aptW481OnonOGACZWBqseH5Z7csHxhQ=="
+    },
     "gzip-size": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-6.0.0.tgz",
diff --git a/package.json b/package.json
index c9325d9..8a8633a 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,6 @@
     "@fortawesome/free-brands-svg-icons": "^6.4.0",
     "@fortawesome/free-solid-svg-icons": "^6.4.0",
     "@fortawesome/react-fontawesome": "^0.2.0",
-    "@hotjar/browser": "^1.0.9",
     "@t3-oss/env-nextjs": "^0.7.0",
     "@tailwindcss/forms": "^0.5.6",
     "@types/node": "20.1.1",
@@ -31,6 +30,7 @@
     "focus-trap-react": "^10.2.3",
     "formik": "^2.4.1",
     "framer-motion": "^10.12.16",
+    "gsap": "^3.12.5",
     "lodash": "^4.17.21",
     "next": "^14.1.1",
     "photoswipe": "^5.3.8",