/* ============================================================================
   LA PARTITURA · partitura.css — el perfume escrito como pieza en el tiempo.

   La gran idea del brief del owner (partitura olfativa), sobre el único dato
   que ya es tiempo: la pirámide declarada. Lenguaje grabado de la casa —
   hairlines, papel, tinta — como el mapa de corrientes. CLAVE ALTA siempre.

   ANIMACIÓN CON PROPÓSITO (única en la página): la pieza se escribe sola tras
   un cursor que recorre las ocho horas en 25 s. El dato es el estado en
   reposo: con prefers-reduced-motion la partitura aparece entera y quieta.
   Todo en este archivo — JS cero, inline cero (ley CSP de la casa).
   ========================================================================== */

.pt-page{background:var(--paper)}
.pt-head{padding:clamp(40px,7vh,80px) 28px 6px}
.pt-h1{font-size:clamp(42px,6.5vw,78px);line-height:1;letter-spacing:-.024em;
  color:var(--ink);margin:0 0 14px}
.pt-lead{max-width:60ch;font-size:17.5px;line-height:1.6;color:var(--muted);margin:0}
.pt-crumb{padding:clamp(28px,5vh,52px) 28px 0;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.18em}
.pt-crumb a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}

/* ---------- el atril (índice): la pieza en reproducción ---------- */
.pt-atril{padding:26px 28px 8px}
.pt-atril-cab{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin:0 0 10px}
.pt-casa{font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  color:var(--warm-grey);text-transform:uppercase}
.pt-atril-nombre{font-size:clamp(22px,3vw,32px);color:var(--ink);text-decoration:none}
.pt-atril-nombre:hover{border-bottom:1px solid var(--line-2)}
.pt-atril-ir{margin-left:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}

/* ---------- el pliego ---------- */
.pt-pliego{margin:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:10px 0 4px;background:var(--paper)}
.pt-pliego svg{display:block;width:100%;height:auto}

.pt-grid{stroke:var(--line);stroke-width:.5;opacity:.5}
.pt-lane{stroke:var(--line-2);stroke-width:.5;opacity:.8}
.pt-sec{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;
  fill:var(--warm-grey);text-transform:uppercase}
.pt-lbl{font-family:var(--mono);font-size:10.5px;fill:var(--ink)}
.pt-glifo{opacity:.85}
/* PIGMENTO, NO PASTEL (owner 2026-07-26: "mejora la coloración"): el vientre
   se rellena con la tinta real en multiply — sobre papel suma como acuarela
   de grabado, no como velo gris — y el contorno va casi pleno. */
.pt-env{fill:var(--v);fill-opacity:.30;stroke:var(--v);stroke-width:.9;
  stroke-opacity:.88;mix-blend-mode:multiply}
.pt-env.sin-tinta{fill:var(--warm-grey);fill-opacity:.14;stroke:var(--warm-grey);
  stroke-opacity:.6}
.pt-axis{stroke:var(--ink);stroke-width:.75;opacity:.65}
.pt-tick{stroke:var(--ink);stroke-width:.6;opacity:.55}
.pt-tick-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;fill:var(--warm-grey)}
.pt-relevo{stroke:var(--burgundy-deep);stroke-width:.6;stroke-dasharray:1.5 3.5;opacity:.55}
.pt-relevo-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;
  fill:var(--burgundy-deep);opacity:.85}
.pt-cursor{stroke:var(--ink);stroke-width:.75;opacity:.32}

/* ---------- EL TRAZADO (PARTITURA-PDP-BIBLIOTECA, 2026-08-03) --------------
   Antes: `.pt-envs{animation:pt-write 25s linear infinite}` + el cursor igual —
   un bucle PERPETUO, y global: se ejecutaba en TODA superficie que incluyera el
   pliego, la PDP incluida. La casa prohíbe la animación perpetua, y la orden
   del owner separa las dos lecturas: en la PDP la partitura general va
   ESTÁTICA, y el dibujo es lo que se gana al venir a la Biblioteca.

   Así que el trazado deja de ser el estado por defecto y pasa a ser opt-in por
   clase, puesta por la plantilla que la merece. Nada se ata a :hover, nada se
   repite: `both` (fill-mode) sin iteration-count = se dibuja UNA vez y descansa
   en el estado final. El dato sigue siendo el reposo.

   EL SVG NO SE TOCA: es superficie sellada. Toda la animación cuelga de una
   clase en un envoltorio externo y de selectores contra la estructura que el
   pliego ya tiene. Por eso el escalonado va por ÍNDICE de voz (:nth-of-type) y
   no por el instante real de entrada de cada voz: eso último exigiría una
   custom property por <path> dentro del SVG, es decir, editar el sello.
   El índice ES el orden de aparición — las voces se emiten sección por sección
   (salida → corazón → fondo), así que dibujar por índice dibuja la casa en su
   propio orden de lectura. */

