/* Pages du Shop : catalogue, fiche, « Mon brief ». Grille officielle 12 / 8 / 4 (.shop-frame, shared/styles/shop.css). */
.page-shop,
.page-shop-product,
.page-shop-brief {
  background-color: var(--color-background);
}
.shop-main {
  color: var(--color-text);
  overflow-x: clip;
  padding-bottom: var(--space-page-bottom);
}

/* Fil d'Ariane */
.shop-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: var(--size-4) var(--size-8);
  margin: 0;
  padding: 0;
  list-style: none;
}
.shop-crumbs li + li::before { content: "/"; margin-right: var(--size-8); }
.shop-crumbs a { color: inherit; text-decoration: none; }
.shop-crumbs a:hover { text-decoration: underline; }

/* Catalogue : en-tête */
.shop-head > * { grid-column: 1 / span 8; }
.shop-head { padding-bottom: var(--size-36); }
@media screen and (max-width: 61.9375em) {
  .shop-head > * { grid-column: 1 / -1; }
}

/* Barre de filtres collante, compteur par famille, défilement horizontal en mobile. */
.shop-filterbar {
  position: sticky;
  top: 0;
  z-index: 50;
  margin-bottom: var(--size-36);
  padding-block: var(--size-12);
  background: color-mix(in srgb, var(--color-background) 92%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: var(--rule-subtle);
}
.shop-filters {
  display: flex;
  gap: var(--size-8);
  overflow-x: auto;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
  scroll-padding-inline: var(--layout-margin);
  margin-inline: calc(var(--layout-margin) * -1);
  padding-inline: var(--layout-margin);
}
.shop-filters::-webkit-scrollbar { display: none; }
.shop-filter {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: var(--size-8);
  min-height: var(--size-36);
  padding: var(--size-8) var(--size-14);
  border: var(--rule-subtle);
  background: transparent;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--type-small);
  line-height: var(--leading-ui);
  text-decoration: none;
  white-space: nowrap;
  scroll-snap-align: start;
  cursor: pointer;
}
.shop-filter-n { color: var(--color-muted); font-variant-numeric: tabular-nums; }
.shop-filter:hover { border-color: var(--color-text); }
.shop-filter[aria-pressed="true"] { border-color: var(--color-text); background: var(--color-text); color: var(--color-background); }
.shop-filter[aria-pressed="true"] .shop-filter-n { color: inherit; opacity: 0.7; }
.shop-filter:focus-visible { outline: var(--focus-ring); outline-offset: calc(var(--size-4) * -1); }

/* Rayon */
.shop-aisle {
  display: grid;
  grid-template-columns: subgrid;
  padding-bottom: var(--size-96);
  scroll-margin-top: var(--size-96);
}
.shop-aisle[hidden] { display: none; }
.shop-aisle-head {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: baseline;
  row-gap: var(--size-8);
  margin-bottom: var(--size-36);
  padding-top: var(--size-16);
  border-top: var(--rule-strong);
}
.shop-aisle-title {
  grid-column: 1 / span 6;
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--type-title);
  font-weight: var(--weight-regular);
  line-height: var(--leading-title);
  letter-spacing: var(--tracking-title);
}
.shop-aisle-intro {
  grid-column: 8 / span 5;
  max-width: var(--measure-lead);
  margin: 0;
  color: var(--color-muted);
  font-size: var(--type-body);
  line-height: var(--leading-lead);
  text-wrap: pretty;
}
@media screen and (max-width: 61.9375em) {
  .shop-aisle { padding-bottom: var(--size-64); }
  .shop-aisle-title,
  .shop-aisle-intro { grid-column: 1 / -1; }
}

/* Encart de fin */
.shop-end .yam-doors { grid-column: 1 / span 8; margin-top: var(--size-48); }
@media screen and (max-width: 61.9375em) {
  .shop-end .yam-doors { grid-column: 1 / -1; }
}

