/* mcarva · v90.2 · Carriles reconstruidos desde base estable v89
   Principio: movimiento por CSS, navegación de proyectos sin interceptar clicks.
   Alcance limitado a #projects. No modifica fondo, notas, estructuración ni páginas internas. */

#projects .mcr-project-rails{
  --mcr-project-height:clamp(250px,24vw,323px);
  --mcr-visual-height:clamp(142px,14vw,210px);
  --mcr-gap:clamp(14px,1.65vw,24px);
  width:100%;
  max-width:100%;
  margin:0 auto;
  display:grid;
  gap:clamp(18px,2.2vw,30px);
  overflow:hidden;
}

#projects .mcr-rail{
  width:100%;
  max-width:100%;
  overflow:hidden;
  position:relative;
  isolation:isolate;
}

#projects .mcr-rail-track{
  display:flex;
  align-items:center;
  width:max-content;
  max-width:none;
  will-change:transform;
  transform:translate3d(0,0,0);
}

#projects .mcr-rail-group{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:var(--mcr-gap);
  padding-right:var(--mcr-gap);
}

#projects .mcr-rail-track--projects{
  animation:mcr-rail-left 58s linear infinite;
}

#projects .mcr-rail-track--visuals{
  animation:mcr-rail-right 68s linear infinite;
}

#projects .mcr-rail:hover .mcr-rail-track,
#projects .mcr-rail:focus-within .mcr-rail-track,
body.visual-lightbox-open #projects .mcr-rail-track{
  animation-play-state:paused;
}

#projects .mcr-rail--projects{
  min-height:var(--mcr-project-height);
}

#projects .mcr-rail--projects .mcr-rail-group{
  align-items:stretch;
}

#projects .mcr-rail--projects .project-card{
  flex:0 0 auto;
  height:var(--mcr-project-height);
  min-height:0;
  width:auto;
  max-width:none;
  aspect-ratio:var(--card-ratio);
  grid-column:auto !important;
  justify-self:auto;
}

#projects .mcr-rail--projects .project-card--lobby{
  width:auto;
}

#projects .mcr-rail--projects .project-card--tierra .project-content,
#projects .mcr-rail--projects .project-card--materia .project-content,
#projects .mcr-rail--projects .project-card--residencia .project-content{
  max-width:72%;
}

#projects .mcr-rail--visuals{
  min-height:var(--mcr-visual-height);
}

#projects .mcr-rail--visuals .mcr-rail-group{
  align-items:center;
}

#projects .visual-rail-item{
  flex:0 0 auto;
  height:var(--mcr-visual-height);
  width:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  cursor:zoom-in;
  overflow:hidden;
  text-decoration:none;
}

#projects .visual-rail-item img{
  display:block;
  height:100%;
  width:auto;
  max-width:none;
  object-fit:contain;
  filter:saturate(.96) contrast(.99) brightness(.92);
  transition:filter .35s var(--ease),transform .35s var(--ease);
}

#projects .visual-rail-item:hover img,
#projects .visual-rail-item:focus-visible img{
  filter:saturate(1) contrast(1) brightness(.98);
  transform:translateY(-2px);
}

#projects .visual-rail-item:focus-visible{
  outline:1px solid rgba(255,255,255,.36);
  outline-offset:3px;
}

.visual-lightbox{
  position:fixed;
  inset:0;
  z-index:6000;
  display:grid;
  place-items:center;
  padding:clamp(18px,3vw,46px);
  background:rgba(25,26,28,.96);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,visibility .24s ease;
}

.visual-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.visual-lightbox__image{
  display:block;
  max-width:min(100%,1680px);
  max-height:calc(100svh - clamp(36px,6vw,92px));
  width:auto;
  height:auto;
  object-fit:contain;
  box-shadow:none;
}

.visual-lightbox__close{
  position:fixed;
  z-index:2;
  top:clamp(16px,2.6vw,34px);
  right:clamp(16px,2.6vw,34px);
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(25,26,28,.35);
  cursor:pointer;
}

.visual-lightbox__close::before,
.visual-lightbox__close::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:50%;
  height:1px;
  background:rgba(255,255,255,.82);
}