/* reposo por defecto: la PDP, y cualquier superficie sin interruptor */
.pt-envs{clip-path:none}
.pt-cursor{display:none}

/* (a) EL DETALLE ANIMADO DE LA BIBLIOTECA — voz por voz, una vez.
   Cada vientre se revela sobre su PROPIA caja (en SVG sin caja CSS, el cuadro
   de referencia de un basic-shape es la fill-box), o sea de su entrada hacia su
   cola: el gesto va en la misma dirección que el eje del tiempo. */
.pt-anima .pt-env{clip-path:inset(0 100% 0 0);
  animation:pt-voz 700ms cubic-bezier(.22,1,.36,1) both}
@keyframes pt-voz{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
/* El escalonado se resuelve por cascada, no por 30 reglas exactas: cada
   `:nth-of-type(n+k)` casa de la posición k en adelante, así que a cada voz la
   gana la ÚLTIMA regla que la alcanza — y la de más abajo hace además de tope
   para catálogos con más voces de las previstas. El <path> espaciador del
   grupo es el of-type nº1, así que la primera voz es la nº2. */
.pt-anima .pt-env:nth-of-type(n+2){animation-delay:0ms}
.pt-anima .pt-env:nth-of-type(n+3){animation-delay:80ms}
.pt-anima .pt-env:nth-of-type(n+4){animation-delay:160ms}
.pt-anima .pt-env:nth-of-type(n+5){animation-delay:240ms}
.pt-anima .pt-env:nth-of-type(n+6){animation-delay:320ms}
.pt-anima .pt-env:nth-of-type(n+7){animation-delay:400ms}
.pt-anima .pt-env:nth-of-type(n+8){animation-delay:480ms}
.pt-anima .pt-env:nth-of-type(n+9){animation-delay:560ms}
.pt-anima .pt-env:nth-of-type(n+10){animation-delay:640ms}
.pt-anima .pt-env:nth-of-type(n+11){animation-delay:720ms}
.pt-anima .pt-env:nth-of-type(n+12){animation-delay:800ms}
.pt-anima .pt-env:nth-of-type(n+13){animation-delay:880ms}
.pt-anima .pt-env:nth-of-type(n+14){animation-delay:960ms}
.pt-anima .pt-env:nth-of-type(n+15){animation-delay:1040ms}
.pt-anima .pt-env:nth-of-type(n+16){animation-delay:1120ms}
.pt-anima .pt-env:nth-of-type(n+17){animation-delay:1200ms}
.pt-anima .pt-env:nth-of-type(n+18){animation-delay:1280ms}
.pt-anima .pt-env:nth-of-type(n+19){animation-delay:1360ms}
.pt-anima .pt-env:nth-of-type(n+20){animation-delay:1440ms}
.pt-anima .pt-env:nth-of-type(n+21){animation-delay:1520ms}
.pt-anima .pt-env:nth-of-type(n+22){animation-delay:1600ms}
.pt-anima .pt-env:nth-of-type(n+23){animation-delay:1680ms}
.pt-anima .pt-env:nth-of-type(n+24){animation-delay:1760ms}
.pt-anima .pt-env:nth-of-type(n+25){animation-delay:1840ms}
.pt-anima .pt-env:nth-of-type(n+26){animation-delay:1920ms}
.pt-anima .pt-env:nth-of-type(n+27){animation-delay:2000ms}
.pt-anima .pt-env:nth-of-type(n+28){animation-delay:2080ms}
.pt-anima .pt-env:nth-of-type(n+29){animation-delay:2160ms}
.pt-anima .pt-env:nth-of-type(n+30){animation-delay:2240ms}
.pt-anima .pt-env:nth-of-type(n+31){animation-delay:2320ms}

/* (b) DOS PIEZAS, JUNTAS — el barrido de grupo de siempre (su lead promete que
   "los cursores corren a la par", y siguen corriendo), pero UNA vez: `both` en
   lugar de `infinite`. 86% de barrido, 14% de calderón con la pieza entera a la
   vista. 770 px de recorrido en unidades de usuario = X1−X0 de partitura.py. */
.pt-anima-sweep .pt-envs{clip-path:inset(0 100% 0 0);
  animation:pt-write 25s linear both}
@keyframes pt-write{0%{clip-path:inset(0 100% 0 0)}86%,100%{clip-path:inset(0 0 0 0)}}

/* el cursor de la casa: las ocho horas leídas en veinticinco segundos — lo que
   declara el pliego, palabra por palabra — una sola vez, y al llegar al final
   se apaga en lugar de quedarse clavado como una raya suelta en el reposo. */
.pt-anima .pt-cursor,.pt-anima-sweep .pt-cursor{display:inline;
  animation:pt-sweep 25s linear both}
@keyframes pt-sweep{
  0%{transform:translateX(0);opacity:.32}
  86%{transform:translateX(770px);opacity:.32}
  100%{transform:translateX(770px);opacity:0}
}

/* C39 (W3C): con movimiento reducido no hay trazado ni barrido — se salta al
   estado final, que es justo el dato en reposo. */
@media (prefers-reduced-motion:reduce){
  .pt-anima .pt-env,.pt-anima-sweep .pt-envs{clip-path:none;animation:none}
  .pt-anima .pt-cursor,.pt-anima-sweep .pt-cursor{display:none;animation:none}
}

.pt-decl{font-family:var(--mono);font-size:11px;line-height:1.75;color:var(--warm-grey);
  max-width:82ch;margin:14px 0 0}

/* voz bajo el cursor del lector: el vientre se afirma (hover, sin JS) */
.pt-env:hover{fill-opacity:.44;stroke-opacity:1}
.pt-env.sin-tinta:hover{fill-opacity:.2;stroke-opacity:.75}

/* ---------- puertas y órdenes del atril ---------- */
.pt-puertas{display:flex;gap:26px;flex-wrap:wrap;padding:22px 28px 0}
.pt-puerta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--ink);
  text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:2px}
