/* Related-product cards inside articles and guides (2026-11-07).
   Visual tokens follow the shop-all product card: 16px radius, #F0EDE8 line,
   serif name, moss price, charcoal pill button. Prices are filled at runtime by
   /assets/hibou-article-products.js from the public catalog; the HTML never
   carries a price figure, so a price change needs no page edit. */
.hibou-article-products{margin:2.5rem 0 1.25rem;padding:1.35rem 1.25rem 1.2rem;border:1px solid #F0EDE8;border-radius:16px;background:#FFFEF9;color:#2C2C2C;font-family:'Noto Sans TC','PingFang TC',sans-serif}
.hibou-article-products .hap-kicker{margin:0;font-size:.72rem;letter-spacing:.18em;color:#7A9A7E;text-transform:uppercase}
.hibou-article-products .hap-title{margin:.25rem 0 1rem;padding:0;border:0;font:700 1.25rem/1.4 'Noto Serif TC','PingFang TC',serif;color:#2C2C2C}
.hibou-article-products .hap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin:0;padding:0;list-style:none}
.hibou-article-products .hap-card{display:grid;grid-template-columns:112px minmax(0,1fr);gap:.9rem;align-items:start;margin:0;padding:.8rem;min-width:0;background:#fff;border:1px solid #F0EDE8;border-radius:14px}
.hibou-article-products .hap-media{display:block;position:relative;aspect-ratio:1/1;border-radius:10px;overflow:hidden;background:#F0EDE8}
.hibou-article-products .hap-media img{display:block;width:100%;height:100%;object-fit:cover}
.hibou-article-products .hap-badge{position:absolute;left:.5rem;top:.5rem;padding:.15rem .55rem;border-radius:999px;background:#2C2C2C;color:#fff;font-size:.68rem;letter-spacing:.06em}
.hibou-article-products .hap-name{margin:0;padding:0;border:0;font:700 .98rem/1.4 'Noto Serif TC','PingFang TC',serif}
.hibou-article-products .hap-name a{color:#2C2C2C!important;text-decoration:none}
.hibou-article-products .hap-name a:hover{text-decoration:underline;text-underline-offset:3px}
.hibou-article-products .hap-claim{margin:.3rem 0 .45rem;font-size:.82rem;line-height:1.6;color:#5f5a52}
.hibou-article-products .hap-price{margin:0 0 .55rem;font:700 1.02rem/1.4 'Noto Serif TC','PingFang TC',serif;color:#4A6741;font-variant-numeric:tabular-nums}
.hibou-article-products .hap-price:empty{display:none}
.hibou-article-products .hap-cta{display:inline-flex;align-items:center;gap:.3rem;min-height:40px;padding:.35rem .95rem;border-radius:20px;background:#2C2C2C;color:#fff!important;font-size:.8rem;letter-spacing:.05em;text-decoration:none!important}
.hibou-article-products .hap-cta::after{content:'→'}
.hibou-article-products .hap-cta:hover{background:#4A6741}
.hibou-article-products .hap-card[data-hap-state="out"] .hap-media img{opacity:.6}
.hibou-article-products .hap-note{margin:.9rem 0 0;font-size:.74rem;line-height:1.6;color:#8A8A8A}
@media (max-width:480px){.hibou-article-products{padding:1.1rem 1rem 1rem}.hibou-article-products .hap-card{grid-template-columns:96px minmax(0,1fr);gap:.75rem}}