Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 4.18.0-553.40.1.lve.el8.x86_64

PHP Version:

8.2.27

User:

u205613439

Directory:

/home/u205613439/domains/projectsunleashed.com/public_html

Free Space:

3.03 TB

🔧 Quick Actions

✏️ Editing: turnkey-execution.php

<?php include 'include/header.php'; ?> 
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>SShomes - Turnkey Execution Services</title>         
    <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@300;400;500&display=swap" rel="stylesheet"> 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
    <style>
        * { 
            margin: 0; 
            padding: 0; 
            box-sizing: border-box; 
            font-family: Caramella, Regular;
        }
        
        body { 
            color: #333;
            background-color: #faf7f5;
            text-align: justify;
        } 
        
        .section-title { 
            text-align: center; 
            font-size: 78px; 
            color: #666; 
            margin-bottom: 3rem; 
            position: relative; 
            font-weight: normal; 
            letter-spacing: 0px; 
        }
        
        /* Hero Section */
        .hero {
            position: relative;
            height: 80vh;
            background: url('img/turnkey_banner.png') center/cover;
        }
        
        .hero::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
        }
        
        .hero-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: auto;
            text-align: center;
            color: white;
            z-index: 1;
        }
        
        .hero-content h1 { 
            font: normal normal normal 78px/87px Caramella;
            letter-spacing: 0px; 
            color: #F3EEE8; 
            opacity: 1;
            margin-bottom: 20px;
        }
        
        .hero-content p {
            font-size: 24px;
            max-width: 800px;
            margin: 0 auto 30px;
        }
        
        .connect-btn1 {
            background: #A67B5B;
            color: white;
            padding: 0.5rem 1.5rem;
            text-decoration: none;
            border: 2px solid transparent;
            transition: all 0.3s ease-in-out;
            display: inline-block;
        }
        
        .connect-btn1:hover {
            background: transparent;
            border: 2px solid #A67B5B;
            color: white;
        }
        
        /* About Turnkey Section */
        .about-turnkey {
            padding: 80px 20px;
            background-color: #F3EEE8;
        }
        
        .about-container {
            max-width: 1200px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 50px;
            align-items: center;
        }
        
        .about-content h2 {
            font-size: 42px;
            color: #A67B5B;
            margin-bottom: 30px;
        }
        
        .about-content p {
            font-size: 18px;
            line-height: 1.8;
            margin-bottom: 20px;
            color: #555;
        }
        
        .about-image {
            position: relative;
        }
        
        .about-image img {
            width: 100%;
            height: auto;
            border-radius: 8px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        }
        
        .about-image::after {
            content: '';
            position: absolute;
            top: 20px;
            right: -20px;
            width: 100%;
            height: 100%;
            border: 5px solid #A67B5B;
            border-radius: 8px;
            z-index: -1;
        }
        
        /* Process Section */
        .process-section {
            padding: 80px 20px;
            background-color: #fff;
        }
        
        .process-container {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .process-steps {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 30px;
            margin-top: 50px;
        }
        
        .process-step {
            text-align: center;
            position: relative;
            padding: 30px 20px;
            background-color: #F3EEE8;
            border-radius: 8px;
            transition: all 0.3s ease;
        }
        
        .process-step:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.1);
        }
        
        .step-number {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background-color: #A67B5B;
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
            margin: 0 auto 20px;
        }
        
        .step-title {
            font-size: 24px;
            color: #333;
            margin-bottom: 15px;
        }
        
        .step-description {
            font-size: 16px;
            color: #666;
            line-height: 1.6;
        }
        
        .process-step:not(:last-child)::after {
            content: '';
            position: absolute;
            top: 40px;
            right: -15px;
            width: 30px;
            height: 2px;
            background-color: #A67B5B;
            z-index: 1;
        }
        
        /* Services Section */
        .services-section {
            padding: 80px 20px;
            background-color: #F3EEE8;
        }
        
        .services-container {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .services-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
            margin-top: 50px;
        }
        
        .service-card {
            background-color: white;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: all 0.3s ease;
        }
        
        .service-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.1);
        }
        
        .service-image {
            height: 200px;
            overflow: hidden;
        }
        
        .service-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.3s ease;
        }
        
        .service-card:hover .service-image img {
            transform: scale(1.1);
        }
        
        .service-content {
            padding: 20px;
        }
        
        .service-title {
            font-size: 22px;
            color: #A67B5B;
            margin-bottom: 10px;
        }
        
        .service-description {
            font-size: 16px;
            color: #666;
            line-height: 1.6;
            margin-bottom: 15px;
        }
        
        /* Benefits Section */
        .benefits-section {
            padding: 80px 20px;
            background-color: #fff;
        }
        
        .benefits-container {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .benefits-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 30px;
            margin-top: 50px;
        }
        
        .benefit-item {
            text-align: center;
            padding: 30px 20px;
            border: 2px solid #F3EEE8;
            border-radius: 10px;
            transition: all 0.3s ease;
        }
        
        .benefit-item:hover {
            border-color: #A67B5B;
            transform: translateY(-5px);
        }
        
        .benefit-icon {
            font-size: 40px;
            color: #A67B5B;
            margin-bottom: 20px;
        }
        
        .benefit-title {
            font-size: 20px;
            color: #333;
            margin-bottom: 15px;
        }
        
        .benefit-description {
            font-size: 16px;
            color: #666;
            line-height: 1.6;
        }
        
        /* Projects Showcase */
        .projects-showcase {
            padding: 80px 20px;
            background-color: #F3EEE8;
        }
        
        .projects-container {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .projects-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
            margin-top: 50px;
        }
        
        .project-card {
            position: relative;
            height: 300px;
            overflow: hidden;
            border-radius: 8px;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .project-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.3s ease, filter 0.3s ease;
        }
        
        .project-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0);
            transition: background 0.3s ease;
            z-index: 1;
        }
        
        .project-card::after {
            content: "→";
            font-size: 2rem;
            color: #A67B5B;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%) scale(1);
            opacity: 0;
            transition: opacity 0.3s ease, transform 0.3s ease;
            z-index: 2;
        }
        
        .project-card:hover img {
            transform: scale(1.05);
            filter: brightness(50%);
        }
        
        .project-card:hover::before {
            background: rgba(0, 0, 0, 0.5);
        }
        
        .project-card:hover::after {
            opacity: 1;
            transform: translate(-50%, -50%) scale(1.2);
        }
        
        /* Testimonials Section */
        .testimonials {
            padding: 80px 20px;
            background-color: #fff;
        }
        
        .testimonials-container {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .testimonials-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
            margin-top: 50px;
        }
        
        .testimonial-card {
            background-color: #F3EEE8;
            padding: 30px;
            border-radius: 8px;
            position: relative;
        }
        
        .quote-mark {
            color: #A67B5B;
            font-size: 4rem;
            line-height: 1;
            position: absolute;
            top: 10px;
            left: 20px;
            opacity: 0.3;
        }
        
        .testimonial-text {
            color: #666;
            line-height: 1.6;
            margin-bottom: 20px;
            position: relative;
            z-index: 1;
        }
        
        .testimonial-author {
            color: #A67B5B;
            font-weight: 500;
            font-size: 18px;
        }
        
        /* CTA Section */
        .cta-section {
            padding: 100px 20px;
            background: url('img/cta_background.jpg') center/cover;
            position: relative;
            text-align: center;
        }
        
        .cta-section::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7);
        }
        
        .cta-container {
            max-width: 800px;
            margin: 0 auto;
            position: relative;
            z-index: 1;
        }
        
        .cta-title {
            font-size: 42px;
            color: #fff;
            margin-bottom: 20px;
        }
        
        .cta-description {
            font-size: 18px;
            color: #f1f1f1;
            margin-bottom: 40px;
            line-height: 1.6;
        }
        
        .cta-btn {
            display: inline-block;
            background-color: #A67B5B;
            color: white;
            padding: 15px 40px;
            font-size: 18px;
            text-decoration: none;
            border-radius: 4px;
            transition: all 0.3s ease;
            border: 2px solid #A67B5B;
        }
        
        .cta-btn:hover {
            background-color: transparent;
            color: white;
        }
        
        /* Stats Section */
        .stats-section {
            padding: 80px 20px;
            background-color: #F3EEE8;
        }
        
        .stats-container {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap;
            gap: 50px;
        }
        
        .stat-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
        }
        
        .stat-number {
            font-size: 3rem;
            color: #A67B5B;
            font-weight: 600;
            line-height: 1.2;
            margin-bottom: 10px;
        }
        
        .stat-label {
            font-size: 1.2rem;
            color: #666;
        }
        
        /* Responsive Styles */
        @media (max-width: 1200px) {
            .section-title {
                font-size: 60px;
            }
            
            .hero-content h1 {
                font-size: 60px;
                line-height: 70px;
            }
            
            .hero-content p {
                font-size: 20px;
            }
            
            .process-steps {
                grid-template-columns: repeat(2, 1fr);
                gap: 40px;
            }
            
            .process-step:nth-child(2)::after {
                display: none;
            }
            
            .benefits-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        @media (max-width: 992px) {
            .section-title {
                font-size: 48px;
            }
            
            .hero-content h1 {
                font-size: 48px;
                line-height: 56px;
            }
            
            .hero-content p {
                font-size: 18px;
            }
            
            .about-container {
                grid-template-columns: 1fr;
            }
            
            .about-image {
                order: -1;
            }
            
            .services-grid, .projects-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .testimonials-grid {
                grid-template-columns: 1fr;
                max-width: 600px;
                margin-left: auto;
                margin-right: auto;
            }
        }
        
        @media (max-width: 768px) {
            .section-title {
                font-size: 36px;
                margin-bottom: 2rem;
            }
            
            .hero {
                height: 60vh;
            }
            
            .hero-content h1 {
                font-size: 36px;
                line-height: 42px;
            }
            
            .hero-content p {
                font-size: 16px;
            }
            
            .process-steps {
                grid-template-columns: 1fr;
            }
            
            .process-step::after {
                display: none;
            }
            
            .services-grid, .projects-grid, .benefits-grid {
                grid-template-columns: 1fr;
            }
            
            .stats-container {
                flex-direction: column;
                gap: 30px;
            }
        }
        
        @media (max-width: 480px) {
            .hero-content h1 {
                font-size: 28px;
                line-height: 36px;
            }
            
            .hero-content p {
                font-size: 14px;
            }
            
            .connect-btn1 {
                padding: 0.4rem 1.2rem;
                font-size: 14px;
            }
            
            .about-content h2, .cta-title {
                font-size: 28px;
            }
            
            .about-content p, .cta-description {
                font-size: 16px;
            }
            
            .step-title {
                font-size: 20px;
            }
            
            .step-description, .service-description, .benefit-description {
                font-size: 14px;
            }
        }
        
        /* Landscape Tablet Specific */
        @media (min-width: 992px) and (max-width: 1200px) and (orientation: landscape) {
            .process-steps {
                grid-template-columns: repeat(4, 1fr);
            }
            
            .process-step:nth-child(2)::after {
                display: block;
            }
            
            .benefits-grid {
                grid-template-columns: repeat(4, 1fr);
            }
        }

/*  */
        .parallax-section {
      background-attachment: fixed;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
      text-align: center;
      padding: 60px 20px;
    }

/* Specific Backgrounds for Parallax */
    .hero {
      background-image: url('img/turnkey_banner.png');
    }

.interior-residential {
      background-image: url('images/interior.jpg');
    }

.architecture-design {
      background-image: url('images/architecture.jpg');
    }

@media (max-width: 768px) {
      .parallax-section {
        background-attachment: scroll;
      }
    }
    </style>
</head>     
<body> 
             
    <section class="hero parallax-section"> 
        <div class="hero-content"> 
            <h1>Turnkey Execution</h1> 
            <p>From concept to completion, we handle every aspect of your project with precision and excellence</p>
            <a href="#contact" class="connect-btn1">Get a Quote</a>
        </div>             
    </section>

<section class="about-turnkey">
        <div class="about-container">
            <div class="about-content">
                <h2 style="text-align:left;">Comprehensive Turnkey Solutions</h2>
                <p>At SShomes, our turnkey execution service offers a seamless, end-to-end solution for your interior design and construction needs. We take complete responsibility for your project from the initial concept to the final handover, ensuring a stress-free experience.</p>
                <p>Our dedicated team of designers, architects, and project managers work in perfect harmony to deliver exceptional results that exceed your expectations. With our turnkey approach, you can enjoy the transformation of your space without the hassle of coordinating multiple contractors or suppliers.</p>
                <p>We pride ourselves on our attention to detail, quality craftsmanship, and timely delivery, making us the preferred choice for discerning clients seeking a truly comprehensive service.</p>
            </div>
            <div class="about-image">
                <img src="img/turnkey_about.png" alt="Turnkey Execution Process">
            </div>
        </div>
    </section>

<section class="process-section">
        <div class="process-container">
            <h2 class="section-title">Our Process</h2>
            <div class="process-steps">
                <div class="process-step">
                    <div class="step-number">01</div>
                    <h3 class="step-title">Consultation</h3>
                    <p class="step-description">We begin with an in-depth consultation to understand your vision, requirements, and budget constraints for your project.</p>
                </div>
                
                <div class="process-step">
                    <div class="step-number">02</div>
                    <h3 class="step-title">Design & Planning</h3>
                    <p class="step-description">Our design team creates detailed plans, 3D visualizations, and material selections tailored to your preferences.</p>
                </div>
                
                <div class="process-step">
                    <div class="step-number">03</div>
                    <h3 class="step-title">Execution</h3>
                    <p class="step-description">Our skilled craftsmen and project managers bring the designs to life with precision and attention to detail.</p>
                </div>
                
                <div class="process-step">
                    <div class="step-number">04</div>
                    <h3 class="step-title">Handover</h3>
                    <p class="step-description">We complete the project with a thorough quality check and hand over a perfectly finished space ready for you to enjoy.</p>
                </div>
            </div>
        </div>
    </section>

<section class="services-section">
        <div class="services-container">
            <h2 class="section-title">Our Turnkey Services</h2>
            <div class="services-grid">
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t1.png" alt="Interior Design">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Interior Design</h3>
                        <p class="service-description">Comprehensive interior design services including space planning, color schemes, furniture selection, and styling to create a cohesive and beautiful space.</p>
                    </div>
                </div>
                
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t2.png" alt="Construction & Renovation">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Construction & Renovation</h3>
                        <p class="service-description">Complete construction and renovation services including structural changes, flooring, ceiling work, electrical, plumbing, and painting.</p>
                    </div>
                </div>
                
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t4.png" alt="Custom Furniture">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Custom Furniture</h3>
                        <p class="service-description">Bespoke furniture design and manufacturing tailored to your specific requirements, ensuring unique pieces that perfectly fit your space.</p>
                    </div>
                </div>
                
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t6.png" alt="Lighting Solutions">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Lighting Solutions</h3>
                        <p class="service-description">Comprehensive lighting design and implementation to enhance the ambiance and functionality of your space.</p>
                    </div>
                </div>
                
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t7.png" alt="Decor & Styling">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Decor & Styling</h3>
                        <p class="service-description">Curated decor elements and styling services to add the finishing touches that make your space truly special.</p>
                    </div>
                </div>
                
                <div class="service-card">
                    <div class="service-image">
                        <img src="img/t8.png" alt="Project Management">
                    </div>
                    <div class="service-content">
                        <h3 class="service-title">Project Management</h3>
                        <p class="service-description">Dedicated project management to ensure smooth execution, quality control, and timely completion of your project.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

<section class="benefits-section">
        <div class="benefits-container">
            <h2 class="section-title">Benefits of Our Turnkey Approach</h2>
            <div class="benefits-grid">
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-clock"></i>
                    </div>
                    <h3 class="benefit-title">Time Efficiency</h3>
                    <p class="benefit-description">Save valuable time with our streamlined process that eliminates the need for coordinating multiple contractors.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-coins"></i>
                    </div>
                    <h3 class="benefit-title">Cost Effectiveness</h3>
                    <p class="benefit-description">Benefit from our industry relationships and bulk purchasing power to optimize your budget.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-check-circle"></i>
                    </div>
                    <h3 class="benefit-title">Quality Assurance</h3>
                    <p class="benefit-description">Enjoy peace of mind with our rigorous quality control processes at every stage of your project.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-handshake"></i>
                    </div>
                    <h3 class="benefit-title">Single Point of Contact</h3>
                    <p class="benefit-description">Communicate with a dedicated project manager who oversees all aspects of your project.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-palette"></i>
                    </div>
                    <h3 class="benefit-title">Design Consistency</h3>
                    <p class="benefit-description">Ensure a cohesive design vision is maintained throughout all elements of your project.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-tasks"></i>
                    </div>
                    <h3 class="benefit-title">Hassle-Free Process</h3>
                    <p class="benefit-description">Eliminate the stress of managing multiple aspects of your project with our comprehensive service.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-calendar-check"></i>
                    </div>
                    <h3 class="benefit-title">Timely Delivery</h3>
                    <p class="benefit-description">Benefit from our proven track record of completing projects on schedule.</p>
                </div>
                
                <div class="benefit-item">
                    <div class="benefit-icon">
                        <i class="fas fa-shield-alt"></i>
                    </div>
                    <h3 class="benefit-title">Warranty Support</h3>
                    <p class="benefit-description">Enjoy comprehensive warranty coverage on all aspects of our work for your peace of mind.</p>
                </div>
            </div>
        </div>
    </section>

<section class="projects-showcase">
        <div class="projects-container">
            <h2 class="section-title">Our Turnkey Projects</h2>
            <div class="projects-grid">
                <a href="project.php" class="project-card">
                    <img src="img/t9.png" alt="Luxury Residence">
                </a>
                <a href="project.php" class="project-card">
                    <img src="img/t10.png" alt="Modern Apartment">
                </a>
                <a href="project.php" class="project-card">
                    <img src="img/t11.png" alt="Corporate Office">
                </a>
                <a href="project.php" class="project-card">
                    <img src="img/hospitalityimages.png" alt="Retail Space">
                </a>
                <a href="project.php" class="project-card">
                    <img src="img/hospitalityimages(7).png" alt="Hospitality Project">
                </a>
                <a href="project.php" class  alt="Hospitality Project">
                </a>
                <a href="project.php" class="project-card">
                    <img src="img/hospitalityimages(2).png" alt="Villa Renovation">
                </a>
            </div>
        </div>
    </section>

<?php include 'include/footer.php'; ?>

// Intersection Observer to trigger counter animation when visible
        function handleIntersection(entries, observer) {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    // Start counter animations
                    animateCounter('projects-count', 120, 2000);
                    animateCounter('area-count', 250000, 2000);
                    animateCounter('clients-count', 95, 2000);
                    animateCounter('team-count', 35, 2000);

// Unobserve after triggering
                    observer.unobserve(entry.target);
                }
            });
        }

// Create and setup the Intersection Observer
        const observer = new IntersectionObserver(handleIntersection, {
            root: null,
            threshold: 0.1
        });

// Observe the stats container
        document.addEventListener('DOMContentLoaded', function() {
            observer.observe(document.querySelector('.stats-container'));
        });
    </script>
</body>     
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: turnkey-execution.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation