Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
283 changes: 185 additions & 98 deletions CulinaryCommandApp/Components/Layout/Welcome.razor
Original file line number Diff line number Diff line change
Expand Up @@ -21,165 +21,252 @@
</nav>

<section class="hero-banner">
<div class="hero-image">
<div class="hero-overlay">
<div class="hero-badge">Built for independent restaurants and multi-location operators</div>
<h1>
Run Your Restaurant With
<span>Precision.</span>
<div class="hero-content">
<div class="hero-left">
<div class="hero-badge">
<span class="badge-dot"></span>
TRUSTED BY 1,000+ KITCHENS
</div>
<h1 class="hero-title">
Run Your Restaurant With<br />
<span class="hero-title-accent">Precision</span>
</h1>
<p>
Culinary Command gives you complete control over inventory, ingredients,
recipes, staff, and cost management - all in one intelligent dashboard.
<p class="hero-description">
Culinary Command gives you complete control over inventory, ingredients, recipes, staff, and cost management — all in one intelligent dashboard.
</p>
<div class="hero-social">
<a class="social-btn" href="https://facebook.com" aria-label="Facebook">
<i class="bi bi-facebook"></i>
</a>
<a class="social-btn" href="https://instagram.com" aria-label="Instagram">
<i class="bi bi-instagram"></i>
</a>
<a class="social-btn" href="https://twitter.com" aria-label="Twitter">
<i class="bi bi-twitter-x"></i>
<div class="hero-buttons">
<a class="btn-primary" href="/account">Start Your Free Trial</a>
<a class="btn-secondary" href="#demo">
<i class="bi bi-play-circle-fill"></i>
Book a Demo
</a>
</div>
<a class="btn-cta" href="/signin">Get Started <i class="bi bi-arrow-right"></i></a>
</div>
<div class="hero-stats">
<h3>Trusted by the biggest restaurants</h3>
<div class="stats-row">
<div>
<strong>500+</strong>
<span>Happy Users</span>
</div>
<div>
<strong>32 Hrs+</strong>
<span>Time Saved</span>
</div>
<div>
<strong>1000+</strong>
<span>Sales</span>
<div class="hero-right">
<div class="hero-image-container">
<img src="https://images.unsplash.com/photo-1577219491135-ce391730fb2c?q=80&w=2000&auto=format&fit=crop"
alt="Professional commercial kitchen with industrial equipment"
class="hero-food-image" />
<div class="image-overlay">
<div class="overlay-stat">
<i class="bi bi-people-fill"></i>
<div>
<div class="stat-number">1000+</div>
<div class="stat-text">Restaurants</div>
</div>
</div>
<div class="overlay-stat">
<i class="bi bi-clock-fill"></i>
<div>
<div class="stat-number">32hrs</div>
<div class="stat-text">Saved/Week</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>

<section class="welcome-section" id="features">
<div class="section-header">
<p class="section-kicker">Core Features</p>
<h2>Full visibility across every station.</h2>
<div class="features-header">
<h2 class="features-title">Full Visibility Across Every Station</h2>
<p class="features-subtitle">Eliminate the fog of war. See exactly what's happening at prep, on the line, and at the pass in real-time.</p>
</div>
<div class="feature-grid">
<div class="feature-card">
<h3>Inventory Intelligence</h3>
<p>Track stock, receive reorder alerts, and sync usage across locations.</p>
</div>
<div class="feature-card">
<h3>Recipe Standardization</h3>
<p>Keep prep consistent with costed recipes and smart yield tracking.</p>
<div class="feature-icon">
<i class="bi bi-broadcast"></i>
</div>
<h3 class="feature-title">Live Monitoring</h3>
<p class="feature-description">Track every ticket's age and status with second-by-second accuracy across all digital KDS units.</p>
<div class="feature-progress"></div>
</div>
<div class="feature-card">
<h3>Task Command</h3>
<p>Assign tasks, monitor completion, and automate daily checklists.</p>
<div class="feature-icon">
<i class="bi bi-archive-fill"></i>
</div>
<h3 class="feature-title">Dynamic Inventory</h3>
<p class="feature-description">Inventory that updates as orders flow, triggering automated low-stock alerts before you 86 an item.</p>
<div class="feature-progress"></div>
</div>
<div class="feature-card">
<h3>Team Visibility</h3>
<p>Know who is on shift, what is done, and what needs attention.</p>
<div class="feature-icon">
<i class="bi bi-people-fill"></i>
</div>
<h3 class="feature-title">Staff Optimization</h3>
<p class="feature-description">Identify top performers and bottleneck stations to optimize your labor deployment in real-time.</p>
<div class="feature-progress"></div>
</div>
</div>
</section>

