<turbo-stream action="append" target="infinite-scroll-list"><template>
    <li class="relative intersect:motion-preset-slide-up intersect-once group">
  <a class="absolute z-[1] inset-0" data-turbo-frame="_top" href="/coexister/ondee"></a>
  <div
    class="
      card bg-base-200 group-hover:bg-base-300 rounded-box overflow-hidden relative h-full
      
    "
  >
    <figure class="bg-base-300 relative h-54">
        <img class="object-cover h-full w-full relative " alt="Ondée" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImRmZmZlNzM2LTNlNzAtNDAwMS1hMzA5LTVhYWNkYjA0NWQzZSIsInB1ciI6ImJsb2JfaWQifX0=--08b8258c1b53564e590573ca67808739bcab8227/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOlsxMDAwLDEwMDBdfSwicHVyIjoidmFyaWF0aW9uIn19--ec155f257b371fc1c61a9104ce1570dbb12eb38b/unnamed-3.jpg" />
      <div class="absolute inset-x-0 -bottom-[1px]">
        <svg
          class="text-base-200 group-hover:text-base-300"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 1200 120"
          preserveAspectRatio="none"
        >
          <path
            fill="currentColor"
            d="M600,112.77C268.63,112.77,0,65.52,0,7.23V120H1200V7.23C1200,65.52,931.37,112.77,600,112.77Z"
          ></path>
        </svg>
      </div>
    </figure>
    <div class="card-body relative backdrop-blur-sm">
      <div class="absolute -top-10 inset-x-0 px-6">
        <div class="flex flex-row justify-between items-center w-full">
          <div class="relative invisible">
            <span class="p-2 mask mask-squircle bg-white"><img class="object-contain flex items-center justify-center size-10" alt="Co&amp;xister" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImE3NmQ2Nzc1LWI3MTgtNDY4Yi05NTEzLTQyZGQ5NTVmZGUxZCIsInB1ciI6ImJsb2JfaWQifX0=--8334a994b75cbca35553be525502352bd61fb3af/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMjAsMTIwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--aaeb784e17f38575559a7f53815fb4368bf2d17b/COEXISTER_logo_kaki_cercle%20(1).avif" /></span>
</div>            <button
              class="
                btn btn-xs btn-warning btn-circle border-none relative -mb-4 ring-4
                ring-base-200 group-hover:ring-base-300
              "
            >
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-4">
  <path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path>
  <path d="m12 13-1-1 2-2-3-3 2-2"></path>
</svg>
            </button>
        </div>
      </div>
      <div class="flex flex-col">
        <div class="flex flex-row gap-3 items-center justify-between">
          <h2 class="card-title font-serif text-2xl">
            Ondée
          </h2>
        </div>
      </div>
      <p class="whitespace-pre-wrap line-clamp-3">Très craintive au départ, Ondée nous a depuis offert une confiance inconditionnelle, mais comme la majorité des cochons nains, elle ne laisse approcher que les personnes qu&#39;elle connaît bien.

En mère protectrice, elle sait aussi faire fuir les animaux qui s&#39;approcheraient trop près de son clan.</p>
    </div>
  </div>
</li>
    <li class="relative intersect:motion-preset-slide-up intersect-once group">
  <a class="absolute z-[1] inset-0" data-turbo-frame="_top" href="/coexister/miana"></a>
  <div
    class="
      card bg-base-200 group-hover:bg-base-300 rounded-box overflow-hidden relative h-full
      
    "
  >
    <figure class="bg-base-300 relative h-54">
        <img class="object-cover h-full w-full relative " alt="Miana" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImYwNWVmYTc4LTgwODYtNDE2OC05MGI3LWI4NDU1NzU2ODE2ZiIsInB1ciI6ImJsb2JfaWQifX0=--491485c21f59faefc435b833a648c1fb84176959/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMDAwLDEwMDBdfSwicHVyIjoidmFyaWF0aW9uIn19--8ab86d46e46e8be893ce77955bcdadf78ac32a79/image%20(1).png" />
      <div class="absolute inset-x-0 -bottom-[1px]">
        <svg
          class="text-base-200 group-hover:text-base-300"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 1200 120"
          preserveAspectRatio="none"
        >
          <path
            fill="currentColor"
            d="M600,112.77C268.63,112.77,0,65.52,0,7.23V120H1200V7.23C1200,65.52,931.37,112.77,600,112.77Z"
          ></path>
        </svg>
      </div>
    </figure>
    <div class="card-body relative backdrop-blur-sm">
      <div class="absolute -top-10 inset-x-0 px-6">
        <div class="flex flex-row justify-between items-center w-full">
          <div class="relative invisible">
            <span class="p-2 mask mask-squircle bg-white"><img class="object-contain flex items-center justify-center size-10" alt="Co&amp;xister" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImE3NmQ2Nzc1LWI3MTgtNDY4Yi05NTEzLTQyZGQ5NTVmZGUxZCIsInB1ciI6ImJsb2JfaWQifX0=--8334a994b75cbca35553be525502352bd61fb3af/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMjAsMTIwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--aaeb784e17f38575559a7f53815fb4368bf2d17b/COEXISTER_logo_kaki_cercle%20(1).avif" /></span>
