/* Cartes livre de l'accueil (extrait automatiquement de accueil.php) — utilisé par titre.php */
.img-placeholder{width: 100%; aspect-ratio: 2/3; background-color: #f0f0f0; border-radius: 12px 12px 0 0; margin-bottom: 10px; position: relative; transition: filter 0.3s ease;}
.card:hover .img-placeholder{filter: brightness(1.02);}
/* Grille produits */
    .bkh-grid{display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px;}
.bkh-prod{display: block; text-decoration: none; background: #fff; border: 1px solid #efe4d6; border-radius: 16px; overflow: hidden; transition: transform .22s ease, box-shadow .22s ease;}
.bkh-prod:hover{transform: translateY(-5px); box-shadow: 0 18px 36px rgba(20,16,15,.14);}
.bkh-prod-cov{position: relative; aspect-ratio: 3/4; background: radial-gradient(120% 95% at 50% 18%, #faf5ee 0%, #eee4d5 100%); display: flex; align-items: center; justify-content: center; padding: 20px 20px 16px; overflow: hidden;}
.bkh-prod-cov img{max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; border-radius: 2px; box-shadow: 0 10px 22px rgba(20,16,15,.28), 0 2px 6px rgba(20,16,15,.16); transition: transform .3s ease;}
.bkh-prod:hover .bkh-prod-cov img{transform: translateY(-3px) scale(1.02);}
.bkh-fav{position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,.95); border: none; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 3px 8px rgba(20,16,15,.16); padding: 0; z-index: 2;}
.bkh-fav svg{width: 16px; height: 16px; stroke: #6E1E30; fill: none; stroke-width: 2;}
.bkh-fav:hover svg{fill: #6E1E30;}
.bkh-badges{position: absolute; top: 10px; left: 10px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 6px;}
.bkh-cond{background: rgba(255,255,255,.94); color: #4A1220; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 50px; box-shadow: 0 2px 7px rgba(20,16,15,.12);}
.bkh-deal{background: linear-gradient(135deg,#E7CFAF,#D3AE89); color: #4A1220; font-size: 10.5px; font-weight: 800; padding: 4px 10px; border-radius: 50px; box-shadow: 0 3px 8px rgba(211,174,137,.4); display: inline-flex; align-items: center; gap: 4px;}
.bkh-deal svg{width: 11px; height: 11px;}
.bkh-prod-in{display: block; padding: 12px 13px 14px;}
.bkh-prod-t{display: block; font-size: 14px; font-weight: 700; color: #14100F; margin: 0 0 2px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.bkh-prod-a{display: block; font-size: 12px; color: #8a7d74; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.bkh-prod-b{display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 11px; padding-top: 11px; border-top: 1px solid #f2e8db;}
.bkh-prices{display: flex; align-items: baseline; gap: 6px; min-width: 0; flex-shrink: 0;}
.bkh-price{font-size: 16.5px; font-weight: 800; color: #6E1E30; white-space: nowrap;}
.bkh-price-old{font-size: 12px; color: #b3aaa1; text-decoration: line-through; font-weight: 600; white-space: nowrap;}
.bkh-env{font-size: 12px; color: #b3aaa1; font-weight: 700;}
.bkh-seller{display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #8a7d74; min-width: 0; flex: 1 1 auto; justify-content: flex-end; overflow: hidden; white-space: nowrap;}
.bkh-seller i{width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(135deg,#D3AE89,#b98a5f); flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; font-size: 9.5px; font-weight: 800;}
.bkh-seller i img{width: 100%; height: 100%; object-fit: cover; display: block;}
.bkh-seller .nm{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;}
.bkh-grid[data-rows] .bkh-prod.is-fold{display:none;}
.bkh-morewrap{display:flex; justify-content:center; margin-top:26px;}
.bkh-more{text-decoration:none; display:inline-flex; align-items:center; gap:8px; font-family:inherit; font-size:14px; font-weight:700; color:#6E1E30; background:#fff; border:1.5px solid #6E1E30; border-radius:999px; padding:12px 24px; cursor:pointer; transition:background .18s ease, color .18s ease;}
.bkh-more:hover{background:#6E1E30; color:#F4EEE7;}
.bkh-more svg{width:16px; height:16px;}
.bkh-more[hidden]{display:none !important;}
a.bkh-more#bkhVitAllBtn{background:#6E1E30; color:#F4EEE7;}
a.bkh-more#bkhVitAllBtn:hover{background:#4E1420; border-color:#4E1420;}
a.bkh-more#bkhAllBtn{background:#6E1E30; color:#F4EEE7;}
a.bkh-more#bkhAllBtn:hover{background:#4E1420; border-color:#4E1420;}
.bkh-row > .bkh-prod{flex:0 0 186px; scroll-snap-align:start;}
/* Pied de carte étroit (rangées mobiles, grille 2 colonnes) : la pastille vendeur n'est jamais coupée, son nom s'efface d'abord, puis le prix barré. */
    .bkh-seller{min-width:20px; flex:0 1 auto;}
@media (max-width: 1024px){.bkh-grid{grid-template-columns: repeat(4, 1fr);}}
@media (max-width: 820px){.bkh-grid{grid-template-columns: repeat(3, 1fr);}}
@media (max-width: 520px){.bkh-grid{grid-template-columns: repeat(2, 1fr);}}
@media(max-width:600px){.bkh-row > .bkh-prod{flex-basis:142px;}}
@media(max-width:600px){.bkh-row .bkh-seller .nm, .bkh-grid .bkh-seller .nm{display:none;} .bkh-row .bkh-prices, .bkh-grid .bkh-prices{flex-shrink:1; overflow:hidden;} .bkh-row .bkh-prod-b, .bkh-grid .bkh-prod-b{gap:6px;}}
@media(max-width:380px){.bkh-row .bkh-price-old, .bkh-row .bkh-env{display:none;}}
