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

<!-- Partners Hero -->
<section class="internal-hero" style="background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.7)), url('partnersbackground.webp');">
    <div class="container py-5 text-center">
        <h1 class="display-3 fw-bold text-white mb-3">Our Partners</h1>
        <p class="lead text-white opacity-95 mx-auto" style="max-width: 700px;">Meet the founding consortium, charity partner, and supporting organisations behind the Charity Boat Race.</p>
    </div>
</section>

<!-- Founding Partners -->
<section class="py-5 bg-light">
    <div class="container py-5">
        <div class="text-center mb-5">
            <h6 class="section-label">BRIDGEWATER TRUST CIC</h6>
            <h2 class="display-5 fw-bold mt-2">Founding Consortium Partners</h2>
        </div>
        
        <div class="space-y-6 max-w-4xl mx-auto">
            <!-- Gift Foundation -->
            <div class="card p-5 border-0 shadow-sm rounded-4 mb-4 bg-white">
                <div class="row align-items-center g-4">
                    <div class="col-md-3 text-center">
                        <div class="bg-light rounded-4 p-3 d-flex align-items-center justify-content-center" style="height: 120px;">
                            <img src="assets/images/gift-foundation-logo.webp" alt="Gift" class="img-fluid" style="max-height: 80px;">
                        </div>
                    </div>
                    <div class="col-md-9">
                        <h4 class="fw-bold mb-2">Gift Foundation</h4>
                        <div class="d-flex gap-2 mb-3 flex-wrap">
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--primary), 0.1); color: hsl(var(--primary));">Education</span>
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--secondary), 0.1); color: hsl(var(--secondary));">Humanitarian Aid</span>
                        </div>
                        <p class="text-muted text-sm mb-0">Gift Foundation is a community-driven organisation dedicated to humanitarian and educational causes. They work tirelessly to fund educational projects both in the UK and internationally.</p>
                    </div>
                </div>
            </div>
            
            <!-- Sisters Forum -->
            <div class="card p-5 border-0 shadow-sm rounded-4 mb-4 bg-white">
                <div class="row align-items-center g-4">
                    <div class="col-md-3 text-center">
                        <div class="bg-light rounded-4 p-3 d-flex align-items-center justify-content-center" style="height: 120px;">
                            <img src="assets/images/sisters-forum-logo.webp" alt="Sisters Forum" class="img-fluid" style="max-height: 80px;">
                        </div>
                    </div>
                    <div class="col-md-9">
                        <h4 class="fw-bold mb-2">Sisters Forum</h4>
                        <div class="d-flex gap-2 mb-3 flex-wrap">
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--secondary), 0.1); color: hsl(var(--secondary));">Women Empowerment</span>
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--primary), 0.1); color: hsl(var(--primary));">Social Programmes</span>
                        </div>
                        <p class="text-muted text-sm mb-0">Dedicated to empowering women and girls within the community through advocacy, education and social programmes.</p>
                    </div>
                </div>
            </div>
            
            <!-- Newham Youth Link -->
            <div class="card p-5 border-0 shadow-sm rounded-4 bg-white">
                <div class="row align-items-center g-4">
                    <div class="col-md-3 text-center">
                        <div class="bg-light rounded-4 p-3 d-flex align-items-center justify-content-center" style="height: 120px;">
                            <img src="assets/images/newham-youth-link-logo.webp" alt="Newham Youth Link" class="img-fluid" style="max-height: 80px;">
                        </div>
                    </div>
                    <div class="col-md-9">
                        <h4 class="fw-bold mb-2">Newham Youth Link</h4>
                        <div class="d-flex gap-2 mb-3 flex-wrap">
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--primary), 0.1); color: hsl(var(--primary));">Youth Development</span>
                            <span class="badge px-3 py-1" style="background-color: hsla(var(--secondary), 0.1); color: hsl(var(--secondary));">Skills Training</span>
                        </div>
                        <p class="text-muted text-sm mb-0">Committed to supporting young people through mentoring, skills development, and community engagement programmes.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- Official Charity Partner -->
<section class="py-5 bg-white">
    <div class="container py-5 text-center">
        <h6 class="section-label">PLATINUM & CHARITY PARTNER</h6>
        <div class="d-flex justify-content-center align-items-center gap-4 mt-4 mb-4">
            <img src="muslimcharitylogo.webp" alt="Muslim Charity" class="img-fluid" style="max-height: 100px;">
        </div>
        <h2 class="display-6 fw-bold mb-4">Muslim Charity</h2>
        <p class="text-muted max-w-3xl mx-auto fs-5">Our official charity partner for the Charity Boat Race 2026. All fundraising efforts are directed towards their humanitarian projects around the world.</p>
    </div>
</section>

<!-- Supporting Partners -->
<section class="py-5 bg-light">
    <div class="container py-5 text-center">
        <h6 class="section-label">COMMUNITY NETWORK</h6>
        <h2 class="display-6 fw-bold mt-2 mb-5">Supporting Partners</h2>
        
        <div class="row g-4 justify-content-center">
            <div class="col-md-3">
                <div class="card p-4 border-0 shadow-sm h-100 rounded-4 bg-white">
                    <div class="rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center fw-bold text-white shadow-sm" style="width: 60px; height: 60px; background-color: hsl(var(--primary));">N</div>
                    <h6 class="fw-bold mb-2">Newark Youth London</h6>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card p-4 border-0 shadow-sm h-100 rounded-4 bg-white">
                    <div class="rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center fw-bold text-white shadow-sm" style="width: 60px; height: 60px; background-color: hsl(var(--secondary));">F</div>
                    <h6 class="fw-bold mb-2">Friendly Carrom Club UK</h6>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card p-4 border-0 shadow-sm h-100 rounded-4 bg-white">
                    <div class="rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center fw-bold text-white shadow-sm" style="width: 60px; height: 60px; background-color: #1a242d;">S</div>
                    <h6 class="fw-bold mb-2">Somali British UK</h6>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card p-4 border-0 shadow-sm h-100 rounded-4 bg-white">
                    <div class="rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center fw-bold text-white shadow-sm" style="width: 60px; height: 60px; background-color: hsl(var(--primary));">B</div>
                    <h6 class="fw-bold mb-2">Beacon Institute</h6>
                </div>
            </div>
        </div>
        
        <div class="mt-5 pt-4">
            <a href="contact.php" class="btn btn-secondary px-5 py-3">Become a Partner <i class="fas fa-arrow-right ms-2"></i></a>
        </div>
    </div>
</section>

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