gestoria-lp/index.php

<?php
require_once __DIR__ . '/includes/servicios-data.php';
require_once __DIR__ . '/includes/db.php';

$pageTitle = 'Inicio';
include __DIR__ . '/includes/header.php';

// Fetch active testimonials
$testimonios = [];
try {
    $pdo = getDB();
    $stmt = $pdo->query("SELECT nombre_cliente, texto, calificacion FROM testimonios WHERE activo = 1 ORDER BY created_at DESC LIMIT 6");
    $testimonios = $stmt->fetchAll();
} catch (Exception $e) {
    // Database may not be available; we'll show placeholders
}
?>

<!-- ===== HERO SECTION ===== -->
<section class="hero" id="inicio">
    <div class="hero__overlay"></div>
    <div class="container hero__content">
        <h1 class="hero__title">Tu trámite migratorio, sin complicaciones</h1>
        <p class="hero__subtitle">
            Somos expertos en visa americana, SENTRI, pasaporte y doble nacionalidad.
            Te guiamos paso a paso para que obtengas tus documentos con confianza y tranquilidad.
        </p>
        <div class="hero__actions">
            <a href="#servicios" class="btn btn--primary btn--lg">
                <i class="fa-solid fa-arrow-right"></i> Ver servicios
            </a>
            <a href="https://wa.me/521XXXXXXXXXX" target="_blank" rel="noopener" class="btn btn--outline btn--lg">
                <i class="fa-brands fa-whatsapp"></i> Escríbenos
            </a>
        </div>
    </div>
</section>

<!-- ===== SERVICES SECTION ===== -->
<section class="section services" id="servicios">
    <div class="container">
        <div class="section__header">
            <span class="section__badge">Nuestros Servicios</span>
            <h2 class="section__title">Trámites que realizamos</h2>
            <p class="section__subtitle">Ofrecemos un acompañamiento completo en cada proceso migratorio y documental.</p>
        </div>

        <div class="services__grid">
            <?php foreach ($SERVICIOS as $slug => $servicio): ?>
            <article class="card card--service">
                <div class="card__icon">
                    <i class="fa-solid <?= htmlspecialchars($servicio['icono']) ?>"></i>
                </div>
                <h3 class="card__title"><?= htmlspecialchars($servicio['nombre']) ?></h3>
                <p class="card__text">
                    <?= htmlspecialchars(mb_strimwidth($servicio['descripcion'], 0, 120, '...')) ?>
                </p>
                <a href="servicio.php?s=<?= htmlspecialchars($slug) ?>" class="card__link">
                    Más información <i class="fa-solid fa-arrow-right"></i>
                </a>
            </article>
            <?php endforeach; ?>
        </div>
    </div>
</section>

<!-- ===== WHY CHOOSE US ===== -->
<section class="section values" id="por-que">
    <div class="container">
        <div class="section__header">
            <span class="section__badge">Por qué elegirnos</span>
            <h2 class="section__title">Tu tranquilidad es nuestra prioridad</h2>
            <p class="section__subtitle">Más que una gestoría, somos tu aliado en cada trámite.</p>
        </div>

        <div class="values__grid">
            <div class="value-card">
                <div class="value-card__icon">
                    <i class="fa-solid fa-award"></i>
                </div>
                <h3 class="value-card__title">Experiencia comprobada</h3>
                <p class="value-card__text">
                    Años de experiencia resolviendo trámites migratorios con altos índices de éxito.
                </p>
            </div>

            <div class="value-card">
                <div class="value-card__icon">
                    <i class="fa-solid fa-handshake"></i>
                </div>
                <h3 class="value-card__title">Atención personalizada</h3>
                <p class="value-card__text">
                    Cada caso es único. Te brindamos asesoría individual adaptada a tu situación.
                </p>
            </div>

            <div class="value-card">
                <div class="value-card__icon">
                    <i class="fa-solid fa-eye"></i>
                </div>
                <h3 class="value-card__title">Proceso transparente</h3>
                <p class="value-card__text">
                    Sabrás en todo momento el estado de tu trámite. Sin sorpresas ni costos ocultos.
                </p>
            </div>

            <div class="value-card">
                <div class="value-card__icon">
                    <i class="fa-solid fa-shield-halved"></i>
                </div>
                <h3 class="value-card__title">Resultados garantizados</h3>
                <p class="value-card__text">
                    Nos comprometemos con tu trámite hasta obtener un resultado favorable.
                </p>
            </div>
        </div>
    </div>
</section>

