<!doctype html>
<html lang="en" data-beasties-container>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hamza Labbaalli (NAJZ Dev) — Full-Stack, AI &amp; IoT Engineer</title>

    <!--
      Elements marked data-static-seo are the no-JavaScript fallback for crawlers and AI agents.
      <Seo /> (react-helmet-async) removes them once a page mounts and renders its own
      per-route tags, so there are never two conflicting canonicals / descriptions.
    -->
    <meta name="description" content="Moroccan computer engineer building fast websites, web apps, AI/ML and IoT systems for businesses. Fixed scope, fixed price. Rated 5.0★ on Google." data-static-seo>
    <meta name="robots" content="index, follow, max-image-preview:large" data-static-seo>
    <meta name="author" content="Hamza Labbaalli">
    <link rel="canonical" href="https://najz.dev/" data-static-seo>

    <meta property="og:type" content="website" data-static-seo>
    <meta property="og:site_name" content="NAJZ Dev" data-static-seo>
    <meta property="og:title" content="Hamza Labbaalli (NAJZ Dev) — Full-Stack, AI &amp; IoT Engineer" data-static-seo>
    <meta property="og:description" content="Moroccan computer engineer building fast websites, web apps, AI/ML and IoT systems for businesses. Fixed scope, fixed price. Rated 5.0★ on Google." data-static-seo>
    <meta property="og:url" content="https://najz.dev/" data-static-seo>
    <meta property="og:image" content="https://najz.dev/najz.png" data-static-seo>
    <meta property="og:image:alt" content="Hamza Labbaalli, NAJZ Dev" data-static-seo>
    <meta name="twitter:card" content="summary_large_image" data-static-seo>
    <meta name="twitter:title" content="Hamza Labbaalli (NAJZ Dev) — Full-Stack, AI &amp; IoT Engineer" data-static-seo>
    <meta name="twitter:image" content="https://najz.dev/najz.png" data-static-seo>

    <link rel="ard" href="/.well-known/ai-catalog.json" type="application/json">
    <link rel="icon" href="/favicon.png?v=3" type="image/png" sizes="256x256">
    <link rel="icon" href="/najz.ico" sizes="any">
    <link rel="apple-touch-icon" href="/favicon.png?v=3">
    <meta name="theme-color" content="#e8eef7">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <meta name="apple-mobile-web-app-title" content="Najz Desktop">

    <!-- Warm up the only third-party origins the first view needs -->
        

    <!--
      Roboto (hero headline + body text) is self-hosted and preloaded: it is requested in parallel
      with the CSS and is normally ready for the very first paint, so the headline never flashes in
      a fallback font and then reflows. @font-face rules live in src/styles/fonts.css.
    -->
    <link rel="preload" as="font" type="font/woff2" href="/fonts/roboto-latin-400-normal.woff2" crossorigin>
    <link rel="preload" as="font" type="font/woff2" href="/fonts/roboto-latin-700-normal.woff2" crossorigin>

    <!-- Hero planet poster (first frame of the WebGL planet): discovered from the HTML (not from JS), responsive, high priority -->
    <link rel="preload" as="image" type="image/webp" href="/assets/images/header/planet-330.webp" imagesrcset="/assets/images/header/planet-330.webp 330w, /assets/images/header/planet-495.webp 495w, /assets/images/header/planet-660.webp 660w" imagesizes="(max-width: 440px) 76vw, 330px" fetchpriority="high">

    <!--
      Icon fonts + web fonts are NOT render-blocking (media=print swap trick).
      The old setup chained style.css -> @import Google Fonts -> font files before first paint.
      Render-blocking CSS is now a single small bundle emitted by Vite (see src/main.jsx).
    -->

    <script>
      (function () {
        try {
          if (localStorage.getItem('najz-theme') === 'dark') {
            document.documentElement.classList.add('dark');
          }
        } catch (e) {}
        // The static hero below is a copy of the HOME hero only. On any other route, hide it before
        // it can paint so /services, /blog, ... never flash the home hero while their JS loads.
        // Scoped to [data-shell] (React's own markup doesn't have it), so client-side navigation
        // back to "/" is unaffected.
        // Visitors who explicitly picked a language (LanguageSwitcher stores it) land on it directly,
        // before first paint: no flash of English. Crawlers have no storage, so they always get the
        // URL they asked for. Keep this list in sync with LOCALIZED_PATHS in src/i18n/config.js
        // (scripts/prerender-locales.mjs fails the build if they drift apart).
        var LOCALIZED = ['/', '/services', '/blog', '/payment', '/legal', '/privacy-policy', '/terms', '/cookie-policy', '/refund-policy', '/disclaimer', '/accessibility'];
        var path = location.pathname.replace(/\/+$/, '') || '/';
        try {
          var pref = localStorage.getItem('najz-lang');
          if ((pref === 'fr' || pref === 'es' || pref === 'ar') && LOCALIZED.indexOf(path) !== -1) {
            location.replace('/' + pref + (path === '/' ? '' : path) + '/' + location.search + location.hash);
            return;
          }
        } catch (e) {}
        // The static hero below is a copy of the HOME hero only (in the page's language). On any other
        // route, hide it before it can paint so /services, /blog, ... never flash the home hero while
        // their JS loads. Scoped to [data-shell] (React's own markup doesn't have it), so client-side
        // navigation back to the home page is unaffected.
        if (!/^\/((fr|es|ar)\/?)?$/.test(location.pathname)) {
          var hide = document.createElement('style');
          hide.textContent = '[data-shell]{display:none!important}';
          document.head.appendChild(hide);
        }
      })();
    </script>

    <!--
      Structured data lives in the static HTML so non-JS crawlers and agentic browsers
      can read who Hamza is and what he does without executing the app.
    -->
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "Person",
        "@id": "https://najz.dev/#person",
        "name": "Hamza Labbaalli",
        "alternateName": ["NAJZ Dev", "Hamza LABBAALLI", "حمزة لباعلي"],
        "url": "https://najz.dev/",
        "image": "https://najz.dev/face.png",
        "jobTitle": "Computer Engineer, IoT & Full Stack Developer",
        "description": "Computer Engineer and Full Stack Developer from Morocco specializing in AI, Machine Learning, IoT, Networking, and Cybersecurity.",
        "nationality": "Moroccan",
        "address": { "@type": "PostalAddress", "addressCountry": "MA" },
        "email": "mailto:contact@najz.dev",
        "contactPoint": {
          "@type": "ContactPoint",
          "contactType": "project inquiries",
          "email": "contact@najz.dev",
          "availableLanguage": ["English", "French", "Spanish", "Arabic"]
        },
        "knowsAbout": [
          "Full Stack Web Development",
          "Artificial Intelligence",
          "Machine Learning",
          "Internet of Things (IoT)",
          "Networking",
          "Cybersecurity",
          "Web Applications",
          "Workflow Automation",
          "Technical Consulting",
          "Programming Education",
          "PFE Project Mentoring",
          "React",
          "Node.js"
        ],
        "sameAs": [
          "https://www.linkedin.com/in/najzdev/",
          "https://www.instagram.com/najz.dev/",
          "https://github.com/najzdev",
          "https://leetcode.com/u/najzdev/",
          "https://www.hackerrank.com/profile/najzdev",
          "https://www.chess.com/member/najzai"
        ],
        "worksFor": { "@type": "Organization", "name": "NAJZ Dev", "url": "https://najz.dev/" }
      }
    </script>
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "WebSite",
        "name": "NAJZ Dev",
        "alternateName": ["Hamza Labbaalli", "najz.dev"],
        "url": "https://najz.dev/",
        "author": { "@id": "https://najz.dev/#person" }
      }
    </script>
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "ProfessionalService",
        "@id": "https://najz.dev/#organization",
        "name": "NAJZ Dev",
        "alternateName": "Hamza Labbaalli",
        "url": "https://najz.dev/",
        "logo": "https://najz.dev/najz.png",
        "image": "https://najz.dev/najz.png",
        "description": "Web development, AI/ML, IoT and cybersecurity services for businesses, with fixed scope and fixed price.",
        "email": "contact@najz.dev",
        "areaServed": "Worldwide",
        "address": { "@type": "PostalAddress", "addressCountry": "MA" },
        "founder": { "@id": "https://najz.dev/#person" },
        "sameAs": [
          "https://www.linkedin.com/in/najzdev/",
          "https://www.instagram.com/najz.dev/",
          "https://github.com/najzdev"
        ]
      }
    </script>
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "Service",
        "serviceType": "Web Development & AI/ML Consulting",
        "provider": { "@id": "https://najz.dev/#organization" },
        "areaServed": "Worldwide",
        "url": "https://najz.dev/services",
        "description": "Web development, AI systems, ML projects, IT & tech teaching, and cybersecurity services offered by Hamza Labbaalli (NAJZ Dev)."
      }
    </script>
    <script type="application/ld+json">
      {
        "@context": "https://schema.org",
        "@type": "ProfilePage",
        "@id": "https://najz.dev/#profile",
        "url": "https://najz.dev/",
        "name": "Hamza Labbaalli (NAJZ Dev)",
        "inLanguage": "en",
        "dateModified": "2026-11-13",
        "isPartOf": { "@type": "WebSite", "url": "https://najz.dev/" },
        "mainEntity": { "@id": "https://najz.dev/#person" },
        "about": { "@id": "https://najz.dev/#person" },
        "hasPart": [
          { "@type": "WebPage", "name": "Services", "url": "https://najz.dev/services" },
          { "@type": "WebPage", "name": "Projects", "url": "https://najz.dev/#myprojects" },
          { "@type": "WebPage", "name": "Blog", "url": "https://najz.dev/blog" },
          { "@type": "WebPage", "name": "Resume (PDF)", "url": "https://najz.dev/Hamza_Labbaalli_Resume.pdf" }
        ]
      }
    </script>
    <script type="module" crossorigin src="/assets/index-2isuW1Rd.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/rolldown-runtime-BWaJ3C7D.js">
    <link rel="modulepreload" crossorigin href="/assets/react-vendor-Df4nBbf0.js">
    <link rel="modulepreload" crossorigin href="/assets/chunk-6KYCQHYJ-B5A3b6TU.js">
    <style>:root{--swiper-theme-color:#007aff}:root{--swiper-navigation-size:44px}:is(.swiper-button-prev,.swiper-button-next) svg{object-fit:contain;transform-origin:50%;fill:currentColor;pointer-events:none;width:100%;height:100%}*,:after,:before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;margin:0}h1,h2{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){h2{font-size:2rem}}p{margin-top:0;margin-bottom:1rem}strong{font-weight:bolder}a{color:#0d6efd;text-decoration:underline}a:hover{color:#0a58ca}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}img,svg{vertical-align:middle}.container{width:100%;padding-right:var(--bs-gutter-x,.75rem);padding-left:var(--bs-gutter-x,.75rem);margin-left:auto;margin-right:auto}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}@media (min-width:1400px){.container{max-width:1320px}}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;margin-top:calc(var(--bs-gutter-y) * -1);margin-right:calc(var(--bs-gutter-x) * -.5);margin-left:calc(var(--bs-gutter-x) * -.5);flex-wrap:wrap;display:flex}.row>*{width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y);flex-shrink:0}@media (min-width:992px){.col-lg-8{flex:none;width:66.6667%}.col-lg-12{flex:none;width:100%}}.justify-content-center{justify-content:center!important}.text-center{text-align:center!important}body{color:#6a6972;font-family:Roboto,Lato,sans-serif;font-style:normal;font-weight:400;overflow-x:hidden}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;overflow-x:hidden}img{max-width:100%}a{transition:all .3s ease-out}a,a:focus{-webkit-box-shadow:none;box-shadow:none;outline:none;text-decoration:none}a:focus-visible{border-radius:4px;outline-offset:2px!important;outline:3px solid #9168ae!important}a:focus,a:hover{text-decoration:none}i,span,a{display:inline-block}img,svg{vertical-align:middle}h1,h2{color:#2e2e2e;margin:0;font-family:Poppins,sans-serif;font-weight:700}h1{font-size:48px}h2{font-size:36px}p{color:#6a6972;margin:0;font-size:16px;font-weight:400;line-height:26px}.bg_cover{background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;height:100%}.main-btn{text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;user-select:none;color:#fff;cursor:pointer;z-index:5;background:linear-gradient(90deg,#84559f 0%,#6e4a89 50%,#84559f 100%) 0 0/200%;border:0;border-radius:8px;padding:0 25px;font-size:16px;font-weight:500;line-height:48px;transition:all .4s ease-out;display:inline-block}.main-btn:hover{color:#fff;background-position:100%}@media (max-width:767px){.container{padding-left:20px;padding-right:20px}}.header-hero{z-index:5;background-position:bottom;position:relative}.header-hero-content{padding-top:180px}@media (max-width:767px){.header-hero-content{padding-top:130px}}.header-hero-content .header-sub-title{color:#fff;font-size:38px;font-weight:300}@media (max-width:767px){.header-hero-content .header-sub-title{font-size:24px}}@media only screen and (min-width:576px) and (max-width:767px){.header-hero-content .header-sub-title{font-size:30px}}.header-hero-content .header-title{color:#fff;font-size:38px;font-weight:700}@media (max-width:767px){.header-hero-content .header-title{font-size:24px}}@media only screen and (min-width:576px) and (max-width:767px){.header-hero-content .header-title{font-size:30px}}.google-rating-badge{-webkit-backdrop-filter:blur(6px);color:#fff;background:#ffffff1f;border:1px solid #ffffff59;border-radius:999px;align-items:center;gap:10px;margin-top:18px;padding:9px 18px;font-size:14px;font-weight:600;text-decoration:none;transition:background .25s,transform .25s,border-color .25s;display:inline-flex}.google-rating-badge:hover{color:#fff;background:#fff3;border-color:#ffffff8c;transform:translateY(-1px)}.google-rating-badge:focus-visible{color:#fff;background:#fff3;border-color:#ffffff8c;transform:translateY(-1px)}.google-rating-badge .hero-ico-google{color:#fff;font-size:15px}.google-rating-badge-score{font-weight:700}.google-rating-badge-stars{gap:2px;line-height:1;display:inline-flex}.google-rating-badge-stars .hero-ico{color:#ffc107;font-size:12px}.google-rating-badge-count{opacity:.92;white-space:nowrap;font-weight:500}@media (max-width:480px){.google-rating-badge{text-align:center;flex-wrap:wrap;justify-content:center;padding:8px 14px;font-size:13px}}.header-hero-content .main-btn{margin-top:40px}.header-hero-image{padding-top:45px}.header-hero-image img{max-width:650px}.hero-scroll-down{display:none}.hero-stage{aspect-ratio:400/224;width:100%;position:relative}.hero-planet{aspect-ratio:1;pointer-events:none;width:82.5%;margin-top:-41.25%;position:absolute;top:50%;left:8.75%}.header-hero-image .hero-planet img{width:100%;max-width:none;height:100%;animation:none;display:block;position:absolute;top:0;bottom:0;left:0;right:0}@media (max-width:767px){.header-hero-image img{max-width:100%}.header-hero-image{padding-top:30px}.hero-scroll-down{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;letter-spacing:.14em;text-align:center;text-transform:uppercase;z-index:2;background:#1e1678b8;border:1px solid #ffffff52;border-radius:999px;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:-moz-fit-content;width:fit-content;margin:18px auto 28px;padding:9px 20px 7px;font-size:.7rem;font-weight:700;line-height:1.2;text-decoration:none;transition:background-color .2s,transform .2s;display:flex;position:relative;box-shadow:0 6px 18px #1e167847}.hero-scroll-down span{color:#fff!important}.hero-scroll-down span:last-child{font-size:1.25rem;line-height:1;animation:1.8s ease-in-out infinite heroScrollBob}.hero-scroll-down:hover{background:#361cc1e6;transform:translateY(2px)}.hero-scroll-down:focus-visible{background:#361cc1e6;transform:translateY(2px)}.hero-scroll-down:focus-visible{outline-offset:4px;outline:2px solid #fff}@keyframes heroScrollBob{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}}.header-area a,a{text-decoration:none}.morocco-diamond{background:linear-gradient(90deg,#c1272d 0% 45%,#006233 45% 73%,#c1272d 73% 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 2px #d4af374d);-webkit-background-clip:text;background-clip:text;font-weight:700;text-decoration:none;transition:all .4s ease-in-out;animation:3s ease-in-out infinite diamondPulse;display:inline-block;position:relative}@keyframes diamondPulse{0%,to{filter:drop-shadow(0 0 2px #d4af3766)brightness();transform:scale(1)}50%{filter:drop-shadow(0 0 8px #d4af37cc)drop-shadow(0 0 12px #c1272d66)brightness(1.2);transform:scale(1.02)}}.morocco-diamond:hover{filter:drop-shadow(0 0 10px #d4af37)brightness(1.4);letter-spacing:1px}.header-title{-webkit-font-smoothing:antialiased}:root{--rn-primary:#1b4d3e;--rn-gold:#d4af37;--rn-text:#2d3436;--rn-bg:#fffffffa}.header-hero-image img,.hero-planet{animation:4s ease-in-out infinite smoothFloat;animation-delay:var(--delay-smoothFloat,0s)}@keyframes smoothFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.main-btn{z-index:1;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)!important}.main-btn:hover{letter-spacing:1px;transform:translateY(-5px)scale(1.05);box-shadow:0 10px 20px #9168ae66}.morocco-diamond{transition:color .3s;display:inline-block}.morocco-diamond:hover{transform:skew(-10deg);color:#9168ae!important}:root{--nj-purple:#7c479f;--nj-lavender:#d7d3f3;--nj-black:#000;--nj-glass:#7c479fcf;--nj-border:#7c479f4d;--nj-transition:all .5s cubic-bezier(.77, 0, .175, 1)}@media (max-width:991px){}.cta-services-wrap{isolation:isolate;display:inline-flex;position:relative}.cta-services-wrap:after{display:none}.cta-services{isolation:isolate;letter-spacing:0;z-index:1;align-items:center;gap:9px;font-weight:700;transition:background .2s,border-color .2s,color .2s,transform .2s,box-shadow .2s;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 8px 22px #220f4638;color:#5d3190!important;background:#fff!important;border:1px solid #ffffffbf!important;border-radius:999px!important;padding:13px 20px!important}.cta-services:before{display:none}.cta-services>*{z-index:2;position:relative}.cta-services__icon{font-size:.9rem;line-height:1;display:inline-flex}.cta-services:hover{transform:translateY(-1px);box-shadow:0 11px 26px #220f464d;color:#45206f!important;background:#f3edff!important;border-color:#fff!important}.cta-services:active{transform:translateY(0)}@keyframes ctaShimmer{0%{left:-60%}55%{left:130%}to{left:130%}}@media (prefers-reduced-motion:reduce){.cta-services:before,.cta-services-wrap:after{animation:none;display:none}}@media (max-width:576px){.cta-services:before{width:34%;animation:4.2s linear infinite ctaShimmer;animation-delay:var(--delay-ctaShimmer,0s);display:block}}html,body,#root,#page-content,.header-area{transition:background-color .38s,color .38s,border-color .38s,box-shadow .38s}html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@keyframes heroRise{0%{transform:translateY(18px)}to{transform:translateY(0)}}.hero-rise{animation:.7s cubic-bezier(.16,1,.3,1) both heroRise;animation-delay:var(--delay-heroRise,0s)}.hero-ico{align-items:center;font-style:normal;line-height:1;display:inline-flex}.hero-ico>svg{width:1em;height:1em;display:block}@media (prefers-reduced-motion:reduce){.hero-rise,.header-hero-image img,.hero-planet,.cta-services-wrap:after{animation:none!important}}:root{--rf-ink:#17142e;--rf-sub:#5a5773;--rf-line:#e4e1ef;--rf-line-strong:#cfcae2;--rf-surface:#fff;--rf-field:#faf9fd;--rf-accent:#5d3fc4;--rf-accent-ink:#4b31a6;--rf-tint:#5d3fc414;--rf-tint-line:#5d3fc429;--rf-shadow:0 1px 2px #17142e0d, 0 10px 28px -14px #17142e2e;--rf-shadow-hover:0 2px 4px #17142e0f, 0 18px 36px -16px #3c288c4d}main h2{letter-spacing:-.015em;text-wrap:balance}main h2{color:var(--rf-ink);font-weight:650}main p{text-wrap:pretty}.main-btn:not(.cta-services){background:var(--rf-accent);letter-spacing:.01em;background-size:auto;border-radius:10px;font-weight:600;box-shadow:0 1px 2px #17142e33,0 8px 18px -8px #5d3fc48c}.main-btn:not(.cta-services):hover{background:var(--rf-accent-ink);background-position:0 0;box-shadow:0 1px 2px #17142e33,0 12px 22px -8px #5d3fc499;letter-spacing:.01em!important;transform:translateY(-1px)!important}.main-btn:not(.cta-services):focus-visible{outline:2px solid var(--rf-accent);outline-offset:2px}:root{--nz-dot:#5d3fc438;--nz-card-zellij:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 64 64' fill='none' stroke='%235d3fc4' stroke-opacity='.055' stroke-width='.9' stroke-linejoin='round'%3E%3Cpath d='M18 18h28v28H18zM32 12.2L51.8 32 32 51.8 12.2 32z'/%3E%3Cpath d='M24 24h16v16H24z' stroke-width='.6'/%3E%3Ccircle cx='32' cy='32' r='2.4'/%3E%3Cpath d='M46 18L60 4M18 18L4 4M18 46L4 60M46 46L60 60M32 0v12.2M32 51.8V64M0 32h12.2M51.8 32H64'/%3E%3C/svg%3E");--nz-card-zellij-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 64 64' fill='none' stroke='%23fff' stroke-opacity='.045' stroke-width='.9' stroke-linejoin='round'%3E%3Cpath d='M18 18h28v28H18zM32 12.2L51.8 32 32 51.8 12.2 32z'/%3E%3Cpath d='M24 24h16v16H24z' stroke-width='.6'/%3E%3Ccircle cx='32' cy='32' r='2.4'/%3E%3Cpath d='M46 18L60 4M18 18L4 4M18 46L4 60M46 46L60 60M32 0v12.2M32 51.8V64M0 32h12.2M51.8 32H64'/%3E%3C/svg%3E");--nz-gutter:2.75rem;--nz-nav:38px}@media (min-width:992px){:root{--nz-gutter:3.6rem;--nz-nav:44px}}:root{--nav-offset:104px}@media (max-width:991px){:root{--nav-offset:84px}}:root{--pr-bg:#fbfbfd;--pr-surface:#fff;--pr-surface-2:#f4f2fb;--pr-line:#1d1d1f17;--pr-text:#1d1d1f;--pr-sub:#5f6370;--pr-accent:#6f42c1;--pr-accent-soft:#6f42c11a;--pr-shadow:0 1px 2px #1410280d, 0 8px 24px -12px #14102829;--pr-shadow-hover:0 2px 4px #1410280f, 0 22px 40px -18px #5d3fc459}@keyframes navFadeIn{0%{opacity:0}}@keyframes pointToToggleRight{0%,80%,to{opacity:0;transform:translate(10px)}85%,95%{opacity:1;transform:translate(0)}}@keyframes visualVibrate{0%,85%,to{transform:rotate(0)}87%{transform:rotate(-10deg)}89%{transform:rotate(10deg)}91%{transform:rotate(-10deg)}93%{transform:rotate(10deg)}}@keyframes shine{0%{left:-75%}60%{left:125%}to{left:125%}}@keyframes fadeInDelay{to{opacity:1}}#particles-1{z-index:-1;width:100%;height:100%;position:absolute;top:0;left:0}.whatsapp-btn{z-index:9999;cursor:pointer;opacity:0;background-color:#25d366;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;animation:.6s ease-in-out 1.5s forwards fadeInDelay;display:flex;position:fixed;bottom:20px;right:20px;overflow:hidden;box-shadow:0 4px 12px #0006}@media (max-width:768px){.whatsapp-btn{width:45px;height:45px;bottom:16px;right:16px}}.whatsapp-btn:before{content:"";background:linear-gradient(120deg,#ffffff1a 0%,#fff6 50%,#ffffff1a 100%);width:50%;height:100%;animation:4s ease-in-out 3s infinite shine;position:absolute;top:0;left:-75%;transform:skew(-20deg)}.whatsapp-btn a{color:#fff;z-index:1;justify-content:center;align-items:center;font-size:24px;line-height:0;text-decoration:none;display:flex}@media (max-width:991px){.desktop-nav{display:none!important}.mobile-island{background:var(--nj-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--nj-border);z-index:999999;touch-action:manipulation;border-radius:50px;width:55px;height:55px;padding:0;transition:all .5s cubic-bezier(.68,-.55,.265,1.35);position:fixed;top:20px;left:auto;right:15px;overflow:visible;transform:none;box-shadow:0 20px 50px #000c}.mobile-island.skinny{border-radius:30px;width:45px;height:auto;max-height:90vh;padding:15px 0;overflow-y:auto}.mobile-island.expanded{border-color:var(--nj-purple);border-radius:20px;width:180px;height:auto;max-height:90vh;padding:15px 0;overflow-y:auto;box-shadow:0 20px 60px #7c479f4d}.island-inner{flex-direction:column;align-items:center;height:100%;display:flex}.island-close-btn{width:30px;height:30px;color:var(--nj-lavender);cursor:pointer;z-index:3;background:#00000061;border:1px solid #d7d3f373;border-radius:999px;justify-content:center;align-items:center;font-size:18px;line-height:1;display:inline-flex;position:absolute;top:6px;right:6px}.island-close-btn:hover{border-color:var(--nj-purple);color:#fff}.island-logo{cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;width:55px;height:55px;transition:transform .3s;animation:5s ease-in-out infinite visualVibrate;display:flex;position:relative}.mobile-island.skinny .island-logo,.mobile-island.expanded .island-logo{width:100%;height:50px;animation:none}.island-logo img{drop-shadow:0 0 8px #7c479f80;width:26px;filter:brightness(0)invert()!important}.merged-toggle-icon{color:var(--nj-lavender);background:#00000080;border-radius:50%;padding:2px;font-size:12px;position:absolute;bottom:8px;right:8px}.mobile-island.skinny .merged-toggle-icon,.mobile-island.expanded .merged-toggle-icon{display:none}.hint-arrows{color:var(--nj-lavender);opacity:0;gap:-5px;font-size:20px;animation:5s ease-in-out infinite pointToToggleRight;display:flex;position:absolute;top:28px;left:auto;right:65px}.island-menu{opacity:0;visibility:hidden;flex-direction:column;gap:15px;width:100%;max-height:calc(90vh - 80px);margin-top:10px;padding-right:5px;transition:opacity .3s;display:flex;overflow-y:auto}.mobile-island.skinny .island-menu,.mobile-island.expanded .island-menu{opacity:1;visibility:visible}.nav-item{align-items:center;width:100%;text-decoration:none;transition:all .3s;display:flex;color:#fff!important}.mobile-island.skinny .nav-item{justify-content:center;padding:8px 0}.mobile-island.expanded .nav-item{justify-content:flex-start;padding:8px 18px}.nav-item i{min-width:24px;font-size:22px;transition:transform .3s}.nav-label{opacity:0;white-space:nowrap;max-width:0;color:var(--nj-lavender);margin-left:0;font-weight:500;transition:all .4s cubic-bezier(.175,.885,.32,1.275);overflow:hidden}.mobile-island.expanded .nav-label{opacity:1;max-width:100px;margin-left:12px}}@media (min-width:992px){.mobile-island{display:none!important}.desktop-nav{background:var(--nj-lavender);-webkit-backdrop-filter:blur(10px);z-index:99999;border:1px solid #ffffff1a;border-radius:50px;justify-content:space-between;align-items:center;width:90%;max-width:1100px;padding:15px 45px;transition:all .5s cubic-bezier(.4,0,.2,1);position:fixed;top:25px;left:50%;transform:translate(-50%);display:flex!important}.desktop-nav.sticky{border-color:var(--nj-purple);background:#000000d1;width:75%;max-width:900px;padding:10px 35px;top:15px;box-shadow:0 15px 35px #0006}.d-nav-list{align-items:center;gap:35px;margin:0;padding:0;list-style:none;transition:gap .4s;display:flex!important}.desktop-nav.sticky .d-nav-list{gap:25px}.d-nav-link{color:#5b2f7a;opacity:1;font-size:15px;font-weight:500;text-decoration:none;transition:all .3s;position:relative}.desktop-nav.sticky .d-nav-link{color:#f3f4f6}.desktop-nav .d-nav-link[aria-current=page],.desktop-nav .d-nav-link[aria-current=location]{font-weight:700;color:#fff!important}.desktop-nav .d-nav-link[aria-current=page]:after,.desktop-nav .d-nav-link[aria-current=location]:after{width:100%}.desktop-nav .lang-switch__btn{color:#5b2f7a;border-color:#5b2f7a59}.desktop-nav.sticky .lang-switch__btn{color:#fff;background:#ffffff1f;border-color:#ffffff6b}.desktop-nav.sticky .lang-switch__btn:hover,.desktop-nav.sticky .lang-switch__btn[aria-expanded=true]{background:#ffffff3d}.d-nav-link:hover,.d-nav-link.active{opacity:1;color:#fff!important}.d-nav-link:after{content:"";background:#fff;border-radius:5px;width:0%;height:2px;transition:width .3s;position:absolute;bottom:-5px;left:0}.desktop-nav.sticky .d-nav-link:after{background:var(--nj-purple);box-shadow:0 0 8px var(--nj-purple)}.d-nav-link:hover:after,.d-nav-link.active:after{width:100%}}.lang-switch{display:inline-block;position:relative}.lang-switch__btn{color:inherit;font:inherit;cursor:pointer;background:0 0;border:1px solid #7f7f7f59;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:.85rem;font-weight:600;line-height:1;display:inline-flex}.lang-switch__btn:hover,.lang-switch__btn[aria-expanded=true]{background:#7f7f7f24}.lang-switch__btn:focus-visible{outline-offset:2px;outline:2px solid #7c3aed}.lang-option:focus-visible{outline-offset:2px;outline:2px solid #7c3aed}.lang-switch__menu{z-index:10050;color:#1b1b24;background:#fff;border:1px solid #0000001a;border-radius:14px;min-width:170px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 8px);box-shadow:0 14px 38px #00000038}.lang-switch__menu:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){right:0}.lang-switch__menu:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){right:0}.lang-switch__menu:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0}.lang-switch__menu:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0}html[data-theme=dark] .lang-switch__menu,body.dark .lang-switch__menu{color:#f2f2f7;background:#17171f;border-color:#ffffff1f}@media (prefers-color-scheme:dark){html:not([data-theme=light]) .lang-switch__menu{color:#f2f2f7;background:#17171f;border-color:#ffffff1f}}.lang-option{color:inherit;border-radius:10px;align-items:center;gap:10px;padding:9px 12px;font-size:.95rem;text-decoration:none;display:flex}.lang-option__flag{background-position:50%;background-repeat:no-repeat;background-size:cover;border:1px solid #ffffff4d;border-radius:3px;flex:0 0 22px;width:22px;height:15px;display:none;overflow:hidden;box-shadow:0 1px 3px #0003}.lang-option__flag--en{background-image:url(/assets/images/flags/en.svg)}.lang-option__flag--fr{background-image:url(/assets/images/flags/fr.svg)}.lang-option__flag--es{background-image:url(/assets/images/flags/es.svg)}.lang-option__flag--ar{background-image:url(/assets/images/flags/ar.svg)}.lang-option:hover{color:inherit;background:#7c3aed1f}.lang-option.is-current{background:#7c3aed29;font-weight:700}.lang-option__code{letter-spacing:.04em;opacity:.7;min-width:26px;font-size:.72rem;font-weight:700;display:inline-block}.lang-inline{flex-wrap:wrap;gap:8px;margin:14px 0;padding:0;list-style:none;display:flex}.lang-inline .lang-option{border:1px solid #7f7f7f59;border-radius:999px;padding:6px 12px;font-size:.85rem}.lang-inline .lang-option__code{display:none}.footer-langs .lang-option{white-space:nowrap;text-align:center}.footer-langs .lang-option[lang=ar]{direction:rtl}.island-lang{justify-content:center;padding:8px 0}.mobile-island .lang-option{color:#fff;border-color:#ffffff47}.mobile-island .lang-option:hover,.mobile-island .lang-option.is-current{color:#fff;background:#ffffff29;border-color:#ffffff8c}@media (max-width:991px){.mobile-island.expanded .lang-option__flag{display:inline-block}.mobile-island.expanded .lang-option>span:last-child{display:none}.mobile-island.expanded .island-lang .lang-option{flex:0 0 44px;min-width:44px}}html[dir=rtl] body,html[dir=rtl] button,html[dir=rtl] input,html[dir=rtl] select,html[dir=rtl] textarea{font-family:Segoe UI,Tahoma,Noto Sans Arabic,Geeza Pro,Droid Arabic Kufi,Roboto,Arial,sans-serif}html[dir=rtl]{letter-spacing:0}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3,html[dir=rtl] h4,html[dir=rtl] h5,html[dir=rtl] h6,html[dir=rtl] p,html[dir=rtl] a,html[dir=rtl] span,html[dir=rtl] label{letter-spacing:0!important}html[dir=rtl] .text-start{text-align:right!important}html[dir=rtl] .cookie-bar{padding:14px 16px 14px 40px;left:auto;right:18px}html[dir=rtl] .cookie-bar-close{left:10px;right:auto}html[dir=rtl] .whatsapp-btn{left:20px;right:auto}html[dir=rtl] .mobile-theme-bubble{left:16px;right:auto}html[dir=rtl] .legal-page__back-btn svg,html[dir=rtl] .payment-page__back-btn svg,html[dir=rtl] .legal-page__back-btn i,html[dir=rtl] .payment-page__back-btn i,html[dir=rtl] .legal-index__item i,html[dir=rtl] .legal-index__item svg{transform:scaleX(-1)}html[dir=rtl] input[type=email],html[dir=rtl] input[type=tel]{text-align:right;direction:ltr}html[dir=rtl] .nz-nav svg{transform:scaleX(-1)}html[dir=rtl] code,html[dir=rtl] .brand-ltr{direction:ltr;unicode-bidi:isolate}.desktop-nav,.mobile-island,.d-nav-link,.theme-toggle-nav{transition:background-color .38s,color .38s,border-color .38s,box-shadow .38s}.theme-toggle-nav{cursor:pointer;background:#ffffff38;border:1px solid #ffffff61;border-radius:999px;justify-content:center;align-items:center;min-width:36px;min-height:36px;padding:0 10px;line-height:1;display:inline-flex;color:#fff!important}.desktop-nav .theme-toggle-nav{padding:0 12px}.theme-toggle-nav:hover{background:#ffffff57}.theme-toggle-nav i{font-size:1.2rem;line-height:1}.dark .desktop-nav,.dark .mobile-island{background:#101622f0!important;border-color:#ffffff1a!important}.dark .theme-toggle-nav{background:#c084fc29;border-color:#c084fc73;color:#f3f4f6!important}.dark .d-nav-link{color:#e8edf7!important}.dark .d-nav-link:after{background:#c084fc!important}.desktop-nav,.mobile-island{animation:.2s ease-out backwards navFadeIn}@media (prefers-reduced-motion:reduce){.desktop-nav,.mobile-island{animation:none!important}}.skip-link{z-index:100000;color:#fff;background:#3b1d63;border-radius:8px;padding:10px 16px;font-weight:600;text-decoration:none;transition:transform .2s;position:fixed;top:8px;left:8px;transform:translateY(-200%)}.skip-link:focus{color:#fff;outline-offset:2px;outline:3px solid #ffc107;transform:translateY(0)}.skip-link:focus-visible{color:#fff;outline-offset:2px;outline:3px solid #ffc107;transform:translateY(0)}.island-logo:focus-visible{outline-offset:3px;outline:3px solid #ffc107}.d-logo{position:relative}.d-logo-link{border-radius:999px;position:absolute;top:-6px;bottom:-6px;left:-6px;right:-6px}@media (max-width:991px){.mobile-island{top:calc(env(safe-area-inset-top,0px) + 16px);right:calc(env(safe-area-inset-right,0px) + 14px);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);-webkit-tap-highlight-color:transparent;overscroll-behavior:contain;box-shadow:0 10px 30px -8px #140c2873,0 0 0 1px #ffffff0f}.mobile-island.expanded{width:min(280px,100vw - 24px);max-height:min(620px,100dvh - 24px);padding:10px 0 12px;box-shadow:0 16px 40px -10px #7c479f80,0 0 0 1px #ffffff14}.island-logo img{filter:brightness(0)invert()drop-shadow(0 0 6px #7c479f8c)!important}.island-logo:active{transform:scale(.93)}.island-logo:focus-visible{outline:2px solid var(--nj-lavender);outline-offset:2px}.nav-item:focus-visible{outline:2px solid var(--nj-lavender);outline-offset:2px}.island-close-btn:focus-visible{outline:2px solid var(--nj-lavender);outline-offset:2px}.island-menu{scrollbar-width:none;gap:2px;max-height:calc(100dvh - 92px);margin-top:6px;padding:0 8px 2px}.island-menu::-webkit-scrollbar{display:none}.nav-item{-webkit-tap-highlight-color:transparent;border-radius:14px;min-height:44px}.mobile-island.skinny .nav-item{justify-content:center;padding:0}.mobile-island.expanded .nav-item{width:100%;margin-inline-start:0;margin-inline-end:0;padding:0 14px}.nav-item:active{background:#ffffff24;transform:scale(.97)}.mobile-island .nav-item[aria-current=page],.mobile-island .nav-item[aria-current=location]{box-shadow:inset 3px 0 0 var(--nj-lavender), 0 0 0 1px #ffffff1a;background:#ffffff2e}.nav-item svg{flex-shrink:0;width:20px;height:20px}.nav-label{letter-spacing:.01em;font-size:.95rem}.mobile-island.expanded .island-lang{border-top:1px solid #ffffff1f;flex-wrap:wrap;gap:6px;width:100%;margin:6px 0 0;padding:8px 6px 2px;display:flex}.mobile-island.skinny .island-lang{display:none}.mobile-island.expanded .island-lang .lang-option{white-space:nowrap;flex:0 0 40px;justify-content:center;min-width:40px;min-height:38px;padding:6px 4px}.mobile-theme-bubble .theme-toggle-nav{background:#7c479f;border:2px solid #ffffffe6;width:45px;min-width:45px;height:45px;min-height:45px;padding:0;display:inline-flex;box-shadow:0 5px 16px #25113a99,0 0 0 3px #7c479f47;color:#fff!important}.mobile-theme-bubble .theme-toggle-nav:hover{background:#663584;box-shadow:0 7px 20px #25113ab3,0 0 0 4px #7c479f59}.mobile-theme-bubble .theme-toggle-nav:focus-visible{background:#663584;box-shadow:0 7px 20px #25113ab3,0 0 0 4px #7c479f59}.island-close-btn{background:#ffffff1a;border-color:#d7d3f359;width:32px;height:32px;transition:background .2s,transform .2s,color .2s;top:8px;right:8px}.island-close-btn:hover,.island-close-btn:active{background:#ffffff38}.island-close-btn:active{transform:scale(.92)}}@media (max-width:991px) and (prefers-reduced-motion:reduce){.island-logo,.hint-arrows{animation:none!important}.mobile-island{transition:none}}</style><link rel="stylesheet" crossorigin href="/assets/index-5KiTVDP6.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" crossorigin href="/assets/index-5KiTVDP6.css"></noscript>
          <link rel="alternate" hreflang="en" href="https://najz.dev/" data-static-seo />
    <link rel="alternate" hreflang="fr" href="https://najz.dev/fr/" data-static-seo />
    <link rel="alternate" hreflang="es" href="https://najz.dev/es/" data-static-seo />
    <link rel="alternate" hreflang="ar" href="https://najz.dev/ar/" data-static-seo />
    <link rel="alternate" hreflang="x-default" href="https://najz.dev/" data-static-seo />
    <meta property="og:locale" content="en_US" data-static-seo />
    <meta property="og:locale:alternate" content="fr_FR" data-static-seo />
    <meta property="og:locale:alternate" content="es_ES" data-static-seo />
    <meta property="og:locale:alternate" content="ar_AR" data-static-seo />
  </head>
  <body>
    <div id="root">
      <!--
        Static first paint (app shell). This is a copy of the <Hero /> markup from
        src/components/home/Hero.jsx. It makes the headline + hero image paint straight from
        the HTML (LCP no longer waits for the JS bundle); React replaces it as soon as it
        mounts. If you change Hero.jsx, mirror the change here to avoid a visual jump.
      -->
      <div id="page-content" data-shell>
        <header class="header-area">
          <div class="bg_cover header-hero" id="home" style="background-image: url(/assets/images/header/banner-bg.svg)">
            <div class="container">
              <div class="row justify-content-center">
                <div class="col-lg-8">
                  <div class="text-center header-hero-content hero-rise">
                    <h1 class="header-sub-title"><strong>Hamza LABBAALLI</strong></h1>
                    <h2 class="header-title">
                      Computer Engineer, IoT &amp; Full Stack Developer from
                      <span class="morocco-diamond">Morocco</span>
                    </h2>
                    <a href="https://www.google.com/search?q=najz+dev&sca_esv=66da6a07b5b0afbb&hl=en-MA&sxsrf=AKL5yDgmDOsswNgUYZLWKD8OmrSBLld9Hw%3A1793893284422&ei=pKPsasOkGa7_7_UPp6aO-Ak&biw=1536&bih=746&oq=najz&gs_lp=Egxnd3Mtd2l6LXNlcnAiBG5hanoqBQgAGIAEMgUQABiABDILEAAYgAQYigUYkQIyBRAAGIAEMgUQABiABDIFEAAYgAQyBRAAGIAEMgUQABiABDIFEAAYgAQyBRAAGIAEMgUQABiABEiZe1Dyb1jAcXACeACQAQCYAXGgAdgBqgEDMC4yuAEByAEA-AEBmAIEoAKVAsICDRAAGIAEGIoFGEMYsAPCAgoQABiABBgNGLADwgIGEAAYBxgewgIHEAAYgAQYDZgDAIgGAZAGCpIHAzIuMqAH3gmyBwMwLjK4B_IBwgcFMi0xLjPIByaACAE&sclient=gws-wiz-serp" target="_blank" rel="noopener noreferrer" class="google-rating-badge">
                      <i class="hero-ico hero-ico-google" aria-hidden="true"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 488 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"/></svg></i>
                      <span class="google-rating-badge-score">5.0</span>
                      <span class="google-rating-badge-stars" aria-hidden="true">
                        <i class="hero-ico"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 576 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"/></svg></i><i class="hero-ico"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 576 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"/></svg></i><i class="hero-ico"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 576 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"/></svg></i><i class="hero-ico"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 576 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"/></svg></i><i class="hero-ico"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 576 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"/></svg></i>
                      </span>
                      <span class="google-rating-badge-count">48 Google reviews</span>
                    </a>
                    <br>
                    <span class="cta-services-wrap">
                      <a class="main-btn cta-services" href="/services">
                        <i class="hero-ico cta-services__icon" aria-hidden="true"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 448 512" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M96 128V96c0-35.3 28.7-64 64-64h128c35.3 0 64 28.7 64 64v32h32c35.3 0 64 28.7 64 64v256c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64h32zm64-32v32h128V96c0-17.7-14.3-32-32-32h-64c-17.7 0-32 14.3-32 32zM64 192v64h320v-64H64zm0 128v128h320V320H64z"/></svg></i>
                        <span>View Services</span>
                      </a>
                    </span>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-lg-12">
                  <div class="text-center header-hero-image" style="max-width: 400px; margin: 0 auto; position: relative; isolation: isolate">
                    <div class="hero-stage">
                      <div class="hero-planet">
                        <img class="hero-planet-poster" src="/assets/images/header/planet-330.webp" srcset="/assets/images/header/planet-330.webp 330w, /assets/images/header/planet-495.webp 495w, /assets/images/header/planet-660.webp 660w" sizes="(max-width: 440px) 76vw, 330px" alt="Hamza Labbaalli, NAJZ Dev: a 3D planet whose land is shaped like the NAJZ logo" width="330" height="330" fetchpriority="high" decoding="async">
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <a class="hero-scroll-down" href="#services" aria-label="Scroll down to services">
                <span>Scroll down</span>
                <span aria-hidden="true">↓</span>
              </a>
            </div>
          </div>
        </header>
      </div>
    </div>

    <!-- Real fallback content for clients that don't run JavaScript. -->
    <noscript>
      <main>
        <section>
          <h2>Services</h2>
          <p>
            Web development, AI systems, ML projects, IT &amp; tech teaching, PFE project support,
            IT consulting, and more. See <a href="/services">/services</a> for pricing and details.
          </p>
        </section>
        <section>
          <h2>Research</h2>
          <p>
            Read <a href="/research">NAJZ Dev research papers</a>, including The Jaggle Effect,
            an interactive paper exploring transient oscillation and damping.
          </p>
        </section>
        <section>
          <h2>Contact</h2>
          <p>
            Email: <a href="mailto:contact@najz.dev">contact@najz.dev</a> &middot; Phone:
            +212 625 259 070 &middot; Based in Morocco.
          </p>
        </section>
      </main>
      <nav aria-label="Site pages">
        <a href="/">Home</a>
        <a href="/services">Services</a>
        <a href="/#myprojects">Projects</a>
        <a href="/blog">Blog</a>
        <a href="/research">Research</a>
        <a href="/payment">Payment</a>
        <a href="/legal">Legal information</a>
        <a href="/privacy-policy">Privacy Policy</a>
        <a href="/terms">Terms of Service</a>
      </nav>
    </noscript>

  </body>
</html>
