/* ==========================================================================
   MAUVIEL SOUTH AFRICA — HEADER (Option B: ink)
   Our own markup, rendered by mauviel-header.php. The Divi Theme Builder
   header is hidden: it was four sections, two logos, two search fields and
   three menus, with the shop navigation in a half-width column.
   ========================================================================== */

/* the old one, gone */
.et-l--header{display:none!important}
#main-header,#top-header,#et-secondary-nav{display:none!important}
body.et_transparent_nav #page-container,body #page-container{padding-top:0!important}
#page-container{margin-top:0!important}

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */
.mvh{position:sticky;top:0;z-index:9999;background:var(--mv-ink);color:#fff;
  font-family:var(--mv-font-display)}
.admin-bar .mvh{top:32px}
@media (max-width:782px){.admin-bar .mvh{top:46px}}
.mvh__in{max-width:var(--mv-m);margin:0 auto;padding:0 var(--mv-p);display:flex;align-items:center;gap:1.25rem}

/* --------------------------------------------------------------------------
   Utility strip
   -------------------------------------------------------------------------- */
.mvh__utility{background:#1A1718;border-bottom:1px solid rgba(255,255,255,.12)}
.mvh__utility .mvh__in{height:34px;justify-content:space-between;gap:1rem}
.mvh__note{font-family:var(--mv-font-data);font-size:.6875rem;letter-spacing:.16em;
  text-transform:uppercase;color:#C9C4BA;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mvh__util{display:flex;gap:1.6rem;flex:none}
.mvh__util a{font-family:var(--mv-font-data);font-size:.6875rem;letter-spacing:.16em;
  text-transform:uppercase;color:#C9C4BA;text-decoration:none;white-space:nowrap}
.mvh__util a:hover{color:var(--mv-brass)}

/* --------------------------------------------------------------------------
   Main bar — logo left, navigation centre, tools right
   -------------------------------------------------------------------------- */
.mvh__main .mvh__in{height:76px}
.mvh__logo{flex:none;display:flex;align-items:center;margin-right:.5rem}
.mvh__logo img{display:block;height:30px;width:auto;max-width:none}
.mvh__burger{display:none}

.mvh__shop{flex:1 1 auto;min-width:0;display:flex;justify-content:center}
.mvh__shop>ul{list-style:none!important;margin:0;padding:0;display:flex;align-items:center;
  gap:.15rem;flex-wrap:nowrap}
.mvh__shop>ul>li{list-style:none!important;position:static;margin:0}
.mvh__shop>ul>li::marker,.mvh__shop>ul>li::before{content:none!important;display:none!important}
.mvh__item>a{display:block;position:relative;padding:1.5rem .85rem;text-decoration:none;
  color:#fff;font-size:.75rem;font-weight:500;letter-spacing:.11em;text-transform:uppercase;
  white-space:nowrap;line-height:1}
.mvh__item>a:after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:1.15rem;
  height:1px;background:var(--mv-brass);transform:scaleX(0);transform-origin:left;
  transition:transform .24s var(--mv-ease)}
.mvh__item:hover>a:after,.mvh__item.is-current>a:after{transform:scaleX(1)}
.mvh__item:hover>a,.mvh__item.is-current>a{color:var(--mv-brass)}

@media (max-width:1400px){.mvh__item>a{padding-left:.6rem;padding-right:.6rem;font-size:.6875rem;letter-spacing:.09em}
  .mvh__item>a:after{left:.6rem;right:.6rem}}
@media (max-width:1180px){.mvh__item>a{padding-left:.45rem;padding-right:.45rem;letter-spacing:.06em}
  .mvh__item>a:after{left:.45rem;right:.45rem}}

/* full-width dropdown, so long collection names never wrap */
.mvh__drop{position:absolute;left:0;right:0;top:100%;background:var(--mv-ink);
  border-top:2px solid var(--mv-brass);border-bottom:1px solid rgba(255,255,255,.14);
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .18s var(--mv-ease),transform .18s var(--mv-ease),visibility .18s;
  z-index:5}
.mvh__item:hover>.mvh__drop,.mvh__item:focus-within>.mvh__drop{opacity:1;visibility:visible;transform:translateY(0)}
.mvh__drop>ul{list-style:none!important;margin:0 auto;padding:1.4rem var(--mv-p);max-width:var(--mv-m);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,max-content));gap:.15rem 2.5rem;
  justify-content:start}
.mvh__drop li{list-style:none!important;margin:0}
.mvh__drop li::marker,.mvh__drop li::before{content:none!important;display:none!important}
.mvh__drop a{display:block;padding:.5rem 0;color:#EDEBE7;text-decoration:none;
  font-family:var(--mv-font-body);font-size:.9375rem;font-weight:400;letter-spacing:.01em;
  white-space:nowrap;border-bottom:1px solid transparent}
.mvh__drop a:hover{color:var(--mv-brass);border-bottom-color:rgba(171,153,116,.5)}

