/* ==================================================================
   EPOC — fiche produit
   Colonne de visuels a gauche, panneau d'achat centre a droite.
   Blanc, sans empattement, aucun ornement : la piece parle seule.
   ================================================================ */

.epoc-pdp,
.epoc-pdp__bar,
.epoc-pdp__related{
  --pdp-bg:#fff;
  --pdp-ink:#111;
  --pdp-mute:#767676;
  --pdp-line:#e3e3e3;
  --pdp-col:min(420px,78%);
}

/* La fiche prend toute la largeur de la fenetre et repose sur du blanc */
.epoc-pdp{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
  background:var(--pdp-bg);
  color:var(--pdp-ink);
  font-family:var(--sans);
}

/* ==================================================================
   COLONNE DE VISUELS
   ================================================================ */
.epoc-pdp__media-wrap{position:relative;min-width:0}

.epoc-pdp__media{display:block}
.epoc-pdp__media:focus{outline:none}
.epoc-pdp__media:focus-visible{outline:1px solid var(--pdp-ink);outline-offset:-2px}

.epoc-pdp__shot{margin:0;position:relative;overflow:hidden;background:#f2f2f2;aspect-ratio:2/3}
.epoc-pdp__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}

/* Fil d'Ariane pose sur le premier visuel */
.epoc-pdp__crumb{
  position:absolute;top:22px;left:26px;z-index:2;
  display:flex;flex-direction:column;gap:3px;
  font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--pdp-ink);
}
.epoc-pdp__crumb a{transition:opacity var(--t);opacity:.72}
.epoc-pdp__crumb a:hover{opacity:1;text-decoration:underline}
.epoc-pdp__crumb span{opacity:.72}

/* ---------- Rail de miniatures (colonne de gauche) ---------- */
.epoc-pdp__thumbs{
  position:absolute;left:22px;top:132px;bottom:0;z-index:3;
  width:46px;pointer-events:none;
}
.epoc-pdp__thumbs-inner{
  position:sticky;top:calc(var(--header-h) + 24px);
  display:flex;flex-direction:column;gap:8px;
  pointer-events:auto;
}
.epoc-pdp__thumb{
  display:block;width:46px;aspect-ratio:2/3;
  padding:0;border:0;background:#f2f2f2;cursor:pointer;
  opacity:.55;transition:opacity var(--t);
}
.epoc-pdp__thumb img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.epoc-pdp__thumb:hover{opacity:.85}
.epoc-pdp__thumb.is-active{opacity:1;outline:1px solid var(--pdp-ink);outline-offset:2px}
.epoc-pdp__thumb:focus-visible{opacity:1;outline:1px solid var(--pdp-ink);outline-offset:2px}

/* Fleches et compteur : reserves au defile des petits ecrans */
.epoc-pdp__nav{display:none}
.epoc-pdp__count{display:none}

/* ==================================================================
   PANNEAU D'ACHAT
   ================================================================ */
.epoc-pdp__panel{
  position:sticky;top:0;
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
}
.epoc-pdp__panel-inner{width:var(--pdp-col);padding:60px 0}

.epoc-pdp__head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.epoc-pdp__title{
  font-family:var(--sans);font-weight:500;font-style:normal;
  font-size:13px;letter-spacing:.11em;text-transform:uppercase;line-height:1.5;
}
.epoc-pdp__titles{min-width:0}
.epoc-pdp__libelle{
  margin-top:2px;font-family:var(--sans);font-weight:300;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;line-height:1.5;color:var(--pdp-mute);
}
.epoc-pdp__fav{flex:0 0 auto;color:var(--pdp-ink);transition:opacity var(--t);opacity:.85}
.epoc-pdp__fav:hover{opacity:1}
.epoc-pdp__fav .epoc-icon{width:16px;height:16px}
.epoc-pdp__fav.is-active .epoc-icon{fill:var(--pdp-ink)}

