/* ==========================================================================
   Martume Optimized Nav — stylesheet
   Classes are prefixed "mnav" throughout so this never collides with
   Blocksy/Elementor's own nav classes.
   ========================================================================== */

:root{
  --mnav-cream:      #FAF6EE;
  --mnav-cream-dim:  #F0E9D8;
  --mnav-ink:        #2C2820;
  --mnav-ink-soft:   #6B6455;
  --mnav-moss:       #6E7B57;
  --mnav-moss-dark:  #4A5539;
  --mnav-terracotta: #C1734A;
  --mnav-gold:       #B9923E;

  --mnav-font-display: 'Cormorant Garamond', Georgia, serif;
  --mnav-font-sans: 'Jost', 'Work Sans', system-ui, sans-serif;

  --mnav-ease: cubic-bezier(.4,0,.2,1);
  --mnav-h: 76px;
}
@media (prefers-reduced-motion: reduce){
  .mnav, .mnav *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

.mnav{
  position:sticky; top:0; z-index:50;
  background:var(--mnav-cream); border-bottom:1px solid var(--mnav-cream-dim);
  font-family:var(--mnav-font-sans); color:var(--mnav-ink);
  box-sizing:border-box;
}
.mnav *{ box-sizing:border-box; }

.mnav__inner{
  max-width:1280px; margin:0 auto; padding:0 1.5rem;
  height:var(--mnav-h);
  display:flex; align-items:center; gap:1.5rem;
}

.mnav__logo{
  display:flex; align-items:baseline; gap:.4rem; text-decoration:none; color:var(--mnav-ink);
  margin-right:auto;
}
.mnav__logo-mark{
  font-family:var(--mnav-font-display); font-size:1.6rem; font-weight:600;
  width:34px; height:34px; border:1px solid var(--mnav-moss); border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
.mnav__logo-text{ font-family:var(--mnav-font-display); font-size:1.45rem; letter-spacing:.02em; }

.mnav__menu{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:2.1rem; }
.mnav__link{
  font-family:var(--mnav-font-sans); font-size:.92rem; letter-spacing:.03em; text-transform:uppercase;
  color:var(--mnav-ink); text-decoration:none; background:none; border:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:.3rem; padding:.4rem 0; position:relative;
}
.mnav__link:focus-visible,
.mnav__utility-link:focus-visible,
.mnav-group-btn:focus-visible{
  outline:2px solid var(--mnav-terracotta); outline-offset:3px; border-radius:2px;
}

.mnav-ink{ position:absolute; left:0; bottom:-2px; width:100%; height:6px; overflow:visible; pointer-events:none; }
.mnav-ink path{
  fill:none; stroke:var(--mnav-terracotta); stroke-width:2; stroke-linecap:round;
  stroke-dasharray:100; stroke-dashoffset:100;
  transition:stroke-dashoffset .35s var(--mnav-ease);
}
.mnav__link:hover .mnav-ink path,
.mnav__link:focus-visible .mnav-ink path,
.mnav-has-mega.is-open > .mnav__link--toggle .mnav-ink path{
  stroke-dashoffset:0;
}

.mnav-chevron{ width:10px; height:10px; transition:transform .2s var(--mnav-ease); }
.mnav-has-mega.is-open .mnav-chevron{ transform:rotate(180deg); }

.mnav__utilities{ display:flex; align-items:center; gap:1.1rem; }
.mnav__utility-link{ display:inline-flex; align-items:center; gap:.4rem; color:var(--mnav-ink); text-decoration:none; font-size:.85rem; }
.mnav__utility-link svg{ width:19px; height:19px; stroke:var(--mnav-ink); }
.mnav-cart-count{
  background:var(--mnav-moss); color:var(--mnav-cream); border-radius:50%;
  font-size:.68rem; min-width:16px; height:16px; display:inline-flex; align-items:center; justify-content:center; padding:0 3px;
}

.mnav__burger{ display:none; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; background:none; border:none; cursor:pointer; }
.mnav__burger span{ height:2px; background:var(--mnav-ink); border-radius:2px; transition:transform .25s var(--mnav-ease), opacity .25s var(--mnav-ease); }
.mnav__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mnav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.mnav__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Mega menu: two-pane flyout */
.mnav-has-mega{ position:static; }
.mnav-mega{
  position:absolute; left:0; right:0; top:var(--mnav-h);
  background:var(--mnav-cream); border-bottom:1px solid var(--mnav-cream-dim);
  box-shadow:0 18px 30px -20px rgba(44,40,32,.25);
  padding:2rem 0;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s var(--mnav-ease), transform .2s var(--mnav-ease), visibility 0s linear .2s;
}
.mnav-has-mega.is-open .mnav-mega{
  opacity:1; visibility:visible; transform:translateY(0);
  transition:opacity .2s var(--mnav-ease), transform .2s var(--mnav-ease);
}
.mnav-mega__inner{ max-width:1280px; margin:0 auto; padding:0 1.5rem; display:grid; grid-template-columns:280px 1fr; gap:2.5rem; }
.mnav-group-list{ list-style:none; margin:0; padding:0; border-right:1px solid var(--mnav-cream-dim); }
.mnav-group-btn{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  font-family:var(--mnav-font-sans); font-size:.95rem; color:var(--mnav-ink-soft);
  padding:.65rem .5rem; border-radius:4px; display:flex; justify-content:space-between; align-items:center;
}
.mnav-group-btn:hover, .mnav-group-btn[aria-selected="true"]{ color:var(--mnav-ink); background:var(--mnav-cream-dim); }
.mnav-group-btn[aria-selected="true"]{ font-weight:600; }
.mnav-group-btn .mnav-arrow{ opacity:0; transition:opacity .15s var(--mnav-ease); color:var(--mnav-terracotta); }
.mnav-group-btn[aria-selected="true"] .mnav-arrow{ opacity:1; }

.mnav-panel{ display:grid; grid-template-columns:1fr 260px; gap:2rem; }
.mnav-panel[hidden]{ display:none; }
.mnav-panel__title{ grid-column:1 / -1; font-family:var(--mnav-font-display); font-size:1.5rem; margin:0 0 .5rem; color:var(--mnav-moss-dark); }
.mnav-panel__links{ list-style:none; margin:0; padding:0; column-count:2; column-gap:1.5rem; }
.mnav-panel__links a{ display:block; padding:.4rem 0; color:var(--mnav-ink); text-decoration:none; font-size:.95rem; break-inside:avoid; }
.mnav-panel__links a:hover{ color:var(--mnav-terracotta); }

/* Promo tile — swap background-image per group via data-collection attribute (see nav.js) */
.mnav-promo{
  background:linear-gradient(155deg, var(--mnav-moss) 0%, var(--mnav-moss-dark) 100%);
  background-size:cover; background-position:center;
  color:var(--mnav-cream); border-radius:10px; padding:1.4rem;
  display:flex; flex-direction:column; justify-content:flex-end; min-height:180px;
  position:relative; overflow:hidden; text-decoration:none;
}
/* Scrim so text stays legible once a photo is added */
.mnav-promo::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(44,40,32,0) 30%, rgba(44,40,32,.75) 100%);
}
.mnav-promo > *{ position:relative; z-index:1; }
.mnav-promo svg{ position:absolute; top:.8rem; right:.8rem; width:34px; height:34px; opacity:.5; z-index:1; }
.mnav-promo__label{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; opacity:.85; }
.mnav-promo__title{ font-family:var(--mnav-font-display); font-size:1.35rem; margin:.15rem 0 .7rem; }
.mnav-promo__cta{ color:var(--mnav-cream); font-size:.85rem; text-decoration:underline; text-underline-offset:3px; width:fit-content; }

