<?php
$venueImg = 'https://media.base44.com/images/public/69e66d4f5cbdfbede14257e1/d95281e29_generated_image.png';
include 'includes/header.php';
?>

<section class="ref-hero-image">
    <div class="ref-hero-image-bg" aria-hidden="true">
        <img src="<?php echo htmlspecialchars($venueImg, ENT_QUOTES, 'UTF-8'); ?>" alt="London Regatta Centre" width="1920" height="1080" class="ref-hero-image-photo" loading="eager" decoding="async">
        <div class="ref-hero-image-overlay"></div>
    </div>
    <div class="container ref-hero-image-inner px-3 px-sm-4">
        <h1 class="ref-hero-title text-white mb-4">The Venue</h1>
        <p class="ref-hero-lead text-white opacity-75 mx-auto mb-0">London Regatta Centre — A premier, Olympic-standard rowing facility in the heart of the Docklands.</p>
    </div>
</section>

<section class="ref-page-section">
    <div class="container ref-max-6xl px-3 px-sm-4 py-4 py-md-5">
        <div class="row g-5 align-items-stretch">
            <div class="col-lg-6">
                <div class="ref-venue-photo-wrap rounded-4 overflow-hidden shadow-lg">
                    <img src="<?php echo htmlspecialchars($venueImg, ENT_QUOTES, 'UTF-8'); ?>" alt="London Regatta Centre" width="1200" height="675" class="img-fluid w-100 ref-aspect-video object-fit-cover" loading="lazy" decoding="async">
                </div>
            </div>
            <div class="col-lg-6 d-flex flex-column justify-content-center">
                <h2 class="ref-venue-h2 mb-3">London Regatta Centre</h2>
                <p class="text-muted ref-venue-body mb-4">The London Regatta Centre is a premier, Olympic-standard rowing and dragon boat facility in the Docklands, featuring a 2,000m, seven-lane course in the Royal Albert Dock.</p>
                <div class="d-flex flex-column gap-4 mb-4">
                    <div class="d-flex gap-3">
                        <div class="form-page-icon-tile">
                            <i data-lucide="map-pin" class="lucide-20 text-primary"></i>
                        </div>
                        <div>
                            <p class="fw-medium text-body mb-0">Address</p>
                            <p class="text-muted small mb-0">London Regatta Centre, Dockside Road, London, E16 2QT</p>
                        </div>
                    </div>
                    <div class="d-flex gap-3">
                        <div class="form-page-icon-tile">
                            <i data-lucide="train-front" class="lucide-20 text-primary"></i>
                        </div>
                        <div>
                            <p class="fw-medium text-body mb-0">Public Transport</p>
                            <p class="text-muted small mb-0">Nearest station: Royal Albert DLR. We recommend using public transport where possible.</p>
                        </div>
                    </div>
                    <div class="d-flex gap-3">
                        <div class="form-page-icon-tile">
                            <i data-lucide="circle-parking" class="lucide-20 text-primary"></i>
                        </div>
                        <div>
                            <p class="fw-medium text-body mb-0">Parking</p>
                            <p class="text-muted small mb-0">Limited paid on-site parking available.</p>
                        </div>
                    </div>
                    <div class="d-flex gap-3">
                        <div class="form-page-icon-tile">
                            <i data-lucide="calendar" class="lucide-20 text-primary"></i>
                        </div>
                        <div>
                            <p class="fw-medium text-body mb-0">Event Date</p>
                            <p class="text-muted small mb-0">14th June 2026</p>
                        </div>
                    </div>
                </div>
                <div class="mt-2">
                    <a href="https://maps.google.com/?q=London+Regatta+Centre+E16+2QT" target="_blank" rel="noopener noreferrer" class="btn ref-btn-maps d-inline-flex align-items-center gap-2 rounded-pill px-4">
                        Open in Maps
                        <i data-lucide="external-link" class="lucide-16"></i>
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>

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