</div>            <button
              class="
                btn btn-xs btn-warning btn-circle border-none relative -mb-4 ring-4
                ring-base-200 group-hover:ring-base-300
              "
            >
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-4">
  <path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path>
  <path d="m12 13-1-1 2-2-3-3 2-2"></path>
</svg>
            </button>
        </div>
      </div>
      <div class="flex flex-col">
        <div class="flex flex-row gap-3 items-center justify-between">
          <h2 class="card-title font-serif text-2xl">
            Miana
          </h2>
        </div>
      </div>
      <p class="whitespace-pre-wrap line-clamp-3">Miana est hypersensible, délicate et très touchante.
Très réservée au premier abord, une fois qu&#39;elle donne sa confiance, elle est inconditionnelle. </p>
    </div>
  </div>
</li>
    <li class="relative intersect:motion-preset-slide-up intersect-once group">
  <a class="absolute z-[1] inset-0" data-turbo-frame="_top" href="/coexister/arkana"></a>
  <div
    class="
      card bg-base-200 group-hover:bg-base-300 rounded-box overflow-hidden relative h-full
      
    "
  >
    <figure class="bg-base-300 relative h-54">
        <img class="object-cover h-full w-full relative " alt="Arkana" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6IjA4MWM5NGNlLTgwOGEtNGVhYS05YWQ2LTM2YWUyOWJiMTVlYyIsInB1ciI6ImJsb2JfaWQifX0=--ff9e2465714f7835e5a987fc0ef67a4ae0efeaa1/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGVnIiwicmVzaXplX3RvX2xpbWl0IjpbMTAwMCwxMDAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--df4a1343893aa70339c6bd8e1dfd556da9b0f70d/IMG_5849.jpeg" />
      <div class="absolute inset-x-0 -bottom-[1px]">
        <svg
          class="text-base-200 group-hover:text-base-300"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 1200 120"
          preserveAspectRatio="none"
        >
          <path
            fill="currentColor"
            d="M600,112.77C268.63,112.77,0,65.52,0,7.23V120H1200V7.23C1200,65.52,931.37,112.77,600,112.77Z"
          ></path>
        </svg>
      </div>
    </figure>
    <div class="card-body relative backdrop-blur-sm">
      <div class="absolute -top-10 inset-x-0 px-6">
        <div class="flex flex-row justify-between items-center w-full">
          <div class="relative invisible">
            <span class="p-2 mask mask-squircle bg-white"><img class="object-contain flex items-center justify-center size-10" alt="Co&amp;xister" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImE3NmQ2Nzc1LWI3MTgtNDY4Yi05NTEzLTQyZGQ5NTVmZGUxZCIsInB1ciI6ImJsb2JfaWQifX0=--8334a994b75cbca35553be525502352bd61fb3af/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMjAsMTIwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--aaeb784e17f38575559a7f53815fb4368bf2d17b/COEXISTER_logo_kaki_cercle%20(1).avif" /></span>
</div>            <button
              class="
                btn btn-xs btn-warning btn-circle border-none relative -mb-4 ring-4
                ring-base-200 group-hover:ring-base-300
              "
            >
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-4">
  <path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path>
  <path d="m12 13-1-1 2-2-3-3 2-2"></path>
</svg>
            </button>
        </div>
      </div>
      <div class="flex flex-col">
        <div class="flex flex-row gap-3 items-center justify-between">
          <h2 class="card-title font-serif text-2xl">
            Arkana
          </h2>
        </div>
      </div>
      <p class="whitespace-pre-wrap line-clamp-3">Arkana est  très sociable, curieuse, joueuse et affectueuse.

Elle est désormais la grande soeur d&#39;adoption de nos 3 ados, Alan, Doug et Stu, avec qui elle a été adorable depuis leur arrivée.</p>
    </div>
  </div>
</li>
    <li class="relative intersect:motion-preset-slide-up intersect-once group">
  <a class="absolute z-[1] inset-0" data-turbo-frame="_top" href="/coexister/petit-jean"></a>
  <div
    class="
      card bg-base-200 group-hover:bg-base-300 rounded-box overflow-hidden relative h-full
      
    "
  >
    <figure class="bg-base-300 relative h-54">
        <img class="object-cover h-full w-full relative " alt="Petit Jean" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImM3ZTU2NDU5LTc4ZjYtNDBhNy1iMjcyLWM1N2QwNjU2YzI3MSIsInB1ciI6ImJsb2JfaWQifX0=--966313b52889cb2cfb4321c2bfbeceead6ce77d0/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOlsxMDAwLDEwMDBdfSwicHVyIjoidmFyaWF0aW9uIn19--ec155f257b371fc1c61a9104ce1570dbb12eb38b/unnamed.jpg" />
      <div class="absolute inset-x-0 -bottom-[1px]">
        <svg
          class="text-base-200 group-hover:text-base-300"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 1200 120"
          preserveAspectRatio="none"
        >
          <path
            fill="currentColor"
            d="M600,112.77C268.63,112.77,0,65.52,0,7.23V120H1200V7.23C1200,65.52,931.37,112.77,600,112.77Z"
          ></path>
        </svg>
      </div>
    </figure>
    <div class="card-body relative backdrop-blur-sm">
      <div class="absolute -top-10 inset-x-0 px-6">
        <div class="flex flex-row justify-between items-center w-full">
          <div class="relative invisible">
            <span class="p-2 mask mask-squircle bg-white"><img class="object-contain flex items-center justify-center size-10" alt="Co&amp;xister" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImE3NmQ2Nzc1LWI3MTgtNDY4Yi05NTEzLTQyZGQ5NTVmZGUxZCIsInB1ciI6ImJsb2JfaWQifX0=--8334a994b75cbca35553be525502352bd61fb3af/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMjAsMTIwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--aaeb784e17f38575559a7f53815fb4368bf2d17b/COEXISTER_logo_kaki_cercle%20(1).avif" /></span>