/* Fiche : vitrine manipulable + bloc achat */
.shop-pdp {
  row-gap: var(--size-24);
  align-items: start;
  padding-bottom: var(--size-64);
}
.shop-pdp .shop-crumbs { grid-column: 1 / -1; margin-bottom: var(--size-12); }
.shop-pdp-stage { grid-column: 1 / span 6; position: relative; }
.shop-pdp .shop-shot {
  aspect-ratio: 1;
  --shop-box-width: 42%;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}
.shop-pdp .shop-shot.is-turning { cursor: grabbing; }
.shop-pdp .shop-shot.is-turning .shop-box { transition: none; }
.shop-pdp .shop-shot.is-bundle { --shop-box-width: 48%; }
.shop-turn-hint {
  position: absolute;
  right: var(--size-12);
  bottom: var(--size-12);
  margin: 0;
  color: var(--color-muted);
  font-size: var(--type-label);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  pointer-events: none;
  transition: opacity var(--motion-swap);
}
.shop-pdp-stage.is-turned .shop-turn-hint { opacity: 0; }
.shop-buy {
  grid-column: 8 / span 5;
  position: sticky;
  top: var(--size-96);
  display: flex;
  flex-direction: column;
  gap: var(--size-20);
}
.shop-buy-family {
  margin: 0;
  color: var(--color-muted);
  font-size: var(--type-label);
  letter-spacing: var(--tracking-caps);
  line-height: var(--leading-ui);
  text-transform: uppercase;
}
.shop-buy-title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--type-display);
  font-weight: var(--weight-regular);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
  text-wrap: balance;
}
.shop-buy-lead {
  margin: 0;
  font-size: var(--type-lead);
  line-height: var(--leading-lead);
  text-wrap: pretty;
}
/* Tableau de caractéristiques (spec sheet). */
.shop-spec {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-body);
  line-height: 1.45;
}
.shop-spec th,
.shop-spec td {
  padding: var(--size-12) 0;
  border-top: var(--rule-subtle);
  text-align: left;
  vertical-align: baseline;
}
.shop-spec tr:last-child th,
.shop-spec tr:last-child td { border-bottom: var(--rule-subtle); }
.shop-spec th {
  width: 7.5rem;
  padding-right: var(--size-16);
  color: var(--color-muted);
  font-size: var(--type-label);
  font-weight: var(--weight-regular);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
}
.shop-spec td { text-wrap: pretty; }
.shop-stock { display: flex; align-items: center; gap: var(--size-8); margin: 0; font-size: var(--type-small); }
.shop-stock span { width: var(--size-8); height: var(--size-8); border-radius: 50%; background: var(--shop-campagnes); }
.shop-buy-acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--size-12) var(--size-24); }
.shop-link-brief,
.shop-continue {
  color: inherit;
  font-family: var(--font-heading);
  font-size: var(--type-body);
  font-weight: var(--weight-medium);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}
.shop-buy-note { margin: 0; color: var(--color-muted); font-size: var(--type-small); line-height: 1.45; }
@media screen and (max-width: 61.9375em) {
  .shop-pdp-stage { grid-column: 1 / span 4; }
  .shop-buy { grid-column: 5 / span 4; top: var(--size-64); }
}
@media screen and (max-width: 47.9375em) {
  .shop-pdp { row-gap: var(--size-16); }
  .shop-pdp-stage { grid-column: 1 / -1; }
  .shop-pdp .shop-shot { aspect-ratio: 16 / 10; --shop-box-width: 26%; }
  .shop-pdp .shop-shot.is-bundle { --shop-box-width: 34%; }
  .shop-buy { grid-column: 1 / -1; position: static; gap: var(--size-16); }
  .shop-buy-title { font-size: clamp(2rem, 1.6rem + 2vw, 2.5rem); }
  .shop-buy-lead { font-size: var(--type-body); }
  .shop-buy-acts { order: -1; }
  .shop-buy-family,
  .shop-buy-title,
  .shop-buy-lead { order: -2; }
}

