.fp__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.fp__gallery--sticky { position: sticky; top: 6.5rem; }
.fp__stage { position: relative; aspect-ratio: 1; border-radius: calc(var(--radius) + 6px); overflow: hidden; background: var(--color-surface); border: 1px solid var(--color-border); }
.fp__slide { position: absolute; inset: 0; margin: 0; animation: fp-fade .35s ease; }
.fp__slide img { width: 100%; height: 100%; }
.fp__stage--contain .fp__slide img { object-fit: contain; }
.fp__stage--cover .fp__slide img { object-fit: cover; }
@keyframes fp-fade { from { opacity: 0; } }
.fp__thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: .6rem; margin-top: .8rem; }
.fp__thumb { aspect-ratio: 1; padding: 0; border-radius: calc(var(--radius) * .6); overflow: hidden; border: 2px solid transparent; background: var(--color-surface); }
.fp__thumb img { width: 100%; height: 100%; object-fit: cover; }
.fp__thumb[aria-current="true"] { border-color: var(--color-controls-active); }

.fp__info { display: grid; gap: 1.1rem; }
.fp__title { margin: 0; font-size: var(--h-size, 40px); }
.fp__desc { margin-top: .6rem; }
.fp__features { display: grid; gap: .45rem; margin: .8rem 0 0; padding: 0; list-style: none; }
.fp__features li { display: flex; gap: .55rem; align-items: flex-start; font-weight: 600; }
.fp__features .icon { color: var(--color-icon); margin-top: .15rem; }
.fp__price-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; padding-block: .9rem; border-block: 1px solid var(--color-border); }
.fp__price { font-size: 1.6rem; }
.fp__stock { margin: 0; font-weight: 700; display: inline-flex; align-items: center; gap: .4rem; }
.fp__stock::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: #1f9d55; }
.fp__stock.is-out::before { background: #b42318; }
.fp__legend { display: block; margin: 0 0 .6rem; padding: 0; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; font-size: .82rem; color: var(--color-heading); }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

/* image selectors */
.fp__selector-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .75rem; }
.fp-select { position: relative; display: grid; border-radius: var(--radius); overflow: hidden; border: 2px solid var(--color-border); background: var(--color-surface); cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease; }
.fp-select__media { display: block; aspect-ratio: 4 / 3; background: color-mix(in srgb, var(--color-accent) 18%, var(--color-surface)); }
.fp-select__media img { width: 100%; height: 100%; object-fit: contain; padding: 6%; }
.fp-select__label { padding: .6rem .7rem; text-align: center; font-weight: 700; font-size: .92rem; }
.fp-select__badge { position: absolute; top: .45rem; left: .45rem; }
.fp-select:has(input:checked) { border-color: var(--color-controls-active); box-shadow: 0 0 0 2px var(--color-controls-active) inset; }
.fp-select:has(input:checked) .fp-select__label { background: var(--color-controls-active); color: var(--color-surface); }
.fp-select:has(input:focus-visible) { outline: 2px solid var(--color-heading); outline-offset: 3px; }