<section class="welcome-section" id="how">
<div class="section-header">
<p class="section-kicker">How It Works</p>
<h2>Set up once. Run with confidence every service.</h2>
<div class="features-header">
<h2 class="features-title">Set Up Once. Run With Confidence Every Service.</h2>
<p class="features-subtitle">Get started in minutes with our streamlined onboarding process. Your team will be up and running before the next service.</p>
</div>
<div class="steps">
<div class="step-card">
<span class="step-number">01</span>
<h3>Connect your locations</h3>
<p>Import inventory, create recipes, and invite managers in minutes.</p>
<div class="step-number-badge">01</div>
<div class="step-icon">
<i class="bi bi-building"></i>
</div>
<h3 class="step-title">Connect Your Locations</h3>
<p class="step-description">Import inventory, create recipes, and invite managers in minutes.</p>
</div>
<div class="step-card">
<span class="step-number">02</span>
<h3>Automate the playbook</h3>
<p>Set reorder levels, task cadences, and prep workflows.</p>
<div class="step-number-badge">02</div>
<div class="step-icon">
<i class="bi bi-gear-fill"></i>
</div>
<h3 class="step-title">Automate the Playbook</h3>
<p class="step-description">Set reorder levels, task cadences, and prep workflows.</p>
</div>
<div class="step-card">
<span class="step-number">03</span>
<h3>Track results</h3>
<p>See waste reduction, time saved, and team performance instantly.</p>
<div class="step-number-badge">03</div>
<div class="step-icon">
<i class="bi bi-graph-up"></i>
</div>
<h3 class="step-title">Track Results</h3>
<p class="step-description">See waste reduction, time saved, and team performance instantly.</p>
</div>
</div>
</section>

<section class="welcome-section" id="pricing">
<div class="section-header">
<p class="section-kicker">Pricing</p>
<h2>Plans designed for growing kitchens.</h2>
<section class="welcome-section pricing-section" id="pricing">
<div class="features-header">
<h2 class="features-title">Plans Designed for Growing Kitchens</h2>
<p class="features-subtitle">Choose the perfect plan to scale your operations. All plans include core features with flexible pricing.</p>
</div>
<div class="pricing-grid">
<div class="pricing-card">
<h3>Starter</h3>
<div class="price">$49<span>/mo</span></div>
<ul>
<li>1 location</li>
<li>Inventory + recipes</li>
<li>Email support</li>
<div class="pricing-header">
<h3 class="pricing-title">Starter</h3>
<div class="price">$49<span>/mo</span></div>
</div>
<ul class="pricing-features">
<li><i class="bi bi-check-circle-fill"></i> 1 location</li>
<li><i class="bi bi-check-circle-fill"></i> Inventory + recipes</li>
<li><i class="bi bi-check-circle-fill"></i> Email support</li>
</ul>
<a class="btn-ghost" href="/signin">Start now</a>
<a class="btn-ghost" href="/account">Start Now</a>
</div>
<div class="pricing-card featured">
<div class="featured-tag">Most Popular</div>
<h3>Growth</h3>
<div class="price">$129<span>/mo</span></div>
<ul>
<li>Up to 5 locations</li>
<li>Tasks + automation</li>
<li>Priority support</li>
<div class="pricing-header">
<h3 class="pricing-title">Growth</h3>
<div class="price">$129<span>/mo</span></div>
</div>
<ul class="pricing-features">
<li><i class="bi bi-check-circle-fill"></i> Up to 5 locations</li>
<li><i class="bi bi-check-circle-fill"></i> Tasks + automation</li>
<li><i class="bi bi-check-circle-fill"></i> Priority support</li>
</ul>
<a class="btn-primary" href="/signin">Get Started</a>
<a class="btn-primary" href="/account">Get Started</a>
</div>
<div class="pricing-card">
<h3>Enterprise</h3>
<div class="price">Custom</div>
<ul>
<li>Unlimited locations</li>
<li>Dedicated success team</li>
<li>Custom integrations</li>
<div class="pricing-header">
<h3 class="pricing-title">Enterprise</h3>
<div class="price">Custom</div>
</div>
<ul class="pricing-features">
<li><i class="bi bi-check-circle-fill"></i> Unlimited locations</li>
<li><i class="bi bi-check-circle-fill"></i> Dedicated success team</li>
<li><i class="bi bi-check-circle-fill"></i> Custom integrations</li>
</ul>
<a class="btn-ghost" href="/signin">Talk to sales</a>
<a class="btn-ghost" href="/account">Talk to Sales</a>
</div>
</div>
</section>