.pt-puerta:hover{border-color:var(--ink)}
.pt-orden{display:flex;gap:18px;padding:26px 28px 0;border-bottom:1px solid var(--line);
  margin:0 0 6px}
.pt-orden-l{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--warm-grey);
  text-decoration:none;padding:0 2px 10px;border-bottom:1px solid transparent;margin-bottom:-1px}
.pt-orden-l.is-on{color:var(--ink);border-color:var(--ink)}
.pt-orden-l:hover{color:var(--ink)}

.pt-grupo{padding:30px 28px 4px}
.pt-grupo-cab{display:flex;align-items:baseline;gap:14px;margin:0 0 14px}
.pt-grupo-h2{font-size:clamp(19px,2.4vw,25px);margin:0;color:var(--ink)}
.pt-grupo-n{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--warm-grey)}
.pt-mini-relevo{stroke:var(--burgundy-deep);stroke-width:.7;stroke-dasharray:1 2.4;opacity:.6}

/* LA GENERAL EN EL PREVIEW (owner 2026-08-04: «la parte inferior de tooodos
   los previews, pero solo la general») — la tira del incipit al pie de toda
   tarjeta/preview (_gen_strip.html). Reusa el dialecto pt-mini-* de arriba;
   esto solo dimensiona el lienzo dentro de la tarjeta. */
.pt-gstrip{display:block;width:100%;height:auto;margin-top:10px}
.sr-item .pt-gstrip{width:108px;height:25px;margin-top:3px}
.pdp-rec-card .pt-gstrip{margin-top:7px}
.soon-row-info .pt-gstrip{max-width:300px;margin-top:8px}

/* ---------- dos piezas, juntas ---------- */
.pt-head-j{padding-top:clamp(20px,4vh,40px)}
.pt-eleccion{display:flex;gap:18px;align-items:end;flex-wrap:wrap;padding:10px 28px 26px}
.pt-sel{display:flex;flex-direction:column;gap:6px;min-width:min(320px,100%)}
.pt-sel-l{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--warm-grey);
  text-transform:uppercase}
