<template>
  <section class="flex flex-row">
    <div class="lg:w-5/12 pl-5 pr-5 shadow-md bg-[url('/assets/img/png/shadow.png')]">
      <UiHeading tag="H2" size="300" class="text-three mb-4 mt-5">
        💔 Ты не одна.
        <br />Я знаю, через что ты<br />
        проходишь.
      </UiHeading>
      <UiParagraph size="250" class="xl:max-w-[392px] mb-5"
        >Когда ты снова и снова отдаёшь сердце, а в ответ — тишина или игра, это ранит. Я знаю это
        чувство. Я был по ту сторону: манипулировал, очаровывал, уходил.

        <br /><br />Я — бывший Казанова. И однажды я понял: больше так нельзя.

        <br /><br />Эти книги — не теория. Это ключ к пониманию, как устроена мужская психология,
        чего на самом деле хочет мужчина, и как перестать теряться в отношениях.

        <br /><br />Я написал их для тебя — чтобы ты могла быть счастливой, не прогибаясь, не
        умоляя, не теряя себя. Если ты устала «играть», если хочешь любви по-настоящему — начни с
        первой страницы. В этих книгах нет воды. Только правда.</UiParagraph
      >
    </div>
    <div class="lg:w-7/12">
      <NuxtImg
        src="/img/webp/meetingAlone.webp"
        alt="meeting"
        width="100%"
        height="100%"
        loading="lazy"
      />
    </div>
  </section>
</template>

<script setup lang="ts">
import UiHeading from '@/components/Typography/UiHeading.vue'
import UiParagraph from '@/components/Typography/UiParagraph.vue'
</script>
