:root { --util-bar-height: 4.2rem; --main-nav-height: 6rem; }

[data-site-nav] { display: contents; }

.util-bar { background: var(--oxford-dk); border-bottom: 2px solid var(--gold); }
.util-inner { max-width: 1200px; margin: 0 auto; padding: 0 2rem; display: flex; align-items: center; justify-content: space-between; height: var(--util-bar-height); }
.util-ox { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.util-ox img { height: 2.6rem; width: auto; filter: brightness(1.1) contrast(1.1); }

html { scroll-behavior: smooth; scroll-padding-top: var(--main-nav-height); }
.main-nav { position: sticky; top: 0; z-index: 200; width: 100%; background: rgba(255,255,255,0.97); border-bottom: 1px solid var(--rule); box-shadow: 0 1px 8px rgba(0,33,71,0.07); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: box-shadow 0.2s; backface-visibility: hidden; }
main { padding-top: 0; }
.nav-inner { max-width: 1200px; margin: 0 auto; padding: 0 2rem; display: flex; align-items: center; justify-content: flex-start; height: var(--main-nav-height); gap: 0; }
.nav-logo { display: inline-flex; align-items: center; height: 100%; flex-shrink: 1; min-width: 0; }
.nav-logo img { height: 4rem; width: auto; max-width: 100%; object-fit: contain; }
.nav-menu { display: flex; list-style: none; height: 100%; align-items: center; margin: 0 0 0 auto; padding: 0; }
.nav-menu li { display: flex; align-items: center; height: 100%; position: relative; }
.nav-menu li::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: transparent; pointer-events: none; transition: background-color 0.2s; }
.nav-menu li:hover::after, .nav-menu li:focus-within::after { background: var(--gold); }
.nav-menu a { font-size: 0.82rem; font-weight: 500; letter-spacing: 0.01em; color: var(--text-mid); text-decoration: none; padding: 0 1.1rem; display: flex; align-items: center; height: 100%; border-bottom: 0; transition: color 0.15s; white-space: nowrap; }
.nav-menu a:hover { color: var(--oxford); }
.nav-actions { display: flex; align-items: center; gap: 0; margin-left: 0; }
.nav-contact { display: inline-flex; align-items: center; justify-content: center; padding: 0.72rem 1rem; border: 1px solid rgba(0,33,71,0.12); background: var(--bg-tint); color: var(--oxford); border-radius: 999px; text-decoration: none; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; margin-left: 0; }

@media (max-width: 1100px) {
  .nav-menu a { padding: 0 0.6rem; font-size: 0.72rem; }
  .nav-inner { gap: 0.25rem; }
  .nav-menu { margin-left: auto; }
}

@media (max-width: 1100px) {
  .nav-menu { display: none; position: absolute; top: calc(100% + 0.35rem); right: 0.5rem; left: auto; width: 10rem; max-width: calc(100vw - 1.3rem); min-width: 0; list-style: none; flex-direction: column; align-items: stretch; justify-content: flex-start; white-space: normal; background: var(--bg-tint); border: 1px solid rgba(0,33,71,0.12); box-shadow: 0 8px 20px rgba(0,33,71,0.08); padding: 0; z-index: 30; overflow: hidden; height: auto; }
  .nav-menu.is-open { display: flex; }
  .nav-menu li { display: block; position: relative; height: auto; width: 100% !important; margin: 0 !important; padding: 0 !important; }
  .nav-menu li::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--rule-light); pointer-events: none; }
  .nav-menu a { display: block; padding: 5px 8px !important; font-size: 11px; line-height: 16px; min-height: 0; height: auto; border-bottom: 0; width: 100% !important; margin: 0 !important; background: var(--bg-tint); color: var(--oxford); box-sizing: border-box; }
  .nav-menu a:hover { background: #fff; box-shadow: inset 0 -2px 0 var(--gold); text-decoration: none; }
  .nav-menu li:last-child::after { background: transparent; }
  .nav-toggle { display: inline-flex; flex-direction: column; justify-content: center; align-items: stretch; width: 2.2rem; height: 2.2rem; border: 1px solid rgba(0,33,71,0.12); background: rgba(255,255,255,0.72); color: var(--oxford); border-radius: 999px; cursor: pointer; padding: 0.55rem 0.55rem 0.52rem; margin: 0; appearance: none; -webkit-appearance: none; box-shadow: 0 2px 6px rgba(0,33,71,0.04); transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease; }
  .nav-toggle span { display: block; width: 100%; height: 2px; background: currentColor; border-radius: 999px; margin: 0; transition: transform 0.2s ease, opacity 0.2s ease; }
  .nav-toggle span + span { margin-top: 0.34rem; }
  .nav-toggle.is-open span:nth-child(1) { transform: translateY(0.56rem) rotate(45deg); }
  .nav-toggle.is-open span:nth-child(2) { opacity: 0; }
  .nav-toggle.is-open span:nth-child(3) { transform: translateY(-0.56rem) rotate(-45deg); }
  .nav-contact { display: inline-flex; align-items: center; justify-content: center; padding: 0.5rem 0.7rem; border: 1px solid rgba(0,33,71,0.12); background: var(--bg-tint); color: var(--oxford); border-radius: 999px; text-decoration: none; font-size: 0.64rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; margin-left: 0; white-space: nowrap; }
  .nav-actions { display: flex; align-items: center; gap: 0.45rem; margin-left: auto; }
  .nav-inner { position: relative; padding: 0 1.25rem; min-height: 4.2rem; display: flex; align-items: center; justify-content: flex-start; }
  .nav-logo { flex: 0 0 auto; min-width: 0; }
  .nav-logo img { height: 4rem; width: auto; max-width: none; object-fit: contain; }
}

@media (max-width: 340px) {
  .nav-logo { max-width: 8.1rem; }
  .nav-logo img { width: 100% !important; max-width: 100% !important; height: auto; }
}

@media (max-width: 302px) {
  .nav-actions { display: none; }
  .nav-menu { display: none !important; }
}

@media (max-width: 198px) {
  .util-inner { overflow: hidden; }
  .util-ox { flex: 0 0 auto; }
  .util-ox img { height: 2.6rem; width: auto; max-width: none; }
}