.pt-sel select{appearance:none;font:13.5px var(--sans);color:var(--ink);
  background:var(--paper);border:1px solid var(--line);padding:10px 12px;max-width:100%}
.pt-sel select:focus{outline:1px solid var(--ink);outline-offset:-1px}
.pt-junta{padding:16px 28px 0}
.pt-junta + .pt-junta{padding-top:34px}
.pt-vacia{font-size:15.5px;color:var(--muted);max-width:60ch;
  border-top:1px solid var(--line);padding-top:18px}

/* ---------- el muro de incipits ---------- */
.pt-mundo{padding:34px 28px 6px}
.pt-mundo-cab{display:flex;align-items:baseline;gap:14px;margin:0 0 14px}
.pt-mundo-h2{font-size:clamp(19px,2.4vw,25px);margin:0}
.pt-mundo-h2 a{color:var(--ink);text-decoration:none}
.pt-mundo-h2 a:hover{border-bottom:1px solid var(--line-2)}
.pt-mundo-n{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--warm-grey)}
.pt-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:20px 22px}
.pt-mini{display:flex;flex-direction:column;gap:3px;text-decoration:none;min-width:0}
.pt-mini svg{display:block;width:100%;height:auto}
.pt-mini-lane{stroke:var(--line-2);stroke-width:.6}
/* cada vientre con la tinta real de SU sección (--vc desde la vista;
   currentColor = dominante solo como herencia), en multiply: el incipit es
   ahora tres pigmentos, no un tono lavado tres veces */
.pt-mini-p1{fill:var(--vc,currentColor);opacity:.52;stroke:var(--vc,currentColor);
  stroke-width:.5;mix-blend-mode:multiply}
.pt-mini-p2{fill:var(--vc,currentColor);opacity:.42;stroke:var(--vc,currentColor);
  stroke-width:.5;mix-blend-mode:multiply}
.pt-mini-p3{fill:var(--vc,currentColor);opacity:.34;stroke:var(--vc,currentColor);
  stroke-width:.5;mix-blend-mode:multiply}
.pt-mini-casa{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  color:var(--warm-grey);text-transform:uppercase;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.pt-mini-nombre{color:var(--ink);font-size:14px;line-height:1.3;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pt-mini:hover .pt-mini-nombre{text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:.5px}

.pt-pie{padding:36px 28px 64px}
.pt-pie-l{font-family:var(--mono);font-size:10.5px;line-height:1.8;color:var(--warm-grey);
  max-width:78ch;border-top:1px solid var(--line);padding-top:14px;margin:0}

/* ---------- la pieza (detalle): EL PRODUCTO ARRIBA, SU PARTITURA DEBAJO ----
   (owner 2026-08-02). La cabecera dejó de ser un título con miniatura al borde
   y pasó a ser la ficha corta del producto: frasco montado en placa (el mismo
   filete + crema del resto de la casa, a escala mayor), y bajo el nombre una
   fila de compra —precio en mono, puerta en tinta— separada por un filete, que
   es donde el lector decide. `align-items:center` en la fila superior (antes
   `end`): el plato del frasco es más alto que casa+nombre+familia, y anclarlos
   por arriba o por abajo dejaba el hueco entero de un solo lado — centrados, el
   aire se reparte y el bloque se lee como una pieza, no como texto con una
   estampilla al margen. */
.pt-cab{display:grid;grid-template-columns:1fr auto;gap:clamp(20px,4vw,40px);
  align-items:center;padding:14px 28px 22px}
.pt-nombre{font-size:clamp(34px,5vw,58px);line-height:1.02;letter-spacing:-.02em;
  color:var(--ink);margin:10px 0 8px}
.pt-vias{margin:0;font-size:13.5px}
.pt-vias a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line-2)}
.pt-frasco{display:block;width:clamp(120px,13vw,156px)}
.pt-frasco img{display:block;width:100%;height:auto;border:1px solid var(--line);
  background:var(--cream)}

/* la fila de compra — mismo idioma que la tarjeta del catálogo (.card .price).
   Ocupa las DOS columnas: su filete corre bajo nombre y frasco, de modo que el
   producto queda cerrado como una pieza y la partitura empieza después de él,
   no dentro de él. */
