upgrade to garuda centric web

This commit is contained in:
2025-06-23 08:08:35 -04:00
parent 5bae9900e8
commit 43e4e6604f
10 changed files with 497 additions and 340 deletions

View File

View File

View File

@@ -1,8 +1,8 @@
services:
www.valorantdigital.com:
valorantdigital.com:
container_name: www.valorantdigital.com
container_name: valorantdigital.com
image: softwareshinobi/www.valorantdigital.com
@@ -15,4 +15,3 @@ services:
ports:
- 8000:80

93
garuda.html Normal file
View File

@@ -0,0 +1,93 @@
<!-- valorantdigital.com/garuda landing page -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Project Garuda | Valorant Digital</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.3.2/dist/superhero/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<style>
.hero {
padding: 100px 0;
text-align: center;
background: linear-gradient(rgba(18, 18, 18, 0.85), rgba(18, 18, 18, 0.85)), url('https://images.unsplash.com/photo-1498050108023-c5249f4df085') no-repeat center center;
background-size: cover;
color: white;
}
.hero h1 {
font-weight: 800;
font-size: 3.5rem;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<div class="container">
<a class="navbar-brand fw-bold" href="/"><i class="fa-solid fa-robot me-2"></i>Garuda</a>
</div>
</nav>
<section class="hero">
<div class="container">
<h1>Stop Prompting. Start Producing.</h1>
<p class="lead mt-4">Garuda is the AI content factory that turns your brand voice into publish-ready content at scale. One input. One result. Every time.</p>
<a href="#get-started" class="btn btn-lg btn-outline-light mt-4">Launch My Factory</a>
</div>
</section>
<section class="container py-5 text-light">
<div class="row text-center">
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-user-pen me-2"></i> Your Voice, Every Time</h3>
<p>Lock in your clients' brand and tone. Garuda writes content that sounds like them — not like AI.</p>
</div>
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-gauge-high me-2"></i> Operational Speed</h3>
<p>No fluff. No fiddling. Drop in the topic and get publish-ready content in minutes.</p>
</div>
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-gears me-2"></i> Fully Installed</h3>
<p>We dont hand you tools — we build the entire system for your team, ready to run.</p>
</div>
</div>
</section>
<section class="bg-light py-5 text-dark">
<div class="container text-center">
<h2 class="section-title">How It Works</h2>
<div class="row">
<div class="col-md-4 mb-4">
<i class="fa-solid fa-file-circle-plus fa-2x text-primary mb-2"></i>
<h5>Step 1: Submit a Topic</h5>
<p>Your input. Their brand. We handle the rest.</p>
</div>
<div class="col-md-4 mb-4">
<i class="fa-solid fa-brain fa-2x text-primary mb-2"></i>
<h5>Step 2: Garuda Generates</h5>
<p>We combine brand voice, format, and purpose into one high-precision prompt.</p>
</div>
<div class="col-md-4 mb-4">
<i class="fa-solid fa-paper-plane fa-2x text-primary mb-2"></i>
<h5>Step 3: You Get Output</h5>
<p>Clean content. Headline. CTA. Ready to ship or publish.</p>
</div>
</div>
</div>
</section>
<section class="container py-5" id="get-started">
<div class="text-center text-light">
<h2 class="section-title">Make Your First Request</h2>
<p class="lead">Well handle your brand voice, audience, formatting, and even headline generation. You just give us the topic.</p>
<a href="mailto:hello@valorantdigital.com" class="btn btn-lg btn-primary mt-4">Request Demo</a>
</div>
</section>
<footer class="bg-dark text-center text-light py-4">
<div class="container">
<p class="mb-0 fw-bold">Garuda &copy; 2025 Built for Operators</p>
</div>
</footer>
</body>
</html>

View File

@@ -1,348 +1,67 @@
<!-- valorantdigital.com homepage with Bootswatch Superhero styling -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Valorant Digital - AI Content Factories</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="Valorant Digital, AI Content Factory, Content Operations" name="keywords">
<meta content="We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production." name="description">
<!-- Favicon -->
<link href="https://placehold.co/32x32/0d6efd/ffffff?text=VD" rel="icon">
<!-- Bootswatch Lux Theme -->
<link href="https://bootswatch.com/5/lux/bootstrap.min.css" rel="stylesheet">
<!-- Icon Font Stylesheet -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet">
<!-- Custom Stylesheet -->
<style>
.navbar {
background-color: rgba(255, 255, 255, 0.9);
backdrop-filter: blur(10px);
}
.hero-header {
background: linear-gradient(rgba(15, 32, 39, .7), rgba(15, 32, 39, .7)), url(https://images.unsplash.com/photo-1556740738-b6a63e27c4df?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80) center center no-repeat;
background-size: cover;
}
.section-title::before {
position: absolute;
content: "";
width: 150px;
height: 5px;
left: 50%;
bottom: 0;
transform: translateX(-50%);
background: var(--bs-primary);
}
.service-box {
transition: transform 0.3s ease-in-out;
}
.service-box:hover {
transform: translateY(-10px);
box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
}
.back-to-top {
position: fixed;
display: none;
right: 45px;
bottom: 45px;
z-index: 99;
}
</style>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Valorant Digital</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.3.2/dist/superhero/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<style>
.hero {
padding: 100px 0;
text-align: center;
background: linear-gradient(rgba(18, 18, 18, 0.9), rgba(18, 18, 18, 0.9)), url('https://images.unsplash.com/photo-1556761175-5973dc0f32e7') no-repeat center center;
background-size: cover;
color: white;
}
.hero h1 {
font-weight: 800;
font-size: 3rem;
}
.section-title {
margin-bottom: 2rem;
}
</style>
</head>
<body data-bs-spy="scroll" data-bs-target=".navbar" data-bs-offset="100">
<!-- Spinner Start -->
<div id="spinner" class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
<div class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<div class="container">
<a class="navbar-brand fw-bold" href="#"><i class="fa-solid fa-circle-nodes me-2"></i>Valorant Digital</a>
</div>
<!-- Spinner End -->
</nav>
<!-- Navbar Start -->
<div class="container-fluid position-relative p-0">
<nav class="navbar navbar-expand-lg navbar-light px-5 py-3 py-lg-0 sticky-top shadow-sm">
<a href="index.html" class="navbar-brand p-0">
<h1 class="m-0"><i class="fa fa-robot me-2 text-primary"></i>Valorant Digital</h1>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<div class="navbar-nav ms-auto py-0">
<a href="#home" class="nav-item nav-link active">Home</a>
<a href="#problem" class="nav-item nav-link">The Problem</a>
<a href="#solution" class="nav-item nav-link">The Solution</a>
<a href="#offer" class="nav-item nav-link">The Offer</a>
</div>
<a href="/content-factory" class="btn btn-primary py-2 px-4 ms-3">Book a Strategy Call</a>
</div>
</nav>
<section class="hero">
<div class="container">
<h1 class="display-4">AI Content Systems for Agencies</h1>
<p class="lead mt-3">We install done-for-you AI systems that help agencies deliver branded client content — faster, more consistently, and with less effort.</p>
<a href="garuda.html" class="btn btn-lg btn-outline-light mt-4">Explore Project Garuda</a>
</div>
<!-- Navbar End -->
</section>
<!-- Hero Header Start -->
<div class="container-fluid hero-header mb-5" id="home">
<div class="container py-5">
<div class="row justify-content-center py-5">
<div class="col-lg-10 text-center">
<h1 class="display-3 text-white animated slideInDown">Stop the Content Chaos. Install Your AI Factory.</h1>
<p class="fs-4 text-white mb-4 animated slideInDown">We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production.</p>
<a href="/content-factory" class="btn btn-primary btn-lg py-md-3 px-md-5 me-3 animated slideInLeft">Book a Strategy Call</a>
<a href="#problem" class="btn btn-outline-light btn-lg py-md-3 px-md-5 animated slideInRight">Learn How</a>
</div>
</div>
</div>
<section class="container py-5 text-light">
<div class="row text-center">
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-screwdriver-wrench me-2"></i> What We Do</h3>
<p>We build and deploy AI infrastructure for agencies to automate content workflows without losing brand control.</p>
</div>
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-people-group me-2"></i> Who We Help</h3>
<p>Marketing and creative agencies that deliver client content — and want to do it with less stress, in less time.</p>
</div>
<div class="col-md-4 mb-4">
<h3 class="text-primary"><i class="fa-solid fa-circle-check me-2"></i> Built Different</h3>
<p>Fully installed and configured. Built for brand voice, not bulk. No training. No prompt writing. No tool fatigue.</p>
</div>
</div>
<!-- Hero Header End -->
</section>
<!-- The Problem Start -->
<div class="container-fluid py-5" id="problem">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">The Diagnosis</h5>
<h1 class="mb-0">Your Content Workflow Is Broken</h1>
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-not-equal fa-3x text-primary"></i>
</div>
<h4 class="mb-3">Inconsistent Brand Voice</h4>
<p class="m-0">Your content sounds like it was written by ten different people, because it was. Your brand's unique identity is lost in a sea of generic AI outputs and freelancer fatigue.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-sack-dollar fa-3x text-primary"></i>
</div>
<h4 class="mb-3">Escalating Costs</h4>
<p class="m-0">You're trapped in a cycle of paying per-word or per-hour with no clear ROI. Every new article is a new negotiation, and your budget evaporates with unpredictable results.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-person-running fa-3x text-primary"></i>
</div>
<h4 class="mb-3">A Scaling Nightmare</h4>
<p class="m-0">Trying to double your content output requires doubling your management overhead, your team, and your chaos. True scale feels impossible without the whole system breaking.</p>
</div>
</div>
</div>
</div>
<footer class="bg-dark text-center text-light py-4">
<div class="container">
<p class="mb-0 fw-bold">Valorant Digital &copy; 2025 Built for Agency Operators</p>
</div>
<!-- The Problem End -->
<!-- The Solution Start -->
<div class="container-fluid py-5" id="solution">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">The System</h5>
<h1 class="mb-0">We Install a Content Factory, Not Just a Tool</h1>
</div>
<div class="row g-5">
<div class="col-lg-6">
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-signature text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Guaranteed Brand Voice</h5>
<p class="mb-0">We codify your unique persona, backstory, and audience into the engine. Every piece of content is unmistakably yours.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-bolt text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Radical Efficiency</h5>
<p class="mb-0">Eliminate the operational drag of managing writers and revisions. Produce high-quality content on demand, not in weeks.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-coins text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Absolute Cost Control</h5>
<p class="mb-0">Granular token and cost tracking on every job gives you the exact price of your content down to the penny.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-chart-line text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Predictable Scale</h5>
<p class="mb-0">Go from 5 to 50 articles a month without a linear increase in chaos or cost. Your factory scales with you.</p>
</div>
</div>
</div>
<div class="col-lg-6" style="min-height: 500px;">
<div class="position-relative h-100">
<img class="position-absolute w-100 h-100 rounded" src="https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80" style="object-fit: cover;">
</div>
</div>
</div>
</div>
</div>
<!-- The Solution End -->
<!-- The Offer Start -->
<div class="container-fluid py-5" id="offer">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 800px;">
<h5 class="fw-bold text-primary text-uppercase">The Implementation</h5>
<h1 class="mb-0">We Sell One Thing: A Complete Content Factory Installation</h1>
<p class="mt-3 fs-5">This is not a SaaS subscription. It's a high-touch, "done-with-you" professional service to permanently upgrade your content operations.</p>
</div>
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="bg-light rounded shadow position-relative" style="z-index: 1;">
<div class="border-bottom py-4 px-5 mb-4">
<h4 class="text-primary mb-1">The Content Factory Implementation</h4>
<small class="text-uppercase">For brands that are serious about scale.</small>
</div>
<div class="p-5 pt-0">
<ul class="list-unstyled">
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Strategic Deep Dive:</strong> A mandatory workshop to diagnose your workflow, costs, and brand voice.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Asset Onboarding:</strong> We build your foundational library of authors, audiences, and content types for you.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Private Engine Deployment:</strong> A dedicated instance of the Project Garuda API for your exclusive use.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Team Training & Documentation:</strong> We train your key operators and hand you the keys to your new factory.</span></li>
</ul>
<a href="/content-factory" class="btn btn-primary py-2 px-4 mt-4">Book Your Strategy Call</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- The Offer End -->
<!-- Footer Start -->
<div class="container-fluid bg-dark text-light mt-5">
<div class="container">
<div class="row gx-5">
<div class="col-lg-4 col-md-6 footer-about">
<div class="d-flex flex-column align-items-center justify-content-center text-center h-100 bg-primary p-4">
<a href="index.html" class="navbar-brand">
<h1 class="m-0 text-white"><i class="fa fa-robot me-2"></i>Valorant Digital</h1>
</a>
<p class="mt-3 mb-4">We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production.</p>
</div>
</div>
<div class="col-lg-8 col-md-6">
<div class="row gx-5">
<div class="col-lg-6 col-md-12 pt-5 mb-5">
<div class="section-title section-title-sm position-relative pb-3 mb-4">
<h3 class="text-light mb-0">Get In Touch</h3>
</div>
<div class="d-flex mb-2">
<i class="bi bi-geo-alt text-primary me-2"></i>
<p class="mb-0">Honolulu, HI, USA</p>
</div>
<div class="d-flex mb-2">
<i class="bi bi-envelope-open text-primary me-2"></i>
<p class="mb-0">connect@valorantdigital.com</p>
</div>
<div class="d-flex mt-4">
<a class="btn btn-outline-light btn-square me-2" href="#"><i class="fab fa-twitter fw-normal"></i></a>
<a class="btn btn-outline-light btn-square me-2" href="#"><i class="fab fa-linkedin-in fw-normal"></i></a>
</div>
</div>
<div class="col-lg-6 col-md-12 pt-0 pt-lg-5 mb-5">
<div class="section-title section-title-sm position-relative pb-3 mb-4">
<h3 class="text-light mb-0">Quick Links</h3>
</div>
<div class="link-animated d-flex flex-column justify-content-start">
<a class="text-light mb-2" href="#home"><i class="bi bi-arrow-right text-primary me-2"></i>Home</a>
<a class="text-light mb-2" href="#problem"><i class="bi bi-arrow-right text-primary me-2"></i>The Problem</a>
<a class="text-light mb-2" href="#solution"><i class="bi bi-arrow-right text-primary me-2"></i>The Solution</a>
<a class="text-light mb-2" href="#offer"><i class="bi bi-arrow-right text-primary me-2"></i>The Offer</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container-fluid text-white" style="background: #000;">
<div class="container text-center">
<div class="row justify-content-end">
<div class="col-lg-8 col-md-6">
<div class="d-flex align-items-center justify-content-center" style="height: 75px;">
<p class="mb-0">&copy; <a class="text-white border-bottom" href="#">Valorant Digital</a>. All Rights Reserved.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Footer End -->
<!-- Back to Top -->
<a href="#" class="btn btn-lg btn-primary btn-lg-square rounded-circle back-to-top"><i class="bi bi-arrow-up"></i></a>
<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- A basic script to handle spinner and back-to-top button visibility -->
<script>
(function ($) {
"use strict";
// Spinner
var spinner = function () {
setTimeout(function () {
if ($('#spinner').length > 0) {
$('#spinner').removeClass('show');
}
}, 1);
};
spinner();
// Back to top button
$(window).scroll(function () {
if ($(this).scrollTop() > 300) {
$('.back-to-top').fadeIn('slow');
} else {
$('.back-to-top').fadeOut('slow');
}
});
$('.back-to-top').click(function () {
$('html, body').animate({scrollTop: 0}, 100, 'easeInOutExpo');
return false;
});
// Smooth scrolling for anchor links
$('a.nav-link').on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
}
});
})(jQuery);
</script>
</footer>
</body>
</html>

