/* ── Mobile menu ── */
.mobile-menu {
  position: fixed;
  top: 56px;
  left: 0;
  width: 100%;
  overflow: hidden;
  max-height: 0;
  background: rgba(255,255,255,.98);
  backdrop-filter: blur(12px);
  opacity: 0;
  pointer-events: none;
  z-index: 1000;
  transition: max-height .25s cubic-bezier(.4,0,.2,1), opacity .2s;
 border:1px solid var(--border);box-shadow:0 4px 16px rgba(0,0,0,0.06);

}

.mobile-menu.open {
  max-height: 400px;
  opacity: 1;
  pointer-events: auto;
}

.mobile-nav {
  max-width: 1152px;
  margin-inline: auto;
  padding: 12px 1rem;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 1px
}

.mobile-nav a {
  padding: 10px 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--fg);
  border-radius: var(--radius-sm);
  transition: background .15s;
  /* background: var(--primary-10); */
  width: 100%;
  font-weight: bolder;
  text-align: center;
  /* border: 1px solid black; */
}

.mobile-nav a:hover {
  background: var(--secondary)
}

.mobile-divider {
  height: 1px;
  background: var(--border);
  margin: 4px 0
}

.mobile-wa {
  display: flex !important;
  align-items: center;
  gap: 8px;
  color: var(--wa) !important;
  font-weight: 600 !important
}

.mobile-wa:hover {
  background: hsl(145 63% 42% / 0.08) !important
}

.btn-full{width:100%;justify-content:center;margin-top:8px;padding:12px 16px;border-radius:var(--radius)}



/* Responsive helpers */
.hide-mobile{display:none}
.show-mobile{display:flex}
@media(min-width:768px){.hide-mobile{display:flex}.show-mobile{display:none !important}}

.hide-mobile-sm{display:none}
.show-mobile-sm{display:flex}
@media(min-width:640px){.hide-mobile-sm{display:flex}.show-mobile-sm{display:none !important} }

@media(max-width:640px){
.btn-search{display: none !important;}
}

@media(max-width:768px){
.btn-wa-nav{
  display: none !important;
}
}