<section class="welcome-section" id="faq">
<div class="section-header">
<p class="section-kicker">FAQ</p>
<h2>Quick answers to common questions.</h2>
<div class="features-header">
<h2 class="features-title">Frequently Asked Questions</h2>
<p class="features-subtitle">Got questions? We've got answers. Learn more about how Culinary Command works for your business.</p>
</div>
<div class="faq-grid">
<div class="faq-card">
<h3>Does it work for multiple locations?</h3>
<p>Yes. Monitor inventory, tasks, and costs across every location in one view.</p>
<div class="faq-icon">
<i class="bi bi-building-check"></i>
</div>
<h3 class="faq-title">Does it work for multiple locations?</h3>
<p class="faq-description">Yes. Monitor inventory, tasks, and costs across every location in one view.</p>
</div>
<div class="faq-card">
<h3>How fast can we get started?</h3>
<p>Most teams are live within a day. Import inventory and invite staff in minutes.</p>
<div class="faq-icon">
<i class="bi bi-lightning-charge-fill"></i>
</div>
<h3 class="faq-title">How fast can we get started?</h3>
<p class="faq-description">Most teams are live within a day. Import inventory and invite staff in minutes.</p>
</div>
<div class="faq-card">
<h3>Can we customize workflows?</h3>
<p>Absolutely. Build checklists, reorder points, and roles to match your operation.</p>
<div class="faq-icon">
<i class="bi bi-sliders"></i>
</div>
<h3 class="faq-title">Can we customize workflows?</h3>
<p class="faq-description">Absolutely. Build checklists, reorder points, and roles to match your operation.</p>
</div>
</div>
</section>

<section class="welcome-cta">
<div>
<h2>Ready to run service with clarity?</h2>
<p>Sign in and launch your command center.</p>


<footer class="welcome-footer">
<div class="footer-content">
<div class="footer-brand">
<div class="footer-logo">
<i class="bi bi-x-diamond-fill"></i>
<span>CULINARY COMMAND</span>
</div>
<p class="footer-tagline">
Empowering the world's most efficient kitchens with enterprise-grade operating systems.
</p>
<div class="footer-social">
<a href="#" aria-label="Share"><i class="bi bi-share-fill"></i></a>
</div>
</div>

<div class="footer-links">
<div class="footer-column">
<h4>Product</h4>
<ul>
<li><a href="#">Digital KDS</a></li>
<li><a href="#">Inventory Control</a></li>
<li><a href="#">Recipe Management</a></li>
<li><a href="#">Waste Tracking</a></li>
</ul>
</div>

<div class="footer-column">
<h4>Company</h4>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Customers</a></li>
<li><a href="#">Careers</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>

<div class="footer-column newsletter">
<h4>Newsletter</h4>
<p>Get the latest on kitchen efficiency and restaurant tech.</p>
<form class="newsletter-form">
<input type="email" placeholder="chef@restaurant.com" />
<button type="submit" aria-label="Subscribe">
<i class="bi bi-arrow-right"></i>
</button>
</form>
</div>
</div>
</div>
<a class="btn-primary" href="/signin">Get Started</a>
</section>

<div class="footer-bottom">
<p>© 2024 CULINARY COMMAND INC. ALL RIGHTS RESERVED.</p>
<div class="footer-legal">
<a href="#">PRIVACY POLICY</a>
<a href="#">TERMS OF SERVICE</a>
</div>
</div>
</footer>
</div>
Loading
Loading