{"id":2793,"date":"2026-08-19T10:06:07","date_gmt":"2026-08-19T10:06:07","guid":{"rendered":"https:\/\/nuevell.com\/pk\/?page_id=2793"},"modified":"2026-08-22T09:20:53","modified_gmt":"2026-08-22T09:20:53","slug":"websites-for-architects","status":"publish","type":"page","link":"https:\/\/nuevell.com\/pk\/websites-for-architects\/","title":{"rendered":"Websites for Architects"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2793\" class=\"elementor elementor-2793\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4b5c64a e-con-full e-flex e-con e-parent\" data-id=\"4b5c64a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a86b1d5 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"a86b1d5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Nuevell Pakistan's Leading Web Design Agency for Ambitious Brands<\/title>\r\n \r\n    <style>\r\n     \r\n        html {\r\n            scroll-behavior: smooth;\r\n            box-sizing: border;\r\n            max-width: 100%;\r\n        }\r\n\r\n        body {\r\n            font-family: 'Inter', sans-serif;\r\n            background: var(--off-white);\r\n            color: var(--black);\r\n            -webkit-font-smoothing: antialiased;\r\n            overflow-x: hidden;\r\n            max-width: 100%;\r\n        }\r\n\r\n        h1,\r\n        h2,\r\n        h3,\r\n        h4 {\r\n            font-family: 'Sora', sans-serif !important;\r\n            font-weight: 600;\r\n            letter-spacing: -0.02em;\r\n            line-height: 1.05;\r\n        }\r\n\r\n        i.fa-solid,\r\n        i.fa-regular,\r\n        i.fa-brands {\r\n            line-height: 1;\r\n        }\r\n\r\n        \/* enforce heading colors per section so nothing inherits the wrong tone *\/\r\n        .why h2,\r\n        .why h3,\r\n        .process h2,\r\n        .process h3,\r\n        .faq h2,\r\n        .faq h3,\r\n        .final-cta h2 {\r\n            color: var(--black) !important;\r\n        }\r\n\r\n        .packages h2,\r\n        .packages h3,\r\n        .testimonials h2,\r\n        .testimonials h3 {\r\n            color: var(--white) !important;\r\n        }\r\n\r\n        .feature-card h3 {\r\n            color: var(--black) !important;\r\n        }\r\n\r\n        .price-card h3 {\r\n            color: var(--white) !important;\r\n        }\r\n\r\n        .process-body h3 {\r\n            color: var(--black) !important;\r\n        }\r\n\r\n        .mono {\r\n            font-family: 'JetBrains Mono', monospace;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.12em;\r\n            font-size: 10px;\r\n        }\r\n\r\n        a {\r\n            text-decoration: none;\r\n            color: default;\r\n        }\r\n\r\n        a:hover {\r\n            color: default !important;\r\n        }\r\n\r\n        ul {\r\n            list-style: none;\r\n            padding: 0px !important;\r\n            margin: 0x !important;\r\n        }\r\n\r\n        img {\r\n            max-width: 100%;\r\n            display: block;\r\n        }\r\n\r\n        .wrap {\r\n            max-width: 1180px;\r\n            margin: 0 auto;\r\n            padding: 0 24px;\r\n        }\r\n\r\n        section {\r\n            position: relative;\r\n        }\r\n\r\n        \/* reveal on scroll *\/\r\n        .reveal {\r\n            opacity: 0;\r\n            transform: translateY(28px);\r\n            transition: opacity .8s var(--ease), transform .8s var(--ease);\r\n        }\r\n\r\n        .reveal.in {\r\n            opacity: 1;\r\n            transform: translateY(0);\r\n        }\r\n\r\n        @media (prefers-reduced-motion: reduce) {\r\n            .reveal {\r\n                opacity: 1;\r\n                transform: none;\r\n                transition: none;\r\n            }\r\n\r\n            * {\r\n                animation: none !important;\r\n            }\r\n        }\r\n\r\n        \/* ===== BUTTONS ===== *\/\r\n        .btn {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: 8px;\r\n            padding: 16px 28px;\r\n            border-radius: 100px;\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 600;\r\n            font-size: 15px;\r\n            cursor: pointer;\r\n            border: none;\r\n            transition: transform .35s var(--ease), background .3s, box-shadow .3s;\r\n            white-space: nowrap;\r\n        }\r\n\r\n        .btn-primary {\r\n            background: var(--lime);\r\n            color: var(--black) !important;\r\n        }\r\n\r\n        .btn-primary:hover {\r\n            transform: translateY(-3px);\r\n            box-shadow: 0 12px 30px rgba(200, 255, 61, 0.35);\r\n        }\r\n\r\n        .btn-dark {\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n        .btn-dark:hover {\r\n            transform: translateY(-3px);\r\n            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);\r\n        }\r\n\r\n        .btn-outline {\r\n            background: transparent;\r\n            color: var(--white);\r\n            border: 1.5px solid rgba(255, 255, 255, 0.3);\r\n        }\r\n\r\n        .btn-outline:hover {\r\n            border-color: var(--lime);\r\n            color: var(--lime);\r\n            transform: translateY(-3px);\r\n        }\r\n\r\n        .btn-outline-dark {\r\n            background: transparent;\r\n            color: var(--black);\r\n            border: 1.5px solid rgba(0, 0, 0, 0.2);\r\n        }\r\n\r\n        .btn-outline-dark:hover {\r\n            border-color: var(--black);\r\n            transform: translateY(-3px);\r\n        }\r\n\r\n        .btn-sm {\r\n            padding: 12px 18px;\r\n            font-size: 13px;\r\n        }\r\n\r\n        .btn svg,\r\n        .btn i {\r\n            width: 16px;\r\n            font-size: 14px;\r\n            transition: transform .3s var(--ease);\r\n        }\r\n\r\n        .btn:hover svg,\r\n        .btn:hover i {\r\n            transform: translate(3px, -3px);\r\n        }\r\n\r\n  \r\n\r\n        \/* ===== HERO ===== *\/\r\n        .hero {\r\n            background: var(--black);\r\n            color: var(--white);\r\n            padding: 150px 0 90px;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .hero::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -200px;\r\n            right: -150px;\r\n            width: 600px;\r\n            height: 600px;\r\n            background: radial-gradient(circle, rgba(200, 255, 61, 0.16) 0%, rgba(200, 255, 61, 0) 70%);\r\n            pointer-events: none;\r\n        }\r\n\r\n        .hero-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr;\r\n            gap: 56px;\r\n            align-items: center;\r\n        }\r\n\r\n        .eyebrow {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: 8px;\r\n            background: rgba(255, 255, 255, 0.06);\r\n            border: 1px solid var(--line);\r\n            padding: 8px 16px;\r\n            border-radius: 100px;\r\n            color: var(--lime);\r\n            margin-bottom: 24px;\r\n        }\r\n\r\n        .eyebrow span.pulse {\r\n            width: 7px;\r\n            height: 7px;\r\n            border-radius: 50%;\r\n            background: var(--lime);\r\n            animation: pulse 1.8s infinite;\r\n        }\r\n\r\n        @keyframes pulse {\r\n            0% {\r\n                box-shadow: 0 0 0 0 rgba(200, 255, 61, .6);\r\n            }\r\n\r\n            70% {\r\n                box-shadow: 0 0 0 8px rgba(200, 255, 61, 0);\r\n            }\r\n\r\n            100% {\r\n                box-shadow: 0 0 0 0 rgba(200, 255, 61, 0);\r\n            }\r\n        }\r\n\r\n        .hero h1 {\r\n            font-size: clamp(34px, 7vw, 49px);\r\n            margin-bottom: 22px;\r\n        }\r\n\r\n        .hero h1 .hl {\r\n            color: var(--lime);\r\n        }\r\n\r\n        .hero p.lead {\r\n            color: var(--gray-300);\r\n            font-size: 17px;\r\n            line-height: 1.7;\r\n            max-width: 560px;\r\n            margin-bottom: 34px;\r\n        }\r\n\r\n        .hero-ctas {\r\n            display: flex;\r\n            flex-wrap: wrap;\r\n            gap: 14px;\r\n            margin-bottom: 44px;\r\n        }\r\n\r\n        .hero-tags {\r\n\r\n\r\n            display: grid;\r\n            grid-template-columns: repeat(3, 1fr);\r\n            gap: 5px 7px;\r\n\r\n        }\r\n\r\n        .hero-tags .tag {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 8px;\r\n            font-size: 13.5px;\r\n            color: var(--gray-300);\r\n        }\r\n\r\n        .hero-tags .tag i {\r\n            font-size: 14px;\r\n            color: var(--lime);\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        \/* Mobile *\/\r\n        @media (max-width: 768px) {\r\n            .hero-tags {\r\n                grid-template-columns: repeat(2, 1fr);\r\n                gap: 10px;\r\n            }\r\n\r\n            .hero-tags .tag {\r\n                padding: 5px 8px;\r\n                font-size: 13px;\r\n            }\r\n        }\r\n\r\n        \/* Laptop mockup *\/\r\n        .laptop {\r\n            position: relative;\r\n            perspective: 1400px;\r\n        }\r\n\r\n        .laptop-body {\r\n            background: linear-gradient(180deg, #232323, #151515);\r\n            border-radius: 18px 18px 6px 6px;\r\n            padding: 14px 14px 0;\r\n            box-shadow: 0 40px 80px rgba(0, 0, 0, 0.55);\r\n            transform: rotateX(4deg);\r\n        }\r\n\r\n        .laptop-screen {\r\n            background: var(--off-white);\r\n            border-radius: 8px;\r\n            overflow: hidden;\r\n            aspect-ratio: 16\/10.5;\r\n            position: relative;\r\n        }\r\n\r\n        .browser-bar {\r\n            background: #eceae3;\r\n            padding: 9px 12px;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 6px;\r\n        }\r\n\r\n        .browser-bar .dot {\r\n            width: 8px;\r\n            height: 8px;\r\n            border-radius: 50%;\r\n        }\r\n\r\n        .browser-bar .dot:nth-child(1) {\r\n            background: #ff5f57;\r\n        }\r\n\r\n        .browser-bar .dot:nth-child(2) {\r\n            background: #febc2e;\r\n        }\r\n\r\n        .browser-bar .dot:nth-child(3) {\r\n            background: #28c840;\r\n        }\r\n\r\n        .browser-url {\r\n            margin-left: 10px;\r\n            background: #fff;\r\n            border-radius: 6px;\r\n            padding: 4px 12px;\r\n            font-size: 10px;\r\n            color: #999;\r\n            font-family: 'JetBrains Mono', monospace;\r\n            flex: 1;\r\n        }\r\n\r\n        .mock-page {\r\n            padding: 16px;\r\n        }\r\n\r\n        .mock-nav {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            margin-bottom: 16px;\r\n        }\r\n\r\n        .mock-logo {\r\n            width: 64px;\r\n            height: 8px;\r\n            background: var(--black);\r\n            border-radius: 4px;\r\n        }\r\n\r\n        .mock-navlinks {\r\n            display: flex;\r\n            gap: 8px;\r\n        }\r\n\r\n        .mock-navlinks div {\r\n            width: 24px;\r\n            height: 6px;\r\n            background: #d8d6cd;\r\n            border-radius: 3px;\r\n        }\r\n\r\n        .mock-hero-txt {\r\n            width: 70%;\r\n            height: 14px;\r\n            background: var(--black);\r\n            border-radius: 4px;\r\n            margin-bottom: 8px;\r\n        }\r\n\r\n        .mock-hero-txt.short {\r\n            width: 45%;\r\n            height: 14px;\r\n        }\r\n\r\n        .mock-hero-sub {\r\n            width: 55%;\r\n            height: 6px;\r\n            background: #c9c7bd;\r\n            border-radius: 3px;\r\n            margin: 14px 0 16px;\r\n        }\r\n\r\n        .mock-btn {\r\n            width: 88px;\r\n            height: 22px;\r\n            background: var(--lime);\r\n            border-radius: 20px;\r\n        }\r\n\r\n        .mock-cards {\r\n            display: flex;\r\n            gap: 8px;\r\n            margin-top: 20px;\r\n        }\r\n\r\n        .mock-card {\r\n            flex: 1;\r\n            background: #fff;\r\n            border: 1px solid #e6e4db;\r\n            border-radius: 8px;\r\n            height: 52px;\r\n        }\r\n\r\n        .laptop-base {\r\n            height: 14px;\r\n            background: linear-gradient(180deg, #3a3a3a, #1c1c1c);\r\n            border-radius: 0 0 10px 10px;\r\n            position: relative;\r\n        }\r\n\r\n        .laptop-base::after {\r\n            content: '';\r\n            position: absolute;\r\n            left: 50%;\r\n            top: 0;\r\n            transform: translateX(-50%);\r\n            width: 70px;\r\n            height: 5px;\r\n            background: #0a0a0a;\r\n            border-radius: 0 0 6px 6px;\r\n        }\r\n\r\n        .float-badge {\r\n            position: absolute;\r\n            background: var(--white);\r\n            color: var(--black);\r\n            padding: 12px 16px;\r\n            border-radius: 14px;\r\n            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 10px;\r\n            font-size: 13px;\r\n            font-weight: 600;\r\n            animation: float 4s ease-in-out infinite;\r\n        }\r\n\r\n        .float-badge.b1 {\r\n            top: 18%;\r\n            left: -8%;\r\n            animation-delay: 0.2s;\r\n        }\r\n\r\n        .float-badge.b2 {\r\n            bottom: 8%;\r\n            right: -8%;\r\n            animation-delay: 0.4s;\r\n        }\r\n\r\n        .float-badge.b3 {\r\n            top: 40%;\r\n            right: 34%;\r\n            transform: translateY(-50%);\r\n            animation-delay: 0.6s;\r\n        }\r\n\r\n        .float-badge.b4 {\r\n            bottom: 10%;\r\n            left: -8%;\r\n            animation-delay: 0.8s;\r\n        }\r\n\r\n        .float-badge.b5 {\r\n            top: 8%;\r\n            right: -8%;\r\n            animation-delay: 1s;\r\n        }\r\n\r\n        .float-badge .ic {\r\n            width: 30px;\r\n            height: 30px;\r\n            border-radius: 50%;\r\n            background: var(--lime);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .float-badge .ic svg,\r\n        .float-badge .ic i {\r\n            font-size: 14px;\r\n            color: var(--black);\r\n        }\r\n\r\n        @keyframes float {\r\n\r\n            0%,\r\n            100% {\r\n                transform: translateY(0);\r\n            }\r\n\r\n            50% {\r\n                transform: translateY(-12px);\r\n            }\r\n        }\r\n\r\n\r\n        \/** MOBILE VERSION OF FLOAT BADGE**\/\r\n        @media (max-width: 768px) {\r\n\r\n            .float-badge.b1 {\r\n                top: 18%;\r\n                left: 2%;\r\n            }\r\n\r\n            .float-badge.b2 {\r\n                bottom: 8%;\r\n                right: 2%;\r\n            }\r\n\r\n            .float-badge.b3 {\r\n                top: 42%;\r\n                right: 26%;\r\n                transform: translateY(-50%);\r\n            }\r\n\r\n            .float-badge.b4 {\r\n                bottom: 10%;\r\n                left: 2%;\r\n            }\r\n\r\n            .float-badge.b5 {\r\n                top: 8%;\r\n                right: 2%;\r\n            }\r\n\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n\r\n            .float-badge {\r\n                padding: 8px 10px;\r\n                border-radius: 10px;\r\n                gap: 8px;\r\n                font-size: 11px;\r\n                font-weight: 600;\r\n                max-width: 150px;\r\n            }\r\n\r\n            .float-badge .ic {\r\n                width: 24px;\r\n                height: 24px;\r\n            }\r\n\r\n            .float-badge .ic i,\r\n            .float-badge .ic svg {\r\n                width: 12px;\r\n                font-size: 11px;\r\n            }\r\n\r\n        }\r\n\r\n        @media (max-width: 480px) {\r\n\r\n            .float-badge {\r\n                padding: 6px 8px;\r\n                gap: 6px;\r\n                font-size: 10px;\r\n                max-width: 130px;\r\n            }\r\n\r\n            .float-badge .ic {\r\n                width: 20px;\r\n                height: 20px;\r\n            }\r\n\r\n            .float-badge .ic i,\r\n            .float-badge .ic svg {\r\n                width: 10px;\r\n                font-size: 10px;\r\n            }\r\n\r\n        }\r\n\r\n        \/* marquee strip *\/\r\n        .marquee-strip {\r\n            background: var(--lime);\r\n            padding: 14px 0;\r\n            overflow: hidden;\r\n            white-space: nowrap;\r\n        }\r\n\r\n        .marquee-track {\r\n            display: inline-flex;\r\n            animation: scroll 24s linear infinite;\r\n        }\r\n\r\n        .marquee-track span {\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 700;\r\n            font-size: 15px;\r\n            color: var(--black);\r\n            margin: 0 26px;\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: 26px;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.03em;\r\n        }\r\n\r\n        .marquee-track span::after {\r\n            content: '\u25cf';\r\n            font-size: 8px;\r\n            opacity: .5;\r\n        }\r\n\r\n        @keyframes scroll {\r\n            from {\r\n                transform: translateX(0);\r\n            }\r\n\r\n            to {\r\n                transform: translateX(-50%);\r\n            }\r\n        }\r\n\r\n        \/* ===== SECTION HEADERS ===== *\/\r\n        .sec-head {\r\n            max-width: 640px;\r\n            margin-bottom: 56px;\r\n        }\r\n\r\n        .sec-head .mono {\r\n            color: var(--gray-500);\r\n            display: block;\r\n            margin-bottom: 14px;\r\n        }\r\n\r\n        .sec-head.on-dark .mono {\r\n            color: var(--lime);\r\n        }\r\n\r\n        .sec-head h2 {\r\n            font-size: clamp(28px, 5vw, 44px);\r\n        }\r\n\r\n        .sec-head p {\r\n            color: var(--gray-500);\r\n            font-size: 16px;\r\n            margin-top: 16px;\r\n            line-height: 1.6;\r\n        }\r\n\r\n        .sec-head.center {\r\n            margin-left: auto;\r\n            margin-right: auto;\r\n            text-align: center;\r\n        }\r\n\r\n        \/* ===== WHY CHOOSE US ===== *\/\r\n        .why {\r\n            padding: 110px 0;\r\n            background: var(--off-white);\r\n        }\r\n\r\n        .feature-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr;\r\n            gap: 20px;\r\n        }\r\n\r\n        .feature-card {\r\n            background: var(--white);\r\n            border: 1px solid var(--line-dark);\r\n            border-radius: var(--radius-md);\r\n            padding: 34px 28px;\r\n            transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;\r\n        }\r\n\r\n        .feature-card:hover {\r\n            transform: translateY(-8px);\r\n            box-shadow: 0 24px 50px rgba(0, 0, 0, 0.08);\r\n            border-color: transparent;\r\n        }\r\n\r\n        .feature-icon {\r\n            width: 52px;\r\n            height: 52px;\r\n            border-radius: 14px;\r\n            background: var(--black);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            margin-bottom: 22px;\r\n            transition: background .4s;\r\n        }\r\n\r\n        .feature-card:hover .feature-icon {\r\n            background: var(--lime);\r\n        }\r\n\r\n        .feature-icon svg,\r\n        .feature-icon i {\r\n            width: 24px;\r\n            font-size: 22px;\r\n            color: var(--lime);\r\n            transition: color .4s;\r\n        }\r\n\r\n        .feature-card:hover .feature-icon svg,\r\n        .feature-card:hover .feature-icon i {\r\n            color: var(--black);\r\n        }\r\n\r\n        .feature-card h3 {\r\n            font-size: 19px;\r\n            margin-bottom: 10px;\r\n        }\r\n\r\n        .feature-card p {\r\n            color: var(--gray-500);\r\n            font-size: 14.5px;\r\n            line-height: 1.65;\r\n        }\r\n\r\n        .feature-num {\r\n            font-family: 'JetBrains Mono', monospace;\r\n            font-size: 12px;\r\n            color: var(--gray-500);\r\n            margin-bottom: 16px;\r\n            display: block;\r\n        }\r\n\r\n        \/* ===== PACKAGES ===== *\/\r\n        .packages {\r\n            padding: 110px 0;\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n        .pricing-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr;\r\n            gap: 24px;\r\n        }\r\n\r\n        .price-card {\r\n            background: var(--card);\r\n            border: 1px solid var(--line);\r\n            border-radius: var(--radius-lg);\r\n            padding: 38px 30px;\r\n            display: flex;\r\n            flex-direction: column;\r\n            transition: transform .4s var(--ease), border-color .4s;\r\n            position: relative;\r\n        }\r\n\r\n        .price-card:hover {\r\n            transform: translateY(-8px);\r\n        }\r\n\r\n        .price-card.featured {\r\n            background: linear-gradient(160deg, #1c2405, var(--card) 40%);\r\n            border-color: var(--lime);\r\n        }\r\n\r\n        .featured-badge {\r\n            position: absolute;\r\n            top: -14px;\r\n            right: 30px;\r\n            background: var(--lime);\r\n            color: var(--black);\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 700;\r\n            font-size: 12px;\r\n            padding: 7px 16px;\r\n            border-radius: 100px;\r\n        }\r\n\r\n        .discount-tag {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: 6px;\r\n            background: rgba(200, 255, 61, 0.12);\r\n            color: var(--lime);\r\n            font-size: 12px;\r\n            font-weight: 600;\r\n            padding: 6px 12px;\r\n            border-radius: 100px;\r\n            margin-bottom: 20px;\r\n            width: fit-content;\r\n        }\r\n\r\n        .price-card h3 {\r\n            font-size: 22px;\r\n            margin-bottom: 6px;\r\n        }\r\n\r\n        .price-card .tagline {\r\n            color: var(--gray-500);\r\n            font-size: 13.5px;\r\n            margin-bottom: 22px;\r\n        }\r\n\r\n        .price-row {\r\n            display: flex;\r\n            align-items: baseline;\r\n            gap: 10px;\r\n            margin-bottom: 6px;\r\n            flex-wrap: wrap;\r\n        }\r\n\r\n        .price-old {\r\n            color: var(--gray-500);\r\n            text-decoration: line-through;\r\n            font-size: 16px;\r\n        }\r\n\r\n        .price-new {\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 800;\r\n            font-size: 36px;\r\n        }\r\n\r\n        .price-new small {\r\n            font-size: 15px;\r\n            font-weight: 600;\r\n            color: var(--gray-300);\r\n        }\r\n\r\n        .price-note {\r\n            color: var(--gray-500);\r\n            font-size: 12.5px;\r\n            margin-bottom: 26px;\r\n        }\r\n\r\n        .price-features {\r\n            margin-bottom: 30px;\r\n            flex: 1;\r\n        }\r\n\r\n        .price-features li {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            gap: 10px;\r\n            font-size: 14px;\r\n            color: var(--gray-300);\r\n            padding: 9px 0;\r\n            border-top: 1px solid var(--line);\r\n        }\r\n\r\n        .price-features li:first-child {\r\n            border-top: none;\r\n        }\r\n\r\n        .price-features li i {\r\n            font-size: 13px;\r\n            color: var(--lime);\r\n            flex-shrink: 0;\r\n            margin-top: 4px;\r\n            width: 16px;\r\n        }\r\n\r\n        .price-card .btn {\r\n            width: 100%;\r\n        }\r\n\r\n        \/* Original price badge *\/\r\n\r\n        .discount-badge {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            margin-left: 8px;\r\n            padding: 3px 8px;\r\n            border-radius: 20px;\r\n            background: #bfff00;\r\n            color: #111;\r\n            font-size: 11px;\r\n            font-weight: 700;\r\n            vertical-align: middle;\r\n        }\r\n\r\n\r\n        .feature-tip {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            margin-left: 6px;\r\n            color: #8d8d8d;\r\n            cursor: pointer;\r\n            font-size: 13px;\r\n            transition: .2s;\r\n        }\r\n\r\n        .feature-tip:hover {\r\n            color: #BFFF00;\r\n        }\r\n\r\n        #global-tooltip {\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            max-width: 280px;\r\n            padding: 12px 14px;\r\n            background: #111;\r\n            color: #fff;\r\n            border-radius: 10px;\r\n            font-size: 13px;\r\n            line-height: 1.6;\r\n            box-shadow: 0 15px 40px rgba(0, 0, 0, .35);\r\n            border: 1px solid rgba(170, 170, 170, 0.08);\r\n            opacity: 0;\r\n            visibility: hidden;\r\n            pointer-events: none;\r\n            transition: opacity .18s ease;\r\n            z-index: 999999;\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        #global-tooltip.show {\r\n            opacity: 1;\r\n            visibility: visible;\r\n        }\r\n\r\n        \/* ===== PROCESS ===== *\/\r\n        .process {\r\n            padding: 110px 0;\r\n            background: var(--off-white);\r\n        }\r\n\r\n        .process-list {\r\n            display: grid;\r\n            grid-template-columns: repeat(2, 1fr);\r\n            gap: 20px;\r\n\r\n\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n\r\n\r\n\r\n            .process-list {\r\n                grid-template-columns: 1fr;\r\n\r\n            }\r\n        }\r\n\r\n\r\n        .process-item {\r\n            display: grid;\r\n            grid-template-columns: 70px 1fr;\r\n            gap: 20px;\r\n            padding: 34px 0;\r\n            border-top: 1px solid var(--line-dark);\r\n            align-items: start;\r\n        }\r\n\r\n        .process-item:last-child {\r\n            border-bottom: 1px solid var(--line-dark);\r\n        }\r\n\r\n        .process-num {\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 800;\r\n            font-size: 36px;\r\n            color: var(--gray-300);\r\n            transition: color .4s;\r\n        }\r\n\r\n        .process-item:hover .process-num {\r\n            color: var(--lime-dim);\r\n        }\r\n\r\n        .process-body h3 {\r\n            font-size: 22px;\r\n            margin-bottom: 8px;\r\n        }\r\n\r\n        .process-body p {\r\n            color: var(--gray-500);\r\n            font-size: 15px;\r\n            max-width: 480px;\r\n            line-height: 1.65;\r\n        }\r\n\r\n        .process-tag {\r\n            font-family: 'JetBrains Mono', monospace;\r\n            font-size: 11px;\r\n            color: var(--gray-500);\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.1em;\r\n            margin-top: 12px;\r\n            display: inline-block;\r\n            border: 1px solid var(--line-dark);\r\n            padding: 5px 10px;\r\n            border-radius: 6px;\r\n        }\r\n\r\n        \/* ===== TESTIMONIALS ===== *\/\r\n        .testimonials {\r\n            padding: 110px 0;\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n        .test-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr;\r\n            gap: 20px;\r\n        }\r\n\r\n        .test-card {\r\n            background: var(--card);\r\n            border: 1px solid var(--line);\r\n            border-radius: var(--radius-md);\r\n            padding: 32px 28px;\r\n            transition: transform .4s var(--ease);\r\n        }\r\n\r\n        .test-card:hover {\r\n            transform: translateY(-6px);\r\n        }\r\n\r\n        .stars {\r\n            display: flex;\r\n            gap: 4px;\r\n            margin-bottom: 20px;\r\n        }\r\n\r\n        .stars i {\r\n            font-size: 14px;\r\n            color: var(--lime);\r\n        }\r\n\r\n        .test-card p.quote {\r\n            font-size: 15.5px;\r\n            line-height: 1.7;\r\n            color: var(--gray-300);\r\n            margin-bottom: 26px;\r\n        }\r\n\r\n        .test-author {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 12px;\r\n        }\r\n\r\n        .avatar {\r\n            width: 44px;\r\n            height: 44px;\r\n            border-radius: 50%;\r\n            background: #00000045;\r\n            color: #ffffff;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 800;\r\n            font-size: 15px;\r\n            flex-shrink: 0;\r\n        }\r\n\r\n        .author-name {\r\n            font-weight: 600;\r\n            font-size: 14.5px;\r\n        }\r\n\r\n        .author-role {\r\n            font-size: 12.5px;\r\n            color: var(--gray-500);\r\n            margin-top: 5px;\r\n        }\r\n\r\n        \/* ===== FAQ ===== *\/\r\n        .faq {\r\n            padding: 110px 0;\r\n            background: var(--black);\r\n        }\r\n\r\n        .faq h2 {\r\n            color: white;\r\n        }\r\n\r\n        .faq-list {\r\n            max-width: 100%;\r\n        }\r\n\r\n        .faq-item {\r\n            border-top: 1px solid rgb(27, 27, 27);\r\n        }\r\n\r\n        .faq-item:last-child {\r\n            border-bottom: 1px solid rgb(27, 27, 27);\r\n        }\r\n\r\n        .faq-q {\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: space-between;\r\n            gap: 20px;\r\n            padding: 26px 4px;\r\n            cursor: pointer;\r\n            background: none;\r\n            border: none;\r\n            width: 100%;\r\n            text-align: left;\r\n            font-family: 'Sora', sans-serif;\r\n            font-weight: 700;\r\n            font-size: 16.5px;\r\n            color: var(--white);\r\n        }\r\n\r\n        .faq-q .plus {\r\n            width: 30px;\r\n            height: 30px;\r\n            border-radius: 50%;\r\n            border: 1px solid rgb(80, 80, 80);\r\n            flex-shrink: 0;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            position: relative;\r\n            transition: transform .4s var(--ease), background .3s;\r\n        }\r\n\r\n        .faq-q .plus::before,\r\n        .faq-q .plus::after {\r\n            content: '';\r\n            position: absolute;\r\n            background: var(--white);\r\n            transition: transform .3s;\r\n        }\r\n\r\n        .faq-q .plus::before {\r\n            width: 12px;\r\n            height: 1.5px;\r\n\r\n        }\r\n\r\n        .faq-q .plus::after {\r\n            width: 1.5px;\r\n            height: 12px;\r\n        }\r\n\r\n        .faq-item.open .faq-q .plus {\r\n            background-color: black;\r\n            border-color: var(--lime);\r\n            transform: rotate(180deg);\r\n        }\r\n\r\n        .faq-item.open .faq-q .plus::after {\r\n            transform: scaleY(0);\r\n        }\r\n\r\n        .faq-a {\r\n            max-height: 0;\r\n            overflow: hidden;\r\n            transition: max-height .5s var(--ease);\r\n        }\r\n\r\n        .faq-a-inner {\r\n            padding: 0 4px 26px;\r\n            color: var(--gray-500);\r\n            font-size: 14.5px;\r\n            line-height: 1.7;\r\n            max-width: 100%;\r\n        }\r\n\r\n        \/* ===== FINAL CTA ===== *\/\r\n        .final-cta {\r\n            padding: 100px 0;\r\n            background: var(--lime);\r\n            color: var(--black);\r\n            text-align: center;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .final-cta h2 {\r\n            font-size: clamp(30px, 6vw, 54px);\r\n            max-width: 780px;\r\n            margin: 0 auto 22px;\r\n        }\r\n\r\n        .final-cta p {\r\n            font-size: 16px;\r\n            max-width: 520px;\r\n            margin: 0 auto 40px;\r\n            opacity: .75;\r\n        }\r\n\r\n        .final-cta-btns {\r\n            display: flex;\r\n            flex-wrap: wrap;\r\n            justify-content: center;\r\n            gap: 14px;\r\n        }\r\n\r\n        .final-cta .btn-primary {\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n        .final-cta .btn-primary:hover {\r\n            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);\r\n        }\r\n\r\n        .final-cta .btn-outline-dark:hover {\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n\r\n\r\n        @media (min-width:860px) {\r\n            .nav-links {\r\n                display: flex;\r\n            }\r\n\r\n            .burger {\r\n                display: none;\r\n            }\r\n\r\n            .desktop-only {\r\n                display: inline-flex;\r\n            }\r\n\r\n            .hero-grid {\r\n                grid-template-columns: 1.1fr 1fr;\r\n            }\r\n\r\n            .feature-grid {\r\n                grid-template-columns: repeat(4, 1fr);\r\n            }\r\n\r\n            .pricing-grid {\r\n                grid-template-columns: repeat(3, 1fr);\r\n                align-items: center;\r\n                gap: 0;\r\n            }\r\n\r\n            .price-card {\r\n                border-radius: 0;\r\n                margin: 0 -1px;\r\n            }\r\n\r\n            .price-card:first-child {\r\n                border-radius: var(--radius-lg) 0 0 var(--radius-lg);\r\n            }\r\n\r\n            .price-card:last-child {\r\n                border-radius: 0 var(--radius-lg) var(--radius-lg) 0;\r\n            }\r\n\r\n\r\n\r\n            .price-card.featured {\r\n                border-radius: var(--radius-lg) !important;\r\n                transform: scale(1.07);\r\n                z-index: 2;\r\n                box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45);\r\n                padding-top: 44px;\r\n                padding-bottom: 44px;\r\n            }\r\n\r\n            .price-card.featured:hover {\r\n                transform: scale(1.07) translateY(-8px);\r\n            }\r\n\r\n            .price-card:not(.featured):hover {\r\n                transform: translateY(-4px);\r\n                z-index: 1;\r\n            }\r\n\r\n            .test-grid {\r\n                grid-template-columns: repeat(3, 1fr);\r\n            }\r\n        }\r\n\r\n        @media (max-width:859px) {\r\n            .nav-links {\r\n                display: none;\r\n            }\r\n\r\n            .burger {\r\n                display: flex;\r\n            }\r\n\r\n            .desktop-only {\r\n                display: none;\r\n            }\r\n\r\n            .btn {\r\n                max-width: 100% !important;\r\n                width: 100%;\r\n            }\r\n        }\r\n.price-new {\r\n    font-family: 'Sora', sans-serif;\r\n    font-weight: 800;\r\n    font-size: 32px !important;\r\n}\r\n        }\r\n\r\n\r\n        .pricing-note {\r\n            max-width: 600px;\r\n            box-sizing: border;\r\n            margin: 60px auto 0;\r\n            text-align: center;\r\n            font-size: 12px;\r\n            line-height: 1.7;\r\n            color: #b9b9b9;\r\n            font-weight: 400;\r\n        }\r\n        \r\n\r\n        .pricing-note .highlight {\r\n            color: var(--lime);\r\n            \/* or #BFFF00 *\/\r\n            font-weight: 500;\r\n            text-decoration: underline;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .pricing-note {\r\n                   max-width: fit-content;\r\n        width: 100%;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n        padding: 0 20px;\r\n        font-size: 12px !important;\r\n        margin-top: 35px !important;\r\n                    text-align: center;\r\n\r\n            }\r\n        }\r\n\r\n\r\n\r\n\r\n        \/* ===== Nuevell Logo ===== *\/\r\n\r\n        .logo {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            width: 120px;\r\n            height: auto;\r\n            text-decoration: none;\r\n            line-height: 0;\r\n        }\r\n\r\n        .logo img {\r\n            display: block;\r\n            width: 100%;\r\n            height: auto;\r\n            max-width: 100%;\r\n            object-fit: contain;\r\n            object-position: center;\r\n        }\r\n\r\n        .logo {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            width: 130px;\r\n            height: auto;\r\n            text-decoration: none;\r\n            line-height: 0;\r\n        }\r\n\r\n        .logo img {\r\n            display: block;\r\n            width: 100%;\r\n            height: auto;\r\n            object-fit: contain;\r\n            object-position: center;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .logo {\r\n                width: 135px;\r\n            }\r\n\r\n\r\n                  .hero h1 {\r\n            font-size: clamp(28px, 7vw, 38px);\r\n            margin-bottom: 22px;\r\n        }\r\n\r\n        .marquee-track {\r\n            display: inline-flex;\r\n            animation: scroll var(--gray-500) linear infinite;\r\n        }\r\n\r\n        }\r\n\r\n\r\n        h2#faq-heading {\r\n            color: white !important;\r\n        }\r\n         .pricing-note {\r\n    width: 100%;\r\n    max-width: fit-content;\r\n    box-sizing: border-box;\r\n    overflow: hidden;\r\n    padding: 0 20px;\r\n    font-size: 12px !important;\r\n    margin: 47px auto 0 !important;\r\n    text-align: center !important;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero {\r\n    padding: 120px 0 90px !important;\r\n  }\r\n}\r\n\r\n    <\/style>\r\n    <style>\r\n        .stars {\r\n            display: flex;\r\n            align-items: center;\r\n        }\r\n\r\n        .stars img {\r\n            display: block;\r\n            width: 120px;\r\n            height: auto;\r\n            max-width: 100%;\r\n            user-select: none;\r\n            -webkit-user-select: none;\r\n            -webkit-user-drag: none;\r\n            pointer-events: none;\r\n        }\r\n        \r\n        \r\n        \r\n\r\n\r\n\r\n@media (max-width: 767px) {\r\n\r\n    .nuevell-case-study-content h2 {\r\n\r\n        font-size: 18px !important;\r\n\r\n    }\r\n\r\n\r\n\r\n.marquee-track {\r\n\r\n    display: inline-flex !important;\r\n\r\n    animation: scroll 4s linear infinite !important;\r\n\r\n}\r\n\r\n}\r\n    <\/style>\r\n\r\n    <script>\r\n        document.addEventListener('contextmenu', function (event) {\r\n            if (event.target.closest('.stars')) {\r\n                event.preventDefault();\r\n            }\r\n        });\r\n\r\n        document.addEventListener('dragstart', function (event) {\r\n            if (event.target.closest('.stars')) {\r\n                event.preventDefault();\r\n            }\r\n        });\r\n    <\/script>\r\n\r\n<\/head>\r\n\r\n<body>\r\n\r\n\r\n    <!-- HEADER \r\n    <header id=\"siteHeader\">\r\n        <div class=\"wrap nav-inner\">\r\n\r\n            <a href=\"#top\" class=\"logo\">\r\n                <img decoding=\"async\" src=\"https:\/\/oriellstudio.wordvell.com\/wp-content\/uploads\/2026\/08\/nuevell-logo-02.png\"\r\n                    alt=\"Nuevell\">\r\n            <\/a>\r\n\r\n            <nav class=\"nav-links\">\r\n                <a href=\"#top\">Home<\/a>\r\n                <a href=\"#packages\">Packages<\/a>\r\n                <a href=\"#process\">Process<\/a>\r\n                <a href=\"#testimonials\">Testimonials<\/a>\r\n                <a href=\"#faq\">FAQ<\/a>\r\n                <a href=\"#contact\">Contact<\/a>\r\n            <\/nav>\r\n\r\n            <div class=\"nav-cta\">\r\n\r\n                <a href=\"#contact\" class=\"btn btn-primary btn-sm desktop-only\">\r\n                    Get Your Website\r\n                <\/a>\r\n\r\n                <button class=\"burger\" id=\"burgerBtn\" aria-label=\"Toggle Menu\">\r\n                    <span><\/span>\r\n                    <span><\/span>\r\n                    <span><\/span>\r\n                <\/button>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/header> \r\n\r\n    <div class=\"mobile-menu\" id=\"mobileMenu\">\r\n\r\n        <button class=\"close-menu\" id=\"closeMenu\" aria-label=\"Close Menu\">\r\n            &times;\r\n        <\/button>\r\n\r\n        <a href=\"#top\" class=\"mm-link\">Home<\/a>\r\n        <a href=\"#packages\" class=\"mm-link\">Packages<\/a>\r\n        <a href=\"#process\" class=\"mm-link\">Process<\/a>\r\n        <a href=\"#testimonials\" class=\"mm-link\">Testimonials<\/a>\r\n        <a href=\"#faq\" class=\"mm-link\">FAQ<\/a>\r\n        <a href=\"#contact\" class=\"mm-link\">Contact<\/a>\r\n\r\n        <a href=\"#contact\" class=\"btn btn-primary mm-link\">\r\n            Build My Website\r\n        <\/a>\r\n\r\n    <\/div>\r\n-->\r\n    <!-- HERO -->\r\n    <section class=\"hero\" id=\"top\">\r\n        <div class=\"wrap hero-grid\">\r\n            <div class=\"reveal in\">\r\n                <div class=\"eyebrow\"><span class=\"pulse\"><\/span><span class=\"mono\" style=\"color:var(--lime)\">Trusted by\r\n                        236+ Businesses<\/span><\/div>\r\n                <h1>Pakistan's Leading <span class=\"hl\">Web Design Agency<\/span> for Ambitious Brands<\/h1>\r\n                <p class=\"lead\">We design high performing websites that build trust, attract ideal clients, and turn\r\n                    more visitors into paying customers, so your business can grow with confidence.\r\n\r\n                <\/p>\r\n                <div class=\"hero-ctas\">\r\n                    <a href=\"#contact\" class=\"btn btn-primary\">Start Your Project\r\n                    <\/a>\r\n                    <a href=\"#packages\" class=\"btn btn-outline\">View Packages<\/a>\r\n                <\/div>\r\n                <div class=\"hero-tags\">\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Get More Leads<\/div>\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Build Trust<\/div>\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Save Time<\/div>\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Increase Sales<\/div>\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Automate Tasks<\/div>\r\n                    <div class=\"tag\"><i class=\"fa-solid fa-check\"><\/i>Build Authority<\/div>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"reveal in\" style=\"position:relative;\">\r\n                <div class=\"laptop\">\r\n                    <div class=\"laptop-body\">\r\n                        <div class=\"laptop-screen\">\r\n                            <div class=\"browser-bar\">\r\n                                <div class=\"dot\"><\/div>\r\n                                <div class=\"dot\"><\/div>\r\n                                <div class=\"dot\"><\/div>\r\n                                <div class=\"browser-url\">Nuevell.com\/pk<\/div>\r\n                            <\/div>\r\n                            <div class=\"mock-page\">\r\n                                <div class=\"mock-nav\">\r\n                                    <div class=\"mock-logo\"><\/div>\r\n                                    <div class=\"mock-navlinks\">\r\n                                        <div><\/div>\r\n                                        <div><\/div>\r\n                                        <div><\/div>\r\n                                        <div><\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                                <div class=\"mock-hero-txt\"><\/div>\r\n                                <div class=\"mock-hero-txt short\"><\/div>\r\n                                <div class=\"mock-hero-sub\"><\/div>\r\n                                <div class=\"mock-btn\"><\/div>\r\n                                <div class=\"mock-cards\">\r\n                                    <div class=\"mock-card\"><\/div>\r\n                                    <div class=\"mock-card\"><\/div>\r\n                                    <div class=\"mock-card\"><\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"laptop-base\"><\/div>\r\n                    <div class=\"float-badge b1\">\r\n                        <div class=\"ic\"><i class=\"fa-solid fa-chart-line\"><\/i><\/div>\r\n                        Grow Revenue\r\n                    <\/div>\r\n\r\n                    <div class=\"float-badge b2\">\r\n                        <div class=\"ic\"><i class=\"fa-solid fa-robot\"><\/i><\/div>\r\n                        Automate Tasks\r\n                    <\/div>\r\n\r\n                    <div class=\"float-badge b3\">\r\n                        <div class=\"ic\"><i class=\"fa-solid fa-bullseye\"><\/i><\/div>\r\n                        Attract Clients\r\n                    <\/div>\r\n\r\n                    <div class=\"float-badge b4\">\r\n                        <div class=\"ic\"><i class=\"fa-solid fa-shield-halved\"><\/i><\/div>\r\n                        Win Trust\r\n                    <\/div>\r\n\r\n                    <div class=\"float-badge b5\">\r\n                        <div class=\"ic\"><i class=\"fa-solid fa-clock\"><\/i><\/div>\r\n                        Save Time\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <div class=\"marquee-strip\">\r\n        <div class=\"marquee-track\">\r\n            <span>Strategic Websites<\/span><span>Qualified Leads<\/span><span>Online Payments<\/span><span>Delivery\r\n                Integrated<\/span><span>Business Automation<\/span>\r\n            <span>Strategic Websites<\/span><span>Qualified Leads<\/span><span>Online Payments<\/span><span>Delivery\r\n                Integrated<\/span><span>Business Automation<\/span>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- WHY CHOOSE US -->\r\n    <section class=\"why\">\r\n        <div class=\"wrap\">\r\n            <div class=\"sec-head reveal\">\r\n                <span class=\"mono\">Why Nuevell<\/span>\r\n                <h2>Websites built to do more than just look good.<\/h2>\r\n                <p>Every project is engineered around a business outcome more customers, more sales, less manual work.\r\n                <\/p>\r\n            <\/div>\r\n            <div class=\"feature-grid\">\r\n                <div class=\"feature-card reveal\">\r\n                    <span class=\"feature-num\">01<\/span>\r\n                    <div class=\"feature-icon\"><i class=\"fa-solid fa-magnifying-glass\"><\/i><\/div>\r\n                    <h3>Attract Customers<\/h3>\r\n                    <p>SEO-ready structure and conversion-focused design that pulls the right buyers to your business\r\n                        online.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card reveal\">\r\n                    <span class=\"feature-num\">02<\/span>\r\n                    <div class=\"feature-icon\"><i class=\"fa-solid fa-cart-shopping\"><\/i><\/div>\r\n                    <h3>Sell Online<\/h3>\r\n                    <p>Full ecommerce with local payment gateways, so customers can buy from you 24\/7 without friction.\r\n                    <\/p>\r\n                <\/div>\r\n                <div class=\"feature-card reveal\">\r\n                    <span class=\"feature-num\">03<\/span>\r\n                    <div class=\"feature-icon\"><i class=\"fa-solid fa-bolt\"><\/i><\/div>\r\n                    <h3>Business Automation<\/h3>\r\n                    <p>Bookings, WhatsApp alerts, and dashboards that run in the background while you focus on\r\n                        customers.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card reveal\">\r\n                    <span class=\"feature-num\">04<\/span>\r\n                    <div class=\"feature-icon\"><i class=\"fa-solid fa-shield-halved\"><\/i><\/div>\r\n                    <h3>Build Trust<\/h3>\r\n                    <p>Premium design, testimonials, and clear policies that make visitors confident enough to say yes.\r\n                    <\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- PACKAGES -->\r\n    <section class=\"packages\" id=\"packages\">\r\n        <div class=\"wrap\">\r\n            <div class=\"sec-head on-dark reveal\">\r\n                <span class=\"mono\">Investment<\/span>\r\n                <h2>Packages built for every stage of growth.<\/h2>\r\n                <p>Transparent pricing. No hidden costs. Choose the package that fits where your business is today.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"pricing-grid\">\r\n\r\n                <!-- Starter -->\r\n                <div class=\"price-card reveal\">\r\n\r\n                    <span class=\"discount-tag\">\r\n                        <i class=\"fa-solid fa-tag\"><\/i>\r\n                        30% OFF\r\n                    <\/span>\r\n\r\n                    <h3>Launch<\/h3>\r\n\r\n                    <p class=\"tagline\">\r\n                        For solo entrepreneurs and small business owners ready to establish their online presence.\r\n                    <\/p>\r\n\r\n                    <div class=\"price-row\">\r\n                        <span class=\"price-old\">\r\n                            PKR 221,500\r\n                            <span class=\"discount-badge\">Save 66.5K<\/span>\r\n                        <\/span>\r\n                        <span class=\"price-new\">PKR 155,000<\/span>\r\n                    <\/div>\r\n\r\n                    <p class=\"price-note\">\r\n                        One-time payment \u2022 Delivered in 4 to 6 weeks\r\n                    <\/p>\r\n\r\n                    <ul class=\"price-features\">\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>7 to 10 page website<\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Conversion focused design\r\n                            <span class=\"feature-tip\" data-tip=\"Designed to turn visitors into leads and customers.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Professional website copywriting\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"Persuasive content written to communicate your services clearly.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Security, performance & SEO optimization\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"Improved speed, stronger security and search engine optimization.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Social profile integration<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>WhatsApp chat integration<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Easy to use admin panel<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Traffic analytics setup<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Business email setup<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>7 days post launch support<\/li>\r\n                    <\/ul>\r\n\r\n                    <a href=\"?nuevell_package=launch#contact\" class=\"btn btn-outline\">\r\n                        Choose Package\r\n                    <\/a>\r\n                <\/div>\r\n\r\n                <!-- Business -->\r\n                <div class=\"price-card featured reveal\">\r\n\r\n                    <span class=\"featured-badge\">Most Popular<\/span>\r\n\r\n                    <span class=\"discount-tag\">\r\n                        <i class=\"fa-solid fa-tag\"><\/i>\r\n                        30% OFF\r\n                    <\/span>\r\n\r\n                    <h3>Growth<\/h3>\r\n\r\n                    <p class=\"tagline\">\r\n                        For growing businesses looking to generate more leads, increase sales, and have their own E-commerce store\r\n                    <\/p>\r\n\r\n                    <div class=\"price-row\">\r\n                        <span class=\"price-old\">\r\n                            PKR 365,000\r\n                            <span class=\"discount-badge\">Save 109K<\/span>\r\n                        <\/span>\r\n                        <span class=\"price-new\">PKR 255,000<\/span>\r\n                    <\/div>\r\n\r\n                    <p class=\"price-note\">\r\n                        One-time payment \u2022 Delivered in 5 to 8 weeks\r\n                    <\/p>\r\n\r\n                    <ul class=\"price-features\">\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>10 to 15 page website<\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Premium custom website design\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"A completely unique design created specifically for your brand.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Professional branding\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"Logo usage, typography, colors and visual identity consistency.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Sales focused website copywriting<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Traffic analytics setup<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Accept online payments<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Order management system<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Client portal for order tracking<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>15 days post launch support<\/li>\r\n                    <\/ul>\r\n\r\n                    <a href=\"?nuevell_package=growth#contact\" class=\"btn btn-primary\">\r\n                        Choose Package\r\n                    <\/a>\r\n                <\/div>\r\n\r\n                <!-- Enterprise -->\r\n                <div class=\"price-card reveal\">\r\n\r\n                    <span class=\"discount-tag\">\r\n                        <i class=\"fa-solid fa-tag\"><\/i>\r\n                        30% OFF\r\n                    <\/span>\r\n\r\n                    <h3>Scale<\/h3>\r\n\r\n                    <p class=\"tagline\">\r\n                        For established businesses and enterprises that require premium design, advanced functionality,\r\n                        and scalable digital solutions.\r\n                    <\/p>\r\n\r\n                    <div class=\"price-row\">\r\n                        <span class=\"price-old\">\r\n                            PKR 543,000\r\n                            <span class=\"discount-badge\">Save 163K<\/span>\r\n                        <\/span>\r\n                        <span class=\"price-new\">PKR 380,000<\/span>\r\n                    <\/div>\r\n\r\n                    <p class=\"price-note\">\r\n                        One-time payment \u2022 Delivered in 8 to 10 weeks\r\n                    <\/p>\r\n\r\n                    <ul class=\"price-features\">\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Fully custom enterprise website<\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Premium UI & UX design\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"Research driven interfaces designed for exceptional user experience.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li>\r\n                            <i class=\"fa-solid fa-check\"><\/i>\r\n                            Advanced custom functionality\r\n                            <span class=\"feature-tip\"\r\n                                data-tip=\"Tailor made features developed specifically for your business.\">\r\n                                <i class=\"fa-solid fa-circle-info\"><\/i>\r\n                            <\/span>\r\n                        <\/li>\r\n\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Enterprise grade security & performance<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>CRM & third party integrations<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Custom dashboards & workflows<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Dedicated project management<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>Priority technical support<\/li>\r\n                        <li><i class=\"fa-solid fa-check\"><\/i>30 days post launch support<\/li>\r\n                    <\/ul>\r\n\r\n                    <a href=\"?nuevell_package=scale#contact\" class=\"btn btn-outline\">\r\n                        Choose Package\r\n                    <\/a>\r\n                <\/div>\r\n\r\n            <\/div>\r\n        <\/div>\r\n    <p class=\"pricing-note\">\r\n    Please note: The prices above are exclusive of applicable\r\n    <span class=\"highlight\">taxes<\/span> and include\r\n    <span class=\"highlight\">domain registration<\/span> or\r\n    <span class=\"highlight\">hosting<\/span> costs.\r\n    Read more in our\r\n    <a href=\"https:\/\/nuevell.com\/pk\/website-buyers-guide\/\" class=\"highlight\">\r\n        Website Buyer\u2019s Guide\r\n    <\/a>\r\n<\/p>\r\n    <\/section>\r\n\r\n    <!-- PROCESS -->\r\n    <section class=\"process\" id=\"process\">\r\n        <div class=\"wrap\">\r\n            <div class=\"sec-head reveal\">\r\n                <span class=\"mono\">How We Work<\/span>\r\n                <h2>From first call to launch day.<\/h2>\r\n                <p>A clear, structured process so you always know what's happening and when.<\/p>\r\n            <\/div>\r\n            <div class=\"process-list\">\r\n                <div class=\"process-item reveal\">\r\n                    <div class=\"process-num\">01<\/div>\r\n                    <div class=\"process-body\">\r\n                        <h3>Discovery<\/h3>\r\n                        <p>We learn your business, your customers, and your goals then map out exactly what your\r\n                            website needs to achieve.<\/p>\r\n                        <span class=\"process-tag\">Phase 1<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"process-item reveal\">\r\n                    <div class=\"process-num\">02<\/div>\r\n                    <div class=\"process-body\">\r\n                        <h3>Design<\/h3>\r\n                        <p>Custom layouts and visuals crafted around your brand, shared with you for feedback before a\r\n                            single line of code is written.<\/p>\r\n                        <span class=\"process-tag\">Phase 2<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"process-item reveal\">\r\n                    <div class=\"process-num\">03<\/div>\r\n                    <div class=\"process-body\">\r\n                        <h3>Development<\/h3>\r\n                        <p>We build your site to be fast, responsive, and fully functional including payments,\r\n                            delivery, and automation where needed.<\/p>\r\n                        <span class=\"process-tag\">Phase 3<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"process-item reveal\">\r\n                    <div class=\"process-num\">04<\/div>\r\n                    <div class=\"process-body\">\r\n                        <h3>Launch<\/h3>\r\n                        <p>Final testing, handover, and go-live with training so your team can manage the site with\r\n                            confidence from day one.<\/p>\r\n                        <span class=\"process-tag\">Phase 4<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n\r\n\r\n    \r\n  <style>\r\n  \/* ============================================\r\n           CASE STUDY \u2014 FEATURED\r\n           Light section. Two-column: store mock + case file.\r\n        ============================================ *\/\r\n        .case-study {\r\n            background: var(--off-white);\r\n            padding: 120px 0;\r\n        }\r\n\r\n        .case-study .wrap {\r\n            display: grid;\r\n            grid-template-columns: 0.92fr 1.08fr;\r\n            gap: 64px;\r\n            align-items: center;\r\n        }\r\n\r\n        \/* =========================================\r\n   NUEVELL CASE STUDY CARD\r\n========================================= *\/\r\n\r\n.nuevell-case-study-card {\r\n    --nuevell-black: #111111;\r\n    --nuevell-white: #ffffff;\r\n    --nuevell-lime: #d9ff38;\r\n\r\n    width: 100%;\r\n    display: grid;\r\n    grid-template-columns: 2fr 1fr 1fr;\r\n    gap: 14px;\r\n    box-sizing: border-box;\r\n}\r\n\r\n\/* =========================================\r\n   MAIN VIDEO CARD\r\n========================================= *\/\r\n\r\n.nuevell-video-card {\r\n    position: relative;\r\n    min-height: 420px;\r\n    overflow: hidden;\r\n    border-radius: 24px;\r\n    background: #111;\r\n    isolation: isolate;\r\n    cursor: pointer;\r\n}\r\n\r\n.nuevell-case-video {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    display: block;\r\n    object-fit: cover;\r\n    z-index: -2;\r\n    transition: transform 0.8s cubic-bezier(.2,.7,.2,1);\r\n}\r\n\r\n.nuevell-video-card:hover .nuevell-case-video {\r\n    transform: scale(1.045);\r\n}\r\n\r\n\/* =========================================\r\n   VIDEO OVERLAY\r\n========================================= *\/\r\n\r\n.nuevell-video-overlay {\r\n    position: absolute;\r\n    inset: 0;\r\n    z-index: -1;\r\n\r\n    background:\r\n        linear-gradient(\r\n            180deg,\r\n            rgba(0,0,0,.25) 0%,\r\n            rgba(0,0,0,.02) 40%,\r\n            rgba(0,0,0,.72) 100%\r\n        );\r\n}\r\n\r\n\/* =========================================\r\n   TOP CONTENT\r\n========================================= *\/\r\n\r\n.nuevell-card-top {\r\n    position: absolute;\r\n    top: 18px;\r\n    left: 18px;\r\n    right: 18px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n}\r\n\r\n.nuevell-video-card .tag {\r\n    display: inline-flex;\r\n    align-items: center;\r\n\r\n    padding: 8px 13px;\r\n\r\n    border-radius: 100px;\r\n\r\n    background: rgba(255,255,255,.92);\r\n    color: #111;\r\n\r\n    font-family: inherit;\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n    line-height: 1;\r\n\r\n    letter-spacing: .04em;\r\n    text-transform: uppercase;\r\n\r\n    backdrop-filter: blur(12px);\r\n    -webkit-backdrop-filter: blur(12px);\r\n}\r\n\r\n.nuevell-card-number {\r\n    width: 38px;\r\n    height: 38px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    border: 1px solid rgba(255,255,255,.35);\r\n    border-radius: 50%;\r\n\r\n    color: #fff;\r\n    background: rgba(0,0,0,.2);\r\n\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n\r\n    backdrop-filter: blur(10px);\r\n    -webkit-backdrop-filter: blur(10px);\r\n}\r\n\r\n\/* =========================================\r\n   BOTTOM CONTENT\r\n========================================= *\/\r\n\r\n.nuevell-card-bottom {\r\n    position: absolute;\r\n\r\n    left: 22px;\r\n    right: 22px;\r\n    bottom: 20px;\r\n\r\n    display: flex;\r\n    align-items: flex-end;\r\n    justify-content: space-between;\r\n    gap: 20px;\r\n}\r\n\r\n.nuevell-eyebrow {\r\n    display: block;\r\n\r\n    margin-bottom: 7px;\r\n\r\n    color: var(--nuevell-lime);\r\n\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n\r\n    letter-spacing: .08em;\r\n    text-transform: uppercase;\r\n}\r\n\r\n.nuevell-card-bottom h3 {\r\n    margin: 0;\r\n\r\n    max-width: 480px;\r\n\r\n    color: #fff;\r\n\r\n    font-size: clamp(24px, 3vw, 42px);\r\n    font-weight: 600;\r\n    line-height: 1.02;\r\n    letter-spacing: -.04em;\r\n}\r\n\r\n\/* =========================================\r\n   ARROW\r\n========================================= *\/\r\n\r\n.nuevell-card-arrow {\r\n    flex: 0 0 auto;\r\n\r\n    width: 52px;\r\n    height: 52px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    border-radius: 50%;\r\n\r\n    background: var(--nuevell-lime);\r\n    color: #111;\r\n\r\n    text-decoration: none;\r\n\r\n    font-size: 22px;\r\n    line-height: 1;\r\n\r\n    transition:\r\n        transform .3s ease,\r\n        background .3s ease;\r\n}\r\n\r\n.nuevell-card-arrow:hover {\r\n    transform: rotate(45deg) scale(1.05);\r\n    background: #fff;\r\n}\r\n\r\n\/* =========================================\r\n   SMALL CARDS\r\n========================================= *\/\r\n\r\n.nuevell-mini-card {\r\n    position: relative;\r\n\r\n    min-height: 420px;\r\n\r\n    padding: 22px;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: space-between;\r\n\r\n    box-sizing: border-box;\r\n\r\n    overflow: hidden;\r\n\r\n    border-radius: 24px;\r\n\r\n    background: var(--nuevell-black);\r\n    color: #fff;\r\n\r\n    transition:\r\n        transform .35s ease,\r\n        border-radius .35s ease;\r\n}\r\n\r\n.nuevell-mini-card:hover {\r\n    transform: translateY(-5px);\r\n    border-radius: 30px;\r\n}\r\n\r\n.nuevell-mini-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    width: 180px;\r\n    height: 180px;\r\n\r\n    right: -70px;\r\n    bottom: -70px;\r\n\r\n    border-radius: 50%;\r\n\r\n    opacity: .9;\r\n\r\n    transition: transform .5s ease;\r\n}\r\n\r\n.nuevell-mini-card:hover::after {\r\n    transform: scale(1.3);\r\n}\r\n\r\n.nuevell-mini-label {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    font-size: 10px;\r\n    font-weight: 700;\r\n\r\n    letter-spacing: .1em;\r\n    text-transform: uppercase;\r\n\r\n    opacity: .6;\r\n}\r\n\r\n.nuevell-mini-card strong {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    font-size: clamp(25px, 2.3vw, 34px);\r\n    line-height: .98;\r\n    letter-spacing: -.045em;\r\n    font-weight: 600;\r\n}\r\n\r\n.nuevell-mini-number {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    align-self: flex-start;\r\n\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n\r\n    opacity: .55;\r\n}\r\n\r\n\/* =========================================\r\n   LIGHT VARIANT\r\n========================================= *\/\r\n\r\n.nuevell-mini-card-light {\r\n    background: var(--nuevell-lime);\r\n    color: #111;\r\n}\r\n\r\n.nuevell-mini-card-light::after {\r\n    background: rgba(255,255,255,.35);\r\n}\r\n\r\n.nuevell-mini-card-light .nuevell-mini-label,\r\n.nuevell-mini-card-light .nuevell-mini-number {\r\n    opacity: .55;\r\n}\r\n\r\n\/* =========================================\r\n   TABLET\r\n========================================= *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n    .nuevell-case-study-card {\r\n        grid-template-columns: 1fr 1fr;\r\n    }\r\n\r\n    .nuevell-video-card {\r\n        grid-column: 1 \/ -1;\r\n        min-height: 430px;\r\n    }\r\n\r\n    .nuevell-mini-card {\r\n        min-height: 300px;\r\n    }\r\n}\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .nuevell-case-study-card {\r\n        grid-template-columns: 1fr;\r\n        gap: 10px;\r\n    }\r\n\r\n    .nuevell-video-card {\r\n        min-height: 380px;\r\n        border-radius: 20px;\r\n    }\r\n\r\n    .nuevell-mini-card {\r\n        min-height: 230px;\r\n        border-radius: 20px;\r\n    }\r\n\r\n    .nuevell-card-top {\r\n        top: 14px;\r\n        left: 14px;\r\n        right: 14px;\r\n    }\r\n\r\n    .nuevell-card-bottom {\r\n        left: 16px;\r\n        right: 16px;\r\n        bottom: 16px;\r\n    }\r\n\r\n    .nuevell-card-bottom h3 {\r\n        font-size: 27px;\r\n    }\r\n\r\n    .nuevell-card-arrow {\r\n        width: 45px;\r\n        height: 45px;\r\n        font-size: 19px;\r\n    }\r\n    \r\n}\r\n\r\n        \/* --- store mock panel --- *\/\r\n        .nuevell-case-study-visual {\r\n            position: relative;\r\n            border-radius: var(--radius-lg);\r\n            background: var(--black);\r\n            padding: 2px;\r\n            border: 2px solid var(--line);\r\n        }\r\n\r\n        .nuevell-case-study-visual .browser-bar {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 6px;\r\n            padding-bottom: 16px;\r\n        }\r\n\r\n        .nuevell-case-study-visual .browser-bar span {\r\n            width: 8px;\r\n            height: 8px;\r\n            border-radius: 50%;\r\n            background: rgba(255, 255, 255, 0.18);\r\n        }\r\n\r\n        .nuevell-case-study-visual .browser-bar .url {\r\n            margin-left: 12px;\r\n            font-family: 'JetBrains Mono', monospace;\r\n            font-size: 10px;\r\n            letter-spacing: 0.04em;\r\n            color: var(--gray-500);\r\n            border: 1px solid var(--line);\r\n            border-radius: 100px;\r\n            padding: 5px 12px;\r\n        }\r\n\r\n        .nuevell-case-study-visual .store-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 10px;\r\n        }\r\n\r\n        .nuevell-case-study-visual .store-hero {\r\n            grid-column: 1 \/ -1;\r\n            border-radius: var(--radius-sm);\r\n            aspect-ratio: 16 \/ 7;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .nuevell-case-study-visual .store-hero::after {\r\n            content: \"\";\r\n            position: absolute;\r\n            right: -20px;\r\n            bottom: -30px;\r\n            width: 130px;\r\n            height: 130px;\r\n            border-radius: 50%;\r\n            background: rgba(0, 9, 10, 0.10);\r\n        }\r\n\r\n        .nuevell-case-study-visual .store-hero .tag {\r\n            position: absolute;\r\n            left: 16px;\r\n            top: 16px;\r\n            font-family: 'JetBrains Mono', monospace;\r\n            font-size: 9px;\r\n            letter-spacing: 0.1em;\r\n            text-transform: uppercase;\r\n            color: var(--black);\r\n            background: var(--white);\r\n            border-radius: 100px;\r\n            padding: 5px 10px;\r\n        }\r\n\r\n        .nuevell-case-study-visual .product-tile {\r\n            border-radius: var(--radius-sm);\r\n            background: #14181A;\r\n            border: 1px solid var(--line);\r\n            aspect-ratio: 1 \/ 1;\r\n            padding: 10px;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: space-between;\r\n        }\r\n\r\n        .nuevell-case-study-visual .product-tile .swatch {\r\n            width: 100%;\r\n            flex: 1;\r\n            border-radius: 8px;\r\n            background: rgba(255, 255, 255, 0.06);\r\n        }\r\n\r\n        .nuevell-case-study-visual .product-tile .line {\r\n            height: 6px;\r\n            border-radius: 3px;\r\n            background: rgba(255, 255, 255, 0.14);\r\n            margin-top: 8px;\r\n        }\r\n\r\n        .nuevell-case-study-visual .product-tile .line.short { width: 60%; }\r\n        .nuevell-case-study-visual .product-tile .line.lime { background: var(--lime); width: 40%; }\r\n\r\n        \/* --- case file content --- *\/\r\n        .nuevell-case-study-content .mono { color: var(--gray-500); margin-bottom: 18px; display: block; }\r\n\r\n        .nuevell-case-study-content h2 {\r\n            font-size: clamp(24px, 3.2vw, 36px);\r\n            color: var(--black);\r\n            margin-bottom: 32px;\r\n            max-width: 520px;\r\n        }\r\n\r\n        .nuevell-case-study-meta {\r\n            display: grid;\r\n            grid-template-columns: repeat(3, 1fr);\r\n            border-top: 1px solid var(--line-dark);\r\n            border-bottom: 1px solid var(--line-dark);\r\n            margin-bottom: 36px;\r\n        }\r\n\r\n        .nuevell-case-study-meta div {\r\n            padding: 16px 18px 16px 0;\r\n        }\r\n\r\n        .nuevell-case-study-meta div + div {\r\n            border-left: 1px solid var(--line-dark);\r\n            padding-left: 18px;\r\n        }\r\n\r\n        .nuevell-case-study-meta .mono {\r\n            display: block;\r\n            color: var(--gray-500);\r\n            margin-bottom: 8px;\r\n        }\r\n\r\n        .nuevell-case-study-meta strong {\r\n            font-family: 'Sora', sans-serif;\r\n            font-size: 15px;\r\n            font-weight: 600;\r\n            color: var(--black);\r\n        }\r\n\r\n        .nuevell-case-study-actions {\r\n            display: flex;\r\n            flex-wrap: wrap;\r\n            gap: 14px;\r\n        }\r\n\r\n        .nuevell-cta-btn {\r\n            font-family: 'Inter', sans-serif;\r\n            font-weight: 600;\r\n            font-size: 14px;\r\n            border-radius: 100px;\r\n            padding: 15px 26px;\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: 10px;\r\n            transition: transform .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);\r\n            border: 1px solid transparent;\r\n            cursor: pointer;\r\n        }\r\n\r\n        .nuevell-cta-btn:hover { transform: translateY(-2px); }\r\n\r\n        .nuevell-cta-btn-primary {\r\n            background: var(--black);\r\n            color: var(--white);\r\n        }\r\n\r\n        .nuevell-cta-btn-primary:hover { background: #14181A; }\r\n\r\n        .nuevell-cta-btn-outline {\r\n            background: transparent;\r\n            color: var(--black);\r\n            border-color: var(--line-dark);\r\n        }\r\n\r\n        .nuevell-cta-btn-outline:hover { border-color: var(--black); }\r\n\r\n        .nuevell-cta-btn i { font-size: 12px; }\r\n\r\n        @media (max-width: 900px) {\r\n            .case-study { padding: 88px 0; }\r\n            .case-study .wrap {\r\n                grid-template-columns: 1fr;\r\n                gap: 40px;\r\n            }\r\n            .nuevell-case-study-content h2 { max-width: 100%; }\r\n\r\n            .nuevell-case-study-actions{\r\n                flex-direction: column;\r\n                flex-grow: 1;\r\n            }\r\n        }\r\n\r\n        @media (max-width: 520px) {\r\n            .nuevell-case-study-meta { grid-template-columns: 1fr; }\r\n            .nuevell-case-study-meta div { border-left: none !important; padding-left: 0 !important; border-top: 1px solid var(--line-dark); padding-top: 14px; }\r\n            .nuevell-case-study-meta div:first-child { border-top: none; padding-top: 0; }\r\n            .nuevell-case-study-actions .nuevell-cta-btn { flex: 1; justify-content: center; }\r\n            .nuevell-case-study-meta > div:first-child .mono {\r\n    margin-top: 5px;\r\n}\r\n        }\r\n\r\n        \/* ============================================\r\n           BUYER'S GUIDE\r\n           Dark section. Centered card, lime badge signature.\r\n        ============================================ *\/\r\n        .buyers-guide {\r\n            background: var(--black);\r\n            padding: 110px 0;\r\n        }\r\n\r\n        .bg-card {\r\n            max-width: 760px;\r\n            margin: 0 auto;\r\n            text-align: center;\r\n            display: flex;\r\n            flex-direction: column;\r\n            align-items: center;\r\n        }\r\n\r\n        .bg-badge {\r\n            width: 56px;\r\n            height: 56px;\r\n            border-radius: 16px;\r\n            background: var(--lime);\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            margin-bottom: 28px;\r\n            transform: rotate(-6deg);\r\n        }\r\n\r\n        .bg-badge i {\r\n            color: var(--black);\r\n            font-size: 20px;\r\n        }\r\n\r\n        .buyers-guide .mono {\r\n            color: var(--lime);\r\n            margin-bottom: 16px;\r\n        }\r\n\r\n        .buyers-guide h2 {\r\n            color: var(--white);\r\n            font-size: clamp(28px, 3.6vw, 44px);\r\n            max-width: 560px;\r\n            margin-bottom: 18px;\r\n        }\r\n\r\n        .buyers-guide p {\r\n            color: var(--gray-300);\r\n            font-size: 16px;\r\n            line-height: 1.6;\r\n            max-width: 480px;\r\n            margin-bottom: 40px;\r\n        }\r\n\r\n        .bg-actions {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 28px;\r\n            flex-wrap: wrap;\r\n            justify-content: center;\r\n        }\r\n\r\n        .nuevell-cta-btn-lime {\r\n            background: var(--lime);\r\n            color: var(--black);\r\n        }\r\n\r\n        .nuevell-cta-btn-lime:hover { background: var(--lime-dim); }\r\n        .nuevell-cta-btn-primary:hover{\r\n            color: white !important;\r\n        }\r\n\r\n        .link-chat {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            gap: 9px;\r\n            color: var(--white);\r\n            font-weight: 600;\r\n            font-size: 16px;\r\n            padding-bottom: 2px;\r\n            border-bottom: 1px solid var(--line);\r\n            transition: border-color .3s var(--ease), color .3s var(--ease);\r\n        }\r\n\r\n        .link-chat i { color: var(--lime); font-size: 14px; }\r\n\r\n        .link-chat:hover { border-color: var(--lime); color: white; }\r\n\r\n        @media (max-width: 600px) {\r\n            .buyers-guide { padding: 80px 0; }\r\n            .bg-actions { flex-direction: column; gap: 18px; width: 100%; }\r\n            .bg-actions .nuevell-cta-btn { width: 100%; justify-content: center; }\r\n        }\r\n        \r\n        .nuevell-card-bottom {\r\n    position: absolute;\r\n    z-index: 20;\r\n}\r\n\r\n.nuevell-card-arrow {\r\n    position: relative;\r\n    z-index: 9999 !important;\r\n    display: flex;\r\n    pointer-events: auto !important;\r\n}\r\n        \r\n        \r\n    <\/style>\r\n\r\n    <!-- ============================================\r\n         CASE STUDY \u2014 FEATURED\r\n    ============================================ -->\r\n\r\n<section class=\"case-study\" id=\"case-study\">\r\n    <div class=\"wrap\">\r\n        <div class=\"nuevell-case-study-visual reveal\">\r\n            <div class=\"store-grid nuevell-case-study-card\">\r\n\r\n                <div class=\"store-hero nuevell-video-card\">\r\n                    <video\r\n                        class=\"nuevell-case-video\"\r\n                        autoplay\r\n                        muted\r\n                        loop\r\n                        playsinline\r\n                        preload=\"auto\"\r\n                        poster=\"https:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/vetra-studio-webpage-home-08.png\"\r\n                    >\r\n                        <source src=\"https:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/vetra-studio-animation.mp4\" type=\"video\/mp4\">\r\n                    <\/video>\r\n\r\n                    <div class=\"nuevell-video-overlay\"><\/div>\r\n\r\n                    <div class=\"nuevell-card-top\">\r\n                        <span class=\"tag\">Featured Case Study<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"nuevell-card-bottom\">\r\n                        <div>\r\n                            <span class=\"nuevell-eyebrow\">Nuevell \u00d7 Architecture & Interior Design<\/span>\r\n                            <h3>Premium Architecture Portfolio<\/h3>\r\n                        <\/div>\r\n\r\n                        <a href=\"https:\/\/nuevell.com\/pk\/vetra-studio-case-study\/\" class=\"nuevell-card-arrow\" aria-label=\"View case study\">\r\n                            \u2197\r\n                        <\/a>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"nuevell-case-study-content reveal\">\r\n\r\n            <span class=\"mono\">Featured Case Study<\/span>\r\n\r\n            <h2>\r\n                How We Helped Vetra Studio Build a Premium Portfolio That Wins Client Trust Before the First Meeting\r\n            <\/h2>\r\n\r\n            <div class=\"nuevell-case-study-meta\">\r\n\r\n                <div>\r\n                    <span class=\"mono\">Client<\/span>\r\n                    <strong>Vetra Studio<\/strong>\r\n                <\/div>\r\n\r\n                <div>\r\n                    <span class=\"mono\">Industry<\/span>\r\n                    <strong>Architecture & Interior Design<\/strong>\r\n                <\/div>\r\n\r\n                <div>\r\n                    <span class=\"mono\">Project<\/span>\r\n                    <strong>Premium Portfolio Website Design & Development<\/strong>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n            <div class=\"nuevell-case-study-actions\">\r\n\r\n                <a href=\"https:\/\/nuevell.com\/pk\/vetra-studio-case-study\/\" class=\"nuevell-cta-btn nuevell-cta-btn-primary\">\r\n                    Read Full Case Study <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n\r\n             <a href=\"https:\/\/vetrastudio.nuevell.com\/\" target=\"_blank\" rel=\"noopener\" class=\"nuevell-cta-btn nuevell-cta-btn-outline\">\r\n    See Portfolio Live <i class=\"fa-solid fa-arrow-up-right-from-square\"><\/i>\r\n<\/a>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n\r\n    \r\n\r\n <!-- TESTIMONIALS -->\r\n\r\n<section class=\"testimonials\" id=\"testimonials\">\r\n    <div class=\"wrap\">\r\n        <div class=\"sec-head on-dark reveal\">\r\n            <span class=\"mono\">Client Results<\/span>\r\n            <h2>Businesses growing with Nuevell.<\/h2>\r\n        <\/div>\r\n    <div class=\"test-grid\">\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"We were managing most orders through WhatsApp. Nuevell organised everything on the website, including our menu, orders and delivery information. It has made things much easier for us.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">AH<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Ahmed Hassan<\/div>\r\n                    <div class=\"author-role\">Restaurant Owner, Lahore<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"Our old website did not really represent the brand. The new store looks much more professional and customers can now place orders and make payments directly. The overall experience has been very good.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">SM<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Sana Malik<\/div>\r\n                    <div class=\"author-role\">Founder, Fashion Brand<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"I liked the way Nuevell handled the project. Everything was discussed before starting, the process was clear and there were no surprises later. They delivered what was agreed.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">BK<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Bilal Khan<\/div>\r\n                    <div class=\"author-role\">Marketing Consultant<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"Before this, most of our appointments were coming through Facebook and WhatsApp. Now customers can book through the website themselves. It has reduced a lot of the daily back and forth.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">FZ<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Faisal Zaidi<\/div>\r\n                    <div class=\"author-role\">Owner, Salon Chain, Karachi<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"They understood what we actually needed instead of adding unnecessary things. The website is clean, easy to use and our customers have responded well to it.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">RA<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Rabia Anwar<\/div>\r\n                    <div class=\"author-role\">Founder, Home Bakery, Islamabad<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"test-card reveal\">\r\n            <div class=\"stars\">\r\n                <img loading=\"lazy\" src=\"http:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\"\r\n                    alt=\"Nuevell trusted badge\" loading=\"lazy\" decoding=\"async\" width=\"120\" height=\"40\">\r\n            <\/div>\r\n            <p class=\"quote\">\"We had a deadline for an exhibition and needed the website ready on time. Nuevell managed the work properly and delivered the product catalogue before the event. Communication was also good throughout.\"<\/p>\r\n            <div class=\"test-author\">\r\n                <div class=\"avatar\">UT<\/div>\r\n                <div>\r\n                    <div class=\"author-name\">Usman Tariq<\/div>\r\n                    <div class=\"author-role\">CEO, Furniture Business, Faisalabad<\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n\r\n<\/section>\r\n\r\n\r\n<!-- ============================================\r\n         BUYER'S GUIDE\r\n    ============================================ -->\r\n    <section class=\"buyers-guide\" id=\"buyers-guide\">\r\n        <div class=\"wrap\">\r\n            <div class=\"bg-card reveal\">\r\n                <div class=\"bg-badge\">\r\n                    <i class=\"fa-solid fa-book\"><\/i>\r\n                <\/div>\r\n                <span class=\"mono\">Buyer's Guide<\/span>\r\n                <h2>Buying a Website for the First Time?<\/h2>\r\n                <p>Read our user-friendly guide to understand the process, technical terms, what you need, and how to get started.<\/p>\r\n                <div class=\"bg-actions\">\r\n                    <a href=\"https:\/\/nuevell.com\/pk\/website-buyers-guide\/\" class=\"nuevell-cta-btn nuevell-cta-btn-lime\">\r\n                        Read the Guide <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                    <\/a>\r\n                    <a href=\"#\" class=\"link-chat nuevell-chat-trigger\">\r\n                        <i class=\"fa-solid fa-comment-dots\"><\/i> Chat Live\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>  \r\n  \r\n<style>a.highlight {\r\n    color: var(--lime);\r\n    font-weight: 500;\r\n    text-decoration: underline;\r\n}\r\na.highlight:hover {\r\n    color: var(--lime);\r\n    font-weight: 500;\r\n    text-decoration: underline;\r\n}\r\n\r\n\r\n<\/style>\r\n\r\n<!-- FAQ -->\r\n<section class=\"faq\" id=\"faq\">\r\n    <div class=\"wrap\">\r\n\r\n        <div class=\"sec-head reveal\">\r\n            <span class=\"mono\">Questions<\/span>\r\n            <h2 id=\"faq-heading\">Everything you need to know.<\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"faq-list\">\r\n<!-- FAQ Item -->\r\n<div class=\"faq-item reveal\">\r\n    <button class=\"faq-q\">\r\n        Know About Nuevell?\r\n        <span class=\"plus\"><\/span>\r\n    <\/button>\r\n\r\n    <div class=\"faq-a\">\r\n        <div class=\"faq-a-inner\">\r\n            Nuevell is a web design and development studio helping Pakistani businesses\r\n            build professional websites and online stores across different industries.\r\n            We focus on design, development, performance, and creating websites that\r\n            support your business goals.\r\n\r\n            <strong>We are not a marketing agency<\/strong> and do not provide marketing,\r\n            advertising, SEO campaigns, or lead generation services. Our service is\r\n            focused on building high performing websites and online stores.\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n\r\n<!-- FAQ Item -->\r\n<div class=\"faq-item reveal\">\r\n    <button class=\"faq-q\">\r\n        Must Read Before Contacting Us\r\n        <span class=\"plus\"><\/span>\r\n    <\/button>\r\n\r\n    <div class=\"faq-a\">\r\n        <div class=\"faq-a-inner\">\r\n            <ul>\r\n                <li>\r\n                    We provide website design and development services for businesses\r\n                    across different industries.\r\n                <\/li>\r\n\r\n                <li>\r\n                    We are not a marketing agency. Please do not use our enquiry form\r\n                    if you are looking specifically for marketing, advertising,\r\n                    SEO, or lead generation services.\r\n                <\/li>\r\n\r\n                <li>\r\n                    Our package prices are final. We do not offer price negotiations\r\n                    or additional discounts after an enquiry is submitted.\r\n                <\/li>\r\n\r\n                <li>\r\n                    Please read our\r\n                    <a class=\"highlight\" href=\"#\" target=\"_blank\" rel=\"noopener\">\r\n                        Website Buyer\u2019s Guide\r\n                    <\/a>\r\n                    before contacting us.\r\n                <\/li>\r\n\r\n                <li>\r\n                    For general questions, please check our FAQs, Buyer\u2019s Guide,\r\n                    or use our live chat before submitting an enquiry.\r\n                <\/li>\r\n\r\n                <li>\r\n                    Our enquiry form is intended for serious buyers who have reviewed\r\n                    our services and are ready to start their project.\r\n                <\/li>\r\n            <\/ul>\r\n\r\n            Thank you for taking the time to review the information before contacting us.\r\n            It helps us give serious project enquiries the attention they deserve.\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    Do you offer payment plans?\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Yes. We take 50% or 25% advance to start the project .Please <a\r\n                            href=\"https:\/\/nuevell.com\/pk\/website-buyers-guide\/\" class=\"highlight\">\r\n                            Read more in Our Buyer's Guide written specifically for you\r\n                        <\/a>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    How can I get started?\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Choose the package that suits your business and submit our project enquiry form.\r\n                        We will review your requirements and guide you through the next steps.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    Do you provide domain and hosting?\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Yes. Domain and hosting are included for the first year with your website project.\r\n                        After the first year, you only pay the renewal cost if you want to continue the service.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    What is your website design process?\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Our process includes planning, design, development, and final review.\r\n                        You can track the project, share feedback, and review progress throughout the process.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    Can I talk to someone before starting?\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Absolutely. You can contact us through live chat or book a 15 minute discovery call.\r\n                        We can discuss your business, website requirements, and goals before you decide.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n\r\n            <!-- FAQ Item -->\r\n            <div class=\"faq-item reveal\">\r\n                <button class=\"faq-q\">\r\n                    I have another question.\r\n                    <span class=\"plus\"><\/span>\r\n                <\/button>\r\n\r\n                <div class=\"faq-a\">\r\n                    <div class=\"faq-a-inner\">\r\n                        Sure Please. Read Our <a href=\"https:\/\/nuevell.com\/pk\/website-buyers-guide\/\" class=\"highlight\">\r\n                            Buyer's Guide\r\n                        <\/a> or Send us your question through live chat or our project enquiry form.\r\n                        We will get back to you and help you find the right solution.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n\r\n\r\n\r\n<\/body>\r\n\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ce9deb7 e-con-full e-flex e-con e-parent\" data-id=\"ce9deb7\" data-element_type=\"container\" data-e-type=\"container\" id=\"contact\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-65bb681 e-con-full e-flex e-con e-child\" data-id=\"65bb681\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f4799c9 mono elementor-widget elementor-widget-heading\" data-id=\"f4799c9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<span class=\"elementor-heading-title elementor-size-default\">Grow Your Business Online<\/span>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ce138ee elementor-widget elementor-widget-heading\" data-id=\"ce138ee\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Get a Professional Website or eCommerce Store for your business.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-350645f elementor-widget-tablet__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"350645f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p><strong style=\"color:#00B77F;\">Only 5 Slots Left!<\/strong> Get <strong style=\"color:#00B77F;\">up to 30% OFF<\/strong>. Hurry Up, grab your slot before they&#8217;re gone!<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9fb0247 e-con-full e-flex e-con e-child\" data-id=\"9fb0247\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-04fad4f e-con-full e-flex e-con e-child\" data-id=\"04fad4f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-97953bb elementor-widget elementor-widget-image\" data-id=\"97953bb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"648\" height=\"121\" src=\"https:\/\/nuevell.com\/pk\/wp-content\/uploads\/sites\/3\/2026\/08\/trust-nuevell-bagde-01.svg\" class=\"attachment-large size-large wp-image-2032\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-26e56ed e-con-full e-flex e-con e-child\" data-id=\"26e56ed\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-29c3c35 elementor-widget elementor-widget-text-editor\" data-id=\"29c3c35\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Trusted by 236+ Businesses Across Pakistan<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-76cf04a elementor-widget elementor-widget-html\" data-id=\"76cf04a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"nuevell-resource-card\">\r\n    <div class=\"nuevell-resource-wrap\">\r\n        <span class=\"nuevell-resource-eyebrow\">Not Sure What You Need?<\/span>\r\n        <h3 class=\"nuevell-resource-title\">Get Clarity From These Resources<\/h3>\r\n\r\n        <ul class=\"nuevell-resource-list\">\r\n            <li class=\"nuevell-resource-item\">\r\n                <a href=\"https:\/\/nuevell.com\/pk\/#packages\">\r\n                    <div class=\"nuevell-resource-text\">\r\n                        <span class=\"nuevell-resource-label\">See Our Website packages<\/span>\r\n                        <span class=\"nuevell-resource-sub\">See our website packages<\/span>\r\n                    <\/div>\r\n                    <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n            <\/li>\r\n\r\n            <li class=\"nuevell-resource-item\">\r\n                <a href=\"https:\/\/nuevell.com\/pk\/website-buyers-guide\/#simple-process\">\r\n                    <div class=\"nuevell-resource-text\">\r\n                        <span class=\"nuevell-resource-label\">know about our process<\/span>\r\n                        <span class=\"nuevell-resource-sub\">Read our website buyer's guide<\/span>\r\n                    <\/div>\r\n                    <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n            <\/li>\r\n\r\n            <li class=\"nuevell-resource-item\">\r\n                <a href=\"https:\/\/nuevell.com\/pk\/case-study\/\">\r\n                    <div class=\"nuevell-resource-text\">\r\n                        <span class=\"nuevell-resource-label\">See Quality of our work?<\/span>\r\n                        <span class=\"nuevell-resource-sub\">Read our Featured case study<\/span>\r\n                    <\/div>\r\n                    <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n            <\/li>\r\n\r\n            <li class=\"nuevell-resource-item\">\r\n                <a href=\"https:\/\/nuevell.com\/pk\/#testimonials\">\r\n                    <div class=\"nuevell-resource-text\">\r\n                        <span class=\"nuevell-resource-label\">Hear from our clients<\/span>\r\n                        <span class=\"nuevell-resource-sub\">Read client testimonials<\/span>\r\n                    <\/div>\r\n                    <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n            <\/li>\r\n\r\n\r\n        <\/ul>\r\n    <\/div>\r\n<\/section>\r\n\r\n<style>\r\n.nuevell-resource-card {\r\n\r\n    max-width: 900px;\r\n    margin: 10px auto;\r\n    border-radius: 12px;\r\n}\r\n\r\n.nuevell-resource-wrap {\r\n    max-width: 900px;\r\n    margin: 0 auto;\r\n}\r\n\r\n.nuevell-resource-eyebrow {\r\n    font-size: 12px;\r\n    font-weight: 600;\r\n    letter-spacing: 0.04em;\r\n    text-transform: uppercase;\r\n    color: #8A8A85;\r\n}\r\n\r\n.nuevell-resource-title {\r\n    font-size: 15px;\r\n    font-weight: 600;\r\n    color: #1C1C1A;\r\n    margin: 8px 0 28px;\r\n}\r\n\r\n.nuevell-resource-list {\r\n    list-style: none;\r\n    margin: 0;\r\n    padding: 0;\r\n    border-top: 1px solid #E5E5E1;\r\n}\r\n\r\n.nuevell-resource-item {\r\n    border-bottom: 1px solid #E5E5E1;\r\n    background: white;\r\n}\r\n\r\n.nuevell-resource-item a,\r\n.nuevell-resource-item button {\r\n    all: unset;\r\n    box-sizing: border-box;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    width: 100%;\r\n    padding: 18px 4px;\r\n    cursor: pointer;\r\n    transition: padding-left 0.15s ease, color 0.15s ease;\r\n}\r\n\r\n.nuevell-resource-item a:hover,\r\n.nuevell-resource-item button:hover {\r\n    padding-left: 8px;\r\n    color: #000000;\r\n}\r\n\r\n.nuevell-resource-item a:hover i,\r\n.nuevell-resource-item button:hover i {\r\n    color: #000000;\r\n}\r\n\r\n.nuevell-resource-text {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 2px;\r\n}\r\n\r\n.nuevell-resource-label {\r\n    font-size: 14px;\r\n    font-weight: 500;\r\n    color: #1C1C1A;\r\n}\r\n\r\n.nuevell-resource-sub {\r\n    font-size: 12px;\r\n    color: #8A8A85;\r\n}\r\n\r\n.nuevell-resource-item i {\r\n    font-size: 13px;\r\n    color: #B5B5AF;\r\n    flex-shrink: 0;\r\n    margin-left: 12px;\r\n}\r\n\r\n\r\n@media (max-width: 768px) {\r\n    .nuevell-resource-item {\r\n        border: 1px solid #E5E5E1;\r\n        border-top: none;\r\n        padding: 0px 15px !important;\r\n    }\r\n}\r\n\r\n\/* Desktop: 2-column grid *\/\r\n@media (min-width: 768px) {\r\n    .nuevell-resource-list {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        border-top: none;\r\n       \r\n    }\r\n\r\n    .nuevell-resource-item {\r\n        border: 1px solid #E5E5E1;\r\n        border-top: none;\r\n        padding: 0px 15px !important;\r\n    }\r\n\r\n    .nuevell-resource-item:nth-child(-n+2) {\r\n        border-top: 1px solid #E5E5E1;\r\n    }\r\n\r\n    .nuevell-resource-item:nth-child(odd) {\r\n        border-right: none;\r\n    }\r\n\r\n    .nuevell-resource-item a,\r\n    .nuevell-resource-item button {\r\n        padding: 20px 18px;\r\n    }\r\n\r\n    .nuevell-resource-item a:hover,\r\n    .nuevell-resource-item button:hover {\r\n        padding-left: 22px;\r\n    }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c92ab48 e-con-full e-flex e-con e-child\" data-id=\"c92ab48\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-950ca08 elementor-widget elementor-widget-html\" data-id=\"950ca08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n    .fluent_form_12 {\n    background: unset !important;\n    border: unset !important;\n    border-radius: unset !important;\n    padding: unset !important;\n    box-shadow: unset !important;\n    max-width: unset !important;\n    margin: unset !important;\n    font-family: \"Inter\", sans-serif !important;\n}\n\n<\/style>\n<div class=\"nuvell_discount_offer_wrap\">\n\n   \n\n    <div class=\"nuvell_discount_offer_content\">\n\n\n        <div id=\"main-heading-sale\">\n\n             <div class=\"nuvell_discount_offer_flag\">\n        <svg viewBox=\"0 0 900 600\" aria-label=\"Pakistan flag\">\n            <rect width=\"900\" height=\"600\" fill=\"#01411C\"\/>\n            <rect width=\"225\" height=\"600\" fill=\"#fff\"\/>\n            <path fill=\"#fff\" d=\"M610 145a165 165 0 1 0 0 310 145 145 0 1 1 0-310z\"\/>\n            <path fill=\"#fff\" d=\"M655 155l18 57 60-4-47 38 17 58-48-34-49 35 19-57-47-39 60 4z\"\/>\n        <\/svg>\n        \n    <\/div>\n        <span class=\"nuvell_discount_offer_badge\">\n            AZAADI SALE\n        <\/span>\n        <\/div>\n    \n\n        <h3 class=\"nuvell_discount_offer_title\">\n            30% Discount on All Packages\n        <\/h3>\n\n        <div class=\"nuvell_discount_offer_timer\">\n\n            <div class=\"nuvell_discount_offer_time\">\n                <strong id=\"nuvell_discount_offer_days\">30<\/strong>\n                <span>Days<\/span>\n            <\/div>\n\n            <div class=\"nuvell_discount_offer_colon\">:<\/div>\n\n            <div class=\"nuvell_discount_offer_time\">\n                <strong id=\"nuvell_discount_offer_hours\">00<\/strong>\n                <span>Hours<\/span>\n            <\/div>\n\n            <div class=\"nuvell_discount_offer_colon\">:<\/div>\n\n            <div class=\"nuvell_discount_offer_time\">\n                <strong id=\"nuvell_discount_offer_minutes\">00<\/strong>\n                <span>Min<\/span>\n            <\/div>\n\n            <div class=\"nuvell_discount_offer_colon\">:<\/div>\n\n            <div class=\"nuvell_discount_offer_time\">\n                <strong id=\"nuvell_discount_offer_seconds\">00<\/strong>\n                <span>Sec<\/span>\n            <\/div>\n\n        <\/div>\n\n        <div class=\"nuvell_discount_offer_ending\">\n           Azaadi Discount Offer Ending Soon (Offer Extended)\n        <\/div>\n\n    <\/div>\n\n<\/div>\n\n\n<style>\n\n.nuvell_discount_offer_wrap {\n    width: 100%;\n    max-width: 760px;\n    margin: 20px auto;\n    padding: 18px 22px;\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    gap: 14px;\n    background: #fff;\n    border: 1px solid rgba(1, 65, 28, 0.12);\n    border-radius: 15px;\n    box-shadow: 0 8px 25px rgba(0,0,0,.06);\n    font-family: inherit;\n}\n\n.nuvell_discount_offer_content{\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    align-content: center;\n    gap: 8px;\n}\n\n.nuvell_discount_offer_flag {\n    width: 32px;\n    min-width: 32px;\n    height: 22px;\n    overflow: hidden;\n}\n\n.nuvell_discount_offer_flag svg {\n    width: 100%;\n    height: 100%;\n    display: block;\n}\n\n.nuvell_discount_offer_content {\n    flex: 1;\n    min-width: 0;\n}\n\n.nuvell_discount_offer_badge {\n    display: block;\n    font-size: 9px;\n    font-weight: 800;\n    letter-spacing: 1px;\n    color: #01411C;\n    line-height: 1.5;\n}\n\n.nuvell_discount_offer_title {\n    margin: 0;\n    font-size: 19px;\n    line-height: 1.25;\n    font-weight: 800;\n    color: #151515;\n}\n\n.nuvell_discount_offer_subtitle {\n    margin: 5px 0 12px;\n    font-size: 12px;\n    line-height: 1.4;\n    color: #707070;\n}\n\n.nuvell_discount_offer_timer {\n    display: flex;\n    align-items: center;\n    gap: 5px;\n}\n\n.nuvell_discount_offer_time {\n    min-width: 46px;\n    padding: 6px 5px;\n    text-align: center;\n    border-radius: 7px;\n    background: #f5f8f6;\n}\n\n.nuvell_discount_offer_time strong {\n    display: block;\n    font-size: 17px;\n    line-height: 1;\n    font-weight: 800;\n    color: #01411C;\n    font-variant-numeric: tabular-nums;\n}\n\n.nuvell_discount_offer_time span {\n    display: block;\n    margin-top: 3px;\n    font-size: 8px;\n    text-transform: uppercase;\n    letter-spacing: .5px;\n    color: #777;\n}\n\n.nuvell_discount_offer_colon {\n    font-weight: 700;\n    color: #01411C;\n    opacity: .5;\n}\n\n.nuvell_discount_offer_ending {\n    margin-top: 7px;\n    font-size: 10px;\n    color: #777;\n}\n\n#main-heading-sale{\n    display: flex;\nflex-direction: row;\ngap: 10px;\nalign-items: center;\nline-height: 1.5;\nmargin-bottom: 10px;\n\n}\n@media (max-width: 600px) {\n\n    .nuvell_discount_offer_wrap {\n        padding: 15px;\n        gap: 10px;\n    }\n\n    .nuvell_discount_offer_flag {\n        width: 28px;\n        min-width: 28px;\n        height: 19px;\n    }\n\n    .nuvell_discount_offer_title {\n        font-size: 16px;\n    }\n\n    .nuvell_discount_offer_subtitle {\n        font-size: 11px;\n    }\n\n    .nuvell_discount_offer_time {\n        min-width: 39px;\n        padding: 6px 3px;\n    }\n\n    .nuvell_discount_offer_time strong {\n        font-size: 15px;\n    }\n\n}\n\n<\/style>\n\n\n<script>\n(function () {\n\n    \/*\n     * ==========================================\n     * NUVELL DISCOUNT COUNTDOWN\n     * ==========================================\n     *\n     * Set ONE fixed ending date and time.\n     *\n     * Format:\n     * YYYY-MM-DDTHH:MM:SS+05:00\n     *\n     * Example:\n     * 18 August 2026 at 12:00 PM Pakistan time\n     *\/\n    const NUVELL_DISCOUNT_TARGET_DATE = \"2026-08-23T12:00:00+05:00\";\n\n\n    \/*\n     * ==========================================\n     * GET COUNTDOWN ELEMENTS\n     * ==========================================\n     *\/\n    const nuvell_days = document.getElementById(\n        \"nuvell_discount_offer_days\"\n    );\n\n    const nuvell_hours = document.getElementById(\n        \"nuvell_discount_offer_hours\"\n    );\n\n    const nuvell_minutes = document.getElementById(\n        \"nuvell_discount_offer_minutes\"\n    );\n\n    const nuvell_seconds = document.getElementById(\n        \"nuvell_discount_offer_seconds\"\n    );\n\n    const nuvell_ending = document.querySelector(\n        \".nuvell_discount_offer_ending\"\n    );\n\n\n    \/*\n     * Stop safely if the countdown HTML\n     * does not exist on this page.\n     *\/\n    if (\n        !nuvell_days ||\n        !nuvell_hours ||\n        !nuvell_minutes ||\n        !nuvell_seconds\n    ) {\n        return;\n    }\n\n\n    \/*\n     * ==========================================\n     * FIXED END TIME\n     * ==========================================\n     *\/\n    const nuvell_discount_offer_end =\n        new Date(NUVELL_DISCOUNT_TARGET_DATE).getTime();\n\n\n    \/*\n     * Check that the date is valid.\n     *\/\n    if (Number.isNaN(nuvell_discount_offer_end)) {\n        console.error(\n            \"Nuvell discount countdown: Invalid target date.\"\n        );\n\n        return;\n    }\n\n\n    \/*\n     * ==========================================\n     * UPDATE COUNTDOWN\n     * ==========================================\n     *\/\n    function nuvell_discount_offer_update() {\n\n        let remaining =\n            nuvell_discount_offer_end - Date.now();\n\n\n        \/*\n         * Prevent negative values.\n         *\/\n        if (remaining < 0) {\n            remaining = 0;\n        }\n\n\n        const days =\n            Math.floor(remaining \/ 86400000);\n\n\n        const hours =\n            Math.floor(\n                (remaining % 86400000) \/ 3600000\n            );\n\n\n        const minutes =\n            Math.floor(\n                (remaining % 3600000) \/ 60000\n            );\n\n\n        const seconds =\n            Math.floor(\n                (remaining % 60000) \/ 1000\n            );\n\n\n        \/*\n         * Update numbers.\n         *\/\n        nuvell_days.textContent =\n            String(days).padStart(2, \"0\");\n\n        nuvell_hours.textContent =\n            String(hours).padStart(2, \"0\");\n\n        nuvell_minutes.textContent =\n            String(minutes).padStart(2, \"0\");\n\n        nuvell_seconds.textContent =\n            String(seconds).padStart(2, \"0\");\n\n\n        \/*\n         * ==========================================\n         * SALE ENDED\n         * ==========================================\n         *\/\n        if (remaining === 0) {\n\n            if (nuvell_ending) {\n                nuvell_ending.textContent = \"Sale ended\";\n            }\n\n            clearInterval(\n                nuvell_discount_offer_interval\n            );\n        }\n    }\n\n\n    \/*\n     * Run immediately.\n     *\/\n    nuvell_discount_offer_update();\n\n\n    \/*\n     * Update every second.\n     *\/\n    const nuvell_discount_offer_interval =\n        setInterval(\n            nuvell_discount_offer_update,\n            1000\n        );\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-864c9e5 fluentform-widget-submit-button-center fluentform-widget-submit-button-custom elementor-widget elementor-widget-elementskit-fluent-forms\" data-id=\"864c9e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elementskit-fluent-forms.default\">\n\t\t\t\t\t<div class=\"ekit-wid-con\">\n            <div class=\"fluentform-widget-wrapper fluentform-widget-custom-radio-checkbox fluentform-widget-align-default\">\n\n                \n                <div class='fluentform ff-default fluentform_wrapper_12 ffs_default_wrap'><form data-form_id=\"12\" id=\"fluentform_12\" class=\"frm-fluent-form fluent_form_12 ff-el-form-top ff_form_instance_12_1 ff-form-loading ffs_default\" data-form_instance=\"ff_form_instance_12_1\" method=\"POST\" ><fieldset  style=\"border: none!important;margin: 0!important;padding: 0!important;background-color: transparent!important;box-shadow: none!important;outline: none!important; min-inline-size: 100%;\">\n                    <legend class=\"ff_screen_reader_title\" style=\"display: block; margin: 0!important;padding: 0!important;height: 0!important;text-indent: -999999px;width: 0!important;overflow:hidden;\">Interested Architects<\/legend>        <div\n                style=\"display: none!important; position: absolute!important; transform: translateX(1000%)!important;\"\n                class=\"ff-el-group ff-hpsf-container\"\n        >\n            <div class=\"ff-el-input--label asterisk-right\">\n                <label for=\"ff_12_item_sf\" aria-label=\"Newsletter\">\n                    Newsletter                <\/label>\n            <\/div>\n            <div class=\"ff-el-input--content\">\n                <input type=\"text\"\n                       name=\"item_12__fluent_sf\"\n                       class=\"ff-el-form-control\"\n                       id=\"ff_12_item_sf\"\n                \/>\n            <\/div>\n        <\/div>\n        <input type='hidden' name='__fluent_form_embded_post_id' value='2793' \/><input type=\"hidden\" id=\"_fluentform_12_fluentformnonce\" name=\"_fluentform_12_fluentformnonce\" value=\"e26ca4343f\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/pk\/wp-json\/wp\/v2\/pages\/2793\" \/><div data-type=\"name-element\" data-name=\"lead_name\" class=\" ff-field_container ff-name-field-wrapper\" ><div class='ff-t-container'><div class='ff-t-cell '><div class='ff-el-group ff-el-form-top'><div class=\"ff-el-input--label ff-el-is-required asterisk-right\"><label for='ff_12_lead_name_first_name_' id='label_ff_12_lead_name_first_name_' >Name<\/label><\/div><div class='ff-el-input--content'><input type=\"text\" name=\"lead_name[first_name]\" id=\"ff_12_lead_name_first_name_\" class=\"ff-el-form-control\" placeholder=\"Your Name\" aria-invalid=\"false\" aria-required=true><\/div><\/div><\/div><\/div><\/div><div class='ff-el-group ff-el-form-top'><div class=\"ff-el-input--label ff-el-is-required asterisk-right\"><label for='ff_12_lead_email' id='label_ff_12_lead_email' aria-label=\"Email\">Email<\/label><\/div><div class='ff-el-input--content'><input type=\"email\" name=\"lead_email\" id=\"ff_12_lead_email\" class=\"ff-el-form-control\" placeholder=\"Your Email Address\" data-name=\"lead_email\"  aria-invalid=\"false\" aria-required=true><\/div><\/div><div class='ff-el-group ff_list_inline'><div class=\"ff-el-input--label ff-el-is-required asterisk-right\"><label   aria-label=\"Which package are you interested in?\">Which package are you interested in?<\/label><\/div><div class='ff-el-input--content'><div class='ff-el-form-check ff-el-form-check-'><label class='ff-el-form-check-label' for='nuevell_package_de929c024aada19be98fb1c88768d5d2'><input  type=\"radio\" name=\"nuevell_package\" data-name=\"nuevell_package\" class=\"ff-el-form-check-input ff-el-form-check-radio\" value=\"launch\"  id='nuevell_package_de929c024aada19be98fb1c88768d5d2' aria-label='Launch' aria-invalid='false' aria-required=true> <span>Launch<\/span><\/label><\/div><div class='ff-el-form-check ff-el-form-check-'><label class='ff-el-form-check-label' for='nuevell_package_0d8962c3ba50b76fbb648558154790c1'><input  type=\"radio\" name=\"nuevell_package\" data-name=\"nuevell_package\" class=\"ff-el-form-check-input ff-el-form-check-radio\" value=\"growth\"  id='nuevell_package_0d8962c3ba50b76fbb648558154790c1' aria-label='Growth' aria-invalid='false' aria-required=true> <span>Growth<\/span><\/label><\/div><div class='ff-el-form-check ff-el-form-check-'><label class='ff-el-form-check-label' for='nuevell_package_cbbb2fc0d120b93360136f1e8ee31d35'><input  type=\"radio\" name=\"nuevell_package\" data-name=\"nuevell_package\" class=\"ff-el-form-check-input ff-el-form-check-radio\" value=\"scale\"  id='nuevell_package_cbbb2fc0d120b93360136f1e8ee31d35' aria-label='Scale' aria-invalid='false' aria-required=true> <span>Scale<\/span><\/label><\/div><\/div><\/div><div class='ff-el-group ff-text-left ff_submit_btn_wrapper'><button type=\"submit\" class=\"ff-btn ff-btn-submit ff-btn-md ff_btn_style\"  aria-label=\"Get Started\">Get Started<\/button><\/div><\/fieldset><\/form><div id='fluentform_12_errors' class='ff-errors-in-stack ff_form_instance_12_1 ff-form-loading_errors ff_form_instance_12_1_errors'><\/div><\/div>            <script type=\"text\/javascript\">\n                window.fluent_form_ff_form_instance_12_1 = {\"id\":\"12\",\"ajaxUrl\":\"https:\\\/\\\/nuevell.com\\\/pk\\\/wp-admin\\\/admin-ajax.php\",\"settings\":{\"layout\":{\"labelPlacement\":\"top\",\"asteriskPlacement\":\"asterisk-right\",\"helpMessagePlacement\":\"with_label\",\"errorMessagePlacement\":\"inline\",\"cssClassName\":\"\"},\"restrictions\":{\"denyEmptySubmission\":{\"enabled\":false}}},\"form_instance\":\"ff_form_instance_12_1\",\"form_id_selector\":\"fluentform_12\",\"rules\":{\"lead_name[first_name]\":{\"required\":{\"value\":true,\"message\":\"This field is required\",\"global\":true,\"global_message\":\"This field is required\"}},\"lead_name[middle_name]\":{\"required\":{\"value\":false,\"global\":true,\"global_message\":\"This field is required\"}},\"lead_name[last_name]\":{\"required\":{\"value\":false,\"global\":true,\"global_message\":\"This field is required\"}},\"lead_email\":{\"required\":{\"value\":true,\"message\":\"This field is required\",\"global\":true,\"global_message\":\"This field is required\"},\"email\":{\"value\":true,\"message\":\"This field must contain a valid email\",\"global\":true,\"global_message\":\"This field must contain a valid email\"}},\"nuevell_package\":{\"required\":{\"value\":true,\"message\":\"This field is required\",\"global\":true,\"global_message\":\"This field is required\"}}},\"debounce_time\":300,\"file_upload_settings\":[]};\n                            <\/script>\n                        <\/div>\n\n            <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Nuevell Pakistan&#8217;s Leading Web Design Agency for Ambitious Brands Trusted by 236+ Businesses Pakistan&#8217;s Leading Web Design Agency for Ambitious Brands We design high performing websites that build trust, attract ideal clients, and turn more visitors into paying customers, so your business can grow with confidence. Start Your Project View Packages Get More Leads Build [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-2793","page","type-page","status-publish","hentry"],"blocksy_meta":{"page_title_panel":"","has_hero_section":"disabled","fca5fc54bd659027cb117cf3b0d380d8":"","hero_section":"type-1","hero_elements":[{"id":"custom_title","enabled":true,"heading_tag":"h1","title":"Home"},{"id":"custom_description","enabled":true,"description_visibility":{"desktop":true,"tablet":true,"mobile":false}},{"id":"custom_meta","enabled":false,"meta_elements":[{"id":"author","enabled":true,"label":"By","has_author_avatar":"yes","avatar_size":25},{"id":"post_date","enabled":true,"label":"On","date_format_source":"default","date_format":"M j, Y"},{"id":"updated_date","enabled":false,"label":"On","date_format_source":"default","date_format":"M j, Y"},{"id":"categories","enabled":false,"label":"In","style":"simple"},{"id":"comments","enabled":true}],"page_meta_elements":{"joined":true,"articles_count":true,"comments":true}},{"id":"breadcrumbs","enabled":false}],"de2abe0009eb0b8700407ce490e7cc11":"","hero_alignment1":"CT_CSS_SKIP_RULE","hero_margin":40,"hero_alignment2":"center","hero_vertical_alignment":"center","6558c8a7cf503422aef7bb5cb0419c84":"","hero_structure":"narrow","091d153dd309d965cc617e75bd9568bb":"","page_title_bg_type":"featured_image","custom_hero_background":{"attachment_id":null},"parallax":{"desktop":false,"tablet":false,"mobile":false},"2dbada6b4660ae5cac5059061838fe30":"","hero_height":"250px","pageTitleFont":{"family":"Default","variation":"Default","size":"30px","line-height":"CT_CSS_SKIP_RULE","letter-spacing":"CT_CSS_SKIP_RULE","text-transform":"CT_CSS_SKIP_RULE","text-decoration":"CT_CSS_SKIP_RULE"},"pageTitleFontColor":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"pageMetaFont":{"family":"Default","variation":"n6","size":"12px","line-height":"1.3","letter-spacing":"CT_CSS_SKIP_RULE","text-transform":"uppercase","text-decoration":"CT_CSS_SKIP_RULE"},"pageMetaFontColor":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"},"hover":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"page_meta_button_type_font_colors":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"},"hover":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"page_meta_button_type_background_colors":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"},"hover":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"pageExcerptFont":{"family":"Default","variation":"Default","size":"CT_CSS_SKIP_RULE","line-height":"CT_CSS_SKIP_RULE","letter-spacing":"CT_CSS_SKIP_RULE","text-transform":"CT_CSS_SKIP_RULE","text-decoration":"CT_CSS_SKIP_RULE"},"pageExcerptColor":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"breadcrumbsFont":{"family":"Default","variation":"Default","size":"CT_CSS_SKIP_RULE","line-height":"CT_CSS_SKIP_RULE","letter-spacing":"CT_CSS_SKIP_RULE","text-transform":"CT_CSS_SKIP_RULE","text-decoration":"CT_CSS_SKIP_RULE"},"breadcrumbsFontColor":{"default":{"color":"CT_CSS_SKIP_RULEDEFAULT"},"initial":{"color":"CT_CSS_SKIP_RULEDEFAULT"},"hover":{"color":"CT_CSS_SKIP_RULEDEFAULT"}},"pageTitleOverlay":{"background_type":"color","background_pattern":"type-1","background_image":{"attachment_id":null,"x":0,"y":0},"gradient":"linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)","background_repeat":"repeat","background_size":"auto","background_attachment":"scroll","patternColor":{"default":{"color":"#e5e7ea"}},"overlayColor":{"default":{"color":"CT_CSS_SKIP_RULE"}},"backgroundColor":{"default":{"color":"CT_CSS_SKIP_RULE"}}},"pageTitleBackground":{"background_type":"color","background_pattern":"type-1","background_image":{"attachment_id":null,"x":0,"y":0},"gradient":"linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)","background_repeat":"repeat","background_size":"auto","background_attachment":"scroll","patternColor":{"default":{"color":"#e5e7ea"}},"overlayColor":{"default":{"color":"CT_CSS_SKIP_RULE"}},"backgroundColor":{"default":{"color":"var(--theme-palette-color-6)"}}},"pageTitlePadding":{"top":"50px","bottom":"50px","left":"auto","right":"auto","linked":true},"73d0e8f268928ca5c2c9545c665948da":"","page_structure_type":"default","910fe72c27927ac9088f803dc36d1d1a":"","content_style_source":"custom","content_style":"wide","vertical_spacing_source":"custom","content_area_spacing":"none","background":{"background_type":"color","background_pattern":"type-1","background_image":{"attachment_id":null,"x":0,"y":0},"gradient":"linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)","background_repeat":"repeat","background_size":"auto","background_attachment":"scroll","patternColor":{"default":{"color":"#e5e7ea"}},"overlayColor":{"default":{"color":"CT_CSS_SKIP_RULE"}},"backgroundColor":{"default":{"color":"CT_CSS_SKIP_RULE"}}},"content_background":{"background_type":"color","background_pattern":"type-1","background_image":{"attachment_id":null,"x":0,"y":0},"gradient":"linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)","background_repeat":"repeat","background_size":"auto","background_attachment":"scroll","patternColor":{"default":{"color":"#e5e7ea"}},"overlayColor":{"default":{"color":"CT_CSS_SKIP_RULE"}},"backgroundColor":{"default":{"color":"var(--theme-palette-color-8)"}}},"content_boxed_shadow":{"inherit":false,"blur":18,"spread":-6,"v_offset":12,"h_offset":0,"inset":false,"enable":true,"color":{"color":"rgba(34, 56, 101, 0.04)"}},"boxed_content_spacing":{"desktop":{"top":"40px","bottom":"40px","left":"40px","right":"40px","linked":true},"tablet":{"top":"35px","bottom":"35px","left":"35px","right":"35px","linked":true},"mobile":{"top":"20px","bottom":"20px","left":"20px","right":"20px","linked":true}},"content_boxed_radius":{"top":"3px","bottom":"3px","left":"3px","right":"3px","linked":true},"6b8995c6cb0a288b8592ffbd554b1936":"","disable_featured_image":"no","disable_share_box":"no","disable_header":"no","disable_footer":"no","styles_descriptor":{"styles":{"desktop":"[data-prefix=\"single_page\"] [class*=\"ct-container\"] > article[class*=\"post\"] {--has-boxed:var(--false);--has-wide:var(--true);}","tablet":"","mobile":""},"google_fonts":[],"version":8}},"_links":{"self":[{"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/pages\/2793","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/comments?post=2793"}],"version-history":[{"count":26,"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/pages\/2793\/revisions"}],"predecessor-version":[{"id":2903,"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/pages\/2793\/revisions\/2903"}],"wp:attachment":[{"href":"https:\/\/nuevell.com\/pk\/wp-json\/wp\/v2\/media?parent=2793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}