.visual-lightbox__close::before{transform:rotate(45deg)}
.visual-lightbox__close::after{transform:rotate(-45deg)}
.visual-lightbox__close:hover,
.visual-lightbox__close:focus-visible{border-color:rgba(255,255,255,.62);outline:none}
body.visual-lightbox-open{overflow:hidden}

@keyframes mcr-rail-left{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

@keyframes mcr-rail-right{
  from{transform:translate3d(-50%,0,0)}
  to{transform:translate3d(0,0,0)}
}

@media (max-width:900px){
  #projects .mcr-project-rails{--mcr-project-height:clamp(225px,48vw,300px);--mcr-visual-height:clamp(128px,31vw,178px)}
}

@media (max-width:620px){
  #projects .mcr-project-rails{--mcr-project-height:235px;--mcr-visual-height:132px;--mcr-gap:14px;gap:18px}
  .visual-lightbox{padding:18px}
  .visual-lightbox__close{width:38px;height:38px}
}

@media (prefers-reduced-motion:reduce){
  #projects .mcr-rail-track{animation:none}
  #projects .visual-rail-item img,
  .visual-lightbox{transition:none}
}

/* v90.2.1 · Navegación interna del lightbox.
   Alcance: solo visor de imágenes del segundo carril. No controla carriles ni enlaces de proyectos. */
.visual-lightbox__nav{
  position:fixed;
  z-index:2;
  top:50%;
  transform:translateY(-50%);
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(25,26,28,.35);
  color:#fff;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.visual-lightbox__nav svg{
  width:18px;
  height:18px;
  display:block;
}
.visual-lightbox__nav--prev{left:clamp(12px,2vw,24px)}
.visual-lightbox__nav--next{right:clamp(12px,2vw,24px)}
.visual-lightbox__nav:hover,
.visual-lightbox__nav:focus-visible{
  border-color:rgba(255,255,255,.62);
  outline:none;
}
@media (max-width:620px){
  .visual-lightbox__nav{
    width:38px;
    height:38px;
  }
  .visual-lightbox__nav--prev{left:10px}
  .visual-lightbox__nav--next{right:10px}
}

/* v90.2.2d · Flechas solo en carril de proyectos.
   Base: v90.2.1. No afecta el segundo carril, no añade rueda ni drag. */
#projects .mcr-rail--projects .mcr-rail-control{
  position:absolute;
  z-index:8;
  top:50%;
  transform:translateY(-50%);
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(25,26,28,.68);
  color:rgba(255,255,255,.92);
  cursor:pointer;
  opacity:1;
  pointer-events:auto;
  -webkit-backdrop-filter:blur(7px);
  backdrop-filter:blur(7px);
  box-shadow:0 6px 18px rgba(0,0,0,.16);
  transition:border-color .25s var(--ease),background-color .25s var(--ease),transform .25s var(--ease);
}
#projects .mcr-rail--projects .mcr-rail-control svg{
  width:16px;
  height:16px;
  display:block;
}
#projects .mcr-rail--projects .mcr-rail-control--prev{left:clamp(8px,1vw,14px)}
#projects .mcr-rail--projects .mcr-rail-control--next{right:clamp(8px,1vw,14px)}
#projects .mcr-rail--projects .mcr-rail-control:hover,
#projects .mcr-rail--projects .mcr-rail-control:focus-visible{
  border-color:rgba(255,255,255,.52);
  background:rgba(25,26,28,.86);
  outline:none;
}
#projects .mcr-rail--projects .mcr-rail-control:active{
  transform:translateY(-50%) scale(.97);
}
@media (max-width:620px){
  #projects .mcr-rail--projects .mcr-rail-control{
    width:38px;
    height:38px;
  }
  #projects .mcr-rail--projects .mcr-rail-control--prev{left:10px}
  #projects .mcr-rail--projects .mcr-rail-control--next{right:10px}
}

/* v90.2.2e · Suavizado del movimiento por flechas del carril de proyectos. */
#projects .mcr-rail--projects .mcr-rail-track.is-arrow-gliding{
  transition:transform .78s cubic-bezier(.18,.72,.2,1);
}

/* v90.2.2g · Velocidad estabilizada del segundo carril.
   Base: v90.2.2e. No se toca estructura, lightbox, flechas ni proporciones. */
#projects .mcr-rail-track--visuals{
  animation-duration:150s !important;
}