.pt-compra{grid-column:1/-1;display:flex;align-items:center;
  gap:clamp(14px,2.4vw,26px);flex-wrap:wrap;
  margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.pt-precio{font-size:12.5px;letter-spacing:.04em;color:var(--ink)}
.pt-precio-wl{color:var(--warm-grey);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase}
.pt-precio-w{color:var(--warm-grey);text-decoration-thickness:1px}
.pt-precio-save{color:var(--burgundy-deep)}
.pt-precio-tallas{color:var(--warm-grey)}

/* la obra entra pegada al filete que cierra el producto: sin rótulo propio (ver
   la nota en partitura.html — repetiría el crumb), solo el aire justo. */
.pt-obra{padding-top:4px}

/* ≤640px: el producto NO desaparece — se apila (frasco primero, como en toda
   ficha de la casa), en vez del `display:none` que dejaba la partitura sola
   justo en el ancho donde más falta hace saber de quién es. */
@media (max-width:640px){
  .pt-cab{grid-template-columns:1fr}
  .pt-frasco{order:-1;width:132px}
  .pt-compra{gap:14px}
}

.pt-h2{font-size:clamp(19px,2.4vw,24px);color:var(--ink);margin:0 0 12px}
.pt-armonia{padding:34px 28px 0}
.pt-armonia .plates{max-width:620px}
/* LAS PLACAS GRABADAS — copia VERBATIM del bloque de pdp.css (§plates), porque
   esta hoja viaja sola (la pieza no carga pdp.css) y los acordes hablan UN solo
   idioma en toda la casa (owner 2026-08-04: "La armonía es la vieja versión";
   las barras pt-barra* se retiraron con esa orden). El guard de sincronía vive
   en test_partitura.PlacasEnLaPiezaTests: si pdp.css cambia su galga y esta
   copia no la sigue, la suite lo caza. Mismo contrato de motion
   [data-reveal]/.is-revealed (augurea-motion.js, global en base.html). */
.plates{display:flex;flex-direction:column;gap:10px}
.plate{display:grid;grid-template-columns:11px 120px 1fr 32px;align-items:center;
  column-gap:16px;padding:19px 20px;border:1px solid rgba(74,22,34,.16);
  background:color-mix(in srgb,var(--hue,var(--muted)) 3%,var(--surface))}
.plate-medallion{width:11px;height:11px;border-radius:50%;
  background:var(--hue,var(--muted));
  box-shadow:inset 0 1px 1px rgba(0,0,0,.35),
    0 0 0 1px rgba(74,22,34,.25),
    0 0 0 3px color-mix(in srgb,var(--hue,var(--muted)) 22%,transparent)}
.plate-name{font-family:var(--serif);font-variant:small-caps;font-size:15.5px;
  letter-spacing:.03em;color:var(--ink)}
.plate-name .glifo{vertical-align:-2px}
.plate-gauge{position:relative;height:16px}
.plate-ticks{position:absolute;left:0;right:0;top:4px;bottom:4px;
  background-image:repeating-linear-gradient(to right,rgba(74,22,34,.32) 0 1px,transparent 1px 10%)}
.plate-gauge::after{content:"";position:absolute;left:0;right:0;top:7px;height:1px;
  background:rgba(74,22,34,.35)}
.plate-fill{position:absolute;left:0;top:6.5px;height:3px;
  background:linear-gradient(to right,
    color-mix(in srgb,var(--hue,var(--burgundy)) 55%,white 45%),
    var(--hue,var(--burgundy)));
  transform-origin:left center;transform:scaleX(0);
  transition:transform var(--dur-slow) var(--ease-out)}
.plate-marker{position:absolute;top:1px;width:1.5px;height:13px;
  background:var(--hue,var(--burgundy));
  transform:translateX(-.75px) scaleY(0);transform-origin:center bottom;
  transition:transform var(--dur-slow) var(--ease-out)}
.plates.is-revealed .plate-fill{transform:scaleX(1)}
.plates.is-revealed .plate-marker{transform:translateX(-.75px) scaleY(1)}
.plate-value{font-family:var(--mono);font-size:12.5px;letter-spacing:.03em;
  color:var(--muted);text-align:right}
.plates .plate:nth-child(1) .plate-fill,.plates .plate:nth-child(1) .plate-marker{transition-delay:0ms}
.plates .plate:nth-child(2) .plate-fill,.plates .plate:nth-child(2) .plate-marker{transition-delay:70ms}
.plates .plate:nth-child(3) .plate-fill,.plates .plate:nth-child(3) .plate-marker{transition-delay:140ms}
.plates .plate:nth-child(4) .plate-fill,.plates .plate:nth-child(4) .plate-marker{transition-delay:210ms}
.plates .plate:nth-child(5) .plate-fill,.plates .plate:nth-child(5) .plate-marker{transition-delay:280ms}
.plates .plate:nth-child(n+6) .plate-fill,.plates .plate:nth-child(n+6) .plate-marker{transition-delay:350ms}
.pt-arm-nota{font-family:var(--mono);font-size:10.5px;line-height:1.7;
  color:var(--warm-grey);margin:10px 0 0}

.pt-vecinas{padding:38px 28px 0}
.pt-salida{display:flex;gap:22px;align-items:center;padding:44px 28px 72px}
.pt-cta{font-size:13.5px;color:var(--paper);background:var(--ink);text-decoration:none;
  padding:11px 20px}
.pt-cta:hover{background:var(--burgundy-deep)}
.pt-cta-sec{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--ink);
  text-decoration:none;border-bottom:1px solid var(--line-2)}