/* Barre d'achat collante (mobile) */
.shop-buybar { display: none; }
@media screen and (max-width: 47.9375em) {
  .shop-buybar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 800;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--size-12);
    padding: var(--size-12) var(--layout-margin);
    padding-bottom: max(var(--size-12), env(safe-area-inset-bottom));
    background: var(--color-background);
    border-top: var(--rule-strong);
    transform: translateY(110%);
    transition: transform 360ms var(--shop-ease);
  }
  .shop-buybar.is-on { transform: none; }
  .shop-buybar-name {
    display: flex;
    align-items: center;
    gap: var(--size-12);
    min-width: 0;
    font-family: var(--font-heading);
    font-size: var(--type-body);
    font-weight: var(--weight-medium);
    line-height: var(--leading-ui);
  }
  .shop-buybar-name span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .shop-buybar .shop-add { flex: none; padding-inline: var(--size-16); }
}
@media (prefers-reduced-motion: reduce) {
  .shop-buybar { transition: none; }
}

/* Fiche : détails */
.shop-details { row-gap: var(--size-48); padding-bottom: var(--size-64); }
.shop-inbox { grid-column: 1 / span 6; }
.shop-aside { grid-column: 8 / span 5; display: flex; flex-direction: column; gap: var(--size-48); }
.shop-h2 {
  margin: 0 0 var(--size-16);
  padding-top: var(--size-16);
  border-top: var(--rule-strong);
  font-family: var(--font-heading);
  font-size: var(--type-subtitle);
  font-weight: var(--weight-regular);
  line-height: var(--leading-title);
  letter-spacing: var(--tracking-title);
}
.shop-inbox-list { margin: 0; padding: 0; list-style: none; }
.shop-inbox-list li {
  display: flex;
  align-items: baseline;
  gap: var(--size-16);
  padding-block: var(--size-12);
  border-bottom: var(--rule-subtle);
  font-size: var(--type-body);
  line-height: 1.45;
}
.shop-inbox-list li > span:nth-child(2) { flex: 1; text-wrap: pretty; }
/* Quantités alignées, chiffres tabulaires. */
.shop-inbox-n {
  flex: none;
  width: 2.5em;
  font-family: var(--font-heading);
  font-weight: var(--weight-strong);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.shop-inbox-dot {
  display: inline-block;
  width: var(--size-8);
  height: 2px;
  background: currentColor;
  transform: translateY(-0.3em);
}
.shop-inbox-list.is-set li { align-items: center; }
.shop-inbox-list.is-set li > span:nth-child(3) { flex: 1; }
.shop-inbox-list a { color: inherit; font-family: var(--font-heading); font-weight: var(--weight-medium); }
.shop-inbox-sub { display: block; color: var(--color-muted); font-size: var(--type-small); }
.shop-inbox-dur { flex: none; color: var(--color-muted); font-size: var(--type-small); font-variant-numeric: tabular-nums; white-space: nowrap; }
.shop-check {
  flex: none;
  display: grid;
  place-items: center;
  width: var(--size-20);
  height: var(--size-20);
  background: var(--color-text);
}
.shop-check::before {
  content: "";
  width: 5px;
  height: 9px;
  border: solid var(--color-background);
  border-width: 0 2px 2px 0;
  transform: translateY(-1px) rotate(45deg);
}
.shop-team {
  display: flex;
  align-items: center;
  gap: var(--size-12);
  margin: var(--size-24) 0 0;
  font-size: var(--type-body);
  line-height: var(--leading-lead);
}
/* Accordéons */
.shop-accordions { border-top: var(--rule-strong); }
.shop-acc { border-bottom: var(--rule-subtle); }
.shop-acc summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--size-16);
  padding-block: var(--size-16);
  list-style: none;
  cursor: pointer;
}
.shop-acc summary::-webkit-details-marker { display: none; }
.shop-acc summary:focus-visible { outline: var(--focus-ring); outline-offset: var(--size-4); }
.shop-acc-title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--type-body);
  font-weight: var(--weight-medium);
  line-height: var(--leading-title);
}
.shop-acc-sign { position: relative; flex: none; width: 12px; height: 12px; }
.shop-acc-sign::before,
.shop-acc-sign::after {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 12px;
  height: 2px;
  background: currentColor;
  transition: transform var(--motion-swap);
}
.shop-acc-sign::after { transform: rotate(90deg); }
.shop-acc[open] .shop-acc-sign::after { transform: rotate(0deg); }
.shop-acc-body p {
  max-width: var(--measure-lead);
  margin: 0 0 var(--size-16);
  font-size: var(--type-body);
  line-height: var(--leading-lead);
  text-wrap: pretty;
}
.shop-with-list { display: flex; flex-direction: column; gap: var(--size-12); margin: 0; padding: 0; list-style: none; }
.shop-guide-link { display: flex; flex-direction: column; gap: var(--size-4); margin: 0; padding-top: var(--size-16); border-top: var(--rule-strong); }
.shop-guide-label { color: var(--color-muted); font-size: var(--type-label); letter-spacing: var(--tracking-caps); text-transform: uppercase; }
.shop-guide-link a {
  color: inherit;
  font-family: var(--font-heading);
  font-size: var(--type-lead);
  line-height: var(--leading-title);
  text-underline-offset: 0.15em;
  text-decoration-thickness: 1px;
}
@media screen and (max-width: 61.9375em) {
  .shop-inbox,
  .shop-aside { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .shop-acc-sign::before,
  .shop-acc-sign::after,
  .shop-turn-hint { transition: none; }
}

/* Ils l'ont commandé */
.shop-refs { row-gap: var(--size-24); padding-bottom: var(--size-64); }
.shop-refs-head { grid-column: 1 / span 8; }
.shop-refs-note { max-width: var(--measure-lead); margin: 0; font-size: var(--type-lead); line-height: var(--leading-lead); text-wrap: pretty; }
.shop-refs-list { display: grid; grid-template-columns: subgrid; row-gap: var(--size-36); margin: 0; padding: 0; list-style: none; }
.shop-refs-list:empty { display: none; }
.shop-refs-list > li { grid-column: span 4; min-width: 0; }
.shop-refs-others { margin: 0; font-size: var(--type-body); line-height: var(--leading-lead); }
.shop-ref { display: block; color: inherit; text-decoration: none; }
.shop-ref-image { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--color-surface); }
.shop-ref-image img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; transition: transform var(--motion-swap); }
.shop-ref-name {
  display: block;
  margin-top: var(--size-12);
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: var(--weight-medium);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.shop-ref-line { display: block; margin-top: var(--size-4); color: var(--color-muted); font-size: var(--type-small); line-height: 1.45; }
@media (hover: hover) {
  .shop-ref:hover .shop-ref-image img { transform: scale(1.03); }
  .shop-ref:hover .shop-ref-name { text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
}
@media screen and (max-width: 61.9375em) {
  .shop-refs-head { grid-column: 1 / -1; }
}
@media screen and (max-width: 29.9375em) {
  .shop-refs-list > li { grid-column: 1 / -1; }
}

/* Récemment consultés */
.shop-recent { padding-bottom: var(--size-64); }
.shop-recent[hidden] { display: none; }

/* Mon brief */
.shop-cart { align-items: start; row-gap: var(--size-48); }
.shop-cart-list { grid-column: 1 / span 6; }
.shop-cart-form { grid-column: 8 / span 5; }
.shop-cart-title { margin-top: var(--hero-gap) !important; }
.shop-cart-intro {
  max-width: var(--measure-lead);
  margin: var(--hero-gap) 0 0;
  color: var(--color-muted);
  font-size: var(--type-lead);
  line-height: var(--leading-lead);
  text-wrap: pretty;
}
.shop-cart-list > .shop-lines { margin-top: var(--size-36); border-top: var(--rule-strong); }
.shop-cart-list > .shop-lines:empty { display: none; }
.shop-cart-list .shop-line-name { font-size: var(--type-lead); }
.shop-cart-list .shop-line .shop-mini { width: var(--size-36); height: var(--size-48); }
.shop-empty { margin: var(--size-36) 0 var(--size-24); padding-top: var(--size-24); border-top: var(--rule-strong); }
.shop-empty[hidden] { display: none; }
.shop-empty-title {
  max-width: 24ch;
  margin: 0 0 var(--size-12);
  font-family: var(--font-heading);
  font-size: var(--type-title);
  line-height: var(--leading-title);
  letter-spacing: var(--tracking-title);
  text-wrap: balance;
}
.shop-empty-text { max-width: var(--measure-lead); margin: 0 0 var(--size-36); color: var(--color-muted); font-size: var(--type-body); line-height: var(--leading-lead); }
.shop-empty-label { margin: 0 0 var(--size-16); color: var(--color-muted); font-size: var(--type-label); letter-spacing: var(--tracking-caps); text-transform: uppercase; }
/* Dans la colonne de 6 : deux cartes par rangée. */
.shop-grid.is-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--size-36) var(--grid-gap); }
.shop-grid.is-compact .shop-card-item { grid-column: auto; }
.shop-cart-list .shop-sum { margin: 0 0 var(--size-24); padding-block: var(--size-16); }
.shop-cart-form { padding: var(--size-24); background: var(--color-surface); }
.shop-cart-form-title {
  margin: 0 0 var(--size-16);
  font-family: var(--font-heading);
  font-size: var(--type-title);
  font-weight: var(--weight-regular);
  line-height: var(--leading-title);
  letter-spacing: var(--tracking-title);
}
.shop-cart-form .contact-reply { margin: 0 0 var(--size-24); }
.shop-call { margin: var(--size-24) 0 0; font-size: var(--type-small); color: var(--color-muted); }
.shop-call a { color: var(--color-text); }
@media screen and (max-width: 61.9375em) {
  .shop-cart-list,
  .shop-cart-form { grid-column: 1 / -1; }
}
@media screen and (max-width: 29.9375em) {
  .shop-cart-form { padding: var(--size-16); }
}
/* Brief vide : pas de total à zéro. */
.shop-empty:not([hidden]) ~ .shop-sum { display: none; }

