/* SoyUnPerro — bloque de afiliacion. Rev. 2, 25/08/2026.
   MOVIL PRIMERO: la creatividad manda y va a todo el ancho en 16:9,
   que es el formato que entrega la marca. El texto va DEBAJO, en HTML
   real, para que se lea en un telefono y se pueda cambiar sin rehacer
   el PNG. */
.promo-banner,.promo-bloque{
  display:block;text-decoration:none;color:inherit;font-family:inherit;
  max-width:560px;margin:26px auto;overflow:hidden;
  border:1px solid #E3E8EF;border-radius:14px;background:#fff;position:relative;
  transition:box-shadow .2s ease,border-color .2s ease}
.promo-banner:hover,.promo-bloque:hover{border-color:#EE6948;box-shadow:0 6px 22px rgba(238,105,72,.18)}

.promo-tag{position:absolute;top:8px;right:8px;z-index:2;
  font-size:10px;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;background:rgba(15,23,42,.55);border-radius:999px;
  padding:3px 9px;line-height:1.6;backdrop-filter:saturate(140%) blur(2px)}

/* La creatividad: 16:9 exacto, sin recortes sorpresa */
.promo-banner-img,.promo-bloque-img{
  display:block;width:100%;aspect-ratio:16/9;object-fit:cover;
  background:#EE6948;border:0;margin:0}

.promo-banner-tx,.promo-bloque-tx{display:block;padding:14px 16px 16px}
.promo-banner-h,.promo-bloque-h{display:block;font-size:17px;font-weight:700;
  color:#0F172A;line-height:1.3;margin-bottom:6px}
.promo-banner-s,.promo-bloque-s{display:block;font-size:14px;color:#5B6676;
  line-height:1.55;margin-bottom:14px}
.promo-banner-cta,.promo-bloque-cta{display:block;text-align:center;
  background:#EE6948;color:#fff;font-size:15px;font-weight:600;
  padding:12px 18px;border-radius:10px}

/* El bloque dentro del articulo se distingue con un fondo suave */
.promo-bloque{margin:30px auto;background:#FFF6F3;border-color:#F6D3C8}

/* A partir de tableta se permite algo mas de anchura, sin deformar el 16:9 */
@media (min-width:700px){
  .promo-banner,.promo-bloque{max-width:620px}
  .promo-banner-h,.promo-bloque-h{font-size:19px}
  .promo-banner-cta,.promo-bloque-cta{display:inline-block;width:auto}
}
@media (prefers-reduced-motion:reduce){.promo-banner,.promo-bloque{transition:none}}