/* ============================================================
   VEKTOR SPACES — MEGAMENU + MOBILE MENU (v3)
   Relies on :root tokens defined by the page (v3.css or inline)
   ============================================================ */

/* ---------- Top-level items ---------- */
.nav__links{position:static}
.nitem{display:flex;align-items:center}
.nitem > .nlink{display:inline-flex;align-items:center;gap:7px}
.nitem .chev{transition:transform .35s var(--ease-out);opacity:.7}
.nitem:hover .chev,.nitem:focus-within .chev,.nitem.is-open .chev{transform:rotate(180deg)}
.nav__side{display:flex;align-items:center;gap:18px}
.nav__tel{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13.5px;font-weight:600;letter-spacing:.04em;color:rgba(246,243,236,.85);
  transition:color .25s;white-space:nowrap;
}
.nav__tel svg{color:var(--gold-bright)}
.nav__tel:hover{color:var(--gold-bright)}
@media (max-width:1340px){.nav__tel span{display:none}}
@media (max-width:1100px){.nav__tel{display:none}}

/* ---------- Mega panel ---------- */
.mega{
  position:absolute;left:0;right:0;top:100%;z-index:90;
  background:rgba(8,15,34,.97);
  -webkit-backdrop-filter:blur(22px) saturate(1.2);backdrop-filter:blur(22px) saturate(1.2);
  border-top:1px solid var(--line-light);
  border-bottom:1px solid rgba(199,153,59,.35);
  box-shadow:0 50px 90px rgba(4,8,18,.55);
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .35s var(--ease-out),transform .35s var(--ease-out),visibility .35s;
  pointer-events:none;
}
.nitem:hover > .mega,.nitem:focus-within > .mega,.nitem.is-open > .mega{
  opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
}
.mega__inner{
  max-width:1280px;margin:0 auto;padding:clamp(28px,3vw,44px) var(--pad);
  display:grid;grid-template-columns:1fr 320px;gap:clamp(28px,4vw,64px);align-items:start;
}
.mega__inner--narrow{grid-template-columns:1fr 1fr 320px}
.mega__title{
  font-size:10.5px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold);margin-bottom:18px;
}
/* neutralize top-nav link styling inside panels */
.mega a{text-transform:none;letter-spacing:normal;font-size:inherit;color:inherit}
.mega a::after{display:none}

.mega__grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 28px}
.mitem{
  display:flex;align-items:flex-start;gap:14px;padding:12px 14px;border-radius:14px;
  transition:background .3s;
}
.mitem:hover{background:rgba(199,153,59,.09)}
.mitem .mi{
  flex:0 0 auto;width:38px;height:38px;border-radius:11px;
  border:1px solid rgba(216,184,89,.35);color:var(--gold-bright);
  display:flex;align-items:center;justify-content:center;margin-top:2px;
  transition:background .3s,color .3s;
}
.mitem:hover .mi{background:var(--gold);border-color:var(--gold);color:var(--navy-deep)}
.mitem b{display:block;font-size:14.5px;font-weight:600;color:var(--cream);line-height:1.3}
.mitem small{display:block;margin-top:3px;font-size:12.5px;color:var(--muted-light);line-height:1.45}
.mega__all{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:0 14px;
  font-size:13px;font-weight:600;color:var(--gold-bright)!important;
}
.mega__all:hover{text-decoration:underline}

/* CTA card inside panels */
.mega__cta{
  border:1px solid rgba(216,184,89,.3);border-radius:18px;
  padding:24px;background:rgba(199,153,59,.06);
}
.mega__cta .t{font-family:var(--serif);font-weight:400;font-size:1.25rem;line-height:1.25;color:var(--cream)}
.mega__cta .t em{font-style:italic;color:var(--gold-bright)}
.mega__cta p{margin-top:10px;font-size:13px;line-height:1.6;color:var(--muted-light)}
.mega__cta .btn{margin-top:16px;width:100%;justify-content:center;padding:13px 20px;font-size:12.5px}
.mega__cta .tel{
  display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;
  font-size:14px;font-weight:600;color:var(--cream)!important;
}
.mega__cta .tel:hover{color:var(--gold-bright)!important}

