/* ==========================================================================
   MAUVIEL SOUTH AFRICA — UX LAYER, PART TWO
   Skip link · sticky buy bar · recently viewed · back to top · page heads
   ========================================================================== */

/* --- skip link ---------------------------------------------------------- */
.mv-skip{position:absolute;left:-9999px;top:0;z-index:100000;
  background:var(--mv-ink);color:#fff;padding:.9rem 1.4rem;
  font-family:var(--mv-font-display);font-size:.8125rem;font-weight:500;
  text-transform:uppercase;letter-spacing:var(--mv-track-caps-tight);
  text-decoration:none}
.mv-skip:focus{left:1rem;top:1rem}
#mv-main:focus{outline:none}
.mv-anchor{display:block;position:relative;top:-90px;height:0;overflow:hidden}

/* --- sticky buy bar ----------------------------------------------------- */
.mv-stickybuy{position:fixed;left:0;right:0;bottom:0;z-index:9990;
  background:#fff;border-top:1px solid var(--mv-ink-25);
  transform:translateY(101%);transition:transform .28s var(--mv-ease);
  will-change:transform}
.mv-stickybuy.is-on{transform:translateY(0)}
.mv-stickybuy__in{max-width:var(--mv-m);margin:0 auto;padding:.7rem var(--mv-p);
  display:flex;align-items:center;gap:1rem}
.mv-stickybuy__img{width:48px;height:48px;object-fit:contain;flex:none;
  mix-blend-mode:multiply}
.mv-stickybuy__name{font-family:var(--mv-font-display);font-size:.9375rem;
  color:var(--mv-ink);line-height:1.25;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  min-width:0;flex:1 1 auto}
.mv-stickybuy__price{font-family:var(--mv-font-data);font-size:.9375rem;
  letter-spacing:var(--mv-track-data);color:var(--mv-ink);font-weight:500;
  white-space:nowrap;flex:none}
.mv-stickybuy__lead{font-family:var(--mv-font-data);font-size:.6875rem;
  letter-spacing:var(--mv-track-data);text-transform:uppercase;
  color:var(--mv-brass-text);border-left:1px solid var(--mv-ink-25);
  padding-left:1rem;white-space:nowrap;flex:none}
.mv-stickybuy__cta{flex:none;background:var(--mv-ink);color:#fff;
  text-decoration:none;padding:.85rem 1.6rem;
  font-family:var(--mv-font-display);font-size:.75rem;font-weight:500;
  text-transform:uppercase;letter-spacing:var(--mv-track-caps-tight);
  transition:background-color .25s var(--mv-ease)}
.mv-stickybuy__cta:hover{background:var(--mv-brass);color:#fff}

@media (max-width:900px){
  .mv-stickybuy__img,.mv-stickybuy__lead{display:none}
  .mv-stickybuy__in{padding:.6rem 4%;gap:.75rem}
  .mv-stickybuy__name{-webkit-line-clamp:1;font-size:.8125rem}
  .mv-stickybuy__price{font-size:.8125rem}
  .mv-stickybuy__cta{padding:.8rem 1rem;font-size:.6875rem;min-height:44px;
    display:flex;align-items:center}
}
@media (max-width:560px){
  .mv-stickybuy__name{display:none}
  .mv-stickybuy__in{justify-content:space-between}
  .mv-stickybuy__cta{flex:1 1 auto;justify-content:center}
}

/* --- recently viewed ---------------------------------------------------- */
.mv-seen{max-width:var(--mv-m);margin:var(--mv-space-12) auto var(--mv-space-8);
  padding:var(--mv-space-6) var(--mv-p) 0;border-top:1px solid var(--mv-ink-25)}
.mv-seen[hidden]{display:none}
.mv-seen__h{font-family:var(--mv-font-display);font-size:.8125rem;
  font-weight:500;text-transform:uppercase;
  letter-spacing:var(--mv-track-caps-tight);color:var(--mv-ink);
  margin:0 0 var(--mv-space-3)}
.mv-seen__list{list-style:none!important;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--mv-ink-25);border:1px solid var(--mv-ink-25)}
@media (min-width:620px){.mv-seen__list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){.mv-seen__list{grid-template-columns:repeat(6,minmax(0,1fr))}}
.mv-seen__list>li{list-style:none!important;background:#fff;min-width:0}
.mv-seen__list>li::marker,.mv-seen__list>li::before{content:none!important;display:none!important}
.mv-seen a{display:flex;flex-direction:column;gap:.4rem;padding:var(--mv-space-2);
  text-decoration:none;color:var(--mv-ink);height:100%}
.mv-seen a:hover{background:var(--mv-paper-cool)}
.mv-seen img{width:100%;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
.mv-seen__n{font-family:var(--mv-font-display);font-size:.8125rem;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mv-seen__p{font-family:var(--mv-font-data);font-size:.75rem;
  letter-spacing:var(--mv-track-data);color:var(--mv-ink);margin-top:auto}

/* --- back to top -------------------------------------------------------- */
.mv-totop{position:fixed;right:1.25rem;bottom:1.25rem;z-index:9980;
  width:44px;height:44px;border:1px solid var(--mv-ink);background:#fff;
  color:var(--mv-ink);font-size:1rem;line-height:1;cursor:pointer;
  border-radius:0;opacity:0;transform:translateY(8px);
  transition:opacity .2s,transform .2s,background-color .2s}
.mv-totop[hidden]{display:none}
.mv-totop.is-on{opacity:1;transform:translateY(0)}
.mv-totop:hover{background:var(--mv-ink);color:#fff}
.mv-stickybuy.is-on ~ .mv-totop{bottom:5.5rem}

/* --- cart / checkout page heads ----------------------------------------- */
.mv-pagehead{max-width:var(--mv-m);margin:0 auto var(--mv-space-6);padding:0 var(--mv-p)}
.mv-pagehead h1{font-family:var(--mv-font-display);font-weight:300;
  font-size:var(--mv-size-collection);color:var(--mv-ink);
  letter-spacing:.005em;margin:0 0 .35rem}
.mv-pagehead__sub{font-family:var(--mv-font-body);font-size:1rem;
  color:var(--mv-ink-55);margin:0;max-width:60ch}

/* --- back to category --------------------------------------------------- */
.mv-backto{max-width:var(--mv-m);margin:var(--mv-space-6) auto 0;padding:0 var(--mv-p)}
.mv-backto a{font-family:var(--mv-font-display);font-size:.8125rem;
  font-weight:500;text-transform:uppercase;
  letter-spacing:var(--mv-track-caps-tight);color:var(--mv-ink);
  text-decoration:none;border-bottom:1px solid var(--mv-brass);
  padding-bottom:.15rem}
.mv-backto a:hover{color:var(--mv-brass-text)}

@media (prefers-reduced-motion:reduce){
  .mv-stickybuy,.mv-totop{transition:none}
}