File size: 9,877 Bytes
950bce1 2750d05 950bce1 2750d05 950bce1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Services - Beck-Publishing | Custom Software Development & SaaS Solutions</title>
<meta name="description" content="Professional software development services including custom software, SaaS platforms, AI applications, security architecture, and automation solutions.">
<link rel="stylesheet" href="style.css">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
</head>
<body class="bg-gray-900 text-gray-100">
<custom-navbar></custom-navbar>
<main class="pt-20">
<!-- Hero Section -->
<section class="py-20 px-4 bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900">
<div class="max-w-4xl mx-auto text-center">
<img src="https://huggingface.co/spaces/dbeck22/beckpublishing-secure-code-crafters/resolve/main/images/services-diagram.png"
alt="Services Diagram"
class="w-64 h-64 mx-auto mb-8 object-contain">
<h1 class="text-4xl md:text-5xl font-bold mb-6">Expert Development Services</h1>
<p class="text-xl text-gray-300">Professional solutions tailored to your unique business challenges</p>
</div>
</section>
<!-- Services Grid -->
<section class="py-20 px-4" id="services">
<div class="max-w-6xl mx-auto">
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Custom Software -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift" id="custom-software">
<i data-feather="code" class="h-12 w-12 text-blue-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">Custom Software Development</h2>
<p class="text-gray-300 mb-4">
Tailored solutions built from the ground up to solve your specific business problems.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Web applications</li>
<li>Desktop software</li>
<li>Mobile apps</li>
<li>Internal tools</li>
</ul>
</div>
<!-- SaaS Platforms -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift" id="saas">
<i data-feather="cloud" class="h-12 w-12 text-purple-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">SaaS & Web Platforms</h2>
<p class="text-gray-300 mb-4">
Scalable subscription-based applications that grow with your user base.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Multi-tenant architecture</li>
<li>Subscription management</li>
<li>API development</li>
<li>Cloud deployment</li>
</ul>
</div>
<!-- AI Applications -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift" id="ai">
<i data-feather="cpu" class="h-12 w-12 text-green-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">AI-Driven Applications</h2>
<p class="text-gray-300 mb-4">
Intelligent systems that leverage machine learning and automation.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Machine learning models</li>
<li>Natural language processing</li>
<li>Predictive analytics</li>
<li>Automation workflows</li>
</ul>
</div>
<!-- Security Architecture -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift" id="security">
<i data-feather="shield" class="h-12 w-12 text-red-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">Infrastructure & Security Architecture</h2>
<p class="text-gray-300 mb-4">
Fortified systems built with security as a primary concern.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Secure infrastructure setup</li>
<li>Data encryption</li>
<li>Access controls</li>
<li>Compliance auditing</li>
</ul>
</div>
<!-- Automation -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift" id="automation">
<i data-feather="refresh-cw" class="h-12 w-12 text-yellow-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">Automation & Internal Tools</h2>
<p class="text-gray-300 mb-4">
Streamline operations with custom automation solutions.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Workflow automation</li>
<li>Data processing</li>
<li>Integration systems</li>
<li>Custom dashboards</li>
</ul>
</div>
<!-- Publishing -->
<div class="bg-gray-800 rounded-xl p-8 hover-lift">
<i data-feather="book" class="h-12 w-12 text-indigo-400 mb-6"></i>
<h2 class="text-2xl font-bold mb-4">Publishing Platforms</h2>
<p class="text-gray-300 mb-4">
Complete digital publishing solutions for content creators.
</p>
<ul class="text-gray-400 text-sm space-y-2">
<li>Content management</li>
<li>E-book platforms</li>
<li>Digital distribution</li>
<li>Monetization systems</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Process Section -->
<section class="py-20 px-4 bg-gray-800">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-3xl font-bold mb-12">How I Work</h2>
<div class="grid md:grid-cols-4 gap-8">
<div class="text-center">
<div class="bg-blue-600 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<span class="text-white font-bold text-xl">1</span>
</div>
<h3 class="font-semibold mb-2">Discover</h3>
<p class="text-gray-300 text-sm">Understand your requirements and goals</p>
</div>
<div class="text-center">
<div class="bg-purple-600 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<span class="text-white font-bold text-xl">2</span>
</div>
<h3 class="font-semibold mb-2">Plan</h3>
<p class="text-gray-300 text-sm">Architect the solution and timeline</p>
</div>
<div class="text-center">
<div class="bg-green-600 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<span class="text-white font-bold text-xl">3</span>
</div>
<h3 class="font-semibold mb-2">Build</h3>
<p class="text-gray-300 text-sm">Develop with quality and precision</p>
</div>
<div class="text-center">
<div class="bg-red-600 w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<span class="text-white font-bold text-xl">4</span>
</div>
<h3 class="font-semibold mb-2">Deliver</h3>
<p class="text-gray-300 text-sm">Deploy and support the solution</p>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-20 px-4 bg-gradient-to-r from-blue-900 to-purple-900">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-3xl md:text-4xl font-bold mb-6">Start Your Project Today</h2>
<p class="text-xl text-blue-200 mb-10">Let's discuss how I can help solve your technical challenges.</p>
<a href="/hire.html" class="bg-white text-blue-900 hover:bg-blue-50 font-bold py-4 px-12 rounded-full text-lg transition duration-300 transform hover:scale-105">
Get Started
</a>
</div>
</section>
</main>
<custom-footer></custom-footer>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
<script src="script.js"></script>
<script>feather.replace();</script>
</body>
</html> |