/* Boutique — /boutique/, /en/shop/.
   On sort par ici. Chaque tirage est accroché sur le mur de sa salle (--wall), sous une
   applique de laiton ; le papier (--paper) porte les cartels, les tarifs et la carte de membre.
   Sans JavaScript (html:not(.js)) : pas de filtre, les fiches produits suivent la grille. */

.shop { padding-bottom: var(--s-4); }

/* ---------- En-tête : panneau de sortie suspendu, enseigne, cordon ---------- */

.shop-hero {
  display: grid; justify-items: center; text-align: center;
  max-width: var(--wrap); margin-inline: auto;
  padding: var(--s-5) var(--gutter) var(--s-3);
}
.shop-hero__exit { position: relative; font-size: clamp(0.95rem, 0.88rem + 0.4vw, 1.2rem); padding: 0.5rem 0.95rem 0.5rem 0.75rem; gap: 0.6em; }
/* Deux tiges le suspendent au plafond. */
.shop-hero__exit::before, .shop-hero__exit::after { content: ''; position: absolute; bottom: 100%; width: 2px; height: var(--s-5); background: var(--ink-3); }
.shop-hero__exit::before { left: 16%; }
.shop-hero__exit::after { right: 16%; }
.shop-hero__picto { width: 1.9em; height: 1.45em; flex: none; }
.shop-hero__arrow { font-family: var(--f-sign); font-weight: 800; }

.shop-hero__title {
  margin-top: var(--s-5);
  font-family: var(--f-sign); font-stretch: 68%; font-weight: 800; text-transform: uppercase;
  /* L'enseigne tient toujours sur une ligne : corps calculé sur le nombre de lettres (--chars). */
  font-size: min(8.5rem, 30vw, (100vw - 2 * var(--gutter) - 1rem) / (var(--chars, 8) * 0.6));
  line-height: 0.84; letter-spacing: 0.035em;
  padding: 0.14em 0.12em 0.06em 0.155em; /* l'approche finale est compensée à gauche : symétrie */
  border-block: 4px double var(--ink);
}
.shop-hero__intro { margin-top: var(--s-4); max-width: 34ch; font-family: var(--f-admin); font-size: 0.9rem; line-height: 1.55; color: var(--ink-2); text-wrap: balance; }
/* Ce que financent les ventes : la prochaine version des œuvres */
.shop-hero__mission { margin-top: var(--s-3); max-width: 40ch; font-family: var(--f-admin); font-size: 0.84rem; line-height: 1.5; text-wrap: balance; }
.shop-hero__mission a { color: var(--ink); text-decoration-color: var(--bordeaux); text-decoration-thickness: 1.5px; text-underline-offset: 0.2em; }
.shop-hero__rope { width: min(100%, 400px); height: auto; margin-top: var(--s-4); }
.shop-hero__rope .rope__post { fill: var(--brass); }
.shop-hero__rope .rope__cord { fill: none; stroke: var(--bordeaux); stroke-width: 7; stroke-linecap: round; }
@media (max-width: 639.98px) {
  .shop-hero { padding-top: var(--s-5); }
  .shop-hero__exit::before, .shop-hero__exit::after { height: var(--s-5); }
  .shop-hero__title { margin-top: var(--s-4); }
  .shop-hero__intro { margin-top: var(--s-3); font-size: 0.84rem; }
  .shop-hero__rope { width: min(100%, 300px); margin-top: var(--s-3); }
}

/* ---------- Grille des tirages ---------- */

.prints { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-5) var(--s-4); }
.prints__list { display: contents; list-style: none; }
@media (min-width: 640px) {
  .prints { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .price-board { grid-column: span var(--fill-2, 1); }
}
@media (min-width: 1024px) {
  .prints { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--s-6); }
  .price-board { grid-column: span var(--fill-3, 2); }
}

.print { position: relative; display: grid; grid-template-rows: auto 1fr; background: var(--paper); }
.print[hidden] { display: none; }

