/* ==========================================================================
   MALUJIWALA STONE — Sitewide search
   Uses the site's own tokens (--ink, --gold, --bg, --line, --white ...).
   Falls back to literal values so the panel still renders correctly if a
   page is ever served without the token block.
   ========================================================================== */

.mjs-open-btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'Jost',sans-serif;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  color:var(--ink-2,#4a4035);
  background:transparent;
  border:1px solid var(--line,#cec5b4);
  padding:9px 14px;
  cursor:pointer;
  white-space:nowrap;
  transition:border-color .2s,color .2s,background .2s;
  -webkit-appearance:none;appearance:none;
  border-radius:0;
}
.mjs-open-btn:hover{border-color:var(--gold,#8a6830);color:var(--ink,#1e1a14);background:var(--white,#fdf9f4);}
.mjs-open-btn:focus-visible{outline:2px solid var(--gold,#8a6830);outline-offset:2px;}
.mjs-open-btn svg{width:15px;height:15px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;}
.mjs-open-label{display:inline;}
.mjs-kbd{
  font-family:'Jost',sans-serif;font-size:10px;line-height:1;
  border:1px solid var(--line,#cec5b4);
  padding:3px 5px;margin-left:2px;
  color:var(--ink-3,#6e6250);letter-spacing:.06em;
}

/* Icon-only trigger that sits next to the hamburger on small screens */
.mjs-open-btn.mjs-compact{display:none;padding:0;border:0;width:44px;min-width:44px;height:44px;flex:none;
  align-items:center;justify-content:center;color:var(--ink,#1e1a14);}
.mjs-open-btn.mjs-compact:hover{background:transparent;}
.mjs-open-btn.mjs-compact svg{width:20px;height:20px;stroke-width:1.6;}

/* 1080px is where .nav-links hides and .hamburger appears, so the full
   trigger swaps for the icon-only one at exactly the same point. */
@media(max-width:1080px){
  .mjs-open-btn.mjs-desktop{display:none;}
  .mjs-open-btn.mjs-compact{display:inline-flex;}
}

/* ---------- Overlay ---------- */
.mjs-overlay{
  position:fixed;inset:0;z-index:2000;
  display:none;
  background:rgba(30,26,20,.42);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.mjs-overlay.mjs-on{display:block;}
body.mjs-locked{overflow:hidden;}

.mjs-panel{
  background:var(--white,#fdf9f4);
  border-bottom:1px solid var(--line,#cec5b4);
  box-shadow:0 24px 48px rgba(30,26,20,.18);
  max-height:100vh;max-height:100dvh;
  display:flex;flex-direction:column;
  transform:translateY(-14px);opacity:0;
  transition:transform .26s cubic-bezier(.22,.61,.36,1),opacity .2s ease;
}
.mjs-overlay.mjs-on .mjs-panel{transform:translateY(0);opacity:1;}

.mjs-inner{max-width:1320px;margin:0 auto;padding:0 48px;width:100%;}
@media(max-width:900px){.mjs-inner{padding:0 24px;}}

/* ---------- Search field ---------- */
.mjs-field{
  display:flex;align-items:center;gap:16px;
  padding:26px 0 18px;
  border-bottom:1px solid var(--line-s,#d8d1c3);
}
.mjs-field > svg{width:22px;height:22px;flex:none;stroke:var(--gold,#8a6830);fill:none;stroke-width:1.5;}
.mjs-input{
  flex:1;min-width:0;
  font-family:'Cormorant Garamond',serif;
  font-size:34px;font-weight:400;line-height:1.2;
  color:var(--ink,#1e1a14);
  background:transparent;border:0;outline:none;
  padding:2px 0;
  -webkit-appearance:none;appearance:none;border-radius:0;
}
.mjs-input:focus,.mjs-input:focus-visible{outline:none;box-shadow:none;border:0;}
.mjs-input::placeholder{color:var(--ink-3,#6e6250);opacity:.75;}
.mjs-input::-webkit-search-cancel-button{display:none;}
.mjs-close{
  flex:none;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:transparent;border:0;cursor:pointer;color:var(--ink-2,#4a4035);
  transition:color .2s;
}
.mjs-close:hover{color:var(--ink,#1e1a14);}
.mjs-close:focus-visible{outline:2px solid var(--gold,#8a6830);outline-offset:-2px;}
.mjs-close svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;}

/* ---------- Meta line ---------- */
.mjs-meta{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:12px 0 4px;
  font-family:'Jost',sans-serif;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3,#6e6250);
}
.mjs-hints{display:flex;gap:16px;}
@media(max-width:760px){.mjs-hints{display:none;}}

/* ---------- Results ---------- */
.mjs-results{
  overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:28px;
  overscroll-behavior:contain;
}
.mjs-group-head{
  font-family:'Jost',sans-serif;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--gold-d,#755526);
  padding:22px 0 8px;
  border-bottom:1px solid var(--line-s,#d8d1c3);
  margin-bottom:2px;
}
.mjs-hit{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:baseline;
  gap:8px 24px;
  padding:13px 14px 13px 0;
  text-decoration:none;
  border-bottom:1px solid rgba(206,197,180,.45);
  transition:background .15s,padding-left .15s;
}
.mjs-hit:hover,.mjs-hit.mjs-sel{
  background:var(--bg,#f5f0e8);
  padding-left:14px;
}
.mjs-hit:focus-visible{outline:2px solid var(--gold,#8a6830);outline-offset:-2px;}
.mjs-hit-t{
  font-family:'Cormorant Garamond',serif;
  font-size:21px;font-weight:500;color:var(--ink,#1e1a14);
  line-height:1.25;
}
.mjs-hit-t mark{
  background:rgba(184,154,98,.32);color:inherit;padding:0 1px;
}
.mjs-hit-d{
  grid-column:1;
  font-family:'Jost',sans-serif;font-size:13px;line-height:1.5;
  color:var(--ink-3,#6e6250);
  margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.mjs-price{
  grid-row:1;grid-column:2;
  font-family:'Jost',sans-serif;
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold-d,#755526);white-space:nowrap;font-weight:500;
}
.mjs-price b{font-weight:600;font-size:13px;letter-spacing:.04em;}

/* ---------- Empty / suggestions ---------- */
.mjs-suggest{padding:22px 0 8px;}
.mjs-suggest-head{
  font-family:'Jost',sans-serif;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;font-weight:600;color:var(--gold-d,#755526);
  margin-bottom:14px;
}
.mjs-chips{display:flex;flex-wrap:wrap;gap:9px;}
.mjs-chip{
  font-family:'Jost',sans-serif;font-size:13px;
  color:var(--ink-2,#4a4035);
  background:var(--bg,#f5f0e8);
  border:1px solid var(--line,#cec5b4);
  padding:8px 15px;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s;
  border-radius:0;-webkit-appearance:none;appearance:none;
  min-height:36px;
}
.mjs-chip:hover{border-color:var(--gold,#8a6830);color:var(--ink,#1e1a14);background:var(--white,#fdf9f4);}
.mjs-chip:focus-visible{outline:2px solid var(--gold,#8a6830);outline-offset:2px;}

.mjs-none{
  padding:34px 0 30px;
  font-family:'Cormorant Garamond',serif;
  font-size:22px;color:var(--ink-2,#4a4035);
}
.mjs-none span{
  display:block;margin-top:10px;
  font-family:'Jost',sans-serif;font-size:14px;color:var(--ink-3,#6e6250);
}
.mjs-none a{color:var(--gold-d,#755526);text-decoration:underline;text-underline-offset:3px;}

.mjs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- Small screens ---------- */
@media(max-width:760px){
  .mjs-input{font-size:26px;}
  .mjs-field{padding:18px 0 14px;gap:12px;}
  .mjs-field > svg{width:19px;height:19px;}
  .mjs-hit{grid-template-columns:1fr;padding:12px 0;}
  .mjs-price{grid-row:auto;grid-column:1;margin-top:5px;}
  .mjs-hit-t{font-size:19px;}
  .mjs-hit:hover,.mjs-hit.mjs-sel{padding-left:8px;}
}

@media(prefers-reduced-motion:reduce){
  .mjs-panel{transition:none;transform:none;}
  .mjs-hit{transition:none;}
}