.about-me {
  @apply grid lg:grid-cols-5 lg:grid-rows-1 items-center max-lg:grid-rows-7 max-[54rem]:grid-rows-6 max-[42rem]:grid-rows-5 max-sm:grid-rows-7 max-[36rem]:grid-rows-6 max-[30rem]:grid-rows-5 gap-4 md:px-28 sm:px-14 px-5 w-full xl:h-240 h-auto max-sm:h-320 lg:mb-10 bg-no-repeat lg:bg-cover bg-size-[100%] lg:bg-[url('/src/assets/images/banners/background-about.svg')] bg-[url('/src/assets/images/banners/background-about-mobile.svg')] lg:bg-center bg-top;
}

.container-text-about {
  @apply max-lg:h-full lg:col-start-3 lg:row-start-auto max-lg:row-start-5 max-[54rem]:row-start-4 max-[42rem]:row-start-3 max-sm:row-start-5 max-[36rem]:row-start-4 max-[30rem]:row-start-3 row-span-3 lg:col-span-3 text-primary my-10 max-[24rem]:-mt-3/5;

  h4 {
    @apply sm:text-3xl text-lg font-extrabold text-center max-sm:px-4;
  }

  p {
    @apply sm:text-2xl font-bold pl-5;
  }
}

.subtext-about {
  @apply flex flex-col md:mt-12 mt-7 gap-4;
}