/* ===========================================================================
   Encarts publicitaires — la règle d'affichage, UNE seule fois pour tout le site
   ---------------------------------------------------------------------------
   Demande de btob (04/09/2026) : « il faut que la photo ou le flyer fourni par
   le client s'adapte à notre encart. On ne peut pas avoir une image à moitié
   cassée. Vérifie toutes les sections pour que tout s'adapte correctement. »

   POURQUOI CE FICHIER. La mise en forme des encarts était recopiée dans cinq
   pages, chacune avec son `object-fit: cover` : marketplace-page.css,
   offerpage.php, joberpage.php, search-pro.php et search-jober.php. Corriger
   l'une laissait les autres rogner — c'est précisément ce que btob a constaté :
   l'annuaire des professionnels ne charge même pas marketplace-page.css.

   MESURE, production, /professionnels/page/2/ à 1280 px : les flyers font
   800 x 600 (paysage) et les emplacements 297 x 387 (portrait). En `cover`,
   **58 % de la largeur du flyer seulement était visible** ; le message du
   client était coupé des deux côtés.

   LA RÈGLE. Un encart publicitaire montre le visuel du client EN ENTIER, quel
   que soit son format, sur un fond neutre de la charte. Jamais de rognage : ce
   que le client a payé doit être lisible.

   CE QUI N'EST PAS CONCERNÉ. Les photos de profil, les avatars et les visuels
   de couverture des fiches gardent `cover` : là, le cadrage est voulu et un
   léger rognage ne retire aucune information.
   =========================================================================== */

.sponsor-card .card-image img,
.sponsor-card .sponsor-card-image img,
.promo-card .card-image img,
.promo-card .sponsor-card-image img,
.sponsor-card.flyer-format .card-image img,
.promo-card.flyer-format .card-image img,
.sponsor-card.logo-format .card-image img,
.promo-card.logo-format .card-image img {
    object-fit: contain !important;
    background: #f6f8fc;
}

/* Le cadre respire un peu autour du visuel : un flyer collé aux bords passe
   pour une image coupée, même quand il est entier. */
.sponsor-card .card-image,
.promo-card .card-image,
.sponsor-card .sponsor-card-image,
.promo-card .sponsor-card-image {
    background: #f6f8fc;
}