Images shrinking instead of text

<section
  id="about"
  class="min-h-svh flex flex-col md:flex-row items-center gap-6 px-4 sm:px-12 py-6 sm:py-7"
>
  <div
    class="flex flex-col justify-between items-start md:max-h-[calc(100svh-3.5rem)]"
  >
    <Logo />

    <div class="text-orange space-y-7">
      <p>
        RixtMixt is a premium design label for contemporary, fresh textile
        accessories. Crafted by top-tier manufacturers in Italy, every product
        is held to the highest standards of quality and sustainability.
      </p>
      <p>
        Backed by years of experience working with Europe's leading high-end
        fashion producers, the RixtMixt team is passion- ate about shaping
        trends and staying ahead of the curve in the ever-evolving world of
        fashion.
      </p>
      <p>RixtMixt is powered by Little Black Buzzer.</p>
    </div>
    <Image
      src={certificates}
      alt="Certificates"
      class="h-full w-auto object-contain"
    />
  </div>
  <div class="flex flex-col lg:flex-row gap-6 md:max-h-[calc(100svh-3.5rem)]">
    <div class="h-[calc(100svh-3.5rem)]">
      <Image
        src={factory}
        alt="Factory"
        class="sm:max-h-[calc(100svh-3.5rem)] object-contain w-fit"
      />
    </div>
    <div class="flex flex-col justify-between">
      <Image
        src={socks1}
        alt="Socks 1"
        class="w-fit max-h-[calc(50%-1rem)] object-contain"
      />
      <Image
        src={socks2}
        alt="Socks 2"
        class="w-fit max-h-[calc(50%-1rem)] object-contain"
      />
    </div>
  </div>
</section>