members.astro

---
import FooterBackground from '@assets/members/members-footer-background.jpeg';
import Hero from '@components/members/Hero.astro';
import MemberBenefits from '@components/members/MemberBenefits.astro';
import Testimonials from '@components/Testimonials.svelte';
import { getTestimonials } from '@data/real/testimonials';
import Layout from '@layouts/Layout.astro';
import { Image } from 'astro:assets';

const testimonials = await getTestimonials();
---

<Layout title="Mitgliedschaft">
  <Hero />
  <MemberBenefits />

  <div class="lg:py-24">
    <Testimonials client:load {testimonials} />
  </div>
  <Image
    alt="YoungVision Menschen sitzen am Lagerfeuer"
    class="h-[35rem] w-full object-cover lg:h-[60rem]"
    sizes="(min-width: 1380px) 100vw, (min-width: 1040px) calc(25vw + 1020px), (min-width: 800px) 100vw, 731px"
    src={FooterBackground}
    widths={[747, 1070, 1308, 1494, 1720, 1920, 2048, 2241]}
  />
</Layout>