/* MRH Staggered Menu · progressive enhancement del nav-drawer · v1 */
html.smx-on body.smx-open{overflow:hidden}
/* capas de fondo escalonadas */
.smx-layer{position:fixed;inset:0;z-index:998;transform:translateX(103%);pointer-events:none;will-change:transform}
.smx-layer-1{background:var(--star,#c8912f);transition:transform .5s cubic-bezier(.76,0,.24,1)}
.smx-layer-2{background:#1d3d5c;transition:transform .5s cubic-bezier(.76,0,.24,1) .06s}
body.smx-open .smx-layer{transform:translateX(0)}
body.smx-closing .smx-layer-1{transition-delay:.05s}
/* panel principal: pisa el drawer existente */
html.smx-on #navDrawer{position:fixed !important;inset:0 !important;width:100% !important;max-width:none !important;
  height:100dvh !important;background:#F4F1EA !important;z-index:999 !important;
  transform:translateX(103%) !important;transition:transform .6s cubic-bezier(.76,0,.24,1) .12s;
  display:flex !important;flex-direction:column;justify-content:center;
  padding:90px clamp(24px,8vw,80px) 30px !important;overflow-y:auto;visibility:visible !important;
  right:auto !important;left:0 !important;box-shadow:none !important}
html.smx-on body.smx-open #navDrawer{transform:translateX(0) !important}
html.smx-on body.smx-closing #navDrawer{transition-delay:0s;transition-duration:.38s}
/* items grandes serif con numeración dorada */
html.smx-on #navDrawer{counter-reset:smxi}
html.smx-on #navDrawer > a{font-family:var(--serif,Georgia) !important;color:var(--ink,#12233b) !important;
  text-decoration:none;line-height:1.12;padding:.14em 0 !important;border:0 !important;
  font-size:clamp(1.55rem,6.2vw,2.45rem) !important;font-weight:600;position:relative;
  opacity:0;transform:translateY(34px) rotate(2.5deg);transform-origin:0 100%;
  transition:opacity .45s ease,transform .6s cubic-bezier(.22,1.4,.36,1);display:block;width:fit-content}
html.smx-on #navDrawer > a::before{counter-increment:smxi;content:counter(smxi,decimal-leading-zero);
  position:absolute;right:-2.2em;top:.45em;font-family:var(--sans,sans-serif);font-size:.34em;
  font-weight:700;color:var(--star-d,#b07d1f);opacity:.85;letter-spacing:.05em}
html.smx-on #navDrawer > a:hover{color:var(--star-d,#b07d1f) !important}
html.smx-on body #navDrawer > a.active{color:var(--star-d,#b07d1f) !important}
/* sub-items y teléfonos más discretos */
html.smx-on #navDrawer > a.nav-drawer-sub{font-family:var(--sans,sans-serif) !important;
  font-size:.95rem !important;font-weight:500;color:var(--ink3,#5a6675) !important;padding:.1em 0 .1em 1em !important}
html.smx-on #navDrawer > a.nav-drawer-sub::before{content:none}
html.smx-on #navDrawer > a[href^="tel:"]{font-family:var(--sans,sans-serif) !important;
  font-size:1rem !important;font-weight:600;margin-top:.35em}
html.smx-on #navDrawer > a[href^="tel:"]::before{content:none}
/* stagger de entrada */
html.smx-on body.smx-open #navDrawer > a{opacity:1;transform:none}
html.smx-on body.smx-open #navDrawer > a:nth-child(1){transition-delay:.26s}
html.smx-on body.smx-open #navDrawer > a:nth-child(2){transition-delay:.32s}
html.smx-on body.smx-open #navDrawer > a:nth-child(3){transition-delay:.38s}
html.smx-on body.smx-open #navDrawer > a:nth-child(4){transition-delay:.42s}
html.smx-on body.smx-open #navDrawer > a:nth-child(5){transition-delay:.46s}
html.smx-on body.smx-open #navDrawer > a:nth-child(6){transition-delay:.5s}
html.smx-on body.smx-open #navDrawer > a:nth-child(7){transition-delay:.54s}
html.smx-on body.smx-open #navDrawer > a:nth-child(8){transition-delay:.58s}
html.smx-on body.smx-open #navDrawer > a:nth-child(9){transition-delay:.62s}
html.smx-on body.smx-open #navDrawer > a:nth-child(10){transition-delay:.66s}
html.smx-on body.smx-open #navDrawer > a:nth-child(11){transition-delay:.7s}
/* pie del drawer (idiomas) */
html.smx-on #navDrawer .nav-drawer-foot{margin-top:auto;opacity:0;transition:opacity .4s ease .55s;border:0 !important}
body.smx-open html.smx-on #navDrawer .nav-drawer-foot{opacity:1}
/* overlay legacy fuera */
html.smx-on body.smx-open .nav-overlay{display:none !important}
/* hamburguesa → X (por encima del panel) */
html.smx-on .nav-toggle{z-index:1001 !important;position:relative}
html.smx-on body.smx-open .nav-toggle span{background:var(--ink,#12233b) !important}
html.smx-on body.smx-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.smx-on body.smx-open .nav-toggle span:nth-child(2){opacity:0}
html.smx-on body.smx-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
html.smx-on .nav-toggle span{transition:transform .35s ease,opacity .25s ease,background .3s ease}
/* logo/nav por encima cuando abierto */
html.smx-on body.smx-open .nav{z-index:1000}
@media (prefers-reduced-motion:reduce){
  .smx-layer,#navDrawer,#navDrawer > a{transition:none !important}
}