/* packs */
.fp__pack-list { display: grid; gap: .6rem; }
.fp-pack {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .85rem;
  padding: .85rem 1rem; border-radius: var(--radius); border: 2px solid var(--color-border); background: var(--color-surface);
  cursor: pointer; transition: border-color .2s ease, background-color .2s ease;
}
.fp-pack input { width: 1.15rem; height: 1.15rem; accent-color: var(--color-controls-active); margin: 0; }
.fp-pack:has(input:checked) { border-color: var(--color-controls-active); background: color-mix(in srgb, var(--color-accent) 14%, var(--color-surface)); }
.fp-pack.is-unavailable { opacity: .55; cursor: not-allowed; }
.fp-pack__body { display: grid; gap: .15rem; }
.fp-pack__title { font-weight: 800; color: var(--color-heading); display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.fp-pack__sub { font-size: .82rem; }
.fp-pack__price { display: grid; justify-items: end; gap: .1rem; }
.fp-pack__save { font-size: .75rem; font-weight: 800; color: var(--color-heading); background: var(--color-accent); padding: .1rem .45rem; border-radius: 99px; }

/* progress line */
.fp-progress { position: relative; margin: .25rem 0 1rem; padding-top: .35rem; }
.fp-progress__bar { position: absolute; left: calc(100% / var(--n, 4) / 2); right: calc(100% / var(--n, 4) / 2); top: .75rem; height: 4px; border-radius: 4px; background: var(--color-border); overflow: hidden; }
.fp-progress__bar span { display: block; height: 100%; width: 0; background: var(--color-controls-active); transition: width .45s cubic-bezier(.2, .8, .2, 1); }
.fp-progress__nodes { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; margin: 0; padding: 0; list-style: none; }
.fp-progress__nodes li { display: grid; justify-items: center; gap: .3rem; text-align: center; font-size: .74rem; font-weight: 700; color: color-mix(in srgb, var(--color-text) 70%, transparent); }
.fp-progress__dot { width: .9rem; height: .9rem; border-radius: 50%; background: var(--color-surface); border: 3px solid var(--color-border); transition: border-color .3s ease, background-color .3s ease, transform .3s ease; }
.fp-progress__nodes li.is-reached .fp-progress__dot { border-color: var(--color-controls-active); background: var(--color-controls-active); }
.fp-progress__nodes li.is-current .fp-progress__dot { transform: scale(1.25); background: var(--color-accent); }
.fp-progress__nodes li.is-reached { color: var(--color-heading); }
.fp-progress__label { line-height: 1.2; }
.fp-progress__save { font-size: .72rem; font-weight: 800; }
.fp-progress__badge { font-size: .6rem; padding: .15rem .45rem; }
.fp__tier-msg { margin: 0; font-weight: 700; font-size: .92rem; }

/* purchase */
.fp__form { display: grid; gap: .9rem; }
.fp__qty-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.fp__qty-row .fp__legend { margin: 0; }
.fp__incart { font-size: .85rem; font-weight: 600; }
.fp__upsell { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border-radius: var(--radius); border: 1.5px dashed var(--color-border); background: var(--color-surface); cursor: pointer; }
.fp__upsell img { width: 48px; height: 48px; object-fit: contain; border-radius: 8px; }
.fp__upsell input { width: 1.1rem; height: 1.1rem; accent-color: var(--color-controls-active); }
.fp__buttons { display: grid; gap: .6rem; }
.fp__add { min-height: 3.6rem; font-size: 1.08rem; }
.fp__cod { min-height: 3.3rem; }
.fp__note { margin: 0; font-size: .85rem; text-align: center; }
.fp__wa { display: inline-flex; justify-content: center; align-items: center; gap: .5rem; min-height: 2.75rem; font-weight: 700; color: var(--color-heading); text-decoration: none; }
.fp__wa:hover { text-decoration: underline; }

/* rows */
.fp__rows { border-top: 1px solid var(--color-border); }
.fp-row { border-bottom: 1px solid var(--color-border); }
.fp-row__summary { display: flex; align-items: center; gap: .7rem; min-height: 3.4rem; cursor: pointer; list-style: none; font-weight: 800; color: var(--color-heading); text-transform: uppercase; letter-spacing: .05em; font-size: .86rem; }
.fp-row__summary::-webkit-details-marker { display: none; }
.fp-row__summary .icon { color: var(--color-icon); }
.fp-row__toggle { margin-left: auto; transition: transform .25s ease; }
.fp-row[open] .fp-row__toggle { transform: rotate(45deg); }
.fp-row__content { padding: 0 0 1.1rem; font-size: .95rem; }

.fp__cross-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .9rem; margin: 0; padding: 0; list-style: none; }
.fp__cross-list .pcard__title { font-size: .95rem; }

@media (max-width: 989px) {
  .fp__grid { grid-template-columns: minmax(0, 1fr); }
  .fp__gallery--sticky { position: static; }
  .fp__title { font-size: var(--h-size-m, 28px); }
}
@media (prefers-reduced-motion: reduce) { .fp__slide { animation: none; } .fp-progress__bar span, .fp-progress__dot { transition: none; } }

