/* ══════════════════════════════════════
   WORK — CORREGIDO (sin position:relative)
══════════════════════════════════════ */
/* #pg-work hereda position:fixed;inset:0 de .page — NO añadir position:relative */
#work-cats {
  position:absolute; inset:0; background:#fff;
  display:flex; align-items:center; overflow:hidden;
  z-index:1; transition:opacity .5s, transform .5s var(--ease); cursor:none;
}
#work-cats.wc-hidden { opacity:0; pointer-events:none; transform:translateX(-4%) }
.wk-track { display:flex; align-items:center; will-change:transform; }
.wk-seq { display:flex; align-items:center; flex-shrink:0; }
/* Cada categoría: fondo blanco + blob + palabra en negativo (mix-blend contra el blanco/blob) */
.wk-cat {
  position:relative; flex-shrink:0; width:40vw; height:82vh;
  display:flex; align-items:center; justify-content:center; background:#fff;
  border-right:1px solid rgba(14,14,12,.16); cursor:none; text-decoration:none;
}
.wk-frame {
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:1;
  width:clamp(260px,29vw,470px); height:clamp(360px,62vh,620px);
  clip-path:url(#wk-blob); pointer-events:none; overflow:hidden;
}
.wk-frame img { width:100%; height:100%; object-fit:cover; }
.wk-word { display:none }
/* Título FIJO centrado en pantalla (dentro del track para que el mix-blend vea los blobs);
   el JS lo mantiene en el centro y sólo cambia su texto al cruzar la línea */
.wk-title {
  position:absolute; top:50%; transform:translate(-50%,-50%); z-index:5;
  font-family:'Vilonti','Archivo Black',var(--sans); font-weight:900; text-transform:uppercase;
  font-size:clamp(2.6rem,8vw,7.5rem); line-height:.9; letter-spacing:-.03em;
  color:#fff; mix-blend-mode:difference; white-space:nowrap; pointer-events:none;
}

/* WORK — vista editorial (work 2.png) */
#work-editorial {
  position:absolute; inset:0; z-index:2;
  display:grid; grid-template-columns:30% 70%;
  transform:translateX(100%); transition:transform .8s var(--ease);
}
#work-editorial.we-open { transform:translateX(0) }
.we-sidebar {
  background:var(--w2); color:var(--black);
  display:flex; flex-direction:column; padding:2rem 1.8rem; overflow:hidden;
}
.we-back {
  font-family:var(--mono); font-size:.52rem; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(0,0,0,.35); display:flex; align-items:center; gap:.4rem;
  transition:color .25s; margin-bottom:2.5rem; flex-shrink:0;
}
.we-back:hover { color:var(--black) }
.we-cat-title { font-family:'Vilonti','Archivo Black',var(--sans); font-weight:900; font-size:clamp(1.8rem,3.5vw,3.5rem); text-transform:uppercase; letter-spacing:-.04em; line-height:1; color:var(--black); flex-shrink:0; margin-bottom:.5rem }
.we-cat-sub { font-family:var(--mono); font-size:.48rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(0,0,0,.35); flex-shrink:0; margin-bottom:2rem }
.we-list { display:flex; flex-direction:column; gap:0; overflow-y:auto; flex:1; scrollbar-width:none }
.we-list::-webkit-scrollbar { display:none }
.we-item { display:flex; align-items:flex-start; gap:.8rem; padding:.9rem 0; border-bottom:1px solid rgba(0,0,0,.06); cursor:none; transition:opacity .25s }
.we-item:not(.we-active) { opacity:.3 }
.we-item.we-active, .we-item:hover { opacity:1 }
.we-item-num { font-family:var(--mono); font-size:.46rem; letter-spacing:.08em; color:rgba(0,0,0,.35); flex-shrink:0; padding-top:.15rem }
.we-item-name { font-family:var(--sans); font-size:.82rem; font-weight:600; color:var(--black); line-height:1.3 }
.we-item-meta { font-family:var(--mono); font-size:.44rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(0,0,0,.35); margin-top:.2rem }
.we-open-btn { margin-top:auto; flex-shrink:0; padding-top:1.5rem; border-top:1px solid rgba(0,0,0,.06) }
.we-open-lnk { font-family:var(--mono); font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--black); display:inline-flex; align-items:center; gap:.6rem; padding:.85rem 1.5rem; border:1.5px solid var(--black); border-radius:50px; transition:background .25s, color .25s; cursor:none }
.we-open-lnk:hover { background:var(--black); color:var(--white) }
.we-main { position:relative; overflow:hidden; background:var(--black) }
.we-main-photo { position:absolute; inset:0 }
.we-main-photo img { width:100%; height:100%; object-fit:cover; opacity:.65; filter:grayscale(.15); transition:opacity .6s, transform .8s var(--ease) }
.we-main-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(14,14,12,.9) 0%, rgba(14,14,12,.2) 50%, transparent 100%) }
.we-main-content { position:absolute; bottom:0; left:0; right:0; padding:3rem; z-index:2 }
.we-proj-num { font-family:'Vilonti','Archivo Black',var(--sans); font-weight:900; font-size:clamp(6rem,12vw,16rem); line-height:1; letter-spacing:-.05em; color:rgba(240,237,230,.07); position:absolute; bottom:-.05em; right:2rem; user-select:none }
.we-proj-title { font-family:'Vilonti','Archivo Black',var(--sans); font-weight:900; font-style:normal; text-transform:uppercase; font-size:clamp(1.4rem,2.4vw,2.4rem); letter-spacing:-.02em; color:var(--white); line-height:1.05; margin-bottom:.8rem }
.we-proj-title em { font-style:normal }
.we-proj-brief { font-family:var(--sans); font-size:.78rem; line-height:1.85; color:rgba(240,237,230,.5); max-width:55ch; margin-bottom:1.5rem }
.we-tags { display:none }
.we-tag { font-family:var(--mono); font-size:.44rem; letter-spacing:.08em; text-transform:uppercase; padding:.2rem .55rem; border:1px solid rgba(240,237,230,.15); color:rgba(240,237,230,.35) }