<!-- ===== TESTIMONIALS SECTION ===== -->
<section class="section testimonials" id="testimonios">
    <div class="container">
        <div class="section__header">
            <span class="section__badge">Testimonios</span>
            <h2 class="section__title">Lo que dicen nuestros clientes</h2>
            <p class="section__subtitle">La satisfacción de quienes confían en nosotros es nuestro mejor aval.</p>
        </div>

        <div class="testimonials__grid">
            <?php if (!empty($testimonios)): ?>
                <?php foreach ($testimonios as $testimonio): ?>
                <div class="testimonial-card">
                    <div class="testimonial-card__stars">
                        <?php for ($i = 1; $i <= 5; $i++): ?>
                            <i class="fa-solid fa-star <?= $i <= (int)$testimonio['calificacion'] ? 'testimonial-card__star--active' : 'testimonial-card__star--inactive' ?>"></i>
                        <?php endfor; ?>
                    </div>
                    <blockquote class="testimonial-card__text">
                        "<?= htmlspecialchars($testimonio['texto']) ?>"
                    </blockquote>
                    <div class="testimonial-card__author">
                        <div class="testimonial-card__avatar">
                            <i class="fa-solid fa-user"></i>
                        </div>
                        <span class="testimonial-card__name"><?= htmlspecialchars($testimonio['nombre_cliente']) ?></span>
                    </div>
                </div>
                <?php endforeach; ?>
            <?php else: ?>
                <!-- Placeholder testimonials when database is empty -->
                <div class="testimonial-card">
                    <div class="testimonial-card__stars">
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                    </div>
                    <blockquote class="testimonial-card__text">
                        "Excelente servicio. Me ayudaron con mi visa americana desde el formulario hasta la entrevista. Todo salió perfecto."
                    </blockquote>
                    <div class="testimonial-card__author">
                        <div class="testimonial-card__avatar">
                            <i class="fa-solid fa-user"></i>
                        </div>
                        <span class="testimonial-card__name">María G.</span>
                    </div>
                </div>

                <div class="testimonial-card">
                    <div class="testimonial-card__stars">
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                    </div>
                    <blockquote class="testimonial-card__text">
                        "Gracias a Gestoría LP obtuve mi SENTRI en tiempo récord. Muy profesionales y atentos en todo momento."
                    </blockquote>
                    <div class="testimonial-card__author">
                        <div class="testimonial-card__avatar">
                            <i class="fa-solid fa-user"></i>
                        </div>
                        <span class="testimonial-card__name">Carlos R.</span>
                    </div>
                </div>

                <div class="testimonial-card">
                    <div class="testimonial-card__stars">
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                        <i class="fa-solid fa-star testimonial-card__star--active"></i>
                    </div>
                    <blockquote class="testimonial-card__text">
                        "Renové mi pasaporte sin contratiempos. El equipo fue muy amable y me guió en cada paso del proceso."
                    </blockquote>
                    <div class="testimonial-card__author">
                        <div class="testimonial-card__avatar">
                            <i class="fa-solid fa-user"></i>
                        </div>
                        <span class="testimonial-card__name">Ana L.</span>
                    </div>
                </div>
            <?php endif; ?>
        </div>
    </div>
</section>

<!-- ===== CONTACT SECTION ===== -->
<section class="section contact" id="contacto">
    <div class="container">
        <div class="section__header">
            <span class="section__badge">Contacto</span>
            <h2 class="section__title">Estamos para ayudarte</h2>
            <p class="section__subtitle">Contáctanos hoy y comienza tu trámite con expertos de tu lado.</p>
        </div>

        <div class="contact__grid">
            <!-- Contact Info -->
            <div class="contact__info">
                <div class="contact__info-card">
                    <div class="contact__info-icon">
                        <i class="fa-solid fa-phone"></i>
                    </div>
                    <div>
                        <h4>Teléfono</h4>
                        <a href="tel:+521XXXXXXXXXX">(+52) 1 XXX XXX XXXX</a>
                    </div>
                </div>

                <div class="contact__info-card">
                    <div class="contact__info-icon">
                        <i class="fa-solid fa-envelope"></i>
                    </div>
                    <div>
                        <h4>Correo electrónico</h4>
                        <a href="mailto:contacto@gestorialp.com">contacto@gestorialp.com</a>
                    </div>
                </div>

                <div class="contact__info-card">
                    <div class="contact__info-icon">
                        <i class="fa-brands fa-whatsapp"></i>
                    </div>
                    <div>
                        <h4>WhatsApp</h4>
                        <a href="https://wa.me/521XXXXXXXXXX" target="_blank" rel="noopener">Enviar mensaje</a>
                    </div>
                </div>

                <div class="contact__info-card">
                    <div class="contact__info-icon">
                        <i class="fa-solid fa-location-dot"></i>
                    </div>
                    <div>
                        <h4>Dirección</h4>
                        <p>La Paz, Baja California Sur, México</p>
                    </div>
                </div>
            </div>

            <!-- Map Placeholder -->
            <div class="contact__map">
                <iframe
                    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d57995.19084224498!2d-110.35059565!3d24.14437165!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x86afd3455e7c12dd%3A0x3fc89a52f2d77d16!2sLa%20Paz%2C%20B.C.S.!5e0!3m2!1ses!2smx!4v1700000000000!5m2!1ses!2smx"
                    width="100%"
                    height="100%"
                    style="border:0; min-height: 350px;"
                    allowfullscreen=""
                    loading="lazy"
                    referrerpolicy="no-referrer-when-downgrade"
                    title="Ubicación de Gestoría LP">
                </iframe>
            </div>
        </div>
    </div>
</section>

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