/* ==========================================================================
   DA technique (12/11/2026) : pages du Shop. Tokens dans shared/styles/shop.css.
   ========================================================================== */

/* Fil d'Ariane, compteurs, libellés : voix « données ». */
.shop-crumbs,
.shop-count,
.shop-filter,
.shop-spec th,
.shop-inbox-n,
.shop-acc-sign,
.shop-guide-label,
.shop-buy-note,
.shop-link-brief,
.shop-continue,
.shop-call,
.shop-refs-others {
  font-family: var(--shop-mono);
  font-size: var(--shop-mono-size);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  letter-spacing: var(--shop-mono-track);
  line-height: 1.5;
  text-transform: uppercase;
}
.shop-crumbs { color: var(--color-muted); }
.shop-crumbs li + li::before { margin-right: var(--size-8); }

/* Catalogue : en-tête compact, pas de grand titre. */
.shop-head { row-gap: var(--size-8); padding-bottom: var(--size-24); }
.shop-head > * { grid-column: 1 / span 6; }
.shop-head .shop-crumbs { margin-bottom: var(--size-8); }
.shop-title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem);
  font-weight: var(--weight-regular);
  line-height: 1.05;
  letter-spacing: -0.02em;
}
.shop-lead {
  max-width: 52ch;
  margin: 0;
  color: var(--color-muted);
  font-size: var(--type-small);
  line-height: 1.5;
  text-wrap: pretty;
}
.shop-count { margin: var(--size-4) 0 0; color: var(--color-text); }
@media screen and (max-width: 61.9375em) {
  .shop-head > * { grid-column: 1 / -1; }
}

