/* lc-nav.css — mobile dialog hierarchy.
 *
 * The menu gained a third level (section → group heading → link). The theme styles
 * a nav header LOUDER than a top-level item, so after the migration "SHOP" rendered
 * at 40% white while its own eyebrow "SAVANNAH & THE SOUTH" sat at 100% — the
 * hierarchy read upside down. This puts it back: the section is the loudest row,
 * the group is a quiet eyebrow, the links carry ordinary text weight. Every colour
 * here is one the bar already used; nothing new is introduced.
 *
 * The doubled `.uk-offcanvas-bar` is deliberate — theme.css targets these elements
 * at three classes deep (`.tm-toolbar-default .uk-nav-default > li > a`), so a
 * single-scope selector ties and loses. Desktop is untouched: the mega menus draw
 * their own markup.
 */

/* section — the loudest row */
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav > li > a {
  color: #fff;
  font-size: .82rem;
  letter-spacing: .14em;
}
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav > li + li {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

/* group heading — a quiet eyebrow, not a headline */
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav-sub > li.uk-nav-header {
  color: rgba(255, 255, 255, .42);
  font-size: .64rem;
  letter-spacing: .18em;
  margin-top: 20px;
}
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav-sub > li.uk-nav-header:first-child {
  margin-top: 10px;
}

/* links — readable, below the section, above the eyebrow */
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav-sub > li > a {
  color: rgba(255, 255, 255, .72);
}
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav-sub > li > a:hover,
.uk-offcanvas-bar.uk-offcanvas-bar .uk-nav-sub > li > a:focus {
  color: #fff;
}