/* Mobile */
@media (max-width: 899px){
  .mnav__burger{ display:flex; }
  .mnav__menu-wrap{
    position:fixed; inset:var(--mnav-h) 0 0 0; background:var(--mnav-cream);
    overflow-y:auto; transform:translateX(100%); transition:transform .25s var(--mnav-ease);
  }
  .mnav__menu-wrap.is-open{ transform:translateX(0); }
  .mnav__menu{ flex-direction:column; align-items:stretch; gap:0; padding:1rem 1.25rem 2rem; }
  .mnav__menu > li{ border-bottom:1px solid var(--mnav-cream-dim); }
  .mnav__link{ width:100%; padding:1rem 0; font-size:1rem; justify-content:space-between; }

  .mnav-has-mega{ position:static; }
  .mnav-mega{
    position:static; box-shadow:none; border-bottom:none; padding:0 0 1rem;
    opacity:1; visibility:visible; transform:none; display:none;
  }
  .mnav-has-mega.is-open .mnav-mega{ display:block; }
  .mnav-mega__inner{ display:block; padding:0; }
  .mnav-group-list{ border-right:none; }
  .mnav-group-btn{ border-bottom:1px solid var(--mnav-cream-dim); }
  .mnav-panel{ grid-template-columns:1fr; padding:1rem 0 1.25rem .5rem; }
  .mnav-panel__links{ column-count:1; }
  .mnav-promo{ display:none; }

  .mnav__utilities{
    position:fixed; left:0; right:0; bottom:0; background:var(--mnav-cream);
    border-top:1px solid var(--mnav-cream-dim); padding:.9rem 1.25rem; justify-content:space-around;
  }
  .mnav__menu-wrap{ padding-bottom:70px; }
}
