/* MENÚ unificado 6.5 — dropdowns, estado al scroll, móvil */
.nav{position:fixed;top:0;inset-inline:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px clamp(20px,5vw,72px);transition:background .4s,border-color .4s,backdrop-filter .4s;border-bottom:1px solid transparent}
.nav .brand{font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.18em;font-size:13px;display:flex;gap:9px;align-items:center;color:#fff}
.nav .brand .x{color:var(--acc,#2b34ff)}
.nav .lk{display:flex;gap:2px;align-items:center}
.nav .navlink{font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.12em;font-size:11.5px;color:#fff;padding:10px 13px;display:inline-flex;gap:6px;align-items:center}
.nav .has-sub{position:relative}
.nav .has-sub>.navlink::after{content:"▾";font-size:9px;opacity:.7}
.nav .sub{position:absolute;top:calc(100% - 4px);left:0;min-width:300px;background:#fff;border:1px solid #e2e6f0;border-radius:16px;box-shadow:0 36px 80px -36px rgba(11,12,16,.5);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;display:grid;gap:2px}
.nav .has-sub:hover .sub{opacity:1;visibility:visible;transform:none}
.nav .sub a{font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;font-size:14px;color:#10131c;padding:10px 13px;border-radius:9px;display:flex;justify-content:space-between;gap:16px;align-items:center}
.nav .sub a:hover{background:#f1f3f8;color:var(--acc,#2b34ff)}
.nav .sub a span{color:#9aa3b5;font-size:11px;font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.08em}
.nav .sub .all{border-top:1px solid #eef1f6;margin-top:4px;color:var(--acc,#2b34ff);font-weight:500}
.navcta{font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.12em;font-size:11.5px;color:#fff;border:1px solid rgba(255,255,255,.5);padding:9px 17px;border-radius:100px;transition:.25s;white-space:nowrap}
.navcta:hover{background:#fff;color:#0b0c10}
.navtoggle{display:none;background:none;border:none;color:#fff;font-size:24px;cursor:pointer;line-height:1}
.nav.scrolled{background:color-mix(in srgb,#eceef2 90%,transparent);backdrop-filter:saturate(1.3) blur(14px);border-bottom-color:#d6dae3}
.nav.scrolled .brand,.nav.scrolled .navlink,.nav.scrolled .navtoggle{color:#10131c}
.nav.scrolled .navcta{color:#10131c;border-color:#cfd5e4}
@media(max-width:980px){.nav .lk,.navcta.hide-m{display:none}.navtoggle{display:inline-flex}}
.mmenu{position:fixed;inset:0;z-index:90;background:#0b0c10;color:#fff;display:none;flex-direction:column;justify-content:center;padding:90px 28px 40px;overflow-y:auto}
.mmenu.open{display:flex}
.mmenu .mclose{position:absolute;top:22px;right:26px;font-size:30px;cursor:pointer}
.mmenu details,.mmenu>a{border-bottom:1px solid #20222e}
.mmenu summary,.mmenu>a{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:clamp(1.6rem,7vw,2.2rem);padding:15px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;color:#fff}
.mmenu summary::-webkit-details-marker{display:none}.mmenu summary::after{content:"+";color:var(--acc,#2b34ff)}.mmenu details[open] summary::after{content:"–"}
.mmenu .ms{padding:0 0 16px}.mmenu .ms a{display:block;padding:8px 0;color:#9aa3bd;font-size:1.05rem;font-family:'Inter',sans-serif}
body.menu-open{overflow:hidden}

.nav{mix-blend-mode:normal}

/* === ajustes: menú negro fijo + dropdown 2 columnas === */
.nav{background:#0b0c10!important;border-bottom:1px solid #20222e!important}
.nav .brand,.nav .navlink,.nav .navtoggle{color:#fff!important}
.nav .navcta{color:#fff!important;border-color:rgba(255,255,255,.45)!important}
.nav .navcta:hover{background:#fff!important;color:#0b0c10!important}
.nav.scrolled{backdrop-filter:none!important}
.sub.wide{min-width:520px}
.subgrid{display:grid;gap:2px}
.subgrid.p5{grid-auto-flow:column;grid-template-rows:repeat(5,auto)}
.subgrid.s3{grid-auto-flow:column;grid-template-rows:repeat(3,auto)}
.sub .all{margin-top:6px}

.nav .sub .all{justify-content:center!important;text-align:center}

/* === fichas de menú: padding y que quepan en pantalla === */
.nav .sub{padding:28px}                                      /* Productos y Servicios: más aire */
.nav .sub:not(.wide){padding:14px}                           /* Empresa: padding normal */
.sub.wide{min-width:0;max-width:calc(100vw - 32px)}          /* nunca desborda la pantalla */
.nav .sub.wide:has(.subgrid.p5){min-width:760px}             /* productos: amplio para leer */
.nav .sub.wide:has(.subgrid.s3){min-width:540px}             /* servicios: 1 columna, espacio para nombre + descripción */
.nav .sub.wide a{white-space:nowrap;padding:12px 18px}       /* más padding en items, sin partir nombres */
.nav .sub.wide a span{flex:none}
.subgrid{column-gap:28px;row-gap:2px}
.subgrid.p5{grid-auto-columns:minmax(320px,1fr)}             /* productos en 2 columnas */
.subgrid.s3{grid-auto-flow:row;grid-template-columns:1fr;grid-template-rows:none}  /* servicios en 1 columna */

/* servicios: alineado desde la izquierda, nombre y descripción a cada lado */
.nav .sub.wide:has(.subgrid.s3){left:0;max-width:calc(100vw - 40px)}
.nav .sub.wide:has(.subgrid.s3) a{justify-content:space-between;gap:40px}
.nav .sub.wide:has(.subgrid.s3) .all{justify-content:center!important}

/* menú fijo: letras más grandes (se veían pequeñas) */
.nav .navlink{font-size:13.5px}
.nav .navcta{font-size:13px}
.nav .brand{font-size:14px}

/* === más vida en los desplegables del menú === */
.nav .sub{transform:translateY(12px) scale(.985)}
.nav .has-sub:hover .sub{transform:translateY(0) scale(1)}
.nav .sub a{position:relative;opacity:0;transform:translateY(7px);transition:opacity .3s ease,transform .3s ease,background .2s,color .2s,padding .2s}
.nav .has-sub:hover .sub a{opacity:1;transform:none}
.nav .sub a::before{content:"";position:absolute;left:7px;top:50%;width:0;height:54%;background:var(--acc,#2b34ff);border-radius:3px;transform:translateY(-50%);transition:width .2s}
.nav .sub a:hover{background:#f1f3f8;color:var(--acc,#2b34ff)}
.nav .sub a:hover::before{width:3px}
.nav .sub a:hover span{color:var(--acc,#2b34ff);opacity:.7}
.nav .sub.wide a:hover{padding-left:26px}
.nav .sub:not(.wide) a:hover{padding-left:21px}

/* fix: el fondo gris de los enlaces (incl. "Todos los…") no se sale del panel redondeado */
.nav .sub{overflow:hidden}

/* === TIPOGRAFÍA MONTSERRAT EN TODA LA WEB === */
body,body *{font-family:'Montserrat',sans-serif!important}
/* pesos de menú: fijo en bold; en el desplegable nombre medium y categoría gris bold */
.nav .navlink,.nav .brand,.nav .navcta{font-weight:700!important}
.nav .sub a{font-weight:500!important}
.nav .sub a span{font-weight:700!important}
/* === productos del menú: color propio al pasar el ratón === */
.nav .subgrid.p5 a:hover{color:var(--c,#2b34ff)}
.nav .subgrid.p5 a:hover::before{background:var(--c,#2b34ff)}
.nav .subgrid.p5 a:hover span{color:var(--c,#2b34ff)}

/* "Todos los productos / servicios" alineado a la izquierda */
.nav .sub .all{justify-content:flex-start!important;text-align:left!important}
.nav .sub.wide:has(.subgrid.s3) .all{justify-content:flex-start!important}
