/* Pages de vente */
.fil { margin-bottom: 1.25rem; color: var(--sc-ink-soft); }
.fil a { color: inherit; }
.produit__grille { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }

.galerie { position: sticky; top: calc(var(--header-h) + 1rem); display: grid; gap: 0.75rem; }
.galerie__principale { margin: 0; background: #fff; border: var(--trait); border-radius: 26px; overflow: hidden; aspect-ratio: 1; box-shadow: 6px 6px 0 var(--sc-ink); }
.galerie__principale img { width: 100%; height: 100%; object-fit: contain; }
.galerie__vignettes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(4.4rem, 1fr)); gap: 0.5rem; }
.vignette { padding: 0; border: 2px solid var(--line-strong); border-radius: 12px; background: #fff; cursor: pointer; overflow: hidden; display: block; width: 100%; aspect-ratio: 1; }
.vignette img { width: 100%; height: 100%; object-fit: cover; }
.vignette[aria-current="true"] { border-color: var(--sc-ink); }

.achat { display: grid; gap: 1rem; }
.achat h1 { font-size: clamp(2.4rem, 1.7rem + 2.4vw, 3.8rem); }
.achat__sous { color: var(--sc-ink-soft); font-size: 1.08rem; max-width: 40ch; }
.achat__prix { font-family: var(--sc-font-display); font-weight: 700; font-size: 2.3rem; line-height: 1; justify-self: start; background: var(--sc-accent); border: var(--trait); border-radius: 16px; padding: 0.25rem 0.8rem; box-shadow: 3px 3px 0 var(--sc-ink); }
.achat__form { display: grid; gap: 1.15rem; }
.choix { border: 0; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.choix legend { font-weight: 700; padding: 0; margin-bottom: 0.55rem; }
.choix__valeur { font-weight: 400; color: var(--sc-ink-soft); }
.choix__liste { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.puce { position: relative; display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; padding: 0.5rem 0.95rem; border-radius: 999px; background: var(--paper); box-shadow: inset 0 0 0 2px var(--line-strong); cursor: pointer; font-weight: 700; font-size: 0.95rem; }
.puce input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.puce:has(input:checked) { box-shadow: inset 0 0 0 2.5px var(--sc-ink), 3px 3px 0 var(--sc-ink); background: #fff3c4; }
.puce:has(input:focus-visible) { outline: 3px solid var(--sc-accent); outline-offset: 2px; }
.puce[data-indispo] { color: #9a8c7c; background: #f3ece0; text-decoration: line-through; text-decoration-thickness: 1.5px; }
.puce[data-indispo] .swatch { opacity: 0.45; }
.puce .swatch { width: 1rem; height: 1rem; }
.achat__dispo { font-weight: 600; min-height: 1.5em; }
.achat__dispo[data-etat="off"] { color: #9b2c2c; }
.quantite { display: flex; align-items: center; gap: 1rem; }
.quantite label { font-weight: 700; }
.quantite__ctrl { display: inline-flex; align-items: center; background: var(--paper); border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.quantite__ctrl button { width: 2.75rem; height: 2.75rem; border: 0; background: none; font-size: 1.3rem; cursor: pointer; color: var(--sc-ink); border-radius: 999px; }
.quantite__ctrl input { width: 3rem; text-align: center; border: 0; background: none; font: inherit; font-weight: 700; -moz-appearance: textfield; }
.quantite__ctrl input::-webkit-inner-spin-button { -webkit-appearance: none; }
.achat__btn { width: 100%; }
.achat__erreur { color: #9b2c2c; font-weight: 600; min-height: 1.2em; }
.rassure { list-style: none; margin: 0.5rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--line); display: grid; gap: 0.45rem; }

.bloc { margin-top: clamp(3rem, 7vw, 5.5rem); }
.bloc > h2 { font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem); margin-bottom: 1.1rem; }
.points { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.4rem; max-width: 62ch; }

.tailles { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; }
.guide { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--paper); border: var(--trait); border-radius: 18px; overflow: hidden; font-variant-numeric: tabular-nums; margin-bottom: 0.6rem; }
.guide th, .guide td { padding: 0.7rem 0.9rem; text-align: left; border-bottom: 1px solid var(--line); }
.guide thead th { background: var(--ciel); font-size: 0.88rem; }
.comment h3 { font-family: var(--sc-font-text); font-weight: 700; font-size: 1.15rem; letter-spacing: 0; margin-bottom: 0.6rem; }
.comment ol { padding-left: 1.2rem; margin: 0 0 1rem; display: grid; gap: 0.4rem; }

.avis-resume { font-size: 1.15rem; margin-bottom: 0.4rem; }
.avis-liste { list-style: none; margin: 1.5rem 0 0; padding: 0; columns: 2 22rem; column-gap: 1.25rem; }
.avis-item { break-inside: avoid; background: var(--paper); border: var(--trait); border-radius: 20px; padding: 1.1rem 1.2rem; margin-bottom: 1.25rem; box-shadow: var(--label-shadow); display: grid; gap: 0.5rem; }
.avis-item__note { color: #e0a100; letter-spacing: 0.08em; }
.avis-item blockquote { margin: 0; }
.avis-item__original summary { cursor: pointer; font-size: 0.85rem; color: var(--sc-ink-soft); }
.avis-item__original p { font-size: 0.92rem; color: var(--sc-ink-soft); margin-top: 0.4rem; }
.avis-item__photos { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.avis-item__photos img { width: 5.5rem; height: 5.5rem; object-fit: cover; border-radius: 6px; }

.faq__item { background: var(--paper); border: var(--trait); border-radius: 16px; margin-bottom: 0.7rem; max-width: 52rem; }
.faq__item summary { cursor: pointer; padding: 1rem 1.2rem; font-weight: 700; list-style-position: inside; }
.faq__item p { padding: 0 1.2rem 1.1rem; max-width: 64ch; }

@media (max-width: 900px) {
  .produit__grille, .tailles { grid-template-columns: 1fr; }
  .galerie { position: static; }
}