/* ═══════════════════════════════════════════════════════════════════════
   PoupeCosmetic - cartes premium
   Verre epais, halo qui suit le curseur, reflet de bord, aucune image rognee.
   Charge apres poupe.css : ces regles gagnent la cascade.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── socle commun ─────────────────────────────────────────────────── */
.pr,.gam{
  position:relative;isolation:isolate;
  background:
    linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.44));
  border:1px solid rgba(255,255,255,.9);
  /* -webkit-backdrop-filter:blur(26px) saturate(1.5);
  backdrop-filter:blur(26px) saturate(1.5); */
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 18px 44px rgba(96,52,32,.13),
    0 2px 8px rgba(96,52,32,.06);
}

/* halo doux qui suit le curseur, comme sur les cartes de la reference */
.pr::before,.gam::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:0;
  background:radial-gradient(
    380px circle at var(--mx,50%) var(--my,50%),
    rgba(255,196,63,.20),
    rgba(233,30,30,.10) 42%,
    transparent 68%
  );
  opacity:0;transition:opacity .45s ease;pointer-events:none;
}
.pr:hover::before,.gam:hover::before{opacity:1}

/* liseré lumineux sur le bord superieur */
.pr::after,.gam::after{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.35),transparent 34%);
}
.pr>*,.gam>*{position:relative;z-index:1}

.pr:hover,.gam:hover{
  box-shadow:
    0 1px 0 rgba(255,255,255,.95) inset,
    0 34px 70px rgba(233,30,30,.20),
    0 6px 18px rgba(96,52,32,.10);
}

/* ─── vignette produit : jamais rognee ─────────────────────────────── */
.pr__im{
  background:
    radial-gradient(120% 90% at 50% 0%,#fff,var(--cream) 72%);
  border:1px solid rgba(31,21,18,.05);
  aspect-ratio:1;
  display:grid;place-items:center;
  overflow:hidden;
}
.pr__im img{
  width:100%;height:100%;
  /* contain : le produit tient toujours entier dans le cadre */
  object-fit:contain;
  padding:12px;
  filter:drop-shadow(0 12px 22px rgba(96,52,32,.18));
  transition:transform .6s var(--ease),filter .6s ease;
}
.pr:hover .pr__im img{
  transform:translateY(-6px) scale(1.05);
  filter:drop-shadow(0 20px 32px rgba(96,52,32,.26));
}

/* reflet qui balaie la vignette au survol */
.pr__im::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(72deg,transparent 38%,rgba(255,255,255,.55) 50%,transparent 62%);
  transform:translateX(-130%);
  transition:transform 1s var(--ease);
}
.pr:hover .pr__im::after{transform:translateX(130%)}

/* pastilles : verre, plus de rectangle plat */
.pr__tag,.pr__promo{
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 4px 14px rgba(96,52,32,.16);
}
.pr__promo{
  background:linear-gradient(135deg,var(--red),#C41616);
  border-color:rgba(255,255,255,.4);
}

/* coeur favoris : verre, au-dessus de tout */
.pr__fav{
  z-index:4;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:0 6px 18px rgba(96,52,32,.2);
}

/* ─── cartes de gamme ──────────────────────────────────────────────── */
.gam__media{
  position:relative;z-index:1;
  padding:30px 26px 0;
  display:grid;place-items:center;
}

.gam__media img{
  width:100%;max-width:240px;height:auto;
  transition:transform .65s var(--ease);
}
.gam:hover .gam__media img{
  transform:translateY(-10px) scale(1.05);
}
.gam__bg{
  opacity:.13;
  filter:saturate(.85);
  transition:opacity .6s ease,transform .9s var(--ease);
}
.gam:hover .gam__bg{opacity:.2;transform:scale(1.06)}

/* ─── boutons de carte ─────────────────────────────────────────────── */
.pr__buy{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--red),#C41616);
  box-shadow:0 8px 22px rgba(233,30,30,.3),0 1px 0 rgba(255,255,255,.25) inset;
}
.pr__buy::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .8s var(--ease);
}
.pr__buy:hover::before{transform:translateX(120%)}
.pr__cart{
  background:linear-gradient(135deg,var(--gold),#E9A93F);
  box-shadow:0 6px 18px rgba(255,196,63,.4),0 1px 0 rgba(255,255,255,.4) inset;
}

/* ─── carte du hero ────────────────────────────────────────────────── */
.hero__card{
  border:1px solid rgba(255,255,255,.7);
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 40px 90px rgba(96,52,32,.28),
    0 8px 24px rgba(96,52,32,.12);
}
.hero__float{
  border:1px solid rgba(255,255,255,.85);
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 20px 46px rgba(96,52,32,.22);
}

/* ─── temoignages ──────────────────────────────────────────────────── */
.av{
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.5));
  border:1px solid rgba(255,255,255,.92);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 40px rgba(96,52,32,.12);
  transition:transform .5s var(--ease),box-shadow .5s ease;
}
.av:hover{transform:translateY(-6px);box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 28px 58px rgba(233,30,30,.16)}

/* ─── panneaux interieurs ──────────────────────────────────────────── */
.panel{
  background:linear-gradient(180deg,rgba(255,255,255,.76),rgba(255,255,255,.5));
  border:1px solid rgba(255,255,255,.92);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 42px rgba(96,52,32,.13);
}
.line{
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.48));
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
.line__im{background:radial-gradient(120% 90% at 50% 0%,#fff,var(--cream) 76%)}
.line__im img{filter:drop-shadow(0 8px 14px rgba(96,52,32,.16))}

/* ─── fiche produit ────────────────────────────────────────────────── */
.fiche__media{
  background:radial-gradient(120% 90% at 50% 0%,#fff,var(--cream) 74%);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 70px rgba(96,52,32,.22);
}
.fiche__media img{filter:drop-shadow(0 20px 36px rgba(96,52,32,.2))}

/* ─── categorie ────────────────────────────────────────────────────── */
.cathead__media img{
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 28px 64px rgba(96,52,32,.22);
  /* jamais rogne : l'image garde ses proportions dans le cadre */
  object-fit:contain;
}

@media (prefers-reduced-motion:reduce){
  .pr::before,.gam::before,.pr__im::after,.pr__buy::before{display:none}
}