fix: que las imágenes de promociones entren completas en sus cuadros

Las tarjetas usaban object-cover con altura fija, así que a los banners
anchos les recortaba los lados: se veía "plex" en vez de "Plex" y los
logos de Crunchyroll y ViX quedaban cortados.

Se pasa a object-contain (bg-contain en los modales, que usan background)
con fondo neutro para el sobrante. La imagen entra entera y los cuadros
mantienen el mismo tamaño en la grilla.

Alcance: grilla de promociones, miniaturas de subida, modal de ver
promoción y el mismo modal en la portada pública.

Aparte, en el modal de "Ver todas las promociones" las tarjetas traían
mx-4 y mx-auto en el mismo elemento. Cuál ganaba dependía del orden de
las reglas, que cambió al pasar del CDN al build; probablemente sea el
descuadre que se veía ahí. Se deja solo mx-auto.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

resources/views/livewire/portada-servicio.blade.php

@@ -71,8 +71,9 @@
         <div class="grid h-full place-items-center">
             <div class="bg-white rounded-lg shadow-md sm:1/2 md:1/3 lg:1/3  xl:w-1/4">
                 {{-- PHOTO --}}
-                {{-- URL de runtime: no puede ser clase arbitraria de Tailwind --}}
-                <div class="w-full text-left text-white px-4 bg-cover bg-center py-2 rounded-lg h-64"
+                {{-- URL de runtime: no puede ser clase arbitraria de Tailwind.
+                     bg-contain para que el banner entre completo, sin recortes. --}}
+                <div class="w-full bg-contain bg-no-repeat bg-center bg-gray-50 rounded-t-lg h-64"
                      style="background-image: url('{{ asset($this->imagen) }}');">
                 </div>