/* Le mur, son applique de laiton et le halo qu'elle pose sur le tirage. */
.print__wall, .sheet__wall { position: relative; background: var(--wall, var(--plaster-2)); overflow: hidden; isolation: isolate; }
.print__wall { aspect-ratio: 5 / 6; }
.print__wall::before, .sheet__wall::before {
  content: ''; position: absolute; z-index: 3; top: 5%; left: 50%; width: 28%; height: 6px; transform: translateX(-50%);
  background: var(--brass); border-bottom: 2px solid #7f6338; border-radius: 1px;
}
.print__wall::after, .sheet__wall::after {
  content: ''; position: absolute; z-index: 2; inset: 5% 0 auto; height: 72%; pointer-events: none;
  background: radial-gradient(58% 60% at 50% 0%, rgba(255, 236, 204, 0.3), rgba(255, 236, 204, 0) 72%);
  mix-blend-mode: screen; opacity: 0.75; transition: opacity 0.3s;
}
.print:hover .print__wall::after { opacity: 1; }

/* Le tirage : un panneau d'aluminium, sans cadre, décollé du mur par son système d'accroche. */
.print__img, .sheet__img {
  position: absolute; z-index: 1; left: 0; right: 0; margin: auto; object-fit: contain;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 1px rgba(0, 0, 0, 0.3), 0 18px 26px -14px rgba(0, 0, 0, 0.65);
}
.print__img { top: 0; bottom: 9%; height: 67%; width: auto; }
.print.is-land .print__img { width: 78%; height: auto; }

/* La version précédente, épinglée dans le coin du tirage, comme dans la collection. */
.print__before {
  position: absolute; z-index: 3; right: 7%; bottom: 5%; display: block; padding: 4px 4px 10px;
  background: var(--paper); box-shadow: 0 8px 14px -8px rgba(0, 0, 0, 0.6); transform: rotate(4deg);
}
.print__before::before {
  content: ''; position: absolute; left: 50%; top: 2px; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #f3dfb0, var(--brass) 55%, #6f5530);
}
.print__before-img { display: block; height: clamp(3.6rem, 6.5vw, 5.4rem); width: auto; max-width: 5.6rem; object-fit: cover; }

.print__cartel { display: grid; grid-template-rows: auto auto 1fr auto; gap: 0.35rem; padding: var(--s-3) var(--s-3) var(--s-3); border: 1px solid var(--rule); border-top: 0; }
.print__title { font-family: var(--f-inscription); font-style: italic; font-weight: 500; font-size: var(--step-1); line-height: 1.15; }
.print__link { text-decoration: none; }
/* Toute la carte est cliquable, par un seul lien (un seul arrêt au clavier). */
.print__link::after { content: ''; position: absolute; inset: 0; z-index: 4; }
.print:hover .print__link { text-decoration: underline; text-decoration-color: var(--bordeaux); }
.print__link:focus-visible { outline: none; }
.print:has(.print__link:focus-visible) { outline: 2px solid var(--bordeaux); outline-offset: 3px; }
.print__inv { font-family: var(--f-admin); font-size: 0.74rem; color: var(--ink-2); }
.print__role { font-family: var(--f-inscription); font-size: 1rem; line-height: 1.4; color: var(--ink-2); }
.print__price {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.2rem var(--s-2);
  margin-top: var(--s-2); padding-top: var(--s-2); border-top: 1px solid var(--rule);
  font-family: var(--f-admin); font-size: 0.82rem;
}
.print__status { color: var(--ink-2); }
.print__status.is-on { color: var(--ink); }
.print__status.is-on::before { content: ''; display: inline-block; width: 0.5em; height: 0.5em; margin-right: 0.45em; background: currentColor; vertical-align: 0.05em; }

/* ---------- Tableau des tarifs (dernière case de la grille) ---------- */

