/* ================================================================
   GATARD Product Pro 4.6.30 — médias transparents + UX pro
   Scope strict : boutique GATARD / modale quick view.
   Aucun sélecteur header/footer.
   ================================================================ */

html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro{
  --gpp30-primary:var(--gpp29-primary,#d8a748);
  --gpp30-secondary:var(--gpp29-secondary,#b88329);
  --gpp30-gradient:linear-gradient(135deg,var(--gpp30-primary),var(--gpp30-secondary));
  --gpp30-ink:#30271d;
  --gpp30-copy:#6c5d4c;
  --gpp30-cream:#fffaf2;
  --gpp30-paper:#fffdf9;
  --gpp30-line:rgba(184,131,41,.18);
  --gpp30-line-strong:rgba(184,131,41,.34);
}

/* Médias : transparents au repos, aucune boîte lourde autour de la photo. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-media-transparent .gpp-online-img{
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-media-transparent .gpp-online-img img{
  position:relative;
  z-index:2;
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
  transform:translateZ(0);
  transition:transform .24s ease,filter .24s ease,opacity .18s ease;
}
/* Pour les JPG à fond blanc : effet visuel uniquement, les sources ne sont pas modifiées. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-media-blend .gpp-online-img img{
  mix-blend-mode:multiply;
}

/* Frame premium uniquement sur vrais périphériques hover desktop. */
@media (min-width:992px) and (hover:hover) and (pointer:fine){
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame .gpp-online-img::before{
    content:"";
    position:absolute;
    z-index:1;
    inset:3px;
    border:1px solid var(--gpp30-line-strong);
    border-radius:17px;
    background:linear-gradient(145deg,rgba(255,253,249,.76),rgba(216,167,72,.08));
    box-shadow:0 16px 36px rgba(126,85,24,.12),inset 0 0 0 1px rgba(255,255,255,.55);
    opacity:0;
    transform:scale(.965);
    pointer-events:none;
    transition:opacity .22s ease,transform .22s ease,box-shadow .22s ease;
  }
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame article.gpp-online-card:hover .gpp-online-img::before,
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame article.gpp-online-card:focus-within .gpp-online-img::before{
    opacity:1;
    transform:scale(1);
    box-shadow:0 19px 42px rgba(126,85,24,.15),inset 0 0 0 1px rgba(255,255,255,.68);
  }
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame article.gpp-online-card:hover .gpp-online-img img,
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame article.gpp-online-card:focus-within .gpp-online-img img{
    transform:scale(1.035) translateY(-2px);
  }
}

/* Carte : alignements plus stables, actions séparées du contenu. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro article.gpp-online-card{
  overflow:visible!important;
  min-width:0!important;
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro article.gpp-online-card .gpp-online-card-content{
  min-width:0!important;
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro article.gpp-online-card .gpp-online-card-content h3,
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro article.gpp-online-card .gpp-online-card-content p{
  overflow-wrap:anywhere;
}

/* Aperçu rapide : discret, visible au hover desktop et toujours accessible au clavier/tactile. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-quick{
  position:absolute;
  z-index:6;
  left:12px;
  top:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:36px;
  padding:7px 10px;
  border:1px solid rgba(184,131,41,.20);
  border-radius:999px;
  background:rgba(255,253,249,.94);
  box-shadow:0 8px 20px rgba(91,62,18,.10);
  color:#7e5925;
  font:inherit;
  font-size:10.5px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  transition:transform .18s ease,opacity .18s ease,background .18s ease,border-color .18s ease;
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-quick svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-quick:hover{transform:translateY(-1px);background:#fff6df;border-color:rgba(184,131,41,.36)}
@media (min-width:992px) and (hover:hover) and (pointer:fine){
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-quick{opacity:0;transform:translateY(-4px);pointer-events:none}
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root article.gpp-online-card:hover .gpp-v4630-quick,
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root article.gpp-online-card:focus-within .gpp-v4630-quick{opacity:1;transform:none;pointer-events:auto}
}

/* Navigation catégorie sticky : ne touche pas au header, top calculé en JS. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-online-tabs.gpp-v4630-sticky{
  position:sticky!important;
  top:var(--gpp4630-sticky-top,10px)!important;
  z-index:45!important;
  margin-bottom:16px!important;
  padding:7px!important;
  border:1px solid rgba(184,131,41,.14)!important;
  border-radius:18px!important;
  background:rgba(255,250,242,.93)!important;
  box-shadow:0 10px 28px rgba(95,66,20,.09)!important;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-online-tabs.gpp-v4630-sticky a{scroll-margin-top:calc(var(--gpp4630-sticky-top,10px) + 76px)}

/* Suggestions de recherche. */
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-search-host{position:relative!important;z-index:55}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest{
  position:absolute;
  z-index:80;
  left:0;
  right:0;
  top:calc(100% + 7px);
  display:grid;
  gap:4px;
  padding:7px;
  border:1px solid rgba(184,131,41,.18);
  border-radius:15px;
  background:#fffdf9;
  box-shadow:0 18px 42px rgba(75,52,18,.15);
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest[hidden]{display:none!important}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest button{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 10px;
  width:100%;
  padding:10px 11px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#493927;
  text-align:left;
  cursor:pointer;
}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest button:hover,
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest button:focus-visible{background:#fff5dc;outline:none}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest small{grid-column:1;color:#90744d;font-size:10.5px}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest em{grid-row:1/3;grid-column:2;align-self:center;color:#9b6d27;font-size:11.5px;font-style:normal;font-weight:800}
html body#cms.cms-id-7.gpp-online-mode #gpp-online-root article.gpp-online-card.gpp-v4630-pulse{animation:gpp4630Pulse .7s ease}
@keyframes gpp4630Pulse{0%,100%{box-shadow:0 8px 26px rgba(111,61,25,.055)}50%{box-shadow:0 0 0 4px rgba(216,167,72,.22),0 14px 34px rgba(111,61,25,.12)}}

/* Quick view. */
body.gpp-v4630-modal-open{overflow:hidden!important}
.gpp-v4630-modal{
  position:fixed;
  inset:0;
  z-index:2147481800;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:15px;
  box-sizing:border-box;
  background:rgba(29,23,16,.52);
  -webkit-backdrop-filter:blur(7px);
  backdrop-filter:blur(7px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease,visibility .2s ease;
}
.gpp-v4630-modal.is-open{opacity:1;visibility:visible;pointer-events:auto}
.gpp-v4630-modal__dialog{
  position:relative;
  display:grid;
  grid-template-columns:minmax(230px,.9fr) minmax(0,1.1fr);
  gap:24px;
  width:min(860px,100%);
  max-height:calc(100dvh - 30px);
  overflow:auto;
  padding:22px;
  border:1px solid rgba(184,131,41,.25);
  border-radius:24px;
  background:linear-gradient(145deg,#fffdf9,#fff8e9);
  box-shadow:0 30px 90px rgba(48,34,13,.25);
  color:#30271d;
  transform:translateY(10px) scale(.985);
  transition:transform .2s ease;
}
.gpp-v4630-modal.is-open .gpp-v4630-modal__dialog{transform:none}
.gpp-v4630-modal__media{display:grid;place-items:center;min-height:290px;border-radius:19px;background:rgba(255,255,255,.45);overflow:hidden}
.gpp-v4630-modal__media img{display:block;width:100%;height:100%;max-height:390px;object-fit:contain;background:transparent}
.gpp-v4630-modal.gpp-v4630-modal--blend .gpp-v4630-modal__media img{mix-blend-mode:multiply}
.gpp-v4630-modal__body{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:10px 6px 6px 0}
.gpp-v4630-modal__badge{display:inline-flex;align-items:center;min-height:27px;padding:5px 10px;border:1px solid rgba(184,131,41,.17);border-radius:999px;background:#fff1d3;color:#8a6024;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.gpp-v4630-modal__body h2{margin:12px 0 8px;color:#30271d;font-size:clamp(24px,3.4vw,34px);line-height:1.12;letter-spacing:-.025em}
.gpp-v4630-modal__desc{margin:0;color:#6d5e4c;font-size:14px;line-height:1.65}
.gpp-v4630-modal__price{margin:16px 0 0;color:#8f641f;font-size:22px;font-weight:900}
.gpp-v4630-modal__note{margin:14px 0 0;padding:11px 12px;border:1px solid rgba(184,131,41,.14);border-radius:12px;background:#fffaf0;color:#806d53;font-size:11.5px;line-height:1.45}
.gpp-v4630-modal__actions{display:flex;flex-wrap:wrap;gap:9px;width:100%;margin-top:auto;padding-top:20px}
.gpp-v4630-modal__actions a,.gpp-v4630-modal__actions button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 17px;border-radius:999px;font:inherit;font-size:12.5px;font-weight:850;text-decoration:none!important;cursor:pointer}
.gpp-v4630-modal__primary{border:0!important;background:linear-gradient(135deg,var(--gpp29-primary,#d8a748),var(--gpp29-secondary,#b88329))!important;color:#fff!important;box-shadow:0 9px 22px rgba(184,131,41,.22)}
.gpp-v4630-modal__secondary{border:1px solid rgba(184,131,41,.18)!important;background:#fffdf9!important;color:#725324!important}
.gpp-v4630-modal__close{position:absolute;z-index:3;top:12px;right:12px;width:39px;height:39px;padding:0;border:1px solid rgba(184,131,41,.18);border-radius:50%;background:rgba(255,253,249,.95);color:#805c28;font-size:25px;line-height:1;cursor:pointer}
.gpp-v4630-modal button:focus-visible,.gpp-v4630-modal a:focus-visible{outline:2px solid var(--gpp29-primary,#d8a748);outline-offset:3px}

/* Cohérence responsive : 15px de respiration, aucune frame hover sur tactile. */
@media (max-width:991px){
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-quick{top:10px;left:10px;min-height:34px;padding:6px 9px;font-size:10px}
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-online-tabs.gpp-v4630-sticky{top:var(--gpp4630-sticky-top,8px)!important;border-radius:15px!important;padding:6px!important}
  .gpp-v4630-modal__dialog{grid-template-columns:1fr;width:min(620px,100%);gap:14px;padding:18px}
  .gpp-v4630-modal__media{min-height:210px;max-height:38dvh}
  .gpp-v4630-modal__body{padding:0 2px 2px}
}
@media (max-width:640px){
  .gpp-v4630-modal{align-items:center;padding:15px}
  .gpp-v4630-modal__dialog{max-height:calc(100dvh - 30px);border-radius:20px;padding:15px}
  .gpp-v4630-modal__media{min-height:170px;max-height:32dvh;border-radius:16px}
  .gpp-v4630-modal__body h2{font-size:24px}
  .gpp-v4630-modal__actions{display:grid;grid-template-columns:1fr;padding-top:16px}
  .gpp-v4630-modal__actions a,.gpp-v4630-modal__actions button{width:100%;box-sizing:border-box}
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root .gpp-v4630-suggest{left:-1px;right:-1px}
}
@media (prefers-reduced-motion:reduce){
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-pro .gpp-online-img img,
  html body#cms.cms-id-7.gpp-online-mode #gpp-online-root.gpp-v4630-hover-frame .gpp-online-img::before,
  .gpp-v4630-modal,.gpp-v4630-modal__dialog,.gpp-v4630-quick{transition:none!important;animation:none!important}
}