286 lines
9.6 KiB
HTML
286 lines
9.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Netresearch - Landing Page Template</title>
|
|
<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=Raleway:wght@400;600;700&family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<!-- Navigation -->
|
|
<nav class="navbar">
|
|
<div class="navbar-container">
|
|
<img src="logo.svg" alt="Netresearch Logo" class="navbar-logo">
|
|
|
|
<button class="navbar-toggle" aria-label="Toggle navigation">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</button>
|
|
|
|
<ul class="navbar-menu">
|
|
<li><a href="#services" class="navbar-link active">Services</a></li>
|
|
<li><a href="#about" class="navbar-link">About</a></li>
|
|
<li><a href="#portfolio" class="navbar-link">Portfolio</a></li>
|
|
<li><a href="#contact" class="navbar-link">Contact</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero Section -->
|
|
<section class="hero">
|
|
<div class="hero-content">
|
|
<h1 class="hero-title">Your Digital Transformation Partner</h1>
|
|
<p class="hero-subtitle">
|
|
We create innovative digital solutions that drive business growth and enhance user experiences.
|
|
</p>
|
|
<div class="hero-cta">
|
|
<a href="#contact" class="btn-primary btn-large">Get Started</a>
|
|
<a href="#services" class="btn-outline btn-large">Learn More</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Services Section -->
|
|
<section id="services" class="section">
|
|
<div class="container">
|
|
<h2 class="section-title">Our Services</h2>
|
|
<p class="section-subtitle">
|
|
Comprehensive digital solutions tailored to your needs
|
|
</p>
|
|
|
|
<div class="three-column">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<h3 class="card-title">Web Development</h3>
|
|
<p class="card-text">
|
|
Modern, responsive websites built with the latest technologies and best practices.
|
|
</p>
|
|
<a href="#" class="link-standalone">Learn more</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<h3 class="card-title">E-Commerce Solutions</h3>
|
|
<p class="card-text">
|
|
Powerful online stores that drive sales and provide exceptional shopping experiences.
|
|
</p>
|
|
<a href="#" class="link-standalone">Learn more</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<h3 class="card-title">Digital Strategy</h3>
|
|
<p class="card-text">
|
|
Strategic consulting to help your business thrive in the digital landscape.
|
|
</p>
|
|
<a href="#" class="link-standalone">Learn more</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- About Section -->
|
|
<section id="about" class="section section-alt">
|
|
<div class="container">
|
|
<div class="two-column">
|
|
<div>
|
|
<h2>About Netresearch</h2>
|
|
<p class="lead">
|
|
With over 20 years of experience, we've been helping businesses succeed online through innovative digital solutions.
|
|
</p>
|
|
<p>
|
|
Our team of experts combines technical excellence with creative thinking to deliver projects that exceed expectations. We specialize in TYPO3, e-commerce, and custom web applications.
|
|
</p>
|
|
<p>
|
|
Based in Leipzig, Germany, we serve clients across Europe and beyond, providing end-to-end digital services from strategy to implementation and support.
|
|
</p>
|
|
<a href="#contact" class="btn-primary">Work with us</a>
|
|
</div>
|
|
<div>
|
|
<img src="about-image.jpg" alt="Netresearch team" style="width: 100%; border-radius: 8px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Portfolio Section -->
|
|
<section id="portfolio" class="section">
|
|
<div class="container">
|
|
<h2 class="section-title">Our Work</h2>
|
|
<p class="section-subtitle">
|
|
Recent projects we're proud of
|
|
</p>
|
|
|
|
<div class="three-column">
|
|
<div class="card">
|
|
<img src="project-1.jpg" alt="Project 1" class="card-image">
|
|
<div class="card-content">
|
|
<h3 class="card-title">E-Commerce Platform</h3>
|
|
<p class="card-text">
|
|
Complete redesign and development of a multi-vendor marketplace.
|
|
</p>
|
|
<div class="card-footer">
|
|
<span class="card-meta">TYPO3 • Magento • 2024</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<img src="project-2.jpg" alt="Project 2" class="card-image">
|
|
<div class="card-content">
|
|
<h3 class="card-title">Corporate Website</h3>
|
|
<p class="card-text">
|
|
Modern website with multilingual content and advanced integrations.
|
|
</p>
|
|
<div class="card-footer">
|
|
<span class="card-meta">TYPO3 • API • 2024</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<img src="project-3.jpg" alt="Project 3" class="card-image">
|
|
<div class="card-content">
|
|
<h3 class="card-title">Custom Web Application</h3>
|
|
<p class="card-text">
|
|
Bespoke solution for complex business requirements and workflows.
|
|
</p>
|
|
<div class="card-footer">
|
|
<span class="card-meta">Laravel • Vue.js • 2024</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Contact Section -->
|
|
<section id="contact" class="section section-alt">
|
|
<div class="container">
|
|
<div class="two-column">
|
|
<div>
|
|
<h2>Get in Touch</h2>
|
|
<p class="lead">
|
|
Ready to start your next project? Let's talk about how we can help.
|
|
</p>
|
|
<p>
|
|
<strong>Netresearch DTT GmbH</strong><br>
|
|
Nonnenstraße 11d<br>
|
|
04229 Leipzig, Germany
|
|
</p>
|
|
<p>
|
|
<strong>Phone:</strong> +49 341 49288-0<br>
|
|
<strong>Email:</strong> <a href="mailto:info@netresearch.de">info@netresearch.de</a>
|
|
</p>
|
|
</div>
|
|
|
|
<div>
|
|
<form class="form">
|
|
<div class="form-group">
|
|
<label for="name" class="form-label">Name*</label>
|
|
<input type="text" id="name" class="form-input" placeholder="Your name" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="email" class="form-label">Email*</label>
|
|
<input type="email" id="email" class="form-input" placeholder="your@email.com" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="subject" class="form-label">Subject*</label>
|
|
<input type="text" id="subject" class="form-input" placeholder="Project inquiry" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="message" class="form-label">Message*</label>
|
|
<textarea id="message" class="form-textarea" placeholder="Tell us about your project" required></textarea>
|
|
</div>
|
|
|
|
<button type="submit" class="btn-primary btn-large">Send Message</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="footer-content">
|
|
<div class="footer-section">
|
|
<h4>Company</h4>
|
|
<ul>
|
|
<li><a href="#about">About Us</a></li>
|
|
<li><a href="#services">Services</a></li>
|
|
<li><a href="#portfolio">Portfolio</a></li>
|
|
<li><a href="#careers">Careers</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h4>Services</h4>
|
|
<ul>
|
|
<li><a href="#web-dev">Web Development</a></li>
|
|
<li><a href="#ecommerce">E-Commerce</a></li>
|
|
<li><a href="#typo3">TYPO3</a></li>
|
|
<li><a href="#consulting">Consulting</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h4>Resources</h4>
|
|
<ul>
|
|
<li><a href="#blog">Blog</a></li>
|
|
<li><a href="#case-studies">Case Studies</a></li>
|
|
<li><a href="#documentation">Documentation</a></li>
|
|
<li><a href="#support">Support</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footer-section">
|
|
<h4>Legal</h4>
|
|
<ul>
|
|
<li><a href="#imprint">Imprint</a></li>
|
|
<li><a href="#privacy">Privacy Policy</a></li>
|
|
<li><a href="#terms">Terms of Service</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer-bottom">
|
|
<div class="container">
|
|
<p>© 2025 Netresearch DTT GmbH. All rights reserved.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
// Mobile menu toggle
|
|
const toggle = document.querySelector('.navbar-toggle');
|
|
const menu = document.querySelector('.navbar-menu');
|
|
|
|
toggle.addEventListener('click', () => {
|
|
menu.classList.toggle('active');
|
|
});
|
|
|
|
// Smooth scrolling
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
const target = document.querySelector(this.getAttribute('href'));
|
|
if (target) {
|
|
target.scrollIntoView({ behavior: 'smooth' });
|
|
menu.classList.remove('active');
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|