diff --git a/package-lock.json b/package-lock.json index 3aff08b..c263a86 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "axios": "1.13.5", "bootstrap": "^5.3.8", "gsap": "^3.14.2", + "isotope-layout": "^3.0.6", "next": "15.1.6", "react": "19.2.3", "react-countup": "^6.5.3", @@ -1153,6 +1154,7 @@ "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", "license": "MIT", + "peer": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -1251,6 +1253,7 @@ "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz", "integrity": "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==", "license": "MIT", + "peer": true, "dependencies": { "csstype": "^3.2.2" } @@ -1329,6 +1332,7 @@ "integrity": "sha512-IgSWvLobTDOjnaxAfDTIHaECbkNlAlKv2j5SjpB2v7QHKv1FIfjwMy8FsDbVfDX/KjmCmYICcw7uGaXLhtsLNg==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@typescript-eslint/scope-manager": "8.56.0", "@typescript-eslint/types": "8.56.0", @@ -1854,6 +1858,7 @@ "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==", "dev": true, "license": "MIT", + "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -2574,6 +2579,12 @@ "node": ">=0.4.0" } }, + "node_modules/desandro-matches-selector": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/desandro-matches-selector/-/desandro-matches-selector-2.0.2.tgz", + "integrity": "sha512-+1q0nXhdzg1IpIJdMKalUwvvskeKnYyEe3shPRwedNcWtnhEKT3ZxvFjzywHDeGcKViIxTCAoOYQWP1qD7VNyg==", + "license": "MIT" + }, "node_modules/detect-libc": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz", @@ -2810,6 +2821,7 @@ "integrity": "sha512-VmQ+sifHUbI/IcSopBCF/HO3YiHQx/AVd3UVyYL6weuwW+HvON9VYn5l6Zl1WZzPWXPNZrSQpxwkkZ/VuvJZzg==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/regexpp": "^4.12.1", @@ -2983,6 +2995,7 @@ "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@rtsao/scc": "^1.1.0", "array-includes": "^3.1.9", @@ -3215,6 +3228,12 @@ "node": ">=0.10.0" } }, + "node_modules/ev-emitter": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/ev-emitter/-/ev-emitter-1.1.1.tgz", + "integrity": "sha512-ipiDYhdQSCZ4hSbX4rMW+XzNKMD1prg/sTvoVmSLkuQ1MVlwjJQQA+sW8tMYR3BLUr9KjodFV4pvzunvRhd33Q==", + "license": "MIT" + }, "node_modules/fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", @@ -3319,6 +3338,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/fizzy-ui-utils": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/fizzy-ui-utils/-/fizzy-ui-utils-2.0.7.tgz", + "integrity": "sha512-CZXDVXQ1If3/r8s0T+v+qVeMshhfcuq0rqIFgJnrtd+Bu8GmDmqMjntjUePypVtjHXKJ6V4sw9zeyox34n9aCg==", + "license": "MIT", + "dependencies": { + "desandro-matches-selector": "^2.0.0" + } + }, "node_modules/flat-cache": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz", @@ -3479,6 +3507,12 @@ "node": ">= 0.4" } }, + "node_modules/get-size": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/get-size/-/get-size-2.0.3.tgz", + "integrity": "sha512-lXNzT/h/dTjTxRbm9BXb+SGxxzkm97h/PCIKtlN/CBCxxmkkIVV21udumMS93MuVTDX583gqc94v3RjuHmI+2Q==", + "license": "MIT" + }, "node_modules/get-symbol-description": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz", @@ -4165,6 +4199,19 @@ "dev": true, "license": "ISC" }, + "node_modules/isotope-layout": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/isotope-layout/-/isotope-layout-3.0.6.tgz", + "integrity": "sha512-z2ZKablhocXhoNyWwzJPFd7u7FWbYbVJA51Nvsqsod8jH2ExGc1SwDsSWKE54e3PhXzqf2yZPhFSq/c2MR1arw==", + "license": "GPL-3.0", + "dependencies": { + "desandro-matches-selector": "^2.0.0", + "fizzy-ui-utils": "^2.0.4", + "get-size": "^2.0.0", + "masonry-layout": "^4.1.0", + "outlayer": "^2.1.0" + } + }, "node_modules/iterator.prototype": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.5.tgz", @@ -4346,6 +4393,16 @@ "loose-envify": "cli.js" } }, + "node_modules/masonry-layout": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/masonry-layout/-/masonry-layout-4.2.2.tgz", + "integrity": "sha512-iGtAlrpHNyxaR19CvKC3npnEcAwszXoyJiI8ARV2ePi7fmYhIud25MHK8Zx4P0LCC4d3TNO9+rFa1KoK1OEOaA==", + "license": "MIT", + "dependencies": { + "get-size": "^2.0.2", + "outlayer": "^2.1.0" + } + }, "node_modules/math-intrinsics": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz", @@ -4692,6 +4749,17 @@ "node": ">= 0.8.0" } }, + "node_modules/outlayer": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/outlayer/-/outlayer-2.1.1.tgz", + "integrity": "sha512-+GplXsCQ3VrbGujAeHEzP9SXsBmJxzn/YdDSQZL0xqBmAWBmortu2Y9Gwdp9J0bgDQ8/YNIPMoBM13nTwZfAhw==", + "license": "MIT", + "dependencies": { + "ev-emitter": "^1.0.0", + "fizzy-ui-utils": "^2.0.0", + "get-size": "^2.0.2" + } + }, "node_modules/own-keys": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz", @@ -4902,6 +4970,7 @@ "resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz", "integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==", "license": "MIT", + "peer": true, "engines": { "node": ">=0.10.0" } @@ -4936,6 +5005,7 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.3.tgz", "integrity": "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==", "license": "MIT", + "peer": true, "dependencies": { "scheduler": "^0.27.0" }, @@ -5177,6 +5247,7 @@ "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz", "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==", "license": "MIT", + "peer": true, "dependencies": { "chokidar": "^4.0.0", "immutable": "^5.0.2", @@ -5698,6 +5769,7 @@ "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "dev": true, "license": "MIT", + "peer": true, "engines": { "node": ">=12" }, @@ -5860,6 +5932,7 @@ "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==", "dev": true, "license": "Apache-2.0", + "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/package.json b/package.json index 3723901..7e12e5f 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "axios": "1.13.5", "bootstrap": "^5.3.8", "gsap": "^3.14.2", + "isotope-layout": "^3.0.6", "next": "15.1.6", "react": "19.2.3", "react-countup": "^6.5.3", diff --git a/public/assets/css/main.css b/public/assets/css/main.css index 2f11b5a..20acd66 100644 --- a/public/assets/css/main.css +++ b/public/assets/css/main.css @@ -2854,7 +2854,7 @@ ul.footer-contact-info-widget .icon { h1.banner-title { color: #FFF; - font-size: 64px; + font-size: 60px; font-style: normal; font-weight: 700; line-height: 77px; @@ -3117,7 +3117,7 @@ p.banner-text { } h1.banner-title { - font-size: 42px; + font-size: 40px; line-height: 62px; padding: 15px 0; } @@ -3142,7 +3142,7 @@ p.banner-text { } h1.banner-title { - font-size: 32px; + font-size: 30px; line-height: 52px; } @@ -3625,7 +3625,7 @@ p.banner-text { } .cta-1-section .content { - padding: 53px 30px; + padding: 50px 30px; background: #fff; } @@ -4362,22 +4362,12 @@ p.banner-text { /* BRAND CSS START /*----------------------------------------*/ -.brand-section img { - filter: grayscale(1); - opacity: 0.75; -} - @media screen and (max-width: 400px) { .brand-section { text-align: center; } } -.brand-section img:hover { - filter: grayscale(0); - opacity: 1; -} - /*----------------------------------------*/ /* BANNER TWO CSS START /*----------------------------------------*/ diff --git a/public/assets/images/blog/blog-cards/1-card-seo.webp b/public/assets/images/blog/blog-cards/1-card-seo.webp new file mode 100644 index 0000000..7a44363 Binary files /dev/null and b/public/assets/images/blog/blog-cards/1-card-seo.webp differ diff --git a/public/assets/images/blog/blog-cards/1-card.webp b/public/assets/images/blog/blog-cards/1-card.webp new file mode 100644 index 0000000..1f3eef3 Binary files /dev/null and b/public/assets/images/blog/blog-cards/1-card.webp differ diff --git a/public/assets/images/blog/blog-cards/1blog-card.webp b/public/assets/images/blog/blog-cards/1blog-card.webp new file mode 100644 index 0000000..42c4e31 Binary files /dev/null and b/public/assets/images/blog/blog-cards/1blog-card.webp differ diff --git a/public/assets/images/blog/blog-cards/2-card-features.webp b/public/assets/images/blog/blog-cards/2-card-features.webp new file mode 100644 index 0000000..5b22584 Binary files /dev/null and b/public/assets/images/blog/blog-cards/2-card-features.webp differ diff --git a/public/assets/images/blog/blog-cards/2-card.webp b/public/assets/images/blog/blog-cards/2-card.webp new file mode 100644 index 0000000..b16a02f Binary files /dev/null and b/public/assets/images/blog/blog-cards/2-card.webp differ diff --git a/public/assets/images/blog/blog-cards/2blog-card.webp b/public/assets/images/blog/blog-cards/2blog-card.webp new file mode 100644 index 0000000..7b4534f Binary files /dev/null and b/public/assets/images/blog/blog-cards/2blog-card.webp differ diff --git a/public/assets/images/blog/blog-cards/ads-card.webp b/public/assets/images/blog/blog-cards/ads-card.webp new file mode 100644 index 0000000..1bf6411 Binary files /dev/null and b/public/assets/images/blog/blog-cards/ads-card.webp differ diff --git a/public/assets/images/blog/blog-cards/ai-b-card.webp b/public/assets/images/blog/blog-cards/ai-b-card.webp new file mode 100644 index 0000000..5560b3d Binary files /dev/null and b/public/assets/images/blog/blog-cards/ai-b-card.webp differ diff --git a/public/assets/images/blog/blog-cards/ai-card.webp b/public/assets/images/blog/blog-cards/ai-card.webp new file mode 100644 index 0000000..63a522e Binary files /dev/null and b/public/assets/images/blog/blog-cards/ai-card.webp differ diff --git a/public/assets/images/blog/blog-cards/ai-revolution.webp b/public/assets/images/blog/blog-cards/ai-revolution.webp new file mode 100644 index 0000000..ccfe244 Binary files /dev/null and b/public/assets/images/blog/blog-cards/ai-revolution.webp differ diff --git a/public/assets/images/blog/blog-cards/audit-card.webp b/public/assets/images/blog/blog-cards/audit-card.webp new file mode 100644 index 0000000..330e33d Binary files /dev/null and b/public/assets/images/blog/blog-cards/audit-card.webp differ diff --git a/public/assets/images/blog/blog-cards/blog-2.webp b/public/assets/images/blog/blog-cards/blog-2.webp new file mode 100644 index 0000000..bd05651 Binary files /dev/null and b/public/assets/images/blog/blog-cards/blog-2.webp differ diff --git a/public/assets/images/blog/blog-cards/blog1-card.webp b/public/assets/images/blog/blog-cards/blog1-card.webp new file mode 100644 index 0000000..f709e4f Binary files /dev/null and b/public/assets/images/blog/blog-cards/blog1-card.webp differ diff --git a/public/assets/images/blog/blog-cards/blog2-card.webp b/public/assets/images/blog/blog-cards/blog2-card.webp new file mode 100644 index 0000000..76b6343 Binary files /dev/null and b/public/assets/images/blog/blog-cards/blog2-card.webp differ diff --git a/public/assets/images/blog/blog-cards/blog3-card.webp b/public/assets/images/blog/blog-cards/blog3-card.webp new file mode 100644 index 0000000..dfd0b77 Binary files /dev/null and b/public/assets/images/blog/blog-cards/blog3-card.webp differ diff --git a/public/assets/images/blog/blog-cards/boost-card.webp b/public/assets/images/blog/blog-cards/boost-card.webp new file mode 100644 index 0000000..87da335 Binary files /dev/null and b/public/assets/images/blog/blog-cards/boost-card.webp differ diff --git a/public/assets/images/blog/blog-cards/boost.webp b/public/assets/images/blog/blog-cards/boost.webp new file mode 100644 index 0000000..f4ebf35 Binary files /dev/null and b/public/assets/images/blog/blog-cards/boost.webp differ diff --git a/public/assets/images/blog/blog-cards/campaign-card.webp b/public/assets/images/blog/blog-cards/campaign-card.webp new file mode 100644 index 0000000..d86f87b Binary files /dev/null and b/public/assets/images/blog/blog-cards/campaign-card.webp differ diff --git a/public/assets/images/blog/blog-cards/card-img.webp b/public/assets/images/blog/blog-cards/card-img.webp new file mode 100644 index 0000000..42d6ce9 Binary files /dev/null and b/public/assets/images/blog/blog-cards/card-img.webp differ diff --git a/public/assets/images/blog/blog-cards/cold-email-challenges.webp b/public/assets/images/blog/blog-cards/cold-email-challenges.webp new file mode 100644 index 0000000..2218a05 Binary files /dev/null and b/public/assets/images/blog/blog-cards/cold-email-challenges.webp differ diff --git a/public/assets/images/blog/blog-cards/cold-email.webp b/public/assets/images/blog/blog-cards/cold-email.webp new file mode 100644 index 0000000..5b8be8b Binary files /dev/null and b/public/assets/images/blog/blog-cards/cold-email.webp differ diff --git a/public/assets/images/blog/blog-cards/custom-web-design.webp b/public/assets/images/blog/blog-cards/custom-web-design.webp new file mode 100644 index 0000000..d5cd63a Binary files /dev/null and b/public/assets/images/blog/blog-cards/custom-web-design.webp differ diff --git a/public/assets/images/blog/blog-cards/digital-marketing-mistakes.webp b/public/assets/images/blog/blog-cards/digital-marketing-mistakes.webp new file mode 100644 index 0000000..c2aff8c Binary files /dev/null and b/public/assets/images/blog/blog-cards/digital-marketing-mistakes.webp differ diff --git a/public/assets/images/blog/blog-cards/digital-marketing.webp b/public/assets/images/blog/blog-cards/digital-marketing.webp new file mode 100644 index 0000000..11a210d Binary files /dev/null and b/public/assets/images/blog/blog-cards/digital-marketing.webp differ diff --git a/public/assets/images/blog/blog-cards/feb-6-1-card.webp b/public/assets/images/blog/blog-cards/feb-6-1-card.webp new file mode 100644 index 0000000..4ae8c5d Binary files /dev/null and b/public/assets/images/blog/blog-cards/feb-6-1-card.webp differ diff --git a/public/assets/images/blog/blog-cards/feb-6-2-card.webp b/public/assets/images/blog/blog-cards/feb-6-2-card.webp new file mode 100644 index 0000000..f25e7e0 Binary files /dev/null and b/public/assets/images/blog/blog-cards/feb-6-2-card.webp differ diff --git a/public/assets/images/blog/blog-cards/feb10-1-card.webp b/public/assets/images/blog/blog-cards/feb10-1-card.webp new file mode 100644 index 0000000..d5d8145 Binary files /dev/null and b/public/assets/images/blog/blog-cards/feb10-1-card.webp differ diff --git a/public/assets/images/blog/blog-cards/feb10-2-card.webp b/public/assets/images/blog/blog-cards/feb10-2-card.webp new file mode 100644 index 0000000..9520597 Binary files /dev/null and b/public/assets/images/blog/blog-cards/feb10-2-card.webp differ diff --git a/public/assets/images/blog/blog-cards/followers-card.webp b/public/assets/images/blog/blog-cards/followers-card.webp new file mode 100644 index 0000000..9aefd4f Binary files /dev/null and b/public/assets/images/blog/blog-cards/followers-card.webp differ diff --git a/public/assets/images/blog/blog-cards/google-business-card.webp b/public/assets/images/blog/blog-cards/google-business-card.webp new file mode 100644 index 0000000..ac8e0de Binary files /dev/null and b/public/assets/images/blog/blog-cards/google-business-card.webp differ diff --git a/public/assets/images/blog/blog-cards/google-maps-card.webp b/public/assets/images/blog/blog-cards/google-maps-card.webp new file mode 100644 index 0000000..86c20bc Binary files /dev/null and b/public/assets/images/blog/blog-cards/google-maps-card.webp differ diff --git a/public/assets/images/blog/blog-cards/google-tools.webp b/public/assets/images/blog/blog-cards/google-tools.webp new file mode 100644 index 0000000..00e346b Binary files /dev/null and b/public/assets/images/blog/blog-cards/google-tools.webp differ diff --git a/public/assets/images/blog/blog-cards/importance-local-seo.webp b/public/assets/images/blog/blog-cards/importance-local-seo.webp new file mode 100644 index 0000000..275b7c7 Binary files /dev/null and b/public/assets/images/blog/blog-cards/importance-local-seo.webp differ diff --git a/public/assets/images/blog/blog-cards/improve-card.webp b/public/assets/images/blog/blog-cards/improve-card.webp new file mode 100644 index 0000000..eb5c84d Binary files /dev/null and b/public/assets/images/blog/blog-cards/improve-card.webp differ diff --git a/public/assets/images/blog/blog-cards/local-customers-card.webp b/public/assets/images/blog/blog-cards/local-customers-card.webp new file mode 100644 index 0000000..e7c67f8 Binary files /dev/null and b/public/assets/images/blog/blog-cards/local-customers-card.webp differ diff --git a/public/assets/images/blog/blog-cards/local-seo.webp b/public/assets/images/blog/blog-cards/local-seo.webp new file mode 100644 index 0000000..f3c54db Binary files /dev/null and b/public/assets/images/blog/blog-cards/local-seo.webp differ diff --git a/public/assets/images/blog/blog-cards/mastering-card.webp b/public/assets/images/blog/blog-cards/mastering-card.webp new file mode 100644 index 0000000..1048674 Binary files /dev/null and b/public/assets/images/blog/blog-cards/mastering-card.webp differ diff --git a/public/assets/images/blog/blog-cards/mobile-commerce.webp b/public/assets/images/blog/blog-cards/mobile-commerce.webp new file mode 100644 index 0000000..e016d4e Binary files /dev/null and b/public/assets/images/blog/blog-cards/mobile-commerce.webp differ diff --git a/public/assets/images/blog/blog-cards/on-vs-off-page.webp b/public/assets/images/blog/blog-cards/on-vs-off-page.webp new file mode 100644 index 0000000..aebb605 Binary files /dev/null and b/public/assets/images/blog/blog-cards/on-vs-off-page.webp differ diff --git a/public/assets/images/blog/blog-cards/optimize-website.webp b/public/assets/images/blog/blog-cards/optimize-website.webp new file mode 100644 index 0000000..b6530ff Binary files /dev/null and b/public/assets/images/blog/blog-cards/optimize-website.webp differ diff --git a/public/assets/images/blog/blog-cards/ppc-card.webp b/public/assets/images/blog/blog-cards/ppc-card.webp new file mode 100644 index 0000000..dafc59e Binary files /dev/null and b/public/assets/images/blog/blog-cards/ppc-card.webp differ diff --git a/public/assets/images/blog/blog-cards/seo-services-card.webp b/public/assets/images/blog/blog-cards/seo-services-card.webp new file mode 100644 index 0000000..8771563 Binary files /dev/null and b/public/assets/images/blog/blog-cards/seo-services-card.webp differ diff --git a/public/assets/images/blog/blog-cards/small-card.webp b/public/assets/images/blog/blog-cards/small-card.webp new file mode 100644 index 0000000..a6f6cea Binary files /dev/null and b/public/assets/images/blog/blog-cards/small-card.webp differ diff --git a/public/assets/images/blog/blog-cards/start-card.webp b/public/assets/images/blog/blog-cards/start-card.webp new file mode 100644 index 0000000..7650aff Binary files /dev/null and b/public/assets/images/blog/blog-cards/start-card.webp differ diff --git a/public/assets/images/blog/blog-cards/top-10.webp b/public/assets/images/blog/blog-cards/top-10.webp new file mode 100644 index 0000000..8c96507 Binary files /dev/null and b/public/assets/images/blog/blog-cards/top-10.webp differ diff --git a/public/assets/images/blog/blog-cards/top-card.webp b/public/assets/images/blog/blog-cards/top-card.webp new file mode 100644 index 0000000..85b40a9 Binary files /dev/null and b/public/assets/images/blog/blog-cards/top-card.webp differ diff --git a/public/assets/images/blog/blog-cards/track-card.webp b/public/assets/images/blog/blog-cards/track-card.webp new file mode 100644 index 0000000..a8af424 Binary files /dev/null and b/public/assets/images/blog/blog-cards/track-card.webp differ diff --git a/public/assets/images/blog/blog-cards/viral-content.webp b/public/assets/images/blog/blog-cards/viral-content.webp new file mode 100644 index 0000000..60a27a3 Binary files /dev/null and b/public/assets/images/blog/blog-cards/viral-content.webp differ diff --git a/public/assets/images/blog/blog-cards/white-vs-black.webp b/public/assets/images/blog/blog-cards/white-vs-black.webp new file mode 100644 index 0000000..1be2d9d Binary files /dev/null and b/public/assets/images/blog/blog-cards/white-vs-black.webp differ diff --git a/public/assets/images/blog/blog-cards/winning.webp b/public/assets/images/blog/blog-cards/winning.webp new file mode 100644 index 0000000..879fb54 Binary files /dev/null and b/public/assets/images/blog/blog-cards/winning.webp differ diff --git a/public/assets/images/blog/blog-details/1-big-img.webp b/public/assets/images/blog/blog-details/1-big-img.webp new file mode 100644 index 0000000..51e50d3 Binary files /dev/null and b/public/assets/images/blog/blog-details/1-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/1blog-big-img.webp b/public/assets/images/blog/blog-details/1blog-big-img.webp new file mode 100644 index 0000000..f7e0f66 Binary files /dev/null and b/public/assets/images/blog/blog-details/1blog-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/2-big-img.webp b/public/assets/images/blog/blog-details/2-big-img.webp new file mode 100644 index 0000000..0ffd8e6 Binary files /dev/null and b/public/assets/images/blog/blog-details/2-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/2blog-big-img.webp b/public/assets/images/blog/blog-details/2blog-big-img.webp new file mode 100644 index 0000000..63ced72 Binary files /dev/null and b/public/assets/images/blog/blog-details/2blog-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/ads-big-img.webp b/public/assets/images/blog/blog-details/ads-big-img.webp new file mode 100644 index 0000000..011515d Binary files /dev/null and b/public/assets/images/blog/blog-details/ads-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/ai-b-big-img.webp b/public/assets/images/blog/blog-details/ai-b-big-img.webp new file mode 100644 index 0000000..534584b Binary files /dev/null and b/public/assets/images/blog/blog-details/ai-b-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/ai-big-img.webp b/public/assets/images/blog/blog-details/ai-big-img.webp new file mode 100644 index 0000000..cb7504b Binary files /dev/null and b/public/assets/images/blog/blog-details/ai-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/ai-revolution.webp b/public/assets/images/blog/blog-details/ai-revolution.webp new file mode 100644 index 0000000..7e40c83 Binary files /dev/null and b/public/assets/images/blog/blog-details/ai-revolution.webp differ diff --git a/public/assets/images/blog/blog-details/audit-big-img.webp b/public/assets/images/blog/blog-details/audit-big-img.webp new file mode 100644 index 0000000..e61b559 Binary files /dev/null and b/public/assets/images/blog/blog-details/audit-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/big-img.webp b/public/assets/images/blog/blog-details/big-img.webp new file mode 100644 index 0000000..f870c6c Binary files /dev/null and b/public/assets/images/blog/blog-details/big-img.webp differ diff --git a/public/assets/images/blog/blog-details/blog-large-2.webp b/public/assets/images/blog/blog-details/blog-large-2.webp new file mode 100644 index 0000000..60025d6 Binary files /dev/null and b/public/assets/images/blog/blog-details/blog-large-2.webp differ diff --git a/public/assets/images/blog/blog-details/blog1-big-img.webp b/public/assets/images/blog/blog-details/blog1-big-img.webp new file mode 100644 index 0000000..c9c17f3 Binary files /dev/null and b/public/assets/images/blog/blog-details/blog1-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/blog2-big-img.webp b/public/assets/images/blog/blog-details/blog2-big-img.webp new file mode 100644 index 0000000..e7402bb Binary files /dev/null and b/public/assets/images/blog/blog-details/blog2-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/blog3-big-img.webp b/public/assets/images/blog/blog-details/blog3-big-img.webp new file mode 100644 index 0000000..17e1b8b Binary files /dev/null and b/public/assets/images/blog/blog-details/blog3-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/boost-big-img.webp b/public/assets/images/blog/blog-details/boost-big-img.webp new file mode 100644 index 0000000..554ea1f Binary files /dev/null and b/public/assets/images/blog/blog-details/boost-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/boost.webp b/public/assets/images/blog/blog-details/boost.webp new file mode 100644 index 0000000..0bc0ea3 Binary files /dev/null and b/public/assets/images/blog/blog-details/boost.webp differ diff --git a/public/assets/images/blog/blog-details/campaign-big-img.webp b/public/assets/images/blog/blog-details/campaign-big-img.webp new file mode 100644 index 0000000..fba834b Binary files /dev/null and b/public/assets/images/blog/blog-details/campaign-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/cold-email-challenges.webp b/public/assets/images/blog/blog-details/cold-email-challenges.webp new file mode 100644 index 0000000..9efc62a Binary files /dev/null and b/public/assets/images/blog/blog-details/cold-email-challenges.webp differ diff --git a/public/assets/images/blog/blog-details/cold-email.webp b/public/assets/images/blog/blog-details/cold-email.webp new file mode 100644 index 0000000..b9a4775 Binary files /dev/null and b/public/assets/images/blog/blog-details/cold-email.webp differ diff --git a/public/assets/images/blog/blog-details/custom-web-design.webp b/public/assets/images/blog/blog-details/custom-web-design.webp new file mode 100644 index 0000000..5a24fe3 Binary files /dev/null and b/public/assets/images/blog/blog-details/custom-web-design.webp differ diff --git a/public/assets/images/blog/blog-details/digital-marketing-mistakes.webp b/public/assets/images/blog/blog-details/digital-marketing-mistakes.webp new file mode 100644 index 0000000..2eba520 Binary files /dev/null and b/public/assets/images/blog/blog-details/digital-marketing-mistakes.webp differ diff --git a/public/assets/images/blog/blog-details/digital-marketing.webp b/public/assets/images/blog/blog-details/digital-marketing.webp new file mode 100644 index 0000000..35145da Binary files /dev/null and b/public/assets/images/blog/blog-details/digital-marketing.webp differ diff --git a/public/assets/images/blog/blog-details/features-big-img.webp b/public/assets/images/blog/blog-details/features-big-img.webp new file mode 100644 index 0000000..5feef7d Binary files /dev/null and b/public/assets/images/blog/blog-details/features-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/feb-6-1-big-img.webp b/public/assets/images/blog/blog-details/feb-6-1-big-img.webp new file mode 100644 index 0000000..48f0131 Binary files /dev/null and b/public/assets/images/blog/blog-details/feb-6-1-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/feb-6-2-big-img.webp b/public/assets/images/blog/blog-details/feb-6-2-big-img.webp new file mode 100644 index 0000000..3b8a546 Binary files /dev/null and b/public/assets/images/blog/blog-details/feb-6-2-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/feb10-1-big-img.webp b/public/assets/images/blog/blog-details/feb10-1-big-img.webp new file mode 100644 index 0000000..f481666 Binary files /dev/null and b/public/assets/images/blog/blog-details/feb10-1-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/feb10-2-big-img.webp b/public/assets/images/blog/blog-details/feb10-2-big-img.webp new file mode 100644 index 0000000..0597d28 Binary files /dev/null and b/public/assets/images/blog/blog-details/feb10-2-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/followers-big-img.webp b/public/assets/images/blog/blog-details/followers-big-img.webp new file mode 100644 index 0000000..0b2a5f8 Binary files /dev/null and b/public/assets/images/blog/blog-details/followers-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/google-business-big-img.webp b/public/assets/images/blog/blog-details/google-business-big-img.webp new file mode 100644 index 0000000..5616bd5 Binary files /dev/null and b/public/assets/images/blog/blog-details/google-business-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/google-maps-big-img.webp b/public/assets/images/blog/blog-details/google-maps-big-img.webp new file mode 100644 index 0000000..a8172c5 Binary files /dev/null and b/public/assets/images/blog/blog-details/google-maps-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/google-tools.webp b/public/assets/images/blog/blog-details/google-tools.webp new file mode 100644 index 0000000..d9b7046 Binary files /dev/null and b/public/assets/images/blog/blog-details/google-tools.webp differ diff --git a/public/assets/images/blog/blog-details/importance-local-seo.webp b/public/assets/images/blog/blog-details/importance-local-seo.webp new file mode 100644 index 0000000..8cb9ade Binary files /dev/null and b/public/assets/images/blog/blog-details/importance-local-seo.webp differ diff --git a/public/assets/images/blog/blog-details/improve-big-img.webp b/public/assets/images/blog/blog-details/improve-big-img.webp new file mode 100644 index 0000000..75af259 Binary files /dev/null and b/public/assets/images/blog/blog-details/improve-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/local-customers-big-img.webp b/public/assets/images/blog/blog-details/local-customers-big-img.webp new file mode 100644 index 0000000..54c36e5 Binary files /dev/null and b/public/assets/images/blog/blog-details/local-customers-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/local-seo.webp b/public/assets/images/blog/blog-details/local-seo.webp new file mode 100644 index 0000000..e751fd0 Binary files /dev/null and b/public/assets/images/blog/blog-details/local-seo.webp differ diff --git a/public/assets/images/blog/blog-details/mastering-big-img.webp b/public/assets/images/blog/blog-details/mastering-big-img.webp new file mode 100644 index 0000000..46411e8 Binary files /dev/null and b/public/assets/images/blog/blog-details/mastering-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/mobile-commerce.webp b/public/assets/images/blog/blog-details/mobile-commerce.webp new file mode 100644 index 0000000..3d73cdd Binary files /dev/null and b/public/assets/images/blog/blog-details/mobile-commerce.webp differ diff --git a/public/assets/images/blog/blog-details/on-vs-off-page.webp b/public/assets/images/blog/blog-details/on-vs-off-page.webp new file mode 100644 index 0000000..4f94245 Binary files /dev/null and b/public/assets/images/blog/blog-details/on-vs-off-page.webp differ diff --git a/public/assets/images/blog/blog-details/optimize-website.webp b/public/assets/images/blog/blog-details/optimize-website.webp new file mode 100644 index 0000000..df4c996 Binary files /dev/null and b/public/assets/images/blog/blog-details/optimize-website.webp differ diff --git a/public/assets/images/blog/blog-details/ppc-big-img.webp b/public/assets/images/blog/blog-details/ppc-big-img.webp new file mode 100644 index 0000000..e90f0b2 Binary files /dev/null and b/public/assets/images/blog/blog-details/ppc-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/seo-big-img.webp b/public/assets/images/blog/blog-details/seo-big-img.webp new file mode 100644 index 0000000..16f143b Binary files /dev/null and b/public/assets/images/blog/blog-details/seo-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/seo-services-big-img.webp b/public/assets/images/blog/blog-details/seo-services-big-img.webp new file mode 100644 index 0000000..23634d6 Binary files /dev/null and b/public/assets/images/blog/blog-details/seo-services-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/small-big-img.webp b/public/assets/images/blog/blog-details/small-big-img.webp new file mode 100644 index 0000000..667b14c Binary files /dev/null and b/public/assets/images/blog/blog-details/small-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/start-big-img.webp b/public/assets/images/blog/blog-details/start-big-img.webp new file mode 100644 index 0000000..d942da9 Binary files /dev/null and b/public/assets/images/blog/blog-details/start-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/top-10.webp b/public/assets/images/blog/blog-details/top-10.webp new file mode 100644 index 0000000..e2c7f7c Binary files /dev/null and b/public/assets/images/blog/blog-details/top-10.webp differ diff --git a/public/assets/images/blog/blog-details/top-big-img.webp b/public/assets/images/blog/blog-details/top-big-img.webp new file mode 100644 index 0000000..04a8819 Binary files /dev/null and b/public/assets/images/blog/blog-details/top-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/track-big-img.webp b/public/assets/images/blog/blog-details/track-big-img.webp new file mode 100644 index 0000000..f948f8c Binary files /dev/null and b/public/assets/images/blog/blog-details/track-big-img.webp differ diff --git a/public/assets/images/blog/blog-details/viral-content.webp b/public/assets/images/blog/blog-details/viral-content.webp new file mode 100644 index 0000000..4a3fb72 Binary files /dev/null and b/public/assets/images/blog/blog-details/viral-content.webp differ diff --git a/public/assets/images/blog/blog-details/white-vs-black.webp b/public/assets/images/blog/blog-details/white-vs-black.webp new file mode 100644 index 0000000..1e57bf7 Binary files /dev/null and b/public/assets/images/blog/blog-details/white-vs-black.webp differ diff --git a/public/assets/images/blog/blog-details/winning.webp b/public/assets/images/blog/blog-details/winning.webp new file mode 100644 index 0000000..c5cc069 Binary files /dev/null and b/public/assets/images/blog/blog-details/winning.webp differ diff --git a/public/assets/img/add/icon-1.webp b/public/assets/img/add/icon-1.webp new file mode 100644 index 0000000..b00b645 Binary files /dev/null and b/public/assets/img/add/icon-1.webp differ diff --git a/public/assets/img/add/icon-2.webp b/public/assets/img/add/icon-2.webp new file mode 100644 index 0000000..9d1ded2 Binary files /dev/null and b/public/assets/img/add/icon-2.webp differ diff --git a/public/assets/img/add/icon-3.webp b/public/assets/img/add/icon-3.webp new file mode 100644 index 0000000..424e43b Binary files /dev/null and b/public/assets/img/add/icon-3.webp differ diff --git a/public/assets/img/add/icon-4.webp b/public/assets/img/add/icon-4.webp new file mode 100644 index 0000000..fa05bf1 Binary files /dev/null and b/public/assets/img/add/icon-4.webp differ diff --git a/src/app/blog/[slug]/BlogDetailsClient.tsx b/src/app/blog/[slug]/BlogDetailsClient.tsx index 50108d4..e291b8c 100644 --- a/src/app/blog/[slug]/BlogDetailsClient.tsx +++ b/src/app/blog/[slug]/BlogDetailsClient.tsx @@ -1,6 +1,6 @@ "use client"; -import React, { useEffect } from "react"; +import React, { useEffect, useState } from "react"; import { useRouter } from "next/navigation"; import Header1 from "@/components/layout/Header1"; import Footer1 from "@/components/layout/Footer1"; @@ -14,6 +14,11 @@ interface BlogDetailsClientProps { export default function BlogDetailsClient({ blog }: BlogDetailsClientProps) { const router = useRouter(); + const [activeIndex, setActiveIndex] = useState(null); + + const toggleAccordion = (index: number) => { + setActiveIndex(activeIndex === index ? null : index); + }; useEffect(() => { if (typeof window !== "undefined" && (window as any).initMetatron) { @@ -50,7 +55,7 @@ export default function BlogDetailsClient({ blog }: BlogDetailsClientProps) {
- {blog.title} + {blog.title}
@@ -61,23 +66,43 @@ export default function BlogDetailsClient({ blog }: BlogDetailsClientProps) {

{blog.title}

-
-

{blog.details}

-
+ {/* Render the full HTML content from description */} +
- {blog.blockquote && ( -
-
- + {blog.faq && blog.faq.length > 0 && ( +
+
+
+
Blog FAQ
+

Frequently Asked Questions

-

{blog.blockquote}

-
+
+ {blog.faq.map((item, index) => ( +
+
toggleAccordion(index)}> +
+
+ +
+

+ {item.question} + +

+
+
+
+

{item.answer}

+
+
+
+ ))} +
+
)} -
-

{blog.description}

-
-
*/} - + diff --git a/src/app/careers/page.tsx b/src/app/careers/page.tsx index 19d5694..14baeb8 100644 --- a/src/app/careers/page.tsx +++ b/src/app/careers/page.tsx @@ -15,6 +15,7 @@ import PageHeader from "@/components/common/PageHeader"; import AboutService from "@/components/services-digital-solutions/AboutService"; import AboutThree from "@/components/home/AboutThree"; import FaqFour from "@/components/home/FaqFour"; +import ProjectsSection from "@/components/home/ProjectsSection"; export default function CareersPage() { useEffect(() => { @@ -32,11 +33,12 @@ export default function CareersPage() { {/* */} + {/* */} {/* */} {/* */} {/* */} - + {/* */} {/* */} diff --git a/src/app/globals.css b/src/app/globals.css index 72b17f9..64855f0 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -2625,12 +2625,12 @@ body { } .card-2 { - top: 20%; + top: 30%; left: 0; } .card-3 { - bottom: 20%; + bottom: 60%; left: 0; } @@ -2640,6 +2640,12 @@ body { transform: translateX(-50%); } +.card-5 { + bottom: 20%; + left: 80%; + transform: translateX(-50%); +} + .card-6 { bottom: 20%; right: 0; @@ -4103,7 +4109,7 @@ body { padding: 80px 0; border-bottom: 1px solid var(--pelocis-border-color, #DDDDDD); overflow: hidden; - margin-top: 80px; + margin: 80px 0; } .about-two__shape { @@ -4653,8 +4659,8 @@ body { } .why-choose-two__content { - padding-top: 110px; - padding-bottom: 120px; + padding-top: 80px; + padding-bottom: 80px; } /* .why-choose-two .sec-title { @@ -6409,7 +6415,7 @@ body { FAQ Four Section */ .faq-four { - padding: 80px 0; + padding: 0 0 80px; position: relative; } @@ -6426,9 +6432,55 @@ body { .faq-four__content { position: relative; - padding: 60px 0 120px; + padding: 60px 0 60px; } +.faq-four__image2 img { + min-height: 650px; + object-fit: cover; + max-width: 100%; + clip-path: polygon( + 0 0, + 100% 0, + 88% 50%, + 100% 100%, + 0 100% + ); +} + +.faq-four__image2__icon { + width: 175px; + height: 175px; + background-color: var(--pelocis-base, #3779b9); + border: 10px solid var(--pelocis-white, #fff); + display: flex; + justify-content: center; + align-items: center; + position: absolute; + right: 0; + top: 50%; + transform: translateY(-50%); + border-radius: 50%; + z-index: 2; + font-size: 70px; + color: var(--pelocis-white, #fff); +} + +.faq-four__image2__icon::after { + content: ""; + width: calc(100% - 29px); + height: calc(100% - 29px); + border: 1px dashed var(--pelocis-white, #fff); + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + border-radius: 50%; + z-index: -1; + animation: textRotate 15s linear 0s forwards infinite alternate; +} /* .faq-four__content .sec-title { padding-bottom: 21px; } */ @@ -7078,7 +7130,7 @@ body { transform: scale(1.1); } -.counter-area-two__item::after { +/* .counter-area-two__item::after { content: ""; position: absolute; bottom: -32px; @@ -7091,9 +7143,9 @@ body { opacity: 0; visibility: hidden; transition: all 500ms ease; -} +} */ -.counter-area-three__item::after { +/* .counter-area-three__item::after { content: ""; position: absolute; bottom: -32px; @@ -7106,9 +7158,9 @@ body { opacity: 0; visibility: hidden; transition: all 500ms ease; -} +} */ -.counter-area-two__item:hover::after { +/* .counter-area-two__item:hover::after { opacity: 1; visibility: visible; bottom: 0; @@ -7118,7 +7170,7 @@ body { opacity: 1; visibility: visible; bottom: 0; -} +} */ .counter-area-two__count { font-size: 35px; @@ -7795,7 +7847,7 @@ body { .projects-one__title { position: relative; - margin-bottom: 50px; + /* margin-bottom: 50px; */ } .projects-one .sec-title { @@ -7857,7 +7909,7 @@ body { list-style: none; } -.projects-one__filter__list li { +.projects-one__filter__list button.list-unstyled-item { cursor: pointer; border: 1px solid var(--pelocis-border-color, #DDDDDD); position: relative; @@ -7870,34 +7922,66 @@ body { font-size: 18px; font-weight: 700; line-height: 25px; + border-radius: 0; + outline: none; } -.projects-one__filter__list li.active, -.projects-one__filter__list li:hover { +.projects-one__filter__list button.list-unstyled-item.active, +.projects-one__filter__list button.list-unstyled-item:hover { background-color: var(--pelocis-base, #3779b9); border-color: var(--pelocis-base, #3779b9); color: var(--pelocis-white, #fff); } -.projects-one__filter__list li+li { - margin-left: -1px; -} - .projects-grid { - display: grid; - grid-template-columns: repeat(3, 1fr); + display: flex; + flex-wrap: wrap; + justify-content: center; gap: 30px; } +.project-item { + flex: 0 0 calc(33.333% - 30px); + max-width: calc(33.333% - 30px); +} + @media (max-width: 991px) { - .projects-grid { - grid-template-columns: repeat(2, 1fr); + .project-item { + flex: 0 0 calc(50% - 30px); + max-width: calc(50% - 30px); } } @media (max-width: 767px) { - .projects-grid { - grid-template-columns: 1fr; + .projects-one { + padding-top: 60px; + padding-bottom: 70px; + } + + .project-item { + flex: 0 0 100%; + max-width: 400px; + /* Limit width on mobile for better appearance */ + } + + .sec-title__title { + font-size: 32px; + } + + .projects-one__filter__list li { + padding: 8px 15px; + font-size: 14px; + margin-bottom: 5px; + } +} + +@media (max-width: 480px) { + .project-item { + max-width: 100%; + } + + .projects-one__card img { + height: 250px; } } @@ -7997,7 +8081,7 @@ body { position: absolute; width: 50px; height: 50px; - top: -50px; + top: -60px; left: 60px; display: flex; align-items: center; @@ -8708,1492 +8792,2610 @@ body { background-attachment: scroll !important; } } + /* Navigation Dropdown Arrow Rotation */ -.has-dropdown > a > i { - display: inline-block; - transition: transform 0.3s ease; +.has-dropdown>a>i { + display: inline-block; + transition: transform 0.3s ease; } -.has-dropdown:hover > a > i { - transform: rotate(180deg); +.has-dropdown:hover>a>i { + transform: rotate(180deg); } .main-menu ul li { - margin-right: 30px; + margin-right: 30px; } .main-menu ul li a { - font-weight: 700 !important; - letter-spacing: 0.5px; + font-weight: 700 !important; + letter-spacing: 0.5px; } .main-menu ul li a:hover { - color: #3779b9 !important; + color: #3779b9 !important; } /* Google Reviews Branding Styles */ .google-reviews-branding-global { - margin-top: 15px; - display: flex; - flex-direction: column; + margin-top: 15px; + display: flex; + flex-direction: column; } .google-reviews-branding-global .google-logo { - font-size: 28px; - font-weight: 700; - line-height: 1.2; - letter-spacing: 3px; - font-family: 'Product Sans', 'Google Sans', Roboto, Arial, sans-serif; - display: flex; - align-items: center; + font-size: 28px; + font-weight: 700; + line-height: 1.2; + letter-spacing: 3px; + font-family: 'Product Sans', 'Google Sans', Roboto, Arial, sans-serif; + display: flex; + align-items: center; } .google-reviews-branding-global .reviews-text-stars { - font-size: 13px; - font-weight: 700; - line-height: 1.2; - font-family: 'Product Sans', 'Google Sans', Roboto, Arial, sans-serif; - display: flex; - align-items: center; - gap: 5px; - margin-top: -2px; + font-size: 13px; + font-weight: 700; + line-height: 1.2; + font-family: 'Product Sans', 'Google Sans', Roboto, Arial, sans-serif; + display: flex; + align-items: center; + gap: 5px; + margin-top: -2px; } .google-reviews-branding-global .stars-container { - display: flex; - gap: 1px; - font-size: 13px; - line-height: 1; + display: flex; + gap: 1px; + font-size: 13px; + line-height: 1; } /* Testimonials Section Styles */ .testimonials-two-box-solid { - background: #fff; - padding: 40px 30px 40px 80px; - border-left: 4px solid #3779b9; - position: relative; - margin-left: 60px; - min-height: 320px; - transition: all 0.3s ease; - display: flex; - flex-direction: column; + background: #fff; + padding: 40px 30px 40px 80px; + border-left: 4px solid #3779b9; + position: relative; + margin-left: 60px; + min-height: 320px; + transition: all 0.3s ease; + display: flex; + flex-direction: column; } .author-image-solid { - position: absolute; - left: -50px; - top: 50%; - transform: translateY(-50%); - z-index: 5; + position: absolute; + left: -50px; + top: 50%; + transform: translateY(-50%); + z-index: 5; } .author-image-solid img { - height: 100px !important; - width: 100px !important; - border-radius: 50%; - object-fit: cover; - border: 5px solid #fff; - box-shadow: 0 5px 15px rgba(0,0,0,0.1); + height: 100px !important; + width: 100px !important; + border-radius: 50%; + object-fit: cover; + border: 5px solid #fff; + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); } .icon-quote-testi { - position: absolute; - top: 25px; - right: 25px; - font-size: 40px; - color: rgba(55, 121, 185, 0.1); + position: absolute; + top: 25px; + right: 25px; + font-size: 40px; + color: rgba(55, 121, 185, 0.1); } .content-solid h4 { - font-size: 20px; - margin-bottom: 2px; - font-weight: 700; - color: #1a1f2b; + font-size: 20px; + margin-bottom: 2px; + font-weight: 700; + color: #1a1f2b; } .content-solid .tag { - color: #787878; - font-size: 13px; - display: block; - margin-bottom: 10px; + color: #787878; + font-size: 13px; + display: block; + margin-bottom: 10px; } .ratings-solid { - display: flex; - gap: 4px; - margin-bottom: 15px; - color: #FBBC04; + display: flex; + gap: 4px; + margin-bottom: 15px; + color: #FBBC04; } .ratings-solid li { - list-style: none; - font-size: 14px; + list-style: none; + font-size: 14px; } .content-solid p { - font-size: 14px; - line-height: 1.6; - color: #555; - margin: 0; - display: -webkit-box; - WebkitLineClamp: 5; - WebkitBoxOrient: vertical; - overflow: hidden; - height: 112px; + font-size: 14px; + line-height: 1.6; + color: #555; + margin: 0; + display: -webkit-box; + -webkit-line-clamp: 5; + line-clamp: 5; + -webkit-box-orient: vertical; + overflow: hidden; + height: 112px; } .testimonial-dot-inner { - list-style: none; - display: flex !important; - justify-content: center; - padding: 0; - margin-top: 30px; - gap: 10px; + list-style: none; + display: flex !important; + justify-content: center; + padding: 0; + margin-top: 30px; + gap: 10px; } .testimonial-dot-inner li button { - font-size: 0; - width: 12px; - height: 12px; - border-radius: 50%; - background: rgba(255, 255, 255, 0.3); - border: none; - cursor: pointer; - transition: all 0.3s ease; + font-size: 0; + width: 12px; + height: 12px; + border-radius: 50%; + background: rgba(255, 255, 255, 0.3); + border: none; + cursor: pointer; + transition: all 0.3s ease; } .testimonial-dot-inner li.slick-active button { - background: #3779b9; - transform: scale(1.3); + background: #3779b9; + transform: scale(1.3); } /* Home Contact Form Styles */ .home-contact-form-container-global { - background: #1a1f2b; - padding: 50px; - border-radius: 24px; - box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); + background: #1a1f2b; + padding: 50px; + border-radius: 24px; + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); } .form-label-custom-global { - display: block; - margin-bottom: 8px; - font-weight: 700; - color: #fff; - font-size: 14px; - letter-spacing: 0.5px; + display: block; + margin-bottom: 8px; + font-weight: 700; + color: #fff; + font-size: 14px; + letter-spacing: 0.5px; } -.form-input-custom-global, .form-textarea-custom-global, .form-select-custom-styled-global { - width: 100%; - padding: 18px 25px; - border: 1px solid #e2e8f0; - background-color: #fff; - border-radius: 12px; - outline: none; - font-size: 15px; - color: #1e293b; - transition: all 0.3s ease; +.form-input-custom-global, +.form-textarea-custom-global, +.form-select-custom-styled-global { + width: 100%; + padding: 18px 25px; + border: 1px solid #e2e8f0; + background-color: #fff; + border-radius: 12px; + outline: none; + font-size: 15px; + color: #1e293b; + transition: all 0.3s ease; } .form-textarea-custom-global { - min-height: 120px; - resize: vertical; + min-height: 120px; + resize: vertical; } -.form-input-custom-global:focus, .form-textarea-custom-global:focus, .form-select-custom-styled-global:focus { - border-color: #3779b9; - box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); +.form-input-custom-global:focus, +.form-textarea-custom-global:focus, +.form-select-custom-styled-global:focus { + border-color: #3779b9; + box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); } .submit-btn-custom-global { - width: 100%; - background: #3779b9; - color: #fff; - padding: 20px 30px; - border: none; - border-radius: 12px; - font-weight: 700; - cursor: pointer; - transition: all 0.3s ease; - text-transform: uppercase; - letter-spacing: 1.5px; - font-size: 15px; - box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); + width: 100%; + background: #3779b9; + color: #fff; + padding: 20px 30px; + border: none; + border-radius: 12px; + font-weight: 700; + cursor: pointer; + transition: all 0.3s ease; + text-transform: uppercase; + letter-spacing: 1.5px; + font-size: 15px; + box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); } .submit-btn-custom-global:hover { - background: #1e293b; - transform: translateY(-3px); - box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); + background: #1e293b; + transform: translateY(-3px); + box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); } /* Why Choose Us Section Styles */ .why-choose-us { - padding: 80px 0; - background: #eaf0f9; + padding: 80px 0; + background: #eaf0f9; } + @media (max-width: 767px) { - .why-choose-us { - padding: 60px 0; - } + .why-choose-us { + padding: 60px 0; + } } + .why-choose-us .section-subtitle { - color: #3779b9; - font-weight: 700; - margin-bottom: 15px; - display: flex; - align-items: center; - gap: 12px; - font-size: 15px; - text-transform: uppercase; - letter-spacing: 1px; + color: #3779b9; + font-weight: 700; + margin-bottom: 15px; + display: flex; + align-items: center; + gap: 12px; + font-size: 15px; + text-transform: uppercase; + letter-spacing: 1px; } + .why-choose-us .rotate-triangle { - font-size: 14px; - transform: rotate(-30deg); - margin-top: -2px; + font-size: 14px; + transform: rotate(-30deg); + margin-top: -2px; } + .why-choose-us .section-title { - font-size: 44px; - font-weight: 800; - color: #1a1a1a; - line-height: 1.2; - margin-bottom: 25px; + font-size: 44px; + font-weight: 800; + color: #1a1a1a; + line-height: 1.2; + margin-bottom: 25px; } + .why-choose-us .section-desc { - font-size: 16px; - color: #666; - line-height: 1.7; - margin-bottom: 35px; + font-size: 16px; + color: #666; + line-height: 1.7; + margin-bottom: 20px; } + .why-choose-us .feature-item { - padding: 25px 0; + padding: 25px 0; } + .why-choose-us .border-top-line { - border-top: 1px solid #eee; + border-top: 1px solid #eee; } + .why-choose-us .feature-icon { - width: 70px; - height: 70px; - background: #3779b9; - border-radius: 6px; - display: flex; - align-items: center; - justify-content: center; - margin-right: 25px; - flex-shrink: 0; - color: #fff; - font-size: 28px; + width: 70px; + height: 70px; + background: #3779b9; + border-radius: 6px; + display: flex; + align-items: center; + justify-content: center; + margin-right: 25px; + flex-shrink: 0; + color: #fff; + font-size: 28px; } + .why-choose-us .feature-content h4 { - font-size: 22px; - font-weight: 700; - margin-bottom: 8px; - color: #1a1a1a; + font-size: 22px; + font-weight: 700; + margin-bottom: 8px; + color: #1a1a1a; } + .why-choose-us .feature-content p { - font-size: 15px; - color: #666; - margin: 0; -} -.why-choose-us .bottom-note { - padding-top: 30px; - border-top: 1px solid #eee; + font-size: 15px; + color: #666; + margin: 0; } + .why-choose-us .note-item { - display: flex; - align-items: flex-start; - gap: 15px; + display: flex; + align-items: flex-start; + gap: 15px; } + .why-choose-us .note-item i { - color: #1a1a1a; - font-size: 18px; - margin-top: 3px; + color: #1a1a1a; + font-size: 18px; + margin-top: 3px; } + .why-choose-us .note-item span { - font-size: 16px; - color: #444; - font-weight: 500; - line-height: 1.5; + font-size: 16px; + color: #444; + font-weight: 500; + line-height: 1.5; } + .why-choose-us .image-area-wrapper { - padding-left: 20px; + padding-left: 20px; } + .why-choose-us .main-image { - width: 100%; - border-radius: 4px; - overflow: hidden; - box-shadow: 0 30px 60px rgba(0,0,0,0.1); + width: 100%; + border-radius: 4px; + overflow: hidden; + box-shadow: 0 30px 60px rgba(0, 0, 0, 0.1); } + .why-choose-us .main-image img { - width: 100%; - display: block; + width: 100%; + display: block; } + .why-choose-us .circular-image { - position: absolute; - top: 50%; - left: -80px; - transform: translateY(-50%); - width: 280px; - height: 280px; - background: #fff; - padding: 10px; - border-radius: 50%; - box-shadow: 0 10px 40px rgba(0,0,0,0.15); - z-index: 2; + position: absolute; + top: 50%; + left: -80px; + transform: translateY(-50%); + width: 280px; + height: 280px; + background: #fff; + padding: 10px; + border-radius: 50%; + box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15); + z-index: 2; } + .why-choose-us .inner-circle { - width: 100%; - height: 100%; - border-radius: 50%; - overflow: hidden; - border: 2px solid #fff; + width: 100%; + height: 100%; + border-radius: 50%; + overflow: hidden; + border: 2px solid #fff; } + .why-choose-us .inner-circle img { - width: 100%; - height: 100%; - object-fit: cover; + width: 100%; + height: 100%; + object-fit: cover; } + @media (max-width: 1199px) { - .why-choose-us .circular-image { - width: 220px; - height: 220px; - left: -50px; - } - .why-choose-us .section-title { - font-size: 36px; - } + .why-choose-us .circular-image { + width: 220px; + height: 220px; + left: -50px; + } + + .why-choose-us .section-title { + font-size: 36px; + } } + @media (max-width: 991px) { - .why-choose-us .content-area { - padding-right: 0; - margin-bottom: 60px; - } - .why-choose-us .image-area-wrapper { - padding-left: 0; - } - .why-choose-us .circular-image { - width: 200px; - height: 200px; - left: -30px; - } + .why-choose-us .content-area { + padding-right: 0; + margin-bottom: 60px; + } + + .why-choose-us .image-area-wrapper { + padding-left: 0; + } + + .why-choose-us .circular-image { + width: 200px; + height: 200px; + left: -30px; + } } + @media (max-width: 575px) { - .why-choose-us .circular-image { - position: relative; - top: 0; - left: 0; - transform: none; - margin: -60px auto 0; - } + .why-choose-us .circular-image { + position: relative; + top: 0; + left: 0; + transform: none; + margin: -60px auto 0; + } } /* FAQ Two Section Styles */ .faq-two { - padding: 120px 0 200px; - position: relative; - background-color: #0f172a; - clip-path: none !important; + padding: 120px 0 200px; + position: relative; + background-color: #0f172a; + clip-path: none !important; } + .faq-two .faq-two__bg { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-attachment: fixed; - background-size: cover; - opacity: 0.15; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-attachment: fixed; + background-size: cover; + opacity: 0.15; } + .faq-two .contact-form-card { - background: rgba(26, 31, 43, 0.8); - backdrop-filter: blur(10px); - padding: 60px; - border-radius: 30px; - border: 1px solid rgba(255, 255, 255, 0.05); - box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3); - margin-bottom: 20px; + background: rgba(26, 31, 43, 0.8); + backdrop-filter: blur(10px); + padding: 60px; + border-radius: 30px; + border: 1px solid rgba(255, 255, 255, 0.05); + box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3); + margin-bottom: 20px; } + .faq-two .section-subtitle { - color: #3779b9; - text-transform: uppercase; - letter-spacing: 2px; - font-weight: 700; - font-size: 14px; - display: block; - margin-bottom: 15px; + color: #3779b9; + text-transform: uppercase; + letter-spacing: 2px; + font-weight: 700; + font-size: 14px; + display: block; + margin-bottom: 15px; } + .faq-two .section-heading { - font-size: 42px; - font-weight: 800; - margin-bottom: 0; + font-size: 42px; + font-weight: 800; + margin-bottom: 0; } + .faq-two .faq-form-label { - display: block; - color: #fff; - font-size: 14px; - font-weight: 700; - margin-bottom: 8px; - letter-spacing: 0.5px; + display: block; + color: #fff; + font-size: 14px; + font-weight: 700; + margin-bottom: 8px; + letter-spacing: 0.5px; } + .faq-two .faq-error { - color: #ff6b6b; - font-size: 12px; - margin-top: 5px; - display: block; + color: #ff6b6b; + font-size: 12px; + margin-top: 5px; + display: block; } + .faq-two .faq-contact-form input, .faq-two .faq-contact-form textarea, .faq-two .faq-select { - width: 100%; - background: #fff !important; - border: 1px solid #e2e8f0; - padding: 18px 25px; - border-radius: 12px; - color: #1e293b; - outline: none; - transition: all 0.3s ease; - font-size: 15px; + width: 100%; + background: #fff !important; + border: 1px solid #e2e8f0; + padding: 18px 25px; + border-radius: 12px; + color: #1e293b; + outline: none; + transition: all 0.3s ease; + font-size: 15px; } + .faq-two .faq-select option { - background: #fff; - color: #1e293b; + background: #fff; + color: #1e293b; } + .faq-two .faq-contact-form textarea { - min-height: 150px; - resize: vertical; + min-height: 150px; + resize: vertical; } + .faq-two .faq-contact-form input:focus, .faq-two .faq-contact-form textarea:focus, .faq-two .faq-select:focus { - border-color: #3779b9; - box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); } -.faq-two .primary-btn-1, .faq-two .primary-btn-1-link { - background: #3779b9; - color: #fff; - padding: 18px 45px; - border-radius: 12px; - font-weight: 700; - border: none; - cursor: pointer; - display: inline-flex; - align-items: center; - gap: 10px; - transition: all 0.3s ease; - text-transform: uppercase; - font-size: 14px; - letter-spacing: 1px; - margin-top: 25px; - box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); + +.faq-two .primary-btn-1, +.faq-two .primary-btn-1-link { + background: #3779b9; + color: #fff; + padding: 18px 45px; + border-radius: 12px; + font-weight: 700; + border: none; + cursor: pointer; + display: inline-flex; + align-items: center; + gap: 10px; + transition: all 0.3s ease; + text-transform: uppercase; + font-size: 14px; + letter-spacing: 1px; + margin-top: 25px; + box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); } -.faq-two .primary-btn-1:hover, .faq-two .primary-btn-1-link:hover { - background: #1e293b; - transform: translateY(-3px); - box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); - color: #fff; + +.faq-two .primary-btn-1:hover, +.faq-two .primary-btn-1-link:hover { + background: #1e293b; + transform: translateY(-3px); + box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); + color: #fff; } /* Video Three Section Styles */ .video-three .video-three__inner { - border-radius: 30px; - overflow: hidden; - min-height: 500px; - display: flex; - align-items: center; - justify-content: center; - position: relative; + border-radius: 30px; + overflow: hidden; + min-height: 500px; + display: flex; + align-items: center; + justify-content: center; + position: relative; } + .video-three .video-three__inner::before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(15, 23, 42, 0.6); + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(15, 23, 42, 0.6); } + .video-three .video-content-overlay { - position: relative; - z-index: 1; - text-align: center; - max-width: 800px; - padding: 0 20px; + position: relative; + z-index: 1; + text-align: center; + max-width: 800px; + padding: 0 20px; } + .video-three .consultation-title { - font-size: 48px; - color: #fff; - font-weight: 800; - line-height: 1.2; - margin-bottom: 20px; + font-size: 48px; + color: #fff; + font-weight: 800; + line-height: 1.2; + margin-bottom: 20px; } + .video-three .consultation-text { - font-size: 20px; - color: rgba(255, 255, 255, 0.8); - margin-bottom: 0; + font-size: 20px; + color: rgba(255, 255, 255, 0.8); + margin-bottom: 0; } + @media (max-width: 991px) { - .video-three .consultation-title { font-size: 36px; } - .faq-two .contact-form-card { padding: 40px 30px; } + .video-three .consultation-title { + font-size: 36px; + } + + .faq-two .contact-form-card { + padding: 40px 30px; + } } + @media (max-width: 767px) { - .video-three .consultation-title { font-size: 30px; } + .video-three .consultation-title { + font-size: 30px; + } } /* Contact One Section Styles */ .contact-one .form-label { - display: block; - margin-bottom: 8px; - font-weight: 700; - color: #fff; - font-size: 14px; - letter-spacing: 0.5px; + display: block; + margin-bottom: 8px; + font-weight: 700; + color: #fff; + font-size: 14px; + letter-spacing: 0.5px; } -.contact-one .form-input, .contact-one .form-textarea, .contact-one .form-select-custom { - width: 100%; - padding: 18px 25px; - border: 1px solid #e2e8f0; - background-color: #fff; - border-radius: 12px; - outline: none; - font-size: 15px; - color: #1e293b; - transition: all 0.3s ease; + +.contact-one .form-input, +.contact-one .form-textarea, +.contact-one .form-select-custom { + width: 100%; + padding: 18px 25px; + border: 1px solid #e2e8f0; + background-color: #fff; + border-radius: 12px; + outline: none; + font-size: 15px; + color: #1e293b; + transition: all 0.3s ease; } + .contact-one .form-textarea { - min-height: 120px; - resize: vertical; + min-height: 120px; + resize: vertical; } -.contact-one .form-input:focus, .contact-one .form-textarea:focus, .contact-one .form-select-custom:focus { - border-color: #3779b9; - box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); + +.contact-one .form-input:focus, +.contact-one .form-textarea:focus, +.contact-one .form-select-custom:focus { + border-color: #3779b9; + box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); } + .contact-one .submit-btn { - width: 100%; - border: none; - transition: all 0.3s ease; + width: 100%; + border: none; + transition: all 0.3s ease; } + .contact-one .text-danger { - color: #ff6b6b; - font-size: 12px; - margin-top: 5px; - display: block; + color: #ff6b6b; + font-size: 12px; + margin-top: 5px; + display: block; } /* Contact Popup Styles */ .contact-popup-overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(2, 6, 11, 0.85); - backdrop-filter: blur(8px); - z-index: 9999; - display: flex; - align-items: center; - justify-content: center; - padding: 15px; - opacity: 0; - visibility: hidden; - transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(2, 6, 11, 0.85); + backdrop-filter: blur(8px); + z-index: 9999; + display: flex; + align-items: center; + justify-content: center; + padding: 15px; + opacity: 0; + visibility: hidden; + transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); } + .contact-popup-overlay.active { - opacity: 1; - visibility: visible; + opacity: 1; + visibility: visible; } + .contact-popup-content { - background: #fff; - width: 100%; - max-width: 1000px; - max-height: 95vh; - border-radius: 20px; - overflow: hidden; - box-shadow: 0 40px 100px rgba(0,0,0,0.4); - position: relative; - display: flex; - flex-direction: column; + background: #fff; + width: 100%; + max-width: 1000px; + max-height: 95vh; + border-radius: 20px; + overflow: hidden; + box-shadow: 0 40px 100px rgba(0, 0, 0, 0.4); + position: relative; + display: flex; + flex-direction: column; } + .contact-popup-content .info-panel { - padding: 50px; - display: flex; - flex-direction: column; - justify-content: center; + padding: 50px; + display: flex; + flex-direction: column; + justify-content: center; + position: relative; + color: #fff; + background: linear-gradient(135deg, #1a1f2b 0%, #3779b9 100%); } + .contact-popup-content .info-inner { - position: relative; - z-index: 1; + position: relative; + z-index: 1; } + .contact-popup-content .title { - font-size: 28px; - font-weight: 800; - margin-bottom: 15px; - line-height: 1.2; - color: #ffffff !important; + font-size: 32px; + font-weight: 800; + margin-bottom: 15px; + line-height: 1.2; + color: #ffffff !important; } + .contact-popup-content .desc { - font-size: 15px; - color: #ffffff !important; - line-height: 1.5; + font-size: 16px; + color: rgba(255, 255, 255, 0.9) !important; + line-height: 1.6; } + .contact-popup-content .contact-details { - margin-top: 30px; - margin-bottom: 25px; + margin-top: 35px; + margin-bottom: 30px; } + .contact-popup-content .detail-item { - display: flex; - align-items: center; - margin-bottom: 15px; - gap: 12px; + display: flex; + align-items: center; + margin-bottom: 20px; + gap: 15px; } + .contact-popup-content .icon { - width: 40px; - height: 40px; - border-radius: 50%; - background: rgba(255,255,255,0.1); - display: flex; - align-items: center; - justify-content: center; - font-size: 14px; + width: 48px; + height: 48px; + min-width: 48px; + flex-shrink: 0; + border-radius: 50%; + background: rgba(255, 255, 255, 0.15); + display: flex; + align-items: center; + justify-content: center; + font-size: 18px; + color: #fff; + transition: all 0.3s ease; } + +.contact-popup-content .detail-item:hover .icon { + background: #fff; + color: #3779b9; +} + +.contact-popup-content .text { + min-width: 0; + flex: 1; +} + .contact-popup-content .text p { - margin: 0; - color: #ffffff !important; - font-size: 12px; + margin: 0; + color: rgba(255, 255, 255, 0.7) !important; + font-size: 13px; + font-weight: 500; } + .contact-popup-content .text h5 { - margin: 0; - font-size: 15px; - color: #ffffff !important; + margin: 0; + font-size: 17px; + color: #ffffff !important; + font-weight: 700; + word-break: break-all; + overflow-wrap: anywhere; + line-height: 1.3; } + .contact-popup-content .social-links { - display: flex; - gap: 10px; + display: flex; + gap: 12px; } + .contact-popup-content .social-icon { - width: 32px; - height: 32px; - border-radius: 50%; - background: rgba(255,255,255,0.1); - display: flex; - align-items: center; - justify-content: center; - color: #fff; - transition: 0.3s; - font-size: 13px; + width: 36px; + height: 36px; + min-width: 36px; + flex-shrink: 0; + border-radius: 50%; + background: rgba(255, 255, 255, 0.1); + display: flex; + align-items: center; + justify-content: center; + color: #fff; + transition: 0.3s; + font-size: 14px; } + .contact-popup-content .social-icon:hover { - background: #fff; - color: #3779b9; + background: #fff; + color: #3779b9; + transform: translateY(-3px); } + .contact-popup-content .form-panel { - padding: 40px 50px; - position: relative; - background: #fff; - overflow-y: auto; - scrollbar-width: thin; - scrollbar-color: #3779b9 #f1f1f1; + padding: 40px 50px; + position: relative; + background: #fff; + overflow-y: auto; + scrollbar-width: thin; + scrollbar-color: #3779b9 #f1f1f1; } + .contact-popup-content .form-title { - font-size: 26px; - font-weight: 800; - margin-bottom: 25px; - color: #1a1f2b; - letter-spacing: -0.5px; + font-size: 26px; + font-weight: 800; + margin-bottom: 25px; + color: #1a1f2b; + letter-spacing: -0.5px; } -.contact-popup-content .form-input, -.contact-popup-content .form-textarea, + +.contact-popup-content .form-input, +.contact-popup-content .form-textarea, .contact-popup-content .form-select { - width: 100%; - padding: 14px 20px; - border-radius: 12px; - border: 1px solid #e2e8f0; - outline: none; - background: #fff; - transition: all 0.3s ease; - font-size: 14px; - color: #1e293b; + width: 100%; + padding: 14px 20px; + border-radius: 12px; + border: 1px solid #e2e8f0; + outline: none; + background: #fff; + transition: all 0.3s ease; + font-size: 14px; + color: #1e293b; } + .contact-popup-content .submit-btn { - width: 100%; - border: none; - padding: 16px; - border-radius: 12px; - margin-top: 20px; - background: #3779b9; - color: #fff; - font-weight: 700; - font-size: 15px; - cursor: pointer; - transition: all 0.3s ease; - text-transform: uppercase; - letter-spacing: 1px; + width: 100%; + border: none; + padding: 16px; + border-radius: 12px; + margin-top: 20px; + background: #3779b9; + color: #fff; + font-weight: 700; + font-size: 15px; + cursor: pointer; + transition: all 0.3s ease; + text-transform: uppercase; + letter-spacing: 1px; } + .contact-popup-content .status-wrapper { - height: 100%; - display: flex; - align-items: center; - justify-content: center; + height: 100%; + display: flex; + align-items: center; + justify-content: center; } + .contact-popup-content .close-btn { - position: absolute; - top: 20px; - right: 20px; - background: #f3f4f6; - border: none; - width: 35px; - height: 35px; - border-radius: 50%; - font-size: 18px; - cursor: pointer; - color: #1a1f2b; - display: flex; - align-items: center; - justify-content: center; - transition: all 0.3s; - z-index: 100; + position: absolute; + top: 20px; + right: 20px; + background: #f3f4f6; + border: none; + width: 35px; + height: 35px; + border-radius: 50%; + font-size: 18px; + cursor: pointer; + color: #1a1f2b; + display: flex; + align-items: center; + justify-content: center; + transition: all 0.3s; + z-index: 100; } + @media (max-width: 991px) { - .contact-popup-content .info-panel { display: none; } - .contact-popup-content .form-panel { padding: 40px 30px; } - .contact-popup-content { max-width: 550px; } + .contact-popup-content .info-panel { + display: none; + } + + .contact-popup-content .form-panel { + padding: 40px 30px; + } + + .contact-popup-content { + max-width: 550px; + } } + @media (max-width: 575px) { - .contact-popup-content .form-title { font-size: 20px; margin-bottom: 15px; } - .contact-popup-content .form-input, - .contact-popup-content .form-textarea, - .contact-popup-content .form-select { font-size: 13px; padding: 8px 12px; } - .contact-popup-content .g-recaptcha { - transform: scale(0.85); - transform-origin: 0 0; - } + .contact-popup-content .form-title { + font-size: 20px; + margin-bottom: 15px; + } + + .contact-popup-content .form-input, + .contact-popup-content .form-textarea, + .contact-popup-content .form-select { + font-size: 13px; + padding: 8px 12px; + } + + .contact-popup-content .g-recaptcha { + transform: scale(0.85); + transform-origin: 0 0; + } +} + +@media (max-width: 375px) { + .contact-popup-content .form-panel { + padding: 25px 15px; + } + + .contact-popup-content .g-recaptcha { + transform: scale(0.75); + } +} + +@media (max-width: 320px) { + .contact-popup-content .form-panel { + padding: 20px 10px; + } + + .contact-popup-content .form-title { + font-size: 18px; + } + + .contact-popup-content .submit-btn { + padding: 12px; + font-size: 13px; + } + + .contact-popup-content .g-recaptcha { + transform: scale(0.65); + } } /* About Service Section Styles */ .about-service { - padding: 80px 0; - background: #fff; - overflow: hidden; + padding: 80px 0; + background: #fff; + overflow: hidden; } + @media (max-width: 767px) { - .about-service { - padding: 60px 0; - } + .about-service { + padding: 60px 0; + } } + .about-service .experience-box { - position: absolute; - top: 0; - left: 0; - background: #3779b9; - color: #fff; - padding: 40px 30px; - z-index: 3; - text-align: center; - border-radius: 4px; - box-shadow: 0 10px 30px rgba(60, 114, 252, 0.3); + position: absolute; + top: 0; + left: 0; + background: #3779b9; + color: #fff; + padding: 40px 30px; + z-index: 3; + text-align: center; + border-radius: 4px; + box-shadow: 0 10px 30px rgba(60, 114, 252, 0.3); } + .about-service .experience-box h3 { - font-size: 54px; - font-weight: 800; - margin: 0; - line-height: 1; + font-size: 54px; + font-weight: 800; + margin: 0; + line-height: 1; } + .about-service .experience-box span { - font-size: 16px; - font-weight: 600; - display: block; - margin-top: 5px; - line-height: 1.2; + font-size: 16px; + font-weight: 600; + display: block; + margin-top: 5px; + line-height: 1.2; } + .about-service .main-img-wrap { - width: 100%; - max-width: 450px; - border-radius: 10px; - overflow: hidden; - margin-left: auto; - box-shadow: 0 20px 50px rgba(0,0,0,0.08); + width: 100%; + max-width: 450px; + border-radius: 10px; + overflow: hidden; + margin-left: auto; + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08); } + .about-service .main-img-wrap img { - width: 100%; - display: block; + width: 100%; + display: block; } + .about-service .curved-img-wrap { - position: absolute; - bottom: -40px; - left: -20px; - width: 320px; - height: 320px; - border-radius: 100px 30px 100px 100px; - overflow: hidden; - border: 8px solid #fff; - z-index: 2; - box-shadow: 0 15px 45px rgba(0,0,0,0.12); + position: absolute; + bottom: -40px; + left: -20px; + width: 320px; + height: 320px; + border-radius: 100px 30px 100px 100px; + overflow: hidden; + border: 8px solid #fff; + z-index: 2; + box-shadow: 0 15px 45px rgba(0, 0, 0, 0.12); } + .about-service .curved-img-wrap img { - width: 100%; - height: 100%; - object-fit: cover; + width: 100%; + height: 100%; + object-fit: cover; } + .about-service .dots-shape { - position: absolute; - top: 80px; - left: -40px; - z-index: 1; - opacity: 0.4; + position: absolute; + top: 80px; + left: -40px; + z-index: 1; + opacity: 0.4; } + .about-service .section-subtitle { - color: #3779b9; - font-weight: 700; - margin-bottom: 15px; - display: flex; - align-items: center; - gap: 12px; - font-size: 15px; - text-transform: uppercase; - letter-spacing: 1.5px; + color: #3779b9; + font-weight: 700; + margin-bottom: 15px; + display: flex; + align-items: center; + gap: 12px; + font-size: 15px; + text-transform: uppercase; + letter-spacing: 1.5px; } + .about-service .section-title { - font-size: 46px; - font-weight: 800; - color: #0f172a; - line-height: 1.2; - margin-bottom: 25px; + font-size: 46px; + font-weight: 800; + color: #0f172a; + line-height: 1.2; + margin-bottom: 25px; } + .about-service .section-desc { - font-size: 16px; - color: #64748b; - line-height: 1.8; - margin-bottom: 35px; + font-size: 16px; + color: #64748b; + line-height: 1.8; + margin-bottom: 35px; } + .about-service .maroon-icon { - color: #0f172a; - font-size: 18px; - margin-right: 12px; + color: #0f172a; + font-size: 18px; + margin-right: 12px; } + .about-service .bullet-item span { - font-size: 16px; - font-weight: 600; - color: #0f172a; + font-size: 16px; + font-weight: 600; + color: #0f172a; } + .about-service .about-more-btn { - display: inline-flex; - align-items: center; - background: #3779b9; - color: #fff; - padding: 8px 8px 8px 25px; - border-radius: 6px; - text-decoration: none; - font-weight: 700; - font-size: 14px; - letter-spacing: 1px; - transition: all 0.3s ease; + display: inline-flex; + align-items: center; + background: #3779b9; + color: #fff; + padding: 8px 8px 8px 25px; + border-radius: 6px; + text-decoration: none; + font-weight: 700; + font-size: 14px; + letter-spacing: 1px; + transition: all 0.3s ease; } + .about-service .about-more-btn:hover { - background: #2563eb; - transform: translateY(-2px); + background: #2563eb; + transform: translateY(-2px); } + .about-service .icon-circle { - width: 40px; - height: 40px; - background: #fff; - color: #3779b9; - border-radius: 4px; - display: flex; - align-items: center; - justify-content: center; - margin-left: 20px; + width: 40px; + height: 40px; + background: #fff; + color: #3779b9; + border-radius: 4px; + display: flex; + align-items: center; + justify-content: center; + margin-left: 20px; } + .about-service .animate-bounce-y { - animation: bounceY 4s infinite ease-in-out; + animation: bounceY 4s infinite ease-in-out; } + @media (max-width: 1199px) { - .about-service .content-area { - padding-left: 30px; - } - .about-service .section-title { - font-size: 38px; - } - .about-service .curved-img-wrap { - width: 260px; - height: 260px; - } + .about-service .content-area { + padding-left: 30px; + } + + .about-service .section-title { + font-size: 38px; + } + + .about-service .curved-img-wrap { + width: 260px; + height: 260px; + } } + @media (max-width: 991px) { - .about-service .about-image-stack { - margin-bottom: 80px; - padding-left: 0; - } - .about-service .content-area { - padding-left: 0; - } + .about-service .about-image-stack { + margin-bottom: 80px; + padding-left: 0; + } + + .about-service .content-area { + padding-left: 0; + } } + @media (max-width: 575px) { - .about-service .curved-img-wrap { - width: 200px; - height: 200px; - bottom: -20px; - left: 0; - } - .about-service .experience-box { - padding: 25px 20px; - } - .about-service .experience-box h3 { - font-size: 40px; - } + .about-service .curved-img-wrap { + width: 200px; + height: 200px; + bottom: -20px; + left: 0; + } + + .about-service .experience-box { + padding: 25px 20px; + } + + .about-service .experience-box h3 { + font-size: 40px; + } } /* Blog Section One Styles */ -.blog-section-one .blog-image { - position: relative; - display: block; - overflow: hidden; - border-radius: 20px 20px 0 0; -} -.blog-section-one .blog-image img { - width: 100%; - border-radius: 20px 20px 0 0; +.blog-section-one .blog-image { + position: relative; + display: block; + overflow: hidden; + border-radius: 20px 20px 0 0; } + .blog-section-one .blog-category-tag { - position: absolute; - bottom: 0px; - right: 0px; - background: #3779b9; - color: #fff; - padding: 10px 20px; - font-size: 13px; - font-weight: 700; - text-transform: uppercase; - z-index: 2; - border-radius: 12px 0 0 0; - letter-spacing: 0.5px; + position: absolute; + bottom: 0px; + right: 0px; + background: #3779b9; + color: #fff; + padding: 10px 20px; + font-size: 13px; + font-weight: 700; + text-transform: uppercase; + z-index: 2; + /* border-radius: 12px 0 0 0; */ + letter-spacing: 0.5px; } + .blog-section-one .blog-style-one { - border-left: 1px solid #e2e8f0; - border-right: 1px solid #e2e8f0; - border-bottom: 1px solid #e2e8f0; - border-radius: 20px 20px 15px 15px; - background: #fff; - transition: all 0.3s ease; + border-left: 1px solid #e2e8f0; + border-right: 1px solid #e2e8f0; + border-bottom: 1px solid #e2e8f0; + border-radius: 20px 20px 15px 15px; + background: #fff; + transition: all 0.3s ease; } + .blog-section-one .blog-style-one:hover { - border-color: #3779b9; - box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); } + .blog-section-one .blog-content { - padding: 30px 25px; + padding: 30px 25px; } + .blog-section-one .blog-title { - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - line-height: 1.5; - height: 3em; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + line-height: 1.5; + height: 3em; } + .blog-section-one .post-meta span { - display: inline-flex; - align-items: center; - gap: 8px; - margin-right: 15px; - font-size: 14px; - color: #64748b; + display: inline-flex; + align-items: center; + gap: 8px; + margin-right: 15px; + font-size: 14px; + color: #64748b; } + .blog-section-one .post-meta i { - color: #3779b9; + color: #3779b9; } /* Blog Section Three Styles (Home-3) */ .blog-section-three .blog-title-box { - display: flex; - align-items: flex-end; - justify-content: space-between; - flex-wrap: wrap; - gap: 20px; + display: flex; + align-items: flex-end; + justify-content: space-between; + flex-wrap: wrap; + gap: 20px; } -.blog-section-three .blog-image { - position: relative; - display: block; - overflow: hidden; - border-radius: 20px 20px 0 0; + +.blog-section-three .blog-image { + position: relative; + display: block; + overflow: hidden; + border-radius: 20px 20px 0 0; } -.blog-section-three .blog-image img { - width: 100%; - border-radius: 20px 20px 0 0; + +.blog-section-three .blog-image img { + width: 100%; + border-radius: 20px 20px 0 0; } + .blog-section-three .blog-category-tag { - position: absolute; - bottom: 0px; - right: 0px; - background: #3779b9; - color: #fff; - padding: 10px 25px; - font-size: 14px; - font-weight: 700; - text-transform: uppercase; - z-index: 2; - border-radius: 12px 0 0 0; + position: absolute; + bottom: 0px; + right: 0px; + background: #3779b9; + color: #fff; + padding: 10px 25px; + font-size: 14px; + font-weight: 700; + text-transform: uppercase; + z-index: 2; + border-radius: 12px 0 0 0; } + .blog-section-three .blog-style-one { - border-left: 1px solid #e2e8f0; - border-right: 1px solid #e2e8f0; - border-bottom: 1px solid #e2e8f0; - border-radius: 20px 20px 15px 15px; - background: #fff; - transition: all 0.3s ease; + border-left: 1px solid #e2e8f0; + border-right: 1px solid #e2e8f0; + border-bottom: 1px solid #e2e8f0; + border-radius: 20px 20px 15px 15px; + background: #fff; + transition: all 0.3s ease; } + .blog-section-three .blog-style-one:hover { - border-color: #3779b9; - box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); } + .blog-section-three .blog-content { - padding: 30px 25px; + padding: 30px 25px; } + .blog-section-three .blog-title { - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - line-height: 1.5; - height: 3em; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + line-height: 1.5; + height: 3em; } /* Blog Two Section Styles (Home-2) */ .blog-two-section .blog-two-title-area { - display: flex; - align-items: flex-end; - justify-content: space-between; - flex-wrap: wrap; - gap: 20px; + display: flex; + align-items: flex-end; + justify-content: space-between; + flex-wrap: wrap; + gap: 20px; } -.blog-two-section .blog-image { - position: relative; - display: block; - overflow: hidden; - border-radius: 20px 20px 0 0; + +.blog-two-section .blog-image { + position: relative; + display: block; + overflow: hidden; + border-radius: 20px 20px 0 0; } -.blog-two-section .blog-image img { - width: 100%; - border-radius: 20px 20px 0 0; + +.blog-two-section .blog-image img { + width: 100%; + border-radius: 20px 20px 0 0; } + .blog-two-section .blog-category-tag { - position: absolute; - bottom: 0px; - right: 0px; - background: #3779b9; - color: #fff; - padding: 10px 20px; - font-size: 11px; - font-weight: 700; - text-transform: uppercase; - z-index: 2; - border-radius: 12px 0 0 0; + position: absolute; + bottom: 0px; + right: 0px; + background: #3779b9; + color: #fff; + padding: 10px 20px; + font-size: 11px; + font-weight: 700; + text-transform: uppercase; + z-index: 2; + border-radius: 12px 0 0 0; } + .blog-two-section .blog-style-two { - border-left: 1px solid #e2e8f0; - border-right: 1px solid #e2e8f0; - border-bottom: 1px solid #e2e8f0; - border-radius: 20px 20px 15px 15px; - background: #fff; - transition: all 0.3s ease; - height: 100%; + border-left: 1px solid #e2e8f0; + border-right: 1px solid #e2e8f0; + border-bottom: 1px solid #e2e8f0; + border-radius: 20px 20px 15px 15px; + background: #fff; + transition: all 0.3s ease; + height: 100%; } + .blog-two-section .blog-style-two:hover { - border-color: #3779b9; - box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); } + .blog-two-section .blog-content-area { - padding: 30px 25px; + padding: 30px 25px; } + .blog-two-section .blog-title { - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - line-height: 1.5; - height: 3em; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + line-height: 1.5; + height: 3em; } /* FAQ Page Section Styles */ .faq-page-section { - background: #f8fbff; - padding: 80px 0; + background: #f8fbff; + padding: 80px 0; } + .faq-page-section .section-subtitle { - color: #3779b9; - font-weight: 700; - margin-bottom: 15px; - display: inline-flex; - align-items: center; - gap: 10px; - text-transform: uppercase; - letter-spacing: 1px; - font-size: 14px; + color: #3779b9; + font-weight: 700; + margin-bottom: 15px; + display: inline-flex; + align-items: center; + gap: 10px; + text-transform: uppercase; + letter-spacing: 1px; + font-size: 14px; } + .faq-page-section .section-title { - font-size: 48px; - font-weight: 800; - color: #1a1f2b; - margin-bottom: 20px; + font-size: 48px; + font-weight: 800; + color: #1a1f2b; + margin-bottom: 20px; } + .faq-page-section .section-desc { - color: #64748b; - font-size: 16px; + color: #64748b; + font-size: 16px; } + .faq-page-section .faq-item { - background: #fff; - border-radius: 12px; - border: 1px solid #e2e8f0; - margin-bottom: 15px; - overflow: hidden; - transition: all 0.3s ease; - box-shadow: 0 4px 15px rgba(0,0,0,0.02); + background: #fff; + border-radius: 12px; + border: 1px solid #e2e8f0; + margin-bottom: 15px; + overflow: hidden; + transition: all 0.3s ease; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02); } + .faq-page-section .faq-item.active { - border-color: #3779b9; - box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 10px 30px rgba(55, 121, 185, 0.1); } + .faq-page-section .faq-question { - width: 100%; - padding: 18px 25px; - display: flex; - justify-content: space-between; - align-items: center; - background: none; - border: none; - text-align: left; - cursor: pointer; - outline: none; + width: 100%; + padding: 18px 25px; + display: flex; + justify-content: space-between; + align-items: center; + background: none; + border: none; + text-align: left; + cursor: pointer; + outline: none; } + .faq-page-section .question-text { - font-size: 15px; - font-weight: 700; - color: #1a1f2b; - line-height: 1.4; + font-size: 15px; + font-weight: 700; + color: #1a1f2b; + line-height: 1.4; } + .faq-page-section .faq-item.active .question-text { - color: #3779b9; + color: #3779b9; } + .faq-page-section .faq-icon { - width: 28px; - height: 28px; - min-width: 28px; - background: #f1f5f9; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - font-size: 11px; - color: #64748b; - transition: all 0.3s ease; + width: 28px; + height: 28px; + min-width: 28px; + background: #f1f5f9; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 11px; + color: #64748b; + transition: all 0.3s ease; } + .faq-page-section .faq-item.active .faq-icon { - background: #3779b9; - color: #fff; - transform: rotate(180deg); + background: #3779b9; + color: #fff; + transform: rotate(180deg); } + .faq-page-section .faq-answer { - max-height: 0; - overflow: hidden; - transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); + max-height: 0; + overflow: hidden; + transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); } + .faq-page-section .faq-answer.show { - max-height: 300px; + max-height: 300px; } + .faq-page-section .answer-inner { - padding: 0 25px 20px; - color: #64748b; - line-height: 1.6; - font-size: 14px; + padding: 0 25px 20px; + color: #64748b; + line-height: 1.6; + font-size: 14px; } + .faq-page-section .faq-center-image-wrap { - padding: 0 15px; + padding: 0 15px; } + .faq-page-section .main-faq-img { - width: 100%; - max-width: 400px; - border-radius: 20px; - box-shadow: 0 20px 40px rgba(0,0,0,0.1); + width: 100%; + max-width: 400px; + border-radius: 20px; + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); } + @media (max-width: 991px) { - .faq-page-section .section-desc { - margin-top: 20px !important; - padding-left: 0 !important; - border-left: none !important; - } - .faq-page-section .col-lg-4 { - margin-bottom: 30px; - } - .faq-page-section .faq-center-image-wrap { - order: -1; - margin-bottom: 40px; - } - .faq-page-section .section-title { - font-size: 36px; - } + .faq-page-section .section-desc { + margin-top: 20px !important; + padding-left: 0 !important; + border-left: none !important; + } + + .faq-page-section .col-lg-4 { + margin-bottom: 30px; + } + + .faq-page-section .faq-center-image-wrap { + order: -1; + margin-bottom: 40px; + } + + .faq-page-section .section-title { + font-size: 36px; + } } /* Contact Status Styles */ .status-container { - display: flex; - align-items: center; - justify-content: center; - width: 100%; - min-height: 400px; - padding: 20px; - animation: fadeIn 0.5s ease-out; + display: flex; + align-items: center; + justify-content: center; + width: 100%; + min-height: 400px; + padding: 20px; + animation: fadeIn 0.5s ease-out; } -.status-container .status-card { - background: #fff; - width: 100%; - max-width: 400px; - padding: 60px 40px; - border-radius: 24px; - text-align: center; - position: relative; - overflow: hidden; - box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05); - animation: slideUp 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); -} -.status-container .bubbles { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none; -} -.status-container .bubble { - position: absolute; - border-radius: 50%; - opacity: 0.6; -} -.status-container.success .bubble { background: #87b031; } -.status-container.error .bubble { background: #f1595d; } -.status-container .bubble-1 { width: 12px; height: 12px; top: 15%; left: 10%; animation: float 3s infinite ease-in-out; } -.status-container .bubble-2 { width: 8px; height: 8px; top: 25%; right: 15%; animation: float 4s infinite ease-in-out; } -.status-container .bubble-3 { width: 15px; height: 15px; bottom: 20%; left: 15%; animation: float 5s infinite ease-in-out; } -.status-container .bubble-4 { width: 10px; height: 10px; bottom: 15%; right: 10%; animation: float 3.5s infinite ease-in-out; } -.status-container .bubble-5 { width: 6px; height: 6px; top: 40%; left: 5%; animation: float 6s infinite ease-in-out; } -.status-container .bubble-6 { width: 14px; height: 14px; top: 60%; right: 5%; animation: float 4.5s infinite ease-in-out; } -.status-container .bubble-7 { width: 9px; height: 9px; top: 10%; right: 30%; animation: float 3.2s infinite ease-in-out; } -.status-container .bubble-8 { width: 11px; height: 11px; bottom: 10%; left: 40%; animation: float 4.8s infinite ease-in-out; } -.status-container .bubble-9 { width: 7px; height: 7px; top: 50%; left: 20%; animation: float 5.5s infinite ease-in-out; } -.status-container .bubble-10 { width: 13px; height: 13px; bottom: 40%; right: 25%; animation: float 3.8s infinite ease-in-out; } -.status-container .bubble-11 { width: 8px; height: 8px; top: 70%; left: 35%; animation: float 4.2s infinite ease-in-out; } -.status-container .bubble-12 { width: 10px; height: 10px; top: 5%; left: 50%; animation: float 3.6s infinite ease-in-out; } +.status-container .status-card { + background: #fff; + width: 100%; + max-width: 400px; + padding: 60px 40px; + border-radius: 24px; + text-align: center; + position: relative; + overflow: hidden; + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05); + animation: slideUp 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); +} + +.status-container .bubbles { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + pointer-events: none; +} + +.status-container .bubble { + position: absolute; + border-radius: 50%; + opacity: 0.6; +} + +.status-container.success .bubble { + background: #87b031; +} + +.status-container.error .bubble { + background: #f1595d; +} + +.status-container .bubble-1 { + width: 12px; + height: 12px; + top: 15%; + left: 10%; + animation: float 3s infinite ease-in-out; +} + +.status-container .bubble-2 { + width: 8px; + height: 8px; + top: 25%; + right: 15%; + animation: float 4s infinite ease-in-out; +} + +.status-container .bubble-3 { + width: 15px; + height: 15px; + bottom: 20%; + left: 15%; + animation: float 5s infinite ease-in-out; +} + +.status-container .bubble-4 { + width: 10px; + height: 10px; + bottom: 15%; + right: 10%; + animation: float 3.5s infinite ease-in-out; +} + +.status-container .bubble-5 { + width: 6px; + height: 6px; + top: 40%; + left: 5%; + animation: float 6s infinite ease-in-out; +} + +.status-container .bubble-6 { + width: 14px; + height: 14px; + top: 60%; + right: 5%; + animation: float 4.5s infinite ease-in-out; +} + +.status-container .bubble-7 { + width: 9px; + height: 9px; + top: 10%; + right: 30%; + animation: float 3.2s infinite ease-in-out; +} + +.status-container .bubble-8 { + width: 11px; + height: 11px; + bottom: 10%; + left: 40%; + animation: float 4.8s infinite ease-in-out; +} + +.status-container .bubble-9 { + width: 7px; + height: 7px; + top: 50%; + left: 20%; + animation: float 5.5s infinite ease-in-out; +} + +.status-container .bubble-10 { + width: 13px; + height: 13px; + bottom: 40%; + right: 25%; + animation: float 3.8s infinite ease-in-out; +} + +.status-container .bubble-11 { + width: 8px; + height: 8px; + top: 70%; + left: 35%; + animation: float 4.2s infinite ease-in-out; +} + +.status-container .bubble-12 { + width: 10px; + height: 10px; + top: 5%; + left: 50%; + animation: float 3.6s infinite ease-in-out; +} .status-container .icon-wrapper { - margin-bottom: 30px; - display: flex; - justify-content: center; - animation: bounce 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s both; + margin-bottom: 30px; + display: flex; + justify-content: center; + animation: bounce 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s both; } + .status-container .icon-circle { - width: 100px; - height: 100px; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - font-size: 40px; - position: relative; + width: 100px; + height: 100px; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 40px; + position: relative; } + .status-container.success .icon-circle { - background: rgba(135, 176, 49, 0.15); - color: #87b031; - border: 4px solid #87b031; + background: rgba(135, 176, 49, 0.15); + color: #87b031; + border: 4px solid #87b031; } + .status-container.error .icon-circle { - background: rgba(241, 89, 93, 0.15); - color: #f1595d; - border: 4px solid #f1595d; + background: rgba(241, 89, 93, 0.15); + color: #f1595d; + border: 4px solid #f1595d; } + .status-container .status-title { - font-size: 32px; - font-weight: 800; - margin-bottom: 12px; - animation: fadeIn 0.5s ease-out 0.5s both; + font-size: 32px; + font-weight: 800; + margin-bottom: 12px; + animation: fadeIn 0.5s ease-out 0.5s both; +} + +.status-container.success .status-title { + color: #87b031; +} + +.status-container.error .status-title { + color: #f1595d; } -.status-container.success .status-title { color: #87b031; } -.status-container.error .status-title { color: #f1595d; } .status-container .status-message { - font-size: 16px; - color: #64748b; - margin-bottom: 40px; - line-height: 1.6; - animation: fadeIn 0.5s ease-out 0.6s both; + font-size: 16px; + color: #64748b; + margin-bottom: 40px; + line-height: 1.6; + animation: fadeIn 0.5s ease-out 0.6s both; } + .status-container .status-btn { - padding: 16px 40px; - border: none; - border-radius: 14px; - font-weight: 700; - font-size: 16px; - cursor: pointer; - transition: all 0.3s ease; - width: 100%; - max-width: 200px; - animation: fadeIn 0.5s ease-out 0.7s both; + padding: 16px 40px; + border: none; + border-radius: 14px; + font-weight: 700; + font-size: 16px; + cursor: pointer; + transition: all 0.3s ease; + width: 100%; + max-width: 200px; + animation: fadeIn 0.5s ease-out 0.7s both; } + .status-container.success .status-btn { - background: #87b031; - color: #fff; - box-shadow: 0 10px 20px rgba(135, 176, 49, 0.3); + background: #87b031; + color: #fff; + box-shadow: 0 10px 20px rgba(135, 176, 49, 0.3); } + .status-container.success .status-btn:hover { - background: #769a2b; - transform: translateY(-3px); - box-shadow: 0 15px 30px rgba(135, 176, 49, 0.4); + background: #769a2b; + transform: translateY(-3px); + box-shadow: 0 15px 30px rgba(135, 176, 49, 0.4); } + .status-container.error .status-btn { - background: #f1595d; - color: #fff; - box-shadow: 0 10px 20px rgba(241, 89, 93, 0.3); + background: #f1595d; + color: #fff; + box-shadow: 0 10px 20px rgba(241, 89, 93, 0.3); } + .status-container.error .status-btn:hover { - background: #e04a4e; - transform: translateY(-3px); - box-shadow: 0 15px 30px rgba(241, 89, 93, 0.4); + background: #e04a4e; + transform: translateY(-3px); + box-shadow: 0 15px 30px rgba(241, 89, 93, 0.4); } /* Map Section Styles */ .map-area { - margin-bottom: -10px; + margin-bottom: -10px; } + .map-area .map-wrapper { - height: 500px; - width: 100%; - overflow: hidden; - border: none; + height: 500px; + width: 100%; + overflow: hidden; + border: none; } + .map-area iframe { - display: block; - width: 100%; - height: 100%; - border: none; - background: transparent; - filter: grayscale(1); + display: block; + width: 100%; + height: 100%; + border: none; + background: transparent; + filter: grayscale(1); } /* Contact Section Styles (Root) */ .contact-area .form-label { - display: block; - margin-bottom: 10px; - font-weight: 700; - color: #fff; - font-size: 15px; - letter-spacing: 0.5px; + display: block; + margin-bottom: 10px; + font-weight: 700; + color: #fff; + font-size: 15px; + letter-spacing: 0.5px; } + .contact-area .contact-info-item .icon { - width: 75px; - height: 75px; - background: #fff; - border: 1px solid rgba(99, 102, 241, 0.2); - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - margin-right: 25px; - color: #3779b9; - font-size: 28px; - transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); - box-shadow: 0 10px 25px rgba(99, 102, 241, 0.1); + width: 75px; + height: 75px; + background: #fff; + border: 1px solid rgba(99, 102, 241, 0.2); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + margin-right: 25px; + color: #3779b9; + font-size: 28px; + transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); + box-shadow: 0 10px 25px rgba(99, 102, 241, 0.1); } + .contact-area .contact-info-item:hover .icon { - background: #3779b9; - color: #fff; - transform: scale(1.1) rotate(10deg); - box-shadow: 0 15px 30px rgba(99, 102, 241, 0.3); + background: #3779b9; + color: #fff; + transform: scale(1.1) rotate(10deg); + box-shadow: 0 15px 30px rgba(99, 102, 241, 0.3); } + .contact-area .contact-info-item .content span { - display: block; - font-size: 13px; - color: #64748b; - margin-bottom: 6px; - text-transform: uppercase; - letter-spacing: 1px; - font-weight: 600; + display: block; + font-size: 13px; + color: #64748b; + margin-bottom: 6px; + text-transform: uppercase; + letter-spacing: 1px; + font-weight: 600; } + .contact-area .contact-info-item .content h6 { - font-size: 22px; - font-weight: 700; - margin: 0; - color: #1e293b; + font-size: 22px; + font-weight: 700; + margin: 0; + color: #1e293b; } + .contact-area .contact-info-item .content h6 a { - color: inherit; - text-decoration: none; - transition: color 0.3s ease; + color: inherit; + text-decoration: none; + transition: color 0.3s ease; } + .contact-area .contact-info-item .content h6 a:hover { - color: #3779b9; + color: #3779b9; } + .contact-area .contact-form-wrapper { - background: #1a1f2b; - padding: 60px; - border-radius: 24px; - box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); + background: #1a1f2b; + padding: 60px; + border-radius: 24px; + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); } + .contact-area .contact-form input, .contact-area .contact-form textarea, .contact-area .contact-form select { - width: 100%; - padding: 18px 25px; - border: 1px solid #e2e8f0; - background: #fff !important; - border-radius: 12px; - outline: none; - transition: all 0.3s ease; - font-size: 15px; - color: #1e293b; + width: 100%; + padding: 18px 25px; + border: 1px solid #e2e8f0; + background: #fff !important; + border-radius: 12px; + outline: none; + transition: all 0.3s ease; + font-size: 15px; + color: #1e293b; } + .contact-area .contact-form textarea { - min-height: 150px; - resize: vertical; + min-height: 150px; + resize: vertical; } + .contact-area .contact-form input:focus, .contact-area .contact-form textarea:focus, .contact-area .contact-form select:focus { - border-color: #3779b9; - box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); + border-color: #3779b9; + box-shadow: 0 0 0 4px rgba(55, 121, 185, 0.1); } + .contact-area .primary-btn-1 { - background: #3779b9; - color: #fff; - padding: 20px 30px; - border: none; - border-radius: 12px; - font-weight: 700; - cursor: pointer; - transition: all 0.3s ease; - text-transform: uppercase; - letter-spacing: 1.5px; - font-size: 15px; - margin-top: 10px; - box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); + background: #3779b9; + color: #fff; + padding: 20px 30px; + border: none; + border-radius: 12px; + font-weight: 700; + cursor: pointer; + transition: all 0.3s ease; + text-transform: uppercase; + letter-spacing: 1.5px; + font-size: 15px; + margin-top: 10px; + box-shadow: 0 10px 20px rgba(99, 102, 241, 0.2); } + .contact-area .primary-btn-1:hover { - background: #1e293b; - transform: translateY(-3px); - box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); + background: #1e293b; + transform: translateY(-3px); + box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3); } + .contact-area .text-danger { - color: #ff6b6b; - font-size: 12px; - margin-top: 5px; - display: block; + color: #ff6b6b; + font-size: 12px; + margin-top: 5px; + display: block; } + @media (max-width: 991px) { - .contact-area .contact-form-wrapper { - margin-top: 60px; - padding: 40px; - } + .contact-area .contact-form-wrapper { + margin-top: 60px; + padding: 40px; + } } + @media (max-width: 575px) { - .contact-area .contact-form-wrapper { - padding: 25px; - } + .contact-area .contact-form-wrapper { + padding: 25px; + } } + +/* Success Page Unification Styles */ +.success-hero-section { + min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + position: relative; + padding: 60px 0; + background: #ffffff; + overflow: hidden; +} + +.success-hero-section .bg-shapes .shape { + position: absolute; + z-index: 0; + opacity: 0.15; +} + +.success-hero-section .shape-1 { + width: 500px; + height: 500px; + background: #87b031; + top: -150px; + right: -150px; + border-radius: 50%; +} + +.success-hero-section .shape-2 { + width: 450px; + height: 450px; + background: #a4d041; + bottom: -100px; + left: -100px; + border-radius: 50%; +} + +.success-hero-section .shape-3 { + width: 300px; + height: 300px; + background: #d1ef8f; + top: 15%; + left: 5%; + border-radius: 50%; +} + +.success-content-wrapper { + position: relative; + z-index: 1; + display: flex; + justify-content: center; + animation: fadeInUp 1.2s cubic-bezier(0.165, 0.84, 0.44, 1); + width: 100%; +} + +.success-card-glass { + background: #ffffff; + border: 1px solid #e2e8f0; + border-radius: 60px; + width: 100%; + max-width: 850px; + display: flex; + flex-direction: column; + align-items: center; + padding: 90px 60px; + box-shadow: 0 30px 60px rgba(135, 176, 49, 0.1); + text-align: center; + position: relative; +} + +.success-status-icon { + position: relative; + margin-bottom: 50px; +} + +/* .icon-main-circle { + width: 180px; + height: 180px; + background: #ffffff; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + position: relative; + z-index: 2; + border: 4px solid #87b031; +} */ + +.checkmark-svg { + width: 120px; + height: 120px; + z-index: 3; +} + +.checkmark { + width: 100%; + height: 100%; + border-radius: 50%; + display: block; + stroke-width: 8; + stroke: #87b031; + stroke-miterlimit: 10; + animation: scale .3s ease-in-out .9s both; +} + +.checkmark__circle { + stroke-dasharray: 166; + stroke-dashoffset: 166; + stroke-width: 8; + stroke-miterlimit: 10; + stroke: #87b031; + fill: none; + animation: stroke 0.8s cubic-bezier(0.65, 0, 0.45, 1) forwards; +} + +.checkmark__check { + transform-origin: 50% 50%; + stroke-dasharray: 48; + stroke-dashoffset: 48; + animation: stroke 0.4s cubic-bezier(0.65, 0, 0.45, 1) 0.9s forwards; +} + +.floating-elements { + position: absolute; + top: 50%; + left: 50%; + width: 300px; + height: 300px; + transform: translate(-50%, -50%); + pointer-events: none; +} + +.floating-elements .dot { + position: absolute; + background: #87b031; + border-radius: 50%; + opacity: 0; +} + +.dot-1 { + width: 8px; + height: 8px; + top: 10%; + left: 20%; + animation: explode 2s 1s infinite; +} + +.dot-2 { + width: 12px; + height: 12px; + top: 20%; + right: 10%; + animation: explode 2.5s 1.2s infinite; + background: #a4d041 !important; +} + +.dot-3 { + width: 6px; + height: 6px; + bottom: 15%; + left: 15%; + animation: explode 3s 0.8s infinite; +} + +.dot-4 { + width: 10px; + height: 10px; + bottom: 30%; + right: 20%; + animation: explode 2.2s 1.5s infinite; + background: #d1ef8f !important; +} + +.dot-5 { + width: 7px; + height: 7px; + top: 40%; + left: 30%; + animation: explode 2.8s 1.1s infinite; +} + +.dot-6 { + width: 9px; + height: 9px; + top: 60%; + right: 30%; + animation: explode 2.4s 1.3s infinite; +} + +.dot-7 { + width: 5px; + height: 5px; + top: 15%; + left: 50%; + animation: explode 2.9s 0.9s infinite; + background: #87b031 !important; +} + +.dot-8 { + width: 11px; + height: 11px; + bottom: 10%; + left: 45%; + animation: explode 2.6s 1.4s infinite; + background: #a4d041 !important; +} + +.dot-9 { + width: 8px; + height: 8px; + top: 80%; + left: 10%; + animation: explode 2.7s 1.2s infinite; +} + +.dot-10 { + width: 10px; + height: 10px; + top: 5%; + right: 40%; + animation: explode 2.3s 1s infinite; + background: #d1ef8f !important; +} + +@keyframes stroke { + 100% { + stroke-dashoffset: 0; + } +} + +@keyframes scale { + + 0%, + 100% { + transform: none; + } + + 50% { + transform: scale3d(1.1, 1.1, 1); + } +} + +@keyframes fadeInUp { + from { + opacity: 0; + transform: translateY(60px); + } + + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes explode { + 0% { + transform: scale(0) translate(0, 0); + opacity: 0; + } + + 50% { + opacity: 0.8; + } + + 100% { + transform: scale(1.5) translate(var(--x, 50px), var(--y, 50px)); + opacity: 0; + } +} + +/* Unique motion for dots using nth-child */ +.dot:nth-child(odd) { + --x: -60px; + --y: -40px; +} + +.dot:nth-child(even) { + --x: 60px; + --y: -60px; +} + +.dot:nth-child(3n) { + --x: -40px; + --y: 60px; +} + +.dot:nth-child(4n) { + --x: 70px; + --y: 50px; +} + +.success-title { + font-size: 64px; + font-weight: 900; + color: #87b031; + margin-bottom: 12px; + letter-spacing: -2px; +} + +.success-subtitle { + font-size: 24px; + color: #87b031; + font-weight: 700; + margin-bottom: 35px; +} + +.success-card-glass .divider { + width: 80px; + height: 5px; + background: #87b031; + margin: 0 auto 35px; + border-radius: 3px; +} + +.success-description { + font-size: 21px; + color: #4b5563; + line-height: 1.8; + margin-bottom: 50px; +} + +.action-buttons { + display: flex; + gap: 20px; + justify-content: center; + flex-wrap: wrap; +} + +.home-btn { + background: #1a1f2b !important; + color: #fff !important; + padding: 18px 45px !important; + font-size: 17px !important; + transition: all 0.3s ease !important; + text-decoration: none !important; + border-radius: 8px !important; + font-weight: 700 !important; +} + +.home-btn:hover { + background: #87b031 !important; + transform: translateY(-3px); + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); +} + +@media (max-width: 768px) { + .success-card-glass { + padding: 60px 25px; + border-radius: 40px; + } + + .success-title { + font-size: 42px; + } + + .success-subtitle { + font-size: 19px; + } + + .success-description { + font-size: 17px; + } + + /* .icon-main-circle { + width: 140px; + height: 140px; + } */ + + .checkmark-svg { + width: 90px; + height: 90px; + } +} + +/* ============================================================ + WHY CHOOSE US - Parallax & Style Refinements + ============================================================ */ +.why-choose-us { + position: relative; + overflow: hidden; + background-color: #000; +} + +.why-choose-us__bg { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-attachment: fixed; + background-size: cover; + background-position: center; + z-index: 0; +} + +.why-choose-us__overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.75); + z-index: 1; +} + +.why-choose-us .container { + position: relative; + z-index: 2; +} + +.why-choose-us__image-wrapper { + overflow: hidden; + border-radius: 12px; + max-height: 400px; + /* Reduced height to match content better */ +} + +.why-choose-us__main-image { + width: 100%; + height: 400px; + object-fit: cover; + display: block; +} + +.why-choose-us .note-item i { + color: #3779b9 !important; + /* Keep the brand color for icons */ +} + +/* ============================================================ + BLOG DETAILS SECTION + ============================================================ */ +.blog-details-img img { + height: 500px; + width: 100%; + object-fit: cover; + border-radius: 0 !important; + /* User requested no border radius */ + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); +} + +.details-text img { + border-radius: 0 !important; + margin: 20px 0; +} + +.blog-meta { + display: flex; + gap: 30px; + font-size: 16px; + color: #64748b; + font-weight: 600; + margin-bottom: 25px; + /* Reduced */ +} + +.blog-meta i { + color: #3779b9; + margin-right: 8px; +} + +.details-title { + font-size: 42px; + font-weight: 800; + color: #0f172a; + line-height: 1.2; + margin-bottom: 25px; + /* Reduced */ +} + +.details-text { + font-size: 18px; + line-height: 1.8; + color: #475569; +} + +.details-text p { + margin-top: 20px !important; + /* Reduced for better balance */ + margin-bottom: 20px !important; +} + +.details-text h4 { + font-size: 22px !important; + /* Increased for better prominence */ + font-weight: 700; + color: #1e293b; + margin-top: 35px !important; + /* Reduced for better balance */ + margin-bottom: 20px !important; + /* Reduced for better balance */ +} + +.details-text ul, +.details-text ol { + margin-top: 20px !important; + margin-bottom: 20px !important; + padding-left: 20px; +} + +.details-text ul { + list-style-type: disc; +} + +.details-text ol { + list-style-type: decimal; +} + +.details-text li { + font-size: 16px; + /* Matched to paragraph size */ + margin-bottom: 10px; + /* Increased for clear view */ + padding-left: 10px; +} + +.details-text a { + color: #3779b9; + font-weight: 600; + text-decoration: none; +} + +.details-text a:hover { + color: #2c6195; +} + +.blog-blockquote { + background: #f8fbff; + padding: 40px 60px; + border-left: 5px solid #3779b9; + border-radius: 0 24px 24px 0; + position: relative; + margin: 30px 0; + /* Reduced */ +} + +.blog-blockquote p { + font-size: 22px; + font-style: italic; + font-weight: 700; + color: #1e293b; + line-height: 1.5; + margin: 0; +} + +/* Override primary-btn-5 to NOT be white */ +.primary-btn-5 { + background-color: #3779b9 !important; + color: #fff !important; + border: 1px solid #3779b9 !important; +} + +.primary-btn-5:hover { + background-color: #1e293b !important; + border-color: #1e293b !important; + color: #fff !important; +} + +.primary-btn-5 span { + background-color: #1e293b !important; +} + +/* Blog Card Footer Styles */ +.blog-footer { + margin-top: 15px; + padding-top: 10px; +} + +.post-meta-admin { + display: flex; + align-items: center; + gap: 10px; + font-size: 15px; + color: #0f172a; + font-weight: 500; +} + +.post-meta-admin i.icon-blue { + color: #3779b9; + font-size: 22px; +} + +.learn-more-link { + font-size: 16px; + font-weight: 700; + color: #0f172a; + text-decoration: none; + transition: all 0.3s ease; +} + +.learn-more-link span { + color: #3779b9; + margin-left: 5px; + font-size: 18px; +} + +.learn-more-link:hover { + color: #3779b9; +} + +.border-top { + border-top: 1px solid #e2e8f0; +} + +/* ============================================================ + BLOG SECTION & PAGINATION (GLOBAL) + ============================================================ */ +.blog-section-one.section-space { + padding-bottom: 0; +} + +.pagination-wrapper { + padding-top: 60px; + padding-bottom: 80px; + text-align: center; +} + +.pagination-items { + display: flex !important; + justify-content: center; + align-items: center; + gap: 12px !important; +} + +.pagination-arrow { + width: 48px; + height: 48px; + background: white; + border: 1px solid #eef2f6; + display: flex !important; + align-items: center; + justify-content: center; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04); + border-radius: 6px; + color: #3779b9; + font-size: 14px; + cursor: pointer; +} + +.pagination-arrow:hover:not(.disabled) { + background: #3779b9 !important; + color: white !important; + border-color: #3779b9 !important; + transform: translateY(-2px); + box-shadow: 0 6px 15px rgba(55, 121, 185, 0.2); +} + +.pagination-arrow.disabled { + background: #f8fafc !important; + color: #cbd5e1 !important; + border-color: #f1f5f9 !important; + box-shadow: none !important; + opacity: 0.6 !important; + cursor: not-allowed; +} + +.pagination-btn { + width: 48px; + height: 48px; + background: white; + border: 1px solid #eef2f6; + border-radius: 6px; + font-weight: 700; + font-size: 16px; + color: #475569; + display: flex !important; + align-items: center; + justify-content: center; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04); + cursor: pointer; +} + +.pagination-btn.active { + background: #3779b9 !important; + color: white !important; + border-color: #3779b9 !important; + box-shadow: 0 6px 15px rgba(55, 121, 185, 0.3); +} + +.pagination-btn:hover:not(.active) { + background: #f1f5f9; + border-color: #3779b9; + color: #3779b9; + transform: translateY(-2px); +} + +@media (max-width: 991px) { + .details-title { + font-size: 32px; + } + + .blog-details-img img { + height: 400px; + } + + .blog-blockquote { + padding: 30px 40px; + } +} + +@media (max-width: 767px) { + .blog-meta { + flex-direction: column; + gap: 10px; + } + + .blog-details-img img { + height: 300px; + } +} + +/* Custom About Features for Metatron */ +.about-feature-item-3 { + display: flex; + gap: 20px; + align-items: flex-start; + padding: 10px 0; +} + +.about-feature-item-3 .icon { + width: 60px; + height: 60px; + min-width: 60px; + background: rgba(55, 121, 185, 0.1); + border-radius: 12px; + display: flex; + align-items: center; + justify-content: center; + color: #3779b9; + font-size: 24px; + transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); +} + +.about-feature-item-3:hover .icon { + background: #3779b9; + color: #fff; + transform: translateY(-8px) scale(1.1); + box-shadow: 0 10px 20px rgba(55, 121, 185, 0.2); +} + +.about-feature-item-3 .content { + flex: 1; +} + +.about-feature-item-3 .tagline { + font-size: 13px; + color: #3779b9; + text-transform: uppercase; + font-weight: 600; + margin-bottom: 5px; + display: block; + letter-spacing: 0.5px; +} + +.about-feature-item-3 .title { + font-size: 22px; + font-weight: 700; + color: #0d1e3d; + margin-bottom: 8px; + transition: color 0.3s ease; +} + +.about-feature-item-3:hover .title { + color: #3779b9; +} + +.about-feature-item-3 p { + color: #555; + margin-bottom: 0; + font-size: 15px; + line-height: 1.6; +} \ No newline at end of file diff --git a/src/app/home-1/page.tsx b/src/app/home-1/page.tsx deleted file mode 100644 index de2cf6f..0000000 --- a/src/app/home-1/page.tsx +++ /dev/null @@ -1,45 +0,0 @@ -"use client"; - -import React, { useEffect } from "react"; -import Header1 from "@/components/layout/Header1"; -import Footer1 from "@/components/layout/Footer1"; - -import BannerSection from "@/components/home/home-1/BannerSection"; -import FeaturesSection from "@/components/home/home-1/FeaturesSection"; -import AboutSection from "@/components/home/home-1/AboutSection"; -import ServiceSliderSection from "@/components/home/home-1/ServiceSliderSection"; -import CtaSection from "@/components/home/home-1/CtaSection"; -import ProjectsSection from "@/components/home/home-1/ProjectsSection"; -import ChooseSection from "@/components/home/home-1/ChooseSection"; -import TeamSection from "@/components/home/home-1/TeamSection"; -import TestimonialsSection from "@/components/home/home-1/TestimonialsSection"; -import BlogSection from "@/components/home/home-1/BlogSection"; -import BrandSection from "@/components/home/home-1/BrandSection"; - -export default function Home1() { - useEffect(() => { - if (typeof window !== "undefined" && (window as any).initMetatron) { - (window as any).initMetatron(); - } - }, []); - - return ( - <> - -
- - - - - - - - - - - -
- - - ); -} diff --git a/src/app/home-3/page.tsx b/src/app/home-3/page.tsx deleted file mode 100644 index d0eb244..0000000 --- a/src/app/home-3/page.tsx +++ /dev/null @@ -1,46 +0,0 @@ -"use client"; - -import React, { useEffect } from "react"; -import Header3 from "@/components/layout/Header3"; -import Footer3 from "@/components/layout/Footer3"; - -import BannerSection from "@/components/home/home-3/BannerSection"; -import AboutSection from "@/components/home/home-3/AboutSection"; -import HelpFormSection from "@/components/home/home-3/HelpFormSection"; -import ServiceSection from "@/components/home/home-3/ServiceSection"; -import ChooseSection from "@/components/home/home-3/ChooseSection"; -import ProjectsSection from "@/components/home/home-3/ProjectsSection"; -import BrandsSection from "@/components/home/home-3/BrandsSection"; -import FaqSection from "@/components/home/home-3/FaqSection"; -import BlogSection from "@/components/home/home-3/BlogSection"; - -export default function Home3() { - useEffect(() => { - const init = () => { - if (typeof window !== "undefined" && (window as any).initMetatron && (window as any).jQuery) { - (window as any).initMetatron(); - } else { - setTimeout(init, 100); - } - }; - init(); - }, []); - - return ( - <> - -
- - - - - - - - - -
- - - ); -} diff --git a/src/app/mobile-app-development-service/success/page.tsx b/src/app/mobile-app-development-service/success/page.tsx new file mode 100644 index 0000000..0e71b8d --- /dev/null +++ b/src/app/mobile-app-development-service/success/page.tsx @@ -0,0 +1,63 @@ +"use client"; + +import React from "react"; +import Link from "next/link"; +import MainLayout from "@/components/mobile-app-development-service/support/layout/MainLayout"; +import "@/components/mobile-app-development-service/style-app.css"; + +export default function MobileAppSuccessPage() { + return ( + +
+ {/* Background Decorations */} +
+
+
+
+
+ +
+
+
+ {/* Premium Bold Green Tick Icon */} +
+
+
+ + + + +
+
+ {/* Animated Floating Dots (Confetti Effect) */} +
+ {[...Array(10)].map((_, i) => ( + + ))} +
+
+ +
+

Success Achieved!

+

Consultation Confirmed

+ +
+ +

+ We've received your project details. Our expert mobile strategy team is already reviewing your requirements. We'll reach out within 24 business hours to schedule your deep-dive consultation. +

+ +
+ + Back to Home + +
+
+
+
+
+
+ + + ); +} diff --git a/src/app/website-development-service/success/page.tsx b/src/app/website-development-service/success/page.tsx new file mode 100644 index 0000000..b00f548 --- /dev/null +++ b/src/app/website-development-service/success/page.tsx @@ -0,0 +1,63 @@ +"use client"; + +import React from "react"; +import Link from "next/link"; +import MainLayout from "@/components/web-development-service/support/layout/MainLayout"; +import "@/components/web-development-service/style.css"; + +export default function WebsiteSuccessPage() { + return ( + +
+ {/* Background Decorations */} +
+
+
+
+
+ +
+
+
+ {/* Premium Bold Blue/Green Tick Icon */} +
+
+
+ + + + +
+
+ {/* Animated Floating Dots (Confetti Effect) */} +
+ {[...Array(10)].map((_, i) => ( + + ))} +
+
+ +
+

Success Achieved!

+

Consultation Confirmed

+ +
+ +

+ Great news! We've successfully received your website development project inquiry. Our lead architect is matching your needs with our best-fit technology stack. Expect a response in your inbox within 24 business hours. +

+ +
+ + Back to Home + +
+
+
+
+
+
+ + + ); +} diff --git a/src/components/about/WhyChooseUs.tsx b/src/components/about/WhyChooseUs.tsx index 3c60ecf..66f95f6 100644 --- a/src/components/about/WhyChooseUs.tsx +++ b/src/components/about/WhyChooseUs.tsx @@ -3,6 +3,8 @@ import React from "react"; const WhyChooseUs = () => { return (
+
+
@@ -19,52 +21,33 @@ const WhyChooseUs = () => {
-
-
+
+
-
WHY CHOOSE US
-

Consulting Solutions For Your
Business Development.

+
Guided by Purpose, Driven by Passion
+

Our Vision

-

- Business tailored design, management & support services Business business agency elit, - sed do eiusmod tempor majority have in some we form, by injected humour solution. +

+ Join us in shaping the future of technology and delivering meaningful solutions.

-
-
-
- -
-
-

We Are Improve Choose Business.

-

Market research branding of engagement.

-
+
+
+ + At Metatroncube, we’re driven by the idea that technology can bridge gaps, empower businesses, and simplify lives.
-
-
- -
-
-

Business Consulting This Network.

-

Business tailored design, management & off support.

-
-
-
- -
- - We are business many variations of passages of this business magical solution. + + At Metatroncube, we’re driven by the idea that technology can bridge gaps, empower businesses, and simplify lives.
-
); }; diff --git a/src/components/common/ContactPopup/ContactPopup.tsx b/src/components/common/ContactPopup/ContactPopup.tsx index 04a55a3..8f9af49 100644 --- a/src/components/common/ContactPopup/ContactPopup.tsx +++ b/src/components/common/ContactPopup/ContactPopup.tsx @@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'; import { createPortal } from 'react-dom'; import ReCAPTCHA from "react-google-recaptcha"; import axios from "axios"; +import { useRouter } from "next/navigation"; import ContactStatus from '../../contact/ContactStatus'; interface ContactPopupProps { @@ -24,6 +25,7 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { const [formErrors, setFormErrors] = useState({}); const [captchaToken, setCaptchaToken] = useState(null); const [mounted, setMounted] = useState(false); + const router = useRouter(); useEffect(() => { setMounted(true); @@ -76,7 +78,6 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { headers: { "Content-Type": "application/json" }, }); - setStatus('success'); setFormData({ name: "", phone: "", @@ -87,6 +88,8 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { }); setCaptchaToken(null); setFormErrors({}); + onClose(); + router.push('/website-development-service/success'); } catch (error) { console.error("❌ Error sending email:", error); setStatus('error'); @@ -109,9 +112,8 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => {
e.stopPropagation()}>
{/* Left Side: Info */} -
-
-
+
+

Let's Build Something Great

Partner with Canada's leading web development agency to scale your business.

@@ -127,7 +129,7 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => {

Call Us Free

-
+1-647-679-7651
+
+1-647-679-7651
diff --git a/src/components/home/AboutThree.tsx b/src/components/home/AboutThree.tsx index b964ff8..96edfc6 100644 --- a/src/components/home/AboutThree.tsx +++ b/src/components/home/AboutThree.tsx @@ -48,13 +48,11 @@ const AboutThree = () => {
-
OUR ABOUT COMPANY
-

Psychology Seeks Explore The About Workings of Human

+
Benefits That Matter
+

What We Offer

- Business tailored design, management & support services Business
- business agency elit, sed do eiusmod tempor  majority have
- in some we form, by injected humour solution. + From career growth to work-life balance, discover why Metatroncube is the right place for you.

    @@ -62,11 +60,11 @@ const AboutThree = () => {
    -

    Behavioral Psychology

    +

    Innovate Fearlessly

  • - - The right therapist can help you develop skills + {/* + The right therapist can help you develop skills */}
@@ -76,14 +74,33 @@ const AboutThree = () => {

Years Experience

-

- Psychology : The scientific study of behavior and mental processes It explores - various aspects of human behavior such as perception, cognition, emotion, - personality, development, and social interactions. -

- - About More - +
+
    +
  • + + Opportunities to Innovate: Work on cutting-edge projects that challenge you to think outside the box. +
    • +
  • + + Global Exposure: Collaborate with international clients and diverse teams. +
    • +
  • + + + Career Growth: Advance your skills with our mentorship programs, certifications, and workshops. +
    • +
  • + + + Inclusive Culture: Be part of a workplace that values diversity, equity, and belonging. +
    • +
  • + + + Employee-First Approach: Enjoy flexible work policies, wellness programs, and a focus on work-life balance. +
    • +
+
diff --git a/src/components/home/ProjectsSection.tsx b/src/components/home/ProjectsSection.tsx index afe0783..071067b 100644 --- a/src/components/home/ProjectsSection.tsx +++ b/src/components/home/ProjectsSection.tsx @@ -1,91 +1,112 @@ "use client"; -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import Link from 'next/link'; const projectsData = [ { id: 1, - title: "Cognitive Psychology", - description: "Supporting individuals in overcoming and for their quality of life whether solution.", - image: "/assets/imgs/project/project-1.jpg", - category: "counseling" + title: "Website Development Intern", + description: "5 Feb, 2025 | Full Time", + image: "/assets/images/careers/web-dev.webp", + category: "web", + link: "/service/website-development-company" }, { id: 2, - title: "Relationship Counseling", - description: "Helping couples build stronger connections and resolve conflicts effectively.", - image: "/assets/imgs/project/project-2.jpg", - category: "relationship" + title: "Search Engine Optimization (SEO) Intern", + description: "5 Feb, 2025 | Full Time", + image: "/assets/images/careers/seo.webp", + category: "seo", + link: "/service/search-engine-optimization-seo-content-writing" }, { id: 3, - title: "Team Support", - description: "Enhancing workplace dynamics and providing support for professional teams.", - image: "/assets/imgs/project/project-3.jpg", - category: "team-support" - }, - { - id: 4, - title: "Family Therapy", - description: "Guidance for families navigating transitions and challenging situations.", - image: "/assets/imgs/project/project-4.jpg", - category: "counseling" - }, - { - id: 5, - title: "Executive Coaching", - description: "Professional development and mental wellness for corporate leaders.", - image: "/assets/imgs/project/project-5.jpg", - category: "team-support" - }, - { - id: 6, - title: "Child Psychology", - description: "Specialized support for children's emotional and behavioral development.", - image: "/assets/imgs/project/project-6.jpg", - category: "counseling" + title: "Social Media Marketing (SMM) Intern", + description: "5 Feb, 2025 | Full Time", + image: "/assets/images/careers/digi-marketing.webp", + category: "dm", + link: "/service/digital-marketing-agency-in-canada" } ]; const categories = [ - { label: "All", filter: "all" }, - { label: "Counseling", filter: "counseling" }, - { label: "Relationship", filter: "relationship" }, - { label: "Team Support", filter: "team-support" } + { label: "All Items", filter: "all" }, + { label: "Website Development", filter: "web" }, + { label: "Social Media Marketing", filter: "dm" }, + { label: "Search Engine Optimization", filter: "seo" }, + { label: "Mobile App Development", filter: "mobile" }, + { label: "UI/UX Designing", filter: "uiux" }, + { label: "Graphic Designing", filter: "grap" } ]; const ProjectsSection = () => { + const [hasMounted, setHasMounted] = useState(false); const [activeFilter, setActiveFilter] = useState("all"); + useEffect(() => { + setHasMounted(true); + }, []); + const filteredProjects = projectsData.filter(project => - activeFilter === "all" || project.category.includes(activeFilter) + activeFilter === "all" || project.category === activeFilter ); + if (!hasMounted) { + return null; + } + return ( -
+
-
Our Recent Work
-

Our Case Studies Best Quality
Psychology & Counseling

+
BUILD YOUR CAREER
+

Our Open positions

-
    - {categories.map((cat, idx) => ( -
  • setActiveFilter(cat.filter)} +
    + {/* Row 1: All Items */} +
    +
    • - ))} -
+ All Items + +
+ + {/* Row 2: Next 3 tabs */} +
+ {categories.slice(1, 4).map((cat, idx) => ( + + ))} +
+ + {/* Row 3: Last 3 tabs */} +
+ {categories.slice(4, 7).map((cat, idx) => ( + + ))} +
+
+ +
-
{filteredProjects.map((project) => (
@@ -94,11 +115,11 @@ const ProjectsSection = () => {
-

{project.title}

+

{project.title}

{project.description}

- +
@@ -107,6 +128,13 @@ const ProjectsSection = () => {
))}
+ + {filteredProjects.length === 0 && ( +
+
No positions currently available
+

Please check back later

+
+ )}
); diff --git a/src/components/home/home-1/BannerSection.tsx b/src/components/home/home-1/BannerSection.tsx index c9b5a28..10d79c8 100644 --- a/src/components/home/home-1/BannerSection.tsx +++ b/src/components/home/home-1/BannerSection.tsx @@ -1,25 +1,56 @@ +const banners = [ + { + image: "/assets/imgs/banner/banner-1.jpg", + subTitle: "METATRONCUBE SOLUTIONS", + title: "WEB AND APP DEVELOPMENT PIONEERING INNOVATION", + text: "Elevate your digital landscape with Metatroncube's cutting-edge web and mobile app solutions.", + btnLabel: "Book Your Call Now", + btnHref: "https://calendly.com/metatroncubeswsolutions/request-consultation", + }, + { + image: "/assets/imgs/banner/banner-2.jpg", + subTitle: "METATRONCUBE SOLUTIONS", + title: "DIGITAL MARKETING AMPLIFYING YOUR ONLINE VOICE", + text: "Explore Metatroncube's innovative strategies to connect, engage, and grow your audience in the digital realm.", + btnLabel: "Schedule Appointment", + btnHref: "https://calendly.com/metatroncubeswsolutions/request-consultation", + }, + { + image: "/assets/imgs/banner/banner-3.jpg", + subTitle: "METATRONCUBE SOLUTIONS", + title: "SEO STRATEGIES PAVING YOUR PATH TO SUCCESS", + text: "Maximize visibility and drive traffic with Metatroncube's expert SEO strategies.", + btnLabel: "REQUEST CONSULTATION", + btnHref: "https://calendly.com/metatroncubeswsolutions/request-consultation", + }, + { + image: "/assets/imgs/banner/banner-4.jpg", + subTitle: "METATRONCUBE SOLUTIONS", + title: "GRAPHIC DESIGN CREATING VISUAL IMPACT", + text: "Craft compelling visuals that enhance your brand identity with Metatroncube's graphic design services", + btnLabel: "BOOK YOUR FREE CONSULTATION", + btnHref: "https://calendly.com/metatroncubeswsolutions/request-consultation", + }, +]; + const BannerSection = () => { return (
- {[1, 2, 1].map((num, i) => ( + {banners.map((banner, i) => (
-
+
- TECHNOLOGY CONSULTANCY -

Make The Easiest Solution For You

-

We denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure.

+ {banner.subTitle} +

{banner.title}

+

{banner.text}

diff --git a/src/components/home/home-1/BlogSection.tsx b/src/components/home/home-1/BlogSection.tsx index fe1238e..565fbc7 100644 --- a/src/components/home/home-1/BlogSection.tsx +++ b/src/components/home/home-1/BlogSection.tsx @@ -1,54 +1,127 @@ -import { blogs } from "@/utils/data"; +import React, { useState } from "react"; +import { BlogData } from "@/utils/constant.utils"; import Link from "next/link"; -const BlogSection = ({ hideHeader = false }: { hideHeader?: boolean }) => ( -
-
- {!hideHeader && ( -
-
-
-
LATEST BLOG
-

Latest Blog Insights

+const blogs = [...BlogData].sort( + (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime() +); + +const BlogSection = ({ hideHeader = false, isPaginated = false }: { hideHeader?: boolean; isPaginated?: boolean }) => { + const [currentPage, setCurrentPage] = useState(1); + const blogsPerPage = 12; + + // Total pages + const totalPages = Math.ceil(blogs.length / blogsPerPage); + + // Get current blogs + const indexOfLastBlog = currentPage * blogsPerPage; + const indexOfFirstBlog = indexOfLastBlog - blogsPerPage; + const currentBlogs = isPaginated ? blogs.slice(indexOfFirstBlog, indexOfLastBlog) : blogs.slice(0, 3); + + const paginate = (pageNumber: number) => { + if (pageNumber >= 1 && pageNumber <= totalPages) { + setCurrentPage(pageNumber); + window.scrollTo({ top: 0, behavior: 'smooth' }); + } + }; + + // Pagination display logic: show up to 5 numbers then arrows + const renderPageNumbers = () => { + const pages = []; + let startPage = Math.max(1, currentPage - 2); + let endPage = Math.min(totalPages, startPage + 4); + + if (endPage - startPage < 4) { + startPage = Math.max(1, endPage - 4); + } + + for (let i = startPage; i <= endPage; i++) { + pages.push( + + ); + } + return pages; + }; + + return ( +
+
+ {!hideHeader && ( +
+
+
+
LATEST BLOG
+

Latest Blog Insights

+
+
- -
- )} -
- {blogs.slice(0, 3).map((blog, index) => ( -
-
- - {blog.title} - {blog.category} - -
-
- - By Admin - - - {blog.date} - -
-
-
- {blog.title} -
-
- - Read MORE   | - - + )} +
+ {currentBlogs.map((blog) => ( +
+
+ + {blog.title} + {blog.category} + +
+
+ + By Admin + + + {blog.date} + +
+
+
+ {blog.title} +
+
+
+ + Learn More + + +
+
-
- ))} -
-
+ ))} +
-
-); + {isPaginated && totalPages > 1 && ( +
+
+ + + {renderPageNumbers()} + + +
+
+ )} +
+
+ ); +}; export default BlogSection; diff --git a/src/components/home/home-1/BrandSection.tsx b/src/components/home/home-1/BrandSection.tsx index dc36f80..6bff4a4 100644 --- a/src/components/home/home-1/BrandSection.tsx +++ b/src/components/home/home-1/BrandSection.tsx @@ -1,7 +1,49 @@ +"use client"; import React from "react"; import SectionTitle from "@/components/common/SectionTitle"; +import Slider from "react-slick"; const BrandSection = () => { + const settings = { + dots: false, + arrows: false, + infinite: true, + slidesToShow: 4, + slidesToScroll: 4, + autoplay: true, + speed: 1000, + autoplaySpeed: 3000, + cssEase: "ease", + pauseOnHover: true, + draggable: true, + responsive: [ + { + breakpoint: 1024, + settings: { + slidesToShow: 4, + } + }, + { + breakpoint: 768, + settings: { + slidesToShow: 3, + } + }, + { + breakpoint: 480, + settings: { + slidesToShow: 2, + } + }, + { + breakpoint: 400, + settings: { + slidesToShow: 1, + } + } + ] + }; + return (
@@ -9,17 +51,16 @@ const BrandSection = () => { tagline="OUR PARTNERS" title="Trusted by Leaders Worldwide" centered={true} + className="mb-30" />
-
-
- {[1, 2, 3, 4, 1].map((num, i) => ( -
- -
- ))} -
-
+ + {[1, 2, 3, 4, 1, 2, 3, 4].map((num, i) => ( +
+ +
+ ))} +
diff --git a/src/components/mobile-app-development-service/BrandSlider.tsx b/src/components/mobile-app-development-service/BrandSlider.tsx index f2056a0..93f850a 100644 --- a/src/components/mobile-app-development-service/BrandSlider.tsx +++ b/src/components/mobile-app-development-service/BrandSlider.tsx @@ -5,12 +5,14 @@ import GsapReveal from '@/components/mobile-app-development-service/support/comm const BrandSlider = () => { const brands = [ - { id: 1, src: "/assets/img-app/elements/elements17.png", alt: "Brand 1" }, - { id: 2, src: "/assets/img-app/elements/elements17.png", alt: "Brand 2" }, - { id: 3, src: "/assets/img-app/elements/elements17.png", alt: "Brand 3" }, - { id: 4, src: "/assets/img-app/elements/elements17.png", alt: "Brand 4" }, - { id: 5, src: "/assets/img-app/elements/elements17.png", alt: "Brand 5" }, - { id: 6, src: "/assets/img-app/elements/elements17.png", alt: "Brand 6" }, + { id: 1, src: "/assets/img/add/icon-1.webp", alt: "Brand 1" }, + { id: 2, src: "/assets/img/add/icon-2.webp", alt: "Brand 2" }, + { id: 3, src: "/assets/img/add/icon-3.webp", alt: "Brand 3" }, + { id: 4, src: "/assets/img/add/icon-4.webp", alt: "Brand 4" }, + { id: 5, src: "/assets/img/add/icon-1.webp", alt: "Brand 1" }, + { id: 6, src: "/assets/img/add/icon-2.webp", alt: "Brand 2" }, + { id: 7, src: "/assets/img/add/icon-3.webp", alt: "Brand 3" }, + { id: 8, src: "/assets/img/add/icon-4.webp", alt: "Brand 4" }, ]; const settings = { @@ -18,13 +20,13 @@ const BrandSlider = () => { arrows: false, infinite: true, slidesToShow: 4, - slidesToScroll: 1, + slidesToScroll: 4, autoplay: true, - speed: 4000, - autoplaySpeed: 0, - cssEase: "linear", - pauseOnHover: false, - draggable: false, + speed: 1000, + autoplaySpeed: 3000, + cssEase: "ease", + pauseOnHover: true, + draggable: true, responsive: [ { breakpoint: 1024, @@ -44,10 +46,16 @@ const BrandSlider = () => { slidesToShow: 2, } }, + { + breakpoint: 400, + settings: { + slidesToShow: 1, + } + }, { breakpoint: 320, settings: { - slidesToShow: 2, + slidesToShow: 1, } } ] diff --git a/src/components/mobile-app-development-service/style-app.css b/src/components/mobile-app-development-service/style-app.css index 6938eb9..ff59ff0 100644 --- a/src/components/mobile-app-development-service/style-app.css +++ b/src/components/mobile-app-development-service/style-app.css @@ -19045,7 +19045,7 @@ img { outline: none; } -.brand-item img { +/* .brand-item img { max-height: 45px; width: auto; filter: grayscale(1) opacity(0.6); @@ -19054,7 +19054,7 @@ img { .brand-item:hover img { filter: grayscale(0) opacity(1); -} +} */ @media (max-width: 480px) { .brand-item { diff --git a/src/components/mobile-app-development-service/support/common/ContactPopup/ContactPopup.tsx b/src/components/mobile-app-development-service/support/common/ContactPopup/ContactPopup.tsx index d2643a6..62bb049 100644 --- a/src/components/mobile-app-development-service/support/common/ContactPopup/ContactPopup.tsx +++ b/src/components/mobile-app-development-service/support/common/ContactPopup/ContactPopup.tsx @@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react'; import { createPortal } from 'react-dom'; import ReCAPTCHA from "react-google-recaptcha"; import axios from "axios"; +import { useRouter } from 'next/navigation'; import ContactStatus from '@/components/contact/ContactStatus'; interface ContactPopupProps { @@ -25,6 +26,7 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { const [formErrors, setFormErrors] = useState({}); const [captchaToken, setCaptchaToken] = useState(null); const [mounted, setMounted] = useState(false); + const router = useRouter(); useEffect(() => { setMounted(true); @@ -78,7 +80,6 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { headers: { "Content-Type": "application/json" }, }); - setStatus('success'); setFormData({ name: "", phone: "", @@ -90,6 +91,8 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => { }); setCaptchaToken(null); setFormErrors({}); + onClose(); + router.push('/mobile-app-development-service/success'); } catch (error) { console.error("❌ Error sending email:", error); setStatus('error'); @@ -112,9 +115,8 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => {
e.stopPropagation()}>
{/* Left Side: Info */} -
-
-
+
+

Let's Discuss Your App Idea

Fill out the form and our team will contact you within 24 hours.

@@ -130,7 +132,7 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => {

Call Us Free

-
+1-647-679-7651
+
+1-647-679-7651
@@ -227,238 +229,6 @@ const ContactPopup: React.FC = ({ isOpen, onClose }) => {
-
); diff --git a/src/components/mobile-app-development-service/support/layout/MainLayout.tsx b/src/components/mobile-app-development-service/support/layout/MainLayout.tsx index 2a6a252..b260825 100644 --- a/src/components/mobile-app-development-service/support/layout/MainLayout.tsx +++ b/src/components/mobile-app-development-service/support/layout/MainLayout.tsx @@ -5,7 +5,17 @@ import Header from './Header/Header'; import Footer from './Footer/Footer'; import CTA from './CTA/CTA'; -const MainLayout = ({ children }: { children: React.ReactNode }) => { +const MainLayout = ({ + children, + showCTA = true, + hideHeader = false, + hideFooter = false +}: { + children: React.ReactNode, + showCTA?: boolean, + hideHeader?: boolean, + hideFooter?: boolean +}) => { useEffect(() => { AOS.init({ duration: 1000, @@ -15,10 +25,10 @@ const MainLayout = ({ children }: { children: React.ReactNode }) => { return ( <> -
+ {!hideHeader &&
}
{children}
- -