/* Banner «Terriccio su misura» in testa alla descrizione della categoria dei terricci (dentro .typo del tema Z.one) */
.tsm-promo{position:relative;display:flex;align-items:center;gap:22px;margin:4px 0 22px;padding:18px 24px 21px 18px;
  background:#1f3f2d;border-radius:6px;color:#fff;overflow:hidden;box-shadow:0 1px 5px rgba(0,0,0,.2)}
.tsm-promo .tsm-promo-foto{display:grid;grid-template-columns:repeat(2,60px);gap:4px;flex:none}
.tsm-promo .tsm-promo-foto img{display:block;width:60px;height:60px;max-width:none;object-fit:cover;border-radius:4px}
.tsm-promo .tsm-promo-testo{flex:1;min-width:0}
.tsm-promo .tsm-novita{display:inline-block;margin:0 0 7px;padding:4px 7px 3px;border-radius:3px;background:#69a920;color:#fff;
  font:700 11px/1 Roboto,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.tsm-promo .tsm-promo-titolo{margin:0 0 5px;color:#fff;font:700 23px/1.15 "Roboto Condensed",sans-serif}
.tsm-promo .tsm-promo-sotto{margin:0;color:#cfe0d3;font-size:14px;line-height:1.45}
.tsm-promo .tsm-promo-azione{flex:none;text-align:center}
.tsm-promo .tsm-promo-btn{display:inline-block;padding:13px 22px;border-radius:3px;background:#019331;color:#fff;
  font:700 15px/1 Roboto,sans-serif;text-decoration:none;white-space:nowrap;transition:background .15s}
/* il clic vale su tutto il riquadro */
.tsm-promo .tsm-promo-btn::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0}
.tsm-promo:hover .tsm-promo-btn,.tsm-promo .tsm-promo-btn:hover,.tsm-promo .tsm-promo-btn:focus{background:#017a29;color:#fff;text-decoration:none}
.tsm-promo .tsm-promo-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.tsm-promo .tsm-promo-prezzo{display:block;margin-top:8px;color:#cfe0d3;font-size:13px}
.tsm-promo .tsm-promo-prezzo b{color:#fff}
/* colori dei quattro componenti delle foto: akadama, pomice, kanuma, lapillo */
.tsm-promo .tsm-striscia{position:absolute;left:0;right:0;bottom:0;height:5px;
  background:linear-gradient(90deg,#b8692e 0 40%,#d2cab7 40% 60%,#ddb95b 60% 80%,#7d3b2d 80%)}
/* telefono e tablet (fino a 991 px la colonna dei prodotti è stretta): pulsante sotto, largo */
@media (max-width:991px){
  .tsm-promo{flex-wrap:wrap;gap:12px 14px;padding:14px 14px 18px}
  .tsm-promo .tsm-promo-foto{grid-template-columns:repeat(2,44px);gap:3px}
  .tsm-promo .tsm-promo-foto img{width:44px;height:44px}
  .tsm-promo .tsm-promo-testo{flex-basis:calc(100% - 110px)}
  .tsm-promo .tsm-promo-titolo{font-size:19px}
  .tsm-promo .tsm-promo-sotto{font-size:13px}
  .tsm-promo .tsm-promo-azione{flex-basis:100%;display:flex;align-items:center;gap:12px}
  .tsm-promo .tsm-promo-btn{flex:1;text-align:center;white-space:normal;line-height:1.2}
  .tsm-promo .tsm-promo-prezzo{margin:0;white-space:nowrap}
}