36608-vm/index.php
Flatlogic Bot 8a4e8fcb10 PetEase V1
2025-12-03 05:47:15 +00:00

146 lines
8.0 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Paws at Home - Premium Pet Services</title>
<!-- SEO Meta Tags -->
<meta name="description" content="Paws at Home offers premium, at-home pet care services including grooming, walking, and veterinary check-ups. Book appointments or order supplies instantly.">
<meta name="keywords" content="pet care, pet services, home pet care, dog grooming, cat grooming, dog walker, mobile vet">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:title" content="Paws at Home - Premium Pet Services">
<meta property="og:description" content="Premium, at-home pet care services. Book appointments or order supplies instantly.">
<!-- Note: PROJECT_IMAGE_URL is managed by the platform -->
<meta property="og:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? 'assets/images/og_image.jpg'); ?>">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:title" content="Paws at Home - Premium Pet Services">
<meta property="twitter:description" content="Premium, at-home pet care services. Book appointments or order supplies instantly.">
<meta property="twitter:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? 'assets/images/og_image.jpg'); ?>">
<!-- Favicon -->
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🐾</text></svg>">
<!-- Google Fonts -->
<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=Poppins:wght@400;600;700&family=Inter:wght@400;500&display=swap" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
</head>
<body>
<!-- Header -->
<nav class="navbar navbar-expand-lg bg-body-tertiary sticky-top shadow-sm">
<div class="container">
<a class="navbar-brand fw-bold" href="#">🐾 Paws at Home</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto align-items-center">
<li class="nav-item"><a class="nav-link" href="#services">Services</a></li>
<li class="nav-item"><a class="nav-link" href="#about">About</a></li>
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
<li class="nav-item ms-2">
<a href="signup.php" class="btn btn-primary">Sign Up</a>
</li>
<li class="nav-item ms-3 theme-toggle-btn" id="theme-toggle">
<i class="bi bi-moon-stars-fill"></i>
</li>
</ul>
</div>
</div>
</nav>
<!-- Hero Section -->
<header id="home" class="hero-section text-center py-5 vh-100 d-flex align-items-center justify-content-center">
<div class="container fade-in-up">
<h1 class="display-3 fw-bold">Premium Pet Care, Right at Your Doorstep</h1>
<p class="lead my-4">Effortless booking for grooming, walking, and vet visits. Plus, instant delivery of all your pet's favorite supplies.</p>
<a href="signup.php" class="btn btn-primary btn-lg">Book a Service Now</a>
</div>
</header>
<!-- Main Content -->
<main class="container my-5">
<!-- Services Section -->
<section id="services" class="py-5">
<div class="text-center mb-5 fade-in-up">
<h2 class="fw-bold">Our Services</h2>
<p class="text-muted">Everything your pet needs, delivered with care.</p>
</div>
<div class="row g-4">
<div class="col-md-4 fade-in-up" style="transition-delay: 100ms;">
<div class="card h-100 p-4 text-center service-card rounded-3">
<div class="card-body">
<i class="bi bi-scissors fs-1 mb-3" style="color:var(--primary-color);"></i>
<h3 class="card-title h5">Mobile Grooming</h3>
<p class="card-text">Professional grooming services in our mobile salons. Stress-free for your pet.</p>
</div>
</div>
</div>
<div class="col-md-4 fade-in-up" style="transition-delay: 200ms;">
<div class="card h-100 p-4 text-center service-card rounded-3">
<div class="card-body">
<i class="bi bi-heart-pulse-fill fs-1 mb-3" style="color:var(--primary-color);"></i>
<h3 class="card-title h5">At-Home Vet Visits</h3>
<p class="card-text">Routine check-ups and preventative care from licensed veterinarians at your home.</p>
</div>
</div>
</div>
<div class="col-md-4 fade-in-up" style="transition-delay: 300ms;">
<div class="card h-100 p-4 text-center service-card rounded-3">
<div class="card-body">
<i class="bi bi-box2-heart-fill fs-1 mb-3" style="color:var(--primary-color);"></i>
<h3 class="card-title h5">Instant Delivery</h3>
<p class="card-text">Get food, toys, and supplies delivered from local stores in under an hour.</p>
</div>
</div>
</div>
</div>
</section>
<!-- About Section -->
<section id="about" class="py-5 bg-light rounded-3 my-5 fade-in-up">
<div class="row align-items-center">
<div class="col-md-6">
<img src="https://images.pexels.com/photos/45170/cat-face-close-up-feline-45170.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" class="img-fluid rounded-3 shadow" alt="Happy cat">
</div>
<div class="col-md-6 mt-4 mt-md-0">
<h2 class="fw-bold">About Paws at Home</h2>
<p class="text-muted">We started Paws at Home with a simple mission: to make pet care as convenient and joyful as possible for both pets and their parents. Our team is made up of passionate animal lovers and certified professionals dedicated to providing the best possible service.</p>
<a href="#" class="btn btn-outline-primary">Learn More</a>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer id="contact" class="py-4 mt-5" style="background-color: var(--surface-color);">
<div class="container text-center">
<p>&copy; <?php echo date("Y"); ?> Paws at Home. All Rights Reserved.</p>
<p>
<a href="#" class="text-decoration-none mx-2">Privacy Policy</a> |
<a href="#" class="text-decoration-none mx-2">Terms of Service</a>
</p>
</div>
</footer>
<!-- Bootstrap JS Bundle -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<!-- Custom JS -->
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
</body>
</html>