@media (prefers-reduced-motion:reduce){
  /* el dato es el estado en reposo — la galga aparece llena y quieta */
  .plate-fill{transform:scaleX(1)!important;transition:none!important}
  .plate-marker{transform:translateX(-.75px) scaleY(1)!important;transition:none!important}
}

/* ---------- puerta PDP (contrato §10 — el ÚNICO toque autorizado a la PDP;
   clases propias de partitura.css, pdp.css queda intacto) ---------- */
.pt-pdp-door{display:flex;align-items:center;gap:16px;padding:18px;
  border:1px solid var(--line);background:var(--paper);text-decoration:none;
  color:inherit}
.pt-pdp-door:hover{border-color:var(--ink)}
.pt-pdp-door svg{flex:none;width:66px;height:15px}
.pt-pdp-door-lane{stroke:var(--line-2);stroke-width:.6}
.pt-pdp-door-p1{fill:currentColor;opacity:.52;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-door-p2{fill:currentColor;opacity:.42;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-door-p3{fill:currentColor;opacity:.34;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-door-t{min-width:0}
.pt-pdp-door-h{display:block;font-size:14.5px;color:var(--ink);margin:0 0 3px}
.pt-pdp-door-l{display:block;font-family:var(--mono);font-size:10.5px;line-height:1.5;
  color:var(--warm-grey)}

/* ============================================================================
   v2 — LA BIBLIOTECA (PARTITURA-BIBLIOTECA-02, 2026-07-27). Ola 1's single
   .pt-pdp-door is retired (unused, left in place — parche y adición, nunca
   se borra): the PDP now carries (a) a compact incipit under NOTAS, (b) the
   full pliego as its own "La partitura" section, and the surface itself
   moves house to /biblioteca/partituras/*, whose landing gets its first
   room here too.
   ========================================================================== */

/* ---------- nav-budget: room for the new "Biblioteca" header link ----------
   base.css's OWN documented fix for this exact bug class (P12-V2 9.4: the
   full search field's ~200px min-width was collapsing to its icon too late,
   so the header row overflowed its own clientWidth before the collapse
   point). One more nav word (Biblioteca) reproduces the same overflow a
   little higher up the width range — measured empirically at 1440px
   (scrollWidth 1485 vs clientWidth 1440, 45px real overflow), fixed by
   raising base.css's 1350px collapse threshold to 1500px. Same properties,
   same technique, additive override only (base.css itself stays untouched —
   contrato PARTITURA-BIBLIOTECA-02 prohibition) — this file only LOADS when
   the flag is on, i.e. exactly when the extra nav word exists.

   GATE FIX (PARTITURA-GATE-FIX-03, PT-NAV-01 + PT-PERF-02, 2026-07-28): the
   original block had no lower bound, so `@media(max-width:1500px)` stayed
   ACTIVE underneath base.css's own 940px/820px bands too. Same selectors,
   same specificity, loaded AFTER base.css (templates/base.html) → this
   file's `.hdr-actions .hdr-search-icon{display:inline-flex}` was winning
   the cascade even below 820px, resurrecting the search icon next to the
   burger (base.css:196 wants the burger to be the SOLE control down there)
   — double search control + real horizontal overflow on every page, in
   production, on any phone. `.nav{gap:18px}` had the same leak, flattening
   base.css's own 24px (≤1350px) / 20px (≤940px) steps to 18px everywhere
   below 1500px instead of only in the new 1351-1500px band this patch was
   meant to open. Fix: give the block a floor at 1351px — base.css already
   owns 821-1350px correctly (its own `@media(max-width:1350px)` block sets
   the same hdr-search/icon swap), so this file only needs to extend that
   SAME behaviour into the untouched 1351-1500px gap, never reach below it.

   RESIDUO 1501px (asiento 6, 2026-07-29, medido con motor): con la banda topada
   en 1500 quedaba una zona 1501-1539 donde el buscador COMPLETO vuelve pero aún
   no cabe junto a "Biblioteca" (desborde 15px→0: 1501=15, 1510=10, 1520=5,
   1540=0; con flag OFF a 1501 = 0, o sea solo-con-flag). El techo sube al punto
   de ajuste real MENOS uno: 1539. A partir de 1540 el buscador completo cabe. */
@media(min-width:1351px) and (max-width:1539px){
  .hdr-search{display:none}
  .hdr-actions .hdr-search-icon{display:inline-flex}
  .nav{gap:18px}
}

/* ---------- (a) el incipit bajo NOTAS (A1) — ancla, no puerta ---------- */
.pt-pdp-mini{display:flex;align-items:center;gap:14px;padding:12px 0 0}
.pt-pdp-mini-svg{flex:none;width:88px;height:20px;color:var(--warm-grey)}
.pt-pdp-mini-lane{stroke:var(--line-2);stroke-width:.6}
.pt-pdp-mini-p1{fill:currentColor;opacity:.52;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-mini-p2{fill:currentColor;opacity:.42;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-mini-p3{fill:currentColor;opacity:.34;stroke:currentColor;stroke-width:.5;
  mix-blend-mode:multiply}
.pt-pdp-mini-cap{font-size:11px;line-height:1.6;color:var(--warm-grey);margin:0}
.pt-pdp-mini-cap a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.pt-pdp-mini-cap a:hover{border-color:var(--ink)}

/* ---------- (b) la sección completa embebida en la PDP (A2) ---------- */
#pt-full .pt-pliego{margin-left:0;margin-right:0}
.pt-pdp-full-salida{display:flex;gap:20px 22px;flex-wrap:wrap;align-items:center;
  padding-top:20px}

/* ============================================================================
   v3 — LA PARTITURA GENERAL AL PIE DEL PERFUME (PARTITURA-PDP-BIBLIOTECA,
   2026-08-03). Orden del owner: "la partitura general antes se mostraba en la
   parte de abajo del perfume, cosa que no aparece actualmente".

   No faltaba: estaba mal presentada. Vivía dentro de `.pdp-ficha`, la columna
   izquierda del grid de la PDP — 598.2px medidos a 1440 para un pliego cuyo
   viewBox mide 1000 unidades: escala 0.598, y sus etiquetas de voz, declaradas
   a 10.5, aterrizaban a 6.28px reales. Ilegible, y con media página en blanco
   al lado. Estar no es aparecer.

   Ahora la sección es una BANDA a sangre al pie de la ficha, hermana de `.wrap`
   y no hija del grid: ocupa el ancho de página completo, y su contenido se
   re-encuadra en el mismo `.wrap` que el resto de la ficha para que el borde
   izquierdo caiga en la misma calle. 1224px de pliego a 1440 → escala 1.224 →
   etiquetas a 12.85px. Sin márgenes negativos, sin 100vw (que cuenta la barra
   de scroll y desborda en Windows): un bloque normal a nivel de página no
   puede solaparse con el carril de compra ni inventar scroll horizontal.
   ========================================================================== */
.pt-pdp-band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--cream);margin-top:clamp(30px,5vh,52px);
  padding:clamp(32px,5vh,56px) 0 clamp(34px,5vh,58px)}
.pt-pdp-band .chunk-h{margin-bottom:10px}
.pt-pdp-band-lead{max-width:64ch;font-size:15px;line-height:1.6;color:var(--muted);
  margin:0 0 20px}

/* ---------- LA GENERAL (owner 2026-08-04: la completa no va en la ficha) ----
   La hoja blanca de la banda ahora lleva los tres vientres agregados. La tinta
   es ESPEJO de .pt-env (mismo fill/opacity/blend — mismo pigmento a otro
   grano); las líneas del aparato reusan .pt-axis/.pt-tick/.pt-relevo del
   pliego. Los TEXTOS llevan clase propia: a escala fluida bajo 640px medirían
   <5px, así que se ocultan y el relevo baja al pie HTML .pt-gen-cap. */
.pt-general{background:var(--paper);padding:14px 12px 6px}
.pt-general-svg{display:block;width:100%;height:auto}
.pt-gen{fill:var(--v,var(--warm-grey));fill-opacity:.30;stroke:var(--v,var(--warm-grey));
  stroke-width:1.1;stroke-opacity:.88;mix-blend-mode:multiply}
.pt-gen.sin-tinta{fill:var(--warm-grey);fill-opacity:.14;stroke:var(--warm-grey);
  stroke-opacity:.6}
.pt-gen-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  fill:var(--warm-grey);text-transform:uppercase}
.pt-gen-tlbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;
  fill:var(--warm-grey)}
.pt-gen-rlbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;
  fill:var(--burgundy-deep)}
