/* robiami — compléments charte C (clair). Charger APRÈS identite-c.css et accueil.css. */

/* ===== #8 Cartes produit (.deal-grid > .deal-card) ===== */
.deal-grid{gap:20px}
.deal-grid .deal-card{background:var(--surface,#F5F5F7);border:0;border-radius:22px;overflow:hidden;box-shadow:none;display:flex;flex-direction:column;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s}
.deal-grid .deal-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(10,14,23,.08)}
.deal-card .thumb{position:relative;display:grid;place-items:center;aspect-ratio:4/3;background:#fff;margin:8px 8px 0;border-radius:16px;overflow:hidden}
.deal-card .thumb img{width:100%;height:100%;object-fit:contain;padding:12px}
.deal-card .badge-remise{position:absolute;top:12px;left:12px;background:#2F6BFF;color:#fff;font:700 13px/1 'JetBrains Mono',ui-monospace,monospace;padding:6px 10px;border-radius:999px}
.deal-card .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.deal-card .merchant{font:600 11px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#6E6E73}
.deal-card .name{font:700 17px/1.3 'Inter Tight',Inter,sans-serif;letter-spacing:-.01em;margin:0}
.deal-card .name a{color:#0A0E17;text-decoration:none}
.deal-card .name a:hover{color:#2F6BFF}
.deal-card .temperature{align-self:flex-start;background:#fff;color:#0A0E17;border:1px solid #E8E8ED;border-radius:999px;padding:4px 10px;font:600 12px Inter,sans-serif}
.deal-card .temperature--brulant .icon{color:#D92D20}
.deal-card .price-row{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.deal-card .price{font:700 22px 'JetBrains Mono',ui-monospace,monospace;color:#00805A}
.deal-card .old-price{font:500 14px 'JetBrains Mono',ui-monospace,monospace;color:#6E6E73;text-decoration:line-through}
.deal-card .economie{align-self:flex-start;background:transparent;color:#00805A;font:600 13px Inter,sans-serif;padding:0}
.deal-card .btn--achat{display:flex;justify-content:center;align-items:center;gap:6px;background:#2F6BFF;color:#fff;border-radius:999px;padding:12px 18px;font:700 15px Inter,sans-serif;text-decoration:none}
.deal-card .btn--achat:hover{background:#1F55E0}
.deal-card .btn--achat:focus-visible{outline:3px solid #8DB0FF;outline-offset:2px}

/* ===== #9 Blocs catégories (.raccourcis) + barre de filtres (.category-bar) ===== */
.raccourcis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.raccourcis .raccourci{display:flex;flex-direction:column;gap:6px;background:var(--surface,#F5F5F7);border:0;border-radius:22px;padding:22px;color:#0A0E17;text-decoration:none;transition:background .2s,transform .2s}
.raccourcis .raccourci:hover{background:#ECEDF1;transform:translateY(-2px)}
.raccourcis .raccourci__icone{width:44px;height:44px;border-radius:14px;background:#2F6BFF;color:#fff;display:grid;place-items:center;margin-bottom:6px}
.raccourcis .raccourci strong{font:700 18px 'Inter Tight',Inter,sans-serif;letter-spacing:-.01em}
.raccourcis .raccourci span:not(.raccourci__icone){font:500 14px Inter,sans-serif;color:#6E6E73}
@media (max-width:720px){.raccourcis{grid-template-columns:1fr 1fr;gap:12px}.raccourcis .raccourci{padding:16px}}
.category-bar .chip{background:#fff;border:1px solid #E8E8ED;color:#0A0E17;border-radius:999px}
.category-bar .chip:hover{border-color:#0A0E17}
.category-bar .chip--active{background:#0A0E17;border-color:#0A0E17;color:#fff}

/* ===== Footer clair ===== */
.site-footer{background:#F5F5F7;color:#3A3F4B;border-top:1px solid #E8E8ED}
.site-footer h2{color:#0A0E17;font:700 12px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}
.site-footer a{color:#3A3F4B;text-decoration:none}
.site-footer a:hover{color:#2F6BFF}
.site-footer__disclosure{background:#fff;border:1px solid #E8E8ED;color:#3A3F4B;border-radius:14px}
.site-footer__disclosure a{color:#2F6BFF;text-decoration:underline}
.site-footer__legal{color:#6E6E73;border-top-color:#E8E8ED}
.site-footer svg{color:#0A0E17}
/* Logo : remplacer dans le template logo-final-sombre.svg → logo-final.svg (CSS seul insuffisant). */

/* mobile hero vignette */
@media (max-width:700px){.hero--c .ph{aspect-ratio:4/3;max-height:260px;overflow:hidden}.hero--c .ph img{width:100%;height:100%;max-height:260px;object-fit:contain}}
