/
home
/
linetcck
/
public_html
/
New Directory
Upload File
HOME
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>About Us - Lineage Builders | Tradition Needs Innovation</title> <link rel="icon" type="image/x-icon" href="assets/images/logos/Site_icon.png" /> <!-- Tailwind CSS CDN --> <script src="https://cdn.tailwindcss.com"></script> <!-- Font Awesome 6 Free CDN (for icons) --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-KY4t9FROwDhQZ6gAcLQVoHMuqgkH6T1FOiEuRxKYpgP7dBcsVk2XNq+qqOIgU6mPESdKeGM/N5RduqXOGT+EXg==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <!-- Optional: Heroicons (if you're using them elsewhere) --> <script src="https://unpkg.com/heroicons@2.1.1/dist/heroicons.min.js"></script> <!-- Custom Style --> </head> <body class="m-0 p-0"> <?php require_once 'includes/other-pages-header.php'; ?> <main class="pt-20 px-4 sm:px-8 md:px-16 lg:px-24 xl:px-32 bg-white text-gray-800"> <!-- ABOUT --> <section id="about" class="relative py-20 bg-gradient-to-b from-white via-slate-50 to-white"> <div class="container mx-auto px-6 lg:px-12"> <!-- Heading --> <div class="text-center max-w-3xl mx-auto"> <p class="text-3xl md:text-4xl font-semibold text-slate-800 leading-snug"> A Modern Approach to Custom Homebuilding Rooted in Integrity and Craft </p> </div> <!-- Content --> <div class="mt-14 grid gap-12 md:grid-cols-2 lg:gap-20 items-center"> <!-- Copy --> <div class="space-y-6 text-[16px] leading-8 text-slate-600"> <p> Lineage Builders is a boutique, full-service construction firm specializing in bespoke custom homes and transformative renovations across the South Bay from the hills of Palos Verdes to the avenues of Manhattan Beach. </p> <p> What sets us apart isn’t just what we build, it’s how we build. As licensed general contractors and real estate brokers, we offer a rare end-to-end approach: from property search and feasibility to financing and full construction management. We’re involved from the earliest conversations to the final walkthrough because we believe the best outcomes happen when vision, strategy, and execution are aligned from day one. </p> <p> Our team is deeply invested in every project we take on. We lead with transparency, communicate with clarity, and deliver with precision bringing together elite architects, designers, engineers, and trades to deliver a custom homebuilding experience that’s as seamless as it is inspired. </p> <p> Every home we build is tailored to the individual no templates, no shortcuts. Whether it’s a new coastal estate, a modern hillside retreat, or a legacy family renovation, we ensure each detail reflects the client’s lifestyle, taste, and long-term goals. </p> <p> We’ve built for families, founders, and forward-thinkers, always with the same mission: to create enduring spaces with soul, structure, and story. </p> <p class="font-medium text-slate-800"> At Lineage Builders, craftsmanship is our foundation. Integrity is our blueprint. And your vision is what brings it all to life. </p> </div> <!-- Image --> <div class="relative group"> <div class="aspect-[4/3] overflow-hidden rounded-3xl shadow-xl ring-1 ring-slate-200"> <img src="assets/images/real/image06.jpg" alt="Luxury modern living room interior" class="h-full w-full object-cover transition-transform duration-700 ease-out group-hover:scale-105" /> </div> <!-- Decorative dots --> <div class="mt-4 flex items-center justify-center gap-2"> <span class="inline-block h-2 w-2 rounded-full bg-slate-300"></span> <span class="inline-block h-2 w-2 rounded-full bg-slate-500"></span> </div> </div> </div> </div> </section> <section id="team" class="py-8 md:py-14 border-t border-slate-100"> <div class="container mx-auto px-4"> <div class="grid gap-10 lg:gap-16 items-start md:grid-cols-2 max-w-4xl mx-auto"> <!-- Kevin Hayes --> <article class="text-center"> <div class="overflow-hidden rounded-2xl shadow-sm mb-6"> <img src="assets/images/team/kevin_headshot.jpg" alt="Portrait of Kevin Hayes" class="h-full w-full object-cover" /> </div> <h3 class="text-2xl font-semibold text-slate-900">Kevin Hayes</h3> <p class="text-xs uppercase tracking-wider text-slate-500 mt-1">Principal</p> <p class="mt-4 text-[15px] leading-7 max-w-prose text-slate-600"> Kevin Hayes brings more than 20 years of field leadership to the team. With extensive experience overseeing custom home building, renovation, adaptive reuse of commercial and residential space, mixed-use developments, multi-family developments, and aviation facilities in California and Texas. </p> <!-- Trigger for Modal --> <button id="openKevinModal" class="mt-4 inline-block text-sm font-medium text-slate-900 underline underline-offset-4">Keep Reading</button> </article> <!-- Kevin Modal --> <div id="kevinModal" class="fixed inset-0 z-50 hidden bg-black bg-opacity-50"> <div class="flex justify-center items-center min-h-screen"> <div class="bg-white rounded-3xl max-w-4xl w-full p-6 overflow-hidden shadow-lg transform transition-all duration-300 ease-in-out scale-95 hover:scale-100"> <button id="closeKevinModal" class="absolute top-4 right-4 text-xl text-gray-700 hover:text-gray-900 focus:outline-none">×</button> <!-- Modal Content --> <div class="flex items-center space-x-6"> <!-- Image Section --> <div class="w-32 h-32 md:w-48 md:h-48 bg-gray-100 rounded-lg overflow-hidden"> <img src="assets/images/team/kevin_headshot.jpg" alt="Portrait of Kevin Hayes" class="object-cover w-full h-full" /> </div> <!-- Text Section --> <div class="flex-1"> <h3 class="text-2xl font-semibold text-slate-900">Kevin Hayes</h3> <p class="text-xs uppercase tracking-wider text-slate-500 mt-1">Principal</p> <p class="mt-4 text-[15px] leading-7 max-w-prose text-slate-600"> Kevin Hayes brings more than 20 years of field leadership to the team. With extensive experience overseeing custom home building, renovation, adaptive reuse of commercial and residential space, mixed-use developments, multi-family developments, and aviation facilities in California and Texas. </p> <p class="mt-3 text-[15px] leading-7 max-w-prose text-slate-600"> Kevin is known for his ability to keep both large and small teams aligned, focused, and moving forward no matter how ambitious the schedule or challenging conditions. </p> </div> </div> </div> </div> </div> <!-- Karsten Summers --> <article class="text-center"> <div class="overflow-hidden rounded-2xl shadow-sm mb-6"> <img src="assets/images/team/Karsten-Summers-headshot.jpg" alt="Portrait of Karsten Summers" class="h-full w-full object-cover" /> </div> <h3 class="text-2xl font-semibold text-slate-900">Karsten Summers</h3> <p class="text-xs uppercase tracking-wider text-slate-500 mt-1">Principal</p> <p class="mt-4 text-[15px] leading-7 max-w-prose text-slate-600"> Karsten Summers is a seasoned senior executive with over 25 years of customer-centric business experience. His global leadership background includes executive roles across diverse industries, where he developed a deep appreciation for languages, cultures, and architecture. </p> <!-- Trigger for Modal --> <button id="openKarstenModal" class="mt-4 inline-block text-sm font-medium text-slate-900 underline underline-offset-4">Keep Reading</button> </article> <!-- Karsten Modal --> <div id="karstenModal" class="fixed inset-0 z-50 hidden bg-black bg-opacity-50"> <div class="flex justify-center items-center min-h-screen"> <div class="bg-white rounded-3xl max-w-4xl w-full p-6 overflow-hidden shadow-lg transform transition-all duration-300 ease-in-out scale-95 hover:scale-100"> <button id="closeKarstenModal" class="absolute top-4 right-4 text-xl text-gray-700 hover:text-gray-900 focus:outline-none">×</button> <!-- Modal Content --> <div class="flex items-center space-x-6"> <!-- Image Section --> <div class="w-32 h-32 md:w-48 md:h-48 bg-gray-100 rounded-lg overflow-hidden"> <img src="assets/images/team/Karsten-Summers-headshot.jpg" alt="Portrait of Karsten Summers" class="object-cover w-full h-full" /> </div> <!-- Text Section --> <div class="flex-1"> <h3 class="text-2xl font-semibold text-slate-900">Karsten Summers</h3> <p class="text-xs uppercase tracking-wider text-slate-500 mt-1">Principal</p> <p class="mt-4 text-[15px] leading-7 max-w-prose text-slate-600"> Karsten Summers is a seasoned senior executive with over 25 years of customer-centric business experience. His global leadership background includes executive roles across diverse industries, where he developed a deep appreciation for languages, cultures, and architecture. </p> <p class="mt-3 text-[15px] leading-7 max-w-prose text-slate-600"> Karsten began his career at Enterprise Holdings (Enterprise/National/Alamo Rent a Car), where he quickly rose through the ranks in a performance-driven, customer-focused environment. </p> <p class="mt-3 text-[15px] leading-7 max-w-prose text-slate-600"> Since then, Karsten has served as CEO of two industry-leading companies in the transportation and travel sectors, both known for their strong emphasis on customer experience. He now brings that same passion and commitment to excellence to the construction and real estate services industry. </p> </div> </div> </div> </div> </div> </div> </div> </section> <script> // Get modal elements for Sahmon const openSahmonModal = document.getElementById('openSahmonModal'); const sahmonModal = document.getElementById('sahmonModal'); const closeSahmonModal = document.getElementById('closeSahmonModal'); // Open the modal when "Keep Reading" is clicked for Sahmon openSahmonModal.addEventListener('click', () => { sahmonModal.classList.remove('hidden'); }); // Close the modal when "X" is clicked closeSahmonModal.addEventListener('click', () => { sahmonModal.classList.add('hidden'); }); // Close the modal if user clicks outside of the modal content window.addEventListener('click', (e) => { if (e.target === sahmonModal) { sahmonModal.classList.add('hidden'); } }); // Modal functionality for Karsten const openKarstenModal = document.getElementById('openKarstenModal'); const karstenModal = document.getElementById('karstenModal'); const closeKarstenModal = document.getElementById('closeKarstenModal'); openKarstenModal.addEventListener('click', () => { karstenModal.classList.remove('hidden'); }); closeKarstenModal.addEventListener('click', () => { karstenModal.classList.add('hidden'); }); window.addEventListener('click', (e) => { if (e.target === karstenModal) { karstenModal.classList.add('hidden'); } }); // Modal functionality for Kevin const openKevinModal = document.getElementById('openKevinModal'); const kevinModal = document.getElementById('kevinModal'); const closeKevinModal = document.getElementById('closeKevinModal'); openKevinModal.addEventListener('click', () => { kevinModal.classList.remove('hidden'); }); closeKevinModal.addEventListener('click', () => { kevinModal.classList.add('hidden'); }); window.addEventListener('click', (e) => { if (e.target === kevinModal) { kevinModal.classList.add('hidden'); } }); </script> </main> <?php require_once 'includes/footer.php'; ?> <!-- Scripts --> <script> // Toggle mobile services dropdown function toggleMobileDropdown() { const dropdown = document.getElementById('mobileServicesDropdown'); const arrow = document.getElementById('dropdownArrow'); dropdown.classList.toggle('hidden'); arrow.classList.toggle('rotate-180'); } // Mobile menu toggle document.getElementById('mobileMenuBtn').addEventListener('click', () => { const menu = document.getElementById('mobileMenu'); menu.classList.toggle('hidden'); }); </script> </body> </html>