/* Filtres : onglets texte, filet fin sous l'actif seulement. */
.shop-filterbar {
  margin-bottom: 0;
  padding-block: 0;
  background: var(--color-background);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-top: var(--shop-rule);
  border-bottom: var(--shop-rule);
}
.shop-filters { gap: var(--size-24); }
.shop-filter {
  min-height: var(--size-48);
  padding: 0;
  border: 0;
  border-bottom: var(--rule-width) solid transparent;
  color: var(--color-muted);
  transition: color var(--shop-motion), border-color var(--shop-motion);
}
.shop-filter:hover { border-color: transparent; color: var(--color-text); }
.shop-filter[aria-pressed="true"] { background: none; color: var(--color-text); border-bottom-color: var(--color-text); }
.shop-filter[aria-pressed="true"] .shop-filter-n { opacity: 1; }
.shop-filter-n { color: inherit; }

/* Rayons : une ligne de titre discrète au-dessus de la grille. */
.shop-catalogue { padding-top: var(--size-36); }
.shop-aisle { padding-bottom: var(--size-64); }
.shop-aisle-head {
  margin-bottom: var(--size-16);
  padding-top: 0;
  border-top: 0;
}
.shop-aisle-title {
  font-size: var(--type-subtitle);
  font-weight: var(--weight-medium);
  letter-spacing: -0.01em;
}
.shop-aisle-intro { font-size: var(--type-small); }