.pt-gen-cap{display:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  color:var(--burgundy-deep);margin:8px 0 0}
@media (max-width:640px){
  .pt-gen-lbl,.pt-gen-tlbl,.pt-gen-rlbl{display:none}
  .pt-gen-cap{display:block}
}

/* ---------- el pliego a 375: se desplaza, no se encoge ----------
   A 375 la columna daba 335px → escala 0.335 → etiquetas a 3.52px: no era
   texto, era grano. El SVG está sellado (no se le puede tocar ni el viewBox ni
   un font-size), así que la solución es de envoltorio: el pliego se sirve a
   tamaño natural — 1000px = 1 unidad de viewBox por píxel, escala 1.000,
   etiquetas a sus 10.5px declarados — dentro de una región que se desplaza.
   Con tabindex + role + aria-label la región es alcanzable y recorrible con
   teclado, que es lo que exige una zona con scroll (WCAG 2.1.1); el foco se
   ve porque la casa no esconde nunca el anillo. En escritorio el min-width
   queda por debajo del ancho disponible, así que no aparece scroll alguno. */
.pt-scroll{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain}
.pt-scroll > .pt-pliego{min-width:1000px}
.pt-scroll:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* ---------- la biblioteca (landing, B1) ---------- */
.bib-page{background:var(--paper)}
.bib-head{padding:clamp(40px,7vh,80px) 28px 6px}
.bib-h1{font-size:clamp(42px,6.5vw,78px);line-height:1;letter-spacing:-.024em;
  color:var(--ink);margin:0 0 14px}
