{"id":8,"date":"2026-07-23T10:24:16","date_gmt":"2026-07-23T10:24:16","guid":{"rendered":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/?page_id=8"},"modified":"2026-09-09T14:37:26","modified_gmt":"2026-09-09T14:37:26","slug":"home","status":"publish","type":"page","link":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/","title":{"rendered":"home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-549745c e-con-full e-flex e-con e-parent\" data-id=\"549745c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-61c27ca elementor-widget elementor-widget-html\" data-id=\"61c27ca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ===== FONTS ===== *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');\r\n\r\n\/* ===== RESET ===== *\/\r\n.dh-hero-section * {\r\n    margin: 0;\r\n    padding-top: ;\r\n    box-sizing: border-box;\r\n}\r\n\r\n\/* ===== HERO SECTION - FULL WIDTH ===== *\/\r\n.dh-hero-section {\r\n    position: relative;\r\n    width: 100vw;\r\n    min-height: 100vh;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: flex-start;\r\n    overflow: hidden;\r\n    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;\r\n    background: #050404;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    margin: 0;\r\n    \/*padding-top: 250px;*\/\r\n    \/*padding-bottom: 80px;*\/\r\n}\r\n\r\n\/* ===== SLIDING BACKGROUND WITH ZOOM ===== *\/\r\n.dh-hero-slides {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    z-index: 0;\r\n}\r\n\r\n.dh-hero-slides .slide {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background-size: cover;\r\n    background-position: center;\r\n    background-repeat: no-repeat;\r\n    opacity: 0;\r\n    transition: opacity 1.8s ease-in-out;\r\n    transform: scale(1.15);\r\n}\r\n\r\n.dh-hero-slides .slide.active {\r\n    opacity: 1;\r\n    animation: zoomBg 16s ease-in-out infinite alternate;\r\n}\r\n\r\n@keyframes zoomBg {\r\n    0% {\r\n        transform: scale(1.15);\r\n    }\r\n    50% {\r\n        transform: scale(1);\r\n    }\r\n    100% {\r\n        transform: scale(1.15);\r\n    }\r\n}\r\n\r\n\/* ===== OVERLAY - SIRF TEXT AREA PAR ===== *\/\r\n.dh-hero-text-overlay {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 55%;\r\n    height: 100%;\r\n    z-index: 1;\r\n    background: \r\n        linear-gradient(90deg, \r\n            rgba(5, 4, 4, 0.92) 0%, \r\n            rgba(5, 4, 4, 0.80) 40%, \r\n            transparent 100%\r\n        );\r\n    pointer-events: none;\r\n}\r\n\r\n\/* ===== DECORATIVE ELEMENTS ===== *\/\r\n.dh-hero-deco {\r\n    position: absolute;\r\n    z-index: 1;\r\n    pointer-events: none;\r\n}\r\n\r\n.dh-hero-deco-1 {\r\n    top: -10%;\r\n    right: -5%;\r\n    width: 35%;\r\n    height: 55%;\r\n    background: radial-gradient(ellipse, rgba(1, 180, 154, 0.06) 0%, transparent 70%);\r\n    border-radius: 50%;\r\n    animation: floatDeco 8s ease-in-out infinite;\r\n}\r\n\r\n.dh-hero-deco-2 {\r\n    bottom: -10%;\r\n    left: -5%;\r\n    width: 30%;\r\n    height: 45%;\r\n    background: radial-gradient(ellipse, rgba(1, 180, 154, 0.04) 0%, transparent 70%);\r\n    border-radius: 50%;\r\n    animation: floatDeco 10s ease-in-out infinite reverse;\r\n}\r\n\r\n@keyframes floatDeco {\r\n    0%, 100% { transform: translate(0, 0) scale(1); }\r\n    50% { transform: translate(30px, -20px) scale(1.1); }\r\n}\r\n\r\n\/* ===== CONTENT ===== *\/\r\n.dh-hero-content {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 580px;\r\n    padding: 2rem 3rem 2rem 5rem;\r\n    color: #ffffff;\r\n    text-align: left;\r\n    transform: translateY(0);\r\n    opacity: 1;\r\n    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.dh-hero-content.slide-up {\r\n    transform: translateY(60px);\r\n    opacity: 0;\r\n}\r\n\r\n.dh-hero-content.slide-up-active {\r\n    transform: translateY(0);\r\n    opacity: 1;\r\n}\r\n\r\n\/* ===== BADGE ===== *\/\r\n.dh-hero-badge {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.15);\r\n    backdrop-filter: blur(10px);\r\n    border: 1px solid rgba(1, 180, 154, 0.25);\r\n    padding: 0.3rem 1.4rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    color: #01b49a;\r\n    margin-bottom: 0.8rem;\r\n}\r\n\r\n.dh-hero-badge i {\r\n    margin-right: 8px;\r\n    color: #01b49a;\r\n}\r\n\r\n\/* ===== MAIN HEADING ===== *\/\r\n.dh-hero-title {\r\n    font-size: clamp(2.8rem, 5.6vw, 4.2rem);\r\n    font-weight: 900;\r\n    line-height: 1.05;\r\n    margin-bottom: 0.3rem;\r\n    color: #ffffff;\r\n}\r\n\r\n.dh-hero-title .highlight {\r\n    background: linear-gradient(135deg, #01b49a, #01d4b8, #01b49a);\r\n    background-size: 200% 200%;\r\n    -webkit-background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    background-clip: text;\r\n    display: inline-block;\r\n    animation: shimmerText 4s ease-in-out infinite;\r\n}\r\n\r\n@keyframes shimmerText {\r\n    0%, 100% { background-position: 0% 50%; }\r\n    50% { background-position: 100% 50%; }\r\n}\r\n\r\n\/* ===== SUB-HIGHLIGHT - WHITE ===== *\/\r\n.dh-hero-title .sub-highlight {\r\n    color: #ffffff;\r\n    display: block;\r\n    font-size: clamp(0.9rem, 1.5vw, 1.3rem);\r\n    font-weight: 400;\r\n    letter-spacing: 2px;\r\n    margin-top: 0.1rem;\r\n    opacity: 1;\r\n}\r\n\r\n\/* ===== DESCRIPTION - WHITE ===== *\/\r\n.dh-hero-desc {\r\n    font-size: clamp(0.85rem, 1vw, 1rem);\r\n    font-weight: 300;\r\n    color: #ffffff;\r\n    max-width: 520px;\r\n    margin: 0.6rem 0 1.2rem;\r\n    line-height: 1.8;\r\n    opacity: 0.9;\r\n}\r\n\r\n.dh-hero-desc i {\r\n    color: #01b49a;\r\n    margin: 0 4px;\r\n}\r\n\r\n\/* ===== PROJECTS LIST ===== *\/\r\n.dh-hero-projects {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.5rem 1rem;\r\n    margin: 0.5rem 0 1.5rem;\r\n    max-width: 550px;\r\n}\r\n\r\n.dh-hero-projects .project-tag {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.4rem;\r\n    background: rgba(255, 255, 255, 0.06);\r\n    border: 1px solid rgba(255, 255, 255, 0.08);\r\n    padding: 0.35rem 1.2rem;\r\n    border-radius: 60px;\r\n    font-size: 0.75rem;\r\n    font-weight: 500;\r\n    color: #ffffff;\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n.dh-hero-projects .project-tag i {\r\n    color: #01b49a;\r\n    font-size: 0.6rem;\r\n}\r\n\r\n.dh-hero-projects .project-tag:hover {\r\n    background: rgba(1, 180, 154, 0.12);\r\n    border-color: rgba(1, 180, 154, 0.25);\r\n    color: #01b49a;\r\n    transform: translateY(-2px);\r\n}\r\n\r\n\/* ===== BUTTONS - UPDATED TO MATCH OTHER SECTIONS ===== *\/\r\n.dh-hero-buttons {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.7rem;\r\n}\r\n\r\n.dh-btn-primary {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: linear-gradient(135deg, #01b49a, #01d4b8);\r\n    color: #ffffff;\r\n    padding: 0.65rem 2rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.8rem;\r\n    text-decoration: none !important;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 180, 154, 0.25);\r\n}\r\n\r\n.dh-btn-primary:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 12px 40px rgba(1, 180, 154, 0.35);\r\n    background: linear-gradient(135deg, #01d4b8, #01f0d0);\r\n    color: #050404;\r\n}\r\n\r\n.dh-btn-primary i {\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-btn-primary:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n.dh-btn-secondary {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: rgba(255, 255, 255, 0.06);\r\n    backdrop-filter: blur(12px);\r\n    border: 1.5px solid rgba(255, 255, 255, 0.08);\r\n    color: #ffffff;\r\n    padding: 0.65rem 2rem;\r\n    border-radius: 60px;\r\n    font-weight: 600;\r\n    font-size: 0.8rem;\r\n    text-decoration: none !important;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    cursor: pointer;\r\n}\r\n\r\n.dh-btn-secondary:hover {\r\n    background: rgba(1, 180, 154, 0.10);\r\n    border-color: rgba(1, 180, 154, 0.30);\r\n    color: #01b49a;\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 8px 35px rgba(1, 180, 154, 0.12);\r\n}\r\n\r\n.dh-btn-secondary i {\r\n    color: #01b49a;\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n.dh-btn-secondary:hover i {\r\n    transform: rotate(-45deg) scale(1.1);\r\n}\r\n\r\n\/* ===== SLIDE INDICATORS ===== *\/\r\n.dh-slide-indicators {\r\n    position: absolute;\r\n    bottom: 25px;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    z-index: 3;\r\n    display: flex;\r\n    gap: 12px;\r\n}\r\n\r\n.dh-slide-indicators .dot {\r\n    width: 10px;\r\n    height: 10px;\r\n    border-radius: 50%;\r\n    background: rgba(199, 199, 200, 0.10);\r\n    border: 2px solid rgba(199, 199, 200, 0.04);\r\n    cursor: pointer;\r\n    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.dh-slide-indicators .dot.active {\r\n    background: #01b49a;\r\n    border-color: #01b49a;\r\n    transform: scale(1.6);\r\n    box-shadow: 0 0 30px rgba(1, 180, 154, 0.25);\r\n}\r\n\r\n.dh-slide-indicators .dot:hover {\r\n    border-color: rgba(1, 180, 154, 0.30);\r\n}\r\n\r\n\/* ===== RESPONSIVE ===== *\/\r\n@media (max-width: 992px) {\r\n    .dh-hero-content {\r\n        padding: 2rem 2.5rem;\r\n        max-width: 100%;\r\n    }\r\n    \r\n    .dh-hero-section {\r\n        justify-content: center;\r\n    }\r\n    \r\n    .dh-hero-text-overlay {\r\n        width: 70%;\r\n        background: linear-gradient(90deg, rgba(5, 4, 4, 0.92) 0%, rgba(5, 4, 4, 0.70) 60%, transparent 100%);\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .dh-hero-section {\r\n        min-height: 70vh;\r\n    }\r\n    \r\n    .dh-hero-content {\r\n        padding: 1.8rem 1.5rem;\r\n        text-align: center;\r\n    }\r\n    \r\n    .dh-hero-text-overlay {\r\n        width: 100%;\r\n        background: linear-gradient(180deg, rgba(5, 4, 4, 0.90) 0%, rgba(5, 4, 4, 0.75) 100%);\r\n    }\r\n    \r\n    .dh-hero-desc {\r\n        max-width: 100%;\r\n        margin: 0.6rem auto 1.2rem;\r\n    }\r\n    \r\n    .dh-hero-projects {\r\n        justify-content: center;\r\n        max-width: 100%;\r\n        margin: 0.4rem auto 1.2rem;\r\n    }\r\n    \r\n    .dh-hero-projects .project-tag {\r\n        font-size: 0.65rem;\r\n        padding: 0.25rem 1rem;\r\n    }\r\n    \r\n    .dh-hero-buttons {\r\n        justify-content: center;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n    \r\n    .dh-btn-primary,\r\n    .dh-btn-secondary {\r\n        width: 100%;\r\n        max-width: 220px;\r\n        justify-content: center;\r\n        padding: 0.55rem 1.4rem;\r\n        font-size: 0.7rem;\r\n    }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .dh-hero-section {\r\n        min-height: 65vh;\r\n    }\r\n    \r\n    .dh-hero-content {\r\n        padding: 1.2rem 1rem;\r\n    }\r\n    \r\n    .dh-hero-title {\r\n        font-size: 1.8rem;\r\n    }\r\n    \r\n    .dh-hero-title .sub-highlight {\r\n        font-size: 0.8rem;\r\n    }\r\n    \r\n    .dh-hero-badge {\r\n        font-size: 0.45rem;\r\n        padding: 0.2rem 0.8rem;\r\n    }\r\n    \r\n    .dh-hero-desc {\r\n        font-size: 0.8rem;\r\n    }\r\n    \r\n    .dh-hero-projects .project-tag {\r\n        font-size: 0.55rem;\r\n        padding: 0.2rem 0.7rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== HERO SECTION - FULL WIDTH ===== -->\r\n<section class=\"dh-hero-section\">\r\n\r\n    <!-- Sliding Background Images -->\r\n    <div class=\"dh-hero-slides\">\r\n        <!-- \u2b07\ufe0f APNI 2 IMAGES KE URLs YAHAN LAGAO \u2b07\ufe0f -->\r\n        <div class=\"slide active\" style=\"background-image: url('https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/engineer-working-his-laptop-front-wind-generators.jpg');\"><\/div>\r\n        <div class=\"slide\" style=\"background-image: url('https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/medium-shot-environmental-engineers-checking-plan.jpg');\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- OVERLAY - SIRF TEXT AREA PAR -->\r\n    <div class=\"dh-hero-text-overlay\"><\/div>\r\n\r\n    <!-- Decorative Elements -->\r\n    <div class=\"dh-hero-deco dh-hero-deco-1\"><\/div>\r\n    <div class=\"dh-hero-deco dh-hero-deco-2\"><\/div>\r\n\r\n    <!-- Content -->\r\n    <div class=\"dh-hero-content\" id=\"heroContent\">\r\n\r\n        <!-- Badge -->\r\n        <div class=\"dh-hero-badge\">\r\n            <i class=\"fas fa-leaf\"><\/i> Engineering Innovation\r\n        <\/div>\r\n\r\n        <!-- Heading -->\r\n        <h1 class=\"dh-hero-title\">\r\n            Engineering the Future of <span class=\"highlight\">Sustainable Energy<\/span>\r\n            <span class=\"sub-highlight\"><\/span>\r\n        <\/h1>\r\n\r\n        <!-- Description -->\r\n        <p class=\"dh-hero-desc\">\r\n            <i class=\"fas fa-recycle\"><\/i> DH ENTERPRISES develops innovative engineering solutions \r\n            that integrate wind, solar, and hydro technologies into intelligent infrastructure, \r\n            delivering reliable, efficient, and sustainable energy for the future.\r\n        <\/p>\r\n\r\n        <!-- Projects List -->\r\n        <div class=\"dh-hero-projects\">\r\n           <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#rwt\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-wind\"><\/i> The RWT<\/span>\r\n<\/a>\r\n          <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#vmont\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-hotel\"><\/i> The Vmont Hotel<\/span>\r\n<\/a>\r\n         <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#hydro\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-water\"><\/i> Hydro Tower System<\/span>\r\n<\/a>\r\n        <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#lava\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-fire\"><\/i> Lava Steam Generator<\/span>\r\n<\/a>\r\n     <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#flotilla\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-rocket\"><\/i> The Flotilla LAV<\/span>\r\n<\/a>\r\n<a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#truss\">\r\n    <span class=\"project-tag\"><i class=\"fas fa-train\"><\/i> Truss Hybrid Rail<\/span>\r\n<\/a>\r\n        <\/div>\r\n\r\n        <!-- Buttons -->\r\n        <div class=\"dh-hero-buttons\">\r\n            <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#projects\" class=\"dh-btn-primary\">\r\n                <i class=\"fas fa-arrow-right\"><\/i> Explore Our Solutions\r\n            <\/a>\r\n            <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#contact\" class=\"dh-btn-secondary\">\r\n                <i class=\"fas fa-envelope\"><\/i> Contact Us\r\n            <\/a>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <!-- Slide Indicators -->\r\n    <div class=\"dh-slide-indicators\">\r\n        <span class=\"dot active\" data-slide=\"0\"><\/span>\r\n        <span class=\"dot\" data-slide=\"1\"><\/span>\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- ===== FONT AWESOME ICONS ===== -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n\r\n<!-- ===== JAVASCRIPT FOR SLIDER ===== -->\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    const slides = document.querySelectorAll('.dh-hero-slides .slide');\r\n    const dots = document.querySelectorAll('.dh-slide-indicators .dot');\r\n    const heroContent = document.getElementById('heroContent');\r\n    let currentSlide = 0;\r\n    const totalSlides = slides.length;\r\n    let autoSlideInterval;\r\n    let isAnimating = false;\r\n\r\n    function goToSlide(index) {\r\n        if (isAnimating || index === currentSlide) return;\r\n        isAnimating = true;\r\n\r\n        slides.forEach(function(slide) {\r\n            slide.classList.remove('active');\r\n            slide.style.animation = 'none';\r\n        });\r\n        dots.forEach(function(dot) {\r\n            dot.classList.remove('active');\r\n        });\r\n\r\n        \/\/ Force reflow to restart animation\r\n        void slides[0].offsetWidth;\r\n\r\n        slides[index].classList.add('active');\r\n        slides[index].style.animation = 'zoomBg 16s ease-in-out infinite alternate';\r\n        dots[index].classList.add('active');\r\n\r\n        heroContent.classList.remove('slide-up-active');\r\n        heroContent.classList.add('slide-up');\r\n        \r\n        setTimeout(function() {\r\n            heroContent.classList.remove('slide-up');\r\n            heroContent.classList.add('slide-up-active');\r\n        }, 150);\r\n\r\n        currentSlide = index;\r\n        \r\n        setTimeout(function() {\r\n            isAnimating = false;\r\n        }, 900);\r\n    }\r\n\r\n    function nextSlide() {\r\n        var next = (currentSlide + 1) % totalSlides;\r\n        goToSlide(next);\r\n    }\r\n\r\n    function startAutoSlide() {\r\n        if (autoSlideInterval) clearInterval(autoSlideInterval);\r\n        autoSlideInterval = setInterval(nextSlide, 4000);\r\n    }\r\n\r\n    function stopAutoSlide() {\r\n        if (autoSlideInterval) {\r\n            clearInterval(autoSlideInterval);\r\n            autoSlideInterval = null;\r\n        }\r\n    }\r\n\r\n    dots.forEach(function(dot, i) {\r\n        dot.addEventListener('click', function() {\r\n            var slideIndex = parseInt(this.getAttribute('data-slide'));\r\n            if (slideIndex === currentSlide) return;\r\n            stopAutoSlide();\r\n            goToSlide(slideIndex);\r\n            setTimeout(startAutoSlide, 600);\r\n        });\r\n    });\r\n\r\n    var heroSection = document.querySelector('.dh-hero-section');\r\n    heroSection.addEventListener('mouseenter', stopAutoSlide);\r\n    heroSection.addEventListener('mouseleave', startAutoSlide);\r\n\r\n    heroContent.classList.add('slide-up-active');\r\n    startAutoSlide();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e115b5e e-con-full e-flex e-con e-parent\" data-id=\"e115b5e\" data-element_type=\"container\" data-e-type=\"container\" id=\"about\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4166985 elementor-widget elementor-widget-html\" data-id=\"4166985\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ===== FONTS ===== *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');\r\n\r\n\/* ===== RESET ===== *\/\r\n.dh-about-section * {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n}\r\n\r\n\/* ===== ABOUT SECTION ===== *\/\r\n.dh-about-section {\r\n    position: relative;\r\n    width: 100%;\r\n    min-height: 80vh;\r\n    display: flex;\r\n    align-items: center;\r\n    padding: 20px;\r\n    background: #ffffff;\r\n    overflow: hidden;\r\n    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;\r\n}\r\n\r\n\/* ===== CONTAINER ===== *\/\r\n.dh-about-container {\r\n    max-width: 1200px;\r\n    width: 100%;\r\n    margin: 0 auto;\r\n}\r\n\r\n\/* ===== ABOUT GRID - EQUAL SIZE ===== *\/\r\n.dh-about-grid {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 3rem;\r\n    align-items: center;\r\n}\r\n\r\n\/* ===== LEFT SIDE - IMAGE (with flip animation) ===== *\/\r\n.dh-about-image {\r\n    position: relative;\r\n    border-radius: 24px;\r\n    overflow: hidden;\r\n    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);\r\n    height: 420px;\r\n    perspective: 1000px;\r\n    opacity: 0;\r\n    transform: rotateY(-90deg) scale(0.8);\r\n    transform-origin: left center;\r\n    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.dh-about-image.animate-in {\r\n    opacity: 1;\r\n    transform: rotateY(0deg) scale(1);\r\n}\r\n\r\n.dh-about-image img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    display: block;\r\n    transition: transform 0.6s ease;\r\n}\r\n\r\n.dh-about-image:hover img {\r\n    transform: scale(1.03);\r\n}\r\n\r\n\/* ===== BADGE - TOP LEFT (ONLY ONE) ===== *\/\r\n.dh-about-image .image-badge-top {\r\n    position: absolute;\r\n    top: 20px;\r\n    left: -8px;\r\n    background: rgba(5, 4, 4, 0.88);\r\n    backdrop-filter: blur(12px);\r\n    padding: 0.6rem 1.6rem;\r\n    border-radius: 60px;\r\n    color: #ffffff;\r\n    font-size: 0.7rem;\r\n    font-weight: 600;\r\n    letter-spacing: 0.5px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.5rem;\r\n    z-index: 3;\r\n    border: 1px solid rgba(255, 255, 255, 0.06);\r\n    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);\r\n    transition: all 0.4s ease;\r\n}\r\n\r\n.dh-about-image .image-badge-top i {\r\n    color: #01b49a;\r\n    font-size: 0.8rem;\r\n}\r\n\r\n.dh-about-image:hover .image-badge-top {\r\n    transform: translateY(5px);\r\n    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.20);\r\n}\r\n\r\n\/* ===== RIGHT SIDE - CONTENT (with flip animation) ===== *\/\r\n.dh-about-content {\r\n    padding-left: 0.5rem;\r\n    opacity: 0;\r\n    transform: rotateY(90deg) scale(0.8);\r\n    transform-origin: right center;\r\n    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;\r\n}\r\n\r\n.dh-about-content.animate-in {\r\n    opacity: 1;\r\n    transform: rotateY(0deg) scale(1);\r\n}\r\n\r\n.dh-about-content .about-badge {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.08);\r\n    border: 1px solid rgba(1, 180, 154, 0.12);\r\n    padding: 0.25rem 1.2rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    color: #01b49a;\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-about-content .about-badge i {\r\n    margin-right: 6px;\r\n}\r\n\r\n.dh-about-content h2 {\r\n    font-size: clamp(1.8rem, 3.5vw, 2.8rem);\r\n    font-weight: 800;\r\n    color: #050404;\r\n    line-height: 1.1;\r\n    margin-bottom: 0.3rem;\r\n}\r\n\r\n.dh-about-content h2 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-about-content .about-desc {\r\n    font-size: clamp(0.9rem, 1vw, 0.95rem);\r\n    color: #3b3a3d;\r\n    line-height: 1.8;\r\n    margin-bottom: 1.2rem;\r\n    opacity: 0.8;\r\n}\r\n\r\n.dh-about-content .about-desc i {\r\n    color: #01b49a;\r\n    margin: 0 4px;\r\n}\r\n\r\n\/* ===== FEATURES ===== *\/\r\n.dh-about-features {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.6rem 1.5rem;\r\n    margin-bottom: 1.5rem;\r\n}\r\n\r\n.dh-about-features .feature-item {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.5rem;\r\n    color: #050404;\r\n    font-size: 0.8rem;\r\n    font-weight: 500;\r\n}\r\n\r\n.dh-about-features .feature-item i {\r\n    color: #01b49a;\r\n    font-size: 0.8rem;\r\n    width: 20px;\r\n    text-align: center;\r\n}\r\n\r\n\/* ===== BUTTON ===== *\/\r\n.dh-about-btn {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: linear-gradient(135deg, #01b49a, #01d4b8);\r\n    color: #ffffff;\r\n    padding: 0.65rem 2rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.8rem;\r\n    text-decoration: none !important;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 180, 154, 0.25);\r\n}\r\n\r\n.dh-about-btn:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 12px 40px rgba(1, 180, 154, 0.35);\r\n    background: linear-gradient(135deg, #01d4b8, #01f0d0);\r\n    color: #050404;\r\n}\r\n\r\n.dh-about-btn i {\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-about-btn:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n\/* ===== RESPONSIVE ===== *\/\r\n@media (max-width: 992px) {\r\n    .dh-about-grid {\r\n        grid-template-columns: 1fr;\r\n        gap: 2rem;\r\n    }\r\n    \r\n    .dh-about-content {\r\n        padding-left: 0;\r\n        text-align: center;\r\n    }\r\n    \r\n    .dh-about-features {\r\n        justify-content: center;\r\n    }\r\n    \r\n    .dh-about-image {\r\n        height: 320px;\r\n    }\r\n    \r\n    .dh-about-image .image-badge-top {\r\n        left: 10px;\r\n        top: 15px;\r\n        padding: 0.4rem 1rem;\r\n        font-size: 0.6rem;\r\n    }\r\n\r\n    .dh-about-image {\r\n        transform-origin: center top;\r\n    }\r\n    \r\n    .dh-about-content {\r\n        transform-origin: center bottom;\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .dh-about-section {\r\n        min-height: auto;\r\n        padding: 2.5rem 1.5rem;\r\n    }\r\n    \r\n    .dh-about-image {\r\n        height: 250px;\r\n    }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .dh-about-section {\r\n        padding: 2rem 1rem;\r\n    }\r\n    \r\n    .dh-about-image {\r\n        height: 200px;\r\n        border-radius: 16px;\r\n    }\r\n    \r\n    .dh-about-image .image-badge-top {\r\n        left: 5px;\r\n        top: 10px;\r\n        padding: 0.3rem 0.8rem;\r\n        font-size: 0.5rem;\r\n    }\r\n    \r\n    .dh-about-features {\r\n        flex-direction: column;\r\n        align-items: center;\r\n        gap: 0.4rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== ABOUT US SECTION ===== -->\r\n<section class=\"dh-about-section\" id=\"aboutSection\">\r\n\r\n    <div class=\"dh-about-container\">\r\n\r\n        <div class=\"dh-about-grid\">\r\n\r\n            <!-- LEFT SIDE - IMAGE -->\r\n            <div class=\"dh-about-image\" id=\"aboutImage\">\r\n                <!-- \u2b07\ufe0f APNI IMAGE KA URL YAHAN LAGAO \u2b07\ufe0f -->\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/4b4da0f3bd.jpg\" alt=\"DH Enterprises - Environmental Engineering\">\r\n                \r\n                <!-- BADGE - TOP LEFT (ONLY ONE) -->\r\n                <div class=\"image-badge-top\">\r\n                    <i class=\"fas fa-medal\"><\/i> Trusted Worldwide\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- RIGHT SIDE - CONTENT -->\r\n            <div class=\"dh-about-content\" id=\"aboutContent\">\r\n\r\n                <!-- Badge -->\r\n                <div class=\"about-badge\">\r\n                    <i class=\"fas fa-info-circle\"><\/i> About Us\r\n                <\/div>\r\n\r\n                <!-- Heading -->\r\n                <h2>\r\n                    Engineering Innovation for a <span class=\"highlight\">Sustainable Future<\/span>\r\n                <\/h2>\r\n\r\n                <!-- Description -->\r\n                <p class=\"about-desc\">\r\n                    <i class=\"fas fa-recycle\"><\/i> At DH ENTERPRISES, we are committed to transforming the future \r\n                    through innovative engineering and sustainable energy solutions. Our mission is to develop \r\n                    advanced technologies that address modern infrastructure challenges while promoting \r\n                    environmental responsibility. By combining engineering expertise with renewable energy \r\n                    innovation, we create reliable, efficient, and future-ready solutions for communities, \r\n                    industries, and governments.\r\n                <\/p>\r\n\r\n                <!-- Features -->\r\n                <div class=\"dh-about-features\">\r\n                    <span class=\"feature-item\">\r\n                        <i class=\"fas fa-check-circle\"><\/i> Clean Energy Solutions\r\n                    <\/span>\r\n                    <span class=\"feature-item\">\r\n                        <i class=\"fas fa-check-circle\"><\/i> Sustainable Infrastructure\r\n                    <\/span>\r\n                    <span class=\"feature-item\">\r\n                        <i class=\"fas fa-check-circle\"><\/i> Eco-Innovation &amp; Technology\r\n                    <\/span>\r\n                    <span class=\"feature-item\">\r\n                        <i class=\"fas fa-check-circle\"><\/i> Future-Ready Engineering\r\n                    <\/span>\r\n                <\/div>\r\n\r\n                <!-- Button -->\r\n                <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#services\" class=\"dh-about-btn\">\r\n                    <i class=\"fas fa-arrow-right\"><\/i> Learn More About Us\r\n                <\/a>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- ===== FONT AWESOME ICONS ===== -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n\r\n<!-- ===== SCROLL ANIMATION JAVASCRIPT ===== -->\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    const image = document.getElementById('aboutImage');\r\n    const content = document.getElementById('aboutContent');\r\n    let animated = false;\r\n\r\n    function checkScroll() {\r\n        if (animated) return;\r\n        \r\n        const section = document.getElementById('aboutSection');\r\n        const rect = section.getBoundingClientRect();\r\n        const triggerPoint = window.innerHeight * 0.85;\r\n        \r\n        if (rect.top < triggerPoint) {\r\n            image.classList.add('animate-in');\r\n            content.classList.add('animate-in');\r\n            animated = true;\r\n        }\r\n    }\r\n\r\n    \/\/ Check on scroll\r\n    window.addEventListener('scroll', checkScroll);\r\n    \/\/ Check on load\r\n    setTimeout(checkScroll, 300);\r\n    \/\/ Check on resize\r\n    window.addEventListener('resize', checkScroll);\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-08892cf e-con-full e-flex e-con e-parent\" data-id=\"08892cf\" data-element_type=\"container\" data-e-type=\"container\" id=\"projects\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a30b1e2 elementor-widget elementor-widget-html\" data-id=\"a30b1e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- RESET & BASE ----- *\/\r\n* {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n}\r\n\r\n\/* ----- PROJECT SHOWCASE (CARD) ----- *\/\r\n.dh-project-showcase {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    background: #ffffff;\r\n    border-radius: 2rem;\r\n    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.08);\r\n    padding: 3rem 1.8rem 2.5rem;\r\n    transition: all 0.2s;\r\n    margin: 0 auto;\r\n}\r\n\r\n.dh-showcase-container {\r\n    width: 100%;\r\n    margin: 0 auto;\r\n}\r\n\r\n\/* ----- HEADER ----- *\/\r\n.dh-showcase-header {\r\n    text-align: center;\r\n    margin-bottom: 2.2rem;\r\n}\r\n\r\n.dh-showcase-header .badge {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.07);\r\n    border: 1px solid rgba(1, 180, 154, 0.10);\r\n    padding: 0.3rem 1.6rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2.5px;\r\n    text-transform: uppercase;\r\n    color: #01b49a;\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-showcase-header .badge svg {\r\n    margin-right: 8px;\r\n    width: 14px;\r\n    height: 14px;\r\n    fill: #01b49a;\r\n    vertical-align: middle;\r\n}\r\n\r\n.dh-showcase-header h2 {\r\n    font-size: clamp(1.8rem, 4.5vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #050404;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.dh-showcase-header h2 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-showcase-header p {\r\n    font-size: clamp(0.85rem, 1vw, 1rem);\r\n    color: #5e5d62;\r\n    max-width: 600px;\r\n    margin: 0.5rem auto 0;\r\n    line-height: 1.6;\r\n}\r\n\r\n\/* ----- TABS ----- *\/\r\n.dh-project-tabs {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n    gap: 0.5rem 0.6rem;\r\n    margin-bottom: 2rem;\r\n}\r\n\r\n.dh-project-tabs .tab-btn {\r\n    padding: 0.4rem 1.2rem;\r\n    border-radius: 60px;\r\n    border: 1.5px solid rgba(5, 4, 4, 0.06);\r\n    background: #f8fafb;\r\n    color: #5e5d62;\r\n    font-size: 0.65rem;\r\n    font-weight: 600;\r\n    cursor: pointer;\r\n    transition: all 0.3s ease;\r\n    font-family: 'Inter', sans-serif;\r\n    letter-spacing: 0.3px;\r\n}\r\n\r\n.dh-project-tabs .tab-btn:hover {\r\n    background: rgba(1, 180, 154, 0.05);\r\n    border-color: rgba(1, 180, 154, 0.15);\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-project-tabs .tab-btn.active {\r\n    background: linear-gradient(135deg, #01b49a, #01d4b8);\r\n    border-color: #01b49a;\r\n    color: #ffffff;\r\n    box-shadow: 0 4px 18px rgba(1, 180, 154, 0.2);\r\n}\r\n\r\n\/* ----- CONTENT GRID (image + details) ----- *\/\r\n.dh-showcase-content {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1.1fr;\r\n    gap: 0;\r\n    background: #f8fafb;\r\n    border-radius: 24px;\r\n    overflow: hidden;\r\n    min-height: 460px;\r\n    border: 1px solid rgba(5, 4, 4, 0.04);\r\n}\r\n\r\n\/* ===== LEFT: IMAGE (FULL VISIBLE - NO CUT) ===== *\/\r\n.dh-showcase-image {\r\n    height: 100%;\r\n    min-height: 460px;\r\n    overflow: hidden;\r\n    background: #dce2e8;\r\n    border-radius: 24px 0 0 24px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    position: relative;\r\n}\r\n\r\n.dh-showcase-image img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: contain;\r\n    display: block;\r\n}\r\n\r\n\/* ----- RIGHT: DETAILS (FULL CONTENT) ----- *\/\r\n.dh-showcase-details {\r\n    padding: 1.8rem 2.2rem 1.8rem 2rem;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: flex-start;\r\n    height: 100%;\r\n    min-height: 460px;\r\n    max-height: 600px;\r\n    overflow-y: auto;\r\n    background: #f8fafb;\r\n    border-radius: 0 24px 24px 0;\r\n    transition: opacity 0.35s ease, transform 0.35s ease;\r\n}\r\n\r\n\/* project number *\/\r\n.dh-showcase-details .project-number {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.8rem;\r\n    font-size: 0.55rem;\r\n    font-weight: 700;\r\n    color: #01b49a;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    margin-bottom: 0.2rem;\r\n}\r\n\r\n.dh-showcase-details .project-number .num-badge {\r\n    background: rgba(1, 180, 154, 0.08);\r\n    padding: 0.15rem 1rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n}\r\n\r\n.dh-showcase-details .project-number .line {\r\n    flex: 1;\r\n    height: 1px;\r\n    background: rgba(5, 4, 4, 0.06);\r\n    max-width: 60px;\r\n}\r\n\r\n\/* title *\/\r\n.dh-showcase-details h3 {\r\n    font-size: clamp(1.3rem, 2.2vw, 2rem);\r\n    font-weight: 800;\r\n    color: #050404;\r\n    line-height: 1.1;\r\n    margin-bottom: 0.05rem;\r\n}\r\n\r\n.dh-showcase-details h3 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n\/* full name *\/\r\n.dh-showcase-details .project-full-name {\r\n    font-size: 0.85rem;\r\n    color: #5e5d62;\r\n    font-weight: 500;\r\n    margin-bottom: 0.4rem;\r\n    letter-spacing: 0.2px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.4rem;\r\n}\r\n\r\n.dh-showcase-details .project-full-name svg {\r\n    width: 12px;\r\n    height: 12px;\r\n    fill: #01b49a;\r\n    flex-shrink: 0;\r\n}\r\n\r\n\/* description *\/\r\n.dh-showcase-details .project-desc {\r\n    font-size: 0.9rem;\r\n    color: #2f2e31;\r\n    line-height: 1.7;\r\n    margin-bottom: 0.6rem;\r\n    opacity: 0.85;\r\n}\r\n\r\n.dh-showcase-details .project-desc svg {\r\n    width: 14px;\r\n    height: 14px;\r\n    fill: #01b49a;\r\n    margin-right: 4px;\r\n    vertical-align: middle;\r\n}\r\n\r\n\/* specs chips *\/\r\n.dh-showcase-details .specs-list {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.3rem 0.8rem;\r\n    margin-bottom: 0.3rem;\r\n}\r\n\r\n.dh-showcase-details .specs-list .spec-item {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.3rem;\r\n    font-size: 0.65rem;\r\n    color: #2f2e31;\r\n    font-weight: 500;\r\n    background: rgba(1, 180, 154, 0.04);\r\n    padding: 0.15rem 0.8rem;\r\n    border-radius: 60px;\r\n}\r\n\r\n.dh-showcase-details .specs-list .spec-item svg {\r\n    width: 10px;\r\n    height: 10px;\r\n    fill: #01b49a;\r\n    flex-shrink: 0;\r\n}\r\n\r\n\/* extra details *\/\r\n.dh-showcase-details .extra-details {\r\n    font-size: 0.72rem;\r\n    color: #4a494d;\r\n    line-height: 1.8;\r\n    margin-top: 0.4rem;\r\n    padding-top: 0.6rem;\r\n    border-top: 1px solid rgba(5, 4, 4, 0.04);\r\n}\r\n\r\n.dh-showcase-details .extra-details strong {\r\n    color: #050404;\r\n    font-weight: 600;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-row {\r\n    display: flex;\r\n    align-items: baseline;\r\n    gap: 0.6rem;\r\n    margin-bottom: 0.3rem;\r\n    padding: 0.15rem 0;\r\n    border-bottom: 1px solid rgba(5, 4, 4, 0.02);\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-row svg {\r\n    width: 12px;\r\n    height: 12px;\r\n    fill: #01b49a;\r\n    flex-shrink: 0;\r\n    margin-top: 2px;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-row .label {\r\n    color: #7a797f;\r\n    font-weight: 500;\r\n    min-width: 95px;\r\n    font-size: 0.68rem;\r\n    letter-spacing: 0.3px;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-row .value {\r\n    color: #050404;\r\n    font-weight: 500;\r\n    font-size: 0.72rem;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-section {\r\n    margin-top: 0.4rem;\r\n    padding-top: 0.4rem;\r\n    border-top: 1px solid rgba(5, 4, 4, 0.04);\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-section .section-title {\r\n    font-weight: 700;\r\n    color: #050404;\r\n    font-size: 0.7rem;\r\n    display: block;\r\n    margin-bottom: 0.15rem;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-section .section-text {\r\n    color: #4a494d;\r\n    font-size: 0.7rem;\r\n    line-height: 1.7;\r\n}\r\n\r\n.dh-showcase-details .extra-details .detail-section .section-text svg {\r\n    width: 8px;\r\n    height: 8px;\r\n    fill: #01b49a;\r\n    margin: 0 3px;\r\n    vertical-align: middle;\r\n}\r\n\r\n\/* RWT content styling *\/\r\n.dh-showcase-details .rwt-content {\r\n    font-size: 0.75rem;\r\n    color: #2f2e31;\r\n    line-height: 1.9;\r\n}\r\n\r\n.dh-showcase-details .rwt-content p {\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-subheading {\r\n    font-weight: 700;\r\n    color: #01b49a;\r\n    font-size: 0.8rem;\r\n    display: block;\r\n    margin-top: 0.6rem;\r\n    margin-bottom: 0.2rem;\r\n    text-transform: uppercase;\r\n    letter-spacing: 0.5px;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-highlight {\r\n    color: #01b49a;\r\n    font-weight: 600;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-stat {\r\n    background: rgba(1, 180, 154, 0.08);\r\n    padding: 0.1rem 0.5rem;\r\n    border-radius: 4px;\r\n    font-weight: 600;\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-feature-list {\r\n    margin: 0.3rem 0 0.5rem 0;\r\n    padding-left: 1rem;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-feature-list li {\r\n    margin-bottom: 0.2rem;\r\n    list-style: none;\r\n    position: relative;\r\n    padding-left: 1.2rem;\r\n}\r\n\r\n.dh-showcase-details .rwt-content .rwt-feature-list li::before {\r\n    content: \"\u25b8\";\r\n    color: #01b49a;\r\n    position: absolute;\r\n    left: 0;\r\n    font-weight: 700;\r\n}\r\n\r\n\/* Vmont Hotel content styling *\/\r\n.dh-showcase-details .vmont-content {\r\n    font-size: 0.75rem;\r\n    color: #2f2e31;\r\n    line-height: 1.9;\r\n}\r\n\r\n.dh-showcase-details .vmont-content p {\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-showcase-details .vmont-content .vmont-feature-list {\r\n    margin: 0.3rem 0 0.5rem 0;\r\n    padding-left: 1rem;\r\n}\r\n\r\n.dh-showcase-details .vmont-content .vmont-feature-list li {\r\n    margin-bottom: 0.2rem;\r\n    list-style: none;\r\n    position: relative;\r\n    padding-left: 1.2rem;\r\n}\r\n\r\n.dh-showcase-details .vmont-content .vmont-feature-list li::before {\r\n    content: \"\u25b8\";\r\n    color: #01b49a;\r\n    position: absolute;\r\n    left: 0;\r\n    font-weight: 700;\r\n}\r\n\r\n.dh-showcase-details .vmont-content .vmont-highlight {\r\n    color: #01b49a;\r\n    font-weight: 600;\r\n}\r\n\r\n\/* Hydro Tower content styling *\/\r\n.dh-showcase-details .hydro-content {\r\n    font-size: 0.75rem;\r\n    color: #2f2e31;\r\n    line-height: 1.9;\r\n}\r\n\r\n.dh-showcase-details .hydro-content p {\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-showcase-details .hydro-content .hydro-highlight {\r\n    color: #01b49a;\r\n    font-weight: 600;\r\n}\r\n\r\n.dh-showcase-details .hydro-content .hydro-stat {\r\n    background: rgba(1, 180, 154, 0.08);\r\n    padding: 0.1rem 0.5rem;\r\n    border-radius: 4px;\r\n    font-weight: 600;\r\n    color: #01b49a;\r\n}\r\n\r\n\/* ----- FILTER DOTS ----- *\/\r\n.dh-filter-dots {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 0.8rem;\r\n    margin-top: 0.8rem;\r\n    padding-top: 0.8rem;\r\n    border-top: 1px solid rgba(5, 4, 4, 0.04);\r\n}\r\n\r\n.dh-filter-dots .dot-label-text {\r\n    font-size: 0.55rem;\r\n    color: #7a797f;\r\n    font-weight: 500;\r\n    margin-right: 0.2rem;\r\n}\r\n\r\n.dh-filter-dots .dot {\r\n    width: 10px;\r\n    height: 10px;\r\n    border-radius: 50%;\r\n    background: rgba(5, 4, 4, 0.08);\r\n    cursor: pointer;\r\n    transition: all 0.3s ease;\r\n    position: relative;\r\n}\r\n\r\n.dh-filter-dots .dot::after {\r\n    content: attr(data-label);\r\n    position: absolute;\r\n    bottom: -16px;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    font-size: 0.4rem;\r\n    color: #7a797f;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n    white-space: nowrap;\r\n}\r\n\r\n.dh-filter-dots .dot:hover::after {\r\n    opacity: 1;\r\n}\r\n\r\n.dh-filter-dots .dot.active {\r\n    background: #01b49a;\r\n    transform: scale(1.5);\r\n    box-shadow: 0 0 18px rgba(1, 180, 154, 0.25);\r\n}\r\n\r\n.dh-filter-dots .dot:hover {\r\n    background: rgba(1, 180, 154, 0.3);\r\n    transform: scale(1.3);\r\n}\r\n\r\n\/* ----- RESPONSIVE ----- *\/\r\n@media (max-width: 992px) {\r\n    .dh-showcase-content {\r\n        grid-template-columns: 1fr;\r\n        min-height: auto;\r\n    }\r\n    .dh-showcase-image {\r\n        min-height: 280px;\r\n        border-radius: 24px 24px 0 0;\r\n    }\r\n    .dh-showcase-image img {\r\n        height: 280px;\r\n    }\r\n    .dh-showcase-details {\r\n        min-height: auto;\r\n        max-height: none;\r\n        padding: 1.8rem 1.8rem;\r\n        border-radius: 0 0 24px 24px;\r\n    }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-project-showcase {\r\n        padding: 1.8rem 1rem;\r\n    }\r\n    .dh-showcase-image {\r\n        min-height: 200px;\r\n    }\r\n    .dh-showcase-image img {\r\n        height: 200px;\r\n    }\r\n    .dh-showcase-details {\r\n        padding: 1.5rem 1.2rem;\r\n        max-height: none;\r\n    }\r\n    .dh-project-tabs .tab-btn {\r\n        font-size: 0.6rem;\r\n        padding: 0.3rem 0.9rem;\r\n    }\r\n    .dh-showcase-details .extra-details .detail-row {\r\n        flex-wrap: wrap;\r\n        gap: 0.2rem;\r\n    }\r\n    .dh-showcase-details .extra-details .detail-row .label {\r\n        min-width: 70px;\r\n        font-size: 0.6rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== PROJECT SHOWCASE SECTION ===== -->\r\n<section class=\"dh-project-showcase\">\r\n    <div class=\"dh-showcase-container\">\r\n\r\n        <div class=\"dh-showcase-header\">\r\n            <div class=\"badge\">\r\n                <svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z\"\/><\/svg>\r\n                Our Projects\r\n            <\/div>\r\n            <h2>\r\n                Designed, Working &amp; <span class=\"highlight\">Developing<\/span>\r\n            <\/h2>\r\n            <p>\r\n                DH Enterprises has designed, is working on, and developing these innovative projects\r\n                that are shaping the future of sustainable energy and infrastructure.\r\n            <\/p>\r\n        <\/div>\r\n\r\n   <div class=\"dh-project-tabs\" id=\"projectTabs\">\r\n    <button class=\"tab-btn active\" id=\"rwt\" data-project=\"0\">RWT<\/button>\r\n    <button class=\"tab-btn\" id=\"vmont\" data-project=\"1\">Vmont Hotel<\/button>\r\n    <button class=\"tab-btn\" id=\"hydro\" data-project=\"2\">Hydro Tower<\/button>\r\n    <button class=\"tab-btn\" id=\"lava\" data-project=\"3\">Lava Steam<\/button>\r\n    <button class=\"tab-btn\" id=\"flotilla\" data-project=\"4\">Flotilla<\/button>\r\n    <button class=\"tab-btn\" id=\"truss\" data-project=\"5\">Truss Rail<\/button>\r\n<\/div>\r\n\r\n        <div class=\"dh-showcase-content\" id=\"showcaseContent\">\r\n            <div class=\"dh-showcase-image\" id=\"showcaseImage\">\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/wind-turbines-generating-clean-energy-2.jpg\" alt=\"Project\" \/>\r\n            <\/div>\r\n            <div class=\"dh-showcase-details\" id=\"showcaseDetails\"><\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n\r\n    \/\/ ============================================\r\n    \/\/ SVG ICONS\r\n    \/\/ ============================================\r\n\r\n    const icons = {\r\n        tag: `<svg viewBox=\"0 0 24 24\"><path d=\"M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.36.86.58 1.41.58.55 0 1.05-.22 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z\"\/><\/svg>`,\r\n\r\n        map: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z\"\/><\/svg>`,\r\n\r\n        users: `<svg viewBox=\"0 0 24 24\"><path d=\"M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-3.58-3.5-7-3.5z\"\/><\/svg>`,\r\n\r\n        sun: `<svg viewBox=\"0 0 24 24\"><path d=\"M6.76 4.84l-1.8-1.79-1.41 1.41 1.79 1.79 1.42-1.41zM4 10.5H1v2h3v-2zm9-9.95h-2V3.5h2V.55zm7.45 3.91l-1.41-1.41-1.79 1.79 1.41 1.41 1.79-1.79zm-3.21 13.7l1.79 1.8 1.41-1.41-1.8-1.79-1.4 1.4zM20 10.5v2h3v-2h-3zm-8-5c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm-1 16.95h2V19.5h-2v2.95zm-7.45-3.91l1.41 1.41 1.79-1.8-1.41-1.41-1.79 1.8z\"\/><\/svg>`,\r\n\r\n        water: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2c-5.33 4.55-8 8.48-8 11.8 0 4.98 3.8 8.2 8 8.2s8-3.22 8-8.2c0-3.32-2.67-7.25-8-11.8z\"\/><\/svg>`,\r\n\r\n        leaf: `<svg viewBox=\"0 0 24 24\"><path d=\"M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66c.95-2.58 2.23-5.11 4.29-7.77 2.06-2.66 4.5-4.44 7-5.23z\"\/><\/svg>`,\r\n\r\n        building: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z\"\/><\/svg>`,\r\n\r\n        check: `<svg viewBox=\"0 0 24 24\"><path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"\/><\/svg>`,\r\n\r\n        sync: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z\"\/><\/svg>`,\r\n\r\n        globe: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z\"\/><\/svg>`,\r\n\r\n        recycle: `<svg viewBox=\"0 0 24 24\"><path d=\"M7 9.82C7 8.54 8.21 7.5 9.67 7.5h4.66c1.46 0 2.67 1.04 2.67 2.32v4.36c0 1.28-1.21 2.32-2.67 2.32H9.67C8.21 16.5 7 15.46 7 14.18V9.82zm10.04-1.36l2.88-1.95c.42-.28.68-.73.68-1.21s-.26-.93-.68-1.21l-2.88-1.95c-.46-.31-1.08-.18-1.39.28-.31.46-.18 1.08.28 1.39l2.88 1.95-2.88 1.95c-.46.31-.59.93-.28 1.39.3.46.92.59 1.39.28zm0 7.08l2.88 1.95c.42.28.68.73.68 1.21s-.26.93-.68 1.21l-2.88 1.95c-.46.31-1.08.18-1.39-.28-.31-.46-.18-1.08.28-1.39l2.88-1.95c.46-.31.59-.93.28-1.39-.3-.46-.92-.59-1.39-.28z\"\/><\/svg>`,\r\n\r\n        arrow: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z\"\/><\/svg>`,\r\n\r\n        fire: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2c-5.35 3.58-6 8.5-6 11.8 0 4.98 3.8 8.2 8 8.2s8-3.22 8-8.2c0-3.3-.65-8.22-6-11.8zm0 16c-2.76 0-5-2.24-5-5 0-2.47 1.13-5.33 4.03-8.27l.97-.97.97.97C16.87 7.67 18 10.53 18 13c0 2.76-2.24 5-5 5z\"\/><\/svg>`,\r\n\r\n        industry: `<svg viewBox=\"0 0 24 24\"><path d=\"M13 9V3H5v16h14V9h-6zm-4 8H7v-2h2v2zm0-4H7v-2h2v2zm0-4H7V7h2v2zm6 8h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2V7h2v2z\"\/><\/svg>`,\r\n\r\n        wind: `<svg viewBox=\"0 0 24 24\"><path d=\"M11.33 3.38C8.88 4.89 7 7.53 7 10.5c0 4.42 3.58 8 8 8 3.88 0 7.1-2.76 7.85-6.48C21.53 15.84 18.48 19 14.5 19c-4.42 0-8-3.58-8-8 0-2.97 1.88-5.61 4.33-7.12z\"\/><\/svg>`,\r\n\r\n        battery: `<svg viewBox=\"0 0 24 24\"><path d=\"M15.67 4H14V2h-4v2H8.33C7.6 4 7 4.6 7 5.33v15.33C7 21.4 7.6 22 8.33 22h7.33c.74 0 1.34-.6 1.34-1.33V5.33C17 4.6 16.4 4 15.67 4z\"\/><\/svg>`,\r\n\r\n        ruler: `<svg viewBox=\"0 0 24 24\"><path d=\"M19.5 3.5L3.5 19.5l1.41 1.41L20.91 4.91 19.5 3.5zm-4.5 2.09l2.83 2.83-7.07 7.07-2.83-2.83L15 5.59zm-8.49 8.49l2.83 2.83-1.41 1.41-2.83-2.83 1.41-1.41z\"\/><\/svg>`,\r\n\r\n        bolt: `<svg viewBox=\"0 0 24 24\"><path d=\"M11 21h-1l1-7H7.5c-.58 0-.57-.32-.38-.66.19-.34.05-.08.07-.12C8.48 10.94 10.42 7.54 13 3h1l-1 7h3.5c.49 0 .56.33.47.51l-.07.15C12.96 17.55 11 21 11 21z\"\/><\/svg>`,\r\n\r\n        home: `<svg viewBox=\"0 0 24 24\"><path d=\"M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z\"\/><\/svg>`,\r\n\r\n        train: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2c-4 0-8 .5-8 4v9.5C4 17.43 5.57 19 7.5 19L6 20.5v.5h12v-.5L16.5 19c1.93 0 3.5-1.57 3.5-3.5V6c0-3.5-3.58-4-8-4zm0 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm6-6H6V6h12v4z\"\/><\/svg>`,\r\n\r\n        cogs: `<svg viewBox=\"0 0 24 24\"><path d=\"M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.07.62-.07.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z\"\/><\/svg>`,\r\n\r\n        circle: `<svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"8\"\/><\/svg>`,\r\n\r\n        rocket: `<svg viewBox=\"0 0 24 24\"><path d=\"M12 2C8 5 6 9 6 13c0 1.5.5 3 1.5 4.2L5 20l1 1 2.8-2.5C10 19.5 11 20 12 20s2-.5 3.2-1.5L18 21l1-1-2.5-2.8C17.5 16 18 14.5 18 13c0-4-2-8-6-11z\"\/><\/svg>`,\r\n\r\n        thermometer: `<svg viewBox=\"0 0 24 24\"><path d=\"M15 13V5c0-1.66-1.34-3-3-3S9 3.34 9 5v8c-1.21.91-2 2.37-2 4 0 2.76 2.24 5 5 5s5-2.24 5-5c0-1.63-.79-3.09-2-4zm-3 7c-1.66 0-3-1.34-3-3 0-1.1.6-2.06 1.5-2.58V5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5v9.42c.9.52 1.5 1.48 1.5 2.58 0 1.66-1.34 3-3 3z\"\/><\/svg>`,\r\n\r\n        fuel: `<svg viewBox=\"0 0 24 24\"><path d=\"M19 6h-1V3H5v18h14v-3h1c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2zM7 5h10v4H7V5zm10 14H7v-8h10v8zm2-3c0 .55-.45 1-1 1h-1v-6h1c.55 0 1 .45 1 1v4z\"\/><\/svg>`\r\n    };\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ PROJECT DATA\r\n    \/\/ ============================================\r\n\r\n    const projects = [{\r\n        number: '01',\r\n        name: 'The RWT',\r\n        fullName: 'The Revolution Wind Tower',\r\n        desc: '',\r\n        specs: ['32 Turbines', '1425 ft Tall', '425 ft Wide', '100 MPH'],\r\n        extra: `\r\n            <div class=\"rwt-content\">\r\n\r\n                <p><span class=\"rwt-highlight\">The RWT and the drag device turbine<\/span> A DH Enterprises invention. Drag devices versus lift devices for extracting power from the wind. Anyone in the wind industry knows that drag devices are overall nowhere near as efficient as lift devices for capturing energy from the wind. That being said, <span class=\"rwt-highlight\">I'm going to prove that drag devices configured properly can have a definite advantage over their lift engaging cousins.<\/span><\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83d\udcca The Efficiency Challenge<\/span>\r\n\r\n                <p>Within the swept area of a lift device from bottom to top, the longer the blades, the greater the difference in wind speed will be from top to bottom. The basic calculation is <span class=\"rwt-stat\">10% more wind velocity every hundred feet of elevation<\/span>, until there is no friction with the ground at approximately 1000 feet.<\/p>\r\n\r\n                <p>Even at 1000 feet tall, a lift device windmill type rotor system will have a large disparity of wind velocity within its diameter of swept area from top to bottom. So a rotor system, let's say 700 feet will have substantially less energy in the bottom segment of the diameter of that rotor. <span class=\"rwt-highlight\">Up to 2\/3 of the energy captured will be from the top half of that diameter<\/span> because that's where the greater velocity of the wind will be.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\u26a1 The Drag Device Advantage<\/span>\r\n\r\n                <p>This is exactly why a <span class=\"rwt-highlight\">drag device rotor configured horizontally<\/span> will have almost equal wind velocity distributed across that rotor. Now place that rotor between the 600 and 700 foot high level and you will find the wind velocity evenly distributed across the rotor of that turbine.<\/p>\r\n\r\n                <p>This is how a properly configured <span class=\"rwt-highlight\">DDT, drag device turbine<\/span>, gains a substantial advantage in capturing wind energy. The DDT is not as efficient as <span class=\"rwt-highlight\">LDT, lift device turbine<\/span> for capturing wind energy that is exerted upon its blades, however, when placed horizontally at a specific height, it is far more efficient within its swept area, this is because it is capturing wind velocities that do not change with height.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83c\udfd7\ufe0f The RWT Configuration<\/span>\r\n\r\n                <p>Now take a group of DDTs stacked in a box type configuration, place them all above the 500 foot level up to the 1400 foot level, (each turbine having a <span class=\"rwt-stat\">100 foot high and 100 feet wide intake<\/span>) place eight of them on top of one another and you have a system of capturing wind that is far more efficient at each given level, than any single lift device turbine within its given area.<\/p>\r\n\r\n                <p>So now you have a tower that is <span class=\"rwt-stat\">four turbines wide and eight high, 32 turbines total<\/span>. This is the largest configuration for the RWT, they don't have to be a tower of 32 turbines but this is the most efficient configuration economically speaking.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83d\udd0b Power Generation & Storage<\/span>\r\n\r\n                <p>Another advantage the RWT has is that it produces <span class=\"rwt-highlight\">direct current<\/span> and does not need to be inverted in the tower. That happens at the base of the tower in the towers power plant. The energy extracted from the wind can be used to manufacture hydrogen within the power plant using direct current. Thus the energy stored can be used whenever needed to feed the grid by using hydrogen to power an electrical generating turbine. <span class=\"rwt-highlight\">Doing this makes wind power more stable.<\/span><\/p>\r\n\r\n                <p>Also, when desired the direct current coming from the tower can be rectified to alternating current that will directly power the grid at times when more energy is needed.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83c\udf2c\ufe0f Wind Capture Area<\/span>\r\n\r\n                <p><span class=\"rwt-highlight\">WIND CAPTURE<\/span> - In the case of the RWT the wind capture area is <span class=\"rwt-stat\">425 feet wide and 825 feet tall<\/span>, with each intake having <span class=\"rwt-stat\">10,000 ft\u00b2<\/span> area of wind to capture focused on a 100 foot in length horizontal turbine. Thus configured the RWT can not only capture wind energy more efficiently over its total given area, but also can attain a height that no lift device has ever attained and practically speaking, probably never will.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83d\udca8 Wind Speed Advantage<\/span>\r\n\r\n                <p><span class=\"rwt-highlight\">Another substantial advantage of the DDTs compared to the LDT's, they have no restriction on wind speed.<\/span> The LDT's as we all know are restricted most of them to wind speeds of around <span class=\"rwt-stat\">50 MPH<\/span>. That wind speed can be calculated as 12,500 W per square meter, this being the highest velocity that they can operate within.<\/p>\r\n\r\n                <p>The DDT's on the other hand can operate in windspeeds up to <span class=\"rwt-stat\">100 MPH<\/span> and because of the cube of the wind calculation, a 100 MPH wind carries <span class=\"rwt-stat\">100 W per m\u00b2<\/span>, eight times the energy than a 50 mph wind speed.<\/p>\r\n\r\n                <p>The RWT also, because of its extreme height, is going to find substantially more straight line winds than the LDT's which is another configuration advantage over the LDT's.<\/p>\r\n\r\n                <span class=\"rwt-subheading\">\ud83c\udfe2 Additional Features<\/span>\r\n\r\n                <p><span class=\"rwt-highlight\">Other features that the RWT has:<\/span><\/p>\r\n\r\n                <ul class=\"rwt-feature-list\">\r\n                    <li>There's no working outside. The RWT has an elevator in the center and a crane at the top.<\/li>\r\n                    <li>There are no large, turning blades to be seen on the outside of the structure.<\/li>\r\n                    <li>The RWT is quieter and very few birds fly over 500 feet so bird strikes are very minimal.<\/li>\r\n                    <li>The RWT can house up to <span class=\"rwt-stat\">32 turbines<\/span> on one tower replacing a whole wind field of LDT's. In doing so it takes up <span class=\"rwt-highlight\">way less land area<\/span>, which is economically and environmentally much friendlier.<\/li>\r\n                <\/ul>\r\n\r\n                <div style=\"margin-top:12px;padding-top:10px;border-top:2px solid rgba(1,180,154,0.15);text-align:center;font-size:0.7rem;color:#01b49a;font-weight:600;letter-spacing:1px;\">\r\n                    \ud83c\udf31 Redefining wind energy \u2014 one tower at a time.\r\n                <\/div>\r\n\r\n            <\/div>\r\n        `,\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/Image20260721162148.jpg'\r\n\r\n    }, {\r\n        number: '02',\r\n        name: 'The Vmont Hotel',\r\n        fullName: 'The Vmont Hotel',\r\n        desc: '',\r\n        specs: ['248 Rooms', '170\u00d7140 Footprint', 'Adult + Kids Pool', '2 Hot Tubs'],\r\n        extra: `\r\n            <div class=\"vmont-content\">\r\n\r\n                <p>The Vmont Hotel: <span class=\"vmont-highlight\">There are 248 rooms<\/span> in a compact <span class=\"vmont-highlight\">170 x 140' footprint<\/span>. It includes an <span class=\"vmont-highlight\">adult pool and a kids pool, two hot tubs<\/span>, one with its own separate room. There is a restaurant, a <span class=\"vmont-highlight\">billiard room with eight tables and four air hockey tables plus shuffleboard<\/span>.<\/p>\r\n\r\n                <p>The second floor features a stage for <span class=\"vmont-highlight\">DJs, bands, laser light shows, private parties, and movies<\/span>. There are <span class=\"vmont-highlight\">two full bars<\/span>, one with alcohol and one with nonalcoholic drinks.<\/p>\r\n\r\n                <p>Did I forget to mention the <span class=\"vmont-highlight\">world-class attraction that is the 3-D ZooAquarium<\/span> and, of course, there is the <span class=\"vmont-highlight\">arcade<\/span>.<\/p>\r\n\r\n                <p>On the roof of the Vmont there is a <span class=\"vmont-highlight\">covered area 25' x 47'<\/span> plus an <span class=\"vmont-highlight\">open area of 135' x 47'<\/span> where, weather permitting, there will be an <span class=\"vmont-highlight\">acoustic band and cookout with smoked meats made directly on the roof<\/span> for a nice quiet, relaxing evening. We also feature <span class=\"vmont-highlight\">covered parking<\/span>.<\/p>\r\n\r\n                <p>When guests check in they are issued an <span class=\"vmont-highlight\">in-house debit card<\/span> so they can easily access all the amenities in-house. When they check out, they can pay for whatever they've used.<\/p>\r\n\r\n                <p>The Vmont Hotel is not just a place to stay. It's a <span class=\"vmont-highlight\">destination<\/span>. This hotel is designed not just to be entertaining but <span class=\"vmont-highlight\">affordable<\/span>. A family of six can stay in a suite for <span class=\"vmont-highlight\">$250 per day<\/span>. The smallest and least expensive room for one person is <span class=\"vmont-highlight\">$75 per night<\/span>.<\/p>\r\n\r\n                <div style=\"margin-top:12px;padding-top:10px;border-top:2px solid rgba(1,180,154,0.15);text-align:center;font-size:0.7rem;color:#01b49a;font-weight:600;letter-spacing:1px;\">\r\n                    \ud83c\udfe8 Luxury meets sustainability \u2014 experience the Vmont difference.\r\n                <\/div>\r\n\r\n            <\/div>\r\n        `,\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/09\/vmont.png'\r\n\r\n    }, {\r\n        number: '03',\r\n        name: 'The Hydro Tower System',\r\n        fullName: 'The HTS \u2014 Hydro Tower System',\r\n        desc: '',\r\n        specs: ['3 Power Modes', 'Battery Storage', '600 Homes', 'Scalable'],\r\n        extra: `\r\n            <div class=\"hydro-content\">\r\n\r\n                <p><span class=\"hydro-highlight\">The Hydro tower system<\/span><\/p>\r\n\r\n                <p>This design incorporates <span class=\"hydro-highlight\">three different modes of generating electricity<\/span>, plus can have <span class=\"hydro-highlight\">battery storage<\/span>.<\/p>\r\n\r\n                <p><span class=\"hydro-highlight\">Wind power, solar power, Hydro power<\/span>, all combined into one system.<\/p>\r\n\r\n                <p>One Hydro tower can power up to <span class=\"hydro-stat\">600 homes<\/span> so it's perfect for <span class=\"hydro-highlight\">small towns and remote villages<\/span> or can just feed a local grid to a city near you.<\/p>\r\n\r\n                <p><span class=\"hydro-highlight\">Multiple towers<\/span> can be placed in line with one another, the same water that feeds one tower can feed the next tower down stream.<\/p>\r\n\r\n                <div style=\"margin-top:12px;padding-top:10px;border-top:2px solid rgba(1,180,154,0.15);text-align:center;font-size:0.7rem;color:#01b49a;font-weight:600;letter-spacing:1px;\">\r\n                    \ud83d\udca7 Three powers. One tower. Endless energy.\r\n                <\/div>\r\n\r\n            <\/div>\r\n        `,\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/09\/hydro-tower-system.png'\r\n\r\n    }, {\r\n        number: '04',\r\n        name: 'The Lava Steam Generator',\r\n        fullName: 'The Lava Steam Generator (LSG)',\r\n        desc: 'Designed to be placed directly in lava streams to generate clean, sustainable steam power. Withstands extreme temperatures and produces over 1 MW of constant output per unit \u2014 zero emissions, 24\/7 baseload power.',\r\n        specs: ['12\" Lava Depth', '400 lbs', '1+ MW Output', '$1M\/Unit'],\r\n        extra: `\r\n            <div class=\"detail-row\">${icons.tag}<span class=\"label\">Type<\/span><span class=\"value\">Lava-Immersed Steam Generator<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.fire}<span class=\"label\">Energy Source<\/span><span class=\"value\">Geothermal \u00b7 Direct Lava Contact<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.ruler}<span class=\"label\">Lava Depth<\/span><span class=\"value\">12 inches (lava flows around unit)<\/span><\/div>\r\n            <div class=\"detail-row\">\u2696\ufe0f<span class=\"label\">Weight<\/span><span class=\"value\">~400 lbs per unit<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.bolt}<span class=\"label\">Power Output<\/span><span class=\"value\">1+ MW constant output per unit<\/span><\/div>\r\n            <div class=\"detail-row\">\ud83d\udcb0<span class=\"label\">Unit Cost<\/span><span class=\"value\">~$1,000,000 each<\/span><\/div>\r\n            <div class=\"detail-row\">\u23f0<span class=\"label\">Payback Period<\/span><span class=\"value\">~6 months<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.globe}<span class=\"label\">Target Location<\/span><span class=\"value\">Hawaii (could power almost entirely)<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.check}<span class=\"label\">Emissions<\/span><span class=\"value\">Zero Emissions \u00b7 Clean Energy<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.sync}<span class=\"label\">Reliability<\/span><span class=\"value\">Baseload Power \u00b7 24\/7 \u00b7 365 Days<\/span><\/div>\r\n\r\n            <div class=\"detail-section\">\r\n                <span class=\"section-title\">\u2699\ufe0f Installation Process<\/span>\r\n                <span class=\"section-text\">${icons.circle} Anchor points placed on sides of lava stream ${icons.circle} LSG lowered into position via helicopter ${icons.circle} Ground workers guide units into place ${icons.circle} Water inlet\/outlet connected ${icons.circle} Superheated steam exits \u2014 flow uninterrupted<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"detail-section\">\r\n                <span class=\"section-title\">\ud83d\udcb0 Project Funding<\/span>\r\n                <span class=\"section-text\">${icons.circle} Total funding needed: <strong>$15,000,000<\/strong> ${icons.circle} Within 1 year: Several MWs generating ${icons.circle} Cheapest power supply on the planet ${icons.circle} Lowest carbon footprint ${icons.circle} Technologies already in place \u2014 DHEnterprises ready to hire team<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"detail-section\">\r\n                <span class=\"section-title\">\ud83c\udf0b Why Hawaii?<\/span>\r\n                <span class=\"section-text\">${icons.circle} Simple, effective replacement for dirty coal and oil ${icons.circle} Uses Hawaii's own natural resources ${icons.circle} Clean power 24\/7 ${icons.circle} Embrace renewable energy with zero emissions<\/span>\r\n            <\/div>\r\n\r\n            <div style=\"margin-top:6px;font-size:0.75rem;color:#01b49a;font-style:italic;text-align:center;border-top:1px solid rgba(1,180,154,0.06);padding-top:6px;\">\r\n                \ud83c\udf3f Clean energy from the heart of the Earth. Powering tomorrow, today.\r\n            <\/div>\r\n        `,\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/08\/98B13039-466B-404D-92C4-A40B915EA86C.jpg'\r\n\r\n    }, {\r\n        number: '05',\r\n        name: 'The Flotilla',\r\n        fullName: 'The Flotilla \u2014 Next Generation LAV',\r\n        desc: 'This airship is designed to use hydrogen as a lifting gas and is powered by hydrogen. Unlike any airship before, the Flotilla is a pressurized airship capable of going into space, taking passengers and cargo from New York City to Japan in less than two hours.',\r\n        specs: ['1125\\' Length', '625\\' Width', '500,000 gal Water', '80M ft\u00b3 Hydrogen'],\r\n        extra: `\r\n            <div class=\"detail-row\">${icons.tag}<span class=\"label\">Type<\/span><span class=\"value\">Pressurized Lighter-Than-Air Vehicle (LAV)<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.wind}<span class=\"label\">Lifting Gas<\/span><span class=\"value\">Hydrogen<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.bolt}<span class=\"label\">Power Source<\/span><span class=\"value\">Hydrogen-Powered<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.ruler}<span class=\"label\">Hydrogen Volume<\/span><span class=\"value\">80,000,000+ cu ft<\/span><\/div>\r\n            <div class=\"detail-row\">\ud83d\udca7<span class=\"label\">Water Capacity<\/span><span class=\"value\">Up to 500,000 Gallons<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.users}<span class=\"label\">Crew<\/span><span class=\"value\">4\u20136 Personnel<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.rocket}<span class=\"label\">Propulsion<\/span><span class=\"value\">Rocket Motors \/ Dual-Use Air-Breathing Turbines<\/span><\/div>\r\n            <div class=\"detail-row\">${icons.globe}<span class=\"label\">Capabilities<\/span><span class=\"value\">Space-Capable \u00b7 NYC to Japan in &lt;2 hrs \u00b7 Cloud Water Collection<\/span><\/div>\r\n\r\n            <div class=\"detail-section\">\r\n                <span class=\"section-title\">\u26a1 Key Features<\/span>\r\n                <span class=\"section-text\">${icons.circle} No internal structure \u2014 uniquely designed unlike any other LAV ${icons.circle} Capabilities beyond any LAV built or designed previously ${icons.circle} Pressurized design \u2014 first of its kind ${icons.circle} Dual-use rocket motors for atmospheric and space flight ${icons.circle} Cloud water collection system \u2014 captures up to 500,000 gallons ${icons.circle} Sustainable hydrogen fuel cells<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"detail-section\">\r\n                <span class=\"section-title\">\ud83c\udfd7\ufe0f Structural Overview<\/span>\r\n                <span class=\"section-text\">${icons.circle} Hydrogen Envelope ${icons.circle} Ballast &amp; Buoyancy Control System ${icons.circle} Pressurized Cabin Module ${icons.circle} Rocket Motor Propulsion System ${icons.circle} Water Collection &amp; Storage System ${icons.circle} Stabilizer Fins<\/span>\r\n            <\/div>\r\n\r\n            <div style=\"margin-top:6px;font-size:0.75rem;color:#01b49a;font-style:italic;text-align:center;border-top:1px solid rgba(1,180,154,0.06);padding-top:6px;\">\r\n                \ud83c\udf3f Inspired by nature. Built for humanity.\r\n            <\/div>\r\n        `,\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/08\/E9B80CBA-F396-4441-B4DA-0E184C572406.jpg'\r\n\r\n    }, {\r\n        number: '06',\r\n        name: 'The Truss Hybrid Rail System',\r\n        fullName: 'The Truss Hybrid Rail System',\r\n\r\n        desc: 'The Truss is a hybrid electric drive vehicle equipped with the world\u2019s most efficient diesel engine, designed to provide an ultralight, efficient, and versatile rail transportation solution.',\r\n\r\n        specs: [\r\n            'Hybrid Electric Drive',\r\n            '60 MPG on Rails',\r\n            '60 Passengers',\r\n            '2 Wheelchairs',\r\n            'Solid-State Batteries',\r\n            'Emergency Grid Power'\r\n        ],\r\n\r\n        extra: `\r\n            <div class=\"technology-content\">\r\n\r\n                <div class=\"content-section\">\r\n                    <h3>TECHNOLOGY INNOVATION<\/h3>\r\n\r\n                    <p>\r\n                        The Truss is a hybrid electric drive vehicle equipped\r\n                        with the world's most efficient diesel engine. These\r\n                        vehicles can attain 60 MPG on the rails while\r\n                        carrying 60 passengers and two wheelchairs.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        They will have two sets of powered wheels. They\r\n                        will have air-conditioning and heating system.\r\n                        Battery compartments and diesel fuel will be kept at\r\n                        a constant temperature.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        All the systems we need are already in production\r\n                        and on the market to produce this ultralight rail\r\n                        vehicle.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        The technologies are already mature, and this\r\n                        innovation in rail technology has the ability to\r\n                        open rail markets that were thought long dead and\r\n                        give life to a rail system in decline.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        We're not just taking cars off the road, but handling\r\n                        local freight markets, and delivery of postal types\r\n                        of products.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        Not only do these vehicles not need to be plugged\r\n                        in, you can plug them in to the grid and they will\r\n                        provide power in an emergency.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"content-section\">\r\n                    <h3>TECHNICAL OBJECTIVES<\/h3>\r\n\r\n                    <p>\r\n                        Prototype one or more vehicles for testing and\r\n                        convert buses into trusses. We can convert electric\r\n                        and diesel powered buses into this type of vehicle.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        We can purchase used bus vehicles to be converted,\r\n                        saving thousands of dollars and the wait time\r\n                        associated with them of 18 months to 24 months.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        I have already researched all the parts for the drive\r\n                        systems, the battery packs, the engines.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        The battery packs will be solid state. The challenge\r\n                        is just to put it all together and have it balanced\r\n                        out for systems to function together properly.\r\n                    <\/p>\r\n\r\n                    <p>\r\n                        The whole conversion can be done in just a matter\r\n                        of weeks after all the parts are available in one\r\n                        place.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"technical-specs\">\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.tag}\r\n                        <span class=\"label\">Type<\/span>\r\n                        <span class=\"value\">Hybrid Electric Drive Rail Vehicle<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.bolt}\r\n                        <span class=\"label\">Power Source<\/span>\r\n                        <span class=\"value\">Diesel Engine + Solid-State Battery Packs<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.train}\r\n                        <span class=\"label\">Rail Efficiency<\/span>\r\n                        <span class=\"value\">Up to 60 MPG on the Rails<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.users}\r\n                        <span class=\"label\">Passenger Capacity<\/span>\r\n                        <span class=\"value\">60 Passengers + 2 Wheelchairs<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.cogs}\r\n                        <span class=\"label\">Powered Wheels<\/span>\r\n                        <span class=\"value\">Two Sets of Powered Wheels<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.thermometer}\r\n                        <span class=\"label\">Climate System<\/span>\r\n                        <span class=\"value\">Air-Conditioning and Heating<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.battery}\r\n                        <span class=\"label\">Battery Technology<\/span>\r\n                        <span class=\"value\">Solid-State Battery Packs<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.fuel}\r\n                        <span class=\"label\">Fuel Storage<\/span>\r\n                        <span class=\"value\">Temperature-Controlled Diesel Fuel<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.sync}\r\n                        <span class=\"label\">Grid Connection<\/span>\r\n                        <span class=\"value\">Emergency Power Capability<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.leaf}\r\n                        <span class=\"label\">Applications<\/span>\r\n                        <span class=\"value\">Passenger Transit \u00b7 Local Freight \u00b7 Postal Delivery<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.cogs}\r\n                        <span class=\"label\">Vehicle Conversion<\/span>\r\n                        <span class=\"value\">Electric and Diesel Buses<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.check}\r\n                        <span class=\"label\">Used Bus Advantage<\/span>\r\n                        <span class=\"value\">Reduced Cost and Avoidance of 18\u201324 Month Wait<\/span>\r\n                    <\/div>\r\n\r\n                    <div class=\"detail-row\">\r\n                        ${icons.sync}\r\n                        <span class=\"label\">Conversion Timeline<\/span>\r\n                        <span class=\"value\">Matter of Weeks After Parts Are Available<\/span>\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n            <\/div>\r\n        `,\r\n\r\n        image: 'https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/images-12.jpg'\r\n    }];\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ ELEMENTS\r\n    \/\/ ============================================\r\n\r\n    const tabs = document.querySelectorAll('.tab-btn');\r\n    const showcaseImage = document.getElementById('showcaseImage');\r\n    const showcaseDetails = document.getElementById('showcaseDetails');\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ PROJECT URL IDs \/ HASHES\r\n    \/\/ ============================================\r\n\r\n    const projectHashes = [\r\n        'rwt',\r\n        'vmont',\r\n        'hydro',\r\n        'lava',\r\n        'flotilla',\r\n        'truss'\r\n    ];\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ AUTOMATICALLY GIVE EACH TAB AN ID\r\n    \/\/ ============================================\r\n\r\n    tabs.forEach(function(tab, index) {\r\n\r\n        if (projectHashes[index]) {\r\n            tab.id = projectHashes[index];\r\n        }\r\n\r\n    });\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ UPDATE PROJECT\r\n    \/\/ ============================================\r\n\r\n    function updateProject(index) {\r\n\r\n        const project = projects[index];\r\n\r\n        if (!project) return;\r\n\r\n        showcaseImage.innerHTML = `\r\n            <img decoding=\"async\" src=\"${project.image}\" alt=\"${project.name}\">\r\n        `;\r\n\r\n        showcaseDetails.style.opacity = '0';\r\n        showcaseDetails.style.transform = 'translateY(12px)';\r\n\r\n        setTimeout(function() {\r\n\r\n            let extraHTML = '';\r\n\r\n            if (project.extra) {\r\n                extraHTML = `\r\n                    <div class=\"extra-details\">\r\n                        ${project.extra}\r\n                    <\/div>\r\n                `;\r\n            }\r\n\r\n            showcaseDetails.innerHTML = `\r\n                <div class=\"project-number\">\r\n                    <span class=\"num-badge\">Project ${project.number}<\/span>\r\n                    <span class=\"line\"><\/span>\r\n                <\/div>\r\n\r\n                <h3>\r\n                    <span class=\"highlight\">${project.name}<\/span>\r\n                <\/h3>\r\n\r\n                <p class=\"project-full-name\">\r\n                    ${icons.arrow} ${project.fullName}\r\n                <\/p>\r\n\r\n                <p class=\"project-desc\">\r\n                    ${project.desc}\r\n                <\/p>\r\n\r\n                <div class=\"specs-list\">\r\n                    ${project.specs.map(function(s) {\r\n                        return `\r\n                            <span class=\"spec-item\">\r\n                                ${icons.check} ${s}\r\n                            <\/span>\r\n                        `;\r\n                    }).join('')}\r\n                <\/div>\r\n\r\n                ${extraHTML}\r\n\r\n                <div class=\"dh-filter-dots\">\r\n                    <span class=\"dot-label-text\">Projects<\/span>\r\n\r\n                    ${projects.map(function(_, i) {\r\n                        return `\r\n                            <span\r\n                                class=\"dot ${i === index ? 'active' : ''}\"\r\n                                data-project=\"${i}\"\r\n                                data-label=\"${(i + 1) * 0.1}\">\r\n                            <\/span>\r\n                        `;\r\n                    }).join('')}\r\n\r\n                <\/div>\r\n            `;\r\n\r\n\r\n            \/\/ ============================================\r\n            \/\/ DOT CLICK\r\n            \/\/ ============================================\r\n\r\n            document\r\n                .querySelectorAll('.dh-filter-dots .dot')\r\n                .forEach(function(dot) {\r\n\r\n                    dot.addEventListener('click', function() {\r\n\r\n                        const idx = parseInt(\r\n                            this.getAttribute('data-project'),\r\n                            10\r\n                        );\r\n\r\n                        updateProject(idx);\r\n                        updateActiveStates(idx);\r\n\r\n                        \/\/ Update URL\r\n                        updateProjectHash(idx);\r\n\r\n                    });\r\n\r\n                });\r\n\r\n\r\n            showcaseDetails.style.opacity = '1';\r\n            showcaseDetails.style.transform = 'translateY(0)';\r\n\r\n        }, 300);\r\n    }\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ UPDATE ACTIVE STATES\r\n    \/\/ ============================================\r\n\r\n    function updateActiveStates(index) {\r\n\r\n        tabs.forEach(function(tab, i) {\r\n\r\n            if (i === index) {\r\n                tab.classList.add('active');\r\n            } else {\r\n                tab.classList.remove('active');\r\n            }\r\n\r\n        });\r\n\r\n\r\n        const dots = document.querySelectorAll(\r\n            '.dh-filter-dots .dot'\r\n        );\r\n\r\n        dots.forEach(function(dot, i) {\r\n\r\n            if (i === index) {\r\n                dot.classList.add('active');\r\n            } else {\r\n                dot.classList.remove('active');\r\n            }\r\n\r\n        });\r\n\r\n    }\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ UPDATE URL HASH\r\n    \/\/ ============================================\r\n\r\n    function updateProjectHash(index) {\r\n\r\n        if (!projectHashes[index]) return;\r\n\r\n        history.replaceState(\r\n            null,\r\n            '',\r\n            '#' + projectHashes[index]\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ TAB CLICK\r\n    \/\/ ============================================\r\n\r\n    tabs.forEach(function(tab) {\r\n\r\n        tab.addEventListener('click', function() {\r\n\r\n            const projectIndex = parseInt(\r\n                this.getAttribute('data-project'),\r\n                10\r\n            );\r\n\r\n            if (isNaN(projectIndex)) return;\r\n\r\n            updateProject(projectIndex);\r\n            updateActiveStates(projectIndex);\r\n\r\n            \/\/ Change URL to corresponding project\r\n            updateProjectHash(projectIndex);\r\n\r\n        });\r\n\r\n    });\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ LOAD PROJECT FROM URL\r\n    \/\/ ============================================\r\n\r\n    function loadProjectFromHash() {\r\n\r\n        const hash = window.location.hash\r\n            .replace('#', '')\r\n            .toLowerCase();\r\n\r\n        const projectIndex = projectHashes.indexOf(hash);\r\n\r\n\r\n        if (projectIndex !== -1) {\r\n\r\n            \/\/ Valid hash found\r\n            updateProject(projectIndex);\r\n            updateActiveStates(projectIndex);\r\n\r\n        } else {\r\n\r\n            \/\/ No valid hash = default to RWT\r\n            updateProject(0);\r\n            updateActiveStates(0);\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ BROWSER BACK \/ FORWARD\r\n    \/\/ ============================================\r\n\r\n    window.addEventListener('hashchange', function() {\r\n\r\n        loadProjectFromHash();\r\n\r\n    });\r\n\r\n\r\n    \/\/ ============================================\r\n    \/\/ INITIAL LOAD\r\n    \/\/ ============================================\r\n\r\n    showcaseDetails.style.transition =\r\n        'opacity 0.4s ease, transform 0.4s ease';\r\n\r\n    loadProjectFromHash();\r\n\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3bd958f e-con-full e-flex e-con e-parent\" data-id=\"3bd958f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-23f0068 elementor-widget elementor-widget-html\" data-id=\"23f0068\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- DARK THEME SECTION ----- *\/\r\n.dh-dark-section {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    background: #0d1117; \/* Deep dark navy\/black background *\/\r\n    border-radius: 2rem;\r\n    padding: 3rem 1.8rem 2.5rem;\r\n    margin: 0 auto 40px auto;\r\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.5);\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\n\/* Subtle Glow effect behind dark section *\/\r\n.dh-dark-section::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: -50%;\r\n    left: -50%;\r\n    width: 200%;\r\n    height: 200%;\r\n    background: radial-gradient(circle at center, rgba(1, 180, 154, 0.03) 0%, transparent 70%);\r\n    pointer-events: none;\r\n}\r\n\r\n.dh-dark-header {\r\n    text-align: center;\r\n    margin-bottom: 2.5rem;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n.dh-dark-header .badge {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.15);\r\n    border: 1px solid rgba(1, 180, 154, 0.20);\r\n    padding: 0.3rem 1.6rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2.5px;\r\n    text-transform: uppercase;\r\n    color: #01b49a;\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-dark-header .badge svg {\r\n    margin-right: 8px;\r\n    width: 14px;\r\n    height: 14px;\r\n    fill: #01b49a;\r\n    vertical-align: middle;\r\n}\r\n\r\n.dh-dark-header h2 {\r\n    font-size: clamp(1.8rem, 4.5vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #ffffff;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.dh-dark-header h2 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-dark-header p {\r\n    font-size: clamp(0.85rem, 1vw, 1rem);\r\n    color: #8b949e;\r\n    max-width: 600px;\r\n    margin: 0.5rem auto 0;\r\n    line-height: 1.6;\r\n}\r\n\r\n\/* DARK GRID *\/\r\n.dh-dark-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(2, 1fr);\r\n    gap: 25px;\r\n    margin-top: 10px;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n\/* DARK CARDS *\/\r\n.dh-dark-card {\r\n    background: #161b22;\r\n    border-radius: 24px;\r\n    overflow: hidden;\r\n    border: 1px solid rgba(255, 255, 255, 0.06);\r\n    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    display: flex;\r\n    flex-direction: column;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    position: relative;\r\n    box-shadow: 0 5px 15px rgba(0,0,0,0.3);\r\n}\r\n\r\n.dh-dark-card.visible {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n}\r\n\r\n\/* DARK HOVER EFFECTS *\/\r\n.dh-dark-card:hover {\r\n    transform: translateY(-12px) scale(1.01);\r\n    box-shadow: 0 30px 60px -15px rgba(1, 180, 154, 0.35);\r\n    border-color: #01b49a;\r\n    background: #1c2333;\r\n}\r\n\r\n.dh-dark-card::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 3px;\r\n    background: linear-gradient(90deg, #01b49a, #00d4b8);\r\n    transform: scaleX(0);\r\n    transform-origin: right;\r\n    transition: transform 0.4s ease;\r\n}\r\n\r\n.dh-dark-card:hover::after {\r\n    transform: scaleX(1);\r\n    transform-origin: left;\r\n}\r\n\r\n.dh-dark-card:hover img {\r\n    transform: scale(1.08);\r\n    filter: brightness(1.1);\r\n}\r\n\r\n\/* DARK IMAGE WRAPPER *\/\r\n.dh-dark-card .dh-img-wrap {\r\n    width: 100%;\r\n    height: 420px; \/* Taller height for dark cards *\/\r\n    overflow: hidden;\r\n    background: #000000;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    position: relative;\r\n}\r\n\r\n.dh-dark-card .dh-img-wrap img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.4s ease;\r\n    display: block;\r\n}\r\n\r\n\/* DARK CONTENT *\/\r\n.dh-dark-card .dh-content {\r\n    padding: 1.8rem 2rem 2rem;\r\n    flex-grow: 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: transparent;\r\n    border-top: 1px solid rgba(255, 255, 255, 0.05);\r\n}\r\n\r\n.dh-dark-card .dh-content h3 {\r\n    font-size: clamp(1.2rem, 1.6vw, 1.7rem);\r\n    font-weight: 800;\r\n    color: #ffffff;\r\n    margin-bottom: 0.2rem;\r\n    transition: color 0.3s ease, letter-spacing 0.3s ease;\r\n}\r\n\r\n.dh-dark-card .dh-content h3 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-dark-card .dh-content .sub-name {\r\n    font-size: 0.8rem;\r\n    color: #01b49a;\r\n    font-weight: 600;\r\n    margin-bottom: 0.6rem;\r\n    letter-spacing: 0.5px;\r\n}\r\n\r\n.dh-dark-card .dh-content p {\r\n    font-size: 0.85rem;\r\n    color: #8b949e;\r\n    line-height: 1.7;\r\n    margin-bottom: 1rem;\r\n    flex-grow: 1;\r\n    transition: color 0.3s ease;\r\n}\r\n\r\n.dh-dark-card:hover .dh-content p {\r\n    color: #c9d1d9;\r\n}\r\n\r\n\/* DARK TAGS *\/\r\n.dh-dark-card .dh-tags {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.5rem;\r\n    margin-top: auto;\r\n}\r\n\r\n.dh-dark-card .dh-tags span {\r\n    background: rgba(1, 180, 154, 0.1);\r\n    color: #01b49a;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    padding: 0.25rem 1rem;\r\n    border-radius: 60px;\r\n    letter-spacing: 0.3px;\r\n    border: 1px solid rgba(1, 180, 154, 0.1);\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.dh-dark-card:hover .dh-tags span {\r\n    background: #01b49a;\r\n    color: #ffffff;\r\n    border-color: #01b49a;\r\n    box-shadow: 0 4px 15px rgba(1, 180, 154, 0.3);\r\n    transform: translateY(-2px);\r\n}\r\n\r\n\/* RESPONSIVE DARK *\/\r\n@media (max-width: 992px) {\r\n    .dh-dark-grid { gap: 18px; }\r\n    .dh-dark-card .dh-img-wrap { height: 320px; }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .dh-dark-grid { grid-template-columns: 1fr; gap: 20px; }\r\n    .dh-dark-card .dh-img-wrap { height: 340px; }\r\n    .dh-dark-card .dh-content { padding: 1.5rem 1.5rem 1.8rem; }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-dark-section { padding: 2rem 1rem; }\r\n    .dh-dark-header h2 { font-size: 1.8rem; }\r\n    .dh-dark-card .dh-img-wrap { height: 260px; }\r\n}\r\n<\/style>\r\n\r\n<!-- ==========================================================\r\n     SECTION 1: DARK THEME (TOP 2 CARDS)\r\n     ========================================================== -->\r\n<section class=\"dh-dark-section\">\r\n    <div class=\"dh-dark-header\">\r\n        <div class=\"badge\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z\"\/><\/svg>\r\n            Advanced 3D Modeling\r\n        <\/div>\r\n        <h2>Structural <span class=\"highlight\">Meshes<\/span><\/h2>\r\n        <p>High-contrast 3D architectural meshes showcasing load-bearing frameworks and futuristic curved tower designs.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"dh-dark-grid\" id=\"dhDarkGrid\">\r\n        <!-- CARD 1: 3D Mesh -->\r\n        <div class=\"dh-dark-card\">\r\n            <div class=\"dh-img-wrap\">\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/Image20260721162144-e1785235840427.jpg\" alt=\"3D Wireframe Mesh\">\r\n            <\/div>\r\n            <div class=\"dh-content\">\r\n                <h3>Advanced <span class=\"highlight\">Structural Mesh<\/span><\/h3>\r\n                <div class=\"sub-name\">3D Architectural Mesh<\/div>\r\n                <p>A detailed 3D grid structure highlighting the internal framework. Represents load-bearing engineering for sustainable infrastructure.<\/p>\r\n                <div class=\"dh-tags\">\r\n                    <span>3D Modeling<\/span>\r\n                    <span>Grid Analysis<\/span>\r\n                    <span>Load Test<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- CARD 2: Curved Tower -->\r\n        <div class=\"dh-dark-card\">\r\n            <div class=\"dh-img-wrap\">\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/Image20260721162148.jpg\" alt=\"Curved Structural Tower\">\r\n            <\/div>\r\n            <div class=\"dh-content\">\r\n                <h3>Curved <span class=\"highlight\">Tower Concept<\/span><\/h3>\r\n                <div class=\"sub-name\">Ergonomic Structural Design<\/div>\r\n                <p>An aesthetic and aerodynamic tower design. The distinct curved grid framework maximizes stability with a futuristic silhouette.<\/p>\r\n                <div class=\"dh-tags\">\r\n                    <span>Aerodynamic<\/span>\r\n                    <span>Grid Frame<\/span>\r\n                    <span>Modern Silhouette<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    const cards = document.querySelectorAll('#dhDarkGrid .dh-dark-card');\r\n    const observerOptions = { root: null, rootMargin: '0px', threshold: 0.15 };\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('visible');\r\n                observer.unobserve(entry.target);\r\n            }\r\n        });\r\n    }, observerOptions);\r\n    cards.forEach(card => { observer.observe(card); });\r\n    cards.forEach((card, index) => { card.style.transitionDelay = `${index * 0.15}s`; });\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b82074a e-con-full e-flex e-con e-parent\" data-id=\"b82074a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f5dbecf elementor-widget elementor-widget-html\" data-id=\"f5dbecf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- MODERN ZIG-ZAG SECTION (Completely Different from Cards) ----- *\/\r\n.dh-zigzag-section {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    background: #fafbfc;\r\n    border-radius: 2rem;\r\n    padding: 3rem 2rem 2.5rem;\r\n    margin: 0 auto;\r\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n    box-shadow: 0 20px 50px -15px rgba(0,0,0,0.02);\r\n    border: 1px solid rgba(0,0,0,0.03);\r\n}\r\n\r\n\/* ----- HEADER ----- *\/\r\n.dh-zigzag-header {\r\n    text-align: center;\r\n    margin-bottom: 2.5rem;\r\n}\r\n\r\n.dh-zigzag-header .badge {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.08);\r\n    border: 1px solid rgba(1, 180, 154, 0.12);\r\n    padding: 0.3rem 1.6rem;\r\n    border-radius: 60px;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2.5px;\r\n    text-transform: uppercase;\r\n    color: #01b49a;\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-zigzag-header .badge svg {\r\n    margin-right: 8px;\r\n    width: 14px;\r\n    height: 14px;\r\n    fill: #01b49a;\r\n    vertical-align: middle;\r\n}\r\n\r\n.dh-zigzag-header h2 {\r\n    font-size: clamp(1.8rem, 4.5vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #050404;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.dh-zigzag-header h2 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-zigzag-header p {\r\n    font-size: clamp(0.85rem, 1vw, 1rem);\r\n    color: #5e5d62;\r\n    max-width: 600px;\r\n    margin: 0.5rem auto 0;\r\n    line-height: 1.6;\r\n}\r\n\r\n\/* ----- ZIG-ZAG CONTAINER ----- *\/\r\n.dh-zigzag-container {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 30px;\r\n    margin-top: 10px;\r\n}\r\n\r\n\/* ----- ROWS ----- *\/\r\n.dh-zigzag-row {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1.2fr;\r\n    gap: 0;\r\n    background: #ffffff;\r\n    border-radius: 24px;\r\n    overflow: hidden;\r\n    border: 1px solid rgba(0, 0, 0, 0.04);\r\n    box-shadow: 0 5px 20px rgba(0,0,0,0.02);\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    position: relative;\r\n}\r\n\r\n\/* ALTERNATING ROWS (Zig-Zag) *\/\r\n.dh-zigzag-row:nth-child(even) {\r\n    direction: rtl; \/* Flips the order for even row *\/\r\n}\r\n.dh-zigzag-row:nth-child(even) .dh-zigzag-content {\r\n    direction: ltr; \/* Resets text direction *\/\r\n}\r\n\r\n\/* SCROLL ANIMATION *\/\r\n.dh-zigzag-row.visible {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n}\r\n\r\n\/* ----- HOVER EFFECT ----- *\/\r\n.dh-zigzag-row:hover {\r\n    box-shadow: 0 20px 40px -12px rgba(1, 180, 154, 0.08);\r\n    border-color: rgba(1, 180, 154, 0.2);\r\n    background: #ffffff;\r\n}\r\n\r\n\/* Side Color Bar on Hover *\/\r\n.dh-zigzag-row::after {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 4px;\r\n    height: 100%;\r\n    background: #01b49a;\r\n    transform: scaleY(0);\r\n    transform-origin: bottom;\r\n    transition: transform 0.4s ease;\r\n}\r\n.dh-zigzag-row:nth-child(even)::after {\r\n    left: auto;\r\n    right: 0;\r\n}\r\n\r\n.dh-zigzag-row:hover::after {\r\n    transform: scaleY(1);\r\n    transform-origin: top;\r\n}\r\n\r\n\/* Text Change on Hover *\/\r\n.dh-zigzag-row:hover h3 {\r\n    color: #01b49a;\r\n    letter-spacing: 0.5px;\r\n}\r\n.dh-zigzag-row:hover p {\r\n    color: #2a292d;\r\n}\r\n.dh-zigzag-row:hover .dh-zigzag-tags span {\r\n    background: #01b49a;\r\n    color: #ffffff;\r\n    border-color: #01b49a;\r\n}\r\n\r\n\/* ----- IMAGE SIDE ----- *\/\r\n.dh-zigzag-image {\r\n    height: 360px;\r\n    background: #eef1f5;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 20px;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.dh-zigzag-image img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: contain; \/* No cutting *\/\r\n    max-width: 100%;\r\n    max-height: 100%;\r\n    transition: transform 0.6s ease;\r\n}\r\n\r\n.dh-zigzag-row:hover .dh-zigzag-image img {\r\n    transform: scale(1.05);\r\n}\r\n\r\n\/* ----- CONTENT SIDE ----- *\/\r\n.dh-zigzag-content {\r\n    padding: 2.5rem 2.5rem 2.5rem 2rem;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n}\r\n\r\n.dh-zigzag-content .project-num {\r\n    display: inline-block;\r\n    background: rgba(1, 180, 154, 0.04);\r\n    color: #01b49a;\r\n    font-size: 0.55rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    padding: 0.15rem 1rem;\r\n    border-radius: 60px;\r\n    margin-bottom: 0.4rem;\r\n    width: fit-content;\r\n}\r\n\r\n.dh-zigzag-content h3 {\r\n    font-size: clamp(1.6rem, 2.2vw, 2.4rem);\r\n    font-weight: 900;\r\n    color: #050404;\r\n    line-height: 1.1;\r\n    margin-bottom: 0.1rem;\r\n    transition: color 0.3s ease, letter-spacing 0.3s ease;\r\n}\r\n\r\n.dh-zigzag-content h3 .highlight {\r\n    color: #01b49a;\r\n}\r\n\r\n.dh-zigzag-content .sub-name {\r\n    font-size: 0.9rem;\r\n    color: #01b49a;\r\n    font-weight: 600;\r\n    margin-bottom: 0.8rem;\r\n    letter-spacing: 0.5px;\r\n}\r\n\r\n.dh-zigzag-content .divider {\r\n    width: 50px;\r\n    height: 3px;\r\n    background: #01b49a;\r\n    border-radius: 4px;\r\n    margin-bottom: 1rem;\r\n}\r\n\r\n.dh-zigzag-content p {\r\n    font-size: 0.9rem;\r\n    color: #5e5d62;\r\n    line-height: 1.8;\r\n    margin-bottom: 1.2rem;\r\n    transition: color 0.3s ease;\r\n}\r\n\r\n\/* ----- TAGS (Specs) ----- *\/\r\n.dh-zigzag-content .dh-zigzag-tags {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 0.6rem;\r\n}\r\n\r\n.dh-zigzag-content .dh-zigzag-tags span {\r\n    background: rgba(1, 180, 154, 0.05);\r\n    color: #01b49a;\r\n    font-size: 0.6rem;\r\n    font-weight: 600;\r\n    padding: 0.2rem 1rem;\r\n    border-radius: 60px;\r\n    border: 1px solid rgba(1, 180, 154, 0.08);\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n\/* ==========================================================\r\n   RESPONSIVE\r\n   ========================================================== *\/\r\n@media (max-width: 992px) {\r\n    .dh-zigzag-row {\r\n        grid-template-columns: 1fr 1fr;\r\n        direction: ltr !important;\r\n    }\r\n    .dh-zigzag-row:nth-child(even) { direction: ltr !important; }\r\n    .dh-zigzag-row:nth-child(even) .dh-zigzag-content { direction: ltr; }\r\n    .dh-zigzag-image { height: 250px; }\r\n    .dh-zigzag-content { padding: 2rem; }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .dh-zigzag-row {\r\n        grid-template-columns: 1fr;\r\n    }\r\n    .dh-zigzag-image {\r\n        height: 220px;\r\n        border-radius: 24px 24px 0 0;\r\n    }\r\n    .dh-zigzag-content {\r\n        padding: 1.5rem 1.5rem 1.8rem;\r\n    }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-zigzag-section { padding: 1.5rem 1rem; }\r\n    .dh-zigzag-header h2 { font-size: 1.8rem; }\r\n    .dh-zigzag-image { height: 180px; padding: 10px; }\r\n    .dh-zigzag-content { padding: 1.2rem 1.2rem 1.5rem; }\r\n}\r\n<\/style>\r\n\r\n<!-- ==========================================================\r\n     SECTION 2: ALTERNATING ZIG-ZAG LAYOUT\r\n     ========================================================== -->\r\n<section class=\"dh-zigzag-section\">\r\n    \r\n    <div class=\"dh-zigzag-header\">\r\n        <div class=\"badge\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z\"\/><\/svg>\r\n            Engineering Excellence\r\n        <\/div>\r\n        <h2>Next-Gen <span class=\"highlight\">Systems<\/span><\/h2>\r\n        <p>Exploring the boundaries of hybrid energy and advanced aeronautics.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"dh-zigzag-container\" id=\"dhZigzagContainer\">\r\n        \r\n        <!-- ROW 1: Hydro Tower (Image Left, Text Right) -->\r\n        <div class=\"dh-zigzag-row\">\r\n            <div class=\"dh-zigzag-image\">\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/09\/hydro-tower-system.png\" alt=\"HTS Hydro Tower Diagram\">\r\n            <\/div>\r\n            <div class=\"dh-zigzag-content\">\r\n                <span class=\"project-num\">\u25cf Project 03<\/span>\r\n                <h3>HTS - <span class=\"highlight\">Hydro Tower<\/span><\/h3>\r\n                <div class=\"sub-name\">Hybrid Energy System Blueprint<\/div>\r\n                <div class=\"divider\"><\/div>\r\n                <p>An integrated system design combining 100kW wind, 300kW solar, and 5\u201370kW water turbines. 750kW total maximum output with battery storage, capable of powering up to 600 homes and remote villages.<\/p>\r\n                <div class=\"dh-zigzag-tags\">\r\n                    <span>3 Power Modes<\/span>\r\n                    <span>Battery Storage<\/span>\r\n                    <span>850kW Max<\/span>\r\n                    <span>6,000+ Homes<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- ROW 2: Floatilla LAV (Image Right, Text Left - Zig-Zag) -->\r\n        <div class=\"dh-zigzag-row\">\r\n            <div class=\"dh-zigzag-image\">\r\n                <img decoding=\"async\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/08\/E9B80CBA-F396-4441-B4DA-0E184C572406.jpg\" alt=\"Flotilla Next-Gen LAV\">\r\n            <\/div>\r\n            <div class=\"dh-zigzag-content\">\r\n                <span class=\"project-num\">\u25cf Project 04<\/span>\r\n                <h3>Flotilla <span class=\"highlight\">LAV<\/span><\/h3>\r\n                <div class=\"sub-name\">Next-Gen Lighter-Than-Air Vehicle<\/div>\r\n                <div class=\"divider\"><\/div>\r\n                <p>Inspired by ocean vessels and modern aeronautics. This 425 ft helium airship uses quiet electric vector thrust. Designed for sustainable transport, exploration, and tomorrow's skies.<\/p>\r\n                <div class=\"dh-zigzag-tags\">\r\n                    <span>425 ft Length<\/span>\r\n                    <span>85 mph Speed<\/span>\r\n                    <span>40K lbs Payload<\/span>\r\n                    <span>Helium Lift<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<!-- ==========================================================\r\n     SCROLL ANIMATION\r\n     ========================================================== -->\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    const rows = document.querySelectorAll('#dhZigzagContainer .dh-zigzag-row');\r\n    const observerOptions = { root: null, rootMargin: '0px', threshold: 0.15 };\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('visible');\r\n                observer.unobserve(entry.target);\r\n            }\r\n        });\r\n    }, observerOptions);\r\n    rows.forEach(row => { observer.observe(row); });\r\n    rows.forEach((row, index) => { row.style.transitionDelay = `${index * 0.15}s`; });\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cc87a02 e-con-full e-flex e-con e-parent\" data-id=\"cc87a02\" data-element_type=\"container\" data-e-type=\"container\" id=\"services\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bea345c elementor-widget elementor-widget-html\" data-id=\"bea345c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- RESET & BASE (widget scope) ----- *\/\r\n.dh-what-we-do * {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.dh-what-we-do {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    padding: 3rem 2rem;\r\n    background: #000000;   \/* black background *\/\r\n    border-radius: 2rem;\r\n    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;\r\n    border: 1px solid rgba(255,255,255,0.03);\r\n    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6);\r\n    transition: all 0.2s;\r\n}\r\n\r\n\/* ----- HEADER (what we do) ----- *\/\r\n.dh-wwd-header {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    justify-content: space-between;\r\n    align-items: flex-start;  \/* Changed from flex-end to flex-start - button upar *\/\r\n    margin-bottom: 2.8rem;\r\n}\r\n\r\n.dh-wwd-header .left-col h6 {\r\n    display: inline-block;\r\n    background: rgba(1, 209, 181, 0.12);\r\n    color: #01D1B5;\r\n    font-size: 0.65rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    padding: 0.25rem 1.4rem;\r\n    border-radius: 60px;\r\n    margin-bottom: 0.4rem;\r\n    border: 1px solid rgba(1, 209, 181, 0.10);\r\n}\r\n\r\n.dh-wwd-header .left-col h2 {\r\n    font-size: clamp(1.8rem, 3.2vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #ffffff;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.dh-wwd-header .left-col h2 .highlight {\r\n    color: #01D1B5;\r\n    border-bottom: 3px solid rgba(1, 209, 181, 0.2);\r\n}\r\n\r\n.dh-wwd-header .left-col p {\r\n    color: rgba(255, 255, 255, 0.70);\r\n    font-size: 0.95rem;\r\n    margin-top: 0.5rem;\r\n    max-width: 380px;\r\n    line-height: 1.5;\r\n}\r\n\r\n\/* ----- VIEW ALL SERVICES BUTTON (upar - aligned with sub-title) ----- *\/\r\n.dh-wwd-header .right-link {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: linear-gradient(135deg, #01D1B5, #01e0c4);\r\n    color: #ffffff;\r\n    padding: 0.55rem 1.6rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.75rem;\r\n    text-decoration: none !important;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 209, 181, 0.20);\r\n    white-space: nowrap;\r\n    margin-top: 80px; \/* Thora uper karne ke liye *\/\r\n}\r\n\r\n.dh-wwd-header .right-link i {\r\n    font-size: 0.65rem;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-wwd-header .right-link:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 35px rgba(1, 209, 181, 0.30);\r\n    background: linear-gradient(135deg, #01e0c4, #01f0d0);\r\n    color: #000000;\r\n}\r\n\r\n.dh-wwd-header .right-link:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n\/* ----- SERVICES GRID (cards with IMAGES) ----- *\/\r\n.dh-wwd-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 1fr);\r\n    gap: 1.8rem;\r\n    margin-top: 0.5rem;\r\n}\r\n\r\n.dh-wwd-card {\r\n    background: rgba(255, 255, 255, 0.04);\r\n    backdrop-filter: blur(2px);\r\n    border-radius: 24px;\r\n    padding: 1.6rem 1.5rem 1.8rem;\r\n    transition: all 0.3s ease;\r\n    box-shadow: 0 8px 24px rgba(0,0,0,0.2);\r\n    border: 1px solid rgba(255, 255, 255, 0.04);\r\n    position: relative;\r\n    overflow: hidden;\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.dh-wwd-card::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    right: 0;\r\n    height: 4px;\r\n    background: linear-gradient(90deg, #01D1B5, #01e0c4);\r\n    opacity: 0;\r\n    transition: 0.4s;\r\n}\r\n\r\n.dh-wwd-card:hover {\r\n    transform: translateY(-6px);\r\n    background: rgba(255, 255, 255, 0.07);\r\n    border-color: rgba(1, 209, 181, 0.15);\r\n    box-shadow: 0 20px 40px -12px rgba(0,0,0,0.4);\r\n}\r\n\r\n.dh-wwd-card:hover::before {\r\n    opacity: 1;\r\n}\r\n\r\n\/* ----- IMAGE (instead of icon) ----- *\/\r\n.dh-wwd-card .card-image {\r\n    width: 100%;\r\n    height: 150px;\r\n    object-fit: cover;\r\n    border-radius: 16px;\r\n    margin-bottom: 1rem;\r\n    background: #1a1a1a;\r\n    display: block;\r\n    transition: 0.3s;\r\n    border: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.dh-wwd-card:hover .card-image {\r\n    transform: scale(1.01);\r\n    border-color: rgba(1, 209, 181, 0.10);\r\n}\r\n\r\n\/* number badge *\/\r\n.dh-wwd-card .card-number {\r\n    font-size: 0.7rem;\r\n    font-weight: 700;\r\n    color: #01D1B5;\r\n    background: rgba(1, 209, 181, 0.08);\r\n    padding: 0.15rem 1rem;\r\n    border-radius: 60px;\r\n    display: inline-block;\r\n    margin-bottom: 0.4rem;\r\n    letter-spacing: 0.5px;\r\n    border: 1px solid rgba(1, 209, 181, 0.06);\r\n    align-self: flex-start;\r\n}\r\n\r\n.dh-wwd-card h4 {\r\n    font-size: 1.1rem;\r\n    font-weight: 700;\r\n    color: #ffffff;\r\n    margin-bottom: 0.2rem;\r\n}\r\n\r\n.dh-wwd-card p {\r\n    font-size: 0.85rem;\r\n    color: rgba(255, 255, 255, 0.70);\r\n    line-height: 1.6;\r\n    margin-bottom: 0.8rem;\r\n    flex: 1;\r\n}\r\n\r\n\/* ============================================= *\/\r\n\/* LEARN MORE BUTTON \u2013 matches About Us style   *\/\r\n\/* ============================================= *\/\r\n.dh-wwd-card .card-link {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: linear-gradient(135deg, #01D1B5, #01e0c4);\r\n    color: #ffffff;\r\n    padding: 0.55rem 1.6rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.75rem;\r\n    text-decoration: none !important;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 209, 181, 0.20);\r\n    align-self: flex-start;\r\n    margin-top: auto;\r\n}\r\n\r\n.dh-wwd-card .card-link i {\r\n    font-size: 0.65rem;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-wwd-card .card-link:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 35px rgba(1, 209, 181, 0.30);\r\n    background: linear-gradient(135deg, #01e0c4, #01f0d0);\r\n    color: #000000;\r\n}\r\n\r\n.dh-wwd-card .card-link:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n\/* small decoration dot *\/\r\n.dh-wwd-card .dot-deco {\r\n    position: absolute;\r\n    bottom: 0.8rem;\r\n    right: 0.8rem;\r\n    font-size: 0.5rem;\r\n    color: rgba(1, 209, 181, 0.06);\r\n    letter-spacing: 2px;\r\n}\r\n\r\n\/* ----- RESPONSIVE ----- *\/\r\n@media (max-width: 992px) {\r\n    .dh-wwd-grid {\r\n        grid-template-columns: repeat(2, 1fr);\r\n    }\r\n    .dh-wwd-header {\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n        gap: 0.5rem;\r\n    }\r\n    .dh-wwd-header .right-link {\r\n        white-space: normal;\r\n        margin-top: 0.2rem;\r\n    }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-what-we-do {\r\n        padding: 2rem 1.2rem;\r\n        border-radius: 1.5rem;\r\n    }\r\n    .dh-wwd-grid {\r\n        grid-template-columns: 1fr;\r\n        gap: 1.2rem;\r\n    }\r\n    .dh-wwd-header .left-col h2 {\r\n        font-size: 1.6rem;\r\n    }\r\n    .dh-wwd-header .right-link {\r\n        padding: 0.45rem 1.2rem;\r\n        font-size: 0.7rem;\r\n    }\r\n    .dh-wwd-card .card-image {\r\n        height: 120px;\r\n    }\r\n    .dh-wwd-card .card-link {\r\n        padding: 0.45rem 1.2rem;\r\n        font-size: 0.7rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== HTML WIDGET ===== -->\r\n<div class=\"dh-what-we-do\">\r\n\r\n    <!-- header -->\r\n    <div class=\"dh-wwd-header\">\r\n        <div class=\"left-col\">\r\n            <h6><i class=\"fas fa-bolt\" style=\"margin-right: 6px;\"><\/i> What We Do<\/h6>\r\n            <h2>\r\n                Engineering Solutions <br\/>\r\n                For <span class=\"highlight\">Sustainable Future<\/span>\r\n            <\/h2>\r\n            <!-- description moved here (above View All Services button) -->\r\n            <p style=\"color: rgba(255, 255, 255, 0.70); font-size: 0.95rem; margin-top: 0.5rem; max-width: 380px; line-height: 1.5;\">\r\n                Innovative environmental engineering, renewable energy, smart infrastructure, and infrastructure development.\r\n            <\/p>\r\n        <\/div>\r\n        <!-- View All Services button - upar (aligned with sub-title) -->\r\n        <!--<a href=\"#\" class=\"right-link\">-->\r\n        <!--    View All Services <i class=\"fas fa-arrow-right\"><\/i>-->\r\n        <!--<\/a>-->\r\n    <\/div>\r\n\r\n    <!-- grid cards with IMAGES -->\r\n    <div class=\"dh-wwd-grid\">\r\n\r\n        <!-- card 1 -->\r\n        <div class=\"dh-wwd-card\">\r\n            <span class=\"card-number\">No - 01<\/span>\r\n            <img decoding=\"async\" class=\"card-image\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/medium-shot-engineers-talking-outdoors.jpg\" alt=\"Renewable Energy Solutions\" \/>\r\n            <h4>Renewable Energy<\/h4>\r\n            <p>\r\n                Wind, solar, hydro &amp; geothermal hybrid systems designed for maximum efficiency and low environmental impact.\r\n            <\/p>\r\n            <a href=\"#contact\" class=\"card-link\">\r\n                Learn More <i class=\"fas fa-arrow-right\"><\/i>\r\n            <\/a>\r\n            <span class=\"dot-deco\">\u2022 \u2022 \u2022<\/span>\r\n        <\/div>\r\n\r\n        <!-- card 2 -->\r\n        <div class=\"dh-wwd-card\">\r\n            <span class=\"card-number\">No - 02<\/span>\r\n            <img decoding=\"async\" class=\"card-image\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/business-person-planning-alternative-energies.jpg\" alt=\"Green Infrastructure\" \/>\r\n            <h4>Green Infrastructure<\/h4>\r\n            <p>\r\n                Sustainable architecture, eco-friendly urban development, and carbon-neutral building solutions for communities.\r\n            <\/p>\r\n            <a href=\"#contact\" class=\"card-link\">\r\n                Learn More <i class=\"fas fa-arrow-right\"><\/i>\r\n            <\/a>\r\n            <span class=\"dot-deco\">\u2022 \u2022 \u2022<\/span>\r\n        <\/div>\r\n\r\n        <!-- card 3 -->\r\n        <div class=\"dh-wwd-card\">\r\n            <span class=\"card-number\">No - 03<\/span>\r\n            <img decoding=\"async\" class=\"card-image\" src=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/wind-turbines-generating-clean-energy-1.jpg\" alt=\"Innovation & Design\" \/>\r\n            <h4>Innovation &amp; Design<\/h4>\r\n            <p>\r\n                Advanced engineering, AI-driven monitoring, LAV technology, and future-ready transport systems.\r\n            <\/p>\r\n            <a href=\"#contact\" class=\"card-link\">\r\n                Learn More <i class=\"fas fa-arrow-right\"><\/i>\r\n            <\/a>\r\n            <span class=\"dot-deco\">\u2022 \u2022 \u2022<\/span>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n<!-- Font Awesome (if not already loaded in theme) -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\" \/>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8f9f5b0 e-con-full e-flex e-con e-parent\" data-id=\"8f9f5b0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f1d48f elementor-widget elementor-widget-html\" data-id=\"1f1d48f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- RESET & BASE (widget scope) ----- *\/\r\n.dh-testimonials * {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.dh-testimonials {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    height: 60vh;\r\n    margin: 0 auto;\r\n    padding: 3rem 2rem;\r\n    background: #ffffff;\r\n    border-radius: 2rem;\r\n    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;\r\n    border: 1px solid rgba(0,0,0,0.04);\r\n    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.04);\r\n}\r\n\r\n\/* ----- MAIN GRID: left heading + right carousel (EQUAL) ----- *\/\r\n.dh-test-grid {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 2.5rem;\r\n    align-items: stretch;\r\n}\r\n\r\n\/* ===== LEFT SIDE ===== *\/\r\n.dh-test-left {\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    padding: 0.5rem 0;\r\n}\r\n\r\n.dh-test-left .badge {\r\n    display: inline-block;\r\n    background: rgba(1, 209, 181, 0.10);\r\n    color: #01D1B5;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    padding: 0.25rem 1.2rem;\r\n    border-radius: 60px;\r\n    border: 1px solid rgba(1, 209, 181, 0.10);\r\n    align-self: flex-start;\r\n    margin-bottom: 0.6rem;\r\n}\r\n\r\n.dh-test-left h2 {\r\n    font-size: clamp(2rem, 3.2vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #000000;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n    margin-bottom: 0.2rem;\r\n}\r\n\r\n.dh-test-left h2 .highlight-in {\r\n    color: #01D1B5;\r\n    display: inline-block;\r\n}\r\n\r\n.dh-test-left .sub-desc {\r\n    color: rgba(0, 0, 0, 0.55);\r\n    font-size: 0.95rem;\r\n    line-height: 1.6;\r\n    max-width: 360px;\r\n    margin-bottom: 1rem;\r\n}\r\n\r\n\/* rating big *\/\r\n.dh-test-left .big-rating {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 1rem;\r\n}\r\n\r\n.dh-test-left .big-rating .percent {\r\n    font-size: 2.8rem;\r\n    font-weight: 900;\r\n    color: #01D1B5;\r\n    line-height: 1;\r\n}\r\n\r\n.dh-test-left .big-rating .label {\r\n    color: rgba(0, 0, 0, 0.50);\r\n    font-size: 0.8rem;\r\n    line-height: 1.4;\r\n}\r\n\r\n\/* BUTTON - NO UNDERLINE *\/\r\n.dh-test-left .review-link {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    margin-top: 1.2rem;\r\n    background: linear-gradient(135deg, #01D1B5, #01e0c4);\r\n    color: #ffffff;\r\n    padding: 0.6rem 1.8rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.8rem;\r\n    text-decoration: none !important;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 209, 181, 0.20);\r\n    border: none;\r\n    align-self: flex-start;\r\n    cursor: pointer;\r\n}\r\n\r\n.dh-test-left .review-link i {\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-test-left .review-link:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 35px rgba(1, 209, 181, 0.30);\r\n    background: linear-gradient(135deg, #01e0c4, #01f0d0);\r\n    color: #000000;\r\n    text-decoration: none !important;\r\n}\r\n\r\n.dh-test-left .review-link:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n\/* ===== RIGHT SIDE - CARDS CAROUSEL (stack effect) ===== *\/\r\n.dh-test-right {\r\n    position: relative;\r\n    overflow: visible;\r\n    border-radius: 20px;\r\n    min-height: 340px;\r\n    padding: 6px 0;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n}\r\n\r\n.dh-test-cards-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 330px;\r\n}\r\n\r\n\/* ---- CARD STACK (3 cards visible) ---- *\/\r\n.dh-test-card {\r\n    position: absolute;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    padding: 1.3rem 1.5rem;\r\n    background: #000000;\r\n    border-radius: 20px;\r\n    border: 1px solid rgba(255,255,255,0.06);\r\n    box-shadow: 0 8px 30px rgba(0,0,0,0.15);\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    gap: 1.5rem;\r\n    transition: all 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    pointer-events: none;\r\n    opacity: 0;\r\n    transform: scale(0.92) translateY(20px);\r\n}\r\n\r\n\/* Stack positioning - 3 cards visible *\/\r\n.dh-test-card.stack-0 {\r\n    top: 0px;\r\n    z-index: 3;\r\n    opacity: 1;\r\n    transform: scale(1) translateY(0);\r\n    pointer-events: auto;\r\n    box-shadow: 0 20px 60px rgba(0,0,0,0.25);\r\n}\r\n\r\n.dh-test-card.stack-1 {\r\n    top: 12px;\r\n    z-index: 2;\r\n    opacity: 0.45;\r\n    transform: scale(0.96) translateY(0);\r\n    pointer-events: none;\r\n    box-shadow: 0 8px 30px rgba(0,0,0,0.08);\r\n}\r\n\r\n.dh-test-card.stack-2 {\r\n    top: 24px;\r\n    z-index: 1;\r\n    opacity: 0.2;\r\n    transform: scale(0.92) translateY(0);\r\n    pointer-events: none;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.04);\r\n}\r\n\r\n\/* hide rest *\/\r\n.dh-test-card.stack-hidden {\r\n    opacity: 0;\r\n    transform: scale(0.85) translateY(40px);\r\n    pointer-events: none;\r\n}\r\n\r\n\/* ===== CARD CONTENT: left image + right text ===== *\/\r\n.dh-test-card .card-left {\r\n    flex-shrink: 0;\r\n    width: 76px;\r\n    height: 76px;\r\n    border-radius: 60px;\r\n    overflow: hidden;\r\n    background: linear-gradient(135deg, #01D1B5, #01e0c4);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n\r\n.dh-test-card .card-left img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    display: block;\r\n}\r\n\r\n.dh-test-card .card-right {\r\n    flex: 1;\r\n    min-width: 0;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n}\r\n\r\n.dh-test-card .stars {\r\n    color: #f5b342;\r\n    font-size: 0.8rem;\r\n    letter-spacing: 2px;\r\n    margin-bottom: 0.2rem;\r\n}\r\n\r\n.dh-test-card .stars .rating-text {\r\n    color: rgba(255,255,255,0.35);\r\n    font-size: 0.55rem;\r\n    font-weight: 600;\r\n    margin-left: 4px;\r\n}\r\n\r\n.dh-test-card .quote {\r\n    color: rgba(255,255,255,0.85);\r\n    font-size: 0.85rem;\r\n    line-height: 1.5;\r\n    margin-bottom: 0.3rem;\r\n    font-style: italic;\r\n}\r\n\r\n.dh-test-card .quote i {\r\n    color: #01D1B5;\r\n    font-size: 0.65rem;\r\n    margin: 0 2px;\r\n}\r\n\r\n.dh-test-card .client-name {\r\n    font-weight: 700;\r\n    color: #ffffff;\r\n    font-size: 0.85rem;\r\n}\r\n\r\n.dh-test-card .client-name .client-alt {\r\n    color: rgba(255,255,255,0.40);\r\n    font-weight: 400;\r\n    font-size: 0.7rem;\r\n}\r\n\r\n.dh-test-card .client-role {\r\n    color: rgba(255,255,255,0.35);\r\n    font-size: 0.65rem;\r\n}\r\n\r\n\/* ----- DOTS (indicators) ----- *\/\r\n.dh-test-dots {\r\n    display: flex;\r\n    justify-content: center;\r\n    gap: 0.5rem;\r\n    margin-top: 0.8rem;\r\n    position: relative;\r\n    z-index: 5;\r\n}\r\n\r\n.dh-test-dots .dot {\r\n    width: 8px;\r\n    height: 8px;\r\n    border-radius: 60px;\r\n    background: rgba(0, 0, 0, 0.12);\r\n    transition: all 0.4s ease;\r\n    cursor: pointer;\r\n}\r\n\r\n.dh-test-dots .dot.active {\r\n    background: #01D1B5;\r\n    width: 28px;\r\n}\r\n\r\n\/* ----- RESPONSIVE ----- *\/\r\n@media (max-width: 992px) {\r\n    .dh-test-grid {\r\n        grid-template-columns: 1fr;\r\n        gap: 2rem;\r\n    }\r\n    .dh-test-left .sub-desc {\r\n        max-width: 100%;\r\n    }\r\n    .dh-test-right {\r\n        min-height: 320px;\r\n    }\r\n    .dh-test-cards-wrapper {\r\n        height: 320px;\r\n    }\r\n    .dh-test-card {\r\n        padding: 1.2rem 1.2rem;\r\n    }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-testimonials {\r\n        padding: 2rem 1.2rem;\r\n        border-radius: 1.5rem;\r\n    }\r\n    .dh-test-right {\r\n        min-height: 300px;\r\n    }\r\n    .dh-test-cards-wrapper {\r\n        height: 300px;\r\n    }\r\n    .dh-test-card {\r\n        padding: 0.9rem 1rem;\r\n        flex-direction: column;\r\n        text-align: center;\r\n        gap: 0.6rem;\r\n    }\r\n    .dh-test-card .card-left {\r\n        width: 56px;\r\n        height: 56px;\r\n    }\r\n    .dh-test-left .big-rating .percent {\r\n        font-size: 2.2rem;\r\n    }\r\n    .dh-test-card.stack-1 {\r\n        top: 10px;\r\n    }\r\n    .dh-test-card.stack-2 {\r\n        top: 20px;\r\n    }\r\n    .dh-test-left .review-link {\r\n        padding: 0.5rem 1.2rem;\r\n        font-size: 0.7rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== HTML WIDGET ===== -->\r\n<div class=\"dh-testimonials\">\r\n\r\n    <div class=\"dh-test-grid\">\r\n\r\n        <!-- LEFT SIDE -->\r\n        <div class=\"dh-test-left\">\r\n            <span class=\"badge\"><i class=\"fas fa-star\" style=\"margin-right: 4px;\"><\/i> Testimonials<\/span>\r\n            <h2>\r\n                Why They Believe <br\/>\r\n                <span class=\"highlight-in\">In Us<\/span>\r\n            <\/h2>\r\n            <p class=\"sub-desc\">\r\n                Our clients are highly satisfied and recommend our services.\r\n            <\/p>\r\n            <div class=\"big-rating\">\r\n                <span class=\"percent\">99%<\/span>\r\n                <span class=\"label\">Positive<br\/>Reviews<\/span>\r\n            <\/div>\r\n            <a href=\"https:\/\/dhenterpriseswp2.mystartupcrew.com\/#contact\" class=\"review-link\">\r\n                Write your honest review <i class=\"fas fa-arrow-right\"><\/i>\r\n            <\/a>\r\n        <\/div>\r\n\r\n        <!-- RIGHT SIDE - CARDS CAROUSEL -->\r\n        <div class=\"dh-test-right\">\r\n            <div class=\"dh-test-cards-wrapper\" id=\"testimonialCards\">\r\n\r\n                <!-- CARD 1 -->\r\n                <div class=\"dh-test-card\" data-index=\"0\">\r\n                    <div class=\"card-left\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1573496359142-b8d87734a5a2?w=150&h=150&fit=crop&crop=face\" alt=\"Penelope Miller\" \/>\r\n                    <\/div>\r\n                    <div class=\"card-right\">\r\n                        <div class=\"stars\">\r\n                            \u2605\u2605\u2605\u2605\u2605 <span class=\"rating-text\">Rating \u2605 5.0<\/span>\r\n                        <\/div>\r\n                        <p class=\"quote\">\r\n                            <i class=\"fas fa-quote-left\"><\/i> \r\n                            I was very impressed \u2014 they provided excellent advice and guidance on our renewable energy project.\r\n                            <i class=\"fas fa-quote-right\"><\/i>\r\n                        <\/p>\r\n                        <div class=\"client-name\">\r\n                            Penelope Miller <span class=\"client-alt\">(Arjun)<\/span>\r\n                        <\/div>\r\n                        <div class=\"client-role\">Sr. Volunteer, Green Future<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- CARD 2 -->\r\n                <div class=\"dh-test-card\" data-index=\"1\">\r\n                    <div class=\"card-left\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1507003211169-0a1dd7228f2d?w=150&h=150&fit=crop&crop=face\" alt=\"James Rodriguez\" \/>\r\n                    <\/div>\r\n                    <div class=\"card-right\">\r\n                        <div class=\"stars\">\r\n                            \u2605\u2605\u2605\u2605\u2605 <span class=\"rating-text\">Rating \u2605 5.0<\/span>\r\n                        <\/div>\r\n                        <p class=\"quote\">\r\n                            <i class=\"fas fa-quote-left\"><\/i> \r\n                            DH Enterprises transformed our infrastructure with sustainable solutions. Their team is truly world-class.\r\n                            <i class=\"fas fa-quote-right\"><\/i>\r\n                        <\/p>\r\n                        <div class=\"client-name\">\r\n                            James Rodriguez <span class=\"client-alt\">(Jay)<\/span>\r\n                        <\/div>\r\n                        <div class=\"client-role\">CEO, EcoTech Solutions<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- CARD 3 -->\r\n                <div class=\"dh-test-card\" data-index=\"2\">\r\n                    <div class=\"card-left\">\r\n                        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1580489944761-15a19d654956?w=150&h=150&fit=crop&crop=face\" alt=\"Aisha Williams\" \/>\r\n                    <\/div>\r\n                    <div class=\"card-right\">\r\n                        <div class=\"stars\">\r\n                            \u2605\u2605\u2605\u2605\u2605 <span class=\"rating-text\">Rating \u2605 5.0<\/span>\r\n                        <\/div>\r\n                        <p class=\"quote\">\r\n                            <i class=\"fas fa-quote-left\"><\/i> \r\n                            The Hydro Tower System exceeded our expectations. Clean, reliable energy that powers our entire community.\r\n                            <i class=\"fas fa-quote-right\"><\/i>\r\n                        <\/p>\r\n                        <div class=\"client-name\">\r\n                            Aisha Williams <span class=\"client-alt\">(Ari)<\/span>\r\n                        <\/div>\r\n                        <div class=\"client-role\">Director, Sustainable Cities<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n            <!-- DOTS -->\r\n            <div class=\"dh-test-dots\" id=\"testDots\">\r\n                <span class=\"dot active\" data-index=\"0\"><\/span>\r\n                <span class=\"dot\" data-index=\"1\"><\/span>\r\n                <span class=\"dot\" data-index=\"2\"><\/span>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n<!-- Font Awesome -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\" \/>\r\n\r\n<!-- ===== JAVASCRIPT (stack effect, auto-slide, pause on hover) ===== -->\r\n<script>\r\n(function() {\r\n    const wrapper = document.getElementById('testimonialCards');\r\n    const cards = wrapper.querySelectorAll('.dh-test-card');\r\n    const dots = document.querySelectorAll('#testDots .dot');\r\n    let currentIndex = 0;\r\n    const total = cards.length;\r\n    let interval;\r\n\r\n    function updateStack() {\r\n        cards.forEach(c => {\r\n            c.classList.remove('stack-0', 'stack-1', 'stack-2', 'stack-hidden');\r\n        });\r\n\r\n        for (let i = 0; i < total; i++) {\r\n            const card = cards[i];\r\n            const offset = (i - currentIndex + total) % total;\r\n            if (offset === 0) {\r\n                card.classList.add('stack-0');\r\n            } else if (offset === 1) {\r\n                card.classList.add('stack-1');\r\n            } else if (offset === 2) {\r\n                card.classList.add('stack-2');\r\n            } else {\r\n                card.classList.add('stack-hidden');\r\n            }\r\n        }\r\n\r\n        dots.forEach((dot, idx) => {\r\n            dot.classList.toggle('active', idx === currentIndex);\r\n        });\r\n    }\r\n\r\n    function goTo(index) {\r\n        currentIndex = index;\r\n        updateStack();\r\n    }\r\n\r\n    function nextSlide() {\r\n        const next = (currentIndex + 1) % total;\r\n        goTo(next);\r\n    }\r\n\r\n    function startAuto() {\r\n        if (interval) clearInterval(interval);\r\n        interval = setInterval(nextSlide, 4000);\r\n    }\r\n\r\n    function stopAuto() {\r\n        if (interval) {\r\n            clearInterval(interval);\r\n            interval = null;\r\n        }\r\n    }\r\n\r\n    dots.forEach(dot => {\r\n        dot.addEventListener('click', function() {\r\n            const idx = parseInt(this.getAttribute('data-index'), 10);\r\n            stopAuto();\r\n            goTo(idx);\r\n            setTimeout(startAuto, 5000);\r\n        });\r\n    });\r\n\r\n    const rightContainer = document.querySelector('.dh-test-right');\r\n    rightContainer.addEventListener('mouseenter', stopAuto);\r\n    rightContainer.addEventListener('mouseleave', startAuto);\r\n\r\n    goTo(0);\r\n    startAuto();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-210bd26 e-con-full e-flex e-con e-parent\" data-id=\"210bd26\" data-element_type=\"container\" data-e-type=\"container\" id=\"contact\">\n\t\t\t\t<div class=\"elementor-element elementor-element-abf83e5 elementor-widget elementor-widget-html\" data-id=\"abf83e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ----- RESET & BASE (widget scope) ----- *\/\r\n.dh-contact * {\r\n    margin: 0;\r\n    padding: 0;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.dh-contact {\r\n    width: 100%;\r\n    max-width: 1400px;\r\n    margin: 0 auto;\r\n    padding: 0;\r\n    \/*border-radius: 2rem;*\/\r\n    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;\r\n    overflow: hidden;\r\n    position: relative;\r\n    background: #ffffff;\r\n    \/*border: 1px solid rgba(0,0,0,0.04);*\/\r\n    \/*box-shadow: 0 30px 60px -20px rgba(0,0,0,0.04);*\/\r\n}\r\n\r\n\/* ----- BACKGROUND IMAGE WITH OVERLAY & ZOOM ----- *\/\r\n.dh-contact-bg {\r\n    position: relative;\r\n    padding: 4rem 2.5rem;\r\n    \/*border-radius: 2rem;*\/\r\n    min-height: 480px;\r\n    display: flex;\r\n    align-items: center;\r\n    overflow: hidden;\r\n}\r\n\r\n\/* Background image with zoom animation *\/\r\n.dh-contact-bg::after {\r\n    content: '';\r\n    position: absolute;\r\n    top: -10%;\r\n    left: -10%;\r\n    right: -10%;\r\n    bottom: -10%;\r\n    background: url('https:\/\/dhenterpriseswp2.mystartupcrew.com\/wp-content\/uploads\/2026\/07\/engineers-talking-about-solar-pannels-medium-shot.jpg') center\/cover no-repeat;\r\n    z-index: 0;\r\n    animation: zoomBg 20s ease-in-out infinite alternate;\r\n    transform-origin: center;\r\n}\r\n\r\n@keyframes zoomBg {\r\n    0% {\r\n        transform: scale(1);\r\n    }\r\n    50% {\r\n        transform: scale(1.08);\r\n    }\r\n    100% {\r\n        transform: scale(1);\r\n    }\r\n}\r\n\r\n\/* Overlay gradient on top of image *\/\r\n.dh-contact-bg::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    right: 0;\r\n    bottom: 0;\r\n    background: linear-gradient(135deg, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.45) 50%, rgba(0,0,0,0.25) 100%);\r\n    \/*border-radius: 2rem;*\/\r\n    z-index: 1;\r\n}\r\n\r\n.dh-contact-bg > * {\r\n    position: relative;\r\n    z-index: 2;\r\n}\r\n\r\n\/* ----- CONTENT GRID: left header + right form (EQUAL) ----- *\/\r\n.dh-contact-grid {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 3rem;\r\n    align-items: stretch;\r\n    width: 100%;\r\n}\r\n\r\n\/* ===== LEFT SIDE - HEADER ===== *\/\r\n.dh-contact-left {\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    padding: 0.5rem 0;\r\n}\r\n\r\n.dh-contact-left .badge {\r\n    display: inline-block;\r\n    background: rgba(1, 209, 181, 0.15);\r\n    color: #01D1B5;\r\n    font-size: 0.6rem;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    padding: 0.25rem 1.4rem;\r\n    border-radius: 60px;\r\n    border: 1px solid rgba(1, 209, 181, 0.15);\r\n    margin-bottom: 0.6rem;\r\n    align-self: flex-start;\r\n}\r\n\r\n.dh-contact-left h2 {\r\n    font-size: clamp(2rem, 3.5vw, 2.8rem);\r\n    font-weight: 900;\r\n    color: #ffffff;\r\n    line-height: 1.1;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.dh-contact-left h2 .highlight {\r\n    color: #01D1B5;\r\n}\r\n\r\n.dh-contact-left p {\r\n    color: rgba(255, 255, 255, 0.70);\r\n    font-size: 0.95rem;\r\n    max-width: 440px;\r\n    line-height: 1.7;\r\n    margin-top: 0.5rem;\r\n}\r\n\r\n\/* ===== RIGHT SIDE - CONTACT FORM (glass effect) ===== *\/\r\n.dh-contact-form {\r\n    background: rgba(255,255,255,0.06);\r\n    backdrop-filter: blur(12px);\r\n    border-radius: 24px;\r\n    padding: 2rem 2.2rem;\r\n    border: 1px solid rgba(255,255,255,0.06);\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    min-height: 380px;\r\n}\r\n\r\n.dh-contact-form .form-title {\r\n    font-size: 1.2rem;\r\n    font-weight: 700;\r\n    color: #ffffff;\r\n    text-align: center;\r\n}\r\n\r\n.dh-contact-form .form-title .highlight {\r\n    color: #01D1B5;\r\n}\r\n\r\n.dh-contact-form .form-sub {\r\n    color: rgba(255, 255, 255, 0.50);\r\n    font-size: 0.85rem;\r\n    text-align: center;\r\n    margin-bottom: 1.2rem;\r\n}\r\n\r\n.dh-contact-form .form-row {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 0.8rem;\r\n}\r\n\r\n.dh-contact-form .form-group {\r\n    margin-bottom: 0.8rem;\r\n}\r\n\r\n.dh-contact-form .form-group label {\r\n    display: block;\r\n    font-size: 0.65rem;\r\n    font-weight: 600;\r\n    color: rgba(255,255,255,0.60);\r\n    text-transform: uppercase;\r\n    letter-spacing: 0.5px;\r\n    margin-bottom: 0.2rem;\r\n}\r\n\r\n.dh-contact-form .form-group input,\r\n.dh-contact-form .form-group textarea {\r\n    width: 100%;\r\n    padding: 0.7rem 1rem;\r\n    border: 1.5px solid rgba(255,255,255,0.08);\r\n    border-radius: 12px;\r\n    font-size: 0.85rem;\r\n    font-family: 'Inter', sans-serif;\r\n    background: rgba(255,255,255,0.04);\r\n    transition: all 0.3s ease;\r\n    color: #ffffff;\r\n    outline: none;\r\n}\r\n\r\n.dh-contact-form .form-group input::placeholder,\r\n.dh-contact-form .form-group textarea::placeholder {\r\n    color: rgba(255,255,255,0.30);\r\n}\r\n\r\n.dh-contact-form .form-group input:focus,\r\n.dh-contact-form .form-group textarea:focus {\r\n    border-color: #01D1B5;\r\n    box-shadow: 0 0 0 4px rgba(1, 209, 181, 0.06);\r\n    background: rgba(255,255,255,0.06);\r\n}\r\n\r\n.dh-contact-form .form-group textarea {\r\n    min-height: 80px;\r\n    resize: vertical;\r\n}\r\n\r\n\/* form button - matches other sections *\/\r\n.dh-contact-form .submit-btn {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0.6rem;\r\n    background: linear-gradient(135deg, #01D1B5, #01e0c4);\r\n    color: #ffffff;\r\n    padding: 0.7rem 2.2rem;\r\n    border-radius: 60px;\r\n    font-weight: 700;\r\n    font-size: 0.85rem;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    box-shadow: 0 4px 20px rgba(1, 209, 181, 0.20);\r\n    text-decoration: none !important;\r\n    margin-top: 0.2rem;\r\n}\r\n\r\n.dh-contact-form .submit-btn i {\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.dh-contact-form .submit-btn:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 12px 35px rgba(1, 209, 181, 0.30);\r\n    background: linear-gradient(135deg, #01e0c4, #01f0d0);\r\n    color: #000000;\r\n    text-decoration: none !important;\r\n}\r\n\r\n.dh-contact-form .submit-btn:hover i {\r\n    transform: translateX(5px);\r\n}\r\n\r\n.dh-contact-form .btn-wrap {\r\n    text-align: center;\r\n    margin-top: 0.3rem;\r\n}\r\n\r\n\/* ----- RESPONSIVE ----- *\/\r\n@media (max-width: 992px) {\r\n    .dh-contact-bg {\r\n        padding: 3rem 1.8rem;\r\n        min-height: 420px;\r\n    }\r\n    .dh-contact-grid {\r\n        grid-template-columns: 1fr;\r\n        gap: 2rem;\r\n    }\r\n    .dh-contact-left {\r\n        text-align: center;\r\n    }\r\n    .dh-contact-left .badge {\r\n        align-self: center;\r\n    }\r\n    .dh-contact-left p {\r\n        max-width: 100%;\r\n    }\r\n    .dh-contact-form .form-row {\r\n        grid-template-columns: 1fr;\r\n    }\r\n    .dh-contact-form {\r\n        padding: 1.8rem 1.5rem;\r\n        min-height: auto;\r\n    }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n    .dh-contact-bg {\r\n        padding: 2rem 1.2rem;\r\n        border-radius: 1.5rem;\r\n        min-height: 380px;\r\n    }\r\n    .dh-contact-bg::before {\r\n        border-radius: 1.5rem;\r\n    }\r\n    .dh-contact-form {\r\n        padding: 1.5rem 1.2rem;\r\n    }\r\n    .dh-contact-left h2 {\r\n        font-size: 1.8rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<!-- ===== HTML WIDGET ===== -->\r\n<div class=\"dh-contact\">\r\n\r\n    <div class=\"dh-contact-bg\">\r\n\r\n        <div class=\"dh-contact-grid\">\r\n\r\n            <!-- LEFT SIDE - HEADER -->\r\n            <div class=\"dh-contact-left\">\r\n                <span class=\"badge\"><i class=\"fas fa-envelope\" style=\"margin-right: 4px;\"><\/i> Get in Touch<\/span>\r\n                <h2>\r\n                    Let's <span class=\"highlight\">Connect<\/span> &amp; Build<br\/>\r\n                    a Sustainable Future\r\n                <\/h2>\r\n                <p>\r\n                    Have a project in mind? We'd love to hear from you. Reach out and let's make a difference together.\r\n                <\/p>\r\n            <\/div>\r\n\r\n            <!-- RIGHT SIDE - CONTACT FORM -->\r\n            <div class=\"dh-contact-form\">\r\n                <div class=\"form-title\">Send us a <span class=\"highlight\">Message<\/span><\/div>\r\n                <p class=\"form-sub\">We'll get back to you within 24 hours.<\/p>\r\n\r\n                <form>\r\n                    <div class=\"form-row\">\r\n                        <div class=\"form-group\">\r\n                            <label for=\"contactName\">Full Name<\/label>\r\n                            <input type=\"text\" id=\"contactName\" placeholder=\"Your full name\" \/>\r\n                        <\/div>\r\n                        <div class=\"form-group\">\r\n                            <label for=\"contactEmail\">Email Address<\/label>\r\n                            <input type=\"email\" id=\"contactEmail\" placeholder=\"your@email.com\" \/>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <div class=\"form-group\">\r\n                        <label for=\"contactSubject\">Subject<\/label>\r\n                        <input type=\"text\" id=\"contactSubject\" placeholder=\"How can we help?\" \/>\r\n                    <\/div>\r\n\r\n                    <div class=\"form-group\">\r\n                        <label for=\"contactMessage\">Message<\/label>\r\n                        <textarea id=\"contactMessage\" placeholder=\"Tell us about your project...\"><\/textarea>\r\n                    <\/div>\r\n\r\n                    <div class=\"btn-wrap\">\r\n                        <button type=\"submit\" class=\"submit-btn\">\r\n                            Send Message <i class=\"fas fa-arrow-right\"><\/i>\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/form>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<!-- Font Awesome -->\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\" \/>\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>Engineering Innovation Engineering the Future of Sustainable Energy DH ENTERPRISES develops innovative engineering solutions that integrate wind, solar, and hydro [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":550,"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":652,"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/652"}],"wp:attachment":[{"href":"https:\/\/dhenterpriseswp2.mystartupcrew.com\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}