/* Fiche : scène carrée collante à gauche, contenu qui défile à droite. */
.shop-pdp { row-gap: var(--size-36); padding-bottom: var(--size-64); }
.shop-pdp-stage {
  grid-column: 1 / span 6;
  position: sticky;
  top: var(--size-24);
}
.shop-pdp .shop-shot,
.shop-pdp .shop-shot.has-picto {
  aspect-ratio: 1;
  cursor: default;
  background-color: var(--shop-stage-bg);
  background-image: radial-gradient(circle, var(--shop-stage-dots) 1px, transparent 1.4px);
  background-size: 14px 14px;
  background-position: center;
}
.shop-pdp .shop-picto-svg { width: min(46cqw, 46cqh); }
.shop-pdp .shop-picto:not(.is-n1) .shop-picto-svg { width: min(26cqw, 26cqh); }
.shop-pdp .shop-picto.is-n4 .shop-picto-svg { width: min(24cqw, 24cqh); }
.shop-pdp-info {
  grid-column: 8 / span 5;
  display: flex;
  flex-direction: column;
  gap: var(--size-48);
  min-width: 0;
}
.shop-buy { position: static; grid-column: auto; gap: var(--size-16); }
.shop-buy .shop-crumbs { margin-bottom: var(--size-8); }
.shop-buy-title {
  font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
}
.shop-buy-lead { font-size: var(--type-body); line-height: 1.5; color: var(--color-text); }
.shop-spec { font-size: var(--type-small); }
.shop-spec th,
.shop-spec td { padding: var(--size-8) 0; border-top: var(--shop-rule); }
.shop-spec tr:last-child th,
.shop-spec tr:last-child td { border-bottom: var(--shop-rule); }
.shop-spec th { width: 6.5rem; color: var(--color-muted); }
.shop-buy-acts { flex-direction: column; align-items: stretch; gap: var(--size-12); }
.shop-buy-acts .shop-add { width: 100%; }
.shop-link-brief,
.shop-continue { align-self: flex-start; color: var(--color-text); text-decoration: underline; text-underline-offset: 0.3em; }
.shop-buy-note { color: var(--color-muted); }
.shop-details { display: flex; flex-direction: column; gap: var(--size-48); padding-bottom: 0; }
.shop-inbox, .shop-aside { grid-column: auto; }
.shop-aside { gap: var(--size-48); }
.shop-h2 {
  margin-bottom: 0;
  padding: 0 0 var(--size-12);
  border-top: 0;
  border-bottom: var(--rule-strong);
  font-size: var(--type-body);
  font-weight: var(--weight-medium);
  letter-spacing: 0;
}
/* Dans la boîte : tableau à filets, quantités alignées à droite. */
.shop-inbox-list li {
  gap: var(--size-16);
  padding-block: var(--size-8);
  border-bottom: var(--shop-rule);
  font-size: var(--type-small);
}
.shop-inbox-list li > span:nth-child(2) { order: 0; }
.shop-inbox-n {
  order: 2;
  width: auto;
  min-width: 3ch;
  margin-left: auto;
  font-weight: 400;
  color: var(--color-text);
}
.shop-inbox-n.is-empty { visibility: hidden; }
.shop-inbox-list.is-set li { gap: var(--size-12); }
.shop-inbox-list.is-set li > span:nth-child(2) { flex: 1; }
.shop-inbox-list a { font-weight: var(--weight-medium); text-decoration: none; }
.shop-inbox-list a:hover { text-decoration: underline; }
.shop-inbox-sub { font-size: var(--type-small); }
.shop-team { font-size: var(--type-small); }
/* Accordéons à filets, signe + / − en mono. */
.shop-accordions { border-top: var(--rule-strong); }
.shop-acc { border-bottom: var(--shop-rule); }
.shop-acc summary { padding-block: var(--size-12); }
.shop-acc-title { font-size: var(--type-small); }
.shop-acc-sign { width: auto; height: auto; font-size: 0.875rem; }
.shop-acc-sign::before,
.shop-acc-sign::after { display: none; }
.shop-acc-sign::before { content: "+"; display: inline; position: static; width: auto; height: auto; background: none; }
.shop-acc[open] .shop-acc-sign::before { content: "\2212"; }
.shop-acc-body p { font-size: var(--type-small); }
.shop-aside .shop-grid.is-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.shop-guide-link { border-top: var(--rule-strong); padding-top: var(--size-12); }
.shop-guide-link a { font-size: var(--type-body); }

