<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Landing Page</title><link rel="stylesheet" href="style.css"><style>/* General Styles */body {font-family: sans-serif;margin: 0;padding: 0;box-sizing: border-box;}
/* Hero Banner Styles */.lp-hero-banner {background-image: url('placeholder-hero.jpg'); /* Replace with your image */background-size: cover;background-position: center;color: white;text-align: center;padding: 100px 0;}
.lp-hero-content {max-width: 800px;margin: 0 auto;padding: 0 20px;}
.lp-hero-title {font-size: 3em;margin-bottom: 20px;}
.lp-hero-subtitle {font-size: 1.5em;margin-bottom: 30px;}
.lp-hero-button {background-color: #007bff;color: white;padding: 15px 30px;text-decoration: none;border-radius: 5px;font-size: 1.2em;}
.lp-hero-button:hover {background-color: #0056b3;}
/* Client Logos Styles */.lp-client-logos {padding: 50px 0;background-color: #f8f9fa;}
.lp-client-container {display: flex;flex-wrap: wrap;justify-content: space-around; /* Distribute logos evenly */align-items: center;max-width: 1200px;margin: 0 auto;padding: 0 20px;}
.lp-client-logo {width: 150px; /* Adjust as needed */height: auto;margin: 20px;opacity: 0.7; /* Slightly faded logos */transition: opacity 0.3s ease;}
.lp-client-logo:hover {opacity: 1;}
/* Text Module Styles */.lp-text-module {padding: 50px 0;}
.lp-text-container {max-width: 800px;margin: 0 auto;padding: 0 20px;text-align: center;}
.lp-text-heading {font-size: 2.5em;margin-bottom: 20px;}
.lp-text-paragraph {font-size: 1.1em;line-height: 1.6;color: #555;}
/* Responsive Design */@media (max-width: 768px) {.lp-hero-title { font-size: 2.5em;}
.lp-hero-subtitle { font-size: 1.2em;}
.lp-client-logo { width: 120px; /* Smaller logos on smaller screens */}}
@media (max-width: 576px) {.lp-hero-title { font-size: 2em;}
.lp-hero-subtitle { font-size: 1em;}
.lp-client-logo { width: 100px; /* Even smaller logos on very small screens */}}</style></head><body>
<!-- Hero Banner Section --><section class="lp-hero-banner"> <div class="lp-hero-content"> <h1 class="lp-hero-title">Welcome to Our Awesome Product!</h1> <h2 class="lp-hero-subtitle">Discover the amazing features that will change your life.</h2> <a href="#" class="lp-hero-button">Learn More</a> </div></section>
<!-- Client Logos Section --><section class="lp-client-logos"> <div class="lp-client-container"> <img src="placeholder-logo-1.png" alt="Client Logo 1" class="lp-client-logo"> <img src="placeholder-logo-2.png" alt="Client Logo 2" class="lp-client-logo"> <img src="placeholder-logo-3.png" alt="Client Logo 3" class="lp-client-logo"> <img src="placeholder-logo-4.png" alt="Client Logo 4" class="lp-client-logo"> <img src="placeholder-logo-5.png" alt="Client Logo 5" class="lp-client-logo"> </div></section>
<!-- Text Module Section --><section class="lp-text-module"> <div class="lp-text-container"> <h3 class="lp-text-heading">About Us</h3> <p class="lp-text-paragraph"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p> </div></section>
</body></html>