

.sachet{flex:0 0 clamp(190px,23vw,250px);scroll-snap-align:start;display:flex;
  flex-direction:column;gap:14px;text-decoration:none;color:inherit}
.sachet .ph{position:relative;display:block;aspect-ratio:1;border-radius:var(--r12,12px);
  overflow:hidden;background:var(--c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)}
.sachet .ph img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.sachet:hover .ph img{transform:scale(1.05)}
@media (prefers-reduced-motion:reduce){
  .sachet .ph img{transition:none}
  .sachet:hover .ph img{transform:none}}
.sachet .nophoto{position:absolute;inset:15%;color:#fff;opacity:.34}
.sachet .nophoto svg{width:100%;height:100%}
.sachet .nophoto svg *{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;
  stroke-linejoin:round;vector-effect:non-scaling-stroke}
.sachet .txt{display:flex;flex-direction:column;flex:1}
.sachet .meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.14)}
.sachet .pn{font-size:var(--t-md,15px);font-weight:650;color:#fff;display:flex;
  align-items:center;gap:8px;min-width:0}
.sachet .pn .d{width:11px;height:11px;border-radius:50%;flex:none;background:var(--c);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.sachet .pp{font-size:var(--t-md,15px);font-weight:700;color:var(--gold,#FFC233);
  font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.sachet .fmt{display:block;font-size:var(--t-xxs,11px);color:rgba(255,255,255,.45);
  padding-top:8px}
.sachet .fmt i{font-family:var(--f-titres),ui-serif,Georgia,serif;font-style:italic}
.sachet .pd{display:block;font-size:var(--t-xs,12px);color:rgba(255,255,255,.5);
  line-height:1.4;padding-top:9px}
.sachet .rech{display:block;margin-top:auto;padding-top:12px;font-size:var(--t-xxs,11px);
  font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55)}


.shelf .rail{padding-top:26px;padding-bottom:40px;align-items:flex-start}
.shelf .sachet{background:#fff;padding:12px 12px 0;border-radius:3px;text-decoration:none;
  box-shadow:0 18px 34px -18px rgba(0,0,0,.55),0 2px 5px rgba(0,0,0,.18);
  transform:rotate(var(--r,0deg));transition:transform .25s}
.shelf .sachet:nth-child(6n+1){--r:-2.2deg}.shelf .sachet:nth-child(6n+2){--r:1.6deg}
.shelf .sachet:nth-child(6n+3){--r:-1deg}.shelf .sachet:nth-child(6n+4){--r:2.1deg}
.shelf .sachet:nth-child(6n+5){--r:-1.7deg}.shelf .sachet:nth-child(6n){--r:1.2deg}
.shelf .sachet:hover,.shelf .sachet:focus-visible{transform:rotate(0) translateY(-6px)}
.shelf .sachet .ph{border-radius:0;aspect-ratio:1/1;display:block;overflow:hidden}
.shelf .sachet .ph img{width:100%;height:100%;object-fit:cover;display:block}
.shelf .sachet .txt{padding:12px 2px 16px;align-items:center;text-align:center;border:0}
.shelf .sachet .meta,.shelf .sachet .pn{justify-content:center;border:0;padding:0;margin:0}
.shelf .sachet .pn{font-family:var(--f-sur),cursive;font-size:clamp(24px,2.2vw,30px);font-weight:600;color:#1B1B2F;line-height:1}
.shelf .sachet .pn .d{display:none}
.shelf .sachet .fmt{color:#6a6459;font-size:var(--t-xxs,11.5px);margin-top:6px;border:0;padding:0}
@media (prefers-reduced-motion:reduce){.shelf .sachet{transition:none}.shelf .sachet:hover{transform:rotate(var(--r,0deg))}}

.shelf .sachet .meta{flex-direction:column;align-items:center;gap:6px}
.shelf .sachet .pp{color:#1B1B2F;font-size:var(--t-sm,13px);font-weight:700}
