/* ============================================================
 * RTHFG — Boutique (packs d'agence)
 * Compléments à style.css — même langage : pop, blocs, ombres dures.
 * ============================================================ */

/* grille produits */
.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:980px){.shop-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.shop-grid{grid-template-columns:1fr}}

.shop-card{display:flex;flex-direction:column;background:var(--bg);border:1.5px solid var(--ink);border-radius:var(--r);padding:30px;transition:transform .2s ease,box-shadow .2s ease}
.shop-card:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink)}
.shop-card--best{background:var(--lime)}
.shop-chip{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 13px;border:1.5px solid var(--ink);border-radius:100px;margin-bottom:22px}
.shop-chip--violet{background:var(--violet);color:#fff}
.shop-chip--coral{background:var(--coral);color:var(--ink)}
.shop-chip--lime{background:var(--lime);color:var(--ink)}
.shop-chip--ink{background:var(--ink);color:#fff}
.shop-card__name{font-size:27px;font-weight:700;letter-spacing:-.025em;line-height:1.04;margin-bottom:10px}
.shop-card__tag{font-size:15.5px;color:var(--ink-2);line-height:1.5;flex:1;margin-bottom:22px}
.shop-card--best .shop-card__tag{color:rgba(10,10,10,.72)}
.shop-card__price{display:flex;align-items:baseline;gap:8px}
.shop-card__price b{font-size:30px;font-weight:700;letter-spacing:-.02em}
.shop-card__price span{font-size:13px;color:var(--ink-3)}
.shop-card__delai{font-size:13px;color:var(--ink-3);margin:4px 0 22px}
.shop-card--best .shop-card__delai{color:rgba(10,10,10,.6)}
.shop-card__act{display:flex;gap:10px}
.shop-card__act .btn{flex:1;justify-content:center;padding:13px 16px;font-size:14px}

/* détail produit */
.shop-pd{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
@media(max-width:880px){.shop-pd{grid-template-columns:1fr;gap:36px}}
.shop-pd__art{border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:44px;min-height:420px;display:flex;flex-direction:column;justify-content:space-between;position:sticky;top:104px}
@media(max-width:880px){.shop-pd__art{position:static;min-height:300px}}
.shop-pd__art .num{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.shop-pd__art .big{font-size:clamp(44px,6vw,76px);font-weight:700;letter-spacing:-.04em;line-height:.92}
.shop-pd__cat{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--violet);margin-bottom:14px}
.shop-pd__desc{font-size:17px;line-height:1.6;color:var(--ink-2);margin:18px 0 26px;max-width:54ch}
.shop-specs{display:flex;gap:34px;flex-wrap:wrap;margin:24px 0;padding:22px 0;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink)}
.shop-spec b{display:block;font-size:19px;font-weight:700}
.shop-spec span{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3)}
.shop-incl{margin:24px 0}
.shop-incl li{display:flex;gap:13px;align-items:flex-start;padding:13px 0;border-bottom:1.5px solid var(--line);font-size:16px;color:var(--ink)}
.shop-incl li::before{content:"✦";color:var(--violet);font-weight:700;line-height:1.5}
.shop-price-lg{display:flex;align-items:baseline;gap:10px;margin:26px 0}
.shop-price-lg b{font-size:46px;font-weight:700;letter-spacing:-.03em}
.shop-price-lg span{font-size:14px;color:var(--ink-3)}
.shop-addbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

/* panier + récap */
.shop-2col{display:grid;grid-template-columns:1.55fr .95fr;gap:40px;align-items:start}
@media(max-width:880px){.shop-2col{grid-template-columns:1fr;gap:28px}}
.shop-row{display:grid;grid-template-columns:1fr auto auto auto;gap:22px;align-items:center;padding:24px 0;border-bottom:1.5px solid var(--ink)}
.shop-row:first-child{border-top:1.5px solid var(--ink)}
@media(max-width:600px){.shop-row{grid-template-columns:1fr auto;row-gap:14px}.shop-row__price{grid-column:2;text-align:right}}
.shop-row__cat{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--violet);margin-bottom:5px}
.shop-row__name{font-size:19px;font-weight:700;letter-spacing:-.01em}
.shop-row__name a:hover{color:var(--violet)}
.shop-row__sub{font-size:13px;color:var(--ink-3);margin-top:4px}
.shop-row__price{font-weight:700;font-size:18px;white-space:nowrap}
.shop-qty{display:inline-flex;align-items:center;border:1.5px solid var(--ink);border-radius:100px;overflow:hidden}
.shop-qty button{width:38px;height:40px;font-size:18px;font-weight:700;transition:background .15s}
.shop-qty button:hover{background:var(--lime)}
.shop-qty input{width:42px;height:40px;text-align:center;border:0;border-left:1.5px solid var(--ink);border-right:1.5px solid var(--ink);background:transparent;font-weight:700;font-family:"Space Grotesk",sans-serif}
.shop-rm{font-size:13px;color:var(--ink-3);text-decoration:underline;text-underline-offset:2px}
.shop-rm:hover{color:var(--coral-2)}
.shop-sum{border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:30px;position:sticky;top:104px;background:var(--lime)}
@media(max-width:880px){.shop-sum{position:static}}
.shop-sum h3{margin-bottom:20px}
.shop-sum__r{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:15px;color:rgba(10,10,10,.78)}
.shop-sum__t{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1.5px solid var(--ink);margin-top:10px;padding-top:16px}
.shop-sum__t b{font-size:30px;font-weight:700;letter-spacing:-.02em}
.shop-sum__acompte{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-weight:600;color:var(--violet-2)}
.shop-fine{font-size:12px;color:rgba(10,10,10,.66);margin-top:14px;line-height:1.5}
.shop-sum .btn{margin-top:18px}

.shop-empty{border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:64px 30px;text-align:center;background:var(--surface)}
.shop-empty h3{margin-bottom:12px}
.shop-empty p{margin:0 auto 26px;max-width:44ch}

.shop-back{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:30px}
.shop-back:hover{color:var(--violet)}

/* confirmation */
.shop-conf{max-width:780px}
.shop-conf__ref{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--violet);margin-bottom:14px}
.shop-steps li{display:flex;gap:13px;align-items:flex-start;padding:11px 0;font-size:16px;color:var(--ink-2);line-height:1.5}
.shop-steps li::before{content:"→";color:var(--violet);font-weight:700}
.shop-steps strong{color:var(--ink);font-weight:600}
