/* Shared navigation for Inicio and Productos. Brand palette and SVG icons only. */
#nav.brand-nav {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:clamp(20px,3vw,48px);
  width:100%;
  min-height:92px;
  padding:20px var(--pad);
  background:#f5f2ec;
  color:#15120e;
  border-bottom:1px solid transparent;
}
#nav.brand-nav.scrolled {
  min-height:78px;
  padding:13px var(--pad);
  background:color-mix(in srgb,#f5f2ec 94%,transparent);
  border-bottom-color:rgba(21,18,14,.08);
}
#nav.brand-nav .logo {grid-column:1;grid-row:1;justify-self:start;line-height:0}
#nav.brand-nav .wordmark {width:158px;height:34px;background-position:center;background-size:contain}
#nav.brand-nav.scrolled .wordmark {width:150px}
#nav.brand-nav .nav-links {display:contents}
#nav.brand-nav .nav-group {display:flex;align-items:center;gap:clamp(18px,2.1vw,34px);grid-row:1}
#nav.brand-nav .nav-group-center {grid-column:2;justify-self:center}
#nav.brand-nav .nav-group-right {grid-column:3;justify-self:end}
#nav.brand-nav .nav-links a {font-size:13px;font-weight:500;letter-spacing:0;color:#15120e;white-space:nowrap}
#nav.brand-nav .nav-links a:not(.nav-cta)::after {background:#15120e}
#nav.brand-nav .nav-links a.nav-cta {
  display:inline-flex;align-items:center;gap:15px;
  padding:6px 6px 6px 18px;border:1px solid #15120e;border-radius:999px;
  min-height:44px;background:#15120e;color:#f5f2ec;
}
#nav.brand-nav .nav-links a.nav-cta:hover {background:#4a443b;border-color:#4a443b;color:#f5f2ec}
#nav.brand-nav .nav-cta-icon {display:grid;place-items:center;width:30px;height:30px;flex-shrink:0;border-radius:50%;background:rgba(245,242,236,.14);color:#f5f2ec}
#nav.brand-nav .nav-cta-icon svg {display:block;width:16px;height:16px;padding:0;background:none;stroke:currentColor}
#nav.brand-nav :is(a,button):focus-visible {outline:2px solid #6b6156;outline-offset:5px}
#nav.brand-nav .nav-toggle {display:none}
@media(max-width:900px) {
  #nav.brand-nav,#nav.brand-nav.scrolled {min-height:76px;padding:13px var(--pad);gap:12px}
  #nav.brand-nav .wordmark,#nav.brand-nav.scrolled .wordmark {width:144px;height:32px}
  #nav.brand-nav .nav-toggle {grid-column:3;grid-row:1;justify-self:end;display:grid;place-items:center;position:relative;z-index:110;width:44px;height:44px;color:#15120e}
  #nav.brand-nav .nav-links {
    display:none;position:absolute;inset:100% 0 auto;width:100%;height:auto;
    max-height:calc(100dvh - 76px);overflow-y:auto;transform:none;transition:none;
    padding:16px var(--pad) 26px;background:#f5f2ec;
    border:0;border-bottom:1px solid rgba(21,18,14,.12);
    box-shadow:0 18px 24px rgba(21,18,14,.04);
  }
  #nav.brand-nav.open .nav-links {display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0}
  #nav.brand-nav .nav-group {display:contents}
  #nav.brand-nav .nav-links a {font-size:16px;padding:13px 0;min-height:44px}
  #nav.brand-nav .nav-links a.nav-cta {font-size:13px;margin-top:13px;padding:7px 7px 7px 20px;justify-content:space-between;align-self:stretch}
}
@media(prefers-reduced-motion:reduce) {
  #nav.brand-nav,#nav.brand-nav * {transition:none}
}