/* selected product card: clear "Sélectionné" mark */
.fp__selector-grid { padding-top: 18px; }
.fp-select { overflow: visible; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, opacity .2s ease; }
.fp-select__media { overflow: hidden; border-radius: calc(var(--radius) - 2px) calc(var(--radius) - 2px) 0 0; }
.fp-select__label { border-radius: 0 0 calc(var(--radius) - 2px) calc(var(--radius) - 2px); }
.fp-select::before { content: "\2713  S\00E9lectionn\00E9"; position: absolute; top: -17px; left: 50%; z-index: 3; transform: translateX(-50%) scale(.6); opacity: 0; white-space: nowrap; padding: .28rem .8rem; border-radius: 999px; font-size: .74rem; font-weight: 800; letter-spacing: .02em; line-height: 1.2; background: var(--color-controls-active); color: var(--color-surface); box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .45); transition: transform .25s cubic-bezier(.2, .9, .3, 1.4), opacity .2s ease; pointer-events: none; }
.fp-select:has(input:checked) { transform: translateY(-3px); box-shadow: 0 0 0 2px var(--color-controls-active) inset, 0 12px 24px -14px var(--color-controls-active); }
.fp-select:has(input:checked)::before { opacity: 1; transform: translateX(-50%) scale(1); }
.fp__selector-grid:has(input:checked) .fp-select:not(:has(input:checked)) { opacity: .72; }
.fp__selector-grid:has(input:checked) .fp-select:not(:has(input:checked)):hover { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .fp-select, .fp-select::before { transition: none; } .fp-select:has(input:checked) { transform: none; } }

/* ---- Lignes dépliables « cartes » + tableau (pages produit) ---- */
.fp-row--card { border: 1.5px solid #e4e2fb; border-radius: 18px; background: #fff; margin: 0 0 10px; padding: 0 14px; transition: border-color .25s ease, box-shadow .25s ease; }
.fp-row--card:hover { border-color: #c9c4f5; }
.fp-row--card[open] { border-color: #1a0cb0; box-shadow: 0 16px 32px -24px rgba(26, 12, 176, .6); }
.fp-row--card .fp-row__summary { text-transform: none; letter-spacing: 0; font-size: 1rem; min-height: 3.7rem; color: #1a0cb0; gap: .8rem; }
.fp-row--card .fp-row__toggle { width: 26px; height: 26px; padding: 6px; border-radius: 50%; background: #e4e2fb; color: #1a0cb0; flex: 0 0 26px; }
.fp-row--card[open] .fp-row__toggle { background: #1a0cb0; color: #fff; }
.fp-row__ic { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; background: #fff3b8; color: #1a0cb0; display: grid; place-items: center; }
.fp-row__ic svg, .fp-row__ic .icon { width: 20px; height: 20px; color: #1a0cb0; }
.fp-row--card .fp-row__content { padding: 0 2px 1.1rem; color: #3a3a48; line-height: 1.6; }
.fp-tbl-wrap { overflow-x: auto; margin: .1rem 0 .7rem; border-radius: 14px; border: 1px solid #e4e2fb; background: #fff; }
.fp-tbl { width: 100%; min-width: 290px; border-collapse: collapse; font-size: .9rem; margin: 0; }
.fp-tbl th { background: #1a0cb0; color: #fff; font-weight: 800; text-align: left; padding: .65rem .7rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; border: 0; }
.fp-tbl td { padding: .7rem; border: 0; border-top: 1px solid #efedf9; color: #1d1d1f; vertical-align: middle; }
.fp-tbl td small { display: block; color: #6b6b80; font-weight: 500; font-size: .76rem; margin-top: 2px; }
.fp-tbl tr.is-best td { background: #fff8d6; font-weight: 800; }
.fp-tbl .fp-tbl__per { color: #1a0cb0; font-weight: 900; white-space: nowrap; }
.fp-tbl .fp-tbl__free { color: #2d9156; font-weight: 800; }
.fp-tbl__best { display: inline-block; background: #ffd600; color: #1a0cb0; font-size: .62rem; font-weight: 900; padding: 2px 7px; border-radius: 99px; margin-left: 5px; vertical-align: middle; text-transform: uppercase; letter-spacing: .04em; }
.fp-tbl-note { font-size: .86rem; color: #4a4a5a; margin: .2rem 0 .6rem; }
@media (max-width: 420px) { .fp-tbl { font-size: .82rem; } .fp-tbl th, .fp-tbl td { padding: .55rem .45rem; } }
