.hdr .row{gap:20px}.site-menu{position:relative;flex:none;margin-left:auto;color:#f5f3ed}.site-menu summary{display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;padding:12px 17px;border:1px solid #c6a35e;border-radius:5px;background:#101216;font:600 15px/1.2 system-ui;color:#f5f3ed;white-space:nowrap}.site-menu summary::-webkit-details-marker{display:none}.site-menu-icon{display:inline-flex;flex-direction:column;gap:4px;width:18px}.site-menu-icon i{height:2px;width:18px;background:currentColor}.site-menu summary:focus-visible,.site-menu-panel :focus-visible{outline:2px solid #36cd76;outline-offset:3px}.site-menu-panel{position:absolute;right:0;top:calc(100% + 10px);display:grid;min-width:220px;padding:8px;background:#101216;border:1px solid #c6a35e;border-radius:5px;box-shadow:0 16px 40px #0009;z-index:1000}.site-menu-panel a,.site-menu-panel button{display:block;width:100%;box-sizing:border-box;text-align:left;padding:13px 15px;background:transparent;border:0;border-radius:3px;color:#f5f3ed;font:500 16px/1.4 system-ui;text-decoration:none;white-space:nowrap;cursor:pointer}.site-menu-panel a:hover,.site-menu-panel button:hover{background:#24272b}.site-menu-panel .site-menu-login{color:#36cd76}.hdr .nav{margin-left:auto}.hdr .site-menu{margin-left:0}@media(max-width:900px){.hdr .nav{display:none!important}.hdr .site-menu{margin-left:auto}.hdr .row{gap:10px}.site-menu summary{padding:10px 12px}.site-menu-panel{min-width:210px;max-width:calc(100vw - 32px)}}

/* Text-only Menu keeps navigation typography and shares Contact button gold trim/hover. */
.hdr .site-menu summary{padding:11px 20px;border:1px solid var(--gold-1);border-radius:0;background:transparent;font-family:var(--sans);font-size:13.17px;font-weight:500;line-height:1.75;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);transition:color .5s var(--ease)}.hdr .site-menu summary:hover{color:var(--paper)}.hdr .brand{color:#fff}

/* Keep the framed Menu inside narrow phone headers. */
@media(max-width:600px){.hdr .row{gap:4px}.hdr .site-menu summary{padding:8px 10px;font-size:11px;letter-spacing:.22em;min-height:44px;box-sizing:border-box}}

/* ───────────────────────────────────────────────────────────────────────────
   PORTRAIT-PHONE HAMBURGER — 2026-11-04, SC 5.5 · 44.
   Ron: "lets make menu a hamuberger icon that includes our desktop navbar items
   in mobile portview only."  mobile-nav.js copies the five primary links into
   the panel; this draws the icon and sets the panel out legibly. Nothing here
   applies in landscape or above 900px, so the desktop navbar is untouched.
   ─────────────────────────────────────────────────────────────────────────── */
@media(max-width:900px) and (orientation:portrait) {
  /* Three bars painted as one background. The first attempt used ::before/::after on the
     <summary> and only the middle stripe ever rendered, so this draws all three the same
     way — one declaration, nothing for the theme's own pseudo-elements to collide with. */
  .hdr .site-menu > summary.btn {
    width:46px;
    height:40px;
    padding:0;
    font-size:0;
    line-height:0;
    list-style:none;
    background-image:
      linear-gradient(currentColor,currentColor),
      linear-gradient(currentColor,currentColor),
      linear-gradient(currentColor,currentColor);
    background-size:24px 2.5px;
    background-position:center calc(50% - 7px),center,center calc(50% + 7px);
    background-repeat:no-repeat;
  }
  .hdr .site-menu > summary.btn::-webkit-details-marker { display:none }
  .hdr .site-menu > summary.btn::marker { content:"" }
  /* the five primary links, copied in by mobile-nav.js, read as the top group */
  .site-menu-panel .site-menu-primary {
    display:grid;
    padding:0 0 10px;
    margin:0 0 10px;
    border-bottom:1px solid rgba(216,173,78,.28);
  }
  .site-menu-panel .site-menu-primary a { font-weight:700 }
  .site-menu-panel a,
  .site-menu-panel button,
  .site-menu-panel summary { font-size:17px; padding:11px 14px }
}

/* ───────────────────────────────────────────────────────────────────────────
   MENU, 2026-11-04 (Ron): "no hover effect on menu button in desktop; sub desktop should be
   in mobile style; menu drop down should have zero decoration; in mobile it should have
   desktop navbar items first then rest."
   SUB = every screen below full desktop — the same query as the mobile hero
   (hero-mobile.css): up to 1200px, plus touch tablets up to 1400px.
   ─────────────────────────────────────────────────────────────────────────── */
/* Desktop MENU button: no hover effect (no gold wipe, glow or colour change). */
.hdr .site-menu > summary.btn:hover,
.hdr .site-menu[open] > summary.btn { color:var(--mute); box-shadow:none }
.hdr .site-menu > summary.btn::before { display:none }
.hdr .site-menu > summary.btn { transition:none }

/* Drop-down: zero decoration — no frame, rounding, shadow, dividers or hover fills. */
.site-menu-panel { border:0; border-radius:0; box-shadow:none; background:#07070a }
.site-menu-panel a:hover, .site-menu-panel button:hover { background:transparent }
.site-menu-panel .site-menu-primary { border-bottom:0 }
.hdr .site-menu-panel .legacy-subnet-menu > summary {
  border:0; border-radius:0; background:transparent; box-shadow:none;
  padding:13px 15px; min-height:0;
  font:500 16px/1.4 system-ui; letter-spacing:normal; text-transform:none; color:#f5f3ed
}
.hdr .site-menu-panel .legacy-subnet-menu > summary:hover { color:#f5f3ed }
.site-menu-panel .legacy-subnet-links { border-left:0 }

/* Below full desktop: the mobile hamburger, no border, nav links live in the drop-down. */
@media (max-width:1200px), (hover:none) and (pointer:coarse) and (max-width:1400px) {
  .hdr .nav { display:none!important }
  .hdr .site-menu { margin-left:auto }
  .hdr .site-menu > summary.btn,
  .hdr .site-menu > summary.btn:hover,
  .hdr .site-menu > summary.btn:focus,
  .hdr .site-menu[open] > summary.btn {
    width:46px; height:40px; min-height:0; padding:0;
    font-size:0; line-height:0; list-style:none;
    border:0; border-radius:0; box-shadow:none; transition:none;
    color:var(--paper); background-color:transparent;
    background-image:
      linear-gradient(currentColor,currentColor),
      linear-gradient(currentColor,currentColor),
      linear-gradient(currentColor,currentColor);
    background-size:24px 2.5px;
    background-position:center calc(50% - 7px),center,center calc(50% + 7px);
    background-repeat:no-repeat
  }
  .hdr .site-menu > summary.btn::-webkit-details-marker { display:none }
  .hdr .site-menu > summary.btn::marker { content:"" }
  .hdr .site-menu > summary.btn:focus:not(:focus-visible) { outline:none }
  .site-menu-panel .site-menu-primary { display:grid; padding:0; margin:0 }
  .site-menu-panel .site-menu-primary a { font-weight:700 }
  .site-menu-panel a, .site-menu-panel button,
  .hdr .site-menu-panel .legacy-subnet-menu > summary { font-size:17px; padding:11px 14px }
}

/* Nav bar items: white, matched to the wordmark size. Ron, 2026-11-05.
   .brand span is 15.67px (style.css:430); nav links and the Menu label were 13.17px
   in var(--mute). Appended here because navbar-menu.css is the last stylesheet the
   header loads, so this overrides by cascade order without editing style.css.
   The Menu box keeps its gold border - only the label colour and size change. */
.hdr .nav a { font-size:15.67px; color:#fff }
.hdr .site-menu > summary,
.hdr .site-menu > summary.btn { font-size:15.67px; color:#fff }

/* Phone fit. The 2026-11-05 change set nav + Menu to the wordmark size
   (15.67px); on a 390px viewport that pushes the Menu button past the right
   edge. Desktop keeps the matched size - only phones step back down. */
@media(max-width:900px){
  .hdr .brand,.hdr .brand span{font-size:13px;letter-spacing:.24em}
  .hdr .site-menu>summary,.hdr .site-menu>summary.btn{
    font-size:12.5px;letter-spacing:.18em;padding:9px 12px}
}