/* --------------------------------------------------------------------------
   Tools
   -------------------------------------------------------------------------- */
.mvh__tools{flex:none;display:flex;align-items:center;gap:.1rem;margin-left:.5rem}
.mvh__ico{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;
  border:0;background:transparent;color:#fff;cursor:pointer;position:relative;text-decoration:none;
  padding:0}
.mvh__ico:hover{color:var(--mv-brass)}
.mvh__n{position:absolute;top:6px;right:2px;background:var(--mv-brass);color:#fff;
  font-family:var(--mv-font-data);font-size:.625rem;line-height:1;letter-spacing:.04em;
  padding:2px 4px;min-width:0}
.mvh__n[hidden]{display:none}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */
.mvh__drawer{display:none}
.mvh__veil{display:none}

@media (max-width:1024px){
  .mvh__utility .mvh__in{height:32px}
  .mvh__util{display:none}
  .mvh__note{white-space:normal;font-size:.625rem;letter-spacing:.12em;text-align:center;width:100%}
  .mvh__shop{display:none}
  .mvh__main .mvh__in{height:60px;justify-content:space-between;gap:.5rem;padding:0 4%}
  .mvh__burger{display:flex;flex-direction:column;justify-content:center;gap:4px;
    width:44px;height:44px;padding:0 11px;border:0;background:transparent;cursor:pointer;flex:none}
  .mvh__burger i{display:block;height:1px;width:100%;background:#fff;
    transition:transform .22s var(--mv-ease),opacity .22s}
  body.mvh-open .mvh__burger i:nth-child(1){transform:translateY(5px) rotate(45deg)}
  body.mvh-open .mvh__burger i:nth-child(2){opacity:0}
  body.mvh-open .mvh__burger i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
  .mvh__logo{flex:1 1 auto;justify-content:center;margin:0}
  .mvh__logo img{height:24px}
  .mvh__tools{margin:0}
  .mvh__acct{display:none}

  .mvh__veil{display:block;position:fixed;inset:0;background:rgba(26,23,24,.5);z-index:9990;
    opacity:0;pointer-events:none;transition:opacity .22s var(--mv-ease)}
  .mvh__veil[hidden]{display:none}
  body.mvh-open .mvh__veil{opacity:1;pointer-events:auto}

  .mvh__drawer{display:block;position:fixed;top:0;bottom:0;left:0;width:min(88vw,380px);
    z-index:9995;background:var(--mv-ink);border-right:1px solid rgba(255,255,255,.14);
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    transform:translateX(-101%);transition:transform .26s var(--mv-ease);
    padding:5.5rem 0 3rem}
  .mvh__drawer[hidden]{display:block}
  body.mvh-open .mvh__drawer{transform:translateX(0)}
  body.mvh-open{overflow:hidden}

  .mvh__drawer ul{list-style:none!important;margin:0;padding:0}
  .mvh__drawer li{list-style:none!important;margin:0}
  .mvh__drawer li::marker,.mvh__drawer li::before{content:none!important;display:none!important}
  .mvh__drawer a,.mvh__dtoggle{display:flex;align-items:center;justify-content:space-between;
    width:100%;min-height:48px;padding:.85rem 1.4rem;text-decoration:none;text-align:left;
    color:#EDEBE7;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.09);
    font-family:var(--mv-font-body);font-size:1rem;cursor:pointer}
  .mvh__dtoggle{font-family:var(--mv-font-display);font-weight:500;color:#fff;
    text-transform:uppercase;font-size:.8125rem;letter-spacing:.1em}
  .mvh__dtoggle span{width:11px;height:11px;position:relative;flex:none}
  .mvh__dtoggle span:before,.mvh__dtoggle span:after{content:"";position:absolute;
    background:var(--mv-brass);transition:transform .2s var(--mv-ease)}
  .mvh__dtoggle span:before{left:0;right:0;top:5px;height:1px}
  .mvh__dtoggle span:after{top:0;bottom:0;left:5px;width:1px}
  .mvh__dtoggle[aria-expanded="true"] span:after{transform:scaleY(0)}
  .mvh__dsub{background:rgba(255,255,255,.03)}
  .mvh__dsub a{padding-left:2.2rem;font-size:.9375rem}
  .mvh__dsub3 a{padding-left:3.2rem;font-size:.875rem;color:#C9C4BA}
  .mvh__drawer a:hover,.mvh__dtoggle:hover{color:var(--mv-brass);background:rgba(255,255,255,.05)}
}

@media (max-width:420px){
  .mvh__note{font-size:.5625rem;letter-spacing:.1em}
  .mvh__logo img{height:21px}
}

@media (prefers-reduced-motion:reduce){
  .mvh__drawer,.mvh__veil,.mvh__drop,.mvh__item>a:after,.mvh__burger i{transition:none}
}


/* The utility bar shares the main bar's gutter on small screens, so the two
   rows of the header line up with the page. */
@media (max-width:1024px){.mvh__utility .mvh__in{padding:0 4%}}