в общем, добавил костыль в виде тега style прямо в код, теперь работает.
кому интересно, вот код:

{if $product.barcode}
     <span class="offerBarcode" style="font-size:12px;"><i>{$product.barcode}</i></span>
{/if}

честно говоря, не совсем понял, почему в шаблоне использовалось условие if,
по идее, если артикула нет, то и так ничего и не выведется,
но решил оставить, разработчикам виднее.

templates/perfume/moduleview/catalog/list_products_items.tpl

но вылезла другая проблема
отображение артикулов я взял из странички товара: product.tpl

выглядит он следующим образом:

{hook name="catalog-product:information" title="{t}Карточка товара:краткая информация{/t}"}
   {if $product.barcode}
       <p class="barcode">
         <span class="cap">{t}Артикул{/t}:</span>
         <span class="offerBarcode">{$product.barcode}</span></p>
   {/if}
   {if $product.brand_id}
      <p class="brand"><span class="cap">{t}Бренд{/t}:</span>
      <a class="brandTitle" href="{$product->getBrand()->getUrl()}">{$product->getBrand()->title}</a>
      </p>
   {/if}                  
{/hook}

теперь артикул выводится (и даже имя бренда), но по каким-то причинам,
на страничке товара размер шрифта 12 пикселей,

а тот же самый код на страничке каталога выводится в размере 14 пикселей,

хотя классы для отображения присутствуют (классы barcode и offerBarcode) и, по идее,
должны отображаться одинаково, но где-то перезаписываются.

Пробовал напрямую дописывать тег <font size ="3">, но также никакой разницы нет - название товара и артикул выводятся одним размером.  подскажите, как минимальными средствами уменьшить размер шрифта у артикула в каталоге. Спасибо

list_products_items.tpl
list_products.tpl

но ничего не изменилось (видимо, это не те шаблоны).

И как вообще понять, какой шаблон за что отвечает. Есть ли какой-то список? Как вообще в этом разобраться? Спасибо