/* Capa de ajuste del catálogo saneado sobre V3. Se carga después de papiteje.css y v3.css.
   No redefine la dirección: solo índice/grilla de catálogo, targets táctiles y lectura. */

/* ── Grilla de catálogo (índice y categorías): todas las piezas visibles ── */
.family-catalog{padding:clamp(56px,7vw,96px) var(--pad);background:#24231f}
.family-catalog>header{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin:0 0 clamp(26px,3vw,40px);padding-bottom:18px;border-bottom:1px solid var(--line)}
.family-catalog>header h2{margin:0;font-size:clamp(28px,3vw,44px)}
.family-catalog>header p{margin:0;color:var(--cruda2);font:500 13px Archivo,sans-serif;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.catalog-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:clamp(28px,3vw,44px) clamp(16px,2vw,28px)}
.catalog-card{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.catalog-card figure{margin:0;overflow:hidden;background:#11110f;aspect-ratio:4/5}
.catalog-card img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s var(--paso),opacity .4s var(--paso)}
.catalog-card h3{margin:16px 0 6px;font:600 clamp(19px,1.5vw,23px)/1.15 Archivo,sans-serif;letter-spacing:-.01em;text-wrap:balance}
.catalog-card p{margin:0;color:var(--cruda2);font:400 15px/1.4 Faustina,serif}
.catalog-card b{display:inline-block;margin-top:12px;padding-bottom:3px;border-bottom:1px solid currentColor;font:500 13px Archivo,sans-serif;letter-spacing:.04em}
.catalog-card:focus-visible{outline:2px solid var(--oro);outline-offset:4px}
@media (hover:hover) and (pointer:fine){
  .catalog-card:hover img{transform:scale(1.03)}
  .catalog-card:hover b{color:var(--oro)}
}
.catalog-card:active img{opacity:.88}

/* ── Ficha: lectura ── */
.producto-page .relation-lists li{font-size:15px;line-height:1.45}
.producto-page .relation-lists li span{font-size:11px}
.v3 :is(.crumb,.breadcrumb){font-size:13px}
.gallery-label{font-size:11px}

/* ── Anterior / siguiente: táctil y legible ── */
.pasos{font-size:13px;letter-spacing:.06em;align-items:stretch}
.pasos a,.pasos span{display:inline-flex;align-items:center;min-height:44px}

/* ── Miniaturas: nunca bajo 44 px; fila desplazable si no caben ── */
.producto-page .thumbs{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
.producto-page .thumbs::-webkit-scrollbar{display:none}
.producto-page .thumbs button{flex:0 0 auto;min-width:44px;min-height:58px}

@media (max-width:760px){
  .family-catalog>header{flex-direction:column;gap:8px}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px}
  .catalog-card h3{font-size:17px}
  .catalog-card p{font-size:14px}
  .pasos{font-size:12px;gap:8px}
  .pasos a{padding:0 2px}
  .producto-page .thumbs{gap:8px}
  .producto-page .thumbs button{width:44px;min-width:44px;min-height:58px}
}
@media (prefers-reduced-motion:reduce){
  .catalog-card img{transition:none}
  .catalog-card:hover img{transform:none}
}

/* ═══ Refinamiento de materialidad (Carta = armazón; foto y fibra = superficie) ═══════════════ */
:root{
  --press:cubic-bezier(.23,1,.32,1);            /* respuesta inmediata al toque */
  --hilo-tinta:rgba(17,17,15,.16);              /* hilo de 1 px sobre fondo crudo */
  --hilo-tinta2:rgba(17,17,15,.34);
  --capa:linear-gradient(180deg,#1d1c18 0%,#161512 58%,#121110 100%);   /* calada en capas, no bloque plano */
  --luz-rasante:radial-gradient(ellipse 72% 58% at 50% 46%,rgba(176,141,86,.13),rgba(176,141,86,0) 72%);
}

/* ── Acciones: primaria llena · secundaria de hilo · terciaria subrayada ── */
.v3 .btn,.wa-consult,.consulta-add{
  position:relative;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .16s var(--press);
}
.v3 .btn{border:1px solid var(--cruda);box-shadow:inset 0 0 0 1px rgba(17,17,15,.08)}
.v3 .btn:active,.wa-consult:active,.consulta-add:active{transform:scale(.98)}
.wa-consult{border:1px solid #eeeae0;box-shadow:inset 0 -2px 0 rgba(17,17,15,.12)}
.wa-consult>span[aria-hidden]{display:inline-block;transition:transform .2s var(--press)}
.wa-consult--quiet{box-shadow:none;border-color:var(--ink)}
.visit-editorial .btn{background:var(--ink);color:var(--fiber);border-color:var(--ink);box-shadow:none}
.consulta-add{letter-spacing:.14em}
@media (hover:hover) and (pointer:fine){
  .v3 .btn:hover{background:transparent;color:var(--cruda);border-color:var(--cruda)}
  .visit-editorial .btn:hover{background:transparent;color:var(--ink);border-color:var(--ink)}
  .wa-consult:not([aria-disabled="true"]):hover{background:var(--cruda);border-color:var(--cruda)}
  .wa-consult:not([aria-disabled="true"]):hover>span[aria-hidden]{transform:translate(2px,-2px)}
  .wa-consult--quiet:not([aria-disabled="true"]):hover{background:var(--ink);color:var(--fiber);border-color:var(--ink)}
}
/* terciaria: base de hilo tenue; al pasar, la línea se teje de izquierda a derecha (la pasada) */
.text-link,.catalog-card b,.visit-contact a,.category-return a{
  border-bottom-color:transparent;
  background-image:linear-gradient(currentColor,currentColor),linear-gradient(var(--line),var(--line));
  background-size:0% 1px,100% 1px;background-position:0 100%,0 100%;background-repeat:no-repeat;
  transition:background-size .45s var(--paso),color .2s ease;
}
.visit-editorial .text-link,.family-chapter.reverse .text-link,.visit-contact a{
  background-image:linear-gradient(currentColor,currentColor),linear-gradient(var(--hilo-tinta2),var(--hilo-tinta2));
}
@media (hover:hover) and (pointer:fine){
  :is(.text-link,.visit-contact a,.category-return a):hover,.catalog-card:hover b{background-size:100% 1px,100% 1px}
}
:is(.text-link,.catalog-card b,.visit-contact a,.category-return a):focus-visible{background-size:100% 1px,100% 1px}

/* ── Capas tonales sobre la calada ── */
.producto-page .ficha__info,.family-catalog{background:var(--capa)}
.family-catalog{border-top:1px solid var(--line)}
.category-return{border-top:1px solid var(--line)}
.family-intro{border-bottom:1px solid var(--hilo-tinta)}

/* ── Foto ↔ texto: la foto se funde en su panel, sin marco ── */
.family-chapter figure{position:relative;overflow:hidden}
.family-chapter:not(.reverse) figure::after{
  content:"";position:absolute;inset:0 0 0 auto;width:26%;pointer-events:none;
  background:linear-gradient(90deg,rgba(17,17,15,0),var(--ink));
}
.family-chapter>div{position:relative}
.family-chapter>div::before{          /* hilo de urdimbre: armazón en el margen del texto */
  content:"";position:absolute;left:calc(var(--pad) - 22px);top:80px;bottom:80px;width:1px;background:var(--line);
}
.family-chapter.reverse>div::before{background:var(--hilo-tinta)}
.family-hero:after{background:linear-gradient(0deg,rgba(8,8,7,.94) 0%,rgba(8,8,7,.55) 34%,rgba(8,8,7,.1) 72%),linear-gradient(90deg,rgba(8,8,7,.35),rgba(8,8,7,0) 55%)}

/* ── Ficha: presencia de objeto ── */
.producto-page .ficha__foto{background:var(--luz-rasante),#11110f}
.producto-page .ficha__foto>img{background:transparent;padding:64px 28px 108px}
.producto-page .ficha__foto::after{   /* línea de apoyo: el objeto descansa sobre un hilo */
  content:"";position:absolute;left:8%;right:8%;bottom:96px;height:1px;background:var(--line);pointer-events:none;z-index:1;
}
.producto-page .thumbs{z-index:3}
.producto-page .thumbs button{transition:border-color .2s ease,opacity .2s ease,transform .16s var(--press);opacity:.72}
.producto-page .thumbs button[aria-current="true"],.producto-page .thumbs button:focus-visible{opacity:1}
.producto-page .thumbs button:active{transform:scale(.96)}
@media (hover:hover) and (pointer:fine){.producto-page .thumbs button:hover{opacity:1;transform:none}}
.producto-page .relation-lists section{border-top-color:var(--line)}
.product-consult{border-top-color:var(--line)}

/* catálogo: el objeto sobre su propia sombra de telar, con hilo de contorno */
.catalog-card figure{background:var(--luz-rasante),#11110f;outline:1px solid var(--hilo);outline-offset:-1px}
.catalog-card h3{padding-top:14px;border-top:1px solid var(--line)}

/* ── Ritmo entre secciones ── */
.family-chapter + .family-chapter{border-top:1px solid var(--line)}
.family-chapter.reverse + .family-chapter,.family-chapter + .family-chapter.reverse{border-top:0}

@media (max-width:760px){
  .family-chapter:not(.reverse) figure::after{inset:auto 0 0 0;width:auto;height:30%;background:linear-gradient(180deg,rgba(17,17,15,0),var(--ink))}
  .family-chapter>div::before{display:none}
  .producto-page .ficha__foto>img{padding:62px 14px 96px}
  .producto-page .ficha__foto::after{bottom:86px}
}
@media (prefers-reduced-motion:reduce){
  .v3 .btn,.wa-consult,.consulta-add,.text-link,.catalog-card b,.producto-page .thumbs button{transition:none}
  .v3 .btn:active,.wa-consult:active,.consulta-add:active,.producto-page .thumbs button:active{transform:none}
}

/* ── QA final: contraste de la numeración, dato único y targets táctiles ── */
.producto-page .relation-lists li span{color:var(--cruda2)}
.producto-page .relation-lists li.solo{display:block}
@media (max-width:760px){
  .v3 :is(.crumb,.breadcrumb) a{display:inline-flex;align-items:center;min-height:44px}
  .burger{min-height:44px;min-width:64px}
  .brand-lockup--header{display:inline-flex;align-items:center;min-height:44px}
}

/* ── Zona táctil de 44 px sin agrandar el enlace visible ── */
.hero-link,.v3-footer a[href^="mailto:"]{position:relative}
.hero-link::before,.v3-footer a[href^="mailto:"]::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:max(44px,100%);transform:translateY(-50%);
}
.v3-footer a[href^="mailto:"]{justify-self:start}

/* ── Tienda: guías de 1 px del recorrido (urdimbre vertical, trama horizontal) ── */
[data-telar-scene="tienda"]{position:relative}
.telar-guia{position:absolute;display:block;pointer-events:none;background:var(--line);z-index:1}
.telar-guia--urdimbre{left:calc(-1 * min(28px, var(--pad) / 2));top:0;bottom:0;width:1px;transform-origin:50% 0}
.telar-guia--trama{left:calc(-1 * min(28px, var(--pad) / 2));right:0;top:700px;height:1px;transform-origin:0 50%}
@media (max-width:760px){.telar-guia--trama{top:500px}}

/* ── Tienda: el pie de la foto de entrada pertenece a su marco, no flota sobre la foto de colores ── */
.shop-world__stage--final .shop-world__door{background:#171713}
.shop-world__stage--final .shop-world__door figcaption{margin:0;padding:12px 4px 4px;max-width:none;color:var(--cruda2);line-height:1.45}
@media (max-width:760px){
  .shop-world__stage--final .shop-world__door figcaption{padding:9px 2px 2px;font-size:11px}
}