.bib-lead{max-width:62ch;font-size:17.5px;line-height:1.6;color:var(--muted);margin:0}
.bib-lead strong{color:var(--ink);font-weight:600}
.bib-salas{padding:34px 28px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:22px}
.bib-sala{display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid var(--line);
  text-decoration:none;color:inherit;background:var(--paper)}
.bib-sala-viva:hover{border-color:var(--ink)}
.bib-sala-icon{width:100%;height:auto;max-width:132px;color:var(--burgundy-deep)}
.bib-sala-lane{stroke:var(--line-2);stroke-width:.6}
.bib-sala-p1{fill:currentColor;opacity:.52;stroke:currentColor;stroke-width:.5;mix-blend-mode:multiply}
.bib-sala-p2{fill:currentColor;opacity:.42;stroke:currentColor;stroke-width:.5;mix-blend-mode:multiply}
.bib-sala-p3{fill:currentColor;opacity:.34;stroke:currentColor;stroke-width:.5;mix-blend-mode:multiply}
.bib-sala-nombre{font-size:20px;color:var(--ink)}
.bib-sala-desc{font-size:13px;line-height:1.5;color:var(--muted)}
.bib-sala-n{font-size:10.5px;letter-spacing:.1em;color:var(--warm-grey);text-transform:uppercase}
.bib-mas{padding:30px 28px 64px;font-family:var(--mono);font-size:11px;color:var(--warm-grey);
  border-top:1px solid var(--line);margin:26px 0 0;max-width:70ch}