.elementor-33 .elementor-element.elementor-element-2265513{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:var( --e-global-color-accent );--border-color:var( --e-global-color-accent );--border-radius:37px 37px 37px 37px;--margin-top:80px;--margin-bottom:0px;--margin-left:800px;--margin-right:0px;--padding-top:3px;--padding-bottom:3px;--padding-left:3px;--padding-right:3px;}.elementor-33 .elementor-element.elementor-element-2265513.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-icon-box.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon-box.elementor-view-framed .elementor-icon, .elementor-widget-icon-box.elementor-view-default .elementor-icon{fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-title, .elementor-widget-icon-box .elementor-icon-box-title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-icon-box .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box:has(:hover) .elementor-icon-box-title,
					 .elementor-widget-icon-box:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-33 .elementor-element.elementor-element-ac5a436{margin:5px 5px calc(var(--kit-widget-spacing, 0px) + 5px) 5px;padding:0px 0px 0px 0px;}.elementor-33 .elementor-element.elementor-element-ac5a436.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon-box-wrapper{align-items:center;gap:10px;}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon-box-title{margin-block-end:0px;text-shadow:0px 0px 10px rgba(0,0,0,0.3);color:#F59E0B;}.elementor-33 .elementor-element.elementor-element-ac5a436.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-accent );fill:var( --e-global-color-accent );color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-ac5a436.elementor-view-framed .elementor-icon, .elementor-33 .elementor-element.elementor-element-ac5a436.elementor-view-default .elementor-icon{fill:var( --e-global-color-accent );color:var( --e-global-color-accent );border-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-ac5a436.elementor-view-framed .elementor-icon{background-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon{font-size:7px;padding:1px;border-radius:13px 13px 13px 13px;}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon i{transform:rotate(6deg);}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon-box-title, .elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon-box-title a{font-family:"DM Sans", Sans-serif;font-size:13px;font-weight:600;line-height:2px;letter-spacing:0.8px;}.elementor-33 .elementor-element.elementor-element-ac5a436:has(:hover) .elementor-icon-box-title,
					 .elementor-33 .elementor-element.elementor-element-ac5a436:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-ac5a436 .elementor-icon-box-description{font-family:"DM Sans", Sans-serif;font-size:3px;font-weight:400;color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-91884a1{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:780px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-91884a1.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-33 .elementor-element.elementor-element-c744803{width:var( --container-widget-width, 93.847% );max-width:93.847%;--container-widget-width:93.847%;--container-widget-flex-grow:0;}.elementor-33 .elementor-element.elementor-element-c744803.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-33 .elementor-element.elementor-element-c744803 .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-105ee03{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:750px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-105ee03.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-33 .elementor-element.elementor-element-17f6a1b{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:750px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-17f6a1b.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-33 .elementor-element.elementor-element-cb2f285{--divider-border-style:solid;--divider-color:#ADAEB147;--divider-border-width:1px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-33 .elementor-element.elementor-element-cb2f285 .elementor-divider-separator{width:100%;}.elementor-33 .elementor-element.elementor-element-cb2f285 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-33 .elementor-element.elementor-element-fa52908{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:-24px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-33 .elementor-element.elementor-element-b03f2cf .elementor-icon-box-wrapper{align-items:start;gap:15px;}.elementor-33 .elementor-element.elementor-element-b03f2cf.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-b03f2cf.elementor-view-framed .elementor-icon, .elementor-33 .elementor-element.elementor-element-b03f2cf.elementor-view-default .elementor-icon{fill:var( --e-global-color-accent );color:var( --e-global-color-accent );border-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-b03f2cf .elementor-icon{font-size:23px;}.elementor-33 .elementor-element.elementor-element-b03f2cf .elementor-icon-box-title, .elementor-33 .elementor-element.elementor-element-b03f2cf .elementor-icon-box-title a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-33 .elementor-element.elementor-element-b03f2cf .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-b03f2cf:has(:hover) .elementor-icon-box-title,
					 .elementor-33 .elementor-element.elementor-element-b03f2cf:has(:focus) .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-23d0142 .elementor-icon-box-wrapper{align-items:start;gap:15px;}.elementor-33 .elementor-element.elementor-element-23d0142.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-23d0142.elementor-view-framed .elementor-icon, .elementor-33 .elementor-element.elementor-element-23d0142.elementor-view-default .elementor-icon{fill:var( --e-global-color-accent );color:var( --e-global-color-accent );border-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-23d0142 .elementor-icon{font-size:23px;}.elementor-33 .elementor-element.elementor-element-23d0142 .elementor-icon-box-title, .elementor-33 .elementor-element.elementor-element-23d0142 .elementor-icon-box-title a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-33 .elementor-element.elementor-element-23d0142 .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-23d0142:has(:hover) .elementor-icon-box-title,
					 .elementor-33 .elementor-element.elementor-element-23d0142:has(:focus) .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon-box-wrapper{align-items:start;gap:15px;}.elementor-33 .elementor-element.elementor-element-16460a2.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-16460a2.elementor-view-framed .elementor-icon, .elementor-33 .elementor-element.elementor-element-16460a2.elementor-view-default .elementor-icon{fill:var( --e-global-color-accent );color:var( --e-global-color-accent );border-color:var( --e-global-color-accent );}.elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon{font-size:23px;}.elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon-box-title, .elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon-box-title a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-16460a2:has(:hover) .elementor-icon-box-title,
					 .elementor-33 .elementor-element.elementor-element-16460a2:has(:focus) .elementor-icon-box-title{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-16460a2 .elementor-icon-box-description{color:#FFFFFF;}.elementor-33 .elementor-element.elementor-element-e9539df{--divider-border-style:solid;--divider-color:#ADAEB147;--divider-border-width:1px;margin:-55px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-33 .elementor-element.elementor-element-e9539df .elementor-divider-separator{width:100%;}.elementor-33 .elementor-element.elementor-element-e9539df .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-33 .elementor-element.elementor-element-8e0ce35{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:750px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-8e0ce35.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-33 .elementor-element.elementor-element-1f5bb30{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-33 .elementor-element.elementor-element-006396a .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-33 .elementor-element.elementor-element-006396a .elementor-button{border-radius:8px 8px 8px 8px;}.elementor-33 .elementor-element.elementor-element-ac29fc6 .elementor-button{background-color:#F59E0B;fill:var( --e-global-color-text );color:var( --e-global-color-text );border-radius:8px 8px 8px 8px;}.elementor-33 .elementor-element.elementor-element-ac29fc6 .elementor-button-content-wrapper{flex-direction:row;}.elementor-33 .elementor-element.elementor-element-ac29fc6 .elementor-button .elementor-button-content-wrapper{gap:11px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-33 .elementor-element.elementor-element-de65972{margin:150px 400px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-33 .elementor-element.elementor-element-2265513{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-91884a1{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-105ee03{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-17f6a1b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-fa52908{--grid-auto-flow:row;}.elementor-33 .elementor-element.elementor-element-8e0ce35{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-33 .elementor-element.elementor-element-1f5bb30{--grid-auto-flow:row;}}@media(min-width:768px){.elementor-33 .elementor-element.elementor-element-2265513{--width:24.69%;}.elementor-33 .elementor-element.elementor-element-91884a1{--width:32%;}.elementor-33 .elementor-element.elementor-element-105ee03{--width:43%;}.elementor-33 .elementor-element.elementor-element-17f6a1b{--width:52%;}.elementor-33 .elementor-element.elementor-element-8e0ce35{--width:43%;}}@media(max-width:1024px) and (min-width:768px){.elementor-33 .elementor-element.elementor-element-2265513{--width:367.594px;}.elementor-33 .elementor-element.elementor-element-91884a1{--width:352.594px;}.elementor-33 .elementor-element.elementor-element-105ee03{--width:339px;}.elementor-33 .elementor-element.elementor-element-17f6a1b{--width:365.219px;}.elementor-33 .elementor-element.elementor-element-8e0ce35{--width:386.75px;}}@media(max-width:767px){.elementor-33 .elementor-element.elementor-element-2265513{--width:295px;}.elementor-33 .elementor-element.elementor-element-ac5a436{width:var( --container-widget-width, 985px );max-width:985px;--container-widget-width:985px;--container-widget-flex-grow:0;}.elementor-33 .elementor-element.elementor-element-fa52908{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-33 .elementor-element.elementor-element-1f5bb30{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS */<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ebola PPE Kits - Hero Section Blueprint</title>
    <!-- Tailwind CSS for high-end rapid styling -->
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Merriweather:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    
    <script>
        tailwind.config = {
            theme: {
                extend: {
                    colors: {
                        navy: {
                            DEFAULT: '#0b1329',
                            dark: '#050a14',
                            light: '#1c2541'
                        },
                        warning: '#f59e0b', // Accent Orange for emergency feel
                        success: '#10b981'
                    },
                    fontFamily: {
                        sans: ['DM Sans', 'sans-serif'],
                        serif: ['Merriweather', 'serif']
                    }
                }
            }
        }
    </script>
    <style>
        .hero-bg {
            background-image: linear-gradient(to right, rgba(11, 19, 41, 0.95) 45%, rgba(11, 19, 41, 0.7) 100%), 
                              url('http://googleusercontent.com/image_collection/image_retrieval/10753741219566361273_0');
            background-size: cover;
            background-position: center;
        }
    </style>
</head>
<body class="bg-navy text-gray-200 font-sans min-h-screen">

    <!-- HERO SECTION CONTAINER -->
    <div class="hero-bg relative w-full h-screen flex flex-col justify-between overflow-hidden">
        
        <!-- Subtle Top Header -->
        <header class="w-full px-8 md:px-16 py-6 flex justify-between items-center border-b border-gray-800 backdrop-blur-sm bg-navy/20 z-10">
            <div class="flex items-center space-x-3">
                <div class="w-10 h-10 bg-warning rounded flex items-center justify-center font-bold text-navy text-xl">E</div>
                <span class="text-xl font-bold tracking-wider text-white">EbolaPPEKits<span class="text-warning">.com</span></span>
            </div>
            <div class="flex items-center space-x-6">
                <span class="hidden md:inline-flex items-center text-sm text-gray-400">
                    <span class="w-2.5 h-2.5 bg-success rounded-full mr-2 animate-pulse"></span>
                    Emergency Supply Chain Active
                </span>
                <a href="tel:#" class="text-white hover:text-warning transition text-sm font-medium"><i class="fa-solid fa-phone mr-1"></i> Hot-line: Support 24/7</a>
            </div>
        </header>

        <!-- MAIN HERO CONTENT -->
        <main class="flex-grow flex items-center px-8 md:px-16 z-10">
            <div class="max-w-3xl space-y-8">
                
                <!-- Trust Tagline -->
                <div class="inline-flex items-center space-x-2 bg-warning/10 border border-warning/30 rounded-full px-4 py-1.5">
                    <span class="flex h-2 w-2 relative">
                        <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-warning opacity-75"></span>
                        <span class="relative inline-flex rounded-full h-2 w-2 bg-warning"></span>
                    </span>
                    <span class="text-xs font-bold uppercase tracking-widest text-warning">Global NGO & Ministry of Health Supplier</span>
                </div>

                <!-- Main Headline -->
                <h1 class="text-4xl md:text-6xl font-bold text-white font-serif leading-tight">
                    Custom Ebola PPE Kitting & <span class="text-transparent bg-clip-text bg-gradient-to-r from-warning to-amber-500">Mission-Critical</span> Logistics.
                </h1>

                <!-- Subtitle (Directly addresses WHO/UN procurement pain points) -->
                <p class="text-lg md:text-xl text-gray-300 leading-relaxed font-light">
                    Built for Rapid Deployment. We transform raw bulk medical consumables into sterile, pre-packaged, individual-use kits. Zero supply confusion on the front line. Delivered directly to target ports in record time.
                </p>

                <!-- High-Value Trust Points -->
                <div class="grid grid-cols-2 md:grid-cols-3 gap-4 py-2 border-t border-b border-gray-800">
                    <div class="flex items-center space-x-2 text-sm text-gray-300">
                        <i class="fa-solid fa-circle-check text-warning text-lg"></i>
                        <span>CE / EN / FDA Certified</span>
                    </div>
                    <div class="flex items-center space-x-2 text-sm text-gray-300">
                        <i class="fa-solid fa-circle-check text-warning text-lg"></i>
                        <span>100% Sterile Kitting</span>
                    </div>
                    <div class="flex items-center space-x-2 text-sm text-gray-300">
                        <i class="fa-solid fa-truck-fast text-warning text-lg"></i>
                        <span>Emergency Logistics Support</span>
                    </div>
                </div>

                <!-- CTA BUTTONS BLOCK -->
                <div class="flex flex-col sm:flex-row gap-4 pt-4">
                    <!-- MAIN BUTTON (Triggers the custom Form Popup) -->
                    <button onclick="openModal()" class="group relative px-8 py-5 bg-warning text-navy font-bold rounded-lg hover:bg-white hover:text-navy transition duration-300 text-center flex items-center justify-center space-x-3 shadow-lg shadow-warning/20">
                        <span>Request Rapid Kitting Quote</span>
                        <i class="fa-solid fa-arrow-right group-hover:translate-x-1 transition-transform"></i>
                    </button>
                    
                    <!-- SECONDARY BUTTON (Simulates scroll to AI assistant) -->
                    <button onclick="scrollToAI()" class="px-8 py-5 border border-gray-600 text-white font-semibold rounded-lg hover:bg-gray-800/50 hover:border-warning transition duration-300 text-center flex items-center justify-center space-x-2">
                        <i class="fa-solid fa-robot text-warning"></i>
                        <span>Configure with AI Specialist</span>
                    </button>
                </div>
                
            </div>
        </main>

        <!-- Dynamic Trust Bar Footer -->
        <footer class="w-full px-8 md:px-16 py-6 border-t border-gray-900 bg-navy-dark/90 flex flex-col md:flex-row justify-between items-center text-xs text-gray-500 gap-4 z-10">
            <div>
                <span>* Ideal for UNHCR, WHO, ministries of health, and disaster relief NGOs.</span>
            </div>
            <div class="flex space-x-6">
                <span><i class="fa-solid fa-box-open text-warning mr-1"></i> Custom Branding available</span>
                <span><i class="fa-solid fa-shield-halved text-warning mr-1"></i> Multi-sterile packaging options</span>
            </div>
        </footer>
    </div>

    <!-- ==================== INTERACTIVE INQUIRY MODAL (THE ACTION) ==================== -->
    <div id="inquiryModal" class="fixed inset-0 bg-navy/80 backdrop-blur-md hidden justify-center items-center z-50 p-4 transition-all duration-300">
        <div class="bg-navy-light border border-gray-700 w-full max-w-2xl rounded-2xl shadow-2xl p-6 md:p-10 relative">
            
            <!-- Close Modal -->
            <button onclick="closeModal()" class="absolute top-6 right-6 text-gray-400 hover:text-white text-xl">
                <i class="fa-solid fa-xmark"></i>
            </button>

            <!-- Modal Header -->
            <div class="mb-8">
                <div class="inline-block bg-warning text-navy text-xs font-bold px-3 py-1 rounded mb-3 uppercase tracking-wider">Fast-Track Channel</div>
                <h2 class="text-2xl md:text-3xl font-bold text-white font-serif">Configure & Get Price Quote</h2>
                <p class="text-sm text-gray-400 mt-2">Our kitting engineers will reply with full pricing and logistics estimate within <span class="text-warning font-semibold">4 Hours</span>.</p>
            </div>

            <!-- Double-Track Inquiry Form -->
            <form action="#" class="space-y-6">
                <!-- Select Standard Kit vs Custom Request -->
                <div>
                    <label class="block text-sm font-semibold text-gray-300 mb-2">1. Select Kitting Option</label>
                    <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
                        <label class="relative flex p-4 rounded-lg border border-gray-700 bg-navy-dark cursor-pointer hover:border-warning/50">
                            <input type="radio" name="kitType" value="standard" class="mt-1 mr-3 accent-warning" checked>
                            <span class="block">
                                <span class="block font-bold text-white text-sm">Need Standard Ebola PPE Kit</span>
                                <span class="block text-xs text-gray-400 mt-1">Based on WHO pre-configurations</span>
                            </span>
                        </label>
                        <label class="relative flex p-4 rounded-lg border border-gray-700 bg-navy-dark cursor-pointer hover:border-warning/50">
                            <input type="radio" name="kitType" value="custom" class="mt-1 mr-3 accent-warning">
                            <span class="block">
                                <span class="block font-bold text-white text-sm">Need Custom / Cytotoxic Spill Kit</span>
                                <span class="block text-xs text-gray-400 mt-1">Upload Excel manifest or describe details</span>
                            </span>
                        </label>
                    </div>
                </div>

                <!-- Excel / PDF Upload Zone (Highly Converts B2B Buyers) -->
                <div id="uploadContainer" class="p-5 border-2 border-dashed border-gray-700 rounded-lg bg-navy-dark/50 hover:border-warning/50 transition">
                    <div class="text-center">
                        <i class="fa-solid fa-file-excel text-3xl text-gray-500 mb-3"></i>
                        <p class="text-sm text-gray-300 font-medium">Already have a supply list? Drag & Drop Excel/PDF here</p>
                        <p class="text-xs text-gray-500 mt-1">Or click to select files (Supports .xlsx, .xls, .pdf up to 10MB)</p>
                        <input type="file" class="hidden" id="manifestUpload">
                        <button type="button" onclick="document.getElementById('manifestUpload').click()" class="mt-3 inline-flex px-4 py-1.5 border border-gray-600 hover:border-warning text-xs text-white rounded font-medium transition">Choose File</button>
                    </div>
                </div>

                <!-- Basic Contact and Logistics Info -->
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2">Corporate/NGO Email *</label>
                        <input type="email" required placeholder="name@organization.org" class="w-full px-4 py-3 bg-navy-dark border border-gray-700 rounded-lg text-white focus:outline-none focus:border-warning">
                    </div>
                    <div>
                        <label class="block text-xs font-semibold text-gray-400 uppercase tracking-wider mb-2">Destination Port / Country</label>
                        <input type="text" placeholder="e.g. Port of Mombasa, Kenya" class="w-full px-4 py-3 bg-navy-dark border border-gray-700 rounded-lg text-white focus:outline-none focus:border-warning">
                    </div>
                </div>

                <!-- Submit Button -->
                <button type="submit" class="w-full py-4 bg-warning hover:bg-white text-navy font-bold rounded-lg transition duration-300 flex items-center justify-center space-x-2">
                    <i class="fa-solid fa-paper-plane"></i>
                    <span>Generate Kitting Solution & Price in 4 Hours</span>
                </button>
            </form>
        </div>
    </div>

    <!-- SIMPLE JAVASCRIPT FOR MOCKUP ACTIONS -->
    <script>
        function openModal() {
            const modal = document.getElementById('inquiryModal');
            modal.style.display = 'flex';
        }

        function closeModal() {
            const modal = document.getElementById('inquiryModal');
            modal.style.display = 'none';
        }

        function scrollToAI() {
            alert("This button in a live site triggers a smooth scroll to your 'AI Engine Bot Section' (at the bottom of your landing page), opening the AI Chat interface with a custom prompt to help the user configure their kit dynamically!");
        }
    </script>
</body>
</html>/* End custom CSS */