</div>            <button
              class="
                btn btn-xs btn-warning btn-circle border-none relative -mb-4 ring-4
                ring-base-200 group-hover:ring-base-300
              "
            >
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-4">
  <path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path>
  <path d="m12 13-1-1 2-2-3-3 2-2"></path>
</svg>
            </button>
        </div>
      </div>
      <div class="flex flex-col">
        <div class="flex flex-row gap-3 items-center justify-between">
          <h2 class="card-title font-serif text-2xl">
            Petit Jean
          </h2>
        </div>
      </div>
      <p class="whitespace-pre-wrap line-clamp-3">Au sein de la famille des cochons, Petit Jean est un médiateur : il veille à apaiser les tensions, et si un nouveau membre arrive au sein du clan, c&#39;est lui qui l&#39;accueille en premier, et qui fait l&#39;intermédiaire avec le reste de la famille.

Comme la majorité des cochons nains ayant conservé un peu des instincts de sanglier, Petit Jean est timie avec les humains qu&#39;il ne connaît pas.</p>
    </div>
  </div>
</li>
    <li class="relative intersect:motion-preset-slide-up intersect-once group">
  <a class="absolute z-[1] inset-0" data-turbo-frame="_top" href="/coexister/osha"></a>
  <div
    class="
      card bg-base-200 group-hover:bg-base-300 rounded-box overflow-hidden relative h-full
      
    "
  >
    <figure class="bg-base-300 relative h-54">
        <img class="object-cover h-full w-full relative " alt="Osha" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Ijc1ZDYwYjI1LThkZWYtNDUzMS04NTM4LTM2ZjFkOWFiN2JmMiIsInB1ciI6ImJsb2JfaWQifX0=--67f035702923a37c54c1a04327355ea617627b8a/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOlsxMDAwLDEwMDBdfSwicHVyIjoidmFyaWF0aW9uIn19--ec155f257b371fc1c61a9104ce1570dbb12eb38b/unnamed.jpg" />
      <div class="absolute inset-x-0 -bottom-[1px]">
        <svg
          class="text-base-200 group-hover:text-base-300"
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 1200 120"
          preserveAspectRatio="none"
        >
          <path
            fill="currentColor"
            d="M600,112.77C268.63,112.77,0,65.52,0,7.23V120H1200V7.23C1200,65.52,931.37,112.77,600,112.77Z"
          ></path>
        </svg>
      </div>
    </figure>
    <div class="card-body relative backdrop-blur-sm">
      <div class="absolute -top-10 inset-x-0 px-6">
        <div class="flex flex-row justify-between items-center w-full">
          <div class="relative invisible">
            <span class="p-2 mask mask-squircle bg-white"><img class="object-contain flex items-center justify-center size-10" alt="Co&amp;xister" src="https://cdn.sanctopia.org/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6ImE3NmQ2Nzc1LWI3MTgtNDY4Yi05NTEzLTQyZGQ5NTVmZGUxZCIsInB1ciI6ImJsb2JfaWQifX0=--8334a994b75cbca35553be525502352bd61fb3af/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fbGltaXQiOlsxMjAsMTIwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--aaeb784e17f38575559a7f53815fb4368bf2d17b/COEXISTER_logo_kaki_cercle%20(1).avif" /></span>
</div>            <button
              class="
                btn btn-xs btn-warning btn-circle border-none relative -mb-4 ring-4
                ring-base-200 group-hover:ring-base-300
              "
            >
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-4">
  <path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path>
  <path d="m12 13-1-1 2-2-3-3 2-2"></path>
</svg>
            </button>
        </div>
      </div>
      <div class="flex flex-col">
        <div class="flex flex-row gap-3 items-center justify-between">
          <h2 class="card-title font-serif text-2xl">
            Osha
          </h2>
        </div>
      </div>
      <p class="whitespace-pre-wrap line-clamp-3">Osha est particulièrement sensible et introvertie.</p>
    </div>
  </div>
</li>
</template></turbo-stream>
<turbo-stream action="replace" target="infinite-scroll-pagination"><template>
  <div id="infinite-scroll-pagination" data-infinite-scroll-target="trigger">
</div>

</template></turbo-stream>