{"id":3632,"date":"2026-08-27T17:38:09","date_gmt":"2026-08-27T15:38:09","guid":{"rendered":"http:\/\/nuancecreative.hu\/?page_id=3632"},"modified":"2026-09-16T22:20:57","modified_gmt":"2026-09-16T20:20:57","slug":"rolam","status":"publish","type":"page","link":"https:\/\/nuancecreative.hu\/en\/rolam\/","title":{"rendered":"ABOUT"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n \t\t
\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nNUANCE \u2014 Before the Brand<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500&family=Montserrat:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n html, body { margin: 0; padding: 0; background: #fffdf9; }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"nuance-thinking\">\r\n <div class=\"ambient-background\">\r\n <div class=\"blob blob-1\"><\/div>\r\n <div class=\"blob blob-2\"><\/div>\r\n <div class=\"blob blob-3\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"nuance-thinking__inner\">\r\n <h2 class=\"nuance-thinking__title\" data-rise-text>Egy j\u00f3 ir\u00e1ny\r\n<br>mindent megv\u00e1ltoztat.<\/h2>\r\n <p class=\"nuance-thinking__desc\">\r\n Lehet, hogy kin\u0151tted azt az arculatot, amivel elindult\u00e1l. Lehet, hogy a weboldalad m\u00e1r nem azt mutatja, ahol most tartasz. Vagy egyszer\u0171en csak \u00e9rzed, hogy valami nem \u00e1ll \u00f6ssze, de nem tudod pontosan megmondani, mi az.\r\n\r\nEbben tudok seg\u00edteni. Egy\u00fctt megn\u00e9zz\u00fck, mi nem m\u0171k\u00f6dik, mi hi\u00e1nyzik, \u00e9s hogyan lehetne mindezt \u00fagy megmutatni, hogy v\u00e9gre k\u00edv\u00fcl is az l\u00e1tsz\u00f3djon, amit te m\u00e1r tudsz a v\u00e1llalkoz\u00e1sodr\u00f3l.\r\n <\/p>\r\n <a href=\"#\" class=\"nuance-thinking__btn\">\r\n MEGN\u00c9ZEM, HOGYAN DOLGOZOL <span class=\"nuance-thinking__arrow\">\u2197<\/span>\r\n <\/a>\r\n <\/div>\r\n<\/section>\r\n\r\n<style>\r\n .nuance-thinking {\r\n --nt-bg: #fffdf9; \/* Pontos men\u00fc h\u00e1tt\u00e9rsz\u00edn *\/\r\n --nt-ink: #0a0a0c;\r\n --nt-dim: #3f3f46;\r\n --nt-accent: #d59256;\r\n\r\n position: sticky;\r\n top: 0;\r\n z-index: 1;\r\n width: 100%;\r\n height: 100vh;\r\n background: var(--nt-bg); \/* Tiszta egysz\u00edn\u0171 h\u00e1tt\u00e9r, \u00e1tmenet n\u00e9lk\u00fcl *\/\r\n overflow: hidden;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 120px 24px;\r\n box-sizing: border-box;\r\n font-family: 'Montserrat', sans-serif;\r\n }\r\n .nuance-thinking * { box-sizing: border-box; }\r\n\r\n .ambient-background {\r\n position: absolute;\r\n inset: 0;\r\n overflow: hidden;\r\n pointer-events: none;\r\n z-index: 0;\r\n \/* Csak a legfels\u0151 r\u00e9szen halv\u00e1ny\u00edtja el a foltokat, hogy ne v\u00e1g\u00f3djanak el a men\u00fcn\u00e9l *\/\r\n -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 100%);\r\n mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 100%);\r\n }\r\n\r\n .blob {\r\n position: absolute;\r\n border-radius: 50%;\r\n filter: blur(70px);\r\n mix-blend-mode: multiply;\r\n will-change: transform, opacity;\r\n }\r\n\r\n \/* Eredeti k\u00f6r poz\u00edci\u00f3k *\/\r\n .blob-1 {\r\n width: 55vw;\r\n height: 55vw;\r\n max-width: 750px;\r\n max-height: 750px;\r\n background: #d59256;\r\n top: 4%;\r\n left: -5%;\r\n animation: blobActive1 8s ease-in-out infinite alternate;\r\n }\r\n\r\n .blob-2 {\r\n width: 48vw;\r\n height: 48vw;\r\n max-width: 620px;\r\n max-height: 620px;\r\n background: #e8ab6f;\r\n bottom: -10%;\r\n right: -5%;\r\n animation: blobActive2 10s ease-in-out infinite alternate;\r\n }\r\n\r\n .blob-3 {\r\n width: 40vw;\r\n height: 40vw;\r\n max-width: 500px;\r\n max-height: 500px;\r\n background: #c17b3e;\r\n top: 25%;\r\n left: 25%;\r\n animation: blobActive3 7s ease-in-out infinite alternate;\r\n }\r\n\r\n @keyframes blobActive1 {\r\n 0% { transform: translate3d(0, 0, 0) scale(0.95); opacity: 0.45; }\r\n 100% { transform: translate3d(22%, 18%, 0) scale(1.25); opacity: 0.75; }\r\n }\r\n\r\n @keyframes blobActive2 {\r\n 0% { transform: translate3d(0, 0, 0) scale(1.2); opacity: 0.65; }\r\n 100% { transform: translate3d(-25%, -15%, 0) scale(0.9); opacity: 0.35; }\r\n }\r\n\r\n @keyframes blobActive3 {\r\n 0% { transform: translate3d(0, 0, 0) scale(0.85); opacity: 0.3; }\r\n 100% { transform: translate3d(18%, -22%, 0) scale(1.2); opacity: 0.7; }\r\n }\r\n\r\n .nuance-thinking__inner {\r\n position: relative;\r\n z-index: 1;\r\n max-width: 1100px;\r\n margin: 0 auto;\r\n text-align: center;\r\n }\r\n\r\n .nuance-thinking__title {\r\n position: relative;\r\n z-index: 1;\r\n font-family: 'Fraunces', serif;\r\n font-weight: 400;\r\n font-size: clamp(52px, 8.5vw, 120px);\r\n line-height: 0.92;\r\n letter-spacing: -0.03em;\r\n color: var(--nt-ink);\r\n margin: 0 0 32px;\r\n }\r\n\r\n .nuance-thinking__title[data-rise-text] {\r\n opacity: 0;\r\n transform: translateY(48px);\r\n transition:\r\n opacity 0.9s cubic-bezier(.2,.7,.2,1),\r\n transform 0.9s cubic-bezier(.2,.7,.2,1);\r\n }\r\n\r\n .nuance-thinking__title[data-rise-text].is-revealed {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n @media (prefers-reduced-motion: reduce) {\r\n .nuance-thinking__title[data-rise-text] {\r\n transition: none;\r\n opacity: 1;\r\n transform: none;\r\n }\r\n }\r\n\r\n .nuance-thinking__desc {\r\n position: relative;\r\n z-index: 1;\r\n font-size: clamp(15px, 1.5vw, 18px);\r\n line-height: 1.65;\r\n color: var(--nt-dim);\r\n max-width: 700px;\r\n margin: 0 auto 48px;\r\n font-weight: 400;\r\n }\r\n\r\n .nuance-thinking__btn {\r\n position: relative;\r\n z-index: 1;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 18px 38px;\r\n border-radius: 999px;\r\n background: var(--nt-ink);\r\n color: #ffffff;\r\n font-family: 'Montserrat', sans-serif;\r\n font-size: 11px;\r\n font-weight: 600;\r\n letter-spacing: 0.15em;\r\n text-decoration: none;\r\n text-transform: uppercase;\r\n transition: background .35s ease, box-shadow .35s ease, transform .25s ease;\r\n }\r\n\r\n .nuance-thinking__arrow {\r\n display: inline-block;\r\n font-size: 16px;\r\n font-weight: 400;\r\n color: var(--nt-accent);\r\n transition: transform .35s ease;\r\n }\r\n\r\n .nuance-thinking__btn:hover {\r\n background: #1a1a1e;\r\n box-shadow: 0 10px 30px rgba(213, 146, 86, 0.32);\r\n transform: translateY(-2px);\r\n }\r\n .nuance-thinking__btn:hover .nuance-thinking__arrow {\r\n transform: translate(3px, -3px);\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .nuance-thinking { padding: 100px 20px; height: auto; min-height: 100vh; }\r\n .nuance-thinking__title { font-size: clamp(42px, 12vw, 64px); line-height: 1; margin-bottom: 24px; }\r\n .nuance-thinking__desc { font-size: 15px; margin-bottom: 40px; }\r\n .nuance-thinking__btn { padding: 16px 32px; font-size: 11px; }\r\n .blob { filter: blur(50px); }\r\n }\r\n<\/style>\r\n\r\n<script>\r\n (function () {\r\n function initRiseReveal() {\r\n var targets = document.querySelectorAll('[data-rise-text]');\r\n if (!targets.length) return;\r\n\r\n var prefersReduced = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n if (prefersReduced) {\r\n targets.forEach(function (el) { el.classList.add('is-revealed'); });\r\n return;\r\n }\r\n\r\n if ('IntersectionObserver' in window) {\r\n var observer = new IntersectionObserver(function (entries) {\r\n entries.forEach(function (entry) {\r\n if (entry.isIntersecting) {\r\n entry.target.classList.add('is-revealed');\r\n observer.unobserve(entry.target);\r\n }\r\n });\r\n }, { threshold: 0.4 });\r\n\r\n targets.forEach(function (el) { observer.observe(el); });\r\n } else {\r\n targets.forEach(function (el) { el.classList.add('is-revealed'); });\r\n }\r\n }\r\n\r\n if (document.readyState === 'loading') {\r\n document.addEventListener('DOMContentLoaded', initRiseReveal);\r\n } else {\r\n initRiseReveal();\r\n }\r\n })();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/header>\n<div class=\"elementor-element elementor-element-0405371 e-con e-atomic-element e-flexbox-base e-0405371-0ba5376 \" data-id=\"0405371\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"0405371\">\n \t\t<div class=\"elementor-element elementor-element-6d750b9 elementor-widget elementor-widget-spacer\" data-id=\"6d750b9\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-725bb0a elementor-hidden-mobile elementor-widget elementor-widget-html\" data-id=\"725bb0a\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:wght@400;500;600&family=Montserrat:wght@400;500;700&display=swap');\r\n\r\n .at-testimonial {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 40px;\r\n width: 100%;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 40px 20px;\r\n box-sizing: border-box;\r\n font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\r\n }\r\n\r\n \/* Bal oldali komplett blokk (K\u00e9p + Vonal + N\u00e9v egy\u00fctt) *\/\r\n .at-testimonial__hero {\r\n position: relative;\r\n flex: 0 0 auto;\r\n width: 480px;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .at-testimonial__image-wrap {\r\n position: relative;\r\n z-index: 2;\r\n }\r\n\r\n .at-testimonial__image-wrap img {\r\n display: block;\r\n width: 380px;\r\n height: auto;\r\n object-fit: contain;\r\n }\r\n\r\n .at-testimonial__info {\r\n position: absolute;\r\n left: 270px;\r\n top: 38%;\r\n transform: translateY(-50%);\r\n z-index: 1;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n white-space: nowrap;\r\n }\r\n\r\n .at-testimonial__divider {\r\n width: 3px;\r\n height: 50px;\r\n background-color: #D59256;\r\n flex-shrink: 0;\r\n }\r\n\r\n .at-testimonial__name-position {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n }\r\n\r\n .at-testimonial__name {\r\n font-family: 'Fraunces', serif;\r\n font-size: 20px;\r\n font-weight: 500;\r\n color: #1a1a1a;\r\n margin: 0 0 2px 0;\r\n line-height: 1.2;\r\n }\r\n\r\n .at-testimonial__position {\r\n font-size: 15px;\r\n font-weight: 400;\r\n color: #D59256;\r\n margin: 0;\r\n line-height: 1.2;\r\n }\r\n\r\n \/* Jobb oldali id\u00e9zet *\/\r\n .at-testimonial__quote {\r\n flex: 1;\r\n font-size: 15px;\r\n line-height: 1.6;\r\n color: #444444;\r\n margin: 0;\r\n }\r\n\r\n .at-testimonial__quote p {\r\n margin: 0 0 16px 0;\r\n }\r\n\r\n .at-testimonial__quote p:last-child {\r\n margin-bottom: 0;\r\n }\r\n\r\n .at-testimonial__quote-highlight {\r\n font-weight: 700;\r\n }\r\n\r\n .at-testimonial__quote-brand {\r\n font-weight: 700;\r\n color: #D59256;\r\n }\r\n\r\n \/* Mobil \u00e9s tablet n\u00e9zet *\/\r\n @media (max-width: 900px) {\r\n .at-testimonial {\r\n flex-direction: column-reverse;\r\n align-items: center;\r\n gap: 30px;\r\n }\r\n\r\n .at-testimonial__hero {\r\n width: 100%;\r\n max-width: 360px;\r\n justify-content: flex-start;\r\n }\r\n\r\n .at-testimonial__image-wrap img {\r\n width: 250px;\r\n }\r\n\r\n .at-testimonial__info {\r\n position: absolute;\r\n left: 175px;\r\n top: 38%;\r\n transform: translateY(-50%);\r\n text-align: left;\r\n }\r\n\r\n .at-testimonial__divider {\r\n width: 3px;\r\n height: 40px;\r\n }\r\n\r\n .at-testimonial__name-position {\r\n align-items: flex-start;\r\n }\r\n\r\n .at-testimonial__quote {\r\n text-align: center;\r\n }\r\n }\r\n<\/style>\r\n\r\n<div class=\"at-testimonial\">\r\n <!-- Bal oldali egys\u00e9g -->\r\n <div class=\"at-testimonial__hero\">\r\n <div class=\"at-testimonial__image-wrap\">\r\n <img decoding=\"async\" src=\"http:\/\/nuancecreative.hu\/wp-content\/uploads\/2026\/09\/Nevtelen-terv-3.png\" alt=\"Anita Tat\u00e1r\">\r\n <\/div>\r\n\r\n <div class=\"at-testimonial__info\">\r\n <div class=\"at-testimonial__divider\"><\/div>\r\n <div class=\"at-testimonial__name-position\">\r\n <p class=\"at-testimonial__name\">Anita Tat\u00e1r<\/p>\r\n <p class=\"at-testimonial__position\">CEO of NUANCE<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Jobb oldali egys\u00e9g -->\r\n <div class=\"at-testimonial__quote\">\r\n <p class=\"at-testimonial__quote-highlight\">\u201eA j\u00f3 design mellett azt is \u00e9rteni kell, mi\u00e9rt van r\u00e1 sz\u00fcks\u00e9g.\u201d<\/p>\r\n\r\n <p>Grafikus \u00e9s webdesigner vagyok, emellett kommunik\u00e1ci\u00f3s \u00e9s marketingmenedzserk\u00e9nt dolgozom. Ez a kett\u0151 egy\u00fctt sokat ad ahhoz, ahogyan egy m\u00e1rk\u00e1hoz ny\u00falok: nemcsak azt l\u00e1tom, hogyan lehet valamit sz\u00e9pen megcsin\u00e1lni, hanem azt is, hogy mire van sz\u00fcks\u00e9ge a v\u00e1llalkoz\u00e1snak, mit szeretne mondani, \u00e9s hogyan jut el vele azokhoz, akiknek sz\u00f3l.<\/p>\r\n\r\n <p>A p\u00e1ly\u00e1mat Graphiclick Design n\u00e9ven kezdtem. Szerettem, amit csin\u00e1ltam, de egy id\u0151 ut\u00e1n azt vettem \u00e9szre, hogy m\u00e1r nem f\u00e9r bele abba a keretbe, amit magam k\u00f6r\u00e9 \u00e9p\u00edtettem. T\u00f6bbet akartam ann\u00e1l, mint hogy valaki megkeressen egy log\u00f3val vagy egy weboldallal, \u00e9n pedig elk\u00e9sz\u00edtsem.<\/p>\r\n\r\n <p>\u00c9rteni akartam a m\u00f6g\u00f6tte l\u00e9v\u0151 v\u00e1llalkoz\u00e1st is. Hogy mi\u00e9rt pont most van sz\u00fcks\u00e9g v\u00e1ltoz\u00e1sra, mi nem m\u0171k\u00f6dik, merre szeretne tov\u00e1bbmenni, \u00e9s hogyan lehet ezt \u00fagy megmutatni, hogy val\u00f3ban passzoljon hozz\u00e1.<\/p>\r\n\r\n <p>\u00cdgy sz\u00fcletett meg a <span class=\"at-testimonial__quote-brand\">NUANCE<\/span>.<\/p>\r\n <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-4ea084e e-con e-atomic-element e-flexbox-base e-4ea084e-ba6d244 \" data-id=\"4ea084e\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"4ea084e\">\n \t\t<div class=\"elementor-element elementor-element-ef0914d elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-spacer\" data-id=\"ef0914d\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-10b6f32 elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-html\" data-id=\"10b6f32\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n .at-testimonial {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 40px;\r\n width: 100%;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 40px 20px;\r\n box-sizing: border-box;\r\n font-family: 'Inter', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\r\n }\r\n\r\n \/* Bal oldali komplett blokk (K\u00e9p + Vonal + N\u00e9v egy\u00fctt) *\/\r\n .at-testimonial__hero {\r\n position: relative;\r\n flex: 0 0 auto;\r\n width: 480px; \/* Hely lefoglal\u00e1sa a k\u00e9pnek \u00e9s a kil\u00f3g\u00f3 n\u00e9vnek *\/\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .at-testimonial__image-wrap {\r\n position: relative;\r\n z-index: 2; \/* A k\u00e9p van fel\u00fcl *\/\r\n }\r\n\r\n .at-testimonial__image-wrap img {\r\n display: block;\r\n width: 380px;\r\n height: auto;\r\n object-fit: contain;\r\n }\r\n\r\n \/* Vonal \u00e9s N\u00e9v blokk poz\u00edci\u00f3ja *\/\r\n .at-testimonial__info {\r\n position: absolute;\r\n left: 270px; \/* HOZZ\u00c1IGAZ\u00cdT\u00c1S A V\u00c1LLHOZ *\/\r\n top: 38%; \/* MAGASS\u00c1G *\/\r\n transform: translateY(-50%);\r\n z-index: 1; \/* A k\u00e9p alatt van *\/\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n white-space: nowrap;\r\n }\r\n\r\n .at-testimonial__divider {\r\n width: 3px;\r\n height: 50px;\r\n background-color: #D59256;\r\n flex-shrink: 0;\r\n }\r\n\r\n .at-testimonial__name-position {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n }\r\n\r\n .at-testimonial__name {\r\n font-size: 20px;\r\n font-weight: 400;\r\n color: #1a1a1a;\r\n margin: 0 0 2px 0;\r\n line-height: 1.2;\r\n }\r\n\r\n .at-testimonial__position {\r\n font-size: 15px;\r\n font-weight: 400;\r\n color: #D59256;\r\n margin: 0;\r\n line-height: 1.2;\r\n }\r\n\r\n \/* Jobb oldali id\u00e9zet *\/\r\n .at-testimonial__quote {\r\n flex: 1;\r\n font-size: 15px;\r\n line-height: 1.6;\r\n color: #444444;\r\n margin: 0;\r\n }\r\n\r\n \/* Mobil \u00e9s tablet n\u00e9zet *\/\r\n @media (max-width: 900px) {\r\n .at-testimonial {\r\n flex-direction: column-reverse; \/* Az id\u00e9zet ker\u00fcl fel\u00fclre, a k\u00e9p alulra *\/\r\n align-items: center;\r\n gap: 30px;\r\n }\r\n\r\n .at-testimonial__hero {\r\n width: 100%;\r\n max-width: 360px; \/* Megfelel\u0151 dobozm\u00e9ret a k\u00e9pnek \u00e9s a n\u00e9vnek *\/\r\n justify-content: flex-start;\r\n }\r\n\r\n .at-testimonial__image-wrap img {\r\n width: 250px; \/* Ar\u00e1nyosan kisebb k\u00e9pm\u00e9ret mobilon *\/\r\n }\r\n\r\n .at-testimonial__info {\r\n position: absolute;\r\n left: 175px; \/* Mobilon ar\u00e1nyosan a v\u00e1ll m\u00f6g\u00e9 igaz\u00edtva *\/\r\n top: 38%;\r\n transform: translateY(-50%);\r\n text-align: left;\r\n }\r\n\r\n .at-testimonial__divider {\r\n width: 3px;\r\n height: 40px;\r\n }\r\n\r\n .at-testimonial__name-position {\r\n align-items: flex-start;\r\n }\r\n\r\n .at-testimonial__quote {\r\n text-align: center; \/* Fel\u00fclre ker\u00fcl\u0151 id\u00e9zet k\u00f6z\u00e9pre z\u00e1rt *\/\r\n }\r\n }\r\n<\/style>\r\n\r\n<div class=\"at-testimonial\">\r\n <!-- Bal oldali egys\u00e9g -->\r\n <div class=\"at-testimonial__hero\">\r\n <div class=\"at-testimonial__image-wrap\">\r\n <img decoding=\"async\" src=\"http:\/\/nuancecreative.hu\/wp-content\/uploads\/2026\/09\/Nevtelen-terv-3.png\" alt=\"Anita Tat\u00e1r\">\r\n <\/div>\r\n\r\n <div class=\"at-testimonial__info\">\r\n <div class=\"at-testimonial__divider\"><\/div>\r\n <div class=\"at-testimonial__name-position\">\r\n <p class=\"at-testimonial__name\">Anita Tat\u00e1r<\/p>\r\n <p class=\"at-testimonial__position\">CEO of NUANCE<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Jobb oldali id\u00e9zet -->\r\n <p class=\"at-testimonial__quote\">\r\n \"At our core, we craft products that blend art direction, modern interfaces, and seamless technology into meaningful digital experiences. We believe that great design is purposeful, and technology should be invisible yet powerful. From the first sketch to the final line of code, we meticulously curate every detail to transform complex ideas into elegant solutions that drive engagement and deliver measurable impact in an ever-evolving digital landscape.\"\r\n <\/p>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-6ef47f15 e-con e-atomic-element e-flexbox-base e-6ef47f15-269ef6e \" data-id=\"6ef47f15\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"6ef47f15\">\n \t\t<div class=\"elementor-element elementor-element-4af862d5 elementor-widget elementor-widget-html\" data-id=\"4af862d5\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"process-widget-wrapper\">\r\n <style>\r\n .process-widget-wrapper {\r\n --bg-0: #040302;\r\n --bg-1: #0a0604;\r\n --accent: #ff6b00;\r\n --accent-soft: #ff9a4d;\r\n --line-dim: rgba(255,255,255,0.14);\r\n --line-dim-2: rgba(255,255,255,0.06);\r\n --text: #f5f2ec;\r\n --text-muted: rgba(245,242,236,0.52);\r\n --pill-border: rgba(245,242,236,0.22);\r\n --step-gap: 16vh;\r\n --side-pad: clamp(24px, 8vw, 120px);\r\n --ncs-font-serif: 'Fraunces', serif;\r\n --ncs-font-sans: 'Montserrat', sans-serif;\r\n\r\n position: relative;\r\n width: 100%;\r\n background: var(--bg-0);\r\n color: var(--text);\r\n font-family: var(--ncs-font-sans);\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n }\r\n\r\n .process-widget-wrapper * {\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* ---------- ambient background ---------- *\/\r\n\r\n .process-widget-wrapper .bg-fixed {\r\n position: absolute;\r\n inset: 0;\r\n z-index: 0;\r\n background:\r\n radial-gradient(60% 50% at 18% 78%, rgba(255,107,0,0.30), transparent 60%),\r\n radial-gradient(45% 40% at 82% 18%, rgba(255,138,46,0.08), transparent 65%),\r\n radial-gradient(140% 90% at 50% 100%, var(--bg-1), var(--bg-0) 55%);\r\n pointer-events: none;\r\n }\r\n\r\n .process-widget-wrapper #particles {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n z-index: 1;\r\n pointer-events: none;\r\n }\r\n\r\n \/* ---------- layout shell ---------- *\/\r\n\r\n .process-widget-wrapper .process {\r\n position: relative;\r\n z-index: 2;\r\n min-height: 100vh;\r\n padding-bottom: 22vh;\r\n }\r\n\r\n .process-widget-wrapper .process-intro {\r\n position: relative;\r\n min-height: 92vh;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: flex-start;\r\n padding: 8vh var(--side-pad) 4vh;\r\n max-width: 1100px;\r\n }\r\n\r\n .process-widget-wrapper .pill {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 7px 16px 7px 12px;\r\n border: 1px solid var(--pill-border);\r\n border-radius: 100px;\r\n font-family: var(--ncs-font-sans);\r\n font-size: 0.8rem;\r\n letter-spacing: 0.01em;\r\n color: var(--text-muted);\r\n background: rgba(255,255,255,0.02);\r\n white-space: nowrap;\r\n }\r\n\r\n .process-widget-wrapper .pill svg { flex-shrink: 0; opacity: 0.85; }\r\n\r\n .process-widget-wrapper .process-title {\r\n margin: 22px 0 0;\r\n font-family: var(--ncs-font-serif);\r\n font-weight: 400;\r\n font-size: clamp(2.4rem, 5.6vw, 4.4rem);\r\n line-height: 1.08;\r\n letter-spacing: -0.01em;\r\n color: var(--text);\r\n }\r\n\r\n .process-widget-wrapper .process-title em {\r\n font-family: var(--ncs-font-serif);\r\n font-style: italic;\r\n font-weight: 400;\r\n color: var(--text);\r\n }\r\n\r\n \/* ---------- path layer ---------- *\/\r\n\r\n .process-widget-wrapper .path-layer {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n overflow: visible;\r\n pointer-events: none;\r\n z-index: 2;\r\n }\r\n\r\n .process-widget-wrapper .path-dim {\r\n fill: none;\r\n stroke: var(--line-dim-2);\r\n stroke-width: 1.5;\r\n stroke-linecap: round;\r\n }\r\n\r\n .process-widget-wrapper .path-bright {\r\n fill: none;\r\n stroke: var(--accent);\r\n stroke-width: 2;\r\n stroke-linecap: round;\r\n filter: drop-shadow(0 0 6px rgba(255,107,0,0.65)) drop-shadow(0 0 16px rgba(255,107,0,0.35));\r\n }\r\n\r\n .process-widget-wrapper .lead-dot {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 10px;\r\n height: 10px;\r\n margin: -5px 0 0 -5px;\r\n border-radius: 50%;\r\n background: var(--accent);\r\n box-shadow: 0 0 8px 2px rgba(255,107,0,0.9), 0 0 28px 10px rgba(255,107,0,0.35);\r\n z-index: 3;\r\n opacity: 0;\r\n transition: opacity 0.4s ease;\r\n will-change: transform;\r\n }\r\n\r\n .process-widget-wrapper .lead-dot.visible { opacity: 1; }\r\n\r\n \/* ---------- steps ---------- *\/\r\n\r\n .process-widget-wrapper .steps {\r\n position: relative;\r\n z-index: 2;\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--step-gap);\r\n }\r\n\r\n .process-widget-wrapper .step {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n min-height: 62vh;\r\n padding: 0 var(--side-pad);\r\n }\r\n\r\n .process-widget-wrapper .step[data-side=\"right\"] { justify-content: flex-end; }\r\n .process-widget-wrapper .step[data-side=\"left\"] { justify-content: flex-start; }\r\n\r\n .process-widget-wrapper .node {\r\n position: absolute;\r\n top: 50%;\r\n width: 12px;\r\n height: 12px;\r\n border-radius: 50%;\r\n background: rgba(255,255,255,0.25);\r\n transform: translate(-50%,-50%);\r\n }\r\n\r\n .process-widget-wrapper .step[data-side=\"left\"] .node { left: var(--side-pad); }\r\n .process-widget-wrapper .step[data-side=\"right\"] .node { right: var(--side-pad); left: auto; transform: translate(50%,-50%); }\r\n\r\n .process-widget-wrapper .step-card {\r\n max-width: 440px;\r\n opacity: 0;\r\n transform: translateY(28px);\r\n transition: opacity 0.7s cubic-bezier(.16,.8,.3,1), transform 0.7s cubic-bezier(.16,.8,.3,1);\r\n }\r\n\r\n .process-widget-wrapper .step[data-side=\"left\"] .step-card { margin-left: calc(var(--side-pad) + 34px); text-align: left; }\r\n .process-widget-wrapper .step[data-side=\"right\"] .step-card { margin-right: calc(var(--side-pad) + 34px); text-align: right; }\r\n .process-widget-wrapper .step[data-side=\"right\"] .step-card .pill { flex-direction: row-reverse; }\r\n\r\n .process-widget-wrapper .step.in-view .step-card { opacity: 1; transform: translateY(0); }\r\n\r\n .process-widget-wrapper .step-title {\r\n margin: 16px 0 0;\r\n font-family: var(--ncs-font-serif);\r\n font-weight: 500;\r\n font-size: clamp(1.4rem, 2.6vw, 2.1rem);\r\n line-height: 1.2;\r\n letter-spacing: -0.01em;\r\n color: var(--text);\r\n }\r\n\r\n .process-widget-wrapper .step-desc {\r\n margin: 10px 0 0;\r\n font-family: var(--ncs-font-sans);\r\n font-weight: 400;\r\n font-size: clamp(0.9rem, 1.1vw, 1rem);\r\n line-height: 1.55;\r\n color: var(--text-muted);\r\n }\r\n\r\n .process-widget-wrapper .step.active .node {\r\n background: var(--accent);\r\n box-shadow: 0 0 10px 3px rgba(255,107,0,0.7);\r\n }\r\n\r\n \/* ---------- responsive ---------- *\/\r\n\r\n @media (max-width: 760px) {\r\n .process-widget-wrapper { --step-gap: 10vh; }\r\n .process-widget-wrapper .step[data-side=\"right\"] { justify-content: flex-start; }\r\n .process-widget-wrapper .step[data-side=\"right\"] .node { left: var(--side-pad); right: auto; transform: translate(-50%,-50%); }\r\n .process-widget-wrapper .step[data-side=\"right\"] .step-card { margin-right: 0; margin-left: calc(var(--side-pad) + 34px); text-align: left; }\r\n .process-widget-wrapper .step[data-side=\"right\"] .step-card .pill { flex-direction: row; }\r\n .process-widget-wrapper .step { min-height: 36vh; }\r\n }\r\n\r\n @media (prefers-reduced-motion: reduce) {\r\n .process-widget-wrapper .step-card { transition: none; opacity: 1; transform: none; }\r\n .process-widget-wrapper .lead-dot { transition: none; }\r\n }\r\n <\/style>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Montserrat:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <div class=\"bg-fixed\" aria-hidden=\"true\"><\/div>\r\n <canvas id=\"particles\" aria-hidden=\"true\"><\/canvas>\r\n\r\n <section class=\"process\" id=\"process\">\r\n <div class=\"process-intro\">\r\n <span class=\"pill\">\r\n <svg width=\"14\" height=\"10\" viewBox=\"0 0 14 10\" fill=\"none\"><path d=\"M0 5H11M11 5L7 1M11 5L7 9\" stroke=\"currentColor\" stroke-width=\"1.2\"\/><\/svg>\r\n HOGYAN DOLGOZOM\r\n <\/span>\r\n <h1 class=\"process-title\">\r\nA j\u00f3 v\u00e9geredm\u00e9ny nem a v\u00e9letlenen <em>m\u00falik<\/em>.<\/h1>\r\n <\/div>\r\n\r\n <svg class=\"path-layer\" id=\"pathSvg\">\r\n <path id=\"pathDim\" class=\"path-dim\" d=\"\"><\/path>\r\n <path id=\"pathBright\" class=\"path-bright\" d=\"\"><\/path>\r\n <\/svg>\r\n <div class=\"lead-dot\" id=\"leadDot\"><\/div>\r\n\r\n <div class=\"steps\" id=\"steps\">\r\n <div class=\"step\" data-side=\"left\" data-index=\"0\">\r\n <span class=\"node\"><\/span>\r\n <div class=\"step-card\">\r\n <span class=\"pill\">\r\n <svg width=\"14\" height=\"10\" viewBox=\"0 0 14 10\" fill=\"none\"><path d=\"M0 5H11M11 5L7 1M11 5L7 9\" stroke=\"currentColor\" stroke-width=\"1.2\"\/><\/svg>\r\n 01. L\u00c9P\u00c9S\r\n <\/span>\r\n <h3 class=\"step-title\">Meg\u00e9rtem, hov\u00e1 tartasz.<\/h3>\r\n <p class=\"step-desc\">Megismerem a c\u00e9ljaidat, az elk\u00e9pzel\u00e9seidet \u00e9s azt is, ami m\u00e9g csak form\u00e1l\u00f3dik benned.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step\" data-side=\"right\" data-index=\"1\">\r\n <span class=\"node\"><\/span>\r\n <div class=\"step-card\">\r\n <span class=\"pill\">\r\n <svg width=\"14\" height=\"10\" viewBox=\"0 0 14 10\" fill=\"none\"><path d=\"M0 5H11M11 5L7 1M11 5L7 9\" stroke=\"currentColor\" stroke-width=\"1.2\"\/><\/svg>\r\n 02. L\u00c9P\u00c9S\r\n <\/span>\r\n <h3 class=\"step-title\">Form\u00e1t adok az \u00f6tleteidnek.<\/h3>\r\n <p class=\"step-desc\">A gondolatokb\u00f3l \u00e1tgondolt vizu\u00e1lis ir\u00e1ny, majd m\u0171k\u00f6d\u0151 design \u00e9s weboldal sz\u00fcletik.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step\" data-side=\"left\" data-index=\"2\">\r\n <span class=\"node\"><\/span>\r\n <div class=\"step-card\">\r\n <span class=\"pill\">\r\n <svg width=\"14\" height=\"10\" viewBox=\"0 0 14 10\" fill=\"none\"><path d=\"M0 5H11M11 5L7 1M11 5L7 9\" stroke=\"currentColor\" stroke-width=\"1.2\"\/><\/svg>\r\n 03. L\u00c9P\u00c9S\r\n <\/span>\r\n <h3 class=\"step-title\">Megtal\u00e1ljuk a saj\u00e1t hangodat.<\/h3>\r\n <p class=\"step-desc\">A m\u00e1rk\u00e1d nemcsak j\u00f3l n\u00e9z ki. Van karaktere, mondanival\u00f3ja \u00e9s egy hangja, ami t\u00e9nyleg hozz\u00e1d illik.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step\" data-side=\"right\" data-index=\"3\">\r\n <span class=\"node\"><\/span>\r\n <div class=\"step-card\">\r\n <span class=\"pill\">\r\n <svg width=\"14\" height=\"10\" viewBox=\"0 0 14 10\" fill=\"none\"><path d=\"M0 5H11M11 5L7 1M11 5L7 9\" stroke=\"currentColor\" stroke-width=\"1.2\"\/><\/svg>\r\n 04. L\u00c9P\u00c9S\r\n <\/span>\r\n <h3 class=\"step-title\">Addig finom\u00edtjuk, am\u00edg a hely\u00e9re nem ker\u00fcl minden.<\/h3>\r\n <p class=\"step-desc\">Apr\u00f3 r\u00e9szletek, ar\u00e1nyok, ritmus \u00e9s m\u0171k\u00f6d\u00e9s. Mert sokszor \u00e9ppen ezekt\u0151l lesz egy j\u00f3 design igaz\u00e1n a ti\u00e9d.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <script>\r\n (function(){\r\n \"use strict\";\r\n\r\n var wrapper = document.querySelector('.process-widget-wrapper');\r\n var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n \/* ============ PARTICLES ============ *\/\r\n var canvas = wrapper.querySelector('#particles');\r\n var ctx = canvas.getContext('2d');\r\n var particles = [];\r\n var DPR = Math.min(window.devicePixelRatio || 1, 2);\r\n\r\n function sizeCanvas(){\r\n var w = wrapper.offsetWidth || window.innerWidth;\r\n var h = wrapper.offsetHeight || window.innerHeight;\r\n canvas.width = w * DPR;\r\n canvas.height = h * DPR;\r\n canvas.style.width = w + 'px';\r\n canvas.style.height = h + 'px';\r\n }\r\n\r\n function initParticles(){\r\n var w = wrapper.offsetWidth || window.innerWidth;\r\n var h = wrapper.offsetHeight || window.innerHeight;\r\n var count = w < 760 ? 40 : 70;\r\n particles = [];\r\n\r\n for (var i = 0; i < count; i++){\r\n particles.push({\r\n x: Math.random() * w,\r\n y: Math.random() * h,\r\n r: Math.random() * 2.2 + 0.8,\r\n vx: (Math.random() - 0.5) * 0.15,\r\n vy: -Math.random() * 0.25 - 0.05,\r\n o: Math.random() * 0.5 + 0.2,\r\n phase: Math.random() * Math.PI * 2\r\n });\r\n }\r\n }\r\n\r\n function drawParticles(t){\r\n var w = wrapper.offsetWidth || window.innerWidth;\r\n var h = wrapper.offsetHeight || window.innerHeight;\r\n ctx.setTransform(DPR,0,0,DPR,0,0);\r\n ctx.clearRect(0,0,w,h);\r\n\r\n for (var i=0; i<particles.length; i++){\r\n var p = particles[i];\r\n if (!reduceMotion){\r\n p.x += p.vx;\r\n p.y += p.vy;\r\n if (p.y < -10){ p.y = h + 10; p.x = Math.random() * w; }\r\n if (p.x < -10) p.x = w + 10;\r\n if (p.x > w + 10) p.x = -10;\r\n }\r\n var flicker = 0.7 + 0.3 * Math.sin(t * 0.001 + p.phase);\r\n ctx.beginPath();\r\n ctx.arc(p.x, p.y, p.r, 0, Math.PI*2);\r\n ctx.fillStyle = 'rgba(255, 220, 180, ' + (p.o * flicker).toFixed(3) + ')';\r\n ctx.fill();\r\n }\r\n }\r\n\r\n function particleLoop(t){\r\n drawParticles(t || 0);\r\n requestAnimationFrame(particleLoop);\r\n }\r\n\r\n \/* ============ SCROLL-DRIVEN PATH ============ *\/\r\n var section = wrapper.querySelector('#process');\r\n var svg = wrapper.querySelector('#pathSvg');\r\n var pathDim = wrapper.querySelector('#pathDim');\r\n var pathBright = wrapper.querySelector('#pathBright');\r\n var leadDot = wrapper.querySelector('#leadDot');\r\n var nodes = Array.prototype.slice.call(wrapper.querySelectorAll('.node'));\r\n var stepEls = Array.prototype.slice.call(wrapper.querySelectorAll('.step'));\r\n\r\n var points = [];\r\n var controlYs = [];\r\n var totalLength = 0;\r\n var sectionDocTop = 0;\r\n var ticking = false;\r\n\r\n function catmullRomToBezierPath(pts){\r\n if (pts.length < 2) return '';\r\n var d = 'M ' + pts[0].x.toFixed(2) + ' ' + pts[0].y.toFixed(2) + ' ';\r\n for (var i = 0; i < pts.length - 1; i++){\r\n var p0 = pts[i === 0 ? 0 : i - 1];\r\n var p1 = pts[i];\r\n var p2 = pts[i + 1];\r\n var p3 = pts[i + 2 < pts.length ? i + 2 : i + 1];\r\n\r\n var c1x = p1.x + (p2.x - p0.x) \/ 6;\r\n var c1y = p1.y + (p2.y - p0.y) \/ 6;\r\n var c2x = p2.x - (p3.x - p1.x) \/ 6;\r\n var c2y = p2.y - (p3.y - p1.y) \/ 6;\r\n\r\n d += 'C ' + c1x.toFixed(2) + ' ' + c1y.toFixed(2) + ', ' +\r\n c2x.toFixed(2) + ' ' + c2y.toFixed(2) + ', ' +\r\n p2.x.toFixed(2) + ' ' + p2.y.toFixed(2) + ' ';\r\n }\r\n return d;\r\n }\r\n\r\n function measure(){\r\n var sectionRect = section.getBoundingClientRect();\r\n sectionDocTop = sectionRect.top + window.scrollY;\r\n\r\n var raw = nodes.map(function(n){\r\n var r = n.getBoundingClientRect();\r\n return {\r\n x: r.left - sectionRect.left + r.width \/ 2,\r\n y: r.top - sectionRect.top + r.height \/ 2\r\n };\r\n });\r\n\r\n var leadIn = { x: raw[0].x, y: Math.max(raw[0].y - 220, 0) };\r\n points = [leadIn].concat(raw);\r\n\r\n var w = section.clientWidth;\r\n var h = section.scrollHeight;\r\n svg.setAttribute('width', w);\r\n svg.setAttribute('height', h);\r\n svg.style.width = w + 'px';\r\n svg.style.height = h + 'px';\r\n\r\n var d = catmullRomToBezierPath(points);\r\n pathDim.setAttribute('d', d);\r\n pathBright.setAttribute('d', d);\r\n\r\n totalLength = pathBright.getTotalLength();\r\n pathBright.style.strokeDasharray = totalLength;\r\n pathBright.style.strokeDashoffset = totalLength;\r\n\r\n var SAMPLES = 1000;\r\n var samples = new Array(SAMPLES + 1);\r\n for (var s = 0; s <= SAMPLES; s++){\r\n var len = (s \/ SAMPLES) * totalLength;\r\n samples[s] = { len: len, pt: pathBright.getPointAtLength(len) };\r\n }\r\n\r\n function lengthAtPoint(target, searchFromIdx){\r\n var bestIdx = searchFromIdx, bestDist = Infinity;\r\n for (var s = searchFromIdx; s <= SAMPLES; s++){\r\n var d = Math.hypot(samples[s].pt.x - target.x, samples[s].pt.y - target.y);\r\n if (d < bestDist){ bestDist = d; bestIdx = s; }\r\n }\r\n return { len: samples[bestIdx].len, idx: bestIdx };\r\n }\r\n\r\n controlYs = [{ docY: sectionDocTop + raw[0].y - window.innerHeight * 0.5, frac: 0 }];\r\n var searchIdx = 0;\r\n for (var i = 1; i < points.length; i++){\r\n var found = lengthAtPoint(points[i], searchIdx);\r\n searchIdx = found.idx;\r\n controlYs.push({\r\n docY: sectionDocTop + raw[i - 1].y,\r\n frac: found.len \/ totalLength\r\n });\r\n }\r\n\r\n onScroll();\r\n }\r\n\r\n function progressForScroll(){\r\n var ref = window.scrollY + window.innerHeight * 0.55;\r\n if (ref <= controlYs[0].docY) return 0;\r\n for (var i = 0; i < controlYs.length - 1; i++){\r\n var a = controlYs[i], b = controlYs[i + 1];\r\n if (ref >= a.docY && ref <= b.docY){\r\n var t = (ref - a.docY) \/ Math.max(b.docY - a.docY, 1);\r\n return a.frac + t * (b.frac - a.frac);\r\n }\r\n }\r\n return 1;\r\n }\r\n\r\n function onScroll(){\r\n var progress = reduceMotion ? 1 : Math.max(0, Math.min(1, progressForScroll()));\r\n var drawn = totalLength * progress;\r\n pathBright.style.strokeDashoffset = totalLength - drawn;\r\n\r\n if (progress > 0.002){\r\n var pt = pathBright.getPointAtLength(drawn);\r\n leadDot.style.transform = 'translate(' + pt.x.toFixed(1) + 'px,' + pt.y.toFixed(1) + 'px)';\r\n leadDot.classList.add('visible');\r\n } else {\r\n leadDot.classList.remove('visible');\r\n }\r\n\r\n stepEls.forEach(function(step, i){\r\n var nodeFrac = controlYs[i + 1] ? controlYs[i + 1].frac : 1;\r\n step.classList.toggle('active', progress >= nodeFrac - 0.015);\r\n });\r\n\r\n ticking = false;\r\n }\r\n\r\n function requestTick(){\r\n if (!ticking){\r\n requestAnimationFrame(onScroll);\r\n ticking = true;\r\n }\r\n }\r\n\r\n var io = new IntersectionObserver(function(entries){\r\n entries.forEach(function(entry){\r\n if (entry.isIntersecting) entry.target.classList.add('in-view');\r\n });\r\n }, { threshold: 0.35, rootMargin: '0px 0px -10% 0px' });\r\n stepEls.forEach(function(el){ io.observe(el); });\r\n\r\n if (window.ResizeObserver) {\r\n new ResizeObserver(function(){\r\n sizeCanvas();\r\n initParticles();\r\n measure();\r\n }).observe(wrapper);\r\n }\r\n\r\n window.addEventListener('scroll', requestTick, { passive: true });\r\n\r\n sizeCanvas();\r\n initParticles();\r\n requestAnimationFrame(particleLoop);\r\n setTimeout(measure, 100);\r\n\r\n document.fonts && document.fonts.ready.then(measure);\r\n })();\r\n <\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-6bfde12 e-con e-atomic-element e-flexbox-base e-034a582 \" data-id=\"6bfde12\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"6bfde12\">\n \t\t<div class=\"elementor-element elementor-element-19617c5 elementor-widget elementor-widget-html\" data-id=\"19617c5\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n WHAT I BELIEVE IN \u2014 Elementor \"Custom HTML\" widget k\u00f3dja\r\n M\u00e1sold be ezt a teljes blokkot egyben az Elementor\r\n Egyedi HTML (HTML Code) widgetj\u00e9be.\r\n ============================================================ -->\r\n\r\n<section class=\"wibi-section\" id=\"wibi-section\">\r\n\r\n <div class=\"wibi-glow wibi-glow--1\"><\/div>\r\n <div class=\"wibi-glow wibi-glow--2\"><\/div>\r\n\r\n <div class=\"wibi-inner\">\r\n\r\n <div class=\"wibi-header\">\r\n <div class=\"wibi-header__left\">\r\n <span class=\"wibi-eyebrow\">EBBEN HISZEK<\/span>\r\n <h2 class=\"wibi-title\">\r\n Egy m\u00e1rk\u00e1n\u00e1l \u00e9des-kev\u00e9s, ha csak <em>j\u00f3l n\u00e9z ki<\/em>.\r\n <\/h2>\r\n <\/div>\r\n <div class=\"wibi-header__right\">\r\n <p class=\"wibi-intro\">\r\n Szerintem egy j\u00f3 designmunka ott kezd\u0151dik, hogy \u00e9rtj\u00fck, mit szeretn\u00e9nk el\u00e9rni vele. Ez\u00e9rt szeretek k\u00e9rdezni, gondolkodni \u00e9s egy kicsit a felsz\u00edn m\u00f6g\u00e9 n\u00e9zni, miel\u0151tt neki\u00e1llunk b\u00e1rmit megtervezni.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"wibi-grid\">\r\n\r\n <div class=\"wibi-card\">\r\n <div class=\"wibi-card__icon\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle cx=\"10.5\" cy=\"10.5\" r=\"6.5\" stroke=\"currentColor\" stroke-width=\"1.6\"\/>\r\n <line x1=\"15.4\" y1=\"15.4\" x2=\"21\" y2=\"21\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/>\r\n <\/svg>\r\n <\/div>\r\n <span class=\"wibi-card__num\">01<\/span>\r\n <h3 class=\"wibi-card__title\">El\u0151bb \u00e9rts\u00fck meg<\/h3>\r\n <span class=\"wibi-card__rule\"><\/span>\r\n <p class=\"wibi-card__text\">\r\n Ha m\u00e1r az elej\u00e9n azon gondolkodsz, milyen sz\u00edn\u0171 legyen az arculatod, val\u00f3sz\u00edn\u0171leg t\u00fal gyorsan ugrottunk a megold\u00e1sra. El\u0151bb szeretn\u00e9m meg\u00e9rteni, mi\u00e9rt \u00e9rzed azt, hogy v\u00e1ltoztatni kell, mi nem m\u0171k\u00f6dik most, \u00e9s mit szeretn\u00e9l, hogy v\u00e9gre m\u00e1sk\u00e9pp l\u00e1ssanak.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"wibi-card\">\r\n <div class=\"wibi-card__icon\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <path d=\"M12 3l1.8 5.4L19 10l-5.2 1.6L12 17l-1.8-5.4L5 10l5.2-1.6L12 3z\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linejoin=\"round\"\/>\r\n <\/svg>\r\n <\/div>\r\n <span class=\"wibi-card__num\">02<\/span>\r\n <h3 class=\"wibi-card__title\">Megkeress\u00fck, mi nem \u00e1ll \u00f6ssze<\/h3>\r\n <span class=\"wibi-card__rule\"><\/span>\r\n <p class=\"wibi-card__text\">\r\n Lehet, hogy k\u00fcl\u00f6n-k\u00fcl\u00f6n minden rendben van. Van log\u00f3d, van weboldalad, vannak fot\u00f3id, m\u00e9gsem \u00e9rzed egys\u00e9gesnek az eg\u00e9szet. Ilyenkor nem biztos, hogy mindent le kell cser\u00e9lni. El\u0151sz\u00f6r n\u00e9zz\u00fck meg, hol cs\u00faszik el a k\u00e9p.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"wibi-card\">\r\n <div class=\"wibi-card__icon\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <path d=\"M12 3l8 4.5v9L12 21l-8-4.5v-9L12 3z\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linejoin=\"round\"\/>\r\n <path d=\"M4 7.5L12 12l8-4.5M12 12v9\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linejoin=\"round\"\/>\r\n <\/svg>\r\n <\/div>\r\n <span class=\"wibi-card__num\">03<\/span>\r\n <h3 class=\"wibi-card__title\">Minden okkal<br> t\u00f6rt\u00e9nik<\/h3>\r\n <span class=\"wibi-card__rule\"><\/span>\r\n <p class=\"wibi-card__text\">\r\n Lehet, hogy pontosan tudod, mi zavar. Lehet, hogy csak azt \u00e9rzed, hogy ez m\u00e1r nem te vagy. \u00c9s az is teljesen rendben van, ha fogalmad sincs, hogyan lehetne ezen v\u00e1ltoztatni. Nem is ez a te dolgod. Az\u00e9rt dolgozunk egy\u00fctt, hogy ebb\u0151l a \u201evalami nem stimmel\u201d \u00e9rz\u00e9sb\u0151l v\u00e9g\u00fcl egy konkr\u00e9t, m\u0171k\u00f6d\u0151 megold\u00e1s legyen.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"wibi-card\">\r\n <div class=\"wibi-card__icon\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <circle cx=\"9\" cy=\"12\" r=\"6\" stroke=\"currentColor\" stroke-width=\"1.4\"\/>\r\n <circle cx=\"15\" cy=\"12\" r=\"6\" stroke=\"currentColor\" stroke-width=\"1.4\"\/>\r\n <\/svg>\r\n <\/div>\r\n <span class=\"wibi-card__num\">04<\/span>\r\n <h3 class=\"wibi-card__title\">Minden a hely\u00e9re<br>ker\u00fcl<\/h3>\r\n <span class=\"wibi-card__rule\"><\/span>\r\n <p class=\"wibi-card__text\">\r\n Nem szeretn\u00e9m, hogy a v\u00e9g\u00e9n csak annyit mondj: \u201esz\u00e9p lett\u201d. Azt szeretn\u00e9m, hogy r\u00e1n\u00e9zz, \u00e9s minden a hely\u00e9re ker\u00fclj\u00f6n. Hogy v\u00e9gre k\u00edv\u00fclr\u0151l is azt mutassa a m\u00e1rk\u00e1d, ahol most tartasz, \u00e9s ne kelljen k\u00fcl\u00f6n elmagyar\u00e1znod, mit szeretn\u00e9l mondani vele.\r\n <\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<style>\r\n #wibi-section, #wibi-section * { box-sizing: border-box; }\r\n\r\n #wibi-section {\r\n --wibi-peach: #e98a4e;\r\n --wibi-peach-soft: #f3a874;\r\n --wibi-bg-1: #fdf6ef;\r\n --wibi-bg-2: #fbead9;\r\n --wibi-ink: #1c1c1c;\r\n --wibi-text: #4a4441;\r\n --wibi-card-bg: rgba(255, 255, 255, 0.55);\r\n --wibi-card-border: rgba(255, 255, 255, 0.9);\r\n\r\n position: relative;\r\n overflow: hidden;\r\n background: linear-gradient(160deg, var(--wibi-bg-1) 0%, var(--wibi-bg-2) 100%);\r\n padding: 100px 6vw 110px;\r\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif;\r\n }\r\n\r\n .wibi-glow {\r\n position: absolute;\r\n border-radius: 50%;\r\n filter: blur(60px);\r\n pointer-events: none;\r\n z-index: 0;\r\n }\r\n .wibi-glow--1 {\r\n width: 320px;\r\n height: 320px;\r\n top: 60px;\r\n left: 34%;\r\n background: radial-gradient(circle, rgba(233,138,78,0.55) 0%, rgba(233,138,78,0) 70%);\r\n }\r\n .wibi-glow--2 {\r\n width: 420px;\r\n height: 420px;\r\n bottom: -140px;\r\n right: -80px;\r\n background: radial-gradient(circle, rgba(243,168,116,0.35) 0%, rgba(243,168,116,0) 70%);\r\n }\r\n\r\n .wibi-inner {\r\n position: relative;\r\n z-index: 1;\r\n max-width: 1240px;\r\n margin: 0 auto;\r\n }\r\n\r\n .wibi-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-end;\r\n gap: 40px;\r\n margin-bottom: 64px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n .wibi-header__left { flex: 1 1 520px; }\r\n .wibi-header__right { flex: 0 1 340px; padding-bottom: 6px; }\r\n\r\n .wibi-eyebrow {\r\n display: inline-block;\r\n color: var(--wibi-peach);\r\n font-size: 12px;\r\n font-weight: 700;\r\n letter-spacing: 0.22em;\r\n text-transform: uppercase;\r\n margin-bottom: 18px;\r\n }\r\n\r\n .wibi-title {\r\n margin: 0;\r\n color: var(--wibi-ink);\r\n font-family: Georgia, \"Times New Roman\", \"Playfair Display\", serif;\r\n font-weight: 500;\r\n font-size: clamp(34px, 4.6vw, 58px);\r\n line-height: 1.12;\r\n letter-spacing: -0.01em;\r\n }\r\n .wibi-title em {\r\n font-style: italic;\r\n font-weight: 500;\r\n }\r\n\r\n .wibi-intro {\r\n margin: 0;\r\n color: var(--wibi-text);\r\n font-size: 16px;\r\n line-height: 1.65;\r\n }\r\n\r\n .wibi-grid {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 24px;\r\n }\r\n\r\n .wibi-card {\r\n position: relative;\r\n overflow: hidden;\r\n background: var(--wibi-card-bg);\r\n border: 1px solid var(--wibi-card-border);\r\n border-radius: 22px;\r\n padding: 30px 26px 34px;\r\n backdrop-filter: blur(6px);\r\n -webkit-backdrop-filter: blur(6px);\r\n box-shadow: 0 1px 2px rgba(60, 40, 20, 0.04);\r\n transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),\r\n box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);\r\n will-change: transform;\r\n }\r\n\r\n .wibi-card:hover {\r\n transform: translateY(-6px) scale(1.035);\r\n box-shadow: 0 26px 46px -18px rgba(210, 120, 60, 0.35),\r\n 0 10px 20px -10px rgba(60, 40, 20, 0.12);\r\n }\r\n\r\n .wibi-card__icon {\r\n width: 46px;\r\n height: 46px;\r\n border-radius: 50%;\r\n background: rgba(233, 138, 78, 0.14);\r\n color: var(--wibi-peach);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin-bottom: 22px;\r\n }\r\n .wibi-card__icon svg { width: 20px; height: 20px; }\r\n\r\n .wibi-card__num {\r\n display: block;\r\n color: var(--wibi-peach);\r\n font-size: 13px;\r\n font-weight: 700;\r\n letter-spacing: 0.05em;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .wibi-card__title {\r\n margin: 0 0 14px;\r\n color: var(--wibi-ink);\r\n font-size: 19px;\r\n font-weight: 800;\r\n line-height: 1.28;\r\n letter-spacing: -0.01em;\r\n text-transform: uppercase;\r\n }\r\n\r\n .wibi-card__rule {\r\n display: block;\r\n width: 32px;\r\n height: 2px;\r\n background: var(--wibi-peach);\r\n margin-bottom: 16px;\r\n opacity: 0.85;\r\n }\r\n\r\n .wibi-card__text {\r\n position: relative;\r\n z-index: 1;\r\n margin: 0;\r\n color: var(--wibi-text);\r\n font-size: 14.5px;\r\n line-height: 1.65;\r\n }\r\n\r\n \/* --- scroll-in anim\u00e1ci\u00f3 --- *\/\r\n .wibi-header__left,\r\n .wibi-header__right,\r\n .wibi-grid {\r\n opacity: 0;\r\n transform: translateY(28px);\r\n transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),\r\n transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);\r\n }\r\n #wibi-section.wibi-inview .wibi-header__left { opacity: 1; transform: translateY(0); }\r\n #wibi-section.wibi-inview .wibi-header__right { opacity: 1; transform: translateY(0); transition-delay: 0.12s; }\r\n #wibi-section.wibi-inview .wibi-grid { opacity: 1; transform: translateY(0); transition-delay: 0.22s; }\r\n\r\n \/* --- reszponzivit\u00e1s --- *\/\r\n @media (max-width: 980px) {\r\n .wibi-grid { grid-template-columns: repeat(2, 1fr); }\r\n .wibi-header { align-items: flex-start; }\r\n }\r\n\r\n @media (max-width: 600px) {\r\n #wibi-section { padding: 70px 6vw 80px; }\r\n .wibi-grid { grid-template-columns: 1fr; }\r\n .wibi-header { gap: 20px; margin-bottom: 44px; }\r\n .wibi-header__right { flex-basis: 100%; }\r\n .wibi-title { font-size: 32px; }\r\n }\r\n<\/style>\r\n\r\n<script>\r\n (function () {\r\n var section = document.getElementById('wibi-section');\r\n if (!section || !('IntersectionObserver' in window)) {\r\n if (section) section.classList.add('wibi-inview');\r\n return;\r\n }\r\n var observer = new IntersectionObserver(function (entries) {\r\n entries.forEach(function (entry) {\r\n if (entry.isIntersecting) {\r\n section.classList.add('wibi-inview');\r\n observer.unobserve(section);\r\n }\r\n });\r\n }, { threshold: 0.2 });\r\n observer.observe(section);\r\n })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-23df0f08 e-con e-atomic-element e-flexbox-base e-23df0f08-e2554b4 \" data-id=\"23df0f08\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"23df0f08\">\n \t\t<div class=\"elementor-element elementor-element-525f7350 elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-html\" data-id=\"525f7350\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"left-hero-wrapper\">\r\n <div class=\"hero-tag\">\r\n <span class=\"hero-dot\"><\/span>\r\n Kezdj\u00fck el\r\n <\/div>\r\n \r\n <h1 class=\"hero-title\">\r\n Van egy \u00f6tleted? N\u00e9zz\u00fck meg, mi lehet bel\u0151le.<br>\r\n \r\n <\/h1>\r\n\r\n <div class=\"hero-divider\"><\/div>\r\n\r\n <p class=\"hero-subtitle\">\r\n Lehet, hogy m\u00e1r pontosan tudod, mit szeretn\u00e9l. Az is lehet, hogy csak \u00e9rzed, hogy valami nem m\u0171k\u00f6dik \u00fagy, ahogy szeretn\u00e9d. Egy\u00fctt kibogozzuk, kital\u00e1ljuk, megtervezz\u00fck, azt\u00e1n \u00e9letet adunk neki.\r\n <\/p>\r\n<\/div>\r\n\r\n<style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Montserrat:wght@400;500;600;700;800&display=swap');\r\n\r\n .left-hero-wrapper {\r\n font-family: 'Montserrat', sans-serif;\r\n width: 100%;\r\n background: transparent;\r\n \/* Balr\u00f3l 3rem (kb. 50px) marg\u00f3t kapott, hogy beljebb ker\u00fclj\u00f6n *\/\r\n padding: 2rem 1rem 2rem 3rem; \r\n box-sizing: border-box;\r\n }\r\n\r\n .hero-tag {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n color: #ff7a18;\r\n font-family: 'Montserrat', sans-serif;\r\n font-size: 1rem;\r\n font-weight: 500;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .hero-dot {\r\n width: 8px;\r\n height: 8px;\r\n background-color: #ff7a18;\r\n border-radius: 50%;\r\n }\r\n\r\n .hero-title {\r\n font-family: 'Fraunces', serif;\r\n font-size: 3.5rem;\r\n font-weight: 400;\r\n line-height: 1.1;\r\n letter-spacing: -0.02em;\r\n color: #121826;\r\n margin: 0 0 2.5rem 0;\r\n }\r\n\r\n .hero-divider {\r\n width: 60px;\r\n height: 1px;\r\n background-color: #c4c7cc;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .hero-subtitle {\r\n font-family: 'Montserrat', sans-serif;\r\n font-size: 1.1rem;\r\n color: #6c727f;\r\n font-weight: 400;\r\n line-height: 1.5;\r\n margin: 0;\r\n }\r\n\r\n @media (max-width: 1024px) {\r\n .left-hero-wrapper {\r\n padding-left: 1.5rem;\r\n }\r\n .hero-title {\r\n font-size: 2.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .left-hero-wrapper {\r\n padding: 1.5rem 1rem;\r\n }\r\n .hero-title {\r\n font-size: 2.2rem;\r\n }\r\n }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1b9c0f53 elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-spacer\" data-id=\"1b9c0f53\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-45ec283f elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet mauve-contact-form-7-button-custom elementor-widget elementor-widget-mauve-contact-form-7\" data-id=\"45ec283f\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"mauve-contact-form-7.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"mauve-contact-form-7-wrapper mauve-contact-form mauve-contact-form-7 mauve-contact-form-45ec283f mauve-contact-form-align-default\">\n <div class=\"mauve-contact-form-7-inner\">\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f128-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"128\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/en\/wp-json\/wp\/v2\/pages\/3632#wpcf7-f128-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"128\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.7\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f128-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<div class=\"row\">\n\t<div class=\"col-lg-6\">\n\t\t<p><label>First name*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"first-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"First name*\" value=\"\" type=\"text\" name=\"first-name\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Last name*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"last-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Last name*\" value=\"\" type=\"text\" name=\"last-name\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n<\/div>\n<div class=\"row\">\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Your email*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Your email*\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Industry<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"industry\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text\" aria-invalid=\"false\" placeholder=\"Industry\" value=\"\" type=\"text\" name=\"industry\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n<\/div>\n<p><label>Subject*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Subject*\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span>\n<\/p>\n<p><label>Your message (optional)<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" placeholder=\"Your message\" name=\"your-message\"><\/textarea><\/span>\n<\/p>\n<p class=\"submit-cf7\"><input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Submit Form\" \/>\n<\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n<\/div>\n <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-46626eff e-con e-atomic-element e-flexbox-base e-46626eff-4799dad \" data-id=\"46626eff\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"46626eff\">\n <div class=\"elementor-element elementor-element-701b52be e-con e-atomic-element e-flexbox-base e-701b52be-02e5c23 \" data-id=\"701b52be\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"701b52be\">\n \t\t<div class=\"elementor-element elementor-element-6cd224 elementor-hidden-mobile elementor-widget elementor-widget-spacer\" data-id=\"6cd224\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-591dce81 elementor-hidden-mobile elementor-widget elementor-widget-html\" data-id=\"591dce81\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"left-hero-wrapper\">\r\n <div class=\"hero-tag\">\r\n <span class=\"hero-dot\"><\/span>\r\n Kezdj\u00fck el\r\n <\/div>\r\n \r\n <h1 class=\"hero-title\">\r\n Van egy \u00f6tleted? N\u00e9zz\u00fck meg, mi lehet bel\u0151le.<br>\r\n \r\n <\/h1>\r\n\r\n <div class=\"hero-divider\"><\/div>\r\n\r\n <p class=\"hero-subtitle\">\r\n Lehet, hogy m\u00e1r pontosan tudod, mit szeretn\u00e9l. Az is lehet, hogy csak \u00e9rzed, hogy valami nem m\u0171k\u00f6dik \u00fagy, ahogy szeretn\u00e9d. Egy\u00fctt kibogozzuk, kital\u00e1ljuk, megtervezz\u00fck, azt\u00e1n \u00e9letet adunk neki.\r\n <\/p>\r\n<\/div>\r\n\r\n<style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Montserrat:wght@400;500;600;700;800&display=swap');\r\n\r\n .left-hero-wrapper {\r\n font-family: 'Montserrat', sans-serif;\r\n width: 100%;\r\n background: transparent;\r\n \/* Balr\u00f3l 3rem (kb. 50px) marg\u00f3t kapott, hogy beljebb ker\u00fclj\u00f6n *\/\r\n padding: 2rem 1rem 2rem 3rem; \r\n box-sizing: border-box;\r\n }\r\n\r\n .hero-tag {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n color: #ff7a18;\r\n font-family: 'Montserrat', sans-serif;\r\n font-size: 1rem;\r\n font-weight: 500;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .hero-dot {\r\n width: 8px;\r\n height: 8px;\r\n background-color: #ff7a18;\r\n border-radius: 50%;\r\n }\r\n\r\n .hero-title {\r\n font-family: 'Fraunces', serif;\r\n font-size: 3.5rem;\r\n font-weight: 400;\r\n line-height: 1.1;\r\n letter-spacing: -0.02em;\r\n color: #121826;\r\n margin: 0 0 2.5rem 0;\r\n }\r\n\r\n .hero-divider {\r\n width: 60px;\r\n height: 1px;\r\n background-color: #c4c7cc;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .hero-subtitle {\r\n font-family: 'Montserrat', sans-serif;\r\n font-size: 1.1rem;\r\n color: #6c727f;\r\n font-weight: 400;\r\n line-height: 1.5;\r\n margin: 0;\r\n }\r\n\r\n @media (max-width: 1024px) {\r\n .left-hero-wrapper {\r\n padding-left: 1.5rem;\r\n }\r\n .hero-title {\r\n font-size: 2.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .left-hero-wrapper {\r\n padding: 1.5rem 1rem;\r\n }\r\n .hero-title {\r\n font-size: 2.2rem;\r\n }\r\n }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-52aad059 e-con e-atomic-element e-flexbox-base e-52aad059-2e59f11 \" data-id=\"52aad059\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"52aad059\">\n \t\t<div class=\"elementor-element elementor-element-3cb5e14c elementor-hidden-mobile elementor-widget elementor-widget-spacer\" data-id=\"3cb5e14c\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6079c422 elementor-hidden-mobile mauve-contact-form-7-button-custom elementor-widget elementor-widget-mauve-contact-form-7\" data-id=\"6079c422\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"mauve_hidepaged":"false"}\" data-widget_type=\"mauve-contact-form-7.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"mauve-contact-form-7-wrapper mauve-contact-form mauve-contact-form-7 mauve-contact-form-6079c422 mauve-contact-form-align-default\">\n <div class=\"mauve-contact-form-7-inner\">\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f128-o2\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"128\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/en\/wp-json\/wp\/v2\/pages\/3632#wpcf7-f128-o2\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"128\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.7\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f128-o2\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<div class=\"row\">\n\t<div class=\"col-lg-6\">\n\t\t<p><label>First name*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"first-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"First name*\" value=\"\" type=\"text\" name=\"first-name\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Last name*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"last-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Last name*\" value=\"\" type=\"text\" name=\"last-name\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n<\/div>\n<div class=\"row\">\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Your email*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Your email*\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"col-lg-6\">\n\t\t<p><label>Industry<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"industry\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text\" aria-invalid=\"false\" placeholder=\"Industry\" value=\"\" type=\"text\" name=\"industry\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n<\/div>\n<p><label>Subject*<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Subject*\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span>\n<\/p>\n<p><label>Your message (optional)<\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" placeholder=\"Your message\" name=\"your-message\"><\/textarea><\/span>\n<\/p>\n<p class=\"submit-cf7\"><input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Submit Form\" \/>\n<\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n<\/div>\n <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>NUANCE \u2014 Before the Brand Egy j\u00f3 ir\u00e1ny mindent megv\u00e1ltoztat. Lehet, hogy kin\u0151tted azt az arculatot, amivel elindult\u00e1l. Lehet, hogy a weboldalad m\u00e1r nem azt mutatja, ahol most tartasz. Vagy…<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-3632","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3632","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/comments?post=3632"}],"version-history":[{"count":142,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3632\/revisions"}],"predecessor-version":[{"id":4245,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3632\/revisions\/4245"}],"wp:attachment":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/media?parent=3632"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/categories?post=3632"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/tags?post=3632"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}