/* Work panel thumbs */
.mega__projects{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mproj{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;display:block}
.mproj img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.mproj:hover img{transform:scale(1.06)}
.mproj .sc{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,15,34,0) 35%,rgba(8,15,34,.88))}
.mproj b{position:absolute;left:12px;right:12px;bottom:10px;font-size:13px;font-weight:600;color:var(--cream);line-height:1.3}
.mproj small{position:absolute;left:12px;bottom:30px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-bright)}

/* simple link list (resources) */
.mega__list{display:grid;gap:2px}
.mega__list a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;
  font-size:14px;color:rgba(246,243,236,.82);transition:background .25s,color .25s;
}
.mega__list a:hover{background:rgba(199,153,59,.09);color:var(--cream)}
.mega__list a svg{flex:0 0 auto;color:var(--gold-bright);opacity:.8}

@media (max-width:1100px){.mega{display:none}}

/* ============================================================
   MOBILE MENU v2 — scrollable, grouped, CSS-driven
   ============================================================ */
.mnav{
  position:fixed;inset:0;z-index:99;background:var(--navy-deep);
  visibility:hidden;opacity:0;
  transition:opacity .4s var(--ease-out),visibility .4s;
  display:block;padding:0;
}
body.menu-open .mnav{visibility:visible;opacity:1}
.mnav__scroll{
  height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:96px var(--pad) 40px;display:flex;flex-direction:column;
}
.mnav .big{
  font-family:var(--serif);font-weight:300;font-size:clamp(1.9rem,7.4vw,3.2rem);line-height:1.15;
  color:var(--cream);border-bottom:1px solid var(--line-light);padding:14px 0;
  display:flex;justify-content:space-between;align-items:center;
  opacity:0;transform:translateY(22px);
  transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);
}
.mnav .big em{font-style:italic;color:var(--gold-bright);font-size:.42em;letter-spacing:.2em}
body.menu-open .mnav .big{opacity:1;transform:none}
body.menu-open .mnav .big:nth-of-type(1){transition-delay:.06s}
body.menu-open .mnav .big:nth-of-type(2){transition-delay:.11s}
body.menu-open .mnav .big:nth-of-type(3){transition-delay:.16s}
body.menu-open .mnav .big:nth-of-type(4){transition-delay:.21s}
body.menu-open .mnav .big:nth-of-type(5){transition-delay:.26s}
.mgroup{border-bottom:1px solid var(--line-light)}
.mgroup summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  font-family:var(--serif);font-weight:300;font-size:clamp(1.9rem,7.4vw,3.2rem);line-height:1.15;
  color:var(--cream);padding:14px 0;
}
.mgroup summary::-webkit-details-marker{display:none}
.mgroup summary .pm{
  width:36px;height:36px;border-radius:50%;border:1px solid var(--line-light);flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--sans);font-size:18px;color:var(--gold-bright);
  transition:transform .4s var(--ease-out),background .3s,color .3s;
}
.mgroup[open] summary .pm{transform:rotate(45deg);background:var(--gold);border-color:var(--gold);color:var(--navy-deep)}
.mgroup .sub{display:grid;gap:2px;padding:2px 0 18px}
.mgroup .sub a{
  font-size:15.5px;color:rgba(246,243,236,.78);padding:9px 4px;border-radius:8px;
  display:flex;align-items:center;gap:10px;
}
.mgroup .sub a:active{color:var(--gold-bright)}
.mgroup .sub a .dot{width:5px;height:5px;border-radius:50%;background:var(--gold);flex:0 0 auto}
.mnav__ctas{display:grid;gap:12px;margin-top:28px}
.mnav__ctas .btn{justify-content:center}
.mnav__meta{
  margin-top:26px;display:flex;gap:16px;flex-wrap:wrap;
  color:var(--muted-light);font-size:13px;padding-bottom:20px;
}
.mnav .mgroup{opacity:0;transform:translateY(22px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
body.menu-open .mnav .mgroup{opacity:1;transform:none;transition-delay:.14s}
.mnav__ctas,.mnav__meta{opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease-out) .3s,transform .5s var(--ease-out) .3s}
body.menu-open .mnav__ctas,body.menu-open .mnav__meta{opacity:1;transform:none}
body.menu-open{overflow:hidden}
