/* =====================================================================
   Arteikos · páginas interiores
   Extiende arteikos.css (el sistema de Claude Design) a la tienda, la ficha
   de producto, el catálogo, Comfama, Empresa, Contacto y el 404.
   Usa solo sus variables; aquí no se definen colores nuevos.
   ===================================================================== */

/* ---------- Base compartida ---------- */
.aviso-pruebas{padding:6px 12px;background:var(--lime-500);color:var(--ink);text-align:center;font:700 13px/1.4 var(--font-text)}
main a:not([class]){color:var(--white);text-decoration:underline;text-decoration-color:var(--lime-500);text-decoration-thickness:2px;text-underline-offset:4px}
main a:not([class]):hover{color:var(--lime-500)}
/* grupos de botones dentro de un párrafo */
p:has(> .boton){display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:699px){p:has(> .boton) > .boton{width:100%}}
/* El botón de borde toma el color de la superficie donde está (--sup) */
.boton--borde::after{background:var(--sup,var(--carbon-900))}
.boton--borde:hover::after{background:var(--sup-h,var(--carbon-800))}
.boton--en-800{--sup:var(--carbon-800);--sup-h:var(--carbon-700)}
.titulo--sec{font-size:26px}
@media (min-width:1024px){.titulo--sec{font-size:34px}}
.seccion--tienda{padding-top:28px}
.seccion--pegada{padding-top:0}
select{font:inherit;color:inherit}

/* La tarjeta usa h2 en los listados y h3 dentro de secciones tituladas */
.tarjeta__nombre{margin:6px 0 8px;font:600 15px/20px var(--font-text);color:var(--white)}
.tarjeta:hover .tarjeta__nombre{text-decoration:underline;text-decoration-color:var(--lime-500);text-decoration-thickness:2px;text-underline-offset:4px}
@media (min-width:700px){.tarjeta__nombre{font-size:17px;line-height:22px}}

/* ---------- Encabezado de página ---------- */
.encabezado{padding:28px 0 32px;overflow:hidden;border-bottom:1px solid var(--carbon-700)}
.encabezado h1{margin:10px 0 12px;font:italic 900 34px/.98 var(--font-display);text-transform:uppercase;letter-spacing:-.01em;color:var(--white);overflow-wrap:anywhere}
.encabezado .bajada{max-width:640px}
.encabezado .acciones{margin-top:22px}
.encabezado__fila{display:grid;gap:24px;align-items:center}
.encabezado__tapa{display:none}
@media (min-width:700px){.encabezado h1{font-size:46px}}
@media (min-width:1024px){
  .encabezado{padding:52px 0 56px}
  .encabezado h1{font-size:58px}
  /* franjas del catálogo, a la derecha */
  .encabezado::after{content:"";position:absolute;z-index:-1;top:-40px;bottom:-40px;right:9%;width:70px;background:var(--lime-500);transform:skewX(32deg);box-shadow:96px 0 0 -18px var(--lime-500),190px 0 0 var(--lime-700);opacity:.9;pointer-events:none}
  .encabezado__fila{grid-template-columns:1.5fr .5fr}
  .encabezado__tapa{display:block;max-width:230px;justify-self:end;transform:rotate(4deg);box-shadow:var(--shadow-lift);transition:transform var(--ease)}
  .encabezado__tapa:hover{transform:rotate(0)}
  .encabezado:has(.encabezado__tapa)::after{display:none}
}

.migas{display:flex;flex-wrap:wrap;gap:0 10px;margin-bottom:6px;font:500 13px/18px var(--font-text);color:var(--ink-muted)}
.migas a,.migas span{display:inline-flex;align-items:center;min-height:32px}
.migas a{text-decoration:underline;text-underline-offset:3px}
.migas a:hover{color:var(--white)}
.migas > *:not(:last-child)::after{content:"/";margin-left:10px;color:var(--line);text-decoration:none}