.price-board {
  container-type: inline-size; align-self: start;
  background: var(--paper); padding: var(--s-4);
  border: 1px solid var(--ink); box-shadow: inset 0 0 0 4px var(--paper), inset 0 0 0 5px var(--ink);
}
@media (min-width: 1024px) { .price-board { padding: var(--s-5); } }
.price-board__inner { display: grid; gap: var(--s-4); }
/* Case large (deux colonnes de grille ou plus) : présentation et tableau côte à côte. */
@container (min-width: 34rem) {
  .price-board__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: var(--s-5); }
}
.price-board__kicker { font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.price-board__title { margin-top: 0.3rem; font-family: var(--f-sign); font-stretch: 75%; font-weight: 800; font-size: var(--step-3); line-height: 0.95; text-transform: uppercase; letter-spacing: 0.02em; }
.price-board__note { margin-top: var(--s-2); font-family: var(--f-inscription); font-style: italic; font-size: var(--step-1); line-height: 1.25; }
.price-board__features { margin-top: var(--s-3); list-style: none; display: grid; gap: 0.3rem; font-size: 0.92rem; }
.price-board__features li, .sheet__features li { padding-left: 1.1em; position: relative; }
.price-board__features li::before, .sheet__features li::before { content: ''; position: absolute; left: 0; top: 0.62em; width: 0.45em; height: 1px; background: currentColor; }
.price-board__payment { margin-top: var(--s-3); font-family: var(--f-admin); font-size: 0.8rem; line-height: 1.5; color: var(--ink-2); }

/* Formats et prix : un registre, en chasse fixe. */
.formats { width: 100%; border-collapse: collapse; font-family: var(--f-admin); font-size: 0.86rem; font-variant-numeric: tabular-nums; }
.formats caption { text-align: left; padding-bottom: var(--s-2); font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.14em; }
.formats th, .formats td { padding: 0.55rem 0; text-align: left; font-weight: 400; border-bottom: 1px dotted var(--ink-3); vertical-align: baseline; }
.formats thead th { padding-block: 0 0.4rem; border-bottom: 1px solid var(--ink); font-family: var(--f-sign); font-stretch: 80%; font-weight: 600; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--ink-2); }
.formats td, .formats thead th:last-child { text-align: right; white-space: nowrap; }
.formats__in { color: var(--ink-2); margin-left: 0.35em; white-space: nowrap; }
.formats .is-soon .formats__price, .formats .is-soon .formats__cm { color: var(--ink-2); }
.formats__soon {
  display: inline-block; margin-right: 0.5em; padding: 0.05rem 0.35rem;
  border: 1px solid currentColor; border-radius: var(--radius);
  font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.68rem; line-height: 1.3; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ink-2);
}
.formats__note { margin-top: var(--s-2); font-family: var(--f-admin); font-size: 0.78rem; line-height: 1.5; color: var(--ink-2); }
.formats__note::before { content: '— '; }

/* ---------- Fiches produits ---------- */

/* Sans JavaScript, elles suivent la grille ; avec, elles attendent qu'on les ouvre. */
.catalogue { max-width: var(--wrap); margin: var(--s-7) auto 0; padding-inline: var(--gutter); display: grid; gap: var(--s-6); }
.catalogue__title { font-family: var(--f-sign); font-stretch: 75%; font-weight: 800; font-size: var(--step-2); text-transform: uppercase; letter-spacing: 0.04em; border-top: 2px solid var(--ink); padding-top: var(--s-3); }
html.js .catalogue { display: none; }

.sheet { display: grid; grid-template-columns: minmax(0, 1fr); background: var(--paper); scroll-margin-top: var(--s-4); }
.sheet__wall { aspect-ratio: 4 / 5; }
.sheet__wall picture { display: contents; }
.sheet__img { top: 0; bottom: 6%; height: 76%; width: auto; max-width: 86%; }
.sheet__wall.is-land .sheet__img { width: 86%; height: auto; max-height: 76%; }
.sheet__panel { display: grid; gap: var(--s-3); align-content: start; padding: var(--s-4) var(--gutter) var(--s-5); border-top: 3px solid var(--obj); }