.epoc-pdp__price{margin-top:10px;font-size:13px;letter-spacing:.03em}
.epoc-pdp__price del{color:var(--pdp-mute);margin-right:10px;opacity:1}
.epoc-pdp__price ins{text-decoration:none;color:var(--pdp-ink)}

/* ---------- Pastilles de coloris ---------- */
.epoc-pdp__colors{margin-top:38px;position:relative}
.epoc-pdp__color-line{
  display:flex;gap:5px;margin-bottom:12px;
  font-size:11px;letter-spacing:.09em;text-transform:uppercase;
}
.epoc-pdp__color-label{color:var(--pdp-mute)}
/* Mention « visuel présenté en X » : un bandeau fin qui surgit au choix d'un
   coloris jamais shoote, puis s'efface. Pose en absolu et insensible au
   pointeur — il ne doit ni decaler la fiche ni intercepter le clic sur la
   taille, juste dessous. L'information reste ensuite disponible en permanence
   dans l'infobulle de la pastille. */
.epoc-pdp__color-pop{
  position:absolute;top:calc(100% + 7px);left:0;z-index:3;
  max-width:100%;padding:6px 11px;
  background:var(--pdp-ink);color:var(--pdp-bg);
  font-size:10px;letter-spacing:.09em;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  pointer-events:none;
  opacity:0;transform:translateY(-4px);
  transition:opacity var(--t),transform var(--t);
}
.epoc-pdp__color-pop.is-on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .epoc-pdp__color-pop{transition:none;transform:none}
}
.epoc-pdp__swatches{display:flex;flex-wrap:wrap;gap:8px}

.epoc-pdp__swatch{display:block;padding:2px;border:1px solid transparent;line-height:0;transition:border-color var(--t)}
/* Indisponible : la pastille reste visible — le coloris existe — mais elle est
   eteinte et barree. Seul l'epuisement vaut ce traitement ; un coloris en stock
   se vend, meme sans photo a lui.
   Elle reste sensible au clic sans etre selectionnable : un carreau qui ne
   repond rien du tout laisse croire a une fiche cassee. Le clic ne change pas
   de coloris, il fait surgir « Coloris — epuise ». */
.epoc-pdp__swatch.is-indisponible{
  cursor:not-allowed;
}
.epoc-pdp__swatch.is-indisponible .epoc-pdp__swatch-chip{
  position:relative;
}
/* La teinte d'un coloris epuise n'est PAS touchee. Toute attenuation la change :
   baisser l'opacite a 40 % delavait le rouge rgb(251,67,55) en rgb(253,180,175),
   soit du saumon ; le desaturer a 55 % le poussait en rgb(197,114,108), soit du
   marron. Dans les deux cas le client lisait un autre coloris. C'est donc la
   barre, et elle seule, qui dit l'epuisement — plus un liseré gris qui eteint le
   carreau sans toucher au tissu. */
.epoc-pdp__swatch.is-epuise{box-shadow:inset 0 0 0 1px var(--pdp-line)}
.epoc-pdp__swatch.is-epuise .epoc-pdp__swatch-chip::after{
  content:"";position:absolute;left:-2px;right:-2px;top:50%;
  height:1.5px;background:var(--pdp-ink);opacity:.9;
  box-shadow:0 0 0 1px rgba(255,255,255,.55);
  transform:rotate(-45deg);transform-origin:center;
}
/* Visuels empruntes a un autre coloris : cliquable et pleinement lisible. Rien
   ne l'affaiblit ici — c'est la mention sous le nom qui porte la nuance, pas
   une pastille a demi eteinte qu'on prendrait pour un epuise. */
.epoc-pdp__swatch:hover{border-color:var(--pdp-line)}
.epoc-pdp__swatch.is-active{border-color:var(--pdp-ink)}
.epoc-pdp__swatch-chip{
  display:block;width:28px;height:28px;
  background-size:cover;background-position:center;
}