View File

@@ -1,2 +0,0 @@
# valorantdigital.com
valorantdigital.com

348
legacy/landing.html Normal file
View File

@@ -0,0 +1,348 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Valorant Digital - AI Content Factories</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="Valorant Digital, AI Content Factory, Content Operations" name="keywords">
<meta content="We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production." name="description">
<!-- Favicon -->
<link href="https://placehold.co/32x32/0d6efd/ffffff?text=VD" rel="icon">
<!-- Bootswatch Lux Theme -->
<link href="https://bootswatch.com/5/lux/bootstrap.min.css" rel="stylesheet">
<!-- Icon Font Stylesheet -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet">
<!-- Custom Stylesheet -->
<style>
.navbar {
background-color: rgba(255, 255, 255, 0.9);
backdrop-filter: blur(10px);
}
.hero-header {
background: linear-gradient(rgba(15, 32, 39, .7), rgba(15, 32, 39, .7)), url(https://images.unsplash.com/photo-1556740738-b6a63e27c4df?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80) center center no-repeat;
background-size: cover;
}
.section-title::before {
position: absolute;
content: "";
width: 150px;
height: 5px;
left: 50%;
bottom: 0;
transform: translateX(-50%);
background: var(--bs-primary);
}
.service-box {
transition: transform 0.3s ease-in-out;
}
.service-box:hover {
transform: translateY(-10px);
box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
}
.back-to-top {
position: fixed;
display: none;
right: 45px;
bottom: 45px;
z-index: 99;
}
</style>
</head>
<body data-bs-spy="scroll" data-bs-target=".navbar" data-bs-offset="100">
<!-- Spinner Start -->
<div id="spinner" class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
<div class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<!-- Spinner End -->
<!-- Navbar Start -->
<div class="container-fluid position-relative p-0">
<nav class="navbar navbar-expand-lg navbar-light px-5 py-3 py-lg-0 sticky-top shadow-sm">
<a href="index.html" class="navbar-brand p-0">
<h1 class="m-0"><i class="fa fa-robot me-2 text-primary"></i>Valorant Digital</h1>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<div class="navbar-nav ms-auto py-0">
<a href="#home" class="nav-item nav-link active">Home</a>
<a href="#problem" class="nav-item nav-link">The Problem</a>
<a href="#solution" class="nav-item nav-link">The Solution</a>
<a href="#offer" class="nav-item nav-link">The Offer</a>
</div>
<a href="/content-factory" class="btn btn-primary py-2 px-4 ms-3">Book a Strategy Call</a>
</div>
</nav>
</div>
<!-- Navbar End -->
<!-- Hero Header Start -->
<div class="container-fluid hero-header mb-5" id="home">
<div class="container py-5">
<div class="row justify-content-center py-5">
<div class="col-lg-10 text-center">
<h1 class="display-3 text-white animated slideInDown">Stop the Content Chaos. Install Your AI Factory.</h1>
<p class="fs-4 text-white mb-4 animated slideInDown">We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production.</p>
<a href="/content-factory" class="btn btn-primary btn-lg py-md-3 px-md-5 me-3 animated slideInLeft">Book a Strategy Call</a>
<a href="#problem" class="btn btn-outline-light btn-lg py-md-3 px-md-5 animated slideInRight">Learn How</a>
</div>
</div>
</div>
</div>
<!-- Hero Header End -->
<!-- The Problem Start -->
<div class="container-fluid py-5" id="problem">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">The Diagnosis</h5>
<h1 class="mb-0">Your Content Workflow Is Broken</h1>
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-not-equal fa-3x text-primary"></i>
</div>
<h4 class="mb-3">Inconsistent Brand Voice</h4>
<p class="m-0">Your content sounds like it was written by ten different people, because it was. Your brand's unique identity is lost in a sea of generic AI outputs and freelancer fatigue.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-sack-dollar fa-3x text-primary"></i>
</div>
<h4 class="mb-3">Escalating Costs</h4>
<p class="m-0">You're trapped in a cycle of paying per-word or per-hour with no clear ROI. Every new article is a new negotiation, and your budget evaporates with unpredictable results.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-box bg-light shadow rounded d-flex flex-column align-items-center justify-content-center text-center p-4 h-100">
<div class="service-icon mb-3">
<i class="fa fa-person-running fa-3x text-primary"></i>
</div>
<h4 class="mb-3">A Scaling Nightmare</h4>
<p class="m-0">Trying to double your content output requires doubling your management overhead, your team, and your chaos. True scale feels impossible without the whole system breaking.</p>
</div>
</div>
</div>
</div>
</div>
<!-- The Problem End -->
<!-- The Solution Start -->
<div class="container-fluid py-5" id="solution">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">The System</h5>
<h1 class="mb-0">We Install a Content Factory, Not Just a Tool</h1>
</div>
<div class="row g-5">
<div class="col-lg-6">
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-signature text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Guaranteed Brand Voice</h5>
<p class="mb-0">We codify your unique persona, backstory, and audience into the engine. Every piece of content is unmistakably yours.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-bolt text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Radical Efficiency</h5>
<p class="mb-0">Eliminate the operational drag of managing writers and revisions. Produce high-quality content on demand, not in weeks.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-coins text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Absolute Cost Control</h5>
<p class="mb-0">Granular token and cost tracking on every job gives you the exact price of your content down to the penny.</p>
</div>
</div>
<div class="d-flex align-items-center mb-4">
<div class="bg-primary d-flex align-items-center justify-content-center rounded" style="width: 60px; height: 60px;">
<i class="fa fa-chart-line text-white"></i>
</div>
<div class="ps-4">
<h5 class="mb-2">Predictable Scale</h5>
<p class="mb-0">Go from 5 to 50 articles a month without a linear increase in chaos or cost. Your factory scales with you.</p>
</div>
</div>
</div>
<div class="col-lg-6" style="min-height: 500px;">
<div class="position-relative h-100">
<img class="position-absolute w-100 h-100 rounded" src="https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80" style="object-fit: cover;">
</div>
</div>
</div>
</div>
</div>
<!-- The Solution End -->
<!-- The Offer Start -->
<div class="container-fluid py-5" id="offer">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 800px;">
<h5 class="fw-bold text-primary text-uppercase">The Implementation</h5>
<h1 class="mb-0">We Sell One Thing: A Complete Content Factory Installation</h1>
<p class="mt-3 fs-5">This is not a SaaS subscription. It's a high-touch, "done-with-you" professional service to permanently upgrade your content operations.</p>
</div>
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="bg-light rounded shadow position-relative" style="z-index: 1;">
<div class="border-bottom py-4 px-5 mb-4">
<h4 class="text-primary mb-1">The Content Factory Implementation</h4>
<small class="text-uppercase">For brands that are serious about scale.</small>
</div>
<div class="p-5 pt-0">
<ul class="list-unstyled">
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Strategic Deep Dive:</strong> A mandatory workshop to diagnose your workflow, costs, and brand voice.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Asset Onboarding:</strong> We build your foundational library of authors, audiences, and content types for you.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Private Engine Deployment:</strong> A dedicated instance of the Project Garuda API for your exclusive use.</span></li>
<li class="mb-3 d-flex"><i class="fa fa-check text-primary pt-1 me-3"></i><span><strong>Team Training & Documentation:</strong> We train your key operators and hand you the keys to your new factory.</span></li>
</ul>
<a href="/content-factory" class="btn btn-primary py-2 px-4 mt-4">Book Your Strategy Call</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- The Offer End -->
<!-- Footer Start -->
<div class="container-fluid bg-dark text-light mt-5">
<div class="container">
<div class="row gx-5">
<div class="col-lg-4 col-md-6 footer-about">
<div class="d-flex flex-column align-items-center justify-content-center text-center h-100 bg-primary p-4">
<a href="index.html" class="navbar-brand">
<h1 class="m-0 text-white"><i class="fa fa-robot me-2"></i>Valorant Digital</h1>
</a>
<p class="mt-3 mb-4">We build AI content factories for brands that are tired of the high costs and brand inconsistency in their content production.</p>
</div>
</div>
<div class="col-lg-8 col-md-6">
<div class="row gx-5">
<div class="col-lg-6 col-md-12 pt-5 mb-5">
<div class="section-title section-title-sm position-relative pb-3 mb-4">
<h3 class="text-light mb-0">Get In Touch</h3>
</div>
<div class="d-flex mb-2">
<i class="bi bi-geo-alt text-primary me-2"></i>
<p class="mb-0">Honolulu, HI, USA</p>
</div>
<div class="d-flex mb-2">
<i class="bi bi-envelope-open text-primary me-2"></i>
<p class="mb-0">connect@valorantdigital.com</p>
</div>
<div class="d-flex mt-4">
<a class="btn btn-outline-light btn-square me-2" href="#"><i class="fab fa-twitter fw-normal"></i></a>
<a class="btn btn-outline-light btn-square me-2" href="#"><i class="fab fa-linkedin-in fw-normal"></i></a>
</div>
</div>
<div class="col-lg-6 col-md-12 pt-0 pt-lg-5 mb-5">
<div class="section-title section-title-sm position-relative pb-3 mb-4">
<h3 class="text-light mb-0">Quick Links</h3>
</div>
<div class="link-animated d-flex flex-column justify-content-start">
<a class="text-light mb-2" href="#home"><i class="bi bi-arrow-right text-primary me-2"></i>Home</a>
<a class="text-light mb-2" href="#problem"><i class="bi bi-arrow-right text-primary me-2"></i>The Problem</a>
<a class="text-light mb-2" href="#solution"><i class="bi bi-arrow-right text-primary me-2"></i>The Solution</a>
<a class="text-light mb-2" href="#offer"><i class="bi bi-arrow-right text-primary me-2"></i>The Offer</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container-fluid text-white" style="background: #000;">
<div class="container text-center">
<div class="row justify-content-end">
<div class="col-lg-8 col-md-6">
<div class="d-flex align-items-center justify-content-center" style="height: 75px;">
<p class="mb-0">&copy; <a class="text-white border-bottom" href="#">Valorant Digital</a>. All Rights Reserved.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Footer End -->
<!-- Back to Top -->
<a href="#" class="btn btn-lg btn-primary btn-lg-square rounded-circle back-to-top"><i class="bi bi-arrow-up"></i></a>
<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- A basic script to handle spinner and back-to-top button visibility -->
<script>
(function ($) {
"use strict";
// Spinner
var spinner = function () {
setTimeout(function () {
if ($('#spinner').length > 0) {
$('#spinner').removeClass('show');
}
}, 1);
};
spinner();
// Back to top button
$(window).scroll(function () {
if ($(this).scrollTop() > 300) {
$('.back-to-top').fadeIn('slow');
} else {
$('.back-to-top').fadeOut('slow');
}
});
$('.back-to-top').click(function () {
$('html, body').animate({scrollTop: 0}, 100, 'easeInOutExpo');
return false;
});
// Smooth scrolling for anchor links
$('a.nav-link').on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
}
});
})(jQuery);
</script>
</body>
</html>