/* Header "Ecosystem" dropdown (desktop) and grouped mobile menu. Shared by every page with the site header; behaviour in /nav.js. */

/* ---- desktop dropdown ---- */
.ecodd{position:relative;display:inline-flex}
.ecobtn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-size:15px;color:#5D6481;transition:color 200ms ease}
.ecobtn:focus-visible{outline:2px solid #5B3DF5;outline-offset:4px;border-radius:6px}
.ecobtn svg{transition:transform 260ms cubic-bezier(0.23,1,0.32,1)}
.ecodd.cur .ecobtn,.ecodd.open .ecobtn{color:#0E1230}
.ecodd.open .ecobtn svg{transform:rotate(180deg)}
.ecopanel{position:absolute;left:50%;top:calc(100% + 18px);z-index:60;width:248px;margin-left:-124px;padding:8px;box-sizing:border-box;border-radius:20px;background:#FFFFFF;border:1px solid #E7E9F2;box-shadow:0 20px 48px rgba(14,18,48,0.14);opacity:0;visibility:hidden;transform:translateY(-6px) scale(0.98);transform-origin:top center;transition:opacity 160ms ease,transform 220ms cubic-bezier(0.23,1,0.32,1),visibility 0s linear 220ms}
.ecopanel::before{content:'';position:absolute;left:0;right:0;top:-20px;height:20px}
.ecodd.open .ecopanel{opacity:1;visibility:visible;transform:none;transition:opacity 160ms ease,transform 260ms cubic-bezier(0.23,1,0.32,1)}
@media (hover:hover) and (pointer:fine){
  .ecodd:hover .ecobtn{color:#0E1230}
  .ecodd:hover .ecobtn svg{transform:rotate(180deg)}
  .ecodd:hover .ecopanel{opacity:1;visibility:visible;transform:none;transition:opacity 160ms ease,transform 260ms cubic-bezier(0.23,1,0.32,1)}
}
.ecoitem{display:flex;align-items:center;padding:10px 14px;border-radius:12px;text-decoration:none;color:#0E1230;transition:background-color 160ms ease}
.ecoitem:hover,.ecoitem:focus-visible{background:#F5F6FB;outline:none;color:#0E1230}
.ecoitem.cur{background:#F3F4FB}
.ecot{display:flex;flex-direction:column;gap:2px;min-width:0}
.ecot b{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:500;letter-spacing:-0.01em}
.ecot i{font-style:normal;font-size:13px;line-height:1.35;color:#5D6481}
.ecoext{color:#A3A8BD}
.ecosoc{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding:12px 14px 6px;border-top:1px solid #ECEEF5}
.ecosoc>span{font-size:13px;color:#5D6481}
.socs{display:flex;gap:8px}
.soc{width:36px;height:36px;border-radius:50%;background:#F5F6FB;color:#0E1230;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:background-color 180ms ease,color 180ms ease}
.soc:hover,.soc:focus-visible{background:#0E1230;color:#FFFFFF;outline:none}
.soc svg{display:block}
/* four nav items: tighten spacing on narrow desktops/tablets so they stay on one line */
@media (min-width: 761px) and (max-width: 1060px){.navg{gap:16px 20px!important;padding-left:24px!important;padding-right:24px!important}.navlinks{gap:20px!important;flex-wrap:nowrap!important;white-space:nowrap}}
@media (min-width: 761px) and (max-width: 860px){.navlinks{gap:16px!important;font-size:14px!important}.ecobtn{font-size:14px}}

/* ---- mobile menu groups ---- */
.mpanel{max-height:calc(100vh - 96px);max-height:calc(100svh - 96px);overflow-y:auto;overscroll-behavior:contain}
.mlab{display:block;padding:14px 14px 6px;font-size:12px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:#8A90A6}
.mpanel .mext{display:flex!important;align-items:center;justify-content:space-between}
.mpanel .mext svg{color:#A3A8BD}
.msoc{display:flex;gap:10px;padding:8px 14px 10px}
.msoc .soc{width:44px;height:44px}