{"id":3627,"date":"2026-08-27T17:37:42","date_gmt":"2026-08-27T15:37:42","guid":{"rendered":"http:\/\/nuancecreative.hu\/?page_id=3627"},"modified":"2026-09-16T14:21:54","modified_gmt":"2026-09-16T12:21:54","slug":"services-2","status":"publish","type":"page","link":"https:\/\/nuancecreative.hu\/en\/services-2\/","title":{"rendered":"SERVICES"},"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>A m\u00e1rka nemcsak<br>arr\u00f3l sz\u00f3l, hogy n\u00e9z ki.<\/h2>\r\n <p class=\"nuance-thinking__desc\">\r\n Seg\u00edtek megtal\u00e1lni azt az ir\u00e1nyt, ami val\u00f3ban illik a v\u00e1llalkoz\u00e1sodhoz, majd ebb\u0151l olyan m\u00e1rk\u00e1t \u00e9p\u00edtek, ami karakteres, k\u00f6vetkezetes \u00e9s hossz\u00fa t\u00e1von is m\u0171k\u00f6dik.\r\n <\/p>\r\n <a href=\"https:\/\/nuancecreative.hu\/kapcsolat\/\" class=\"nuance-thinking__btn\">\r\n besz\u00e9lj\u00fcnk r\u00f3la <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: 520px;\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-6ae0fffd e-con e-atomic-element e-flexbox-base e-6ae0fffd-45e91b4 \" data-id=\"6ae0fffd\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"6ae0fffd\">\n \t\t<div class=\"elementor-element elementor-element-602685c elementor-widget-laptop__width-initial elementor-widget elementor-widget-html\" data-id=\"602685c\" 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: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 .ncs-services{\r\n --ncs-bg:#08080a;\r\n --ncs-bg-card:#101013;\r\n --ncs-line:#1c1c1f;\r\n --ncs-text-primary:#f5f5f7;\r\n --ncs-text-secondary:#f5f5f7;\r\n --ncs-text-tertiary:#a1a1aa;\r\n --ncs-badge-bg:#0a0a0c;\r\n --ncs-badge-border:#2a2a2e;\r\n --ncs-tag-bg:#131316;\r\n --ncs-accent:#d59256;\r\n --ncs-tag-text:#e7c9a4;\r\n --ncs-font-serif:'Fraunces', serif;\r\n --ncs-font-sans:'Montserrat', sans-serif;\r\n --ncs-radius-pill:999px;\r\n\r\n display:block;\r\n background:var(--ncs-bg);\r\n color:var(--ncs-text-primary);\r\n font-family:var(--ncs-font-sans);\r\n -webkit-font-smoothing:antialiased;\r\n padding:100px 6vw 140px;\r\n position:relative;\r\n overflow:visible !important;\r\n }\r\n\r\n .ncs-services *{ box-sizing:border-box; }\r\n\r\n .ncs-services::before{\r\n content:\"\";\r\n position:absolute;\r\n top:0; left:0; right:0; height:1px;\r\n background:linear-gradient(90deg, transparent, var(--ncs-line) 20%, var(--ncs-line) 80%, transparent);\r\n }\r\n\r\n .ncs-head{\r\n display:flex;\r\n justify-content:space-between;\r\n align-items:flex-end;\r\n gap:32px;\r\n margin-bottom:80px;\r\n max-width:1400px;\r\n margin-left:auto;\r\n margin-right:auto;\r\n }\r\n\r\n .ncs-eyebrow{\r\n display:flex;\r\n align-items:center;\r\n gap:10px;\r\n font-family:var(--ncs-font-sans);\r\n font-weight:600;\r\n font-size:12px;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n color:var(--ncs-accent);\r\n margin-bottom:18px;\r\n }\r\n\r\n .ncs-head h2{\r\n font-family:var(--ncs-font-serif);\r\n font-optical-sizing:auto;\r\n font-size:clamp(34px, 4vw, 58px);\r\n font-weight:600;\r\n letter-spacing:-0.01em;\r\n line-height:1.08;\r\n max-width:640px;\r\n margin:0;\r\n color: var(--ncs-text-primary);\r\n }\r\n\r\n .ncs-head p{\r\n color:var(--ncs-text-primary);\r\n max-width:340px;\r\n font-size:15px;\r\n line-height:1.6;\r\n padding-bottom:6px;\r\n margin:0;\r\n }\r\n\r\n \/* ============ STICKY STACK ============ *\/\r\n .ncs-list{\r\n max-width:1400px;\r\n margin:0 auto;\r\n position:relative;\r\n }\r\n\r\n .ncs-card{\r\n position: sticky;\r\n top: 100px; \/* Itt \u00e1ll meg a k\u00e1rtya a k\u00e9perny\u0151 tetej\u00e9t\u0151l sz\u00e1m\u00edtva *\/\r\n display: grid;\r\n grid-template-columns: 70px minmax(220px, 320px) 1fr minmax(260px, 340px);\r\n align-items: center;\r\n gap: 40px;\r\n background: var(--ncs-bg-card);\r\n border: 1px solid var(--ncs-line);\r\n border-radius: 32px;\r\n box-shadow: 0 20px 40px rgba(0,0,0,0.6);\r\n padding: 48px 48px;\r\n margin-bottom: 40px; \/* Biztos\u00edtja a g\u00f6rget\u00e9si t\u00e1vols\u00e1got a k\u00e1rty\u00e1k k\u00f6z\u00f6tt *\/\r\n }\r\n\r\n \/* --- number badge --- *\/\r\n .ncs-badge{\r\n width:56px;\r\n height:36px;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n background:var(--ncs-badge-bg);\r\n border:1px solid var(--ncs-badge-border);\r\n border-radius:10px;\r\n font-family:var(--ncs-font-sans);\r\n font-weight:600;\r\n font-size:13px;\r\n color:var(--ncs-text-primary);\r\n letter-spacing:.03em;\r\n }\r\n\r\n \/* --- mockup frame --- *\/\r\n .ncs-mockup{\r\n position:relative;\r\n aspect-ratio:16\/10.5;\r\n border-radius:16px;\r\n overflow:hidden;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n isolation:isolate;\r\n }\r\n\r\n .ncs-mockup-inner{ position:absolute; inset:0; }\r\n\r\n .ncs-mockup-label{\r\n position:absolute;\r\n bottom:14px;\r\n left:16px;\r\n font-family:var(--ncs-font-sans);\r\n font-weight:600;\r\n font-size:10px;\r\n letter-spacing:.08em;\r\n text-transform:uppercase;\r\n opacity:.75;\r\n z-index:2;\r\n }\r\n\r\n \/* mockup 001 \u2014 Web Design *\/\r\n .ncs-mockup-001{ background:linear-gradient(160deg,#151516,#0c0c0d); }\r\n .ncs-mockup-001 .ncs-grid{\r\n position:absolute; inset:14%;\r\n display:grid;\r\n grid-template-columns:1.3fr 1fr;\r\n grid-template-rows:1fr 1fr;\r\n gap:8px;\r\n border-radius:10px;\r\n overflow:hidden;\r\n }\r\n .ncs-mockup-001 .ncs-cell{border-radius:6px;}\r\n .ncs-mockup-001 .ncs-c1{background:#ff5a1f;grid-row:1\/3;display:flex;align-items:flex-end;padding:10px;color:#1a0a03;font-size:9px;font-weight:700;}\r\n .ncs-mockup-001 .ncs-c2{background:#e8ff5b;}\r\n .ncs-mockup-001 .ncs-c3{background:#1f9d55;}\r\n .ncs-mockup-001 .ncs-stand{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);width:26%;height:6%;background:#2a2a2c;border-radius:4px;}\r\n\r\n \/* mockup 002 \u2014 Social Media *\/\r\n .ncs-mockup-002{ background:linear-gradient(150deg,#1c3fae,#0d1c52); }\r\n .ncs-mockup-002 .ncs-mcard{\r\n position:absolute; width:52%; height:70%; top:15%; left:24%;\r\n background:#f5f5f2; border-radius:10px;\r\n box-shadow:0 20px 40px rgba(0,0,0,.35);\r\n transform:rotate(-4deg);\r\n display:flex; align-items:center; justify-content:center;\r\n }\r\n .ncs-mockup-002 .ncs-mcard span{ font-size:38px; font-weight:800; color:#0d1c52; letter-spacing:-0.03em; }\r\n .ncs-mockup-002 .ncs-ring{ position:absolute; width:22%; aspect-ratio:1; border:7px solid #d5d9c9; border-radius:50%; top:6%; right:16%; }\r\n .ncs-mockup-002 .ncs-dot{ position:absolute; width:14px; height:14px; border-radius:50%; background:#c7ff5b; top:9%; right:24%; }\r\n\r\n \/* mockup 003 \u2014 Marketing *\/\r\n .ncs-mockup-003{ background:radial-gradient(120% 100% at 30% 20%, #ff6a2b, #7a1207 70%); }\r\n .ncs-mockup-003 .ncs-beam{\r\n position:absolute; inset:0;\r\n background:repeating-linear-gradient(115deg, rgba(0,0,0,0) 0 18px, rgba(0,0,0,.18) 18px 20px);\r\n mix-blend-mode:multiply;\r\n }\r\n .ncs-mockup-003 .ncs-board{\r\n position:absolute; left:8%; right:8%; bottom:14%; height:34%;\r\n background:rgba(10,4,2,.55);\r\n border:1px solid rgba(255,255,255,.15);\r\n border-radius:6px;\r\n display:flex; align-items:center; padding:0 5%;\r\n }\r\n .ncs-mockup-003 .ncs-board span{ font-family:var(--ncs-font-sans); font-weight:600; font-size:10px; letter-spacing:.1em; color:#ffd9c2; text-transform:uppercase; }\r\n\r\n \/* mockup 004 \u2014 Brand Identity *\/\r\n .ncs-mockup-004{ background:linear-gradient(160deg,#232326,#101012); }\r\n .ncs-mockup-004 .ncs-watch{\r\n position:absolute; width:34%; aspect-ratio:0.86;\r\n background:#0a0a0b;\r\n border:3px solid #3a3a3d;\r\n border-radius:26%;\r\n top:50%; left:50%; transform:translate(-50%,-50%);\r\n display:flex; align-items:center; justify-content:center;\r\n box-shadow:0 12px 30px rgba(0,0,0,.5);\r\n }\r\n .ncs-mockup-004 .ncs-watch span{ font-family:var(--ncs-font-sans); font-weight:700; color:var(--ncs-accent); font-size:15px; letter-spacing:.05em; }\r\n .ncs-mockup-004 .ncs-crown{ position:absolute; width:5%; height:10%; background:#3a3a3d; border-radius:2px; top:44%; left:calc(50% + 17%); }\r\n\r\n \/* mockup 005 \u2014 Content *\/\r\n .ncs-mockup-005{ background:linear-gradient(160deg,#f5f5f2,#e4e4de); }\r\n .ncs-mockup-005 .ncs-cols{ position:absolute; inset:12%; display:grid; grid-template-columns:1fr 1fr; gap:10%; }\r\n .ncs-mockup-005 .ncs-lines span{ display:block; height:6px; background:#0c0c0d; border-radius:3px; margin-bottom:9px; opacity:.85; }\r\n .ncs-mockup-005 .ncs-lines span:nth-child(1){width:100%;}\r\n .ncs-mockup-005 .ncs-lines span:nth-child(2){width:78%;}\r\n .ncs-mockup-005 .ncs-lines span:nth-child(3){width:88%;}\r\n .ncs-mockup-005 .ncs-lines span:nth-child(4){width:60%;}\r\n .ncs-mockup-005 .ncs-swatch{ background:#ff5a1f; border-radius:8px; height:100%; }\r\n\r\n \/* --- text content --- *\/\r\n .ncs-text h3{\r\n font-family:var(--ncs-font-serif);\r\n font-size:clamp(24px, 2.2vw, 32px);\r\n font-weight:600;\r\n letter-spacing:-0.01em;\r\n margin:0 0 14px;\r\n color: var(--ncs-text-primary);\r\n }\r\n .ncs-text p{\r\n font-family:var(--ncs-font-sans);\r\n color:var(--ncs-text-primary);\r\n font-size:15px;\r\n line-height:1.65;\r\n max-width:46ch;\r\n margin:0;\r\n }\r\n\r\n \/* --- categories --- *\/\r\n .ncs-categories .ncs-cat-label{\r\n font-family:var(--ncs-font-sans);\r\n font-weight:600;\r\n font-size:11px;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n color:var(--ncs-text-tertiary);\r\n margin-bottom:14px;\r\n display:block;\r\n }\r\n .ncs-tag-list{ display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }\r\n .ncs-tag{\r\n padding:8px 14px;\r\n background:var(--ncs-tag-bg);\r\n border:1.5px solid var(--ncs-accent);\r\n border-radius:var(--ncs-radius-pill);\r\n font-family:var(--ncs-font-sans);\r\n font-weight:500;\r\n font-size:12.5px;\r\n color:var(--ncs-tag-text);\r\n white-space:nowrap;\r\n transition:background .3s ease, color .3s ease;\r\n }\r\n .ncs-tag:hover{ background:var(--ncs-accent); color:#1a1006; }\r\n\r\n \/* ============ RESPONSIVE ============ *\/\r\n @media (max-width:1024px){\r\n .ncs-card{\r\n grid-template-columns:56px minmax(200px,280px) 1fr;\r\n grid-template-areas:\r\n \"badge mockup mockup\"\r\n \"badge text text\"\r\n \". cats cats\";\r\n row-gap:22px;\r\n padding:44px 36px;\r\n }\r\n .ncs-badge{grid-area:badge; align-self:start;}\r\n .ncs-mockup{grid-area:mockup;}\r\n .ncs-text{grid-area:text;}\r\n .ncs-categories{grid-area:cats;}\r\n }\r\n\r\n @media (max-width:768px){\r\n .ncs-services{padding:80px 6vw 56px;}\r\n .ncs-head{flex-direction:column;align-items:flex-start;margin-bottom:56px;}\r\n .ncs-list{padding-bottom:0;}\r\n .ncs-card{\r\n position:static;\r\n transform:none !important;\r\n filter:none !important;\r\n grid-template-columns:1fr;\r\n grid-template-areas:\r\n \"mockup\"\r\n \"meta\"\r\n \"text\"\r\n \"cats\";\r\n row-gap:16px;\r\n padding:28px 22px;\r\n margin-bottom:20px;\r\n box-shadow:0 12px 28px rgba(0,0,0,.35);\r\n border-radius:24px;\r\n }\r\n .ncs-mockup{grid-area:mockup; aspect-ratio:16\/11;}\r\n .ncs-badge{grid-area:meta; width:48px; height:32px;}\r\n .ncs-text{grid-area:text;}\r\n .ncs-categories{grid-area:cats;}\r\n .ncs-tag{padding:10px 16px; font-size:13px;}\r\n }\r\n<\/style>\r\n\r\n<section class=\"ncs-services\">\r\n <div class=\"ncs-head\">\r\n <div>\r\n <div class=\"ncs-eyebrow\">Megold\u00e1sok<\/div>\r\n <h2>Miben keresel megold\u00e1st?<\/h2>\r\n <\/div>\r\n <p>\u00d6t ter\u00fclet, egy gondolkod\u00e1sm\u00f3d: el\u0151sz\u00f6r \u00e9rts\u00fck meg, mi nem m\u0171k\u00f6dik, azt\u00e1n kezdj\u00fcnk el rajta v\u00e1ltoztatni.<\/p>\r\n <\/div>\r\n\r\n <div class=\"ncs-list\" id=\"ncsRowList\"><\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function(){\r\n var NCS_SERVICES = [\r\n {\r\n id: \"01\",\r\n title: \"Web Design\",\r\n description: \"Egy j\u00f3 weboldal nem att\u00f3l m\u0171k\u00f6dik, hogy minden inform\u00e1ci\u00f3 \u00f6mlesztve rajta van. Hanem att\u00f3l, hogy mire a l\u00e1togat\u00f3 eljut a kapcsolatfelv\u00e9telig, m\u00e1r azt \u00e9rzi: Igen, pont ezt kerestem,ez KELL nekem. Ezt a logik\u00e1t \u00e9p\u00edtem fel a designban \u00e9s a m\u0171k\u00f6d\u00e9sben is.\",\r\n tags: [\"Wordpress\", \"Weboldal\", \"Web Design\", \"Webshop\", \"Reszponz\u00edv Design\"],\r\n mockup: \"001\"\r\n },\r\n {\r\n id: \"02\",\r\n title: \"M\u00e1rka\u00e9p\u00edt\u00e9s\",\r\n description: \"Lehet egy m\u00e1rk\u00e1d, ami j\u00f3l n\u00e9z ki, m\u00e9gis minden alkalommal \u00fajra ki kell tal\u00e1lni, hogyan jelenjen meg. Itt rakjuk rendbe az alapokat, a pozicion\u00e1l\u00e1st\u00f3l \u00e9s a m\u00e1rka karakter\u00e9t\u0151l a vizu\u00e1lis rendszerig, hogy v\u00e9gre legyen egy stabil ir\u00e1ny, amib\u0151l \u00f6n\u00e1ll\u00f3an is tudsz tov\u00e1bb\u00e9p\u00edtkezni.\",\r\n tags: [\"M\u00e1rkastrat\u00e9gia\", \"Arculattervez\u00e9s\", \"Log\u00f3\", \"Vizu\u00e1lis identit\u00e1s\", \"M\u00e1rkarendszer\"],\r\n mockup: \"004\"\r\n },\r\n {\r\n id: \"03\",\r\n title: \"Rebrand\",\r\n description: \"Van m\u00e1r egy m\u00e1rk\u00e1d. Van weboldalad. Tal\u00e1n m\u00e9g szereted is valamennyire. Csak valahogy m\u00e1r nem \u00e9rzed a saj\u00e1todnak. Vagy egyszer\u0171en kin\u0151tted. Ilyenkor nem mindent kezd\u00fcnk el\u00f6lr\u0151l, hanem megn\u00e9zz\u00fck, mi maradjon, mi v\u00e1ltozzon, \u00e9s hogyan lehet bel\u0151le egy olyan m\u00e1rka, amiben v\u00e9gre magadra ismersz.\",\r\n tags: [\"M\u00e1rkafriss\u00edt\u00e9s\", \"\u00dajratervez\u00e9s\", \"Arculatfriss\u00edt\u00e9s\", \"Weboldal\", \"Vizu\u00e1lis identit\u00e1s\"],\r\n mockup: \"002\"\r\n },\r\n {\r\n id: \"04\",\r\n title: \"Kamp\u00e1nyok & kommunik\u00e1ci\u00f3\",\r\n description: \"Van egy term\u00e9ked, szolg\u00e1ltat\u00e1sod vagy \u00f6tleted, csak m\u00e9g nem tudod, hogyan lehetne igaz\u00e1n megmozgatni vele az embereket? Egy\u00fctt kital\u00e1ljuk a kamp\u00e1ny ir\u00e1ny\u00e1t, fel\u00e9p\u00edtj\u00fck a kommunik\u00e1ci\u00f3j\u00e1t, \u00e9s megtervezz\u00fck hozz\u00e1 azokat a tartalmakat \u00e9s hirdet\u00e9seket, amelyek \u00e9letre keltik.\",\r\n tags: [\"Kamp\u00e1ny\u00f6tlet\", \"Kamp\u00e1nytervez\u00e9s\", \"K\u00f6z\u00f6ss\u00e9gi m\u00e9dia\", \"Hirdet\u00e9sek\", \"Kreat\u00edv koncepci\u00f3\"],\r\n mockup: \"003\"\r\n },\r\n {\r\n id: \"05\",\r\n title: \"M\u00e1rkaanyagok\",\r\n description: \"A m\u00e1rka nem csak a weboldaladon jelenik meg. Ott van egy prezent\u00e1ci\u00f3ban, egy aj\u00e1nlatban, egy n\u00e9vjegyen, egy kiadv\u00e1nyban, egy csomagol\u00e1son vagy ak\u00e1r egy esem\u00e9nyen is. Ezeket \u00fagy tervezem meg, hogy b\u00e1rhol tal\u00e1lkozzanak vele, ugyanazt a m\u00e1rk\u00e1t \u00e9rezz\u00e9k m\u00f6g\u00f6tte.\",\r\n tags: [\"Nyomtatott anyagok\", \"Esem\u00e9nyanyagok\", \"Kiadv\u00e1ny\", \"Csomagol\u00e1s\", \"N\u00e9vjegy\"],\r\n mockup: \"005\"\r\n }\r\n ];\r\n\r\n var NCS_MOCKUPS = {\r\n \"001\": '\\\r\n <div class=\"ncs-mockup-inner\">\\\r\n <div class=\"ncs-grid\">\\\r\n <div class=\"ncs-cell ncs-c1\">Web Design<\/div>\\\r\n <div class=\"ncs-cell ncs-c2\"><\/div>\\\r\n <div class=\"ncs-cell ncs-c3\"><\/div>\\\r\n <\/div>\\\r\n <div class=\"ncs-stand\"><\/div>\\\r\n <\/div>\\\r\n <span class=\"ncs-mockup-label\" style=\"color:#f5f5f5\">Product \/ UI<\/span>',\r\n \"002\": '\\\r\n <div class=\"ncs-mockup-inner\">\\\r\n <div class=\"ncs-ring\"><\/div>\\\r\n <div class=\"ncs-dot\"><\/div>\\\r\n <div class=\"ncs-mcard\"><span>SM<\/span><\/div>\\\r\n <\/div>\\\r\n <span class=\"ncs-mockup-label\" style=\"color:#eef1ff\">Campaign Post<\/span>',\r\n \"003\": '\\\r\n <div class=\"ncs-mockup-inner\">\\\r\n <div class=\"ncs-beam\"><\/div>\\\r\n <div class=\"ncs-board\"><span>Subway (Metro) Billboard \u2014 001<\/span><\/div>\\\r\n <\/div>\\\r\n <span class=\"ncs-mockup-label\" style=\"color:#ffe3d1\">Out-of-Home<\/span>',\r\n \"004\": '\\\r\n <div class=\"ncs-mockup-inner\">\\\r\n <div class=\"ncs-watch\"><span>004<\/span><\/div>\\\r\n <div class=\"ncs-crown\"><\/div>\\\r\n <\/div>\\\r\n <span class=\"ncs-mockup-label\" style=\"color:#d7d7da\">Identity System<\/span>',\r\n \"005\": '\\\r\n <div class=\"ncs-mockup-inner\">\\\r\n <div class=\"ncs-cols\">\\\r\n <div class=\"ncs-lines\">\\\r\n <span><\/span><span><\/span><span><\/span><span><\/span>\\\r\n <\/div>\\\r\n <div class=\"ncs-swatch\"><\/div>\\\r\n <\/div>\\\r\n <\/div>\\\r\n <span class=\"ncs-mockup-label\" style=\"color:#1a1a1a\">Editorial<\/span>'\r\n };\r\n\r\n var list = document.getElementById('ncsRowList');\r\n if (!list) return;\r\n\r\n \/\/ L\u00e9trehozzuk a k\u00e1rty\u00e1kat n\u00f6vekv\u0151 z-index-szel, hogy a k\u00f6vetkez\u0151 mindig r\u00e1\u00fasszon az el\u0151z\u0151re\r\n list.innerHTML = NCS_SERVICES.map(function(item, i){\r\n return '\\\r\n <article class=\"ncs-card\" data-id=\"' + item.id + '\" style=\"z-index:' + (i + 1) + '; top:' + (100 + (i * 15)) + 'px;\">\\\r\n <div class=\"ncs-badge\">' + item.id + '<\/div>\\\r\n <div class=\"ncs-mockup ncs-mockup-' + item.mockup + '\">' + NCS_MOCKUPS[item.mockup] + '<\/div>\\\r\n <div class=\"ncs-text\">\\\r\n <h3>' + item.title + '<\/h3>\\\r\n <p>' + item.description + '<\/p>\\\r\n <\/div>\\\r\n <div class=\"ncs-categories\">\\\r\n <span class=\"ncs-cat-label\">Categories<\/span>\\\r\n <div class=\"ncs-tag-list\">' + item.tags.map(function(t){ return '<span class=\"ncs-tag\">' + t + '<\/span>'; }).join('') + '<\/div>\\\r\n <\/div>\\\r\n <\/article>';\r\n }).join('');\r\n\r\n \/\/ Automatikusan kiszedi az esetleges rejtett overflow tulajdons\u00e1gokat a sz\u00fcl\u0151kt\u0151l (pl. Elementorban)\r\n function ncsFixAncestorOverflow(el){\r\n var node = el.parentElement;\r\n while (node && node !== document.body && node !== document.documentElement) {\r\n var cs = window.getComputedStyle(node);\r\n if (cs.overflowY === 'hidden' || cs.overflowY === 'clip' || cs.overflow === 'hidden' || cs.overflow === 'clip') {\r\n node.style.overflowY = 'visible';\r\n if (cs.overflow === 'hidden' || cs.overflow === 'clip') {\r\n node.style.overflow = 'visible';\r\n }\r\n }\r\n node = node.parentElement;\r\n }\r\n }\r\n\r\n var ncsSection = document.querySelector('.ncs-services');\r\n if (ncsSection) ncsFixAncestorOverflow(ncsSection);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-759123f e-con e-atomic-element e-flexbox-base e-a25134e \" data-id=\"759123f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"759123f\">\n \t\t<div class=\"elementor-element elementor-element-242dcd6 elementor-widget elementor-widget-html\" data-id=\"242dcd6\" 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-5137cd4 e-con e-atomic-element e-flexbox-base e-5137cd4-188c7f1 \" data-id=\"5137cd4\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"5137cd4\">\n \t\t<div class=\"elementor-element elementor-element-3a368f9a elementor-widget elementor-widget-html\" data-id=\"3a368f9a\" 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:ital,wght@0,300..900;1,300..900&family=Montserrat:wght@400;500;600;700;800&display=swap');\r\n\r\n.nuance-portfolio {\r\n --np-bg: #f8f6f0;\r\n --np-ink: #0a0a0c;\r\n --np-accent: #d59256;\r\n --np-muted: rgba(10,10,12,0.5);\r\n background: var(--np-bg);\r\n color: var(--np-ink);\r\n padding: 120px 0 140px;\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n}\r\n.nuance-portfolio *,\r\n.nuance-portfolio *::before,\r\n.nuance-portfolio *::after { box-sizing: inherit; }\r\n\r\n.np-container { width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 40px; }\r\n\r\n\/* ---------- Header ---------- *\/\r\n.np-header { text-align: center; margin-bottom: 64px; }\r\n.np-eyebrow {\r\n display: inline-block;\r\n font-family: 'Montserrat', sans-serif;\r\n font-weight: 800;\r\n font-size: 12px;\r\n letter-spacing: 0.28em;\r\n text-transform: uppercase;\r\n color: var(--np-accent);\r\n margin-bottom: 18px;\r\n}\r\n.np-heading {\r\n font-family: 'Fraunces', serif;\r\n font-weight: 480;\r\n font-style: normal;\r\n font-size: clamp(36px, 5.4vw, 68px);\r\n line-height: 1.05;\r\n letter-spacing: -0.01em;\r\n margin: 0 0 40px;\r\n color: var(--np-ink);\r\n}\r\n.np-heading em {\r\n font-style: italic;\r\n font-weight: 340;\r\n color: var(--np-accent);\r\n}\r\n\r\n.np-filters {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 22px;\r\n flex-wrap: wrap;\r\n justify-content: center;\r\n}\r\n.np-filter-btn {\r\n font-family: 'Montserrat', sans-serif;\r\n font-weight: 600;\r\n font-size: 13px;\r\n letter-spacing: 0.05em;\r\n text-transform: uppercase;\r\n background: none;\r\n border: none;\r\n cursor: pointer;\r\n padding: 8px 4px;\r\n color: var(--np-muted);\r\n position: relative;\r\n transition: color 0.35s ease;\r\n}\r\n.np-filter-btn::after {\r\n content: '';\r\n position: absolute;\r\n left: 0; right: 0; bottom: 0;\r\n height: 1px;\r\n background: var(--np-accent);\r\n transform: scaleX(0);\r\n transform-origin: center;\r\n transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);\r\n}\r\n.np-filter-btn:hover { color: var(--np-ink); }\r\n.np-filter-btn.active { color: var(--np-ink); }\r\n.np-filter-btn.active::after { transform: scaleX(1); }\r\n.np-filter-divider {\r\n width: 22px;\r\n height: 1px;\r\n background: rgba(10,10,12,0.18);\r\n display: inline-block;\r\n}\r\n@media (max-width: 640px) {\r\n .np-filter-divider { display: none; }\r\n .np-filters { gap: 14px 20px; }\r\n}\r\n\r\n\/* ---------- Carousel ---------- *\/\r\n.np-carousel {\r\n position: relative;\r\n width: 100%;\r\n padding: 60px 0 30px;\r\n perspective: 1600px;\r\n perspective-origin: 50% 50%;\r\n cursor: grab;\r\n user-select: none;\r\n -webkit-user-select: none;\r\n touch-action: pan-y;\r\n}\r\n.np-carousel.is-dragging { cursor: grabbing; }\r\n.np-carousel.is-dragging .np-card { transition: none !important; }\r\n\r\n.np-track {\r\n display: flex;\r\n align-items: center;\r\n gap: 28px;\r\n width: max-content;\r\n will-change: transform;\r\n transform-style: preserve-3d;\r\n}\r\n\r\n.np-card {\r\n position: relative;\r\n flex: 0 0 auto;\r\n width: 300px;\r\n aspect-ratio: 3 \/ 4;\r\n border-radius: 24px;\r\n overflow: hidden;\r\n background: #1a1a1a;\r\n transform-style: preserve-3d;\r\n will-change: transform, opacity;\r\n transition: opacity 0.15s linear;\r\n box-shadow: 0 30px 60px -20px rgba(10,10,12,0.35);\r\n}\r\n.np-card.is-hidden { display: none; }\r\n\r\n.np-card-img {\r\n position: absolute;\r\n inset: 0;\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n pointer-events: none;\r\n -webkit-user-drag: none;\r\n draggable: false;\r\n}\r\n\r\n.np-card-overlay {\r\n position: absolute;\r\n left: 0; right: 0; bottom: 0;\r\n height: 55%;\r\n background: linear-gradient(180deg, rgba(10,10,12,0) 0%, rgba(10,10,12,0.75) 70%, rgba(10,10,12,0.9) 100%);\r\n pointer-events: none;\r\n}\r\n\r\n.np-card-text {\r\n position: absolute;\r\n left: 24px;\r\n right: 24px;\r\n bottom: 22px;\r\n pointer-events: none;\r\n}\r\n.np-card-title {\r\n font-family: 'Fraunces', serif;\r\n font-weight: 560;\r\n font-size: 21px;\r\n color: #fff;\r\n margin: 0 0 4px;\r\n letter-spacing: -0.01em;\r\n}\r\n.np-card-cat {\r\n font-family: 'Montserrat', sans-serif;\r\n font-weight: 500;\r\n font-size: 12px;\r\n letter-spacing: 0.04em;\r\n color: rgba(255,255,255,0.68);\r\n margin: 0;\r\n}\r\n\r\n@media (max-width: 780px) {\r\n .np-card { width: 220px; }\r\n .np-track { gap: 18px; }\r\n .np-container { padding: 0 20px; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"nuance-portfolio\">\r\n <div class=\"np-container\">\r\n <div class=\"np-header\">\r\n <span class=\"np-eyebrow\">Kiemelt munk\u00e1k<\/span>\r\n <h2 class=\"np-heading\">N\u00e9h\u00e1ny m\u00e1rka, amit egy\u00fctt <em>Form\u00e1ltunk<\/em><\/h2>\r\n <div class=\"np-filters\" id=\"npFilters\" role=\"tablist\" aria-label=\"Filter portfolio by category\">\r\n <button class=\"np-filter-btn active\" data-filter=\"all\" role=\"tab\" aria-selected=\"true\">Minden<\/button>\r\n <span class=\"np-filter-divider\" aria-hidden=\"true\"><\/span>\r\n <button class=\"np-filter-btn\" data-filter=\"web\" role=\"tab\" aria-selected=\"false\">Web Design<\/button>\r\n <span class=\"np-filter-divider\" aria-hidden=\"true\"><\/span>\r\n <button class=\"np-filter-btn\" data-filter=\"branding\" role=\"tab\" aria-selected=\"false\">M\u00e1rka\u00e9p\u00edt\u00e9s<\/button>\r\n <span class=\"np-filter-divider\" aria-hidden=\"true\"><\/span>\r\n <button class=\"np-filter-btn\" data-filter=\"3d\" role=\"tab\" aria-selected=\"false\">rebrand<\/button>\r\n <span class=\"np-filter-divider\" aria-hidden=\"true\"><\/span>\r\n <button class=\"np-filter-btn\" data-filter=\"3d\" role=\"tab\" aria-selected=\"false\">NYOMTATOTT<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"np-carousel\" id=\"npCarousel\">\r\n <div class=\"np-track\" id=\"npTrack\"><\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function () {\r\n var root = document.currentScript.previousElementSibling;\r\n if (!root || !root.classList || !root.classList.contains('nuance-portfolio')) {\r\n root = document.querySelector('.nuance-portfolio');\r\n }\r\n var carousel = root.querySelector('#npCarousel');\r\n var track = root.querySelector('#npTrack');\r\n var filterBar = root.querySelector('#npFilters');\r\n\r\n var projects = [\r\n { title: 'Luminal Studio', cat: 'web', label: 'Web Design \/ 3D', seed: 'luminal-studio-11' },\r\n { title: 'Aura Identity', cat: 'branding', label: 'Branding & Identity', seed: 'aura-identity-22' },\r\n { title: 'Vortex Campaign', cat: '3d', label: 'Social Media \/ Motion', seed: 'vortex-campaign-33' },\r\n { title: 'Kinetix App', cat: 'web', label: 'UI\/UX & Web Design', seed: 'kinetix-app-44' },\r\n { title: 'Elysian Editorial', cat: 'branding', label: 'Brand Collateral', seed: 'elysian-editorial-55' },\r\n { title: 'Neura AI', cat: 'branding', label: 'Brand & Digital Ads', seed: 'neura-ai-66' }\r\n ];\r\n\r\n projects.forEach(function (p) {\r\n var card = document.createElement('div');\r\n card.className = 'np-card';\r\n card.dataset.cat = p.cat;\r\n card.innerHTML =\r\n '<img decoding=\"async\" class=\"np-card-img\" src=\"https:\/\/picsum.photos\/seed\/' + p.seed + '\/600\/800\" alt=\"' + p.title + '\" draggable=\"false\">' +\r\n '<div class=\"np-card-overlay\"><\/div>' +\r\n '<div class=\"np-card-text\">' +\r\n '<p class=\"np-card-title\">' + p.title + '<\/p>' +\r\n '<p class=\"np-card-cat\">' + p.label + '<\/p>' +\r\n '<\/div>';\r\n track.appendChild(card);\r\n });\r\n\r\n var cards = Array.prototype.slice.call(track.querySelectorAll('.np-card'));\r\n\r\n \/* ---------------- 3D arc rendering ---------------- *\/\r\n function renderArc() {\r\n var cRect = carousel.getBoundingClientRect();\r\n var centerX = cRect.left + cRect.width \/ 2;\r\n var half = cRect.width \/ 2 || 1;\r\n\r\n cards.forEach(function (card) {\r\n if (card.classList.contains('is-hidden')) return;\r\n var rect = card.getBoundingClientRect();\r\n var cardCenter = rect.left + rect.width \/ 2;\r\n var norm = (cardCenter - centerX) \/ half;\r\n var clamped = Math.max(-1.5, Math.min(1.5, norm));\r\n var absD = Math.min(Math.abs(clamped), 1);\r\n\r\n var scale = 1.08 - absD * 0.23;\r\n var rotateY = clamped * -26;\r\n var translateZ = -absD * 140;\r\n var opacity = 1 - absD * 0.3;\r\n\r\n card.style.transform =\r\n 'translateZ(' + translateZ.toFixed(1) + 'px) rotateY(' + rotateY.toFixed(2) + 'deg) scale(' + scale.toFixed(3) + ')';\r\n card.style.opacity = opacity.toFixed(3);\r\n card.style.zIndex = Math.round((1 - absD) * 100);\r\n });\r\n }\r\n\r\n \/* ---------------- Drag \/ momentum physics ---------------- *\/\r\n var posX = 0;\r\n var velocity = 0;\r\n var isDragging = false;\r\n var dragStartX = 0;\r\n var dragStartPos = 0;\r\n var lastMoveX = 0;\r\n var lastMoveT = 0;\r\n var rafId = null;\r\n var FRICTION = 0.945;\r\n var VELOCITY_STOP = 0.03;\r\n var EDGE_STIFFNESS = 0.35;\r\n\r\n function bounds() {\r\n var trackWidth = track.scrollWidth;\r\n var containerWidth = carousel.clientWidth;\r\n var maxTravel = Math.max(0, trackWidth - containerWidth);\r\n var edgePad = containerWidth \/ 2 - (cards[0] ? cards[0].offsetWidth \/ 2 : 0);\r\n return { min: -maxTravel - edgePad, max: edgePad };\r\n }\r\n\r\n function applyTransform() {\r\n track.style.transform = 'translateX(' + posX.toFixed(2) + 'px)';\r\n renderArc();\r\n }\r\n\r\n function clampWithRubberBand(value) {\r\n var b = bounds();\r\n if (value > b.max) return b.max + (value - b.max) * EDGE_STIFFNESS;\r\n if (value < b.min) return b.min + (value - b.min) * EDGE_STIFFNESS;\r\n return value;\r\n }\r\n\r\n function settleToBounds() {\r\n var b = bounds();\r\n if (posX > b.max) { posX += (b.max - posX) * 0.18; }\r\n else if (posX < b.min) { posX += (b.min - posX) * 0.18; }\r\n }\r\n\r\n function loop() {\r\n var b = bounds();\r\n var outOfBounds = posX > b.max || posX < b.min;\r\n\r\n if (!isDragging) {\r\n if (Math.abs(velocity) > VELOCITY_STOP) {\r\n posX += velocity;\r\n velocity *= FRICTION;\r\n } else {\r\n velocity = 0;\r\n }\r\n if (outOfBounds) {\r\n settleToBounds();\r\n velocity *= 0.7;\r\n }\r\n }\r\n\r\n applyTransform();\r\n\r\n if (isDragging || Math.abs(velocity) > VELOCITY_STOP || outOfBounds) {\r\n rafId = requestAnimationFrame(loop);\r\n } else {\r\n rafId = null;\r\n }\r\n }\r\n\r\n function startLoop() {\r\n if (!rafId) rafId = requestAnimationFrame(loop);\r\n }\r\n\r\n function getX(e) {\r\n return (e.touches && e.touches.length) ? e.touches[0].clientX : e.clientX;\r\n }\r\n\r\n function onPointerDown(e) {\r\n if (e.button !== undefined && e.button !== 0) return;\r\n isDragging = true;\r\n velocity = 0;\r\n carousel.classList.add('is-dragging');\r\n var x = getX(e);\r\n dragStartX = x;\r\n dragStartPos = posX;\r\n lastMoveX = x;\r\n lastMoveT = performance.now();\r\n startLoop();\r\n window.addEventListener('mousemove', onPointerMove);\r\n window.addEventListener('mouseup', onPointerUp);\r\n window.addEventListener('touchmove', onPointerMove, { passive: false });\r\n window.addEventListener('touchend', onPointerUp);\r\n }\r\n\r\n function onPointerMove(e) {\r\n if (!isDragging) return;\r\n if (e.cancelable) e.preventDefault();\r\n var x = getX(e);\r\n var delta = x - dragStartX;\r\n var target = dragStartPos + delta;\r\n posX = clampWithRubberBand(target);\r\n\r\n var now = performance.now();\r\n var dt = now - lastMoveT;\r\n if (dt > 0) {\r\n velocity = (x - lastMoveX) \/ dt * 16.7; \/* normalize to ~60fps px\/frame *\/\r\n }\r\n lastMoveX = x;\r\n lastMoveT = now;\r\n }\r\n\r\n function onPointerUp() {\r\n if (!isDragging) return;\r\n isDragging = false;\r\n carousel.classList.remove('is-dragging');\r\n startLoop();\r\n window.removeEventListener('mousemove', onPointerMove);\r\n window.removeEventListener('mouseup', onPointerUp);\r\n window.removeEventListener('touchmove', onPointerMove);\r\n window.removeEventListener('touchend', onPointerUp);\r\n }\r\n\r\n carousel.addEventListener('mousedown', onPointerDown);\r\n carousel.addEventListener('touchstart', onPointerDown, { passive: true });\r\n carousel.addEventListener('dragstart', function (e) { e.preventDefault(); });\r\n\r\n \/* ---------------- Filtering ---------------- *\/\r\n filterBar.addEventListener('click', function (e) {\r\n var btn = e.target.closest('.np-filter-btn');\r\n if (!btn) return;\r\n var filter = btn.dataset.filter;\r\n\r\n Array.prototype.forEach.call(filterBar.querySelectorAll('.np-filter-btn'), function (b) {\r\n var active = b === btn;\r\n b.classList.toggle('active', active);\r\n b.setAttribute('aria-selected', active ? 'true' : 'false');\r\n });\r\n\r\n cards.forEach(function (card) {\r\n var show = filter === 'all' || card.dataset.cat === filter;\r\n card.classList.toggle('is-hidden', !show);\r\n });\r\n\r\n \/* Recenter after filtering so remaining cards stay in bounds *\/\r\n posX = clampWithRubberBand(posX);\r\n velocity = 0;\r\n startLoop();\r\n });\r\n\r\n \/* ---------------- Init ---------------- *\/\r\n function centerCarousel() {\r\n var target = (carousel.clientWidth - track.scrollWidth) \/ 2;\r\n posX = clampWithRubberBand(target);\r\n applyTransform();\r\n }\r\n\r\n window.addEventListener('resize', function () {\r\n posX = clampWithRubberBand(posX);\r\n applyTransform();\r\n });\r\n\r\n if (document.fonts && document.fonts.ready) {\r\n document.fonts.ready.then(function () {\r\n requestAnimationFrame(centerCarousel);\r\n });\r\n }\r\n requestAnimationFrame(centerCarousel);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-7f8734fa e-con e-atomic-element e-flexbox-base e-7f8734fa-47d7152 \" data-id=\"7f8734fa\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"7f8734fa\">\n \t\t<div class=\"elementor-element elementor-element-567f1919 elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-html\" data-id=\"567f1919\" 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-77cc2a89 elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-widget elementor-widget-spacer\" data-id=\"77cc2a89\" 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-2c73c17b 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=\"2c73c17b\" 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-2c73c17b 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\/3627#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-4af27c99 e-con e-atomic-element e-flexbox-base e-4af27c99-a0856e6 \" data-id=\"4af27c99\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"4af27c99\">\n <div class=\"elementor-element elementor-element-2eb47182 e-con e-atomic-element e-flexbox-base e-2eb47182-7ebaa09 \" data-id=\"2eb47182\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"2eb47182\">\n \t\t<div class=\"elementor-element elementor-element-68b5bbbe elementor-hidden-mobile elementor-widget elementor-widget-spacer\" data-id=\"68b5bbbe\" 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-7ac0204b elementor-hidden-mobile elementor-widget elementor-widget-html\" data-id=\"7ac0204b\" 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-296c5366 e-con e-atomic-element e-flexbox-base e-296c5366-b0fa7e6 \" data-id=\"296c5366\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"296c5366\">\n \t\t<div class=\"elementor-element elementor-element-61dbb62e elementor-hidden-mobile elementor-widget elementor-widget-spacer\" data-id=\"61dbb62e\" 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-609f28f3 elementor-hidden-mobile mauve-contact-form-7-button-custom elementor-widget elementor-widget-mauve-contact-form-7\" data-id=\"609f28f3\" 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-609f28f3 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\/3627#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 A m\u00e1rka nemcsakarr\u00f3l sz\u00f3l, hogy n\u00e9z ki. Seg\u00edtek megtal\u00e1lni azt az ir\u00e1nyt, ami val\u00f3ban illik a v\u00e1llalkoz\u00e1sodhoz, majd ebb\u0151l olyan m\u00e1rk\u00e1t \u00e9p\u00edtek, ami karakteres, k\u00f6vetkezetes…<\/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-3627","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3627","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=3627"}],"version-history":[{"count":58,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3627\/revisions"}],"predecessor-version":[{"id":4186,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/pages\/3627\/revisions\/4186"}],"wp:attachment":[{"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/media?parent=3627"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/categories?post=3627"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nuancecreative.hu\/en\/wp-json\/wp\/v2\/tags?post=3627"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}