const { useState, useEffect, useRef, useCallback } = React; /* ══════════════════════════════════════════ ICONS ══════════════════════════════════════════ */ const I = { arrow: () => , arrowR: () => , arrowUp: () => , app: () => , web: () => , graphic: () => , seo: () => , video: () => , ai: () => , sun: () => , moon: () => , check: () => , globe: () => , quote: () => , }; /* ══════════════════════════════════════════ I18N HOOK ══════════════════════════════════════════ */ function useLang() { const [lang, setLang] = useState((window.i18n && window.i18n.lang) || "en"); useEffect(() => { if (!window.i18n) return; return window.i18n.onChange(setLang); }, []); const t = useCallback((k) => (window.i18n ? window.i18n.t(k) : k), [lang]); return { lang, t, setLang: (l) => window.i18n && window.i18n.setLang(l) }; } /* ══════════════════════════════════════════ LOGO ══════════════════════════════════════════ */ function Logo({ className = "logo" }) { return ( {/* Light mode: dark logo */} DreamIT — Build the Future {/* Dark mode: full wordmark with BUILD THE FUTURE tagline */} DreamIT — Build the Future ); } /* ══════════════════════════════════════════ LANG SWITCHER ══════════════════════════════════════════ */ function LangSwitch() { const { lang, setLang } = useLang(); const [open, setOpen] = useState(false); const ref = useRef(null); useEffect(() => { const onDoc = (e) => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); }; document.addEventListener("click", onDoc); return () => document.removeEventListener("click", onDoc); }, []); const labels = { en: { name: "EN", full: "English" }, ar: { name: "ع", full: "العربية" }, bn: { name: "বাং", full: "বাংলা" } }; return (
{["en","ar","bn"].map(l => ( ))}
); } /* ══════════════════════════════════════════ 3D TILT ══════════════════════════════════════════ */ function use3DTilt(strength=6) { const ref = useRef(null); useEffect(() => { const el = ref.current; if (!el) return; let raf; const onMove = (e) => { const r = el.getBoundingClientRect(); const rx = (0.5-(e.clientY-r.top)/r.height)*strength; const ry = ((e.clientX-r.left)/r.width-0.5)*strength; const glow = el.querySelector(".tilt-glow"); if (glow) { glow.style.left=(e.clientX-r.left)+"px"; glow.style.top=(e.clientY-r.top)+"px"; } cancelAnimationFrame(raf); raf = requestAnimationFrame(() => { el.style.transform = `perspective(900px) rotateX(${rx}deg) rotateY(${ry}deg) translateZ(0)`; }); }; const onLeave = () => { cancelAnimationFrame(raf); el.style.transform=`perspective(900px) rotateX(0deg) rotateY(0deg)`; }; el.addEventListener("pointermove", onMove); el.addEventListener("pointerleave", onLeave); return () => { el.removeEventListener("pointermove",onMove); el.removeEventListener("pointerleave",onLeave); cancelAnimationFrame(raf); }; },[strength]); return ref; } function Tilt({children,strength=6,className="",style}) { const ref = use3DTilt(strength); return
{children}
; } /* ══════════════════════════════════════════ TOP ANNOUNCEMENT BAR — Probashi Bondhu ══════════════════════════════════════════ */ function TopBar() { const [closed, setClosed] = useState(() => sessionStorage.getItem('ninetymins-topbar-closed') === '1'); useEffect(() => { document.body.classList.toggle('has-topbar', !closed); return () => document.body.classList.remove('has-topbar'); }, [closed]); if (closed) return null; const dismiss = (e) => { e.preventDefault(); e.stopPropagation(); sessionStorage.setItem('ninetymins-topbar-closed','1'); setClosed(true); }; return (
New Concern NinetyMins FIFA World Cup 2026 hub · live scores · every player · match history · news · guides. Built by Dream Group at ninetymins.com. Explore →
); } /* ══════════════════════════════════════════ NAV ══════════════════════════════════════════ */ function Nav({ theme, setTheme }) { const { t } = useLang(); const [menuOpen, setMenuOpen] = useState(false); const [scrolled, setScrolled] = useState(false); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 30); const onResize = () => { if (window.innerWidth > 880) setMenuOpen(false); }; window.addEventListener("scroll", onScroll, {passive:true}); window.addEventListener("resize", onResize); return () => { window.removeEventListener("scroll",onScroll); window.removeEventListener("resize",onResize); }; }, []); useEffect(() => { document.body.classList.toggle('nav-open', menuOpen); return () => document.body.classList.remove('nav-open'); }, [menuOpen]); const closeMenu = () => setMenuOpen(false); return (
{menuOpen &&
}
{t("nav.start")}
); } /* ══════════════════════════════════════════ HERO ══════════════════════════════════════════ */ function Hero({ accent }) { const Hero3D = window.Hero3D; const { t } = useLang(); return (
{/* Live badge */}
Qatar's #1 Tech Studio · Since 2011 | 🔥 Qatar Offer — 1,000 QAR See Offer →

{t("hero.title.l1")}
{t("hero.title.l2a")}{" "} {t("hero.title.l2b")} .

{t("hero.sub")}

{Hero3D ? : null}
); } /* ══════════════════════════════════════════ STAT SLIDER ══════════════════════════════════════════ */ function StatSlider() { const stats = [ { num: 15, suffix: "+", label: "Years Active", sub: "Est. 2011" }, { num: 240, suffix: "+", label: "Projects Shipped", sub: "4 Continents" }, { num: 11, suffix: "", label: "Live Products", sub: "SaaS · Mobile · AI" }, { num: 60, suffix: "+", label: "Senior Team", sub: "Doha · Dhaka · Madrid" }, { num: 4, suffix: "", label: "Countries", sub: "QA · BD · ES · UK" }, ]; const [active, setActive] = useState(0); const trackRef = useRef(null); const countEls = useRef([]); const sectionRef = useRef(null); const timerRef = useRef(null); const animated = useRef(false); /* Counter animation on scroll-into-view */ useEffect(() => { const el = sectionRef.current; if (!el) return; const obs = new IntersectionObserver(([entry]) => { if (entry.isIntersecting && !animated.current) { animated.current = true; stats.forEach((s, i) => { const node = countEls.current[i]; if (!node) return; const end = s.num; const duration = 1400 + i * 60; const startTime = performance.now(); const tick = (now) => { const p = Math.min((now - startTime) / duration, 1); const ease = 1 - Math.pow(1 - p, 3); node.textContent = Math.round(ease * end); if (p < 1) requestAnimationFrame(tick); else node.textContent = end; }; setTimeout(() => requestAnimationFrame(tick), i * 100); }); } }, { threshold: 0.3 }); obs.observe(el); return () => obs.disconnect(); }, []); /* Auto-advance (mobile) */ const resetTimer = useCallback(() => { clearInterval(timerRef.current); timerRef.current = setInterval(() => setActive(a => (a + 1) % stats.length), 3200); }, []); useEffect(() => { resetTimer(); return () => clearInterval(timerRef.current); }, []); /* Sync scroll on mobile when active changes */ useEffect(() => { const track = trackRef.current; if (!track || window.innerWidth >= 768) return; const cardW = track.scrollWidth / stats.length; track.scrollTo({ left: active * cardW, behavior: "smooth" }); }, [active]); const onScroll = useCallback(() => { const track = trackRef.current; if (!track) return; resetTimer(); const cardW = track.scrollWidth / stats.length; setActive(Math.min(Math.max(Math.round(track.scrollLeft / cardW), 0), stats.length - 1)); }, [resetTimer]); return (
{stats.map((s, i) => (
{ setActive(i); resetTimer(); }} >
countEls.current[i] = el}>{s.num} {s.suffix}
{s.label}
{s.sub}
))}
{stats.map((_, i) => (
); } /* ══════════════════════════════════════════ SAFAR — PRODUCT ANNOUNCEMENT ══════════════════════════════════════════ */ function SafarAnnouncement() { const features = ["Files & Docs","Payments","Airline Tickets","Hajj Packages","Agreements","AI Co-pilot"]; return (
{/* ── LEFT: copy ── */}
New Product · Live Now
SAFAR

The AI Operating System
for Travel & Visa Agencies

Files, payments, tickets, agreements, Hajj packages, AI co-pilot — every operation your agency needs, in one calm and intelligent platform.

{features.map(f => {f})}
A product by DreamIT DreamIT
{/* ── RIGHT: browser mockup ── */}
{/* browser chrome */}
safar.mydreamit.dev
{/* app body */}
SAFAR
Files synced · 2,841 docs
AI co-pilot active
3 Hajj packages ready
∞Files
AICo-pilot
1Platform
); } /* ══════════════════════════════════════════ LOGO MARQUEE — Sister Concerns + Products ══════════════════════════════════════════ */ function LogoMarquee() { // Dream Group products — each card links to its internal product page (which has "Visit Live →" CTA to subdomain) const products = [ { src: "assets/products/ninetymins.com.svg", name: "NinetyMins", tag: "FIFA WC 2026 Hub", url: "ninetymins", cat: "Sports" }, { src: "assets/products/safar.mydreamit.dev.png", name: "SAFAR", tag: "Travel AI OS", url: "safar", cat: "AI · Travel" }, { src: "assets/products/probashi.mydreamit.dev.png", name: "Probashi Bondhu", tag: "Expat Companion", url: "probashi-bondhu", cat: "Mobile App" }, { src: "assets/products/ai.mydreamit.dev.png", name: "AI Studio", tag: "Smart AI Platform", url: "ai-studio", cat: "AI Platform" }, { src: "assets/products/dreamintcs.com.png", name: "Dream International", tag: "Visa & Job Consultancy", url: "dream-international", cat: "Consultancy" }, { src: "assets/products/workforce.mydreamit.dev.png", name: "Dream Workforce", tag: "AI HR & Manpower", url: "dream-workforce", cat: "HR-Tech" }, { src: "assets/products/soulmatego.app.png", name: "Soulmate Go", tag: "Find Real Partners", url: "soulmate-go", cat: "Lifestyle" }, { src: "assets/products/bondon.app.png", name: "Bondhon", tag: "Bengali Matrimony", url: "bondhon", cat: "Lifestyle" }, { src: "assets/products/moneybag.mydreamit.dev.png", name: "MoneyBag", tag: "Digital Wallet", url: "moneybag", cat: "FinTech" }, { src: "assets/products/countly.net.png", name: "Countly", tag: "Easiest Accounting", url: "countly", cat: "Accounting" }, { src: "assets/products/player.mydreamit.dev.png", name: "Playr", tag: "Local Sports App", url: "playr", cat: "Sports" }, { src: "assets/products/probashiinfo.com.png", name: "Probashi Info", tag: "Expat Info Guide", url: "probashi-info", cat: "Media" }, { src: "assets/products/banglatimeline.com.png", name: "Bangla Timeline", tag: "People's Voice News",url: "bangla-timeline", cat: "Media" }, { src: "assets/products/mydreamit.dev.png", name: "DreamIT", tag: "Build the Future", url: "/", cat: "Parent" }, ]; const row1 = products; const row2 = [...products].reverse(); const doubled1 = [...row1, ...row1]; const doubled2 = [...row2, ...row2]; const Card = ({ p, idx }) => (
{p.name}
{p.name}
{p.tag}
{p.cat}
 ); return (
Dream Group · 13 Ventures

One vision.
Thirteen ventures.

From AI platforms to travel SaaS to expat apps — all building the future together.

{/* Row 1 — slides left */}
{doubled1.map((p,i) => )}
{/* Row 2 — slides right */}
{doubled2.map((p,i) => )}
Explore all 13 ventures Click any logo to visit its product
); } /* ══════════════════════════════════════════ SERVICES — premium redesign ══════════════════════════════════════════ */ function BentoServices() { const services = [ { num:"01", icon:, title:"AI Development", short:"LLM · RAG · Autonomous Agents", desc:"Custom AI systems built for production — from RAG-powered knowledge bases to autonomous agents that replace entire workflows.", tags:["LLM","RAG","AGENTS"], href:"ai-development-company-qatar", color:"#ff1a1a", featured:true, }, { num:"02", icon:, title:"App Development", short:"iOS · Android · Flutter", desc:"Native and cross-platform mobile apps shipped on time and on budget.", tags:["iOS","ANDROID","FLUTTER"], href:"app-development-company-qatar", color:"#6366f1" }, { num:"03", icon:, title:"Web Development", short:"Next.js · React · Laravel", desc:"High-performance web applications and SaaS platforms that scale.", tags:["NEXT.JS","REACT","LARAVEL"], href:"web-development-company-qatar", color:"#14b8a6" }, { num:"04", icon:, title:"SEO & Marketing", short:"Technical · On-Page · Content", desc:"Compounding organic growth engineered with data, not guesswork.", tags:["TECHNICAL","ON-PAGE","CONTENT"], href:"seo-services-qatar", color:"#f59e0b" }, { num:"05", icon:, title:"Video Production", short:"Ad Films · Explainer · Brand", desc:"Ad films and brand storytelling that stop the scroll and convert viewers.", tags:["AD FILM","EXPLAINER","BRAND"], href:"video-marketing-services-qatar", color:"#ec4899" }, { num:"06", icon:, title:"Graphic Design", short:"Brand · UI/UX · Motion", desc:"Brand identity, design systems and motion graphics that make you stand out.", tags:["BRAND","UI/UX","MOTION"], href:"graphic-design-company-qatar", color:"#8b5cf6" }, ]; const [feat, ...rest] = services; return (
SERVICES

What we
build.

Six core disciplines — AI-native software to brand identity. Every engagement is end-to-end, owned in-house.

{/* ── Featured: AI Development ── */}
{feat.num}
{feat.icon}

{feat.title}

{feat.desc}

{feat.tags.map(t=>{t})}
); } /* ══════════════════════════════════════════ CLIENTS LOGOS ══════════════════════════════════════════ */ function Clients() { const clients = [ { abbr:"QF", name:"Qatar Foundation", sector:"Education · QA", color:"#6366f1" }, { abbr:"WQ", name:"Woqod", sector:"Energy · QA", color:"#f59e0b" }, { abbr:"QIB", name:"QIIB", sector:"Banking · QA", color:"#14b8a6" }, { abbr:"AL", name:"Al Meera", sector:"Retail · QA", color:"#ec4899" }, { abbr:"OR", name:"Ooredoo Qatar", sector:"Telecom · QA", color:"#ff1a1a" }, { abbr:"HMC", name:"Hamad Medical", sector:"Healthcare · QA", color:"#22c55e" }, { abbr:"GP", name:"Grameenphone", sector:"Telecom · BD", color:"#f97316" }, { abbr:"BB", name:"Brac Bank", sector:"Finance · BD", color:"#8b5cf6" }, { abbr:"PR", name:"PRAN Group", sector:"FMCG · BD", color:"#ef4444" }, { abbr:"AC", name:"ACI Limited", sector:"Healthcare · BD", color:"#3b82f6" }, { abbr:"BG", name:"Bashundhara Grp", sector:"Real Estate · BD", color:"#a78bfa" }, { abbr:"bK", name:"bKash", sector:"Fintech · BD", color:"#e40066" }, ]; return (
TRUSTED BY

Brands that trust us.

240+ businesses across Qatar, Bangladesh, Spain and the UK have shipped with DreamIT.

{clients.map((c,i)=>(
{c.abbr}
{c.name}
{c.sector}
))}
+228 more clients across 4 continents See Portfolio
); } /* ══════════════════════════════════════════ DREAM GROUP SHOWCASE ══════════════════════════════════════════ */ function DreamGroupShowcase() { const companies = [ { logo:"assets/dream-international-logo.png", name:"Dream International", cat:"Manpower & Overseas Employment", founded:"2017", color:"#f59e0b" }, { logo:"assets/dream-workforce-logo.png", name:"Dream Workforce", cat:"HR Management & Staffing", founded:"2021", color:"#10b981" }, { logo:"assets/dream-abroad-logo.png", name:"Dream Abroad", cat:"Travel, Visa & Tourism", founded:"2021", color:"#6366f1" }, { logo:"assets/4uai-logo.png", name:"4UAI", cat:"AI-Powered SaaS Platform", founded:"2023", color:"#ff1a1a" }, { logo:"assets/soulmate-logo.png", name:"Soulmate Go", cat:"Social & Matchmaking App", founded:"2022", color:"#ec4899" }, { logo:"assets/bondon-logo.png", name:"Bondhon", cat:"Community & Communication", founded:"2022", color:"#8b5cf6" }, { logo:"assets/countly-logo.png", name:"Countly", cat:"Analytics & Insights Platform", founded:"2023", color:"#14b8a6" }, { logo:"assets/probashi-info-logo.png", name:"Probashi Info", cat:"Diaspora Information Portal", founded:"2021", color:"#f97316" }, { logo:"assets/moneybag-logo.png", name:"MoneyBag", cat:"Fintech & Remittance", founded:"2023", color:"#22c55e" }, { logo:"assets/playr-logo.png", name:"Playr", cat:"Sports & Recreation Platform", founded:"2023", color:"#3b82f6" }, { logo:"assets/bangla-timeline-logo.png", name:"Bangla Timeline", cat:"News & Media Platform", founded:"2022", color:"#ef4444" }, { logo:"assets/probashi-bhondu-logo.png", name:"Probashi Bondhu", cat:"Migrant Worker Support", founded:"2023", color:"#a78bfa" }, ]; return (
DREAM GROUP

One group.
Many ventures.

Dream Group is a 15-year-old conglomerate with 13 subsidiaries spanning tech, manpower, fintech, and media. DreamIT is the technology engine at its core.

Full Group Overview
{companies.map((c,i) => (
{c.name}
{c.founded}
{c.name}
{c.cat}
))}
); } /* ══════════════════════════════════════════ WHY DREAMIT ══════════════════════════════════════════ */ function WhyDreamIT() { const reasons = [ { num:"01", icon:"🏗️", title:"Products, Not Just Deliverables", desc:"We've shipped 11 live products ourselves — SaaS, mobile, AI. We know the difference between code that ships and code that scales." }, { num:"02", icon:"⚡", title:"Full-Stack Ownership", desc:"Design, engineering, AI and DevOps under one roof. No vendor handoffs, no scope blame, one team accountable for everything." }, { num:"03", icon:"🌍", title:"15 Years, Zero Shortcuts", desc:"Since 2011, 240+ clients across Qatar, Bangladesh, Spain and beyond — all built on repeat business and referrals." }, { num:"04", icon:"🤖", title:"AI-Native From Day One", desc:"We don't bolt AI onto projects. We architect systems around intelligence — RAG, agents, fine-tuning, and custom LLM pipelines." }, { num:"05", icon:"📦", title:"End-to-End Delivery", desc:"Strategy → Design → Build → Launch → Support. One team, one contract, zero handoffs, complete accountability." }, { num:"06", icon:"🔐", title:"Enterprise Security Standards", desc:"SOC 2, ISO 27001, HIPAA-aware development. Your data and your clients' data is treated with the utmost care." }, ]; return (
WHY DREAMIT

The studio that
ships.

We're operators who've built our own products. That changes everything about how we build yours.

{reasons.map((r,i) => (
{r.icon} {r.num}

{r.title}

{r.desc}

))}
{/* Big stat */}
240+
Projects shipped across 4 continents in 15 years
{["Qatar-based HQ in Doha","60+ senior operators","11 live in-market products","Design to deployment in one team","Arabic, Bengali & English support","Agile with weekly demos"].map((c,i) => (
{c}
))}
); } /* ══════════════════════════════════════════ TESTIMONIALS ══════════════════════════════════════════ */ function Testimonials() { const items = [ { quote:"DreamIT delivered our AI-powered HR platform in 8 weeks. The code quality and speed were unlike anything we'd seen from a regional agency.", name:"Ahmed Al-Rashid", role:"CEO, Dream Workforce · Qatar", init:"A" }, { quote:"They built Probashi Info from idea to launch in 12 weeks. The team speaks our language — literally. Arabic, Bengali, English. They get it.", name:"Tariqul Islam", role:"Founder, Probashi Info · Bangladesh", init:"T" }, { quote:"Our web app went from mockup to live in 6 weeks. DreamIT's design team is world-class. We've worked with studios in London — DreamIT is better.", name:"Maria González", role:"Product Lead, TechStart · Madrid", init:"M" }, ]; return (
CLIENT VOICES

What clients
say.

Real results from real clients. We let the work speak.

{items.map((t,i) => (
"

{t.quote}

{t.init}
{t.name}
{t.role}
))}
); } /* ══════════════════════════════════════════ PORTFOLIO TEASER ══════════════════════════════════════════ */ function PortfolioTeaser() { const demos = [ { label:"Restaurant", emoji:"🍽️", color:"#ef4444" }, { label:"Law Firm", emoji:"⚖️", color:"#f59e0b" }, { label:"Real Estate",emoji:"🏠", color:"#10b981" }, { label:"Hospital", emoji:"🏥", color:"#6366f1" }, { label:"SaaS", emoji:"💻", color:"#8b5cf6" }, { label:"Fashion", emoji:"👗", color:"#ec4899" }, { label:"Hotel", emoji:"🏨", color:"#14b8a6" }, { label:"E-commerce", emoji:"🛒", color:"#f97316" }, ]; return (
PORTFOLIO · 26+ DEMOS

Built for every
industry.

26+ live demo websites across every major industry — see exactly what your business could look like online.

Browse All 26 Demos
{demos.map((d,i) => (
{d.emoji} {d.label}
))}
); } /* ══════════════════════════════════════════ QATAR OFFER BANNER ══════════════════════════════════════════ */ function QatarOfferBanner() { return (
🇶🇦 Qatar Exclusive · Limited to 100 Spots

Complete Online Presence
for Just 1,000 QAR

Website · Logo · Business Card · 5 Social Posters · SEO · Google Business · Domain · 1-Year Hosting & Support. Everything. One price.

See Full Offer
Only 37 spots remaining
Market value 3,500+ QAR
QAR1,000
You save 73%
); } /* ══════════════════════════════════════════ MINI CTA ══════════════════════════════════════════ */ function MiniCTA() { return (
START BUILDING

Ready to ship
something real?

Book a free 30-min strategy call. We'll tell you exactly what we'd build and how long it takes.

); } /* ══════════════════════════════════════════ FOOTER ══════════════════════════════════════════ */ function Footer() { const { t } = useLang(); return ( ); } /* ══════════════════════════════════════════ BACK TO TOP ══════════════════════════════════════════ */ function BackToTop() { const [visible, setVisible] = useState(false); useEffect(() => { const onScroll = () => setVisible(window.scrollY > 400); window.addEventListener("scroll", onScroll, {passive:true}); return () => window.removeEventListener("scroll", onScroll); }, []); return ( ); } /* ══════════════════════════════════════════ APP ══════════════════════════════════════════ */ function App() { const [theme, setTheme] = useState(() => localStorage.getItem('dreamit-theme') || 'dark'); const [accent] = useState("#ff1a1a"); useEffect(() => { document.body.setAttribute("data-theme", theme); localStorage.setItem('dreamit-theme', theme); }, [theme]); return ( <>