/* Grand Emirates — desktop mega-menu (Services / Areas).
   Selectors are scoped to nav.menu so they outrank the site's own nav rules
   regardless of stylesheet load order. Mobile keeps the existing accordion. */

nav.menu .ge-dd{position:relative;display:inline-flex;align-items:center}
nav.menu .ge-dd>.ge-dd-t{display:inline-flex;align-items:center;gap:5px}
nav.menu .ge-dd .ge-dd-c{opacity:.55;flex:none;transition:transform .3s ease}
nav.menu .ge-dd .ge-dd-p{display:none}

@media(min-width:1181px){
 nav.menu .ge-dd .ge-dd-p{
  display:block;position:absolute;top:100%;left:50%;transform:translate(-50%,12px);
  min-width:min(1180px,96vw);background:#fdfcf8;
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid rgba(14,32,25,.10);border-radius:3px;
  box-shadow:0 34px 80px rgba(14,32,25,.16),0 2px 6px rgba(14,32,25,.05);
  padding:30px 34px 24px;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.3,1),visibility .3s;z-index:130}
 nav.menu .ge-dd .ge-dd-p::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
 nav.menu .ge-dd:hover>.ge-dd-p,
 nav.menu .ge-dd:focus-within>.ge-dd-p,
 nav.menu .ge-dd.open>.ge-dd-p{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
 nav.menu .ge-dd:hover .ge-dd-c,nav.menu .ge-dd.open .ge-dd-c{transform:rotate(180deg)}

 nav.menu .ge-dd .ge-dd-g{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px 24px;align-items:start}
 nav.menu .ge-dd .ge-dd-g.cols3{grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 30px}
 nav.menu .ge-dd .ge-dd-g.cols4{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 30px}
 /* below 1400px six columns get cramped, so fold to three rows of two */
 @media(max-width:1400px){nav.menu .ge-dd .ge-dd-g{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 26px}}
 nav.menu .ge-dd .ge-dd-col{display:flex;flex-direction:column;min-width:0}

 nav.menu .ge-dd .ge-dd-p a{
  display:block;width:100%;white-space:normal;min-height:0;
  padding:5px 0;margin:0;font-size:.8rem;line-height:1.38;hyphens:none;
  text-align:left;letter-spacing:0;text-transform:none;opacity:.86;
  transition:opacity .2s,color .2s}
 nav.menu .ge-dd .ge-dd-p a::after{display:none;content:none}
 nav.menu .ge-dd .ge-dd-p a:hover{opacity:1;color:var(--em,#0e2019)}

 nav.menu .ge-dd .ge-dd-p .ge-dd-h{
  display:block;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  opacity:.5;margin:0 0 10px;padding:0 0 10px;font-weight:500;
  border-bottom:1px solid rgba(14,32,25,.10)}
 nav.menu .ge-dd .ge-dd-p a.ge-dd-h:hover{opacity:.85}

 nav.menu .ge-dd .ge-dd-f{margin-top:20px;padding-top:15px;
  border-top:1px solid rgba(14,32,25,.10);display:flex;gap:26px;flex-wrap:wrap}
 nav.menu .ge-dd .ge-dd-f a{width:auto;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;opacity:.7}
}

@media(max-width:1180px){
 /* In the mobile panel the trigger must look and behave exactly like a normal menu link. */
 nav.menu .ge-dd{display:flex;width:100%;justify-content:center}
 nav.menu .ge-dd>.ge-dd-t{display:inline-flex;width:auto;min-height:0;
  align-items:center;gap:0}
 nav.menu .ge-dd .ge-dd-c{display:none}
 nav.menu .ge-dd .ge-dd-p{display:none}
}
@media(prefers-reduced-motion:reduce){
 nav.menu .ge-dd .ge-dd-p,nav.menu .ge-dd .ge-dd-c{transition:none}
}