/* ---------- Tienda ---------- */
.filtros{display:flex;gap:8px;margin:0 calc(var(--gutter) * -1) 8px;padding:3px var(--gutter) 8px;overflow-x:auto;scrollbar-width:none}
.filtros::-webkit-scrollbar{display:none}
.ficha{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;font:600 15px/1 var(--font-text);white-space:nowrap;color:var(--ink-soft);background:var(--carbon-800);
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));transition:background-color var(--ease),color var(--ease)}
.ficha:hover{background:var(--carbon-700);color:var(--white)}
.ficha small{font:700 12px/1 var(--font-text);color:var(--ink-muted)}
.ficha--activa,.ficha--activa:hover{background:var(--white);color:var(--ink)}
.ficha--activa small{color:var(--ink)}
.filtros--sub .ficha{min-height:44px;font-size:14px;background:var(--carbon-950)}
.filtros--sub .ficha:hover{background:var(--carbon-800)}
.filtros--sub .ficha--activa,.filtros--sub .ficha--activa:hover{background:var(--lime-500);color:var(--ink)}
.filtros--centro{flex-wrap:wrap;justify-content:center;overflow:visible;margin:20px 0 28px;padding:0}
@media (min-width:1024px){.filtros{flex-wrap:wrap;overflow:visible;margin-left:0;margin-right:0;padding-left:0;padding-right:0}}
.barra-lista{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:12px 0 28px;font-size:15px;color:var(--ink-muted)}
.barra-lista strong{color:var(--white)}
.barra-lista form{display:flex;align-items:center;gap:10px}
.barra-lista select{height:44px;padding:0 12px;border:1px solid var(--line);border-radius:2px;background:var(--carbon-800);color:var(--white)}
.rejilla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}
@media (min-width:700px){.rejilla{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 16px}}
@media (min-width:1024px){.rejilla{grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 24px}}
.vacio{padding:56px 0;text-align:center}
.vacio h1{margin-bottom:12px;font:italic 900 32px/1 var(--font-display);text-transform:uppercase;color:var(--white)}
.vacio p{max-width:520px;margin:0 auto 20px}
.vacio p:has(> .boton){justify-content:center;max-width:none}
.vacio__codigo{margin-bottom:8px!important;font:italic 900 clamp(96px,24vw,190px)/.9 var(--font-display);color:transparent;-webkit-text-stroke:2px var(--lime-500)}