/* Ils l'ont commandé : vignettes carrées, sans légende. */
.shop-refs { padding-top: var(--size-24); }
.shop-refs-head { grid-column: 1 / span 6; }
.shop-refs-head .shop-h2 { margin-bottom: var(--size-12); }
.shop-refs-note { font-size: var(--type-body); color: var(--color-muted); }
.shop-refs-list { column-gap: var(--grid-gap); }
.shop-refs-list > li { grid-column: span 3; }
.shop-ref-image { aspect-ratio: 1; background: var(--shop-stage-bg); }
.shop-refs-others { color: var(--color-muted); }
@media (hover: hover) {
  .shop-ref:hover .shop-ref-image img { transform: scale(1.02); }
}

/* Panier : ticket, formulaire sur fond blanc avec filet. */
.shop-cart-title { font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem); }
.shop-cart-intro { font-size: var(--type-small); }
.shop-cart-list > .shop-lines { border-top: var(--rule-strong); }
.shop-cart-list .shop-line-name { font-size: var(--type-body); }
.shop-cart-list .shop-line .shop-mini { width: var(--size-48); height: var(--size-48); }
.shop-cart-list .shop-sum { padding-block: var(--size-12); border-bottom: var(--rule-strong); }
.shop-cart-form { background: var(--color-surface); border: var(--shop-rule); }
.shop-cart-form-title { font-size: var(--type-subtitle); font-weight: var(--weight-medium); }
.shop-empty { border-top: var(--rule-strong); }
.shop-empty-title { font-size: var(--type-subtitle); }

@media screen and (max-width: 61.9375em) {
  .shop-pdp-stage { grid-column: 1 / span 4; top: var(--size-16); }
  .shop-pdp-info { grid-column: 5 / span 4; }
  .shop-refs-head { grid-column: 1 / -1; }
  .shop-refs-list > li { grid-column: span 4; }
}
@media screen and (max-width: 47.9375em) {
  .shop-pdp { row-gap: var(--size-16); }
  .shop-pdp-stage { grid-column: 1 / -1; position: static; }
  .shop-pdp .shop-shot,
  .shop-pdp .shop-shot.has-picto { aspect-ratio: 4 / 3; }
  .shop-pdp .shop-shot.has-object { aspect-ratio: 1; }
  .shop-pdp-info { grid-column: 1 / -1; gap: var(--size-36); }
  .shop-buy .shop-crumbs { order: -3; }
}
@media screen and (max-width: 29.9375em) {
  .shop-pdp .shop-shot,
  .shop-pdp .shop-shot.has-picto { aspect-ratio: 16 / 10; }
  .shop-pdp .shop-shot.has-object { aspect-ratio: 1; }
  .shop-refs-list > li { grid-column: span 2; }
  .shop-filters { gap: var(--size-20); }
}
@media (prefers-reduced-motion: reduce) {
  .shop-filter { transition: none; }
}
.shop-cart-title {
  margin: var(--size-12) 0 0 !important;
  font-family: var(--font-heading);
  font-weight: var(--weight-regular);
  line-height: 1.05;
  letter-spacing: -0.02em;
}
.shop-cart-intro { margin-top: var(--size-8); }
/* Formulaire du panier : angles droits (le formulaire de /contact garde les siens). */
.shop-cart-form .brief-chip span,
.shop-cart-form .brief-input,
.shop-cart-form .brief-file,
.shop-cart-form .brief-submit { border-radius: 0; }
.shop-cart-form .brief-form { padding: 0; border-radius: 0; }

