/* Main menu. Brand and an always-visible Get Approved button on top; the section links run underneath in one row.
   Careers, Book a Visit and Contact always sit at the end of that row. On tablets and phones the whole row folds into the header and the Menu
   arrow opens it as a panel of gold-trimmed links under the bar. */
html{scroll-padding-top:110px}
/* The gold line along the top of the header stays still: its moving white highlight read as a flash across the menu */
header:before{animation:none;background-position:50% 0}
nav.wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;padding:12px 0 8px}
.nav-side{display:flex;align-items:center;gap:8px;margin-left:auto}
.nav-side .nav-cta{display:inline-flex;align-items:center;padding:10px 18px;border-radius:30px;font:700 13.5px/1 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;white-space:nowrap;background:linear-gradient(145deg,#f3dc9e,#c9a24f);color:#111;box-shadow:0 6px 20px #d9b96f40;transition:transform .2s,background .2s}
.nav-side .nav-cta:hover{transform:translateY(-1px);background:linear-gradient(145deg,#fff1c7,#d9b96f)}

/* Gold arrow toggle: points down when closed, flips up when open */
.nav-tg{position:relative;display:inline-grid;grid-auto-flow:column;align-items:center;gap:8px;cursor:pointer;color:#f3dc9e;font:700 13.5px/1 Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;transition:border-color .25s,background .25s,box-shadow .25s,transform .25s}
.nav-tg i{display:block;width:8px;height:8px;margin-top:-4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .35s cubic-bezier(.2,.8,.2,1),margin .35s}
nav.open .nav-tg-m i{transform:rotate(225deg);margin-top:4px}
.nav-tg-m{display:none;padding:10px 16px;border-radius:30px;border:1px solid #d9b96f77;background:#ffffff08}
.nav-tg-m:hover,nav.open .nav-tg-m{border-color:var(--gold);background:#d9b96f1a;color:#fff}

.navlinks{order:3;flex:1 0 100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;padding-top:6px;border-top:1px solid #ffffff10}
.navlinks a{padding:8px 8px;font-size:12.5px;white-space:nowrap}
.navlinks a.nav-sv{border:1px solid #d9b96f55;color:#f3dc9e}
.navlinks a.nav-sv:hover,.navlinks a.nav-sv.on{border-color:var(--gold)}

/* Live Auction: red pill with a blinking live dot so it stands out from the other links (no pulsing ring: it flashed over the links below) */
.navlinks a.nav-live{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin:0 4px;background:linear-gradient(145deg,#ff2a1f,#d4110f);border:1px solid #ff6a5e;color:#fff;font-weight:900;box-shadow:0 4px 16px #d4110f66}
.navlinks a.nav-live:before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff;animation:navLiveBlink 1s steps(2) infinite}
.navlinks a.nav-live:after{display:none}
.navlinks a.nav-live:hover,.navlinks a.nav-live.on{color:#fff;background:linear-gradient(145deg,#ff3d33,#e0110d);border-color:#fff}
@keyframes navLiveBlink{50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.navlinks a.nav-live,.navlinks a.nav-live:before{animation:none}}

/* Hidden links: folded to zero width, then slide out in line */
.nav-extra{display:inline-flex;align-items:center;gap:2px}
.nav-extra:before{content:"";flex:none;width:1px;height:18px;margin:0 6px;background:linear-gradient(180deg,transparent,var(--gold),transparent)}

@media(max-width:1100px){
html{scroll-padding-top:70px}
nav.wrap{padding:10px 0}
.nav-tg-m{display:inline-grid}
.navlinks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:0;overflow:hidden;padding:0;border-top:0;opacity:0;visibility:hidden;transition:max-height .5s cubic-bezier(.2,.8,.2,1),opacity .3s,padding .5s,visibility 0s .5s}
nav.open .navlinks{max-height:calc(100vh - 80px);overflow-y:auto;overscroll-behavior:contain;padding:12px 0 6px;border-top:1px solid #d9b96f33;opacity:1;visibility:visible;transition:max-height .5s cubic-bezier(.2,.8,.2,1),opacity .35s .05s,padding .5s,visibility 0s}
.navlinks a{padding:12px 14px;border-radius:14px;border:1px solid #ffffff14;background:linear-gradient(160deg,#ffffff0a,#ffffff03);font-size:13px;white-space:normal;text-align:center}
.navlinks a:after{display:none}
.navlinks a.nav-sv{grid-column:1/-1;background:linear-gradient(160deg,#d9b96f22,#ffffff05)}
.navlinks a.nav-live{margin:0;border-radius:14px;background:linear-gradient(145deg,#ff2a1f,#d4110f);border-color:#ff6a5e}
.nav-extra{display:contents}
.nav-extra:before{display:none}
}
@media(max-width:480px){
.nav-side{gap:6px}
.nav-side .nav-cta,.nav-tg-m{padding:9px 12px;font-size:12px;letter-spacing:.08em}
nav.wrap .brand .bt b{font-size:14px}
nav.wrap .brand .bt small{display:none}
}
@media(max-width:420px){nav.wrap .brand .bt{display:none}}

/* Phones and tablets: an easy-to-spot Menu button (three-line icon, the word Menu and the current page), and a solid,
   high-contrast menu panel with big tap targets. The page behind is dimmed and held still while the menu is open. */
.nav-dim,.nav-h{display:none}
@media(max-width:1100px){
.nav-tg-m{min-height:46px;padding:6px 16px 6px 12px;gap:10px;border:2px solid var(--gold);background:linear-gradient(145deg,#d9b96f33,#d9b96f12);color:#fff;box-shadow:0 0 0 3px #d9b96f1f,0 6px 18px #0008;text-align:left}
.nav-tg-m span{display:flex;flex-direction:column;gap:3px;min-width:0}
.nav-tg-m b{font-size:15px;letter-spacing:.12em}
.nav-tg-m small{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:none;color:#f3dc9e}
.nav-tg-m small:empty{display:none}
.nav-tg-m i,nav.open .nav-tg-m i{position:relative;width:20px;height:14px;margin:0;border:0;border-top:2.5px solid #f3dc9e;border-bottom:2.5px solid #f3dc9e;border-radius:1px;transform:none;transition:border-color .2s}
.nav-tg-m i:before,.nav-tg-m i:after{content:"";position:absolute;left:0;right:0;top:50%;height:2.5px;margin-top:-1.25px;border-radius:1px;background:#f3dc9e;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
nav.open .nav-tg-m i{border-color:transparent}
nav.open .nav-tg-m i:before{transform:rotate(45deg)}
nav.open .nav-tg-m i:after{transform:rotate(-45deg)}
html.menu-open{overflow:hidden}
html.menu-open header{background:#0b0d10;backdrop-filter:none;-webkit-backdrop-filter:none}
.nav-dim{display:block;position:fixed;inset:0;z-index:9;background:#000b;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s}
html.menu-open .nav-dim{opacity:1;visibility:visible;transition:opacity .3s}
nav.open .navlinks{max-height:calc(100dvh - 76px);padding:14px 0 18px;border-top:1px solid #d9b96f66}
.nav-h{display:flex;grid-column:1/-1;align-items:center;justify-content:space-between;gap:10px;padding:0 2px 4px}
.nav-h b{font-size:13px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.nav-h button{min-height:40px;padding:8px 14px;border-radius:30px;border:1px solid #ffffff40;background:#ffffff0d;color:#fff;font:700 13px/1 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.navlinks{gap:8px}
.navlinks a{display:flex;align-items:center;justify-content:center;min-height:52px;padding:12px 14px;border:1px solid #ffffff38;background:#1a1e25;color:#fff;font-size:16px;font-weight:700;letter-spacing:.02em}
.navlinks a:hover,.navlinks a:focus-visible{border-color:var(--gold);background:#242a33}
/* The page the visitor is on stands out in gold */
.navlinks a.on:not(.nav-live,.nav-rw,.nav-sv){border:2px solid var(--gold);background:linear-gradient(145deg,#d9b96f40,#d9b96f1a);color:#fff3cf}
.navlinks a.on:not(.nav-live,.nav-rw,.nav-sv):before{content:"✓";margin-right:8px;color:var(--gold);font-weight:900}
.navlinks a.nav-sv{font-size:16px}
.navlinks a.nav-rw{min-height:52px;font-size:15px}
}
/* On phones the Pages / One page switch lives in the menu, which leaves room for a clear Menu button */
@media(max-width:700px){.nav-side>.lay{display:none}}
@media(max-width:480px){
.nav-tg-m{padding:5px 12px 5px 10px;gap:8px}
.nav-tg-m b{font-size:14px;letter-spacing:.1em}
.nav-tg-m small{max-width:80px}
.navlinks a{font-size:15px;padding:10px}
}
@media(max-width:360px){.navlinks{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.nav-dim,.nav-tg-m i:before,.nav-tg-m i:after{transition:none}}
/* Floating helpers step aside while the menu is open, and nothing can push the page sideways on a phone */
html.menu-open :is(.app-pill,.cx-dock){visibility:hidden!important;opacity:0!important}
@media(max-width:700px){
body{overflow-x:clip}
}
