
.nd-dim{
  position:absolute; inset:0; z-index:60; pointer-events:none;
  background:#000; opacity:0; border-radius:inherit;
}

@media (prefers-reduced-motion:no-preference){
  .garage{ background:#07070b; }

  .garage > section{
    position:relative !important;
    top:auto;
    border-radius:0;
    box-shadow:none;
  }
  .garage > section.nd-pin{
    position:sticky !important;
    top:var(--pin-top, 0px);
  }
  .garage > section.nd-arrive{
    border-radius: var(--nd-r, var(--sheet-r)) var(--nd-r, var(--sheet-r)) 0 0;
    box-shadow: 0 -22px 50px -26px rgba(0,0,0,0.45);
  }
  html[data-theme="dark"] .garage > section.nd-arrive{
    box-shadow: 0 -22px 50px -26px rgba(0,0,0,0.95), inset 0 1px 0 rgba(255,255,255,0.07);
  }
}

@media (prefers-reduced-motion:no-preference) and (max-width:900px){
  .garage > #servicios.nd-arrive{ --sheet-r: 28px; }
  html[data-theme="dark"] .garage > #servicios.nd-arrive{
    box-shadow: 0 -22px 50px -26px rgba(0,0,0,0.95), inset 0 1px 0 rgba(255,255,255,0.16);
  }
  .garage > section:not(:first-child){
    position:relative !important;
    top:auto;
  }
  .garage > section:not(:first-child):not(#servicios),
  html[data-theme="dark"] .garage > section:not(:first-child):not(#servicios){
    border-radius:0;
    box-shadow:none;
  }
}

.nd-rail{
  --rail-c: #0A0A0A;
  --rail-on: #fff;
  --rail-track: rgba(0,0,0,0.14);
  --rail-muted: rgba(0,0,0,0.42);
  --rail-glow: rgba(0,0,0,0.22);
  --rail-halo: rgba(0,0,0,0.08);
  display:none;
  position:fixed; z-index:45;
  left:clamp(14px, 1.5vw, 28px); top:50%;
  width:22px; height:min(52vh, 420px);
  transform:translate(-8px, -50%);
  opacity:0; pointer-events:none;
  transition: opacity .6s ease, transform .7s cubic-bezier(.22,1,.36,1);
}
html[data-theme="dark"] .nd-rail{
  --rail-c: #fff;
  --rail-on: #0A0A0A;
  --rail-track: rgba(255,255,255,0.16);
  --rail-muted: rgba(255,255,255,0.48);
  --rail-glow: rgba(255,255,255,0.7);
  --rail-halo: rgba(255,255,255,0.12);
}
@media (min-width:1100px) and (hover:hover) and (pointer:fine){
  .nd-rail{ display:block; }
}
.nd-rail.is-on{ opacity:1; transform:translate(0, -50%); pointer-events:auto; }
.nd-rail-track{
  position:absolute; left:50%; top:0; bottom:0; width:1px; margin-left:-.5px;
  overflow:hidden; background:var(--rail-track);
}
.nd-rail-fill{
  position:absolute; inset:0; transform-origin:50% 0; transform:scaleY(0);
  background:var(--rail-c);
  transition: transform .75s cubic-bezier(.65,0,.35,1);
}
.nd-rail-head{
  position:absolute; left:50%; top:0; width:5px; height:5px; margin:-2.5px 0 0 -2.5px;
  border-radius:50%; background:var(--rail-c);
  box-shadow: 0 0 6px 1px var(--rail-glow), 0 0 16px 4px var(--rail-halo);
  opacity:0; transition: opacity .3s ease, transform .75s cubic-bezier(.65,0,.35,1);
}
.nd-rail.is-moving .nd-rail-head{ opacity:1; }

.nd-node{
  position:absolute; left:50%; width:22px; height:22px; margin:-11px 0 0 -11px;
  display:block; text-decoration:none; outline:none;
}
.nd-dot{
  position:absolute; left:50%; top:50%; width:7px; height:7px; margin:-3.5px 0 0 -3.5px;
  border-radius:50%; background:var(--bg, #fff); border:1px solid var(--rail-muted);
  transition: width .4s cubic-bezier(.34,1.56,.64,1), height .4s cubic-bezier(.34,1.56,.64,1), margin .4s cubic-bezier(.34,1.56,.64,1),
              background .3s ease, border-color .3s ease, box-shadow .4s ease;
}
.nd-dot::before{
  content:''; position:absolute; left:50%; top:50%; width:5px; height:5px; margin:-2.5px 0 0 -2.5px;
  border-radius:50%; background:var(--rail-c); transform:scale(0);
  transition: transform .35s cubic-bezier(.34,1.56,.64,1) .05s;
}
.nd-node.is-passed .nd-dot{ background:var(--rail-c); border-color:var(--rail-c); }
.nd-node.is-active .nd-dot{
  width:13px; height:13px; margin:-6.5px 0 0 -6.5px;
  background:var(--bg, #fff); border:1.5px solid var(--rail-c);
  box-shadow: 0 0 0 4px var(--rail-halo);
}
.nd-node.is-active .nd-dot::before{ transform:scale(1); }
.nd-node:hover .nd-dot, .nd-node:focus-visible .nd-dot{ border-color:var(--rail-c); }
.nd-node:not(.is-active):hover .nd-dot{ width:9px; height:9px; margin:-4.5px 0 0 -4.5px; }

.nd-node::after{
  content:''; position:absolute; left:50%; top:50%; width:13px; height:13px; margin:-6.5px 0 0 -6.5px;
  border-radius:50%; border:1px solid var(--rail-c); opacity:0; pointer-events:none;
}
.nd-node.is-hit::after{ animation: ndPulse 1s cubic-bezier(.2,.7,.2,1); }
@keyframes ndPulse{
  0%  { opacity:.8; transform:scale(.8); }
  100%{ opacity:0;  transform:scale(2.6); }
}

.nd-label{
  position:absolute; left:26px; top:50%;
  transform:translate(-8px, -50%); white-space:nowrap; pointer-events:none;
  font:600 12px/1 'Sora', system-ui, sans-serif; letter-spacing:-0.01em;
  padding:8px 13px; border-radius:999px;
  color:var(--rail-on); background:var(--rail-c);
  box-shadow: 0 10px 24px -10px var(--rail-glow);
  opacity:0; filter:blur(4px);
  transition: opacity .3s ease, transform .45s cubic-bezier(.22,1,.36,1), filter .35s ease;
}
.nd-node:hover .nd-label,
.nd-node:focus-visible .nd-label,
.nd-node.show-label .nd-label{ opacity:1; filter:none; transform:translate(0, -50%); }

@media (prefers-reduced-motion:reduce){
  .nd-rail, .nd-dot, .nd-dot::before, .nd-label, .nd-rail-fill, .nd-rail-head{ transition:none; }
  .nd-label{ filter:none; }
  .nd-node.is-hit::after{ animation:none; }
}

.nd-emblem{
  position:fixed; inset:0; z-index:3; pointer-events:none; visibility:hidden;
  contain:strict;
}
.nd-emblem.is-on{ visibility:visible; }
.nd-em-shade{ position:absolute; inset:0; background:#000; opacity:0; will-change:transform, opacity; }
.nd-em-cv{
  position:absolute; left:0; top:0; width:100%; height:100vh; height:100lvh; display:block;
}
.garage > section.nd-em-over{ z-index:4 !important; }
@media (prefers-reduced-motion:reduce){ .nd-emblem{ display:none; } }

.nd-fx-picker{
  position:fixed; left:12px; bottom:calc(12px + env(safe-area-inset-bottom, 0px)); z-index:120;
  display:flex; align-items:center; gap:8px; padding:6px 6px 6px 12px;
  background:rgba(0,0,0,0.82); border:1px solid rgba(255,255,255,0.22); border-radius:999px;
  font:600 12px/1 'Sora', system-ui, sans-serif; color:#fff;
  box-shadow:0 8px 24px -10px rgba(0,0,0,0.6);
}
.nd-fx-picker span{ opacity:.6; letter-spacing:.04em; }
.nd-fx-picker select{
  appearance:none; -webkit-appearance:none; background:#000; color:#fff;
  border:1px solid rgba(255,255,255,0.3); border-radius:999px; padding:7px 26px 7px 12px;
  font:inherit; cursor:pointer;
  background-image:linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%);
  background-position:calc(100% - 14px) 52%, calc(100% - 10px) 52%; background-size:4px 4px; background-repeat:no-repeat;
}
.nd-fx-picker button{
  background:#fff; color:#000; border:0; border-radius:999px; padding:8px 12px;
  font:inherit; cursor:pointer;
}
.nd-fx-picker select:focus-visible, .nd-fx-picker button:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
