fix

src/components/Section.astro

@@ -14,7 +14,7 @@ const { title, description, className, id } = Astro.props
 <section
   id={id}
   class={cn(
-    'overflow-hidden w-full flex flex-col gap-5 py-16 px-5 md:px-10 lg:p-24 md:gap-12 h-full justify-center',
+    'overflow-hidden w-full flex flex-col gap-5 py-16 px-5 md:px-10 lg:p-24 md:gap-12 min-h-full justify-center',
     className
   )}
 >

src/components/swiper/simple-swiper.css

@@ -1,15 +1,10 @@
 .simple-swiper {
   width: 100%;
-  /* height: 100%; */
   overflow: visible;
   display: flex;
   flex-direction: column;
 }
 
-.swiper-wrapper {
-  height: auto;
-}
-
 .swiper-pagination-fraction {
   @apply text-xl w-auto;
 }

src/pages/coaches/[...slug].astro

@@ -42,7 +42,7 @@ const [thumbs, optimizedGallery] = galleryWithCover
             client:only="react"
             images={optimizedGallery}
             thumbs={thumbs}
-            imageClassName="aspect-3/4 max-w-[35vh] lg:w-auto object-top mx-auto lg:max-h-[70vh]"
+            imageClassName="aspect-3/4 h-full max-w-[35vh] lg:w-auto object-top mx-auto lg:max-w-[50vh]"
           />
           <div class="flex flex-1 flex-col gap-8">
             <h1 class="font-bold lg:text-nowrap">{data.name}</h1>

src/pages/index.astro

@@ -89,7 +89,7 @@ const t = useTranslations(lang)
 
   {
     services && (
-      <Section id="services" title={t('services.title')} className="h-auto">
+      <Section id="services" title={t('services.title')} className="min-h-none">
         <Services client:visible services={services} />
       </Section>
     )
@@ -97,7 +97,7 @@ const t = useTranslations(lang)
 
   {
     optimizedReviews && (
-      <Section id="reviews" title={t('reviews.title')} className="h-auto">
+      <Section id="reviews" title={t('reviews.title')} className="min-h-none">
         <Reviews client:only="react" reviews={optimizedReviews} lang={lang} />
       </Section>
     )