/* Rythme du catalogue (12/11/2026) */
.shop-rail-frame { padding-top: var(--size-36); }
.shop-aisle-foot { grid-column: 1 / -1; margin: var(--size-16) 0 0; }
/* Citation : typographie seule, filets en haut et en bas. */
.shop-quote {
  row-gap: var(--size-16);
  margin-block: 0 var(--size-64);
  padding-block: var(--size-48);
  border-block: var(--rule-strong);
}
.shop-quote > * { grid-column: 1 / span 9; }
.shop-quote-kicker {
  margin: 0;
  color: var(--color-muted);
  font-family: var(--shop-mono);
  font-size: var(--shop-mono-size);
  letter-spacing: var(--shop-mono-track);
  text-transform: uppercase;
}
.shop-quote-text { margin: 0; }
.shop-quote-text p {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 1.2rem + 2.4vw, 3.5rem);
  font-weight: var(--weight-regular);
  line-height: 1.05;
  letter-spacing: -0.03em;
  text-wrap: balance;
}
.shop-quote .shop-call-link { justify-self: start; }
/* Section CTA : la seule du catalogue, pleine largeur, à l'encre. */
.shop-cta {
  margin-block: 0 var(--size-64);
  background: var(--color-text);
  color: var(--color-background);
}
.shop-cta-in { row-gap: var(--size-16); padding-block: var(--size-64); }
.shop-cta-in > * { grid-column: 1 / span 8; }
.shop-cta-kicker {
  margin: 0;
  color: color-mix(in srgb, var(--color-background) 70%, transparent);
  font-family: var(--shop-mono);
  font-size: var(--shop-mono-size);
  letter-spacing: var(--shop-mono-track);
  text-transform: uppercase;
}
.shop-cta-title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(2rem, 1.4rem + 2.6vw, 3.75rem);
  font-weight: var(--weight-regular);
  line-height: 1;
  letter-spacing: -0.03em;
  text-wrap: balance;
}
.shop-cta-text { margin: 0; max-width: 46ch; color: color-mix(in srgb, var(--color-background) 80%, transparent); font-size: var(--type-body); line-height: 1.5; }
.shop-cta-acts { display: flex; flex-wrap: wrap; gap: var(--size-12); margin-top: var(--size-8); }
.shop-add.is-invert { border-color: var(--color-background); background: var(--color-background); color: var(--color-text); }
.shop-add.is-invert:hover { background: transparent; color: var(--color-background); }
.shop-add.is-ghost { border-color: var(--color-background); background: transparent; color: var(--color-background); }
.shop-add.is-ghost:hover { background: var(--color-background); color: var(--color-text); }
/* Bande de fin de fiche : variante légère, filets. */
.shop-band {
  align-items: center;
  row-gap: var(--size-12);
  margin-top: var(--size-48);
  padding-block: var(--size-24);
  border-block: var(--shop-rule);
}
.shop-band-text {
  grid-column: 1 / span 7;
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem);
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.shop-band-acts { grid-column: 9 / span 4; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--size-12) var(--size-24); margin: 0; }
.shop-product .shop-rail-frame { padding-block: var(--size-36) 0; }
.shop-recent { padding-top: var(--size-36); }
@media screen and (max-width: 61.9375em) {
  .shop-quote > *,
  .shop-cta-in > *,
  .shop-band-text,
  .shop-band-acts { grid-column: 1 / -1; justify-content: flex-start; }
}
.shop-quote-text { padding: 0; border: 0; }