/* Envision mega-menu dropdowns (v1.24). Loaded on EVERY page including the homepage so the navigation is identical everywhere.
   It only changes the dropdown panel composition: the approved nav pill, typography and hover system are left as they are. */
.eh .eh-nav .eh-drop.mega{display:grid!important;gap:6px 22px;padding:14px!important;min-width:0!important;width:max-content;max-width:min(900px,calc(100vw - 32px));border-radius:22px!important}
.eh .eh-nav .eh-drop.mega-3{grid-template-columns:repeat(3,262px)}
.eh .eh-nav .eh-drop.mega-1{grid-template-columns:minmax(250px,1fr)}
.eh .eh-nav .mega-col{display:grid;align-content:start;gap:2px}
.eh .eh-nav .mega h6{margin:2px 10px 8px;font:700 10.5px var(--disp);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)!important}
.eh .eh-nav .mega a:not(.mega-foot){display:flex!important;align-items:center;justify-content:flex-start!important;text-align:left;gap:12px;padding:8px 10px!important;border-radius:14px;color:#e6e9f2;transition:background .25s,transform .25s}
.eh .eh-nav .mega a:not(.mega-foot):hover{background:rgba(255,255,255,.06);transform:translateX(3px)}
.eh .eh-nav .mega .mi{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(241,201,28,.18),rgba(241,201,28,.04));border:1px solid rgba(241,201,28,.28);color:var(--gold);transition:.3s}
.eh .eh-nav .mega a:hover .mi{background:var(--gold);color:#0a0b0e;border-color:var(--gold)}
.eh .eh-nav .mega .mi svg{width:17px;height:17px}
.eh .eh-nav .mega .mt{display:grid;gap:1px;min-width:0;flex:1;justify-items:start}
.eh .eh-nav .mega .mt b{font:700 13.5px/1.25 var(--disp);color:#fff}
.eh .eh-nav .mega .mt small{font:500 11.5px/1.3 var(--body);color:var(--mut2)}
.eh .eh-nav .mega .mt small:empty{display:none}
.eh .eh-nav .mega-foot{grid-column:1/-1;display:flex!important;align-items:center;justify-content:space-between;margin:6px 4px 0;padding:11px 14px!important;border-radius:14px;background:rgba(241,201,28,.08);border:1px solid rgba(241,201,28,.22);color:var(--gold)!important;font:700 13px var(--disp)}
.eh .eh-nav .mega-foot svg{width:16px;height:16px;transition:transform .3s}.eh .eh-nav .mega-foot:hover svg{transform:translateX(4px)}
.eh .eh-nav .eh-nav-item.has-drop:hover .eh-drop,.eh .eh-nav .eh-nav-item.has-drop:focus-within .eh-drop,.eh .eh-nav .eh-nav-item.has-drop.open .eh-drop{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateX(-50%) translateY(0)}
.eh .eh-nav .eh-nav-item.is-current>a{color:var(--gold)}
.eh .eh-drawer .dd-h{display:block;font:700 10.5px var(--disp);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:12px 0 2px;font-style:normal}
.eh .eh-drawer .eh-dd-body{max-height:62vh;overflow:auto}
@media(max-width:1180px){.eh .eh-nav .eh-drop.mega-3{grid-template-columns:repeat(2,262px)}}
@media(max-width:860px){.eh .eh-nav .eh-drop.mega{display:none!important}}

.eh .eh-nav .mega a:not(.mega-foot) span:not(.mi):not(.mt){display:none}

/* v1.24.1: the pill was sized for four links (max-width 760px); with Services, Work, Products, Results, About and Contact it needs more room,
   and the call-to-action and links must never wrap. */
@media(min-width:861px){
	.eh .eh-nav{max-width:min(940px,calc(100% - 32px))}
	.eh .eh-nav-in{gap:8px;padding:0 8px 0 18px}
	.eh .eh-nav .eh-logo{flex:none}
	.eh .eh-nav .eh-nav-links{flex-wrap:nowrap;gap:0;margin-left:auto}
	.eh .eh-nav .eh-nav-item>a{white-space:nowrap;padding:8px 11px}
	.eh .eh-nav .eh-nav-cta{white-space:nowrap;flex:none;margin-left:6px;line-height:1.2}
}
@media(min-width:861px) and (max-width:1060px){
	.eh .eh-nav .eh-nav-item>a{padding:8px 9px;font-size:13px}
	.eh .eh-nav .eh-logo-img{height:30px;width:auto}
}

/* v1.24.2: the wide Services panel is positioned from the nav PILL (always centred in the window), not from its own link,
   so it can never run past the left or right edge at any zoom level or window width. */
.eh .eh-nav .eh-nav-in{position:relative}
.eh .eh-nav .eh-nav-item.has-drop.has-wide{position:static}
.eh .eh-nav .eh-nav-item.has-wide>.eh-drop.mega{left:50%;right:auto;top:calc(100% + 10px);transform:translateX(-50%) translateY(8px);width:max-content;max-width:calc(100vw - 32px)}
.eh .eh-nav .eh-nav-item.has-wide:hover>.eh-drop,.eh .eh-nav .eh-nav-item.has-wide:focus-within>.eh-drop,.eh .eh-nav .eh-nav-item.has-wide.open>.eh-drop{transform:translateX(-50%) translateY(0)}
/* narrower windows (or higher zoom): two columns, then a single scrollable column, always inside the viewport */
@media(max-width:1180px){.eh .eh-nav .eh-drop.mega-3{grid-template-columns:repeat(2,minmax(0,262px))}}
@media(max-width:980px){.eh .eh-nav .eh-drop.mega-3{grid-template-columns:minmax(0,300px);max-height:calc(100vh - 140px);overflow-y:auto}}
@media(max-height:760px){.eh .eh-nav .eh-drop.mega{max-height:calc(100vh - 110px);overflow-y:auto}}