/* ---------- Ficha de producto ---------- */
.ficha-producto{display:grid;gap:28px;margin-top:12px}
.galeria,.detalle{min-width:0}
.galeria__principal{position:relative;background:var(--plate);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.galeria__ampliar{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.galeria__principal img{width:100%;aspect-ratio:1;object-fit:contain;padding:6%;mix-blend-mode:multiply}
.galeria__miniaturas{display:flex;gap:8px;margin-top:10px;padding:3px;overflow-x:auto}
.miniatura{flex:0 0 72px;height:77px;padding:0;border:0;border-bottom:5px solid transparent;background:var(--plate);cursor:pointer;opacity:.62;outline-offset:-3px;transition:opacity var(--ease)}
.miniatura:hover{opacity:1}
.miniatura img{width:100%;height:72px;object-fit:cover;mix-blend-mode:multiply}
.miniatura--activa{opacity:1;border-bottom-color:var(--lime-500)}
.detalle h1{margin-bottom:14px;font:italic 900 30px/1 var(--font-display);text-transform:uppercase;letter-spacing:-.01em;color:var(--white);overflow-wrap:anywhere}
.detalle__precio{margin-bottom:8px}
.detalle__precio .precio{font-size:30px;line-height:36px}
.detalle__precio .precio--cotizar{font-size:20px}
.precio-antes{margin-left:8px;font:500 16px/1 var(--font-text);color:var(--ink-muted)}
.estado{display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;font:700 13px/16px var(--font-text);letter-spacing:.08em;text-transform:uppercase}
.estado::before{content:"";width:12px;height:10px;background:currentColor;transform:skewX(-12deg)}
.estado--ok{color:var(--lime-500)}
.estado--no{color:var(--danger)}
.detalle__resumen{margin-bottom:20px}
.detalle__resumen p + p,.detalle__descripcion p + p{margin-top:8px}
.opciones{min-width:0;margin:0 0 18px;padding:0;border:0}
.opciones legend{margin-bottom:8px;padding:0;font:700 13px/16px var(--font-text);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.opciones__elegida{font-weight:600;letter-spacing:0;text-transform:none;color:var(--white)}
.opciones__lista{display:flex;flex-wrap:wrap;gap:8px}
.opcion{min-width:48px;height:44px;padding:0 14px;border:1px solid var(--line);border-radius:2px;background:var(--carbon-800);color:var(--white);font:600 15px/1 var(--font-text);cursor:pointer;transition:border-color var(--ease),background-color var(--ease)}
.opcion:hover{border-color:var(--white)}
.opcion[aria-pressed="true"]{background:var(--white);border-color:var(--white);color:var(--ink)}
.opcion--color{width:44px;min-width:44px;padding:0;border:3px solid var(--carbon-900);background:var(--muestra);box-shadow:0 0 0 1px var(--line)}
.opcion--color:hover{border-color:var(--carbon-900);box-shadow:0 0 0 2px var(--white)}
.opcion--color[aria-pressed="true"]{background:var(--muestra);border-color:var(--carbon-900);box-shadow:0 0 0 3px var(--lime-500)}
.detalle__acciones{margin:24px 0 6px}
.compartir{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0;border:0;background:none;color:var(--white);font:600 15px/1 var(--font-text);cursor:pointer;
  text-decoration:underline;text-decoration-color:var(--lime-500);text-decoration-thickness:2px;text-underline-offset:5px}
.compartir:hover{color:var(--lime-500)}
.garantias{display:grid;gap:8px;margin-top:12px;font-size:15px;line-height:22px;color:var(--ink-muted)}
.garantias li,.paquete li{position:relative;padding-left:26px}
.garantias li::before,.paquete li::before{content:"";position:absolute;left:2px;top:8px;width:14px;height:6px;background:var(--lime-500);transform:skewX(-32deg)}
.detalle__descripcion{margin-top:28px;padding:22px 24px;background:var(--carbon-800);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.detalle__descripcion h2,.relacionados h2,.llamado h2{font:italic 900 22px/1 var(--font-display);text-transform:uppercase;color:var(--white)}
.detalle__descripcion h2{margin-bottom:12px}
.relacionados{margin-top:72px}
.relacionados h2{margin-bottom:24px;font-size:26px}
.barra-pedido{display:none}
.visor{max-width:min(96vw,1000px);max-height:94vh;padding:0;border:0;background:transparent}
.visor::backdrop{background:rgba(0,0,0,.86)}
.visor img{width:auto;height:auto;max-width:100%;max-height:94vh;background:var(--plate)}
.visor__cerrar{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:var(--white);color:var(--ink);font-size:26px;line-height:1;cursor:pointer}
@media (min-width:700px){.detalle__acciones .boton{width:auto}}
@media (min-width:1024px){
  .ficha-producto{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:start}
  .galeria{position:sticky;top:96px}
  .detalle h1{font-size:40px}
}
@media (max-width:699px){
  /* barra fija de pedido: el asistente sube para no taparla */
  .barra-pedido{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--carbon-950);border-top:2px solid var(--lime-500)}
  .barra-pedido .boton{min-height:44px;padding:0 18px}
  .barra-pedido__precio .precio{font-size:18px}
  .barra-pedido__precio .precio-antes{display:none}
  body:has(.barra-pedido){padding-bottom:140px}
  body:has(.barra-pedido) .asistente{bottom:80px}
}

/* ---------- Comfama ---------- */
.saltos{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.saltos a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;font:600 15px/1 var(--font-text);color:var(--white);box-shadow:inset 0 0 0 1px var(--line);transition:color var(--ease),box-shadow var(--ease)}
.saltos a:hover{color:var(--lime-500);box-shadow:inset 0 0 0 1px var(--lime-500)}
.grupo{margin-bottom:72px;scroll-margin-top:96px}
.grupo:last-child{margin-bottom:0}
.grupo > .titulo{margin-bottom:24px}
.grupo__cabeza{display:grid;gap:16px;align-items:center;margin-bottom:28px}
.grupo__cabeza img{width:100%;max-width:260px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.grupo__cabeza p{margin-top:10px;color:var(--ink-muted)}
.grupo__cabeza p:has(> .boton){margin-top:18px}
.paquetes{display:grid;gap:16px}
.paquete{--sup:var(--carbon-800);--sup-h:var(--carbon-700);display:flex;flex-direction:column;background:var(--carbon-800);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.paquete > img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top}
.paquete__cuerpo{flex:1;display:flex;flex-direction:column;gap:10px;padding:20px 20px 24px;border-top:6px solid var(--lime-500)}
.paquete h3{font:italic 900 26px/1 var(--font-display);text-transform:uppercase;color:var(--white)}
.paquete__precio{font:700 28px/1 var(--font-text);font-variant-numeric:tabular-nums;color:var(--white)}
.paquete ul{flex:1;display:grid;gap:6px;align-content:start;margin:4px 0 10px}
.paquete .mas{justify-content:center}
.nota{margin-top:16px;font-size:14px;color:var(--ink-muted)}
@media (min-width:700px){.grupo__cabeza{grid-template-columns:200px 1fr;gap:24px}}
@media (min-width:1024px){.paquetes{grid-template-columns:repeat(3,1fr);gap:24px}}

/* ---------- Empresa ---------- */
.cronologia{display:grid;gap:36px;margin-top:8px}
.momento__anio{display:block;margin-bottom:14px;font:italic 900 64px/.9 var(--font-display);color:transparent;-webkit-text-stroke:2px var(--lime-500)}
.momento h3{margin-bottom:8px;font:italic 900 22px/1.05 var(--font-display);text-transform:uppercase;color:var(--white)}
.momento p{max-width:360px;color:var(--ink-muted)}
.banda{--sup:var(--carbon-800);--sup-h:var(--carbon-700);padding:72px 0;background:var(--carbon-800);clip-path:polygon(0 0,100% 24px,100% 100%,0 calc(100% - 24px))}
.banda__fila{display:grid;gap:32px;align-items:start}
.banda .titulo{margin:12px 0 18px}
.destacado{font-size:18px;line-height:28px}
.marcas-bloque{--sup:var(--carbon-900);--sup-h:var(--carbon-800);padding:28px;background:var(--carbon-900);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.marcas-bloque h2{margin-bottom:18px;font:700 13px/16px var(--font-text);letter-spacing:.08em;text-transform:uppercase;color:var(--lime-500)}
.marcas{display:flex;flex-wrap:wrap;align-items:center;gap:28px;margin-bottom:26px}
.marcas img{width:auto;height:38px}
@media (min-width:1024px){
  .cronologia{grid-template-columns:repeat(3,1fr);gap:0}
  .momento{padding-right:40px}
  .momento + .momento{padding-left:40px;border-left:2px solid var(--carbon-700)}
  .momento__anio{font-size:96px}
  .banda{padding:112px 0;clip-path:polygon(0 0,100% 40px,100% 100%,0 calc(100% - 40px))}
  .banda__fila{grid-template-columns:1.3fr 1fr;gap:56px}
  .destacado{font-size:20px;line-height:32px}
}

/* ---------- Contacto ---------- */
.contacto{display:grid;gap:16px}
.contacto__tarjeta{--sup:var(--carbon-800);--sup-h:var(--carbon-700);padding:24px;background:var(--carbon-800);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.contacto__tarjeta h2{margin-bottom:10px;font:700 13px/16px var(--font-text);letter-spacing:.08em;text-transform:uppercase;color:var(--lime-500)}
.contacto__tarjeta h2:not(:first-child){margin-top:24px}
.contacto__tarjeta p{margin-bottom:14px}
.contacto__tarjeta li{display:flex;align-items:center;min-height:36px}
.faq .titulo{margin-bottom:24px}
.faq details{margin-bottom:8px;padding:0 20px;background:var(--carbon-800);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:8px 0;font:600 17px/22px var(--font-text);color:var(--white);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:900 26px/1 var(--font-display);color:var(--lime-500)}
.faq details[open] summary::after{content:"–"}
.faq details p{max-width:720px;padding-bottom:18px;color:var(--ink-muted)}
.mapa{padding-bottom:72px}
.mapa iframe{display:block;width:100%;height:380px;border:0;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
@media (min-width:700px){.contacto{grid-template-columns:repeat(3,1fr);gap:24px}}

/* ---------- Catálogo ---------- */
.linea-catalogo{padding:36px 0;border-top:1px solid var(--carbon-700);scroll-margin-top:96px}
.linea-catalogo__cabeza{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}
.linea-catalogo__cabeza p{margin-top:8px;color:var(--ink-muted)}
.laminas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hoja{position:relative;padding:0;border:0;background:var(--carbon-950);cursor:zoom-in;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);transition:transform var(--ease)}
.hoja:hover{transform:translateY(-4px)}
.hoja img{width:100%;height:auto}
.llamado{--sup:var(--carbon-800);--sup-h:var(--carbon-700);display:flex;flex-direction:column;gap:20px;margin-top:40px;padding:28px;background:var(--carbon-800);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.llamado h2{margin-bottom:8px;font-size:26px}
@media (min-width:700px){
  .linea-catalogo__cabeza{flex-direction:row;justify-content:space-between;align-items:flex-end}
  .laminas{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
}
@media (min-width:1024px){
  .laminas{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
  .llamado{flex-direction:row;justify-content:space-between;align-items:center;padding:40px}
}

/* detalles */
.pie__direccion{margin-top:12px}
.detalle__compartir{margin-top:4px}

/* ---------- Inicio: índice del catálogo 2026 ---------- */
.indice{display:grid;margin-bottom:32px;border-top:2px solid var(--carbon-700)}
.indice a{display:grid;grid-template-columns:56px 1fr;column-gap:12px;align-items:start;min-height:72px;padding:14px 8px 14px 0;border-bottom:1px solid var(--carbon-700);transition:background-color var(--ease)}
.indice a:hover{background:var(--carbon-800)}
.indice__n{font:italic 900 30px/1 var(--font-display);color:var(--lime-500)}
.indice__texto strong{display:block;font:italic 900 19px/1.1 var(--font-display);text-transform:uppercase;color:var(--white)}
.indice a:hover strong{text-decoration:underline;text-decoration-color:var(--lime-500);text-decoration-thickness:2px;text-underline-offset:4px}
.indice__texto small{display:block;margin-top:6px;font:500 14px/20px var(--font-text);color:var(--ink-muted)}
@media (min-width:700px){.indice{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}}
@media (min-width:1024px){
  .indice{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:40px;margin-bottom:40px}
  .indice a{grid-template-columns:68px 1fr;min-height:88px;padding:18px 8px 18px 0}
  .indice__n{font-size:38px}
  .indice__texto strong{font-size:21px}
}

/* ---------- Tienda por secciones y fotos del catálogo ---------- */
.seccion-tienda{padding:8px 0 56px;scroll-margin-top:96px}
.seccion-tienda__cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:24px;padding-top:28px;border-top:2px solid var(--carbon-700)}
.seccion-tienda__n{margin-right:14px;color:var(--lime-500)}
/* recortes del catálogo: van sobre su fondo carbón, sin la placa clara */
.tarjeta__foto--oscura,.galeria__principal--oscura,.miniatura--oscura,.linea__foto--oscura{background:var(--carbon-950)}
.tarjeta__foto--oscura img{inset:0;width:100%;height:100%;mix-blend-mode:normal}
.galeria__principal--oscura img,.miniatura--oscura img,.linea__foto--oscura img{mix-blend-mode:normal}
.galeria__principal--oscura img{padding:0}
.linea__foto--oscura img{width:100%;height:100%;object-fit:cover}
.paquete__precio--cotizar{font-size:20px;color:var(--lime-500)}

.encabezado__tapa{padding:0;border:0;background:none;cursor:zoom-in}

/* ---------- Fichas de filtro: al pasar el ratón crecen, suben y se iluminan ----------
   El fondo pasa a ::before (con el corte en ángulo) para que el brillo, que es un drop-shadow
   del elemento, siga la forma de la ficha en vez de quedar recortado. */
.ficha,.ficha:hover,.ficha--activa,.ficha--activa:hover,.filtros--sub .ficha,.filtros--sub .ficha:hover,.filtros--sub .ficha--activa,.filtros--sub .ficha--activa:hover{background:none}
.ficha{position:relative;isolation:isolate;clip-path:none;transition:transform .2s ease,filter .2s ease,color .2s ease}
.ficha::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--carbon-800);transition:background-color .2s ease;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.ficha--activa::before{background:var(--white)}
.filtros--sub .ficha::before{background:var(--carbon-950)}
.filtros--sub .ficha--activa::before{background:var(--lime-500)}
.filtros{padding-top:8px;padding-bottom:12px}
@media (hover:hover){
  .ficha:hover{z-index:1;transform:translateY(-3px) scale(1.07);color:var(--ink);filter:drop-shadow(0 0 10px rgba(142,190,38,.55)) drop-shadow(0 8px 14px rgba(0,0,0,.45))}
  .ficha:hover::before{background:var(--lime-500)}
  .ficha:hover small{color:var(--ink)}
}
.ficha:focus-visible{z-index:1;color:var(--ink)}
.ficha:focus-visible::before{background:var(--lime-500)}
.ficha:focus-visible small{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.ficha:hover{transform:none}}

/* .seccion y .vacio fijan el padding con "padding: N 0", lo que borraba el margen lateral del
   contenedor: el contenido quedaba pegado al borde de la ventana. Aquí se devuelve el medianil. */
.contenedor.seccion,.contenedor.mapa,.contenedor.vacio{padding-left:var(--gutter);padding-right:var(--gutter)}

/* ---------- Botones: al pasar el ratón crecen, suben y se iluminan (como las fichas) ----------
   El fondo del botón ya vive en ::before con su corte, así que el brillo sigue la forma. */
.boton{transition:transform .2s ease,filter .2s ease}
@media (hover:hover){
  .boton:hover{transform:translateY(-3px) scale(1.05)}
  .boton--wa:hover{filter:drop-shadow(0 0 12px rgba(37,211,102,.55)) drop-shadow(0 8px 14px rgba(0,0,0,.45))}
  .boton--borde:hover{filter:drop-shadow(0 0 10px rgba(255,255,255,.35)) drop-shadow(0 8px 14px rgba(0,0,0,.45))}
}

/* ---------- Hojas del catálogo: zoom al dejar el ratón encima un momento ----------
   Al entrar no pasa nada; si el ratón se queda ~1 segundo, la hoja se agranda para verla mejor.
   Al salir vuelve de inmediato. Hacer clic sigue abriendo la hoja completa en el visor. */
@media (hover:hover){
  .hoja{transition:transform .25s ease}
  .hoja:hover{z-index:3;transform:scale(1.22);transition:transform .45s ease .9s}
  @media (min-width:1024px){
    .laminas .hoja:nth-child(4n+1){transform-origin:left center}
    .laminas .hoja:nth-child(4n){transform-origin:right center}
  }
}
@media (prefers-reduced-motion:reduce){.boton:hover,.hoja:hover{transform:none}}

/* El llamado del final: el texto se ajusta y los botones no se encogen */
.llamado > div{min-width:0}
@media (min-width:1024px){
  .llamado{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px}
  .llamado > p{flex-wrap:nowrap}
}

/* Pie: las 19 secciones de la tienda en dos columnas */
.pie__secciones{columns:2;column-gap:24px}
.pie__secciones li{min-height:32px;break-inside:avoid}
@media (min-width:1024px){.pie__columnas{grid-template-columns:1.2fr 1.6fr 1.2fr 1fr}}

/* ---------- Fotos sin fondo: el producto flota sobre el carbón, con la franja lima del estante ---------- */
.tarjeta__foto--recorte,.galeria__principal--recorte{background:radial-gradient(120% 90% at 50% 68%,var(--carbon-700) 0%,var(--carbon-800) 45%,var(--carbon-950) 100%)}
.tarjeta__foto--recorte::before,.galeria__principal--recorte::before{content:"";position:absolute;z-index:0;left:-10%;right:-10%;top:60%;height:15%;background:var(--lime-500);transform:skewY(-6deg);pointer-events:none}
.tarjeta__foto--recorte img{z-index:1;mix-blend-mode:normal;filter:drop-shadow(0 14px 12px rgba(0,0,0,.55))}
.galeria__principal--recorte img{position:relative;z-index:1;mix-blend-mode:normal;filter:drop-shadow(0 18px 16px rgba(0,0,0,.55))}
.galeria__principal--recorte .sello{z-index:2}
/* foto con escenario (no se le puede quitar el fondo): se muestra completa, sin placa */
.tarjeta__foto--foto,.galeria__principal--foto{background:var(--carbon-950)}
.tarjeta__foto--foto img{inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.galeria__principal--foto img{padding:0;object-fit:cover;mix-blend-mode:normal}
.miniatura--recorte,.miniatura--foto,.linea__foto--recorte,.linea__foto--foto{background:var(--carbon-800)}
.miniatura--recorte img,.miniatura--foto img,.linea__foto--recorte img,.linea__foto--foto img{mix-blend-mode:normal}
.miniatura--recorte img,.linea__foto--recorte img{object-fit:contain}
.linea__foto--foto img{width:100%;height:100%;object-fit:cover}