.mobile-article-recommendations{display:none}

@media(max-width:800px){
  #articleDialog #articleBody .mobile-article-recommendations{
    display:block;
    margin:0;
    padding:28px 20px max(34px,env(safe-area-inset-bottom));
    border-top:1px solid #dfe5ea;
    background:#f5f7f9;
  }
  .mobile-article-recommendations header{margin:0 0 18px}
  .mobile-article-recommendations header span{display:block;margin-bottom:5px;color:#0878d1;font:800 11px/1.2 "Manrope",Arial,sans-serif;letter-spacing:.16em}
  .mobile-article-recommendations header h2{margin:0;color:#101820;font:800 25px/1.15 "Manrope",Arial,sans-serif}
  .mobile-recommendation-list{display:grid;grid-template-columns:1fr;gap:12px}
  .mobile-recommendation-card{display:grid;grid-template-columns:118px minmax(0,1fr);min-height:92px;overflow:hidden;border:1px solid #dce3e8;border-radius:12px;background:#fff;color:#101820;text-decoration:none;box-shadow:0 5px 18px rgba(16,24,32,.06)}
  .mobile-recommendation-card img,.mobile-recommendation-placeholder{display:block;width:118px;height:100%;min-height:92px;object-fit:cover;background:linear-gradient(135deg,#dbe5ec,#eef2f5)}
  .mobile-recommendation-copy{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:11px 12px}
  .mobile-recommendation-copy small{margin-bottom:4px;color:#0878d1;font:800 10px/1.2 "Manrope",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
  .mobile-recommendation-copy strong{display:-webkit-box;overflow:hidden;color:#101820;font:800 14px/1.32 "Manrope",Arial,sans-serif;-webkit-box-orient:vertical;-webkit-line-clamp:3}
  .mobile-recommendation-copy em{margin-top:6px;color:#78828b;font:500 10px/1.2 "Manrope",Arial,sans-serif;font-style:normal}
}

@media(max-width:380px){
  .mobile-recommendation-card{grid-template-columns:104px minmax(0,1fr)}
  .mobile-recommendation-card img,.mobile-recommendation-placeholder{width:104px}
}