/* ---------- Taille : menu deroulant ---------- */
.epoc-pdp__cart{margin-top:26px}
.epoc-pdp .epoc-pdp__cart form.cart{margin:0}

.epoc-pdp__size{position:relative}
.epoc-pdp__size-toggle{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;height:46px;padding:0 2px;
  border-bottom:1px solid var(--pdp-ink);background:none;
  font-size:11px;letter-spacing:.09em;text-transform:uppercase;text-align:left;
}
.epoc-pdp__size-chev{width:14px;height:14px;transition:transform var(--t)}
.epoc-pdp__size.is-open .epoc-pdp__size-chev{transform:rotate(180deg)}

.epoc-pdp__size-menu{
  position:absolute;left:0;right:0;top:calc(100% + 1px);z-index:5;
  background:var(--pdp-bg);border:1px solid var(--pdp-line);
  box-shadow:0 14px 34px rgba(0,0,0,.07);
}
.epoc-pdp__size-note{padding:16px 18px;border-bottom:1px solid var(--pdp-line)}
.epoc-pdp__size-model{font-size:11.5px;line-height:1.6;color:var(--pdp-mute)}
.epoc-pdp__size-guide{
  margin-top:8px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  text-decoration:underline;text-underline-offset:3px;
}

.epoc-pdp__size-list{max-height:290px;overflow-y:auto}
.epoc-pdp__size-option{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;padding:12px 18px;text-align:left;
  font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;
  transition:background var(--t);
}
.epoc-pdp__size-option:hover{background:#f6f6f6}
.epoc-pdp__size-option[aria-selected="true"]{background:#f0f0f0}
.epoc-pdp__size-option.is-out{color:var(--pdp-mute);cursor:not-allowed}
.epoc-pdp__size-option.is-out span:first-child{text-decoration:line-through}
.epoc-pdp__size-option.is-out:hover{background:none}
.epoc-pdp__size-state{font-size:9.5px;letter-spacing:.14em;color:var(--pdp-mute)}

.epoc-pdp__size-msg{margin-top:12px;font-size:11px;letter-spacing:.05em;color:#a3312a}

/* ---------- Bouton panier ---------- */
.epoc-pdp .epoc-atc button.single_add_to_cart_button.epoc-pdp__add{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:48px;margin-top:22px;
  background:var(--pdp-ink);color:#fff;border:1px solid var(--pdp-ink);border-radius:0;
  font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;
  transition:opacity var(--t);
}
.epoc-pdp .epoc-atc button.single_add_to_cart_button.epoc-pdp__add:hover{opacity:.82;background:var(--pdp-ink);color:#fff}
.epoc-pdp__add.is-loading{opacity:.45;pointer-events:none}

/* ---------- Lignes depliables ---------- */
.epoc-pdp__infos{margin-top:44px}
.epoc-pdp__info{border-bottom:1px solid var(--pdp-line)}
.epoc-pdp__info-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  width:100%;padding:15px 2px;text-align:left;
  font-size:11px;letter-spacing:.11em;text-transform:uppercase;
  transition:opacity var(--t);
}
.epoc-pdp__info-head:hover{opacity:.6}
.epoc-pdp__info-chev{width:13px;height:13px;transition:transform var(--t)}
.epoc-pdp__info.is-open .epoc-pdp__info-chev{transform:rotate(180deg)}
.epoc-pdp__info-panel{overflow:hidden;height:0;transition:height var(--t-slow)}
.epoc-pdp__info-inner{
  padding:2px 2px 20px;font-size:12.5px;line-height:1.85;color:var(--pdp-mute);
}
.epoc-pdp__info-inner p{margin-bottom:10px}
.epoc-pdp__info-inner ul{list-style:disc;padding-left:18px;margin-bottom:10px}
.epoc-pdp__info-inner li{margin-bottom:4px}
.epoc-pdp__ref{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--pdp-mute)}

.epoc-pdp__table{width:100%;font-size:11.5px;margin-bottom:12px}
.epoc-pdp__table th,.epoc-pdp__table td{padding:8px 6px;text-align:left;border-bottom:1px solid var(--pdp-line)}
.epoc-pdp__table th{
  font-weight:500;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--pdp-ink);
}
.epoc-pdp__table td{color:var(--pdp-mute)}
.epoc-pdp__table-note{font-size:11px;line-height:1.7;color:var(--pdp-mute)}

/* ==================================================================
   BARRE D'ACHAT AU DEFILEMENT
   ================================================================ */
.epoc-pdp__bar{
  position:fixed;left:0;right:0;bottom:0;z-index:var(--z-header);
  background:var(--pdp-bg);border-top:1px solid var(--pdp-line);
  color:var(--pdp-ink);font-family:var(--sans);
  transform:translateY(100%);transition:transform var(--t-slow);
}
.epoc-pdp__bar.is-visible{transform:translateY(0)}
.epoc-pdp__bar-inner{display:flex;align-items:center;gap:18px;padding:0 30px;height:60px}
.epoc-pdp__bar-name{
  font-size:11px;letter-spacing:.11em;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.epoc-pdp__bar-meta{font-size:11px;color:var(--pdp-mute)}
.epoc-pdp__bar-price{margin-left:auto;font-size:12px}
.epoc-pdp__bar-price del{color:var(--pdp-mute);margin-right:8px}
.epoc-pdp__bar-price ins{text-decoration:none}
.epoc-pdp__bar-add{
  display:inline-flex;align-items:center;justify-content:center;
  height:40px;padding:0 30px;background:var(--pdp-ink);color:#fff;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  transition:opacity var(--t);
}
.epoc-pdp__bar-add:hover{opacity:.82}

/* ==================================================================
   SELECTION ASSOCIEE
   ================================================================ */
.epoc-pdp__related{background:var(--pdp-bg);color:var(--pdp-ink);padding:54px 0 70px;font-family:var(--sans)}
.epoc-pdp__related-title{
  font-family:var(--sans);font-weight:400;font-style:normal;
  font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  padding:0 26px;margin-bottom:16px;
}
.epoc-pdp__related-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.epoc-pdp__related-item{display:block}
.epoc-pdp__related-media{display:block;overflow:hidden;background:#f2f2f2;aspect-ratio:3/4}
.epoc-pdp__related-media img{width:100%;height:100%;object-fit:cover}
.epoc-pdp__related-line{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:10px 12px 0;font-size:11px;letter-spacing:.04em;
}
.epoc-pdp__related-name{color:var(--pdp-ink)}
.epoc-pdp__related-price{color:var(--pdp-mute);white-space:nowrap}
.epoc-pdp__related-price del{margin-right:6px}
.epoc-pdp__related-price ins{text-decoration:none;color:var(--pdp-ink)}

/* ==================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width:1100px){
  .epoc-pdp__panel-inner{width:min(420px,86%)}
}

@media (max-width:900px){
  .epoc-pdp{grid-template-columns:1fr}

  /* Les visuels deviennent un defile horizontal */
  .epoc-pdp__media{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .epoc-pdp__media::-webkit-scrollbar{display:none}
  .epoc-pdp__thumbs{display:none}
  .epoc-pdp__shot{flex:0 0 100%;scroll-snap-align:center}

  .epoc-pdp__crumb{
    position:static;flex-direction:row;flex-wrap:wrap;gap:8px;
    padding:16px var(--gut) 0;
  }
  .epoc-pdp__crumb a::after{content:" /";opacity:.5}

  .epoc-pdp__nav{
    display:flex;align-items:center;justify-content:space-between;
    position:absolute;left:0;right:0;top:0;width:100%;
    aspect-ratio:2/3;padding:0 8px;pointer-events:none;
  }
  .epoc-pdp__arrow{
    pointer-events:auto;
    display:flex;align-items:center;justify-content:center;
    width:34px;height:34px;border-radius:50%;
    background:rgba(255,255,255,.86);color:var(--pdp-ink);
    transition:opacity var(--t);
  }
  .epoc-pdp__arrow:hover{opacity:.75}
  .epoc-pdp__arrow .epoc-icon{width:18px;height:18px}
  .epoc-pdp__arrow--prev .epoc-icon{transform:rotate(90deg)}
  .epoc-pdp__arrow--next .epoc-icon{transform:rotate(-90deg)}

  .epoc-pdp__count{
    display:block;position:absolute;right:14px;
    top:calc(66.66% - 40px);
    padding:4px 10px;background:rgba(0,0,0,.55);color:#fff;
    font-size:10px;letter-spacing:.12em;pointer-events:none;
  }

  .epoc-pdp__panel{position:static;min-height:0;display:block}
  .epoc-pdp__panel-inner{width:auto;padding:28px var(--gut) 46px}

  .epoc-pdp__related-title{padding-inline:var(--gut)}
  .epoc-pdp__related-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .epoc-pdp__bar-meta{display:none}
}

@media (max-width:560px){
  .epoc-pdp__bar-inner{gap:12px;padding-inline:var(--gut)}
  .epoc-pdp__bar-name,.epoc-pdp__bar-price{display:none}
  .epoc-pdp__bar-add{width:100%}
}

@media (prefers-reduced-motion:reduce){
  .epoc-pdp *,.epoc-pdp__bar{transition:none!important}
}

/* ==================================================================
   AGRANDISSEMENT
   ================================================================== */

/* ---------- La croix d'agrandissement ----------
   Deux filets d'un pixel, dans l'angle, et rien d'autre : ni cercle, ni aplat,
   ni voile. Pas de loupe non plus — la loupe a plus est le signe des sites
   marchands. La lisibilite sur une piece noire ne vient donc pas d'un fond
   mais d'un halo pose sur le trait lui-meme, invisible tant qu'il n'a rien a
   faire. Au survol les branches s'allongent : le geste dit « ouvrir ». */
.epoc-pdp__cross{
  position:relative;display:block;width:11px;height:11px;
}
.epoc-pdp__cross::before,
.epoc-pdp__cross::after{
  content:"";position:absolute;top:50%;left:50%;
  background:currentColor;
  transition:width var(--t),height var(--t);
}
.epoc-pdp__cross::before{width:100%;height:1px;transform:translate(-50%,-50%)}
.epoc-pdp__cross::after{width:1px;height:100%;transform:translate(-50%,-50%)}

.epoc-pdp__zoom{
  position:absolute;top:14px;right:14px;z-index:3;
  display:flex;align-items:center;justify-content:center;
  width:11px;height:11px;padding:0;border:0;
  background:none;
  color:var(--pdp-ink);cursor:pointer;
  opacity:.72;
  /* Un halo, pas un fond : il ne se voit que la ou le trait passerait inapercu */
  filter:drop-shadow(0 0 2px rgba(255,255,255,.9));
  transition:opacity var(--t);
}
/* La cible du doigt et de la souris deborde le trait sans l'epaissir */
.epoc-pdp__zoom::before{content:"";position:absolute;inset:-12px}
.epoc-pdp__zoom:hover{opacity:1}
.epoc-pdp__zoom:hover .epoc-pdp__cross::before{width:145%}
.epoc-pdp__zoom:hover .epoc-pdp__cross::after{height:145%}
.epoc-pdp__zoom:focus-visible{opacity:1;outline:1px solid var(--pdp-ink);outline-offset:5px}
@media (hover:none){ .epoc-pdp__zoom{opacity:.85} }

/* La photo entiere ouvre la visionneuse : le curseur l'annonce */
.epoc-pdp__shot{cursor:zoom-in}

/* ---------- La visionneuse ---------- */
body.epoc-zoom-ouvert{overflow:hidden}

.epoc-zoom{
  position:fixed;inset:0;z-index:1000;
  display:grid;grid-template-columns:1fr;place-items:center;
  background:#fff;
  opacity:0;transition:opacity .26s cubic-bezier(.22,.61,.36,1);
}
.epoc-zoom.is-open{opacity:1}
/* Tant que la visionneuse n'est pas ouverte, elle ne doit rien attraper : sans
   cette regle, un calque invisible en `position:fixed` couvre toute la page
   pendant le fondu de fermeture et avale les clics — la page parait bloquee. */
.epoc-zoom:not(.is-open),
.epoc-zoom:not(.is-open) *{pointer-events:none}

.epoc-zoom__stage{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(16px,4vw,64px);
  cursor:zoom-in;overflow:hidden;
}
.epoc-zoom.is-agrandi .epoc-zoom__stage{cursor:zoom-out}

.epoc-zoom__img{
  max-width:100%;max-height:100%;
  object-fit:contain;
  transition:transform .34s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.epoc-zoom__img.is-agrandi{transform:scale(2.1)}

/* La croix de fermeture : la meme, tournee d'un huitieme de tour */
.epoc-zoom__close{
  position:absolute;top:clamp(14px,2.4vw,30px);right:clamp(14px,2.4vw,30px);z-index:2;
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;padding:0;border:0;background:none;
  color:var(--pdp-ink,#111);cursor:pointer;
}
.epoc-zoom__close .epoc-pdp__cross{width:16px;height:16px;transform:rotate(45deg);transition:transform var(--t)}
.epoc-zoom__close:hover .epoc-pdp__cross{transform:rotate(135deg)}
.epoc-zoom__close:focus-visible{outline:1px solid var(--pdp-ink,#111);outline-offset:2px}

/* Passer d'une prise a l'autre : deux zones muettes sur les cotes, un chevron
   qui n'apparait qu'au survol. L'image garde toute la place. */
.epoc-zoom__step{
  position:absolute;top:0;bottom:0;width:clamp(60px,10vw,140px);z-index:1;
  border:0;background:none;padding:0;cursor:pointer;
}
.epoc-zoom__step--prev{left:0}
.epoc-zoom__step--next{right:0}
.epoc-zoom__step::before,
.epoc-zoom__step::after{
  content:"";position:absolute;top:50%;left:50%;width:14px;height:1px;
  background:var(--pdp-ink,#111);opacity:0;transition:opacity var(--t);
}
.epoc-zoom__step--prev::before{transform:translate(-50%,-50%) rotate(-45deg);transform-origin:left center;margin-left:-7px}
.epoc-zoom__step--prev::after{transform:translate(-50%,-50%) rotate(45deg);transform-origin:left center;margin-left:-7px}
.epoc-zoom__step--next::before{transform:translate(-50%,-50%) rotate(45deg);transform-origin:right center;margin-left:7px}
.epoc-zoom__step--next::after{transform:translate(-50%,-50%) rotate(-45deg);transform-origin:right center;margin-left:7px}
.epoc-zoom__step:hover::before,
.epoc-zoom__step:hover::after,
.epoc-zoom__step:focus-visible::before,
.epoc-zoom__step:focus-visible::after{opacity:.75}
.epoc-zoom.is-seul .epoc-zoom__step,
.epoc-zoom.is-seul .epoc-zoom__count{display:none}
.epoc-zoom.is-agrandi .epoc-zoom__step{pointer-events:none;opacity:0}

.epoc-zoom__count{
  position:absolute;left:50%;bottom:clamp(16px,2.6vw,32px);transform:translateX(-50%);
  font-size:10px;letter-spacing:.22em;color:var(--pdp-mute,#767676);
  font-variant-numeric:tabular-nums;
}

@media (prefers-reduced-motion:reduce){
  .epoc-zoom,.epoc-zoom__img,.epoc-pdp__cross::before,.epoc-pdp__cross::after{transition:none}
}