.sheet__meta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0.25rem var(--s-3); }
.sheet__room { font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.sheet__inv { font-family: var(--f-admin); font-size: 0.78rem; color: var(--ink-2); }
.sheet__title { font-family: var(--f-inscription); font-style: italic; font-weight: 500; font-size: var(--step-3); line-height: 1.02; }
.sheet__title:focus { outline: none; }
.sheet__title:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 4px; }
.sheet__role { font-family: var(--f-inscription); font-size: var(--step-1); line-height: 1.35; color: var(--ink-2); }
/* La version précédente : l'œuvre d'origine, sa légende et son crédit (styles .archive de notice.css). */
.sheet__before { display: grid; gap: 0.6rem; padding-block: var(--s-3) var(--s-2); border-top: 1px solid var(--rule); }
.sheet__before-label { font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.sheet__from { font-family: var(--f-admin); font-size: 1rem; font-weight: 500; }
.sheet__materials { margin: 0; padding-block: var(--s-2); border-block: 1px solid var(--rule); }
.sheet__materials dt, .sheet__product-name { font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.sheet__materials dd { margin: 0.2rem 0 0; font-family: var(--f-admin); font-size: 0.86rem; }
.sheet__features { margin-top: 0.4rem; list-style: none; display: grid; gap: 0.25rem; font-size: 0.95rem; }
.sheet__buy { display: grid; gap: var(--s-2); padding-top: var(--s-2); }
.sheet__notify { font-size: 0.95rem; line-height: 1.45; }
.sheet__order { width: 100%; }
.sheet__fine { list-style: none; display: grid; gap: 0.3rem; margin-top: 0.2rem; font-family: var(--f-admin); font-size: 0.78rem; line-height: 1.5; color: var(--ink-2); }
.sheet__more { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); padding-top: var(--s-3); border-top: 1px solid var(--rule); }
.sheet__share {
  min-height: 44px; padding: 0.5rem 0.9rem; background: transparent; color: var(--ink);
  border: 1px solid var(--ink); border-radius: var(--radius);
  font-family: var(--f-sign); font-stretch: 85%; font-weight: 600; font-size: 0.88rem; line-height: 1.2; text-align: left;
}
.sheet__share:hover { background: var(--ink); color: var(--paper); }
.sheet__work { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.92rem; }
.sheet__back { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; font-family: var(--f-admin); font-size: 0.82rem; }
.sheet-dialog .sheet__back { display: none; }

@media (min-width: 960px) {
  .sheet { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); }
  .sheet__wall { aspect-ratio: auto; min-height: 44rem; }
  .sheet__panel { border-top: 0; border-left: 3px solid var(--obj); padding: var(--s-5) var(--s-5) var(--s-5); }
  .sheet__order { width: auto; justify-self: start; }
}

/* ---------- Fenêtre des fiches ---------- */

.sheet-dialog {
  padding: 0; border: 0; margin: auto; overflow: hidden;
  width: min(1180px, 100vw - 2 * var(--s-5)); height: min(900px, 100dvh - 2 * var(--s-5));
  max-width: none; max-height: none;
  background: var(--paper); color: var(--ink);
}
.sheet-dialog[open] { display: flex; flex-direction: column; animation: sheet-in 0.24s var(--ease-out); }
.sheet-dialog::backdrop { background: rgba(18, 17, 16, 0.74); }
@keyframes sheet-in { from { opacity: 0; transform: translateY(10px); } }
:root:has(.sheet-dialog[open]) { overflow: hidden; scrollbar-gutter: stable; }

.sheet-dialog__bar {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: var(--s-2);
  padding: 0.4rem var(--s-2) 0.4rem var(--s-2); border-bottom: 1px solid var(--rule); background: var(--paper);
}
.sheet-dialog__nav { display: flex; align-items: center; gap: 0.25rem; }
.sheet-dialog__step, .sheet-dialog__close {
  min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--ink); border: 1px solid var(--ink); border-radius: var(--radius);
  font-family: var(--f-sign); font-stretch: 85%; font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em;
}
.sheet-dialog__step { font-size: 1.1rem; letter-spacing: 0; }
.sheet-dialog__close { padding: 0 0.9rem; }
.sheet-dialog__step:hover, .sheet-dialog__close:hover { background: var(--ink); color: var(--paper); }
.sheet-dialog__pos { min-width: 5.5em; text-align: center; font-family: var(--f-admin); font-size: 0.8rem; color: var(--ink-2); }
.sheet-dialog__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }

@media (min-width: 960px) {
  .sheet-dialog__body { overflow: hidden; }
  .sheet-dialog .sheet { height: 100%; }
  .sheet-dialog .sheet__wall { min-height: 0; }
  .sheet-dialog .sheet__panel { overflow-y: auto; overscroll-behavior: contain; }
}
@media (max-width: 959.98px) {
  .sheet-dialog { width: 100%; height: 100%; max-width: 100%; max-height: 100%; margin: 0; }
  .sheet-dialog__bar { padding-top: calc(0.4rem + env(safe-area-inset-top, 0px)); }
  .sheet-dialog .sheet__panel { padding-bottom: calc(var(--s-6) + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- Caisse intégrée : choix du format dans la fiche (src/pages/shop.js, buy) ---------- */

.buy { display: grid; gap: var(--s-2); }
.buy__formats { border: 0; margin: 0; padding: 0; display: grid; gap: 0.45rem; min-width: 0; }
.buy__legend { padding: 0; margin-bottom: 0.35rem; font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.buy__format {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: 'radio size price' 'radio inches price';
  align-items: center; gap: 0 0.8rem; min-height: 52px; padding: 0.55rem 0.9rem;
  border: 1px solid var(--rule); border-radius: var(--radius); background: #fff; cursor: pointer;
}
.buy__format:hover { border-color: var(--ink-2); }
.buy__format:has(:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.buy__format:has(:focus-visible) { outline: 2px solid var(--bordeaux); outline-offset: 2px; }
.buy__radio { grid-area: radio; margin: 0; width: 1.05rem; height: 1.05rem; accent-color: var(--bordeaux); }
.buy__radio:focus-visible { outline: none; }
.buy__size { grid-area: size; font-family: var(--f-admin); font-weight: 500; font-size: 0.95rem; }
.buy__inches { grid-area: inches; font-family: var(--f-admin); font-size: 0.76rem; color: var(--ink-2); }
.buy__price { grid-area: price; font-family: var(--f-admin); font-weight: 500; font-size: 1rem; }
.buy__add { width: 100%; }
.buy__status { font-size: 0.92rem; line-height: 1.45; }
.buy__status:empty { display: none; }
.buy__view {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; cursor: pointer;
  font: inherit; color: var(--bordeaux); text-decoration: underline; text-underline-offset: 0.2em;
}
.buy__view:hover { color: var(--bordeaux-2); }
.buy__nojs { font-size: 0.92rem; line-height: 1.45; color: var(--ink-2); }
html.js .buy__nojs, html:not(.js) .buy { display: none; }
@media (min-width: 960px) { .buy__add { width: auto; justify-self: start; } }

/* ---------- Caisse intégrée : le panier (src/client/cart.js) ---------- */

/* Bouton flottant, visible dès qu'un tirage est dans le panier. */
.cart-button {
  position: fixed; z-index: 40; right: calc(var(--s-3) + env(safe-area-inset-right, 0px)); bottom: calc(var(--s-3) + env(safe-area-inset-bottom, 0px));
  display: inline-flex; align-items: center; gap: 0.7rem; min-height: 52px; padding: 0.55rem 1.1rem;
  border: 0; border-radius: var(--radius); background: var(--ink); color: var(--paper); cursor: pointer;
  font-family: var(--f-sign); font-stretch: 85%; font-weight: 700; font-size: 0.86rem; letter-spacing: 0.1em; text-transform: uppercase;
  box-shadow: 0 14px 28px -16px rgba(0, 0, 0, 0.7);
  transition: background-color 0.2s;
}
.cart-button:hover { background: var(--bordeaux); }
.cart-button:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 3px; }
.cart-button__count, .cart-button__total { font-family: var(--f-admin); font-weight: 500; font-size: 0.82rem; letter-spacing: 0; text-transform: none; }
.cart-button__total { padding-left: 0.7rem; border-left: 1px solid rgba(247, 245, 239, 0.35); }
/* Le bouton ne cache pas la fin du pied de page. */
.page-shop:has(.cart-button:not([hidden])) .site-footer { padding-bottom: calc(52px + 2 * var(--s-3) + env(safe-area-inset-bottom, 0px)); }

/* La fenêtre : un volet à droite ; plein écran sur téléphone. */
.cart {
  padding: 0; border: 0; margin: 0 0 0 auto; overflow: hidden;
  width: min(460px, 100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh;
  background: var(--paper); color: var(--ink);
}
.cart[open] { display: flex; flex-direction: column; animation: cart-in 0.24s var(--ease-out); }
.cart::backdrop { background: rgba(18, 17, 16, 0.6); }
@keyframes cart-in { from { opacity: 0; transform: translateX(16px); } }
:root:has(.cart[open]) { overflow: hidden; scrollbar-gutter: stable; }
@media (prefers-reduced-motion: reduce) { .cart[open] { animation: none; } }

.cart__bar {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: var(--s-2);
  padding: calc(0.4rem + env(safe-area-inset-top, 0px)) var(--s-2) 0.4rem var(--s-4); border-bottom: 1px solid var(--rule);
}
.cart__title { font-family: var(--f-inscription); font-style: italic; font-weight: 500; font-size: var(--step-2); line-height: 1.1; }
.cart__close {
  min-width: 44px; min-height: 44px; padding: 0 0.9rem; display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--ink); border: 1px solid var(--ink); border-radius: var(--radius); cursor: pointer;
  font-family: var(--f-sign); font-stretch: 85%; font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em;
}
.cart__close:hover { background: var(--ink); color: var(--paper); }
.cart__empty { padding: var(--s-5) var(--s-4); font-family: var(--f-inscription); font-style: italic; font-size: var(--step-1); color: var(--ink-2); }
.cart__lines { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; list-style: none; margin: 0; padding: 0 var(--s-4); }
.cart__checkout {
  flex: none; display: grid; gap: var(--s-2);
  padding: var(--s-3) var(--s-4) calc(var(--s-4) + env(safe-area-inset-bottom, 0px)); border-top: 1.5px solid var(--ink);
}
.cart__limit, .cart__delay, .cart__fine { font-family: var(--f-admin); font-size: 0.76rem; line-height: 1.5; color: var(--ink-2); }
.cart__delay:empty { display: none; }
.cart__country { display: grid; gap: 0.3rem; }
.cart__country-label { font-family: var(--f-sign); font-stretch: 80%; font-weight: 700; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--ink-2); }
.cart__select { min-height: 44px; padding: 0.45rem 0.7rem; border: 1px solid var(--ink); border-radius: var(--radius); background: #fff; color: var(--ink); font: inherit; font-size: 1rem; }
.cart__select:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 2px; }
.cart__sums { margin: 0; display: grid; gap: 0.2rem; font-family: var(--f-admin); font-size: 0.9rem; }
.cart__sum { display: flex; justify-content: space-between; gap: var(--s-2); }
.cart__sum dd { margin: 0; text-align: right; }
.cart__sum--total { margin-top: 0.25rem; padding-top: 0.45rem; border-top: 1px solid var(--rule); font-weight: 500; font-size: 1.05rem; }
/* Acceptation des conditions générales de vente, avant le paiement. */
.cart__terms { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 0.6rem; font-size: 0.86rem; line-height: 1.45; cursor: pointer; }
.cart__check { width: 1.1rem; height: 1.1rem; margin: 0.1rem 0 0; accent-color: var(--bordeaux); }
.cart__terms a { color: inherit; }
.cart__pay { width: 100%; }
.cart__pay:disabled { opacity: 0.7; cursor: progress; }
.cart__error { font-size: 0.9rem; line-height: 1.45; color: var(--stamp); }
.cart__error:empty { display: none; }

.cart-line {
  display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: 'img text price' 'img qty remove';
  align-items: center; gap: 0.35rem var(--s-2); padding: var(--s-3) 0; border-bottom: 1px solid var(--rule);
}
.cart-line__img { grid-area: img; align-self: start; justify-self: center; width: auto; max-width: 64px; height: auto; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.28); }
.cart-line__text { grid-area: text; min-width: 0; }
.cart-line__title { font-family: var(--f-inscription); font-style: italic; font-size: 1.05rem; line-height: 1.2; }
.cart-line__size { margin-top: 0.15rem; font-family: var(--f-admin); font-size: 0.76rem; color: var(--ink-2); }
.cart-line__price { grid-area: price; align-self: start; font-family: var(--f-admin); font-weight: 500; text-align: right; white-space: nowrap; }
.cart-line__qty { grid-area: qty; display: inline-flex; align-items: center; gap: 0.25rem; }
.cart-line__step {
  width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--ink); border-radius: var(--radius); background: transparent; color: var(--ink); cursor: pointer; font-size: 1.1rem;
}
.cart-line__step:hover:not(:disabled) { background: var(--ink); color: var(--paper); }
.cart-line__step:disabled { opacity: 0.35; cursor: default; }
.cart-line__count { min-width: 2.2ch; text-align: center; font-family: var(--f-admin); font-weight: 500; }
.cart-line__remove {
  grid-area: remove; justify-self: end; min-height: 40px; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--f-admin); font-size: 0.8rem; color: var(--ink-2); text-decoration: underline; text-underline-offset: 0.2em;
}
.cart-line__remove:hover { color: var(--ink); }