/* LAOGANMA — menú hamburguesa (drawer superior a pantalla completa) + push del checkout */

/* Grupo derecho del header: hamburguesa + carrito */
.lg-header__actions{display:flex;align-items:center;gap:4px}

/* Hamburguesa: 3 líneas; morph a X al abrir */
.lg-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:7px;background:none;border:0;cursor:pointer;position:relative;z-index:60}
.lg-burger span{display:block;width:22px;height:3px;background:#111;border-radius:2px;transition:transform .42s var(--lg-ease),opacity .25s var(--lg-ease)}
body.lg-nav-open .lg-burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.lg-nav-open .lg-burger span:nth-child(2){opacity:0;transform:scaleX(.2)}
body.lg-nav-open .lg-burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* Drawer del menú: baja desde arriba (transform GPU) y ocupa el alto remanente completo */
.lg-menu{position:fixed;top:var(--lg-header-h);left:0;right:0;z-index:30;height:calc(100svh - var(--lg-header-h));overflow-y:auto;background:linear-gradient(160deg,#8A1C0E 0%,#56180F 55%,#3C1510 100%);transform:translateY(-110%);transition:transform .5s cubic-bezier(.16,1,.3,1);will-change:transform}
body.lg-nav-open{overflow:hidden}
body.lg-nav-open .lg-menu{transform:translateY(0)}

/* El contenido se empuja con transform en #lg-page (60fps, sin reflow) */
#lg-page{transition:transform .5s cubic-bezier(.16,1,.3,1);will-change:transform}
body.lg-nav-open #lg-page{transform:translateY(var(--lg-menu-h,80vh))}

/* Checkout: empuja contenido + header a la izquierda (el panel entra desde la derecha → cart.css) */
.lg-header{transition:transform .5s cubic-bezier(.16,1,.3,1);will-change:transform}
body.lgc-open #lg-page,
body.lgc-open .lg-header{transform:translateX(-100%)}

/* Layout interno: columna a alto completo; ítems en bandas iguales con divisores; redes abajo */
.lg-menu__inner{display:flex;flex-direction:column;min-height:calc(100svh - var(--lg-header-h));padding:clamp(14px,2.4vh,26px) max(24px,calc(50% - 600px)) clamp(16px,2.4vh,26px)}
.lg-menu__nav{flex:1 1 auto;display:flex;flex-direction:column}
.lg-menu__nav > *{flex:1 1 0;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:clamp(6px,1.4vh,18px) 0}
.lg-menu__nav > * + *{border-top:1px solid rgba(255,255,255,.14)}

/* Links grandes */
.lg-menu__link{font-family:var(--lg-serif);font-weight:700;line-height:1;color:#fff;font-size:clamp(2.4rem,9vw,5rem);text-decoration:none}
.lg-menu__link span{display:inline-block;transition:transform .3s var(--lg-ease),color .25s var(--lg-ease)}
.lg-menu__link:hover span{transform:translateX(16px) skewX(-5deg);color:#FFB59E}

/* Entrada armónica: cada banda sube y aparece, en cascada */
.lg-menu__nav > *,.lg-menu__contact{opacity:0;transform:translateY(20px);will-change:transform,opacity}
body.lg-nav-open .lg-menu__nav > *{opacity:1;transform:none;transition:opacity .5s var(--lg-ease),transform .6s cubic-bezier(.18,1.1,.3,1)}
body.lg-nav-open .lg-menu__nav > *:nth-child(1){transition-delay:.08s}
body.lg-nav-open .lg-menu__nav > *:nth-child(2){transition-delay:.16s}
body.lg-nav-open .lg-menu__nav > *:nth-child(3){transition-delay:.24s}
body.lg-nav-open .lg-menu__contact{opacity:1;transform:none;transition:opacity .5s var(--lg-ease) .3s,transform .55s var(--lg-ease) .3s}

/* Auth (Ingresar / sesión) dentro de su banda */
.lg-menu__authcta{display:inline-block;font-family:var(--lg-serif);font-weight:700;font-size:clamp(2.4rem,9vw,5rem);line-height:1;color:#fff;text-decoration:none;transition:color .2s var(--lg-ease)}
.lg-menu__authcta:hover{color:#FFB59E}
.lg-menu__authhelp{display:block;margin-top:8px;font-family:var(--lg-sans);font-size:clamp(.72rem,2.6vw,.82rem);color:rgba(255,255,255,.55);line-height:1.4;white-space:nowrap}
.lg-menu__hi{display:block;font-family:var(--lg-sans);font-size:1.05rem;color:rgba(255,255,255,.85);margin-bottom:12px}
.lg-menu__hi strong{color:#fff}
.lg-menu__authrow{display:flex;gap:10px;flex-wrap:wrap}
.lg-menu__authlink{display:inline-flex;align-items:center;padding:9px 18px;border-radius:var(--lg-radius-pill);border:1px solid rgba(255,255,255,.25);color:#fff;font-family:var(--lg-sans);font-weight:600;font-size:.88rem;text-decoration:none;transition:background .2s var(--lg-ease),border-color .2s var(--lg-ease)}
.lg-menu__authlink:hover{background:rgba(255,255,255,.12);border-color:#fff}
.lg-menu__authlink--out{border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}

/* Redes sociales: abajo, compactas, con divisor superior */
.lg-menu__contact{flex:0 0 auto;padding-top:clamp(14px,2.2vh,20px);border-top:1px solid rgba(255,255,255,.14)}
.lg-menu__contact-label{display:block;font-family:var(--lg-sans);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:10px}
.lg-menu__social{display:flex;gap:11px}
.lg-menu__soc{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.25);color:#fff;transition:transform .25s var(--lg-ease),background .25s var(--lg-ease),border-color .25s var(--lg-ease)}
.lg-menu__soc svg{width:19px;height:19px}
.lg-menu__soc:hover{background:#fff;color:var(--lg-cta);border-color:#fff;transform:translateY(-3px) rotate(-6deg)}

/* Pantallas bajas (paisaje): ítems a alto natural y el menú hace scroll (evita recortes) */
@media (max-height:560px){
	.lg-menu__inner{min-height:0}
	.lg-menu__nav > *{flex:0 0 auto;padding:14px 0}
	.lg-menu__link,.lg-menu__authcta{font-size:clamp(2rem,7vw,3rem)}
}
@media (max-width:860px){
	.lg-menu__inner{padding-left:24px;padding-right:24px}
}
@media (prefers-reduced-motion:reduce){
	.lg-menu__nav > *,.lg-menu__contact{transition:opacity .2s!important;transform:none!important;opacity:1!important}
	.lg-burger span{transition:none}
}
