NEXUS \u2014 Digital Agency<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:wght@300;400;500&display=swap\" rel=\"stylesheet\">\n<style>\n*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n\n:root {\n --bg: #080a0f;\n --bg2: #0d1017;\n --card: #111520;\n --border: rgba(255,255,255,0.06);\n --text: #e8edf5;\n --muted: #5a6480;\n --accent: #c8ff00;\n --accent2: #0af;\n --red: #ff3d5a;\n --font-head: 'Syne', sans-serif;\n --font-body: 'DM Sans', sans-serif;\n}\n\nhtml { scroll-behavior: smooth; }\n\nbody {\n background: var(--bg);\n color: var(--text);\n font-family: var(--font-body);\n overflow-x: hidden;\n cursor: none;\n}\n\n\/* Custom cursor *\/\n.cursor {\n width: 12px; height: 12px;\n background: var(--accent);\n border-radius: 50%;\n position: fixed;\n pointer-events: none;\n z-index: 9999;\n transform: translate(-50%, -50%);\n transition: transform 0.1s, width 0.3s, height 0.3s, background 0.3s;\n mix-blend-mode: difference;\n}\n.cursor-ring {\n width: 36px; height: 36px;\n border: 1px solid rgba(200,255,0,0.4);\n border-radius: 50%;\n position: fixed;\n pointer-events: none;\n z-index: 9998;\n transform: translate(-50%, -50%);\n transition: all 0.15s ease;\n}\nbody:hover .cursor { opacity: 1; }\n\n\/* Noise overlay *\/\nbody::before {\n content: '';\n position: fixed; inset: 0;\n background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'\/%3E%3C\/svg%3E\");\n opacity: 0.025;\n pointer-events: none;\n z-index: 1000;\n}\n\n\/* NAV *\/\nnav {\n position: fixed; top: 0; left: 0; right: 0;\n z-index: 500;\n padding: 24px 60px;\n display: flex; align-items: center; justify-content: space-between;\n border-bottom: 1px solid transparent;\n transition: border-color 0.3s, background 0.3s, backdrop-filter 0.3s;\n}\nnav.scrolled {\n border-color: var(--border);\n background: rgba(8,10,15,0.85);\n backdrop-filter: blur(20px);\n padding: 16px 60px;\n}\n.logo {\n font-family: var(--font-head);\n font-weight: 800;\n font-size: 1.3rem;\n letter-spacing: 4px;\n color: var(--text);\n text-decoration: none;\n}\n.logo span { color: var(--accent); }\n.nav-links { display: flex; gap: 36px; list-style: none; }\n.nav-links a {\n color: var(--muted);\n text-decoration: none;\n font-size: 0.82rem;\n letter-spacing: 1.5px;\n text-transform: uppercase;\n font-weight: 500;\n transition: color 0.2s;\n}\n.nav-links a:hover { color: var(--text); }\n.nav-cta {\n background: var(--accent);\n color: #000;\n padding: 10px 24px;\n border-radius: 4px;\n font-size: 0.8rem;\n font-weight: 700;\n letter-spacing: 1px;\n text-transform: uppercase;\n text-decoration: none;\n transition: transform 0.2s, box-shadow 0.2s;\n}\n.nav-cta:hover {\n transform: translateY(-2px);\n box-shadow: 0 8px 24px rgba(200,255,0,0.3);\n}\n\n\/* HERO *\/\n.hero {\n min-height: 100vh;\n display: flex; flex-direction: column; justify-content: center;\n position: relative;\n padding: 140px 60px 80px;\n overflow: hidden;\n}\n\n\/* Grid bg *\/\n.hero-grid {\n position: absolute; inset: 0;\n background-image:\n linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),\n linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);\n background-size: 60px 60px;\n mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);\n}\n\n\/* Glow orbs *\/\n.orb {\n position: absolute;\n border-radius: 50%;\n filter: blur(120px);\n pointer-events: none;\n}\n.orb-1 {\n width: 500px; height: 500px;\n background: rgba(200,255,0,0.07);\n top: -100px; left: -100px;\n animation: orbFloat 8s ease-in-out infinite alternate;\n}\n.orb-2 {\n width: 400px; height: 400px;\n background: rgba(0,170,255,0.06);\n bottom: 0; right: -50px;\n animation: orbFloat 10s ease-in-out infinite alternate-reverse;\n}\n@keyframes orbFloat {\n from { transform: translate(0, 0); }\n to { transform: translate(40px, 30px); }\n}\n\n.hero-tag {\n display: inline-flex; align-items: center; gap: 10px;\n border: 1px solid rgba(200,255,0,0.25);\n padding: 7px 16px;\n border-radius: 50px;\n font-size: 0.72rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 600;\n width: fit-content;\n margin-bottom: 36px;\n opacity: 0;\n animation: fadeUp 0.8s ease forwards 0.2s;\n}\n.hero-tag::before {\n content: '';\n width: 6px; height: 6px;\n border-radius: 50%;\n background: var(--accent);\n animation: pulse 2s infinite;\n}\n@keyframes pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.4; transform: scale(0.7); }\n}\n\n.hero h1 {\n font-family: var(--font-head);\n font-size: clamp(3.5rem, 8vw, 7.5rem);\n font-weight: 800;\n line-height: 0.95;\n letter-spacing: -3px;\n max-width: 900px;\n margin-bottom: 32px;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.4s;\n}\n.hero h1 em {\n font-style: normal;\n color: var(--accent);\n display: inline-block;\n position: relative;\n}\n.hero h1 em::after {\n content: '';\n position: absolute;\n bottom: 8px; left: 0; right: 0;\n height: 3px;\n background: var(--accent);\n opacity: 0.3;\n}\n\n.hero-sub {\n font-size: 1.05rem;\n color: var(--muted);\n max-width: 480px;\n line-height: 1.8;\n margin-bottom: 52px;\n font-weight: 300;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.6s;\n}\n\n.hero-actions {\n display: flex; gap: 16px; align-items: center;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.8s;\n}\n.btn-primary {\n background: var(--accent);\n color: #000;\n padding: 16px 36px;\n border-radius: 4px;\n font-size: 0.85rem;\n font-weight: 700;\n letter-spacing: 1px;\n text-transform: uppercase;\n text-decoration: none;\n transition: transform 0.2s, box-shadow 0.2s;\n display: inline-flex; align-items: center; gap: 10px;\n}\n.btn-primary:hover {\n transform: translateY(-3px);\n box-shadow: 0 12px 32px rgba(200,255,0,0.35);\n}\n.btn-secondary {\n color: var(--muted);\n font-size: 0.85rem;\n letter-spacing: 1px;\n text-decoration: none;\n display: inline-flex; align-items: center; gap: 8px;\n transition: color 0.2s;\n padding: 16px 20px;\n}\n.btn-secondary:hover { color: var(--text); }\n.btn-arrow { transition: transform 0.2s; }\n.btn-secondary:hover .btn-arrow { transform: translateX(4px); }\n\n\/* Scroll line *\/\n.hero-scroll {\n position: absolute;\n bottom: 40px; left: 60px;\n display: flex; align-items: center; gap: 14px;\n font-size: 0.72rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--muted);\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 1.2s;\n}\n.scroll-line {\n width: 40px; height: 1px;\n background: var(--muted);\n position: relative; overflow: hidden;\n}\n.scroll-line::after {\n content: '';\n position: absolute; inset: 0;\n background: var(--accent);\n transform: translateX(-100%);\n animation: scrollSlide 2s ease-in-out infinite;\n}\n@keyframes scrollSlide {\n 0% { transform: translateX(-100%); }\n 50% { transform: translateX(0); }\n 100% { transform: translateX(100%); }\n}\n\n\/* Hero stats *\/\n.hero-stats {\n position: absolute;\n bottom: 40px; right: 60px;\n display: flex; gap: 40px;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 1s;\n}\n.stat { text-align: right; }\n.stat-num {\n font-family: var(--font-head);\n font-size: 2rem;\n font-weight: 800;\n color: var(--text);\n line-height: 1;\n}\n.stat-num span { color: var(--accent); }\n.stat-label {\n font-size: 0.7rem;\n color: var(--muted);\n letter-spacing: 1px;\n text-transform: uppercase;\n margin-top: 4px;\n}\n\n\/* MARQUEE *\/\n.marquee-section {\n border-top: 1px solid var(--border);\n border-bottom: 1px solid var(--border);\n padding: 18px 0;\n overflow: hidden;\n position: relative;\n}\n.marquee-track {\n display: flex; gap: 60px;\n white-space: nowrap;\n animation: marquee 20s linear infinite;\n width: max-content;\n}\n.marquee-item {\n font-family: var(--font-head);\n font-size: 0.75rem;\n font-weight: 700;\n letter-spacing: 3px;\n text-transform: uppercase;\n color: var(--muted);\n display: flex; align-items: center; gap: 20px;\n}\n.marquee-dot {\n width: 4px; height: 4px;\n border-radius: 50%;\n background: var(--accent);\n}\n@keyframes marquee {\n from { transform: translateX(0); }\n to { transform: translateX(-50%); }\n}\n\n\/* SECTION COMMON *\/\nsection { padding: 120px 60px; position: relative; }\n.section-label {\n font-size: 0.7rem;\n letter-spacing: 3px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 700;\n margin-bottom: 20px;\n display: flex; align-items: center; gap: 12px;\n}\n.section-label::before {\n content: '';\n width: 24px; height: 1px;\n background: var(--accent);\n}\n.section-title {\n font-family: var(--font-head);\n font-size: clamp(2rem, 5vw, 3.8rem);\n font-weight: 800;\n line-height: 1.05;\n letter-spacing: -1.5px;\n max-width: 700px;\n margin-bottom: 20px;\n}\n.section-title em { font-style: normal; color: var(--accent); }\n.section-sub {\n font-size: 1rem;\n color: var(--muted);\n max-width: 480px;\n line-height: 1.9;\n font-weight: 300;\n margin-bottom: 64px;\n}\n\n\/* SERVICES *\/\n.services-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 1px;\n background: var(--border);\n border: 1px solid var(--border);\n border-radius: 16px;\n overflow: hidden;\n}\n.service-card {\n background: var(--card);\n padding: 44px 36px;\n position: relative;\n overflow: hidden;\n transition: background 0.3s;\n cursor: default;\n}\n.service-card::before {\n content: '';\n position: absolute;\n top: 0; left: 0;\n width: 100%; height: 2px;\n background: linear-gradient(to right, var(--accent), transparent);\n transform: scaleX(0);\n transform-origin: left;\n transition: transform 0.4s ease;\n}\n.service-card:hover { background: #151b2a; }\n.service-card:hover::before { transform: scaleX(1); }\n\n.service-num {\n font-family: var(--font-head);\n font-size: 0.65rem;\n letter-spacing: 2px;\n color: var(--muted);\n margin-bottom: 28px;\n font-weight: 700;\n}\n.service-icon {\n font-size: 2rem;\n margin-bottom: 20px;\n display: block;\n filter: grayscale(0.3);\n}\n.service-name {\n font-family: var(--font-head);\n font-size: 1.2rem;\n font-weight: 700;\n margin-bottom: 14px;\n letter-spacing: -0.5px;\n}\n.service-desc {\n font-size: 0.85rem;\n color: var(--muted);\n line-height: 1.9;\n}\n.service-link {\n display: inline-flex; align-items: center; gap: 6px;\n margin-top: 24px;\n font-size: 0.75rem;\n letter-spacing: 1px;\n text-transform: uppercase;\n font-weight: 700;\n color: var(--accent);\n text-decoration: none;\n opacity: 0;\n transform: translateY(5px);\n transition: opacity 0.3s, transform 0.3s;\n}\n.service-card:hover .service-link { opacity: 1; transform: translateY(0); }\n\n\/* WORK *\/\n.work-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 24px;\n}\n.work-card {\n border-radius: 12px;\n overflow: hidden;\n border: 1px solid var(--border);\n background: var(--card);\n position: relative;\n cursor: pointer;\n aspect-ratio: 16\/10;\n display: flex; align-items: flex-end;\n}\n.work-card-bg {\n position: absolute; inset: 0;\n display: flex; align-items: center; justify-content: center;\n font-size: 6rem;\n transition: transform 0.5s ease;\n}\n.work-card:hover .work-card-bg { transform: scale(1.08); }\n.work-overlay {\n position: absolute; inset: 0;\n background: linear-gradient(to top, rgba(8,10,15,0.95) 0%, transparent 60%);\n transition: opacity 0.3s;\n}\n.work-info {\n position: relative; z-index: 1;\n padding: 28px;\n}\n.work-tag {\n font-size: 0.65rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 700;\n margin-bottom: 8px;\n display: block;\n}\n.work-title {\n font-family: var(--font-head);\n font-size: 1.2rem;\n font-weight: 700;\n letter-spacing: -0.3px;\n}\n.work-arrow {\n position: absolute; top: 24px; right: 24px;\n width: 40px; height: 40px;\n border: 1px solid rgba(255,255,255,0.1);\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n font-size: 1rem;\n opacity: 0;\n transform: rotate(-45deg) scale(0.8);\n transition: opacity 0.3s, transform 0.3s, background 0.3s, border-color 0.3s;\n z-index: 1;\n}\n.work-card:hover .work-arrow {\n opacity: 1;\n transform: rotate(0) scale(1);\n background: var(--accent);\n border-color: var(--accent);\n color: #000;\n}\n\n\/* PROCESS *\/\n.process-list { max-width: 800px; }\n.process-item {\n display: flex; gap: 40px; align-items: flex-start;\n padding: 36px 0;\n border-bottom: 1px solid var(--border);\n position: relative;\n transition: padding-left 0.3s;\n}\n.process-item:hover { padding-left: 16px; }\n.process-item:last-child { border-bottom: none; }\n.process-num {\n font-family: var(--font-head);\n font-size: 3.5rem;\n font-weight: 800;\n color: rgba(255,255,255,0.05);\n line-height: 1;\n flex-shrink: 0;\n width: 80px;\n transition: color 0.3s;\n}\n.process-item:hover .process-num { color: rgba(200,255,0,0.12); }\n.process-content { flex: 1; padding-top: 6px; }\n.process-name {\n font-family: var(--font-head);\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 10px;\n letter-spacing: -0.3px;\n}\n.process-desc {\n font-size: 0.88rem;\n color: var(--muted);\n line-height: 1.9;\n}\n\n\/* TESTIMONIALS *\/\n.testi-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }\n.testi-card {\n background: var(--card);\n border: 1px solid var(--border);\n border-radius: 14px;\n padding: 36px;\n transition: border-color 0.3s, transform 0.3s;\n}\n.testi-card:hover { border-color: rgba(200,255,0,0.2); transform: translateY(-4px); }\n.testi-stars { color: var(--accent); font-size: 0.8rem; letter-spacing: 2px; margin-bottom: 20px; }\n.testi-text {\n font-size: 0.95rem;\n color: var(--text);\n line-height: 1.9;\n margin-bottom: 28px;\n font-weight: 300;\n}\n.testi-author { display: flex; align-items: center; gap: 14px; }\n.testi-avatar {\n width: 40px; height: 40px;\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n font-size: 1.1rem;\n background: rgba(255,255,255,0.06);\n border: 1px solid var(--border);\n}\n.testi-name {\n font-family: var(--font-head);\n font-size: 0.9rem;\n font-weight: 700;\n}\n.testi-role { font-size: 0.75rem; color: var(--muted); margin-top: 2px; }\n\n\/* CTA *\/\n.cta-section {\n text-align: center;\n background: var(--bg2);\n border-top: 1px solid var(--border);\n border-bottom: 1px solid var(--border);\n}\n.cta-section .section-label { justify-content: center; }\n.cta-section .section-label::before { display: none; }\n.cta-section .section-title { margin: 0 auto 20px; text-align: center; }\n.cta-section .section-sub { margin: 0 auto 52px; text-align: center; }\n.cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }\n.btn-outline {\n border: 1px solid var(--border);\n color: var(--muted);\n padding: 16px 32px;\n border-radius: 4px;\n font-size: 0.85rem;\n font-weight: 600;\n letter-spacing: 1px;\n text-decoration: none;\n transition: border-color 0.2s, color 0.2s;\n}\n.btn-outline:hover { border-color: rgba(255,255,255,0.2); color: var(--text); }\n\n\/* FOOTER *\/\nfooter {\n padding: 60px;\n display: flex; justify-content: space-between; align-items: center;\n border-top: 1px solid var(--border);\n flex-wrap: wrap; gap: 20px;\n}\n.footer-logo {\n font-family: var(--font-head);\n font-size: 1.1rem;\n font-weight: 800;\n letter-spacing: 4px;\n color: var(--text);\n}\n.footer-logo span { color: var(--accent); }\n.footer-links { display: flex; gap: 28px; flex-wrap: wrap; }\n.footer-links a {\n font-size: 0.78rem;\n letter-spacing: 1px;\n text-transform: uppercase;\n color: var(--muted);\n text-decoration: none;\n transition: color 0.2s;\n}\n.footer-links a:hover { color: var(--text); }\n.footer-copy {\n font-size: 0.75rem;\n color: var(--muted);\n}\n\n\/* Animations *\/\n@keyframes fadeUp {\n from { opacity: 0; transform: translateY(24px); }\n to { opacity: 1; transform: translateY(0); }\n}\n.reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: opacity 0.7s ease, transform 0.7s ease;\n}\n.reveal.visible { opacity: 1; transform: translateY(0); }\n\n\/* RESPONSIVE *\/\n@media (max-width: 900px) {\n nav { padding: 20px 24px; }\n nav.scrolled { padding: 14px 24px; }\n .nav-links { display: none; }\n .hero { padding: 120px 24px 80px; }\n section { padding: 80px 24px; }\n footer { padding: 40px 24px; }\n .hero-stats { display: none; }\n .hero-scroll { left: 24px; }\n .services-grid { grid-template-columns: 1fr; }\n .work-grid { grid-template-columns: 1fr; }\n .testi-grid { grid-template-columns: 1fr; }\n .hero h1 { letter-spacing: -1.5px; }\n}\n<\/style>\n<\/head>\n<body>\n\n<div class=\"cursor\" id=\"cursor\"><\/div>\n<div class=\"cursor-ring\" id=\"cursorRing\"><\/div>\n\n\n<nav id=\"navbar\">\n <a href=\"#\" class=\"logo\">NEX<span>.<\/span>US<\/a>\n <ul class=\"nav-links\">\n <li><a href=\"#services\">Services<\/a><\/li>\n <li><a href=\"#work\">Work<\/a><\/li>\n <li><a href=\"#process\">Process<\/a><\/li>\n <li><a href=\"#testimonials\">Clients<\/a><\/li>\n <\/ul>\n <a href=\"#contact\" class=\"nav-cta\">Get Started \u2192<\/a>\n<\/nav>\n\n\n<section class=\"hero\">\n <div class=\"hero-grid\"><\/div>\n <div class=\"orb orb-1\"><\/div>\n <div class=\"orb orb-2\"><\/div>\n\n <div class=\"hero-tag\">Available for new projects \u00b7 2025<\/div>\n <h1>We Build <em>Digital<\/em><br>Experiences<br>That Convert<\/h1>\n <p class=\"hero-sub\">A full-service digital agency crafting brands, websites, and campaigns that don’t just look great \u2014 they drive real business results.<\/p>\n <div class=\"hero-actions\">\n <a href=\"#work\" class=\"btn-primary\">View Our Work <span>\u2192<\/span><\/a>\n <a href=\"#contact\" class=\"btn-secondary\">Start a Project <span class=\"btn-arrow\">\u2192<\/span><\/a>\n <\/div>\n\n <div class=\"hero-scroll\">\n <div class=\"scroll-line\"><\/div>\n Scroll\n <\/div>\n\n <div class=\"hero-stats\">\n <div class=\"stat\">\n <div class=\"stat-num\">150<span>+<\/span><\/div>\n <div class=\"stat-label\">Projects Done<\/div>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-num\">98<span>%<\/span><\/div>\n <div class=\"stat-label\">Client Satisfaction<\/div>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-num\">8<span>yr<\/span><\/div>\n <div class=\"stat-label\">Experience<\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<div class=\"marquee-section\">\n <div class=\"marquee-track\" id=\"marquee\">\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Brand Strategy<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> UI\/UX Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Web Development<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Digital Marketing<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Motion Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> E-Commerce<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> SEO & Growth<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Brand Strategy<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> UI\/UX Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Web Development<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Digital Marketing<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Motion Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> E-Commerce<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> SEO & Growth<\/div>\n <\/div>\n<\/div>\n\n\n<section id=\"services\">\n <div class=\"section-label reveal\">What We Do<\/div>\n <h2 class=\"section-title reveal\">Services That <em>Scale<\/em> Your Business<\/h2>\n <p class=\"section-sub reveal\">From concept to execution, we cover every digital touchpoint your brand needs to dominate online.<\/p>\n <div class=\"services-grid reveal\">\n <div class=\"service-card\">\n <div class=\"service-num\">01<\/div>\n <span class=\"service-icon\">\ud83c\udfa8<\/span>\n <div class=\"service-name\">Brand Design<\/div>\n <div class=\"service-desc\">Logo systems, visual identity, brand guidelines, and complete design language that makes you unforgettable.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192 <\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">02<\/div>\n <span class=\"service-icon\">\ud83d\udcbb<\/span>\n <div class=\"service-name\">Web Development<\/div>\n <div class=\"service-desc\">Blazing-fast, pixel-perfect websites and web apps built with modern tech that convert visitors into customers.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">03<\/div>\n <span class=\"service-icon\">\ud83d\udcc8<\/span>\n <div class=\"service-name\">Growth Marketing<\/div>\n <div class=\"service-desc\">SEO, paid media, content strategy, and analytics \u2014 data-driven campaigns that deliver measurable ROI.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">04<\/div>\n <span class=\"service-icon\">\ud83d\udcf1<\/span>\n <div class=\"service-name\">UI\/UX Design<\/div>\n <div class=\"service-desc\">User research, wireframes, prototypes, and polished interfaces that make complex things feel effortless.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">05<\/div>\n <span class=\"service-icon\">\ud83c\udfac<\/span>\n <div class=\"service-name\">Motion & Video<\/div>\n <div class=\"service-desc\">Brand films, explainer animations, social reels, and motion design that stop the scroll and drive engagement.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">06<\/div>\n <span class=\"service-icon\">\ud83d\uded2<\/span>\n <div class=\"service-name\">E-Commerce<\/div>\n <div class=\"service-desc\">Shopify, WooCommerce, and custom stores optimized for conversion, retention, and seamless checkout.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"work\" style=\"background: var(--bg2);\">\n <div class=\"section-label reveal\">Portfolio<\/div>\n <h2 class=\"section-title reveal\">Selected <em>Work<\/em><\/h2>\n <p class=\"section-sub reveal\">A glimpse of the brands we’ve built and campaigns we’ve launched that made a real impact.<\/p>\n <div class=\"work-grid\">\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #0d1a2a, #1a2744);\">\ud83d\ude80<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">SaaS \u00b7 Branding<\/span>\n <div class=\"work-title\">LaunchFlow \u2014 Startup Identity<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #1a0d20, #2d1640);\">\ud83d\udc57<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Fashion \u00b7 E-Commerce<\/span>\n <div class=\"work-title\">Velour \u2014 Luxury Store<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #0d1a14, #0d2818);\">\ud83c\udf3f<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Health \u00b7 Web App<\/span>\n <div class=\"work-title\">Menta \u2014 Wellness Platform<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #1a1200, #2d2000);\">\u26a1<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Energy \u00b7 Campaign<\/span>\n <div class=\"work-title\">Voltex \u2014 Brand Relaunch<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"process\">\n <div class=\"section-label reveal\">How We Work<\/div>\n <h2 class=\"section-title reveal\">Our <em>Process<\/em><\/h2>\n <p class=\"section-sub reveal\">Simple, transparent, and built to deliver. Here’s how we take your idea from brief to launch.<\/p>\n <div class=\"process-list\">\n <div class=\"process-item reveal\">\n <div class=\"process-num\">01<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Discovery & Strategy<\/div>\n <div class=\"process-desc\">We dive deep into your business, audience, and goals. Competitive analysis, user research, and a clear strategic roadmap \u2014 before a single pixel is drawn.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">02<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Design & Prototype<\/div>\n <div class=\"process-desc\">Moodboards, wireframes, and high-fidelity mockups. You see exactly what you’re getting before we build \u2014 unlimited revisions until it’s perfect.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">03<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Build & Test<\/div>\n <div class=\"process-desc\">Clean code, rigorous QA, cross-device testing. We build for performance, accessibility, and scale \u2014 no shortcuts, ever.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">04<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Launch & Grow<\/div>\n <div class=\"process-desc\">Smooth deployment, analytics setup, and a handoff that actually makes sense. Plus ongoing support to keep your digital presence growing.<\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"testimonials\" style=\"background: var(--bg2);\">\n <div class=\"section-label reveal\">Client Love<\/div>\n <h2 class=\"section-title reveal\">What Our <em>Clients<\/em> Say<\/h2>\n <p class=\"section-sub reveal\">Don’t take our word for it \u2014 here’s what the people we’ve worked with have to say.<\/p>\n <div class=\"testi-grid\">\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“NEXUS completely transformed our online presence. Our conversion rate doubled within 3 months of the new site going live. Worth every penny and more.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Sarah Chen<\/div>\n <div class=\"testi-role\">CEO, LaunchFlow<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“The team’s attention to detail is insane. They didn’t just build us a website \u2014 they built us a brand that our customers actually connect with on an emotional level.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Marcus Webb<\/div>\n <div class=\"testi-role\">Founder, Velour<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“Fast, professional, and genuinely creative. NEXUS delivered our e-commerce store ahead of schedule and it performed beyond our wildest expectations at launch.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Priya Sharma<\/div>\n <div class=\"testi-role\">Head of Digital, Menta<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“Three years and counting. NEXUS is the only agency we’ve ever worked with that feels like a true partner rather than a vendor. Strategic, honest, and talented.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">James Okafor<\/div>\n <div class=\"testi-role\">CMO, Voltex Energy<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"contact\" class=\"cta-section\">\n <div class=\"section-label reveal\">Let’s Talk<\/div>\n <h2 class=\"section-title reveal\">Ready to Build<br>Something <em>Great?<\/em><\/h2>\n <p class=\"section-sub reveal\">We’re selective about who we work with \u2014 because we commit fully to every project. If you’re serious about results, let’s talk.<\/p>\n <div class=\"cta-actions reveal\">\n <a href=\"mailto:hello@nexus.agency\" class=\"btn-primary\">Start a Project \u2192<\/a>\n <a href=\"#work\" class=\"btn-outline\">See More Work<\/a>\n <\/div>\n<\/section>\n\n\n<footer>\n <div class=\"footer-logo\">NEX<span>.<\/span>US<\/div>\n <div class=\"footer-links\">\n <a href=\"#\">Services<\/a>\n <a href=\"#\">Work<\/a>\n <a href=\"#\">About<\/a>\n <a href=\"#\">Careers<\/a>\n <a href=\"#\">Contact<\/a>\n <\/div>\n <div class=\"footer-copy\">\u00a9 2025 NEXUS Agency. All rights reserved.<\/div>\n<\/footer>\n\n<script>\n \/\/ Custom cursor\n const cursor = document.getElementById('cursor');\n const ring = document.getElementById('cursorRing');\n let mx = 0, my = 0, rx = 0, ry = 0;\n\n document.addEventListener('mousemove', e => {\n mx = e.clientX; my = e.clientY;\n cursor.style.left = mx + 'px';\n cursor.style.top = my + 'px';\n });\n\n function animRing() {\n rx += (mx - rx) * 0.12;\n ry += (my - ry) * 0.12;\n ring.style.left = rx + 'px';\n ring.style.top = ry + 'px';\n requestAnimationFrame(animRing);\n }\n animRing();\n\n document.querySelectorAll('a, button').forEach(el => {\n el.addEventListener('mouseenter', () => {\n cursor.style.width = '20px';\n cursor.style.height = '20px';\n ring.style.width = '56px';\n ring.style.height = '56px';\n });\n el.addEventListener('mouseleave', () => {\n cursor.style.width = '12px';\n cursor.style.height = '12px';\n ring.style.width = '36px';\n ring.style.height = '36px';\n });\n });\n\n \/\/ Sticky nav\n const navbar = document.getElementById('navbar');\n window.addEventListener('scroll', () => {\n navbar.classList.toggle('scrolled', window.scrollY > 60);\n });\n\n \/\/ Scroll reveal\n const reveals = document.querySelectorAll('.reveal');\n const observer = new IntersectionObserver((entries) => {\n entries.forEach((entry, i) => {\n if (entry.isIntersecting) {\n setTimeout(() => entry.target.classList.add('visible'), i * 80);\n observer.unobserve(entry.target);\n }\n });\n }, { threshold: 0.1 });\n reveals.forEach(el => observer.observe(el));\n<\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>NEXUS \u2014 Digital Agency NEX.US Services Work Process Clients Get Started \u2192 Available for new projects \u00b7 2025 We Build DigitalExperiencesThat Convert A full-service digital agency crafting brands, websites, and campaigns that don’t just look great \u2014 they drive real business results. View Our Work \u2192 Start a Project \u2192 Scroll 150+ Projects Done 98% […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[35,36],"class_list":["post-775","post","type-post","status-publish","format-standard","hentry","category-blog","tag-dailyprompt","tag-dailyprompt-1884"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=775"}],"version-history":[{"count":1,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775\/revisions"}],"predecessor-version":[{"id":776,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775\/revisions\/776"}],"wp:attachment":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=775"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=775"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=775"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":775,"date":"2026-03-21T04:28:07","date_gmt":"2026-03-21T04:28:07","guid":{"rendered":"https:\/\/askqustion.in\/?p=775"},"modified":"2026-03-21T04:28:09","modified_gmt":"2026-03-21T04:28:09","slug":"how-to-ai-work","status":"publish","type":"post","link":"https:\/\/askqustion.in\/?p=775","title":{"rendered":"How to ai work"},"content":{"rendered":"\n\n\n\n\n\nNEXUS \u2014 Digital Agency<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:wght@300;400;500&display=swap\" rel=\"stylesheet\">\n<style>\n*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n\n:root {\n --bg: #080a0f;\n --bg2: #0d1017;\n --card: #111520;\n --border: rgba(255,255,255,0.06);\n --text: #e8edf5;\n --muted: #5a6480;\n --accent: #c8ff00;\n --accent2: #0af;\n --red: #ff3d5a;\n --font-head: 'Syne', sans-serif;\n --font-body: 'DM Sans', sans-serif;\n}\n\nhtml { scroll-behavior: smooth; }\n\nbody {\n background: var(--bg);\n color: var(--text);\n font-family: var(--font-body);\n overflow-x: hidden;\n cursor: none;\n}\n\n\/* Custom cursor *\/\n.cursor {\n width: 12px; height: 12px;\n background: var(--accent);\n border-radius: 50%;\n position: fixed;\n pointer-events: none;\n z-index: 9999;\n transform: translate(-50%, -50%);\n transition: transform 0.1s, width 0.3s, height 0.3s, background 0.3s;\n mix-blend-mode: difference;\n}\n.cursor-ring {\n width: 36px; height: 36px;\n border: 1px solid rgba(200,255,0,0.4);\n border-radius: 50%;\n position: fixed;\n pointer-events: none;\n z-index: 9998;\n transform: translate(-50%, -50%);\n transition: all 0.15s ease;\n}\nbody:hover .cursor { opacity: 1; }\n\n\/* Noise overlay *\/\nbody::before {\n content: '';\n position: fixed; inset: 0;\n background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'\/%3E%3C\/svg%3E\");\n opacity: 0.025;\n pointer-events: none;\n z-index: 1000;\n}\n\n\/* NAV *\/\nnav {\n position: fixed; top: 0; left: 0; right: 0;\n z-index: 500;\n padding: 24px 60px;\n display: flex; align-items: center; justify-content: space-between;\n border-bottom: 1px solid transparent;\n transition: border-color 0.3s, background 0.3s, backdrop-filter 0.3s;\n}\nnav.scrolled {\n border-color: var(--border);\n background: rgba(8,10,15,0.85);\n backdrop-filter: blur(20px);\n padding: 16px 60px;\n}\n.logo {\n font-family: var(--font-head);\n font-weight: 800;\n font-size: 1.3rem;\n letter-spacing: 4px;\n color: var(--text);\n text-decoration: none;\n}\n.logo span { color: var(--accent); }\n.nav-links { display: flex; gap: 36px; list-style: none; }\n.nav-links a {\n color: var(--muted);\n text-decoration: none;\n font-size: 0.82rem;\n letter-spacing: 1.5px;\n text-transform: uppercase;\n font-weight: 500;\n transition: color 0.2s;\n}\n.nav-links a:hover { color: var(--text); }\n.nav-cta {\n background: var(--accent);\n color: #000;\n padding: 10px 24px;\n border-radius: 4px;\n font-size: 0.8rem;\n font-weight: 700;\n letter-spacing: 1px;\n text-transform: uppercase;\n text-decoration: none;\n transition: transform 0.2s, box-shadow 0.2s;\n}\n.nav-cta:hover {\n transform: translateY(-2px);\n box-shadow: 0 8px 24px rgba(200,255,0,0.3);\n}\n\n\/* HERO *\/\n.hero {\n min-height: 100vh;\n display: flex; flex-direction: column; justify-content: center;\n position: relative;\n padding: 140px 60px 80px;\n overflow: hidden;\n}\n\n\/* Grid bg *\/\n.hero-grid {\n position: absolute; inset: 0;\n background-image:\n linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),\n linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);\n background-size: 60px 60px;\n mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);\n}\n\n\/* Glow orbs *\/\n.orb {\n position: absolute;\n border-radius: 50%;\n filter: blur(120px);\n pointer-events: none;\n}\n.orb-1 {\n width: 500px; height: 500px;\n background: rgba(200,255,0,0.07);\n top: -100px; left: -100px;\n animation: orbFloat 8s ease-in-out infinite alternate;\n}\n.orb-2 {\n width: 400px; height: 400px;\n background: rgba(0,170,255,0.06);\n bottom: 0; right: -50px;\n animation: orbFloat 10s ease-in-out infinite alternate-reverse;\n}\n@keyframes orbFloat {\n from { transform: translate(0, 0); }\n to { transform: translate(40px, 30px); }\n}\n\n.hero-tag {\n display: inline-flex; align-items: center; gap: 10px;\n border: 1px solid rgba(200,255,0,0.25);\n padding: 7px 16px;\n border-radius: 50px;\n font-size: 0.72rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 600;\n width: fit-content;\n margin-bottom: 36px;\n opacity: 0;\n animation: fadeUp 0.8s ease forwards 0.2s;\n}\n.hero-tag::before {\n content: '';\n width: 6px; height: 6px;\n border-radius: 50%;\n background: var(--accent);\n animation: pulse 2s infinite;\n}\n@keyframes pulse {\n 0%, 100% { opacity: 1; transform: scale(1); }\n 50% { opacity: 0.4; transform: scale(0.7); }\n}\n\n.hero h1 {\n font-family: var(--font-head);\n font-size: clamp(3.5rem, 8vw, 7.5rem);\n font-weight: 800;\n line-height: 0.95;\n letter-spacing: -3px;\n max-width: 900px;\n margin-bottom: 32px;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.4s;\n}\n.hero h1 em {\n font-style: normal;\n color: var(--accent);\n display: inline-block;\n position: relative;\n}\n.hero h1 em::after {\n content: '';\n position: absolute;\n bottom: 8px; left: 0; right: 0;\n height: 3px;\n background: var(--accent);\n opacity: 0.3;\n}\n\n.hero-sub {\n font-size: 1.05rem;\n color: var(--muted);\n max-width: 480px;\n line-height: 1.8;\n margin-bottom: 52px;\n font-weight: 300;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.6s;\n}\n\n.hero-actions {\n display: flex; gap: 16px; align-items: center;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 0.8s;\n}\n.btn-primary {\n background: var(--accent);\n color: #000;\n padding: 16px 36px;\n border-radius: 4px;\n font-size: 0.85rem;\n font-weight: 700;\n letter-spacing: 1px;\n text-transform: uppercase;\n text-decoration: none;\n transition: transform 0.2s, box-shadow 0.2s;\n display: inline-flex; align-items: center; gap: 10px;\n}\n.btn-primary:hover {\n transform: translateY(-3px);\n box-shadow: 0 12px 32px rgba(200,255,0,0.35);\n}\n.btn-secondary {\n color: var(--muted);\n font-size: 0.85rem;\n letter-spacing: 1px;\n text-decoration: none;\n display: inline-flex; align-items: center; gap: 8px;\n transition: color 0.2s;\n padding: 16px 20px;\n}\n.btn-secondary:hover { color: var(--text); }\n.btn-arrow { transition: transform 0.2s; }\n.btn-secondary:hover .btn-arrow { transform: translateX(4px); }\n\n\/* Scroll line *\/\n.hero-scroll {\n position: absolute;\n bottom: 40px; left: 60px;\n display: flex; align-items: center; gap: 14px;\n font-size: 0.72rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--muted);\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 1.2s;\n}\n.scroll-line {\n width: 40px; height: 1px;\n background: var(--muted);\n position: relative; overflow: hidden;\n}\n.scroll-line::after {\n content: '';\n position: absolute; inset: 0;\n background: var(--accent);\n transform: translateX(-100%);\n animation: scrollSlide 2s ease-in-out infinite;\n}\n@keyframes scrollSlide {\n 0% { transform: translateX(-100%); }\n 50% { transform: translateX(0); }\n 100% { transform: translateX(100%); }\n}\n\n\/* Hero stats *\/\n.hero-stats {\n position: absolute;\n bottom: 40px; right: 60px;\n display: flex; gap: 40px;\n opacity: 0;\n animation: fadeUp 0.9s ease forwards 1s;\n}\n.stat { text-align: right; }\n.stat-num {\n font-family: var(--font-head);\n font-size: 2rem;\n font-weight: 800;\n color: var(--text);\n line-height: 1;\n}\n.stat-num span { color: var(--accent); }\n.stat-label {\n font-size: 0.7rem;\n color: var(--muted);\n letter-spacing: 1px;\n text-transform: uppercase;\n margin-top: 4px;\n}\n\n\/* MARQUEE *\/\n.marquee-section {\n border-top: 1px solid var(--border);\n border-bottom: 1px solid var(--border);\n padding: 18px 0;\n overflow: hidden;\n position: relative;\n}\n.marquee-track {\n display: flex; gap: 60px;\n white-space: nowrap;\n animation: marquee 20s linear infinite;\n width: max-content;\n}\n.marquee-item {\n font-family: var(--font-head);\n font-size: 0.75rem;\n font-weight: 700;\n letter-spacing: 3px;\n text-transform: uppercase;\n color: var(--muted);\n display: flex; align-items: center; gap: 20px;\n}\n.marquee-dot {\n width: 4px; height: 4px;\n border-radius: 50%;\n background: var(--accent);\n}\n@keyframes marquee {\n from { transform: translateX(0); }\n to { transform: translateX(-50%); }\n}\n\n\/* SECTION COMMON *\/\nsection { padding: 120px 60px; position: relative; }\n.section-label {\n font-size: 0.7rem;\n letter-spacing: 3px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 700;\n margin-bottom: 20px;\n display: flex; align-items: center; gap: 12px;\n}\n.section-label::before {\n content: '';\n width: 24px; height: 1px;\n background: var(--accent);\n}\n.section-title {\n font-family: var(--font-head);\n font-size: clamp(2rem, 5vw, 3.8rem);\n font-weight: 800;\n line-height: 1.05;\n letter-spacing: -1.5px;\n max-width: 700px;\n margin-bottom: 20px;\n}\n.section-title em { font-style: normal; color: var(--accent); }\n.section-sub {\n font-size: 1rem;\n color: var(--muted);\n max-width: 480px;\n line-height: 1.9;\n font-weight: 300;\n margin-bottom: 64px;\n}\n\n\/* SERVICES *\/\n.services-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 1px;\n background: var(--border);\n border: 1px solid var(--border);\n border-radius: 16px;\n overflow: hidden;\n}\n.service-card {\n background: var(--card);\n padding: 44px 36px;\n position: relative;\n overflow: hidden;\n transition: background 0.3s;\n cursor: default;\n}\n.service-card::before {\n content: '';\n position: absolute;\n top: 0; left: 0;\n width: 100%; height: 2px;\n background: linear-gradient(to right, var(--accent), transparent);\n transform: scaleX(0);\n transform-origin: left;\n transition: transform 0.4s ease;\n}\n.service-card:hover { background: #151b2a; }\n.service-card:hover::before { transform: scaleX(1); }\n\n.service-num {\n font-family: var(--font-head);\n font-size: 0.65rem;\n letter-spacing: 2px;\n color: var(--muted);\n margin-bottom: 28px;\n font-weight: 700;\n}\n.service-icon {\n font-size: 2rem;\n margin-bottom: 20px;\n display: block;\n filter: grayscale(0.3);\n}\n.service-name {\n font-family: var(--font-head);\n font-size: 1.2rem;\n font-weight: 700;\n margin-bottom: 14px;\n letter-spacing: -0.5px;\n}\n.service-desc {\n font-size: 0.85rem;\n color: var(--muted);\n line-height: 1.9;\n}\n.service-link {\n display: inline-flex; align-items: center; gap: 6px;\n margin-top: 24px;\n font-size: 0.75rem;\n letter-spacing: 1px;\n text-transform: uppercase;\n font-weight: 700;\n color: var(--accent);\n text-decoration: none;\n opacity: 0;\n transform: translateY(5px);\n transition: opacity 0.3s, transform 0.3s;\n}\n.service-card:hover .service-link { opacity: 1; transform: translateY(0); }\n\n\/* WORK *\/\n.work-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 24px;\n}\n.work-card {\n border-radius: 12px;\n overflow: hidden;\n border: 1px solid var(--border);\n background: var(--card);\n position: relative;\n cursor: pointer;\n aspect-ratio: 16\/10;\n display: flex; align-items: flex-end;\n}\n.work-card-bg {\n position: absolute; inset: 0;\n display: flex; align-items: center; justify-content: center;\n font-size: 6rem;\n transition: transform 0.5s ease;\n}\n.work-card:hover .work-card-bg { transform: scale(1.08); }\n.work-overlay {\n position: absolute; inset: 0;\n background: linear-gradient(to top, rgba(8,10,15,0.95) 0%, transparent 60%);\n transition: opacity 0.3s;\n}\n.work-info {\n position: relative; z-index: 1;\n padding: 28px;\n}\n.work-tag {\n font-size: 0.65rem;\n letter-spacing: 2px;\n text-transform: uppercase;\n color: var(--accent);\n font-weight: 700;\n margin-bottom: 8px;\n display: block;\n}\n.work-title {\n font-family: var(--font-head);\n font-size: 1.2rem;\n font-weight: 700;\n letter-spacing: -0.3px;\n}\n.work-arrow {\n position: absolute; top: 24px; right: 24px;\n width: 40px; height: 40px;\n border: 1px solid rgba(255,255,255,0.1);\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n font-size: 1rem;\n opacity: 0;\n transform: rotate(-45deg) scale(0.8);\n transition: opacity 0.3s, transform 0.3s, background 0.3s, border-color 0.3s;\n z-index: 1;\n}\n.work-card:hover .work-arrow {\n opacity: 1;\n transform: rotate(0) scale(1);\n background: var(--accent);\n border-color: var(--accent);\n color: #000;\n}\n\n\/* PROCESS *\/\n.process-list { max-width: 800px; }\n.process-item {\n display: flex; gap: 40px; align-items: flex-start;\n padding: 36px 0;\n border-bottom: 1px solid var(--border);\n position: relative;\n transition: padding-left 0.3s;\n}\n.process-item:hover { padding-left: 16px; }\n.process-item:last-child { border-bottom: none; }\n.process-num {\n font-family: var(--font-head);\n font-size: 3.5rem;\n font-weight: 800;\n color: rgba(255,255,255,0.05);\n line-height: 1;\n flex-shrink: 0;\n width: 80px;\n transition: color 0.3s;\n}\n.process-item:hover .process-num { color: rgba(200,255,0,0.12); }\n.process-content { flex: 1; padding-top: 6px; }\n.process-name {\n font-family: var(--font-head);\n font-size: 1.3rem;\n font-weight: 700;\n margin-bottom: 10px;\n letter-spacing: -0.3px;\n}\n.process-desc {\n font-size: 0.88rem;\n color: var(--muted);\n line-height: 1.9;\n}\n\n\/* TESTIMONIALS *\/\n.testi-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }\n.testi-card {\n background: var(--card);\n border: 1px solid var(--border);\n border-radius: 14px;\n padding: 36px;\n transition: border-color 0.3s, transform 0.3s;\n}\n.testi-card:hover { border-color: rgba(200,255,0,0.2); transform: translateY(-4px); }\n.testi-stars { color: var(--accent); font-size: 0.8rem; letter-spacing: 2px; margin-bottom: 20px; }\n.testi-text {\n font-size: 0.95rem;\n color: var(--text);\n line-height: 1.9;\n margin-bottom: 28px;\n font-weight: 300;\n}\n.testi-author { display: flex; align-items: center; gap: 14px; }\n.testi-avatar {\n width: 40px; height: 40px;\n border-radius: 50%;\n display: flex; align-items: center; justify-content: center;\n font-size: 1.1rem;\n background: rgba(255,255,255,0.06);\n border: 1px solid var(--border);\n}\n.testi-name {\n font-family: var(--font-head);\n font-size: 0.9rem;\n font-weight: 700;\n}\n.testi-role { font-size: 0.75rem; color: var(--muted); margin-top: 2px; }\n\n\/* CTA *\/\n.cta-section {\n text-align: center;\n background: var(--bg2);\n border-top: 1px solid var(--border);\n border-bottom: 1px solid var(--border);\n}\n.cta-section .section-label { justify-content: center; }\n.cta-section .section-label::before { display: none; }\n.cta-section .section-title { margin: 0 auto 20px; text-align: center; }\n.cta-section .section-sub { margin: 0 auto 52px; text-align: center; }\n.cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }\n.btn-outline {\n border: 1px solid var(--border);\n color: var(--muted);\n padding: 16px 32px;\n border-radius: 4px;\n font-size: 0.85rem;\n font-weight: 600;\n letter-spacing: 1px;\n text-decoration: none;\n transition: border-color 0.2s, color 0.2s;\n}\n.btn-outline:hover { border-color: rgba(255,255,255,0.2); color: var(--text); }\n\n\/* FOOTER *\/\nfooter {\n padding: 60px;\n display: flex; justify-content: space-between; align-items: center;\n border-top: 1px solid var(--border);\n flex-wrap: wrap; gap: 20px;\n}\n.footer-logo {\n font-family: var(--font-head);\n font-size: 1.1rem;\n font-weight: 800;\n letter-spacing: 4px;\n color: var(--text);\n}\n.footer-logo span { color: var(--accent); }\n.footer-links { display: flex; gap: 28px; flex-wrap: wrap; }\n.footer-links a {\n font-size: 0.78rem;\n letter-spacing: 1px;\n text-transform: uppercase;\n color: var(--muted);\n text-decoration: none;\n transition: color 0.2s;\n}\n.footer-links a:hover { color: var(--text); }\n.footer-copy {\n font-size: 0.75rem;\n color: var(--muted);\n}\n\n\/* Animations *\/\n@keyframes fadeUp {\n from { opacity: 0; transform: translateY(24px); }\n to { opacity: 1; transform: translateY(0); }\n}\n.reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: opacity 0.7s ease, transform 0.7s ease;\n}\n.reveal.visible { opacity: 1; transform: translateY(0); }\n\n\/* RESPONSIVE *\/\n@media (max-width: 900px) {\n nav { padding: 20px 24px; }\n nav.scrolled { padding: 14px 24px; }\n .nav-links { display: none; }\n .hero { padding: 120px 24px 80px; }\n section { padding: 80px 24px; }\n footer { padding: 40px 24px; }\n .hero-stats { display: none; }\n .hero-scroll { left: 24px; }\n .services-grid { grid-template-columns: 1fr; }\n .work-grid { grid-template-columns: 1fr; }\n .testi-grid { grid-template-columns: 1fr; }\n .hero h1 { letter-spacing: -1.5px; }\n}\n<\/style>\n<\/head>\n<body>\n\n<div class=\"cursor\" id=\"cursor\"><\/div>\n<div class=\"cursor-ring\" id=\"cursorRing\"><\/div>\n\n\n<nav id=\"navbar\">\n <a href=\"#\" class=\"logo\">NEX<span>.<\/span>US<\/a>\n <ul class=\"nav-links\">\n <li><a href=\"#services\">Services<\/a><\/li>\n <li><a href=\"#work\">Work<\/a><\/li>\n <li><a href=\"#process\">Process<\/a><\/li>\n <li><a href=\"#testimonials\">Clients<\/a><\/li>\n <\/ul>\n <a href=\"#contact\" class=\"nav-cta\">Get Started \u2192<\/a>\n<\/nav>\n\n\n<section class=\"hero\">\n <div class=\"hero-grid\"><\/div>\n <div class=\"orb orb-1\"><\/div>\n <div class=\"orb orb-2\"><\/div>\n\n <div class=\"hero-tag\">Available for new projects \u00b7 2025<\/div>\n <h1>We Build <em>Digital<\/em><br>Experiences<br>That Convert<\/h1>\n <p class=\"hero-sub\">A full-service digital agency crafting brands, websites, and campaigns that don’t just look great \u2014 they drive real business results.<\/p>\n <div class=\"hero-actions\">\n <a href=\"#work\" class=\"btn-primary\">View Our Work <span>\u2192<\/span><\/a>\n <a href=\"#contact\" class=\"btn-secondary\">Start a Project <span class=\"btn-arrow\">\u2192<\/span><\/a>\n <\/div>\n\n <div class=\"hero-scroll\">\n <div class=\"scroll-line\"><\/div>\n Scroll\n <\/div>\n\n <div class=\"hero-stats\">\n <div class=\"stat\">\n <div class=\"stat-num\">150<span>+<\/span><\/div>\n <div class=\"stat-label\">Projects Done<\/div>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-num\">98<span>%<\/span><\/div>\n <div class=\"stat-label\">Client Satisfaction<\/div>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-num\">8<span>yr<\/span><\/div>\n <div class=\"stat-label\">Experience<\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<div class=\"marquee-section\">\n <div class=\"marquee-track\" id=\"marquee\">\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Brand Strategy<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> UI\/UX Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Web Development<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Digital Marketing<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Motion Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> E-Commerce<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> SEO & Growth<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Brand Strategy<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> UI\/UX Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Web Development<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Digital Marketing<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> Motion Design<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> E-Commerce<\/div>\n <div class=\"marquee-item\"><span class=\"marquee-dot\"><\/span> SEO & Growth<\/div>\n <\/div>\n<\/div>\n\n\n<section id=\"services\">\n <div class=\"section-label reveal\">What We Do<\/div>\n <h2 class=\"section-title reveal\">Services That <em>Scale<\/em> Your Business<\/h2>\n <p class=\"section-sub reveal\">From concept to execution, we cover every digital touchpoint your brand needs to dominate online.<\/p>\n <div class=\"services-grid reveal\">\n <div class=\"service-card\">\n <div class=\"service-num\">01<\/div>\n <span class=\"service-icon\">\ud83c\udfa8<\/span>\n <div class=\"service-name\">Brand Design<\/div>\n <div class=\"service-desc\">Logo systems, visual identity, brand guidelines, and complete design language that makes you unforgettable.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192 <\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">02<\/div>\n <span class=\"service-icon\">\ud83d\udcbb<\/span>\n <div class=\"service-name\">Web Development<\/div>\n <div class=\"service-desc\">Blazing-fast, pixel-perfect websites and web apps built with modern tech that convert visitors into customers.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">03<\/div>\n <span class=\"service-icon\">\ud83d\udcc8<\/span>\n <div class=\"service-name\">Growth Marketing<\/div>\n <div class=\"service-desc\">SEO, paid media, content strategy, and analytics \u2014 data-driven campaigns that deliver measurable ROI.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">04<\/div>\n <span class=\"service-icon\">\ud83d\udcf1<\/span>\n <div class=\"service-name\">UI\/UX Design<\/div>\n <div class=\"service-desc\">User research, wireframes, prototypes, and polished interfaces that make complex things feel effortless.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">05<\/div>\n <span class=\"service-icon\">\ud83c\udfac<\/span>\n <div class=\"service-name\">Motion & Video<\/div>\n <div class=\"service-desc\">Brand films, explainer animations, social reels, and motion design that stop the scroll and drive engagement.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <div class=\"service-card\">\n <div class=\"service-num\">06<\/div>\n <span class=\"service-icon\">\ud83d\uded2<\/span>\n <div class=\"service-name\">E-Commerce<\/div>\n <div class=\"service-desc\">Shopify, WooCommerce, and custom stores optimized for conversion, retention, and seamless checkout.<\/div>\n <a href=\"#\" class=\"service-link\">Explore \u2192<\/a>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"work\" style=\"background: var(--bg2);\">\n <div class=\"section-label reveal\">Portfolio<\/div>\n <h2 class=\"section-title reveal\">Selected <em>Work<\/em><\/h2>\n <p class=\"section-sub reveal\">A glimpse of the brands we’ve built and campaigns we’ve launched that made a real impact.<\/p>\n <div class=\"work-grid\">\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #0d1a2a, #1a2744);\">\ud83d\ude80<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">SaaS \u00b7 Branding<\/span>\n <div class=\"work-title\">LaunchFlow \u2014 Startup Identity<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #1a0d20, #2d1640);\">\ud83d\udc57<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Fashion \u00b7 E-Commerce<\/span>\n <div class=\"work-title\">Velour \u2014 Luxury Store<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #0d1a14, #0d2818);\">\ud83c\udf3f<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Health \u00b7 Web App<\/span>\n <div class=\"work-title\">Menta \u2014 Wellness Platform<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <div class=\"work-card reveal\">\n <div class=\"work-card-bg\" style=\"background: linear-gradient(135deg, #1a1200, #2d2000);\">\u26a1<\/div>\n <div class=\"work-overlay\"><\/div>\n <div class=\"work-info\">\n <span class=\"work-tag\">Energy \u00b7 Campaign<\/span>\n <div class=\"work-title\">Voltex \u2014 Brand Relaunch<\/div>\n <\/div>\n <div class=\"work-arrow\">\u2197<\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"process\">\n <div class=\"section-label reveal\">How We Work<\/div>\n <h2 class=\"section-title reveal\">Our <em>Process<\/em><\/h2>\n <p class=\"section-sub reveal\">Simple, transparent, and built to deliver. Here’s how we take your idea from brief to launch.<\/p>\n <div class=\"process-list\">\n <div class=\"process-item reveal\">\n <div class=\"process-num\">01<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Discovery & Strategy<\/div>\n <div class=\"process-desc\">We dive deep into your business, audience, and goals. Competitive analysis, user research, and a clear strategic roadmap \u2014 before a single pixel is drawn.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">02<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Design & Prototype<\/div>\n <div class=\"process-desc\">Moodboards, wireframes, and high-fidelity mockups. You see exactly what you’re getting before we build \u2014 unlimited revisions until it’s perfect.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">03<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Build & Test<\/div>\n <div class=\"process-desc\">Clean code, rigorous QA, cross-device testing. We build for performance, accessibility, and scale \u2014 no shortcuts, ever.<\/div>\n <\/div>\n <\/div>\n <div class=\"process-item reveal\">\n <div class=\"process-num\">04<\/div>\n <div class=\"process-content\">\n <div class=\"process-name\">Launch & Grow<\/div>\n <div class=\"process-desc\">Smooth deployment, analytics setup, and a handoff that actually makes sense. Plus ongoing support to keep your digital presence growing.<\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"testimonials\" style=\"background: var(--bg2);\">\n <div class=\"section-label reveal\">Client Love<\/div>\n <h2 class=\"section-title reveal\">What Our <em>Clients<\/em> Say<\/h2>\n <p class=\"section-sub reveal\">Don’t take our word for it \u2014 here’s what the people we’ve worked with have to say.<\/p>\n <div class=\"testi-grid\">\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“NEXUS completely transformed our online presence. Our conversion rate doubled within 3 months of the new site going live. Worth every penny and more.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Sarah Chen<\/div>\n <div class=\"testi-role\">CEO, LaunchFlow<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“The team’s attention to detail is insane. They didn’t just build us a website \u2014 they built us a brand that our customers actually connect with on an emotional level.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Marcus Webb<\/div>\n <div class=\"testi-role\">Founder, Velour<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“Fast, professional, and genuinely creative. NEXUS delivered our e-commerce store ahead of schedule and it performed beyond our wildest expectations at launch.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">Priya Sharma<\/div>\n <div class=\"testi-role\">Head of Digital, Menta<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"testi-card reveal\">\n <div class=\"testi-stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n <p class=\"testi-text\">“Three years and counting. NEXUS is the only agency we’ve ever worked with that feels like a true partner rather than a vendor. Strategic, honest, and talented.”<\/p>\n <div class=\"testi-author\">\n <div class=\"testi-avatar\">\ud83d\udc64<\/div>\n <div>\n <div class=\"testi-name\">James Okafor<\/div>\n <div class=\"testi-role\">CMO, Voltex Energy<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"contact\" class=\"cta-section\">\n <div class=\"section-label reveal\">Let’s Talk<\/div>\n <h2 class=\"section-title reveal\">Ready to Build<br>Something <em>Great?<\/em><\/h2>\n <p class=\"section-sub reveal\">We’re selective about who we work with \u2014 because we commit fully to every project. If you’re serious about results, let’s talk.<\/p>\n <div class=\"cta-actions reveal\">\n <a href=\"mailto:hello@nexus.agency\" class=\"btn-primary\">Start a Project \u2192<\/a>\n <a href=\"#work\" class=\"btn-outline\">See More Work<\/a>\n <\/div>\n<\/section>\n\n\n<footer>\n <div class=\"footer-logo\">NEX<span>.<\/span>US<\/div>\n <div class=\"footer-links\">\n <a href=\"#\">Services<\/a>\n <a href=\"#\">Work<\/a>\n <a href=\"#\">About<\/a>\n <a href=\"#\">Careers<\/a>\n <a href=\"#\">Contact<\/a>\n <\/div>\n <div class=\"footer-copy\">\u00a9 2025 NEXUS Agency. All rights reserved.<\/div>\n<\/footer>\n\n<script>\n \/\/ Custom cursor\n const cursor = document.getElementById('cursor');\n const ring = document.getElementById('cursorRing');\n let mx = 0, my = 0, rx = 0, ry = 0;\n\n document.addEventListener('mousemove', e => {\n mx = e.clientX; my = e.clientY;\n cursor.style.left = mx + 'px';\n cursor.style.top = my + 'px';\n });\n\n function animRing() {\n rx += (mx - rx) * 0.12;\n ry += (my - ry) * 0.12;\n ring.style.left = rx + 'px';\n ring.style.top = ry + 'px';\n requestAnimationFrame(animRing);\n }\n animRing();\n\n document.querySelectorAll('a, button').forEach(el => {\n el.addEventListener('mouseenter', () => {\n cursor.style.width = '20px';\n cursor.style.height = '20px';\n ring.style.width = '56px';\n ring.style.height = '56px';\n });\n el.addEventListener('mouseleave', () => {\n cursor.style.width = '12px';\n cursor.style.height = '12px';\n ring.style.width = '36px';\n ring.style.height = '36px';\n });\n });\n\n \/\/ Sticky nav\n const navbar = document.getElementById('navbar');\n window.addEventListener('scroll', () => {\n navbar.classList.toggle('scrolled', window.scrollY > 60);\n });\n\n \/\/ Scroll reveal\n const reveals = document.querySelectorAll('.reveal');\n const observer = new IntersectionObserver((entries) => {\n entries.forEach((entry, i) => {\n if (entry.isIntersecting) {\n setTimeout(() => entry.target.classList.add('visible'), i * 80);\n observer.unobserve(entry.target);\n }\n });\n }, { threshold: 0.1 });\n reveals.forEach(el => observer.observe(el));\n<\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>NEXUS \u2014 Digital Agency NEX.US Services Work Process Clients Get Started \u2192 Available for new projects \u00b7 2025 We Build DigitalExperiencesThat Convert A full-service digital agency crafting brands, websites, and campaigns that don’t just look great \u2014 they drive real business results. View Our Work \u2192 Start a Project \u2192 Scroll 150+ Projects Done 98% […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[35,36],"class_list":["post-775","post","type-post","status-publish","format-standard","hentry","category-blog","tag-dailyprompt","tag-dailyprompt-1884"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=775"}],"version-history":[{"count":1,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775\/revisions"}],"predecessor-version":[{"id":776,"href":"https:\/\/askqustion.in\/index.php?rest_route=\/wp\/v2\/posts\/775\/revisions\/776"}],"wp:attachment":[{"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=775"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=775"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/askqustion.in\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=775"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}