/* =========================================================
   Imprimamos · estilos
   Identidad provisional: blanco, lima y negro.
   ========================================================= */
@font-face{font-family:"Instrument";src:url(../fonts/instrument-latin.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:"JBMono";src:url(../fonts/jetbrains-latin.woff2) format("woff2");font-weight:500 700;font-display:swap}

:root{
  /* Color */
  --lima:#D1FE17;
  --lima-suave:#ECFFA3;
  --cta:#D1FE17; --cta-ink:#0A0A0A;
  --ink:#0A0A0A;
  --bg:#FFFFFF;
  --surface:#F3F4F6;
  --line:#E2E4E8;
  --muted:#5C5F66;
  --muted-dark:#A6A9B0;
  --error:#C62828;
  /* Letra */
  --font-display:"Instrument",system-ui,sans-serif;
  --font-body:"Instrument",system-ui,sans-serif;
  --font-mono:"JBMono",ui-monospace,monospace;
  /* Forma */
  --r-lg:16px; --r-md:10px; --r-sm:4px;
  /* Movimiento (pareja de M en main.js) */
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --ease-pop:cubic-bezier(.34,1.45,.64,1);
  --dur:.8s; --dist:24px; --t-hover:.35s;
  /* Espacio */
  --gutter:clamp(16px,4.5vw,56px);
  --maxw:1240px;
  --section-y:clamp(72px,10vw,136px);
}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.55;overflow-x:clip}
img,svg{display:block;max-width:100%}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.wrap{width:min(100% - 2*var(--gutter),var(--maxw));margin-inline:auto}
.mono{font-family:var(--font-mono);font-weight:500;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.marcador{background:var(--lima);color:var(--ink);padding:0 .3em;border-radius:3px;font-family:var(--font-mono);font-size:.82em;font-weight:700;letter-spacing:0;text-transform:none;white-space:nowrap;outline:1px dashed var(--ink);outline-offset:-1px}
.saltar{position:absolute;left:12px;top:-60px;z-index:3000;background:var(--ink);color:var(--lima);padding:10px 14px;border-radius:var(--r-md)}
.saltar:focus{top:12px}
[hidden]{display:none!important}

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}
.lenis.lenis-smooth{scroll-behavior:auto!important}

/* ===== Marca de registro ===== */
.reg-mark circle,.reg-mark path{fill:none;stroke:currentColor;stroke-width:2.2}
.reg-mark .reg-dot{fill:var(--reg-dot,var(--lima));stroke:currentColor;stroke-width:1.6}
.ico{width:20px;height:20px;flex:none}

/* ===== Logo: IMPRIMAMOS con la A como flecha de "subir" (propuesta F, en vector) ===== */
.logo{display:inline-flex;align-items:center;font-size:24px;line-height:1;text-decoration:none;color:var(--ink)}
.logo__svg{display:block;height:.82em;width:auto;overflow:visible}
.logo--claro{color:var(--bg);--logo-a:var(--lima)}

/* ===== Botones ===== */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 20px 0 24px;border:0;border-radius:var(--r-md);background:var(--cta);color:var(--cta-ink);font-weight:700;font-size:17px;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;transition:color var(--t-hover) var(--ease),transform var(--t-hover) var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--t-hover) var(--ease-io)}
.btn:hover{color:var(--lima)}
.btn:hover::before{transform:scaleX(1)}
.btn:active{transform:scale(.97)}
.btn__reg{width:22px;height:22px;flex:none;transition:transform .6s var(--ease)}
.btn__reg .reg-dot{fill:currentColor}
.btn:hover .btn__reg{transform:rotate(90deg)}
.btn--ancho{width:100%}
.btn--negro{background:var(--ink);color:var(--lima);padding:0 22px}
.btn--negro::before{background:var(--lima)}
.btn--negro:hover{color:var(--ink)}
.enlace{font-weight:600;text-underline-offset:5px;text-decoration-thickness:1.5px;min-height:44px;display:inline-flex;align-items:center}
.mini{display:inline-flex;align-items:center;flex:none;white-space:nowrap;min-height:44px;padding:0 16px;border-radius:999px;border:0;background:var(--ink);color:var(--lima);font-weight:700;font-size:14px;cursor:pointer;text-decoration:none;transition:background-color var(--t-hover),color var(--t-hover)}
.mini:hover{background:var(--lima);color:var(--ink)}

/* ===== Navegación ===== */
.nav{position:relative;z-index:5}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:18px}
.nav__links{display:none;gap:28px;font-size:15px;font-weight:500}
.nav__links a{text-decoration:none;padding-block:8px}
.nav__links a:hover{text-decoration:underline;text-underline-offset:6px}
.nav__cart{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 8px 0 16px;border:0;border-radius:999px;background:var(--surface);font-size:14px;font-weight:600;cursor:pointer}
.nav__cart b{font-family:var(--font-mono);font-weight:700;background:var(--ink);color:var(--lima);min-width:28px;height:28px;padding:0 6px;display:grid;place-items:center;border-radius:999px;font-size:12px}
.nav__cart.salta b{animation:salta .5s var(--ease-pop)}
@keyframes salta{40%{transform:scale(1.35)}}
.nav__idioma{display:inline-grid;place-items:center;min-width:44px;min-height:44px;padding:0 10px;border:1.5px solid currentColor;border-radius:999px;font:600 13px/1 var(--font-mono);letter-spacing:.06em;text-decoration:none;transition:background var(--t-hover),color var(--t-hover)}
.nav__idioma:hover{background:var(--ink);color:var(--lima);border-color:var(--ink)}
@media (min-width:960px){.nav__links{display:flex;margin-left:auto}.nav__buscar{margin-left:0}}

/* ===== Portada ===== */
/* Intro en video: ocupa la primera pantalla, se repite sin fin y no bloquea el sitio (se baja para entrar) */
.intro{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;min-height:100svh;background:var(--ink);color:#fff}
/* Dos videos encadenados: el que sigue aparece encima mientras el anterior termina (sin pantalla negra) */
.intro__video{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}
.intro__video.is-visible{opacity:1}
.intro__velo{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,10,.6) 0%,rgba(10,10,10,.1) 30%,rgba(10,10,10,.2) 55%,rgba(10,10,10,.88) 100%)}
.intro__in{display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;min-height:100svh;padding-block:20px clamp(24px,5vw,52px)}
.intro__barra{display:flex;align-items:center;justify-content:space-between;gap:16px}
.intro__logo{font-size:clamp(26px,3vw,34px)}
.intro__centro{align-self:end;display:grid;gap:18px;max-width:46rem}
.ceja--claro{color:#fff}
.intro__titulo{margin:0;font-family:var(--font-display);font-weight:700;font-stretch:80%;font-size:clamp(2.3rem,6.4vw,5rem);line-height:.95;letter-spacing:-.03em;text-wrap:balance}
.intro__acciones{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.intro__entrar{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#fff;font-weight:600;text-underline-offset:6px}
.intro__entrar span{display:inline-block;animation:intro-baja 1.8s var(--ease) infinite}
@keyframes intro-baja{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.intro__pausa{justify-self:end;margin-top:18px;min-height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:rgba(10,10,10,.35);color:#fff;font:600 13px/1 var(--font-body);cursor:pointer}
.intro__pausa:hover{background:var(--lima);color:var(--ink);border-color:var(--lima)}
@media (prefers-reduced-motion:reduce){.intro__entrar span{animation:none}}
.portada{position:relative;padding-bottom:clamp(48px,7vw,104px)}
.portada__grid{display:grid;gap:clamp(32px,5vw,56px);padding-top:clamp(8px,3vw,40px)}
.portada__grid>*{min-width:0}
@media (min-width:900px){.portada__grid{grid-template-columns:1.05fr .95fr;align-items:center}}
.ceja{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.ceja i{width:10px;height:10px;background:var(--lima);outline:1.5px solid var(--ink)}

.titular{font-family:var(--font-display);font-weight:700;font-stretch:75%;text-transform:uppercase;letter-spacing:-.035em;line-height:.9;font-size:clamp(3.2rem,17.4vw,7.6rem);margin-top:16px}
@media (min-width:900px){.titular{font-size:clamp(5rem,8.2vw,8.4rem)}}
.reg{position:relative;display:block;width:max-content;max-width:100%}
.reg__k{display:block;position:relative;z-index:3}
.reg__y,.reg__m{position:absolute;inset:0;display:block;opacity:0;pointer-events:none}
.reg__y{color:var(--lima);z-index:1}
.reg__m{color:#B9BCC2;z-index:2}
.reg--dos{margin-top:.08em;padding:0 .08em}
.banda{position:absolute;inset:.04em -.02em .02em;background:var(--lima);z-index:0;transform-origin:left}

.portada__texto{max-width:34rem;margin-top:24px;font-size:clamp(17px,1.5vw,19px);color:var(--muted)}
.portada__acciones{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:26px}

.corte{margin-top:26px;max-width:28rem}
.corte__txt{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-size:14.5px}
.corte__punto{width:10px;height:10px;border-radius:50%;background:var(--lima);outline:1.5px solid var(--ink);box-shadow:0 0 0 5px var(--lima-suave)}
.barra{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;margin-top:12px;height:8px}
.barra i{display:block;border-radius:2px;transform-origin:left;background:var(--line)}
.barra i:nth-child(1),.barra i:nth-child(2){background:var(--lima)}
.barra i:nth-child(3){background:#E3FF7A}
.barra i:nth-child(4){background:var(--ink)}
.barra i:nth-child(5){background:#3A3C40}
.barra i:nth-child(6){background:#7D8087}
.barra i:nth-child(7){background:#C2C5CB}
.barra i:nth-child(8){background:var(--line)}

/* La hoja de la portada */
.hoja{position:relative;margin:58px 24px 30px;aspect-ratio:1/1.02}
.hoja__papel{position:absolute;inset:0;background:var(--surface);border-radius:var(--r-sm)}
.hoja__rejilla{position:absolute;inset:0;border-radius:var(--r-sm);opacity:.55;
  background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/100% 40px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/40px 100%}
.hoja__img{position:absolute;left:5%;right:5%;bottom:5%;top:5%}
.hoja__img img{width:100%;height:100%;object-fit:contain;object-position:50% 100%}
.cabezal{position:absolute;left:-3%;right:-3%;top:0;height:4px;background:var(--lima);opacity:0;outline:1px solid var(--ink)}
.corte-m{position:absolute;width:22px;height:22px;overflow:visible;color:var(--ink);pointer-events:none}
.corte-m path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square}
.corte-m--tl{left:-22px;top:-22px}
.corte-m--tr{right:-22px;top:-22px;transform:scaleX(-1)}
.corte-m--bl{left:-22px;bottom:-22px;transform:scaleY(-1)}
.corte-m--br{right:-22px;bottom:-22px;transform:scale(-1,-1)}
.hoja__reg{position:absolute;width:20px;height:20px;color:var(--ink)}
.hoja__reg--b{bottom:-28px;left:50%;margin-left:-10px}

/* Cotas */
.cota{position:absolute;display:flex;align-items:center;gap:8px;color:var(--ink);font-family:var(--font-mono);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}
.cota__linea{flex:1;height:1.5px;background:currentColor;position:relative}
.cota__linea::before,.cota__linea::after{content:"";position:absolute;top:-5px;width:1.5px;height:11px;background:currentColor}
.cota__linea::before{left:0}.cota__linea::after{right:0}
.cota__txt{background:var(--lima);padding:3px 7px;border-radius:3px;white-space:nowrap}
.cota--ancho{left:0;right:0;top:-50px}
.cota--alto{top:0;bottom:0;right:-50px;flex-direction:column}
.cota--alto .cota__linea{width:1.5px;height:auto;flex:1}
.cota--alto .cota__linea::before,.cota--alto .cota__linea::after{left:-5px;width:11px;height:1.5px;top:auto}
.cota--alto .cota__linea::before{top:0}.cota--alto .cota__linea::after{bottom:0}
.cota--alto .cota__txt{writing-mode:vertical-rl;transform:rotate(180deg);padding:7px 3px}
.hoja .cota--alto{display:none}
@media (min-width:900px){.hoja{margin:58px 62px 0 34px}.hoja .cota--alto{display:flex}}

/* Estado inicial de la firma: solo con JS y con rescate a los 4 s */
.js [data-portada] [data-pieza],.js .portada .titular .reg__k,.js .portada .titular .banda,.js [data-hero-img],.js .hoja__reg,.js .hoja .cota,.js [data-portada] .corte-m{visibility:hidden;animation:rescate 0s 4s forwards}
@keyframes rescate{to{visibility:visible}}

/* ===== Secciones ===== */
.bloque{padding-block:var(--section-y)}
.bloque--gris{background:var(--surface)}
/* Etiqueta de cada sección: sello negro con punto de registro y sombra lima corrida, como impresión fuera de registro */
.bloque__num{display:inline-flex;align-items:center;gap:12px;padding:9px 18px 9px 11px;border-radius:999px;background:var(--ink);color:var(--lima);font-family:var(--font-mono);font-size:clamp(13px,1.3vw,15px);letter-spacing:.12em;text-transform:uppercase;font-weight:700;box-shadow:5px 5px 0 var(--lima),5px 5px 0 1.5px var(--ink)}
.bloque__num::before{content:"";flex:none;width:12px;height:12px;border-radius:50%;background:var(--lima);box-shadow:0 0 0 3px var(--ink),0 0 0 4.5px var(--lima)}
.bloque__num+.h2,.bloque__num+.seccion-cab,div>.bloque__num+.h2{margin-top:22px}
.bloque--tinta .bloque__num{background:var(--lima);color:var(--ink);box-shadow:5px 5px 0 #fff,5px 5px 0 1.5px var(--lima)}
.bloque--tinta .bloque__num::before{background:var(--ink);box-shadow:0 0 0 3px var(--lima),0 0 0 4.5px var(--ink)}
.h2{font-family:var(--font-display);font-weight:700;font-stretch:78%;font-size:clamp(2.3rem,7.6vw,4.4rem);line-height:1.02;letter-spacing:-.03em;margin-top:12px;max-width:17ch;text-wrap:balance}
.linea-mask,.palabra-mask{padding:.15em .12em .15em 0;margin:-.15em -.12em -.15em 0}
.bloque__intro{margin-top:16px;color:var(--muted);max-width:36rem}

/* ===== Temporada Halloween: franja lima ===== */
.temporada{background:var(--lima);color:var(--ink);padding-block:clamp(64px,8vw,104px);position:relative;isolation:isolate;overflow:hidden}
.temporada::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.14;
  background:linear-gradient(var(--ink) 1px,transparent 1px) 0 0/100% 48px,linear-gradient(90deg,var(--ink) 1px,transparent 1px) 0 0/48px 100%;
  -webkit-mask:linear-gradient(160deg,transparent 35%,#000);mask:linear-gradient(160deg,transparent 35%,#000)}
.temporada__in{display:grid;gap:40px;align-items:center}
.temporada__in>*{min-width:0}
@media (min-width:900px){.temporada__in{grid-template-columns:1.3fr .7fr}}
.bloque__num--tinta{box-shadow:5px 5px 0 #fff,5px 5px 0 1.5px var(--ink)}
.temporada__txt{margin-top:16px;max-width:34rem;font-size:18px}
.temporada__limite{margin-top:16px;font-weight:600}
.temporada__acciones{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:26px}
.temporada .marcador{background:var(--bg)}
.contador{position:relative;justify-self:start;display:grid;justify-items:center;align-content:center;width:min(300px,78vw);aspect-ratio:1;border-radius:50%;background:var(--ink);color:var(--lima);text-align:center}
@media (min-width:900px){.contador{justify-self:end}}
.contador__num{font-size:clamp(88px,22vw,140px);font-weight:700;letter-spacing:-.06em;line-height:.9}
.contador__lbl{font-family:var(--font-mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--bg);margin-top:6px;max-width:16ch}
.contador__reg{position:absolute;width:34px;height:34px;color:var(--ink)}
.contador__reg--a{left:-6px;top:6%}
.contador__reg--b{right:-6px;bottom:6%}

/* ===== Catálogo ===== */
.filtros{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.filtro{min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);font-weight:600;font-size:15px;cursor:pointer;transition:background-color var(--t-hover),border-color var(--t-hover)}
.filtro:hover{border-color:var(--ink)}
.filtro.is-on{background:var(--ink);border-color:var(--ink);color:var(--lima)}
/* Catálogo en fila que se desliza: la siguiente tarjeta se asoma para que se note que hay más */
.catalogo__barra{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 20px;margin-top:28px}
.catalogo__barra .filtros{margin-top:0}
.carrusel__control{display:flex;align-items:center;gap:6px}
.carrusel__cuenta{margin-right:8px;font-size:13px;color:var(--muted)}
.productos{--gap:clamp(18px,2.4vw,28px);display:flex;gap:var(--gap);margin:32px calc(-1 * var(--gutter)) 0;padding:0 var(--gutter) 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);overscroll-behavior-x:contain;scrollbar-width:none}
.productos::-webkit-scrollbar{display:none}
.productos:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.producto{flex:0 0 78%;scroll-snap-align:start;display:flex;flex-direction:column;min-width:0}
@media (min-width:640px){.producto{flex-basis:calc((100% - var(--gap) * 2) / 2.4)}}
@media (min-width:1040px){.productos{margin-inline:0;padding-inline:0;scroll-padding:0}.producto{flex-basis:calc((100% - var(--gap) * 3) / 3.5)}}
/* Cada tarjeta completa lleva a la página de su producto */
.producto{position:relative}
.producto__ver::after{content:"";position:absolute;inset:0;z-index:1}
.carrusel__avance{position:relative;height:3px;margin-top:22px;background:var(--line);border-radius:3px;overflow:hidden}
.carrusel__avance i{position:absolute;left:0;top:0;bottom:0;width:30%;background:var(--ink);border-radius:3px;transition:transform .2s linear,width .3s var(--ease)}
.producto.is-oculto{display:none}
.producto__foto{position:relative;margin:14px;aspect-ratio:1/1;background:var(--surface);border-radius:var(--r-sm);display:grid;place-items:center}
.producto__foto img{position:absolute;inset:7%;width:86%;height:86%;object-fit:contain;transition:transform .7s var(--ease)}
.producto:hover .producto__foto img{transform:scale(1.04) rotate(-1deg)}
.producto__foto .corte-m--tl{left:-14px;top:-14px;width:16px;height:16px}
.producto__foto .corte-m--br{right:-14px;bottom:-14px;width:16px;height:16px}
.producto__tag{position:absolute;left:10px;top:10px;z-index:2;background:var(--ink);color:var(--lima);font-family:var(--font-mono);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:999px}
.producto__cuerpo{display:flex;flex-direction:column;gap:6px;padding:4px 0 0;flex:1}
.producto__grupo{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.producto__nombre{display:grid;justify-items:start;gap:4px;font-size:22px;font-weight:700;font-stretch:85%;letter-spacing:-.015em;line-height:1.15}
.producto__clave{font-size:30px;font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:-.01em;box-shadow:inset 0 -.34em 0 var(--lima)}
.producto__detalle{font:500 13px/1.3 var(--font-mono);letter-spacing:.02em;color:var(--muted);font-stretch:100%}
.producto__txt{color:var(--muted);font-size:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.producto__pie{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:14px;border-top:1.5px dashed var(--line)}
.producto__pie .mono{font-size:14.5px}

/* ===== Cotizador ===== */
.cotizador{display:grid;gap:clamp(28px,4vw,48px);margin-top:40px;align-items:start}
.cotizador>*{min-width:0}
/* "Así se ve": ciclo diseño → plantilla del producto → persona usándolo → sello "¡Impreso!" (idea del hero de Printify) */
.bloque--tinta{background:var(--ink);color:#fff}
.bloque--tinta .bloque__intro{color:var(--muted-dark)}
.ciclo-sec{display:grid;gap:36px;align-items:center}
.ciclo-sec>*{min-width:0}
@media (min-width:900px){.ciclo-sec{grid-template-columns:.8fr 1.2fr;gap:56px}}
.ciclo__tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.bloque--tinta .filtro{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
.bloque--tinta .filtro:hover{border-color:#fff}
.bloque--tinta .filtro.is-on{background:var(--lima);border-color:var(--lima);color:var(--ink)}
.ciclo__tabs .filtro{position:relative;overflow:hidden}
.ciclo__tabs .filtro::after{content:"";position:absolute;left:0;bottom:0;height:4px;width:calc(var(--avance,0) * 100%);background:var(--ink);opacity:.55}
.ciclo{display:grid;position:relative}
.ciclo__escena{grid-area:1/1;display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative;opacity:0;visibility:hidden}
.ciclo__escena.is-activa{opacity:1;visibility:visible}
.ciclo__panel,.ciclo__foto{position:relative;aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden}
.ciclo__panel--lima{background:var(--lima)}
.ciclo__panel--gris{background:#E9EAEE}
.ciclo__panel--tinta{background:#1C1D20;outline:1px solid rgba(255,255,255,.12);outline-offset:-1px}
.ciclo__plantilla{position:absolute;inset:6%;width:88%;height:88%}
.ciclo__sticker{position:absolute;left:7%;top:7%;width:24%;aspect-ratio:var(--ratio);border:3px solid #fff;border-radius:4px;box-shadow:0 8px 18px rgba(10,10,10,.28);rotate:-8deg;overflow:hidden;background:#fff}
.ciclo__sticker svg{display:block;width:100%;height:100%}
.ciclo__foto img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.ciclo__foto--gris{background:#E9EAEE}
.ciclo__foto--lima{background:var(--lima)}
.ciclo__foto--gris img,.ciclo__foto--lima img{object-fit:contain;object-position:50% 100%}
.ciclo__sello{position:absolute;right:-6px;bottom:-14px;z-index:3;display:flex;align-items:center;margin:0;rotate:-6deg;filter:drop-shadow(0 6px 12px rgba(0,0,0,.3))}
.ciclo__check{display:grid;place-items:center;width:46px;height:46px;margin-right:-10px;z-index:1;border-radius:50%;background:var(--lima);color:var(--ink);font-weight:800;font-size:22px;border:2px solid var(--ink)}
.ciclo__sello-txt{padding:8px 14px 8px 18px;background:var(--ink);color:var(--lima);border:2px solid var(--lima);border-radius:6px;font:700 14px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase}
@media (min-width:900px){.ciclo__escena{gap:16px}.ciclo__sello{right:-14px;bottom:-18px}.ciclo__check{width:56px;height:56px}.ciclo__sello-txt{font-size:16px;padding:10px 18px 10px 22px}}
/* Selector de producto en tarjetas (como el carrusel de Printify); la lista desplegable queda como respaldo sin JS */
.selector__cab{display:flex;align-items:center;justify-content:space-between;gap:12px}
.selector__flechas{display:flex;gap:6px}
.selector__flecha{display:grid;place-items:center;width:40px;height:40px;border:1.5px solid var(--ink);border-radius:var(--r-sm);background:var(--bg);color:var(--ink);font-size:18px;cursor:pointer;transition:background-color var(--t-hover),color var(--t-hover)}
.selector__flecha:hover{background:var(--ink);color:var(--lima)}
.selector__flecha:disabled{opacity:.35;cursor:default;background:var(--bg);color:var(--ink)}
.selector{position:relative;min-width:0;width:calc(100% + 8px);margin-inline:-4px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.selector__pista{position:relative;display:flex;align-items:center;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:22px calc(50% - 84px) 26px;scrollbar-width:none}
.selector__pista::-webkit-scrollbar{display:none}
.selector__grupo{flex:none;align-self:stretch;display:grid;place-items:center;padding:0 4px;border-left:1.5px dashed var(--line);font:700 10px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);writing-mode:vertical-rl;transform:rotate(180deg)}
.selector__grupo:first-child{border-left:0}
.selector__op{flex:0 0 168px;scroll-snap-align:center;display:grid;align-content:start;gap:10px;padding:8px 8px 14px;border:1.5px solid var(--line);border-radius:18px;background:var(--bg);color:var(--ink);text-align:left;font:600 13px/1.25 var(--font-body);cursor:pointer;transform-origin:50% 50%;will-change:transform;box-shadow:0 10px 24px -14px rgba(10,10,10,.35);transition:border-color var(--t-hover),box-shadow var(--t-hover),opacity .3s}
.selector__op img{width:100%;aspect-ratio:4/5;object-fit:contain;padding:8%;background:var(--surface);border-radius:12px;transition:transform .5s var(--ease)}
.selector__op:hover{border-color:var(--ink)}
.selector__op:hover img{transform:scale(1.06) rotate(-2deg)}
.selector__op[aria-checked="true"]{border-color:var(--ink);box-shadow:0 0 0 3px var(--lima),0 18px 30px -16px rgba(10,10,10,.45)}
.selector__op[aria-checked="true"] img{background:var(--lima-suave)}
.selector__op:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.selector__nombre{display:block;padding:0 2px;font-size:17px;font-weight:800;font-stretch:85%;letter-spacing:-.01em;line-height:1.05;text-transform:uppercase}
.selector__detalle{display:block;margin-top:-4px;padding:0 2px;font:500 11.5px/1.25 var(--font-mono);color:var(--muted)}
.selector__op[aria-checked="true"] .selector__nombre{box-shadow:inset 0 -.38em 0 var(--lima);justify-self:start}
.js-selector #c-producto{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
/* En orden: 1 producto, 2 medida y opciones, 3 diseño y precio. Escritorio: el producto arriba a lo ancho, opciones a la izquierda y diseño con precio a la derecha */
@media (min-width:900px){
  .cotizador{grid-template-columns:1.15fr .85fr;grid-template-areas:"inicio inicio" "opciones cierre";row-gap:22px}
  .cotizador__inicio{grid-area:inicio}.cotizador__opciones{grid-area:opciones}.cotizador__cierre{grid-area:cierre;position:sticky;top:20px}
}
.paso-num{display:inline-grid;place-items:center;width:26px;height:26px;margin-right:10px;border-radius:50%;background:var(--ink);color:var(--lima);font:700 13px/1 var(--font-mono);vertical-align:middle}
.paso__titulo{margin:0;font-weight:700;font-size:18px}
.cotizador__diseno{gap:14px}
button.subir{width:100%;text-align:left;font-family:inherit;color:var(--ink)}
.subir__txt{flex:1;min-width:0}
.lanzador{display:grid;grid-template-columns:64px 1fr;align-items:center;gap:8px 14px;padding:10px;border:1.5px solid var(--ink);border-radius:var(--r-md)}
.lanzador__img{display:grid;place-items:center;width:64px;height:64px;border-radius:6px;background:var(--surface);overflow:hidden}
.lanzador__img img{width:100%;height:100%;object-fit:contain}
.lanzador__txt{display:grid;gap:2px;min-width:0}
.lanzador__txt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px}
.lanzador__txt small{font-size:13px;color:var(--muted)}
.lanzador .preset{grid-column:1/-1}

/* Estudio: página propia para subir el diseño, encima de todo el sitio */
.estudio{position:fixed;inset:0;z-index:1500;overflow-y:auto;overscroll-behavior:contain;background:var(--surface)}
.con-estudio,.con-estudio body{overflow:hidden}
.estudio__barra{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));background:var(--ink);color:var(--bg)}
.estudio__volver{flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1.5px solid var(--lima);border-radius:999px;background:transparent;color:var(--lima);font:700 15px/1 var(--font-body);cursor:pointer}
.estudio__volver:hover{background:var(--lima);color:var(--ink)}
.estudio__prod{margin:0;font-size:12.5px;color:#C9CCD2;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.estudio__cuerpo{padding-block:28px 60px}
.estudio__cuerpo .h2{margin-bottom:24px}
.estudio__grid{display:grid;gap:clamp(22px,3vw,40px);align-items:start}
.estudio__grid>*{min-width:0}
.estudio__panel{display:grid;gap:20px;background:var(--bg);border-radius:var(--r-lg);padding:clamp(18px,3vw,28px)}
@media (min-width:900px){.estudio__grid{grid-template-columns:1.1fr .9fr}.estudio__panel{position:sticky;top:84px}}
/* Celular: primero el botón para subir, luego la vista y al final las especificaciones */
@media (max-width:899px){
  .estudio__panel{display:contents}
  .estudio__panel .campo--diseno{order:-1}
  .estudio__panel .especs{background:var(--bg);border:0;border-radius:var(--r-lg);padding:6px 18px 14px}
}
.especs{display:grid;gap:10px;padding-top:4px;border-top:1.5px dashed var(--line)}
.especs__t{margin:12px 0 0;font-size:16px;font-weight:700}
.especs__lista{display:grid;gap:0;margin:0}
.especs__lista div{display:grid;grid-template-columns:minmax(110px,38%) 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.especs__lista dt{font:700 11.5px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.especs__lista dd{margin:0;font-size:14.5px;line-height:1.45}
.cotizador__caja{display:grid;gap:22px;background:var(--bg);border-radius:var(--r-lg);padding:clamp(20px,3vw,32px)}
.cotizador__cierre{display:grid;gap:22px;align-self:start}
.campo{display:grid;gap:8px;min-width:0;border:0;padding:0;margin:0}
.campo label,.campo legend{font-weight:600;font-size:15px;padding:0}
.unidad{font-family:var(--font-mono);font-size:11.5px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-left:4px}
input,select,textarea{width:100%;min-height:52px;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg);font-size:17px;transition:border-color var(--t-hover)}
textarea{min-height:76px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:#B9BCC2}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px var(--lima)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
input[type=number]{font-family:var(--font-mono);font-weight:700}
.campo-doble{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10px}
.por{font-family:var(--font-mono);font-weight:700;font-size:20px;padding-bottom:14px}
.medida-fija{font-size:15px;color:var(--muted)}
.acabados{display:flex;flex-wrap:wrap;gap:8px}
.acabado{position:relative}
.acabado input{position:absolute;opacity:0;width:1px;height:1px;min-height:0}
.acabado span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;font-size:15px;font-weight:500;cursor:pointer;transition:background-color var(--t-hover),border-color var(--t-hover)}
.acabado span::before{content:"";width:14px;height:14px;border-radius:3px;border:1.5px solid var(--ink);background:var(--bg);transition:background-color var(--t-hover)}
.acabado input[type=radio]+span::before{border-radius:50%}
.acabado input:checked+span{border-color:var(--ink);background:var(--lima-suave)}
.acabado input:checked+span::before{background:var(--lima)}
.acabado input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px}
.acabado em{font-style:normal;font-family:var(--font-mono);font-size:12px;color:var(--muted)}
.presets{display:flex;flex-wrap:wrap;gap:8px}
.preset{min-height:44px;min-width:64px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg);font-family:var(--font-mono);font-weight:700;font-size:15px;cursor:pointer;transition:background-color var(--t-hover),border-color var(--t-hover)}
.preset:hover{border-color:var(--ink)}
.preset.is-on{background:var(--ink);border-color:var(--ink);color:var(--lima)}
.cantidad{display:grid;grid-template-columns:52px 1fr 52px;gap:6px;max-width:220px}
.cantidad button{min-height:52px;border:1.5px solid var(--line);background:var(--bg);border-radius:var(--r-md);font-size:22px;font-weight:600;cursor:pointer}
.cantidad button:hover{border-color:var(--ink)}
.cantidad input{text-align:center;padding:12px 6px}
.error{color:var(--error);font-weight:600;font-size:15px}

.cotizador__vista{display:grid;gap:22px}
.cotizador__vista,.cotizador__cierre{align-self:start}
.pliego{position:relative;margin:40px 40px 0 0;aspect-ratio:3/2;display:grid;place-items:center}
.pliego .cota--ancho{left:auto;right:auto;width:var(--w,100%);top:-34px}
.pliego .cota--alto{top:auto;bottom:auto;height:var(--h,100%);right:-34px}
.pliego__hoja{width:var(--w,100%);height:var(--h,100%);background:var(--bg);border:1.5px solid var(--ink);border-radius:2px;display:grid;place-items:center;overflow:hidden;transition:width .55s var(--ease),height .55s var(--ease);
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:24px 24px}
.pliego .cota{transition:width .55s var(--ease),height .55s var(--ease)}
.pliego__hoja{position:relative}
.pliego__hoja img{position:absolute;inset:14%;width:72%;height:72%;object-fit:contain}
.resumen{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.resumen div{background:var(--bg);border-radius:var(--r-md);padding:12px 14px}
.resumen dt{font-size:13px;color:var(--muted)}
.resumen dd{font-size:18px;font-weight:700}
.total{background:var(--ink);color:var(--bg);border-radius:var(--r-lg);padding:20px 22px}
.total__lbl{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-dark)}
.total__num{font-size:clamp(34px,6vw,48px);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:4px;color:var(--lima)}
.total__nota{font-size:14px;color:var(--muted-dark);margin-top:6px}

/* ===== Corte del día ===== */
.franja-corte{background:var(--ink);color:var(--bg);padding-block:clamp(64px,8vw,104px);position:relative;isolation:isolate;overflow:hidden}
.franja-corte::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.08;
  background:linear-gradient(var(--lima) 1px,transparent 1px) 0 0/100% 48px,linear-gradient(90deg,var(--lima) 1px,transparent 1px) 0 0/48px 100%;
  -webkit-mask:linear-gradient(200deg,#000,transparent 65%);mask:linear-gradient(200deg,#000,transparent 65%)}
.franja-corte__in{display:grid;gap:36px;align-items:end}
.franja-corte__in>*{min-width:0}
@media (min-width:900px){.franja-corte__in{grid-template-columns:1.2fr .8fr}}
.h2--claro{max-width:15ch}
.franja-corte__txt{margin-top:16px;color:var(--muted-dark);max-width:32rem}
.reloj{display:grid;gap:14px;justify-items:start}
.reloj__lbl{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-dark)}
.reloj__num{font-size:clamp(44px,9vw,72px);font-weight:700;letter-spacing:-.04em;line-height:1;color:var(--lima)}
.barra--grande{height:12px;width:100%;margin:0}
.barra--grande i{opacity:.22;transition:opacity .4s}
.barra--grande i.on{opacity:1}
.barra--grande i:nth-child(4){background:#FFFFFF}

/* ===== Cómo funciona ===== */
.pasos{position:relative;margin-top:48px}
.pasos__linea{display:none}
.pasos__lista{display:grid;gap:28px;counter-reset:paso}
.paso{position:relative;padding-left:52px;counter-increment:paso}
.paso__reg{position:absolute;left:0;top:0;width:34px;height:34px;color:var(--ink);background:var(--bg)}
.paso h3{font-size:22px;font-weight:700;font-stretch:85%;letter-spacing:-.015em}
.paso h3::before{content:"0" counter(paso) " ";font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--muted);margin-right:4px;vertical-align:.25em}
.paso p{color:var(--muted);margin-top:6px;max-width:30ch}
@media (min-width:900px){
  .pasos__linea{display:block;position:absolute;left:0;right:0;top:16px;width:100%;height:4px;overflow:visible}
  .pasos__linea path{fill:none;stroke:var(--ink);stroke-width:1.5;vector-effect:non-scaling-stroke}
  .pasos__lista{grid-template-columns:repeat(4,1fr);gap:28px}
  .paso{padding-left:0;padding-top:56px}
}

/* ===== Tu archivo ===== */
/* Portada: mancha lima detrás de los productos y dos marcas de registro que orbitan */
.hoja__mancha{position:absolute;left:50%;top:54%;width:68%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:var(--lima);pointer-events:none}
.hoja__giro{position:absolute;left:50%;top:54%;width:88%;aspect-ratio:1;translate:-50% -50%;pointer-events:none;z-index:2}
.hoja__giro--2{width:76%;rotate:160deg}
.hoja__satelite{position:absolute;left:50%;top:-12px;width:24px;height:24px;margin-left:-12px;color:var(--ink)}
.hoja__img{z-index:1}
/* Catálogo: la foto se "imprime" con una barra lima al bajar y se mueve un poco al pasar el mouse */
.producto__cabezal{position:absolute;left:-2%;right:-2%;top:0;height:4px;z-index:3;background:var(--lima);outline:1px solid var(--ink);opacity:0;pointer-events:none}
/* Ilustraciones de sección (como Printify, pero de imprenta): pieza recortada sobre una mancha lima,
   marcas de corte y de registro que se trazan al bajar. Cada sección tiene además su propio gesto. */
.seccion-cab{display:grid;gap:28px;align-items:center}
.seccion-cab>*{min-width:0}
@media (min-width:900px){.seccion-cab{grid-template-columns:1fr 1fr;gap:56px}}
.ilus{position:relative;isolation:isolate;margin:14px;max-width:100%}
.ilus picture,.ilus img{display:block;width:100%;height:auto}
.ilus img{position:relative;z-index:1;filter:drop-shadow(0 18px 28px rgba(10,10,10,.16))}
.ilus__mancha{position:absolute;z-index:0;left:50%;top:52%;width:74%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:var(--lima)}
.ilus__marcas{position:absolute;z-index:2;left:-14px;top:-14px;width:calc(100% + 28px);height:calc(100% + 28px);overflow:visible;pointer-events:none}
.ilus__marcas path{fill:none;stroke:var(--ink);stroke-width:1.5;vector-effect:non-scaling-stroke}
.ilus__reg{position:absolute;z-index:3;width:26px;height:26px;color:var(--ink);pointer-events:none}
.ilus__reg--1{left:-27px;top:34%}.ilus__reg--2{right:-27px;bottom:28%}
/* Cómo funciona: la ruta del pedido, del teléfono a la caja */
.ilus--como{justify-self:center;width:min(calc(100% - 28px),560px)}
.ilus__ruta{position:absolute;z-index:2;left:6%;top:-10%;width:86%;height:auto;overflow:visible;pointer-events:none}
.ilus__ruta path{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.ilus__ruta circle{fill:var(--lima);stroke:var(--ink);stroke-width:3}
/* Tu archivo: trama de puntos (semitono) junto a la lupa */
.archivo__vista{display:grid;gap:44px;justify-items:center;min-width:0}
.ilus--archivo{width:min(calc(100% - 28px),480px)}
.ilus__puntos{position:absolute;z-index:0;right:-6%;top:-8%;width:38%;height:auto;fill:var(--ink)}
.ilus__puntos circle:nth-child(3n){fill:var(--lima)}
/* El taller: foto real con marco lima "fuera de registro" */
.ilus--taller{width:min(calc(100% - 28px),460px);justify-self:center}
.ilus--taller img{border-radius:var(--r-lg);filter:none}
.ilus__marco{position:absolute;z-index:0;inset:0;border-radius:var(--r-lg);background:var(--lima);border:2px solid var(--ink);transform:translate(12px,12px)}
/* Preguntas: la caja lista que cae con estelas de velocidad */
.ilus--envio{width:min(calc(100% - 28px),380px);margin-top:44px}
.ilus__estelas{position:absolute;z-index:0;left:-18%;top:36%;width:30%;height:auto;overflow:visible}
.ilus__estelas path{fill:none;stroke:var(--ink);stroke-width:6;stroke-linecap:round}
/* Personas: la dueña del negocio en el catálogo, los amigos en Halloween y el impresor en el taller */
.ilus--persona{justify-self:center;width:min(calc(100% - 28px),360px)}
.ilus--persona .ilus__mancha{top:58%;width:86%}
.ilus--persona img,.ilus--amigos img,.ilus--impresor img{filter:drop-shadow(0 16px 26px rgba(10,10,10,.14))}
.temporada__visual{position:relative;display:grid;justify-items:center;min-width:0}
.ilus--amigos{width:min(calc(100% - 28px),520px)}
/* Amigos: arco blanco cuya base recta coincide con el corte de la foto (las cabezas salen por arriba del arco) */
.ilus--amigos .ilus__mancha{left:6%;right:6%;top:24%;bottom:0;width:auto;aspect-ratio:auto;translate:none;border-radius:999px 999px var(--r-lg) var(--r-lg);background:var(--bg);border:2px solid var(--ink);box-shadow:7px 7px 0 var(--ink);transform-origin:50% 100%}
.ilus--amigos img{filter:none;border-radius:0 0 var(--r-lg) var(--r-lg)}
.ilus--amigos picture{position:relative;z-index:1;margin:0 calc(6% + 2px) 2px}
.temporada__visual{margin-bottom:28px}
.temporada__visual .contador{position:absolute;right:-4px;bottom:-30px;width:min(118px,32vw);z-index:4}
@media (max-width:899px){.temporada__visual .contador__num{font-size:44px}.temporada__visual .contador__lbl{font-size:9px}}
.temporada__visual .contador__num{font-size:clamp(52px,12vw,70px)}
.temporada__visual .contador__lbl{font-size:10.5px;max-width:12ch}
.temporada__visual .contador__reg{width:24px;height:24px}
@media (min-width:900px){.temporada__in{grid-template-columns:1fr 1fr}.temporada__visual .contador{right:-10px;width:170px}}
.cita.cita--persona{padding-right:max(36%,128px);overflow:visible;min-height:220px}
.ilus--impresor{position:absolute;right:0;bottom:0;width:34%;min-width:118px;max-width:220px;margin:0}
.ilus--impresor img{border-bottom-right-radius:var(--r-lg)}
/* Desde tableta: el impresor mide lo que la tarjeta de alto (y asoma 30 px), así nunca tapa lo de arriba */
@media (min-width:600px){
  .cita.cita--persona{padding-right:42%}
  .ilus--impresor{top:-30px;right:12px;width:38%;min-width:0;max-width:none}
  .ilus--impresor picture{height:100%}
  .ilus--impresor img{height:100%;width:100%;object-fit:contain;object-position:right bottom;border-radius:0}
}
/* Celular: las decoraciones no salen del ancho de la pantalla */
@media (max-width:899px){
  .ilus__reg--1{left:-12px}.ilus__reg--2{right:-12px}
  .ilus__puntos{right:0;top:-6%;width:32%}
  .ilus__estelas{left:-6%;width:22%}
  .ilus__marcas{left:-10px;top:-10px;width:calc(100% + 20px);height:calc(100% + 20px)}
}
.archivo{display:grid;gap:44px;align-items:center}
.archivo>*{min-width:0}
@media (min-width:900px){.archivo{grid-template-columns:1.1fr .9fr}}
.reglas{display:grid;margin-top:32px;border-top:1.5px solid var(--ink)}
.reglas li{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid #D5D8DD}
.reglas b{font-weight:700}
.reglas span{color:var(--muted)}
.reglas .mono{color:var(--ink)}
@media (max-width:420px){.reglas li{grid-template-columns:1fr;gap:2px}}
.sin-diseno{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:24px;background:var(--bg);border-radius:var(--r-md);padding:14px 18px}
.plantillas{margin-top:20px;display:grid;gap:12px}
.plantillas p{font-size:15.5px;color:var(--muted)}
.plantillas p b{color:var(--ink)}
.plantillas__lista{display:flex;flex-wrap:wrap;gap:8px}
.plantillas__lista a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;background:var(--bg);border:1.5px solid var(--line);font-size:14.5px;font-weight:600;text-decoration:none;transition:border-color var(--t-hover)}
.plantillas__lista a:hover{border-color:var(--ink)}
.plantillas__lista .mono{font-size:12.5px;color:var(--muted)}
.sangrado svg{width:100%;height:auto;overflow:visible}
.sangrado rect{stroke-linejoin:round}
.sg-fondo{fill:var(--lima);stroke:none}
.sg-corte{fill:var(--bg);stroke:var(--ink);stroke-width:1.5;stroke-dasharray:6 5}
.sg-seguro{fill:none;stroke:#9DA1A8;stroke-width:1.2}
.sangrado figcaption{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:16px;font-size:14px;color:var(--muted)}
.ley{display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-2px;border-radius:2px}
.ley--fondo{background:var(--lima)}
.ley--corte{border:1.5px dashed var(--ink)}
.ley--seguro{border:1.2px solid #9DA1A8}

/* ===== Confianza ===== */
.confianza{display:grid;gap:44px;align-items:end}
.confianza>*{min-width:0}
@media (min-width:900px){.confianza{grid-template-columns:.85fr 1.15fr;align-items:center;column-gap:64px}.confianza>.ilus{grid-row:span 2}}
.datos{display:grid;margin-top:32px}
.datos div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.datos dt{color:var(--muted)}
.datos dd{font-weight:700;font-size:20px;text-align:right}
.cita{position:relative;background:var(--surface);border-radius:var(--r-lg);padding:clamp(24px,4vw,40px);font-size:clamp(20px,2.4vw,28px);font-weight:600;line-height:1.3;letter-spacing:-.01em}
.cita::before{content:"";position:absolute;left:clamp(24px,4vw,40px);top:-12px;width:48px;height:24px;background:var(--lima);outline:1.5px solid var(--ink)}
.cita footer{margin-top:16px;font-size:15px;font-weight:500;color:var(--muted)}

/* ===== Preguntas ===== */
.preguntas{display:grid;gap:36px;align-items:start}
.preguntas>*{min-width:0}
.preguntas .btn{margin-top:24px}
@media (min-width:900px){.preguntas{grid-template-columns:.8fr 1.2fr}}
.faq__list{display:grid;gap:10px}
.qa{border-radius:var(--r-md);background:var(--bg);border:1.5px solid transparent;transition:border-color .3s}
.qa.is-open{border-color:var(--ink)}
.qa h3{font-size:inherit;font-weight:inherit}
.qa__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;text-align:left;font-weight:600;font-size:18px;background:none;border:0;cursor:pointer;min-height:44px}
.qa__icon{width:30px;height:30px;flex:none;color:var(--ink);transition:transform .55s var(--ease)}
.qa__icon svg{width:100%;height:100%}
.qa.is-open .qa__icon{transform:rotate(90deg)}
.qa__a{display:grid;grid-template-rows:1fr}
.js .qa__a{grid-template-rows:0fr}
.js .qa.is-open .qa__a{grid-template-rows:1fr}
.qa-listo .qa__a{transition:grid-template-rows .55s var(--ease)}
.qa__a>div{overflow:hidden}
.qa__a p{padding:0 22px 22px;color:var(--muted)}

/* ===== Pie ===== */
.pie{background:var(--ink);color:var(--bg);padding-block:clamp(72px,10vw,128px) 40px;position:relative;isolation:isolate;overflow:hidden}
.pie__titular{margin:0 0 36px;font-size:clamp(3.2rem,17.4vw,9.6rem)}
.pie .reg__k{color:var(--bg)}
.pie .reg--dos .reg__k{color:var(--ink)}
.pie .reg__m{color:#55585E}
.pie__grid{display:grid;gap:28px;margin-top:64px;padding-top:32px;border-top:1px solid #2A2C30}
@media (min-width:760px){.pie__grid{grid-template-columns:repeat(3,1fr)}}
.pie__grid p{color:var(--muted-dark);margin-top:6px}
.pie__grid a{text-decoration:none}
.pie__grid a:hover{color:var(--lima)}
.pie__lbl{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--bg)!important;margin-top:0!important}
.pie__base{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:56px;font-size:14px;color:var(--muted-dark)}
.pie__base .logo{font-size:30px}

/* ===== Panel Mi cotización ===== */
.panel{position:fixed;inset:0;z-index:2000}
.panel__fondo{position:absolute;inset:0;background:rgba(10,10,10,.5);opacity:0;transition:opacity .4s}
.panel__caja{position:absolute;top:0;right:0;bottom:0;width:min(480px,100%);background:var(--bg);overflow-y:auto;padding:0 22px calc(28px + env(safe-area-inset-bottom));transform:translateX(100%);transition:transform .55s var(--ease-io)}
.panel.is-open .panel__fondo{opacity:1}
.panel.is-open .panel__caja{transform:none}
.panel__cab{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg);padding:18px 0;border-bottom:1.5px solid var(--ink)}
.panel__cab h2{font-size:26px;font-weight:700;font-stretch:80%;letter-spacing:-.02em}
.panel__cerrar{width:44px;height:44px;border:0;border-radius:999px;background:var(--surface);font-size:26px;line-height:1;cursor:pointer}
.panel__cerrar:hover{background:var(--lima)}
.orden{padding:16px 0 4px}
.orden__lista{display:grid;gap:10px}
.item{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:14px;background:var(--surface);border-radius:var(--r-md)}
.item__nombre{font-weight:700}
.item__det{grid-column:1/-1;font-size:14px;color:var(--muted)}
.item__precio{font-family:var(--font-mono);font-weight:700;font-size:15px;text-align:right}
.item__quitar{grid-column:1/-1;justify-self:start;border:0;background:none;padding:6px 0;min-height:32px;font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.orden__vacia{color:var(--muted);padding:8px 0}
.orden__total{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:14px;border-top:1.5px dashed var(--line);font-weight:600}
.orden__total b{font-size:20px}
.datos-form{display:grid;gap:16px;padding-top:18px}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;width:1px;height:1px;min-height:0}
.seg span{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 10px;border:1.5px solid var(--line);border-radius:var(--r-md);font-size:15px;font-weight:600;text-align:center;cursor:pointer}
.seg input:checked+span{border-color:var(--ink);background:var(--lima)}
.seg input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px}
.panel__nota{font-size:14px;color:var(--muted);text-align:center}
.vista-msg{background:var(--lima-suave);border-radius:var(--r-md);padding:14px;font-size:14px}
.vista-msg pre{white-space:pre-wrap;font-family:var(--font-mono);font-size:13px;margin:8px 0 0}

/* Subir archivos */
.subir{display:flex;align-items:center;gap:12px;min-height:72px;padding:14px 16px;border:1.5px dashed #B9BCC2;border-radius:var(--r-md);background:var(--surface);font-size:15px;font-weight:600;cursor:pointer;transition:border-color var(--t-hover),background-color var(--t-hover)}
.subir svg{width:28px;height:28px;flex:none;color:var(--ink)}
.subir:hover,.subir.is-sobre{border-color:var(--ink);background:var(--lima-suave)}
.subir__input{position:absolute;width:1px;height:1px;opacity:0;min-height:0;padding:0;border:0}
.subir__input:focus-visible+.subir__lista,.subir__input:focus-visible{outline:none}
.campo:has(.subir__input:focus-visible) .subir{outline:3px solid var(--ink);outline-offset:2px}
/* Diseño del cliente en el cotizador: vista previa sin hacer pedido */
/* Botón para subir el diseño: lima, grande, con ícono, botón negro y un pulso suave que invita a tocarlo */
.subir--cot{position:relative;min-height:84px;padding:16px 18px;gap:14px;background:var(--lima);border:2px dashed var(--ink);border-radius:var(--r-lg);font-size:16px;font-weight:700;line-height:1.3;color:var(--ink);box-shadow:0 0 0 0 rgba(209,254,23,.7);animation:subir-pulso 2.4s ease-out infinite}
.campo .subir--cot{padding:16px 18px;font-size:16px;font-weight:700}
.subir--cot:hover,.subir--cot.is-sobre{background:#E4FF6E;border-style:solid}
.subir__icono{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--ink);transition:transform .4s var(--ease)}
.subir__icono svg{width:24px;height:24px;fill:none;stroke:var(--lima);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.subir--cot:hover .subir__icono{transform:translateY(-3px)}
.subir--cot [data-diseno-txt]{flex:1;min-width:0}
.subir__boton{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:var(--ink);color:var(--lima);font-size:14px;font-weight:700;white-space:nowrap}
@media (max-width:520px){.subir__boton{display:none}}
@keyframes subir-pulso{0%{box-shadow:0 0 0 0 rgba(209,254,23,.75)}70%{box-shadow:0 0 0 14px rgba(209,254,23,0)}100%{box-shadow:0 0 0 0 rgba(209,254,23,0)}}
@media (prefers-reduced-motion:reduce){.subir--cot{animation:none}}
.diseno{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;padding:10px 14px;background:var(--bg);border:1.5px solid var(--ink);border-radius:var(--r-md)}
.diseno__nombre{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:14px}
.diseno__nota{flex-basis:100%;margin:0;font-size:13px;line-height:1.45;color:var(--muted)}
.calidad{display:inline-block;margin-right:6px;padding:1px 8px;border-radius:999px;font:600 12px/1.6 var(--font-mono);color:var(--ink)}
.calidad--bien{background:var(--lima)}
.calidad--media{background:var(--lima-suave)}
.calidad--baja{background:#FDE2E2;color:var(--error)}
.pliego.con-diseno .pliego__hoja{background-color:#fff;background-image:conic-gradient(#E9EAEE 25%,transparent 0 50%,#E9EAEE 0 75%,transparent 0);background-size:14px 14px}
.pliego.con-diseno [data-pliego-img]{display:none}
.pliego__hoja .pliego__diseno{inset:3%;width:94%;height:94%}
.pliego__archivo{position:absolute;inset:6%;display:grid;place-content:center;justify-items:center;gap:6px;text-align:center;font-size:14px;min-width:0}
.pliego__archivo b{background:var(--ink);color:var(--lima);padding:6px 10px;border-radius:var(--r-sm);font-size:14px}
.pliego__archivo span{font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pliego__archivo small{color:var(--muted);font-size:12px;max-width:28ch}
/* Maqueta: el diseño del cliente sobre la camiseta, tarjeta u hoja */
.vista__cambio{display:flex;gap:8px;flex-wrap:wrap}
.maqueta{position:relative;aspect-ratio:var(--maqueta-ratio,1);max-width:100%;border-radius:var(--r-lg);overflow:hidden;background:#EDEEF1}
.maqueta__fondo{display:block;width:100%;height:100%;object-fit:cover}
.maqueta__fondo[hidden]{display:none}
/* Prenda de color (S&S): color con la forma de la prenda y, encima, sus sombras para que se vean los pliegues */
.maqueta__tinte{position:absolute;inset:0;background:var(--tinte);-webkit-mask:var(--mascara) center/100% 100% no-repeat;mask:var(--mascara) center/100% 100% no-repeat;pointer-events:none}
.maqueta__sombras{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;pointer-events:none}
.maqueta__tinte[hidden],.maqueta__sombras[hidden]{display:none}
/* Foto real de S&S (vertical): se muestra completa sobre blanco dentro del cuadro */
.maqueta--ss{background:#fff}
.maqueta--ss .maqueta__fondo{object-fit:contain}
.maqueta__capa{position:absolute;transition:left .45s var(--ease),top .45s var(--ease),width .45s var(--ease),height .45s var(--ease)}
.maqueta__diseno{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.maqueta--papel .maqueta__diseno,.maqueta--blanca .maqueta__diseno{mix-blend-mode:multiply}
/* Editor de camisetas: área de impresión, mover y agrandar */
.maqueta__area{position:absolute;border:1.5px dashed var(--lima);border-radius:4px;pointer-events:none}
.maqueta--blanca .maqueta__area{border-color:var(--ink)}
.maqueta__area-txt{position:absolute;left:0;bottom:calc(100% + 6px);padding:2px 6px;border-radius:999px;background:var(--lima);color:var(--ink);font:600 10px/1.4 var(--font-mono);letter-spacing:.03em;white-space:nowrap}
.maqueta--editable .maqueta__capa{cursor:grab;touch-action:none;outline:1.5px solid transparent;outline-offset:2px}
.maqueta--editable .maqueta__capa:hover,.maqueta--editable .maqueta__capa:focus-visible,.maqueta__capa.is-moviendo{outline-color:var(--lima)}
.maqueta--blanca .maqueta__capa:hover,.maqueta--blanca .maqueta__capa:focus-visible,.maqueta--blanca .maqueta__capa.is-moviendo{outline-color:var(--ink)}
.maqueta__capa.is-moviendo{cursor:grabbing;transition:none}
/* Cuatro esquinas para cambiar el tamaño; cada una agranda desde su lado y la contraria se queda fija */
.maqueta__asa{display:none;position:absolute;width:18px;height:18px;border-radius:50%;background:var(--lima);border:2px solid var(--ink);touch-action:none;z-index:2}
.maqueta__asa::before{content:"";position:absolute;inset:-12px} /* área de toque más grande en el celular */
.maqueta__asa[data-asa="nw"]{left:-9px;top:-9px;cursor:nwse-resize}
.maqueta__asa[data-asa="ne"]{right:-9px;top:-9px;cursor:nesw-resize}
.maqueta__asa[data-asa="sw"]{left:-9px;bottom:-9px;cursor:nesw-resize}
.maqueta__asa[data-asa="se"]{right:-9px;bottom:-9px;cursor:nwse-resize}
.maqueta--editable .maqueta__asa{display:block}
/* Medida en vivo bajo el diseño; se pone roja al llegar al tamaño máximo */
.maqueta__medida{display:none;position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);padding:1px 8px;border-radius:999px;background:var(--ink);color:var(--lima);font:600 11px/1.6 var(--font-mono);white-space:nowrap;pointer-events:none;z-index:2}
.maqueta--editable .maqueta__medida{display:block}
.maqueta__capa.al-limite{outline-color:#FF5A5A!important}
.maqueta__capa.al-limite .maqueta__medida{background:#FF5A5A;color:#fff}
.maqueta__capa.al-limite .maqueta__asa{background:#FF5A5A}
.ori{display:inline-block;border:1.5px solid var(--ink);border-radius:2px;background:var(--bg)}
.ori--v{width:10px;height:14px}.ori--h{width:14px;height:10px}
/* Papel girado: la foto de la hoja o tarjeta se rota 90° cuando el cliente elige la otra orientación */
.maqueta--girada .maqueta__fondo{position:absolute;left:50%;top:50%;width:calc(100% / var(--maqueta-ratio));height:calc(100% * var(--maqueta-ratio));transform:translate(-50%,-50%) rotate(90deg)}
.lados{display:flex;gap:8px}
.lados .filtro.con-diseno::after{content:"";width:8px;height:8px;margin-left:8px;border-radius:50%;background:var(--lima);outline:1.5px solid var(--ink);display:inline-block;vertical-align:middle}
.editor{display:grid;gap:12px;padding:16px;background:var(--bg);border-radius:var(--r-lg)}
.editor__ayuda{margin:0;font-size:14px;color:var(--muted)}
.editor__limite{margin:0;justify-self:start;padding:2px 10px;border-radius:999px;background:var(--lima-suave);font-size:12px;font-weight:600}
.editor__fila{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;font-weight:600;font-size:15px}
.editor__fila input{accent-color:var(--ink);min-height:44px}
.editor__botones{display:flex;flex-wrap:wrap;gap:8px}
.maqueta--sticker{background:radial-gradient(circle at 30% 20%,#F7F8FA,#E3E5E9)}
.maqueta--sticker .maqueta__diseno{filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 8px 12px rgba(10,10,10,.18))}
/* Archivo de cada pieza en Mi cotización */
.item__archivo{grid-column:1/-1;display:flex;align-items:center;gap:10px;font-size:14px;min-width:0}
.item__archivo img{width:40px;height:40px;flex:none;object-fit:contain;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line)}
.item__archivo span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item__archivo--falta span{color:var(--muted)}
.item__archivo label{font-weight:600;text-decoration:underline;text-underline-offset:4px;cursor:pointer;white-space:nowrap;min-height:32px;display:inline-flex;align-items:center}
.subir__lista{display:grid;gap:6px}
.subir__lista li{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:8px 10px;background:var(--surface);border-radius:var(--r-sm)}
.subir__lista li span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.progreso{display:grid;gap:6px}
.progreso span{display:block;height:6px;border-radius:3px;background:var(--lima);outline:1px solid var(--ink);transform-origin:left;transform:scaleX(0);transition:transform .2s linear}
.progreso p{font-family:var(--font-mono);font-size:13px}
.btn:disabled{opacity:.55;cursor:wait}
.btn--wa{background:var(--bg);border:1.5px solid var(--ink);color:var(--ink)}
.btn--wa::before{background:var(--ink)}
.btn--wa:hover{color:var(--lima)}
.enlace--centro{justify-self:center;border:0;background:none;cursor:pointer;font-size:15px}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.envio{display:grid;gap:8px}
/* Envío sin marca (revendedores con empresa aprobada) */
.sin-marca{display:grid;gap:8px}
.campo .sin-marca__opcion{display:flex;gap:10px;align-items:flex-start;font-weight:500;line-height:1.35}
.sin-marca__opcion input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--tinta,#121411)}
.sin-marca__datos{display:grid;gap:6px}
.sin-marca__exento{margin:0;font-size:14px;font-weight:600}
/* Prendas de S&S en el estudio: modelo, muestras de color y piezas por talla */
.prendas{display:grid;gap:10px}
.prendas__sub{margin:6px 0 0;font-size:14px;color:var(--muted)}
.prendas__modelo > span{display:flex;align-items:center;gap:10px}
.prendas__mini{width:56px;height:56px;flex:none;object-fit:contain;background:#fff;border-radius:8px}
.prendas__foto{margin:4px 0 0;display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center}
.prendas__foto[hidden]{display:none}
.prendas__foto img{width:120px;height:120px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:var(--r-md)}
.prendas__foto figcaption{font-size:13px;color:var(--muted)}
.prendas__sub b{color:var(--ink)}
.prendas__colores{display:flex;flex-wrap:wrap;gap:8px}
.prendas__color{width:34px;height:34px;border-radius:50%;border:2px solid var(--line);background:var(--muestra);cursor:pointer;box-shadow:inset 0 0 0 2px var(--bg);padding:0}
.prendas__color[aria-checked="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 3px var(--bg),0 0 0 2px var(--lima)}
.prendas__color:focus-visible{outline:3px solid var(--lima);outline-offset:2px}
.prendas__tallas{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.prendas__talla{display:grid;gap:3px;justify-items:center;font-weight:700;font-size:14px}
.prendas__talla input{width:100%;min-height:44px;text-align:center;font:inherit;font-size:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink)}
.prendas__talla small{font-weight:500;font-size:11.5px;color:var(--muted);min-height:1em}
.prendas__talla.is-agotada{opacity:.45}
.prendas__total{margin:0;font-weight:700}
/* Chat del sitio: burbuja fija y panel. Va por encima de las barras fijas de abajo (carrito y cotizador) */
.chat-burbuja{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(96px + env(safe-area-inset-bottom));z-index:1400;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px 0 14px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:600 15px/1 var(--font-body);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.chat-burbuja svg{width:22px;height:22px;color:var(--lima)}
.chat-burbuja:focus-visible{outline:3px solid var(--lima);outline-offset:3px}
.chat-burbuja__punto{width:10px;height:10px;border-radius:50%;background:var(--lima);margin-left:2px}
.chat-burbuja.is-abierta .chat-burbuja__txt{display:none}
.chat-burbuja.is-abierta{padding:0 14px}
.chat-panel{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(156px + env(safe-area-inset-bottom));z-index:1400;width:min(380px,calc(100vw - 32px));max-height:min(560px,calc(100dvh - 190px));display:grid;grid-template-rows:auto 1fr auto;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 18px 48px rgba(0,0,0,.2);overflow:hidden}
.chat-panel[hidden]{display:none}
.chat-panel__cab{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--ink);color:#fff}
.chat-panel__titulo{margin:0;font-weight:700}
.chat-panel__cerrar{border:0;background:none;color:#fff;font-size:26px;line-height:1;width:44px;height:44px;margin:-10px -12px -10px 0;cursor:pointer}
.chat-panel__lista{overflow-y:auto;overscroll-behavior:contain;padding:14px;display:grid;align-content:start;gap:8px;min-height:160px;background:var(--surface)}
.chat-msg{margin:0;max-width:85%;padding:9px 12px;border-radius:14px;font-size:14.5px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-msg--taller{justify-self:start;background:var(--bg);border:1px solid var(--line);border-bottom-left-radius:4px}
.chat-msg--cliente{justify-self:end;background:var(--lima);color:var(--ink);border-bottom-right-radius:4px}
.chat-msg__hora{display:block;margin-top:4px;font-size:11.5px;color:var(--muted)}
.chat-panel__form{display:grid;gap:8px;padding:12px;border-top:1px solid var(--line)}
.chat-panel__datos{display:grid;gap:6px}
.chat-panel__form input,.chat-panel__form textarea{width:100%;font:inherit;font-size:16px;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink);resize:none}
.chat-panel__enviar{justify-self:end;min-height:44px}
.chat-panel__estado{margin:0;font-size:13px;color:var(--muted)}
.chat-panel__estado:empty{display:none}
@media (max-width:600px){.chat-burbuja{bottom:calc(84px + env(safe-area-inset-bottom))}.chat-burbuja .chat-burbuja__txt{display:none}.chat-burbuja{padding:0 14px}.chat-panel{right:8px;left:8px;width:auto;bottom:calc(140px + env(safe-area-inset-bottom));max-height:calc(100dvh - 170px)}}
/* Varias direcciones: una tarjeta por dirección extra con sus piezas y su envío */
.varias{display:grid;gap:8px}
.varias__cuerpo{display:grid;gap:12px}
.varias__cuerpo > .pg__ayuda{margin:0;font-size:14px}
.varias__lista{display:grid;gap:12px}
.varias__destino{display:grid;gap:8px;padding:14px;border:1px solid var(--line);border-radius:var(--r-md)}
.varias__cab{display:flex;justify-content:space-between;align-items:center;gap:12px}
.varias__titulo{margin:0;font-weight:700}
.varias__cab .enlace{border:0;background:none;cursor:pointer;padding:0;font-size:14px}
.varias__sub{margin:6px 0 0;font-size:14px;font-weight:600}
.varias__piezas{display:grid;gap:4px}
.campo .varias__pieza{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:14px;line-height:1.35;min-height:28px}
.varias__pieza input{width:20px;height:20px;flex:none;margin-top:0;accent-color:var(--tinta,#121411)}
.varias__cuerpo > .mini{justify-self:start}
.envio__fila{display:grid;grid-template-columns:1fr;gap:8px}
@media (min-width:420px){.envio__fila{grid-template-columns:1.3fr 1fr .8fr}}
.envio__fila>*{min-width:0}
.item__acciones{grid-column:1/-1;display:flex;gap:18px}
.cupon{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.cupon input{text-transform:uppercase;font-family:var(--font-mono);font-weight:700}
.cupon__ok{background:var(--lima-suave);border-radius:var(--r-sm);padding:8px 10px;font-size:14px;font-weight:600}

/* Pasos del pedido */
.paso-pago,.paso-listo{display:grid;gap:16px;padding:20px 0}
.aviso-prueba{background:var(--lima);border:1.5px dashed var(--ink);border-radius:var(--r-md);padding:10px 14px;font-weight:700;text-align:center}
.paso__folio{font-size:17px}
.tarjeta-sim{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;background:var(--ink);color:var(--bg);border-radius:var(--r-lg);padding:22px 20px}
.tarjeta-sim svg{width:30px;height:30px;color:var(--lima)}
.paso-listo{text-align:center;justify-items:center}
.paso-listo__reg{width:64px;height:64px;color:var(--ink)}
.paso-listo h3{font-size:30px;font-weight:700;font-stretch:80%;letter-spacing:-.02em}
.paso-listo p{color:var(--muted);max-width:30ch}

/* ===== Barra fija en celular ===== */
.barra-cel{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:1000;display:none;gap:8px;transform:translateY(160%);transition:transform .6s var(--ease)}
.barra-cel.is-visible{transform:none}
.barra-cel .btn{flex:1;box-shadow:0 10px 30px -10px rgba(10,10,10,.5)}
.barra-cel__cot{position:relative;width:56px;height:56px;flex:none;border:0;border-radius:var(--r-md);background:var(--ink);color:var(--bg);display:grid;place-items:center;cursor:pointer}
.barra-cel__cot svg{width:24px;height:24px}
.barra-cel__cot b{position:absolute;top:-6px;right:-6px;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:var(--lima);color:var(--ink);font-family:var(--font-mono);font-size:11px;display:grid;place-items:center;outline:1.5px solid var(--ink)}
@media (max-width:899px){
  .barra-cel{display:flex}
  .pie{padding-bottom:110px}
}

/* Aviso al agregar */
.aviso-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:2100;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:999px;font-weight:600;font-size:15px;box-shadow:0 10px 30px -10px rgba(10,10,10,.5);display:flex;gap:10px;align-items:center;max-width:calc(100% - 32px)}
.aviso-toast::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--lima);flex:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js [data-portada] [data-pieza],.js .portada .titular .reg__k,.js .portada .titular .banda,.js [data-hero-img],.js .hoja__reg,.js .hoja .cota,.js [data-portada] .corte-m{visibility:visible}
}

/* ===== Página de producto (paginas/*.html, las genera scripts/generar-productos.mjs) ===== */
.cabecera{position:relative;z-index:5;background:var(--bg);border-bottom:1px solid var(--line)}
.ficha{padding-block:clamp(18px,3vw,32px) clamp(48px,6vw,88px)}
.migas{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:clamp(16px,3vw,30px);font:500 13px/1.4 var(--font-mono);color:var(--muted)}
.migas a{color:inherit;text-underline-offset:3px}
.migas a:hover{color:var(--ink)}
.migas [aria-current]{color:var(--ink)}
.ficha__grid{display:grid;gap:clamp(24px,4vw,56px);align-items:start}
.ficha__grid>*{min-width:0}
@media (min-width:900px){.ficha__grid{grid-template-columns:1.05fr .95fr}.galeria{position:sticky;top:20px}.ficha__grid--solo{grid-template-columns:minmax(0,1fr);max-width:860px}}
.galeria{display:grid;gap:12px}
.galeria__principal{position:relative;margin:14px;aspect-ratio:4/3;background:var(--surface);border-radius:var(--r-sm);overflow:visible}
.galeria__principal img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6%;border-radius:var(--r-sm)}
.galeria__principal.es-foto img{object-fit:cover;padding:0}
.galeria__principal .corte-m--tl{left:-14px;top:-14px;width:16px;height:16px}
.galeria__principal .corte-m--br{right:-14px;bottom:-14px;width:16px;height:16px}
.galeria__minis{display:flex;gap:10px;padding-inline:14px}
.galeria__mini{width:72px;height:72px;padding:3px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--surface);cursor:pointer;transition:border-color var(--t-hover)}
.galeria__mini img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.galeria__mini:hover{border-color:var(--ink)}
.galeria__mini.is-on{border-color:var(--ink);box-shadow:0 0 0 3px var(--lima)}
.galeria__mini:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.ficha__info{display:grid;gap:18px;align-content:start}
.ficha__info .bloque__num{justify-self:start;margin:0}
.ficha__titulo{display:grid;justify-items:start;gap:10px;margin:0;font-family:var(--font-display);font-stretch:85%}
.ficha__titulo .producto__clave{font-size:clamp(46px,7vw,80px)}
.ficha__detalle{font:500 clamp(15px,1.6vw,18px)/1.3 var(--font-mono);letter-spacing:.02em;color:var(--muted);font-stretch:100%}
.ficha__lead{margin:0;max-width:56ch;font-size:clamp(17px,1.5vw,19px)}
.ficha__datos,.info__specs{display:grid;margin:0;border-top:1.5px solid var(--ink)}
.ficha__datos div,.info__specs div{display:grid;grid-template-columns:minmax(104px,32%) 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.ficha__datos dt,.info__specs dt{font:700 11.5px/1.6 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ficha__datos dd,.info__specs dd{margin:0;font-size:15.5px;line-height:1.45}
.ficha__acciones{display:flex;flex-wrap:wrap;gap:10px}
.ficha__acciones .btn--wa{gap:10px;padding:0 20px}
.ficha__garantias{display:grid;gap:8px;margin:0;padding:0;list-style:none;font-size:14.5px}
.ficha__garantias li{display:flex;align-items:center;gap:10px}
.ficha__garantias svg{width:18px;height:18px;flex:none}
/* Cotizador con el producto ya elegido: sin selector de producto */
.cotizador[data-fijo] .cotizador__inicio{display:none}
@media (min-width:900px){.cotizador[data-fijo]{grid-template-areas:"opciones cierre"}}
.info{display:grid;gap:16px;margin-top:32px}
.info>*{min-width:0}
@media (min-width:760px){.info{grid-template-columns:1fr 1fr}.info__caja--ancha{grid-row:span 2}}
.info__caja{background:var(--surface);border-radius:var(--r-lg);padding:clamp(20px,3vw,30px)}
.info__caja h3{margin:0 0 14px;font-size:20px;font-weight:700}
.info__lista{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.info__lista li{position:relative;padding-left:22px}
.info__lista li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:10px;background:var(--lima);outline:1.5px solid var(--ink);border-radius:2px}
.info__pasos{display:grid;gap:10px;margin:0;padding-left:22px;list-style:decimal}
.info__pasos li::marker{font-family:var(--font-mono);font-weight:700}
.faq--producto{margin-top:28px;max-width:880px}
.relacionados{display:grid;gap:28px;margin:32px 0 0;padding:0;list-style:none}
@media (min-width:640px){.relacionados{grid-template-columns:repeat(3,1fr)}}
.relacionados .producto__foto img{position:absolute;inset:7%;width:86%;height:86%}

/* ===== Buscador predictivo ===== */
.nav__buscar{margin-left:auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg);color:var(--ink);font:600 14px/1 var(--font-body);cursor:pointer;transition:border-color var(--t-hover),background-color var(--t-hover)}
.nav__buscar:hover{border-color:var(--ink);background:var(--lima-suave)}
.nav__buscar kbd{display:none;padding:2px 6px;border:1px solid var(--line);border-radius:4px;font:600 11px/1 var(--font-mono);color:var(--muted)}
.nav__buscar-txt{display:none}
@media (min-width:600px){.nav__buscar-txt{display:inline}}
@media (min-width:1100px){.nav__buscar kbd{display:inline-block}}
@media (max-width:420px){.nav__inner{gap:8px}.nav__cart-txt{display:none}.nav__cart{padding:0 8px}}
.buscador{position:fixed;inset:0;z-index:2050;display:grid;justify-items:center;align-items:start;padding:max(12px,env(safe-area-inset-top)) 12px 12px}
.buscador__fondo{position:absolute;inset:0;background:rgba(10,10,10,.55);backdrop-filter:blur(3px)}
.buscador__caja{position:relative;display:grid;grid-template-rows:auto auto auto 1fr auto;width:min(680px,100%);max-height:min(640px,calc(100dvh - 24px));margin-top:clamp(0px,6vh,72px);overflow:hidden;background:var(--bg);border-radius:var(--r-lg);box-shadow:0 30px 70px -20px rgba(0,0,0,.55)}
.con-buscador,.con-buscador body{overflow:hidden}
.buscador__campo{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 18px;border-bottom:1.5px solid var(--ink)}
.buscador__campo>.ico{width:22px;height:22px;flex:none}
.buscador__entrada{position:relative;flex:1;min-width:0}
.buscador__entrada input,.buscador__fantasma{font:500 19px/1.2 var(--font-body);letter-spacing:0;padding:12px 0}
.buscador__entrada input{position:relative;z-index:1;width:100%;min-height:0;border:0;border-radius:0;background:transparent;box-shadow:none;outline:none}
.buscador__entrada input:focus{box-shadow:none}
.buscador__entrada input::-webkit-search-cancel-button{display:none}
.buscador__fantasma{position:absolute;inset:0;white-space:pre;overflow:hidden;color:#9A9DA3;pointer-events:none}
.buscador__igual{color:transparent}
.buscador__cerrar{flex:none;min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font:600 12px/1 var(--font-mono);cursor:pointer}
.buscador__sug{display:flex;flex-wrap:wrap;gap:8px;padding:12px 18px 0}
.buscador__sug .preset{min-height:36px;font-size:14px}
.buscador__estado{margin:12px 18px 6px;font:700 11.5px/1.4 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.buscador__lista{margin:0;padding:0 8px 10px;list-style:none;overflow-y:auto;overscroll-behavior:contain;min-height:0}
.buscador__item{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:14px;padding:8px 10px;border-radius:var(--r-md);text-decoration:none;color:var(--ink)}
.buscador__item img{width:56px;height:56px;object-fit:contain;padding:4px;background:var(--surface);border-radius:8px}
.buscador__item b{font-weight:800;font-stretch:85%;font-size:18px;text-transform:uppercase;letter-spacing:-.01em}
.buscador__item i{font:500 13px/1.3 var(--font-mono);font-style:normal;color:var(--muted)}
.buscador__item small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.buscador__ir{font-size:18px;opacity:0;transform:translateX(-4px);transition:opacity var(--t-hover),transform var(--t-hover)}
[role="option"][aria-selected="true"] .buscador__item{background:var(--lima-suave);outline:1.5px solid var(--ink)}
[role="option"][aria-selected="true"] .buscador__ir{opacity:1;transform:none}
.buscador__vacio{display:grid;gap:14px;justify-items:start;padding:6px 18px 20px}
.buscador__vacio p{margin:0}

/* ===== Vista realista (lienzo encima de la foto del producto) ===== */
.maqueta__real{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.maqueta--real .maqueta__capa,.maqueta--real .maqueta__area{visibility:hidden}
.filtro--real span{margin-right:2px}
.filtro--real:not(.is-on){border-color:var(--ink);background:var(--lima)}
.maqueta__nota{margin:-8px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted)}

/* ===== Foto con IA (página de diseño) ===== */
.ia{display:grid;gap:12px;padding:clamp(16px,2.5vw,22px);border:1.5px solid var(--ink);border-radius:var(--r-lg);background:var(--bg)}
.ia__cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
.ia__t{margin:0;font-size:18px;font-weight:800}
.ia__t span{color:var(--ink);background:var(--lima);border-radius:4px;padding:0 4px}
.ia__creditos{margin:0;padding:3px 10px;border-radius:999px;background:var(--surface);font-size:12px}
.ia__txt{margin:0;font-size:14.5px;color:var(--muted)}
.ia__escenas{display:flex;flex-wrap:wrap;gap:8px}
.ia__progreso{display:grid;gap:8px}
.ia__progreso p{margin:0;font-size:14px}
.ia__barra{position:relative;display:block;height:4px;border-radius:4px;background:var(--line);overflow:hidden}
.ia__barra i{position:absolute;top:0;bottom:0;left:-40%;width:40%;background:var(--lima);border-radius:4px;animation:ia-barra 1.4s ease-in-out infinite}
@keyframes ia-barra{to{left:100%}}
@media (prefers-reduced-motion:reduce){.ia__barra i{animation:none;left:0;width:100%;opacity:.6}}
.ia__foto{display:grid;gap:8px;margin:0}
.ia__foto img{width:100%;border-radius:var(--r-md);background:var(--surface)}
.ia__foto figcaption{font-size:13px;line-height:1.5;color:var(--muted)}

/* ===== Página de producto: editor completo arriba (vista en vivo a la izquierda, opciones a la derecha) =====
   El estudio de diseño se vuelve parte de la página: sus piezas entran a la cuadrícula del formulario. */
.bloque--producto{padding-block:clamp(16px,2.5vw,28px) clamp(48px,6vw,80px)}
.bloque--producto .migas{margin-bottom:clamp(14px,2.4vw,24px)}
.cotizador[data-fijo]{grid-template-columns:minmax(0,1fr);grid-template-areas:none;margin-top:0;gap:18px}
.cotizador[data-fijo]>*,.cotizador[data-fijo] .estudio__panel>*{grid-area:auto}
.cotizador[data-fijo] .estudio,.cotizador[data-fijo] .estudio__cuerpo,.cotizador[data-fijo] .estudio__grid,.cotizador[data-fijo] .estudio__panel{display:contents}
.cotizador[data-fijo] .estudio__barra,.cotizador[data-fijo] .estudio__cuerpo>.bloque__num,.cotizador[data-fijo] .estudio__cuerpo>.h2,.cotizador[data-fijo] [data-estudio-listo],.cotizador[data-fijo] .cotizador__diseno{display:none}
.cotizador[data-fijo] .ficha__cab{order:-2;display:grid;gap:14px;align-content:start}
.cotizador[data-fijo] .cotizador__vista{order:-1}
.cotizador[data-fijo] .cotizador__opciones{order:1}
.cotizador[data-fijo] .estudio__panel .campo--diseno{order:2;background:var(--bg);border-radius:var(--r-lg);padding:clamp(18px,2.6vw,26px)}
.cotizador[data-fijo] [data-estudio-error]{order:3}
.cotizador[data-fijo] .cotizador__cierre{order:4;position:static}
.cotizador[data-fijo] .estudio__panel .especs{order:5;background:var(--bg);border:0;border-radius:var(--r-lg);padding:6px clamp(18px,2.6vw,26px) 16px}
.cotizador[data-fijo] .ficha__garantias{font-size:14px}
@media (min-width:900px){
  .cotizador[data-fijo]{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);column-gap:clamp(28px,4vw,56px);align-items:start}
  .cotizador[data-fijo]>*,.cotizador[data-fijo] .estudio__panel>*{grid-area:auto;grid-column:2}
  /* La vista previa ocupa toda la altura de la columna de opciones para quedarse fija mientras se baja.
     Sin espacio entre filas: las filas vacías que crea el "span" no suman huecos; la separación la da el margen de cada bloque. */
  .cotizador[data-fijo]{row-gap:0}
  .cotizador[data-fijo]>*:not(.cotizador__vista),.cotizador[data-fijo] .estudio__panel>*,.cotizador[data-fijo] .estudio__grid>*:not(.cotizador__vista){margin-block-end:18px}
  .cotizador[data-fijo] .cotizador__vista{grid-column:1;grid-row:1 / span 14;position:sticky;top:16px;align-self:start}
}
/* Vista previa flotante: cuando sale de la pantalla queda pequeña abajo a la izquierda (sigue mostrando color y diseño) */
.maqueta__hueco[hidden]{display:none}
.maqueta.is-flotante{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:calc(96px + env(safe-area-inset-bottom));width:clamp(120px,22vw,190px);z-index:1300;cursor:pointer;border:3px solid var(--bg);box-shadow:0 12px 32px rgba(0,0,0,.28);animation:flotar-entra .25s var(--ease)}
.maqueta.is-flotante .maqueta__area,.maqueta.is-flotante .maqueta__asa,.maqueta.is-flotante .maqueta__medida,.maqueta.is-flotante .maqueta__nota{display:none}
.maqueta.is-flotante .maqueta__capa{pointer-events:none;outline:0!important}
@keyframes flotar-entra{from{opacity:0;transform:translateY(12px)}}
@media (prefers-reduced-motion:reduce){.maqueta.is-flotante{animation:none}}

/* ===== Escalas de precio ("Mientras más pides, menos pagas") ===== */
.escalas{display:grid;gap:10px;padding:16px 18px;background:var(--bg);border-radius:var(--r-lg)}
.escalas__t{margin:0;font-weight:700;font-size:15px}
.escalas__lista{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.escalas__fila{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;width:100%;min-height:44px;padding:8px 12px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink);font:500 14.5px/1.2 var(--font-body);text-align:left;cursor:pointer;transition:border-color var(--t-hover),background-color var(--t-hover)}
.escalas__fila:hover{border-color:var(--ink)}
.escalas__fila.is-on{border-color:var(--ink);background:var(--lima-suave)}
.escalas__ahorro{font:700 11.5px/1 var(--font-mono);color:#2E7D32}
.escalas__fila b{font-size:14.5px}

/* ===== Envío en el carrito (EasyPost) ===== */
.envio-cot{display:grid;gap:10px;padding:14px;border:1.5px dashed var(--line);border-radius:var(--r-md)}
.envio-cot__cab{display:flex;align-items:center;justify-content:space-between;gap:10px}
.envio-cot__t{font-weight:700}
.envio-cot__ops{display:grid;gap:8px}
.envio-op span{width:100%;justify-content:flex-start;flex-wrap:wrap;border-radius:var(--r-md);padding:10px 14px}
.envio-op b{font-weight:600}
.envio-op em{margin-left:auto}
.envio-cot__nota{margin:0;font-size:14px;color:var(--muted)}

/* ===== Configurador de gran formato (js/configurador.js): vista a la izquierda, pasos a la vista a la derecha, barra de total ===== */
.cfg-pag{display:grid;gap:clamp(18px,2.6vw,28px)}
.cfg-pag .ficha__cab{display:grid;gap:12px;max-width:820px}
.cfg{display:grid;gap:clamp(18px,2.4vw,32px);padding:clamp(16px,2.4vw,28px);background:var(--bg);border-radius:var(--r-lg)}
.cfg-pag>*,.cfg>*{min-width:0}
.cfg__cargando{margin:0;color:var(--muted)}
@media (min-width:960px){
  .cfg{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);grid-template-areas:"vista panel" "barra barra";align-items:start}
  .cfg__vista{grid-area:vista;position:sticky;top:96px}
  .cfg__panel{grid-area:panel}
  .cfg__barra{grid-area:barra}
}
.cfg__vista{display:grid;gap:12px}
.cfg__nombre{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:85%;font-size:clamp(28px,3.2vw,40px);text-transform:uppercase;line-height:.95}
.cfg__sub{margin:8px 0 0;font-size:13px;color:var(--muted)}
/* Vista sobre papel milimétrico */
.cfg__lienzo{position:relative;display:grid;place-items:center;align-content:center;gap:8px;min-height:340px;padding:40px 46px;border-radius:var(--r-md);background-color:#F4F5F7;background-image:linear-gradient(#E3E5E9 1px,transparent 1px),linear-gradient(90deg,#E3E5E9 1px,transparent 1px);background-size:18px 18px;overflow:hidden}
.cfg__lienzo.is-sobre{outline:3px dashed var(--ink);outline-offset:-6px}
.cfg__vacio{display:grid;place-items:center;gap:12px;color:#7A7D83;font:500 15px/1.3 var(--font-body);text-align:center}
.cfg__vacio svg{width:52px;height:52px}
.cfg__hoja-t,.cfg__hoja-pie{margin:0;font-size:12.5px;font-weight:700}
.cfg__hoja{width:auto;height:min(52vh,420px);max-width:100%}
.cfg__hoja-fondo{fill:#fff;stroke:#0A0A0A;stroke-width:.6}
.cfg__pieza{fill:none;stroke:#C9CBD0;stroke-width:.35}
.cfg__pieza.is-usada{fill:rgba(209,254,23,.35);stroke:#0A0A0A;stroke-width:.5}
.cfg__pieza-caja{position:relative;width:var(--ancho,60%);max-width:min(100%,640px);aspect-ratio:var(--prop,3/2);max-height:52vh}
.cfg__pieza-hoja{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;background:#fff;border:1.5px solid var(--ink);border-radius:2px}
.cfg__pieza-hoja img{width:100%;height:100%;object-fit:cover}
.cfg__pieza-hoja.es-tarjeta{border-radius:9%}
.cfg__pieza-hoja.es-tarjeta::after{content:"";position:absolute;inset:7%;border:1.5px dashed #6B5BFF;border-radius:7%;pointer-events:none}
.cfg__pieza-txt{padding:10px;color:#7A7D83;font:600 13px/1.35 var(--font-mono);text-align:center}
.cfg__cota{position:absolute;padding:1px 6px;border-radius:4px;background:var(--lima);font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap}
.cfg__cota--a{left:50%;top:-26px;transform:translateX(-50%)}
.cfg__cota--h{right:-10px;top:50%;transform:translate(100%,-50%) rotate(90deg);transform-origin:left center}
.cfg__acabados{position:absolute;inset:0;width:100%;height:100%}
.cfg__ojillo{fill:#fff;stroke:#0A0A0A;stroke-width:.35}
.cfg__tubo{fill:rgba(10,10,10,.14)}
/* Tu imagen */
.cfg__imagen{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.cfg-subir{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;border:2px solid var(--ink);border-radius:999px;background:var(--bg);color:var(--ink);font:700 15px/1 var(--font-body);cursor:pointer;transition:background-color var(--t-hover)}
.cfg-subir svg{width:20px;height:20px}
.cfg-subir:hover{background:var(--lima)}
.cfg__archivo{flex:1 1 200px;min-width:0;margin:0;font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
/* Pasos */
.cfg__panel{display:grid;gap:4px}
.cfg__pasos{display:grid}
.cfg-paso{display:grid;gap:12px;padding:20px 0;border-top:1.5px dashed var(--line)}
.cfg-paso:first-child{margin-top:14px}
.cfg-paso__t{margin:0;display:flex;align-items:center;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:20px;text-transform:uppercase;letter-spacing:.01em}
.cfg-paso__ayuda{margin:-4px 0 0;font-size:14px;color:var(--muted)}
/* Medida: campos grandes */
.cfg-medida{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:10px}
.cfg-campo{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:8px 14px 10px;border:2px solid var(--ink);border-radius:var(--r-md);background:var(--bg);cursor:text}
.cfg-campo:focus-within{box-shadow:0 0 0 4px var(--lima)}
.cfg-campo span{grid-column:1/-1;font:700 11.5px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cfg-campo input{width:100%;min-width:0;min-height:0;padding:2px 0 0;border:0;background:none;font:700 clamp(26px,3vw,34px)/1.1 var(--font-mono);color:var(--ink);outline:0;box-shadow:none}
.cfg-campo em{font:700 16px/1 var(--font-mono);font-style:normal;color:var(--muted)}
.cfg-medida__girar{display:grid;place-items:center;width:44px;height:44px;margin-bottom:12px;border:1.5px solid var(--line);border-radius:50%;background:var(--bg);cursor:pointer}
.cfg-medida__girar svg{width:20px;height:20px}
.cfg-medida__girar:hover{border-color:var(--ink);background:var(--lima)}
.cfg-medida__pies{margin:0;font-size:13.5px;font-weight:700}
.cfg-plotter{display:grid;gap:6px}
.cfg-plotter__fila{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:13px;color:var(--muted)}
.cfg-plotter__fila b{color:var(--ink);font-size:13px}
.cfg-plotter__barra{height:10px;border:1.5px solid var(--ink);border-radius:999px;background:var(--surface);overflow:hidden}
.cfg-plotter__barra i{display:block;height:100%;background:var(--lima);border-right:1.5px solid var(--ink);transition:width .25s var(--ease)}
.cfg-plotter__barra.es-fuera i{background:var(--error)}
.cfg-candado{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg);font:600 14px/1.2 var(--font-body);cursor:pointer}
.cfg-candado svg{width:18px;height:18px}
.cfg-candado[aria-pressed="true"]{background:var(--lima);border-color:var(--ink)}
/* Material: tarjetas */
.cfg-mats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.cfg-mat{display:grid;align-content:start;gap:4px;min-height:76px;padding:12px 14px;border:2px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink);text-align:left;cursor:pointer;transition:border-color var(--t-hover),background-color var(--t-hover)}
.cfg-mat:hover{border-color:var(--ink)}
.cfg-mat__n{font:700 15px/1.2 var(--font-body)}
.cfg-mat__p{font-size:13px;font-weight:700}
.cfg-mat__p small{font-weight:500;color:var(--muted)}
.cfg-mat__2{font-size:12px;color:var(--muted)}
.cfg-mat.is-on{border-color:var(--ink);background:var(--ink);color:#fff}
.cfg-mat.is-on .cfg-mat__p{color:var(--lima)}
.cfg-mat.is-on .cfg-mat__p small,.cfg-mat.is-on .cfg-mat__2{color:#C9CBD0}
/* Botones de "uno de varios" */
.cfg-seg{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border:2px solid var(--ink);border-radius:var(--r-md);background:var(--bg);justify-self:start;max-width:100%}
.cfg-seg button{min-height:40px;padding:0 14px;border:0;border-radius:calc(var(--r-md) - 4px);background:none;color:var(--ink);font:600 14px/1.2 var(--font-body);cursor:pointer}
.cfg-seg button:hover{background:var(--surface)}
.cfg-seg button.is-on{background:var(--lima);font-weight:800}
.cfg-seg button:disabled{opacity:.4;cursor:not-allowed;background:none}
/* Acabados */
.cfg-ops{display:grid}
.cfg-op{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.cfg-op:last-child{border-bottom:0}
.cfg-op__txt{display:grid;gap:2px;min-width:0;flex:1 1 160px}
.cfg-op__n{font:700 15px/1.25 var(--font-body)}
.cfg-op__porque{font-size:12.5px;color:var(--muted)}
.cfg-op__porque:empty{display:none}
.cfg-op.is-fuera .cfg-op__n{color:var(--muted)}
.cfg-op--elegir .cfg-seg{flex:1 1 100%}
.cfg-switch{position:relative;flex:none;width:58px;height:34px;padding:0;border:2px solid var(--ink);border-radius:999px;background:var(--surface);cursor:pointer;transition:background-color var(--t-hover)}
.cfg-switch i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--ink);transition:transform .2s var(--ease)}
.cfg-switch[aria-checked="true"]{background:var(--lima)}
.cfg-switch[aria-checked="true"] i{transform:translateX(24px)}
.cfg-switch:disabled{opacity:.4;cursor:not-allowed}
.cfg-switch:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.cfg-cont{max-width:180px;grid-template-columns:44px 1fr 44px}
.cfg-cont button{min-height:44px}
.cfg-cont input{padding:8px 4px;font-family:var(--font-mono);font-weight:700}
.cfg-cant{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
/* Barra del total */
.cfg__barra{position:sticky;bottom:max(10px,env(safe-area-inset-bottom,0px));z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;padding:14px 14px 14px 22px;border-radius:var(--r-lg);background:var(--ink);color:#fff;box-shadow:0 18px 40px -18px rgba(10,10,10,.6)}
.cfg__precio{display:grid;gap:2px}
.cfg__total{margin:0;font-size:clamp(28px,3.6vw,40px);font-weight:700;line-height:1;color:var(--lima)}
.cfg__info{margin:0;font-size:13px;color:#C9CBD0}
.cfg__aviso{flex:1 1 180px;min-width:0;margin:0;font-size:13.5px;color:#C9CBD0}
.cfg__aviso.es-error{color:#FF8A80;font-weight:600}
.cfg__barra .btn{margin-left:auto}
.cfg__barra .btn:disabled{opacity:.45;cursor:not-allowed}
@media (max-width:640px){
  .cfg__lienzo{padding:32px 34px;min-height:240px}
  .cfg__barra{flex-wrap:nowrap;padding:10px 10px 10px 16px;gap:10px}
  .cfg__total{font-size:26px}
  .cfg__info{font-size:11.5px}
  .cfg__barra .btn{flex:none;min-height:48px;padding:0 14px;font-size:15px;gap:8px}
  .cfg__aviso{display:none}
  .cfg-medida__girar{width:40px;height:40px}
}
/* Con configurador, su propia barra de total reemplaza la barra fija del celular */
body:has(.cfg) .barra-cel{display:none!important}
.cfg-campo.is-fijo{border-color:var(--line);background:var(--surface);cursor:default}
.cfg-campo.is-fijo input{color:var(--muted);-webkit-text-fill-color:var(--muted);opacity:1}
.cfg-medida__x{align-self:center;padding-top:14px;font:700 22px/1 var(--font-mono);color:var(--muted)}
.cfg__pieza-hoja.es-rollo img{object-fit:contain}
.cfg__precio{min-width:0;flex:0 1 auto}
.cfg__total.es-texto{font-size:clamp(20px,2.4vw,28px)}
@media (max-width:640px){.cfg__total.es-texto{font-size:18px}.cfg__info{overflow-wrap:anywhere}}

/* ===== Prendas y taza en su página (cotizador con data-fijo): mismo estilo que el configurador =====
   Pasos numerados a la vista, opciones en tarjetas, interruptor para los extras y barra negra con el total. */
.cotizador[data-fijo]{counter-reset:paso}
.cotizador[data-fijo] .cotizador__opciones>.paso__titulo{display:none}
.cotizador[data-fijo] .cotizador__opciones{display:grid;gap:0}
.cotizador[data-fijo] .cotizador__opciones>.campo{display:grid;gap:12px;margin:0;padding:6px 0 20px;border:0}
.cotizador[data-fijo] .cotizador__opciones>.campo:not([hidden])~.campo:not([hidden]){padding-top:20px;border-top:1.5px dashed var(--line)}
.cotizador[data-fijo] .cotizador__opciones>.campo:not([hidden]):first-of-type,.cotizador[data-fijo] .cotizador__opciones>.paso__titulo+.campo{border-top:0;padding-top:6px}
.cotizador[data-fijo] .cotizador__opciones>.campo>legend,.cotizador[data-fijo] .cotizador__opciones>.campo>label:first-child,.cotizador[data-fijo] .campo--diseno>label[for="c-diseno"]:not(.subir){display:flex;align-items:center;float:left;width:100%;margin-bottom:12px;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:20px;text-transform:uppercase;letter-spacing:.01em}
.cotizador[data-fijo] .cotizador__opciones>.campo>legend+*{clear:both}
.cotizador[data-fijo] .cotizador__opciones>.campo>legend::before,.cotizador[data-fijo] .cotizador__opciones>.campo>label:first-child::before,.cotizador[data-fijo] .campo--diseno>label[for="c-diseno"]:not(.subir)::before{counter-increment:paso;content:counter(paso);display:inline-grid;place-items:center;flex:none;width:26px;height:26px;margin-right:10px;border-radius:50%;background:var(--ink);color:var(--lima);font:700 13px/1 var(--font-mono)}
.cotizador[data-fijo] .campo--diseno>label[for="c-diseno"]:not(.subir) .unidad{margin-left:8px;font:500 11px/1 var(--font-mono);text-transform:none;color:var(--muted)}
.cotizador[data-fijo] .campo .unidad{text-transform:none}
/* Opciones en tarjetas: la elegida en negro con la letra en lima */
.cotizador[data-fijo] .acabados{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.cotizador[data-fijo] .acabado span{display:grid;align-content:start;gap:4px;width:100%;min-height:64px;padding:12px 14px;border:2px solid var(--line);border-radius:var(--r-md);background:var(--bg);font:700 15px/1.2 var(--font-body)}
.cotizador[data-fijo] .acabado span::before{display:none}
.cotizador[data-fijo] .acabado span:hover{border-color:var(--ink)}
.cotizador[data-fijo] .acabado em{font-size:12.5px;font-weight:700}
.cotizador[data-fijo] .acabado input:checked+span{border-color:var(--ink);background:var(--ink);color:#fff}
.cotizador[data-fijo] .acabado input:checked+span em{color:var(--lima)}
.cotizador[data-fijo] .acabado .ori{display:none}
/* Extras de sí/no (también en la espalda, caja individual): renglón con interruptor */
.cotizador[data-fijo] .acabado:has(input[type=checkbox]){grid-column:1/-1}
.cotizador[data-fijo] .acabado input[type=checkbox]+span{position:relative;display:flex;align-items:center;min-height:56px;padding-right:86px;border-color:var(--line);background:var(--bg);color:var(--ink)}
.cotizador[data-fijo] .acabado input[type=checkbox]+span::before{content:"";display:block;position:absolute;right:14px;top:50%;width:58px;height:34px;margin-top:-17px;border:2px solid var(--ink);border-radius:999px;background:var(--surface);transition:background-color var(--t-hover)}
.cotizador[data-fijo] .acabado input[type=checkbox]+span::after{content:"";position:absolute;right:43px;top:50%;width:24px;height:24px;margin-top:-12px;border-radius:50%;background:var(--ink);transition:transform .2s var(--ease)}
.cotizador[data-fijo] .acabado input[type=checkbox]:checked+span{background:var(--bg);color:var(--ink);border-color:var(--ink)}
.cotizador[data-fijo] .acabado input[type=checkbox]:checked+span::before{background:var(--lima)}
.cotizador[data-fijo] .acabado input[type=checkbox]:checked+span::after{transform:translateX(24px)}
.cotizador[data-fijo] .acabado input[type=checkbox]:checked+span em{color:var(--muted)}
/* Cantidad */
.cotizador[data-fijo] .campo--cant{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.cotizador[data-fijo] .campo--cant>label{width:100%;margin-bottom:0}
.cotizador[data-fijo] .campo--cant .cantidad{order:1;width:180px;grid-template-columns:44px 1fr 44px}
.cotizador[data-fijo] .campo--cant .presets{order:2}
.preset.is-on,.cotizador[data-fijo] .preset[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--lima)}
/* Barra negra con el total y el botón, fija abajo mientras eliges */
.cotizador[data-fijo] .cotizador__cierre{display:contents}
.cotizador[data-fijo] .resumen{display:none}
.cotizador[data-fijo] .escalas{order:3}
.cotizador[data-fijo] .total{order:6;position:sticky;bottom:max(10px,env(safe-area-inset-bottom,0px));z-index:20;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 16px;padding:14px 14px 14px 22px;box-shadow:0 18px 40px -18px rgba(10,10,10,.6)}
.cotizador[data-fijo] .total__lbl{display:none}
.cotizador[data-fijo] .total__num{grid-column:1;margin:0;font-size:clamp(22px,2.8vw,34px);line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cotizador[data-fijo] .total__nota{grid-column:1;margin:0;font-size:13px}
.cotizador[data-fijo] .total__btn{grid-column:2;grid-row:1 / span 2}
.cotizador[data-fijo] .estudio__panel .especs{order:7}
body:has(.cotizador[data-fijo]) .barra-cel{display:none!important}
@media (max-width:640px){
  .cotizador[data-fijo] .total{padding:10px 10px 10px 16px;gap:2px 10px}
  .cotizador[data-fijo] .total__num{font-size:21px}
  .cotizador[data-fijo] .total__nota{font-size:11.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .cotizador[data-fijo] .total__btn{min-height:48px;padding:0 14px;font-size:15px;gap:8px}
  .cotizador[data-fijo] .acabados{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:900px){.cotizador[data-fijo] .cotizador__cierre>*{grid-area:auto;grid-column:2}}

/* Envío: al elegir una opción la lista se cierra y queda la elegida con 'Cambiar' */
.envio-cot__cambiar{display:none;justify-self:start;font-size:14px}
.envio-cot__ops.is-cerrado .envio-op:not(:has(input:checked)){display:none}
.envio-cot__ops.is-cerrado .envio-cot__cambiar{display:inline-flex}
/* Configurador: tu diseño sobre la pieza se mueve y se agranda (js/configurador.js) */
.cfg__pieza-hoja.es-editable{overflow:visible}
.cfg__pieza-hoja .cfg__diseno{position:absolute;max-width:none;object-fit:fill;cursor:grab;touch-action:none;user-select:none;outline:1.5px dashed var(--ink);outline-offset:0}
.cfg__pieza-hoja .cfg__diseno:focus-visible{outline:3px solid var(--ink)}
.cfg__pieza-hoja.is-editando .cfg__diseno{cursor:grabbing;outline-color:#6B5BFF}
.cfg__asa{position:absolute;z-index:3;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid var(--ink);border-radius:50%;background:var(--lima);cursor:nwse-resize;touch-action:none}
@media (pointer:coarse){.cfg__asa{width:28px;height:28px;margin:-14px 0 0 -14px}}
.cfg-dis{flex:1 1 100%;display:grid;gap:8px;padding:14px;border:1.5px dashed var(--line);border-radius:var(--r-md)}
.cfg-dis__fila{display:flex;justify-content:space-between;gap:12px;font-weight:700;font-size:14px}
.cfg-dis input[type=range]{width:100%;accent-color:var(--ink)}
.cfg-dis__botones{display:flex;flex-wrap:wrap;gap:8px}
.cfg-dis__nota{margin:0;font-size:12.5px;color:var(--muted)}
.cfg__vistas{position:absolute;top:10px;left:10px;z-index:4;padding:3px}
.cfg__vistas button{min-height:34px;padding:0 12px;font-size:13px}
.cfg__imagen .enlace{min-height:44px;padding:0 4px;border:0;background:none;color:var(--ink);font:600 14px/1 var(--font-body);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
/* Aviso sobre la foto: qué incluye el producto (transfers vs. camiseta) */
.producto__aviso{position:absolute;left:10px;bottom:10px;z-index:2;max-width:calc(100% - 20px);white-space:nowrap;padding:5px 10px;border:1.5px solid var(--ink);border-radius:var(--r-md);background:var(--lima);color:var(--ink);font:700 12.5px/1.2 var(--font-body);text-align:center}

/* Confirmación comercial y revisión técnica */
.resumen-comercial { border-top:1px solid #ccc; padding:16px 0; }
.resumen-comercial .pg__ayuda, .archivo-calidad { color:#454545; font-size:14px; line-height:1.6; }
.archivo-calidad { background:#f2f3e6; border-left:4px solid #758300; padding:14px; margin:12px 0; }
.cfg + .archivo-calidad { margin-bottom:100px; }
/* Revisión automática del archivo: lista de puntos con su nivel */
.revision--aviso { border-left-color:#B26A00; background:#FFF6E5; }
.revision--error { border-left-color:var(--error); background:#FDECEC; }
.revision__titulo { margin:0 0 8px; font-weight:600; color:var(--ink); }
.revision__lista { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.revision__punto { display:grid; grid-template-columns:20px 1fr; gap:8px; align-items:start; }
.revision__punto > span { width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:700; line-height:1; margin-top:2px; }
.revision__punto--ok > span { background:#758300; color:#fff; }
.revision__punto--info > span { background:var(--line); color:var(--ink); }
.revision__punto--aviso > span { background:#B26A00; color:#fff; }
.revision__punto--error > span { background:var(--error); color:#fff; }
.revision__pie { margin:10px 0 0; font-size:13px; color:var(--muted); }
.operacion .campo { margin:12px 0; }
.operacion input[type="checkbox"] { width:22px; height:22px; }
.operacion [role="status"] { color:#333; }
.resumen-comercial dt { color:#454545; }

.datos-opcionales { border-top:1px solid #ddd; padding:12px 0; margin:10px 0; }
.datos-opcionales summary { cursor:pointer; font-weight:600; padding:8px 0; }
.datos-opcionales[open] .campo { margin-top:12px; }
/* ===== Plantillas editables (js/plantillas.js) ===== */
.cfg-subir--plantilla{border-color:var(--ink);background:var(--lima)}
.cfg-subir--plantilla:hover{background:var(--ink);color:var(--lima)}
.pl{width:min(1080px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:var(--r-lg);background:var(--bg);color:var(--ink);overflow:auto}
.pl::backdrop{background:rgba(10,10,10,.6)}
.pl__cab{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px clamp(16px,2.4vw,24px);background:var(--bg);border-bottom:1.5px dashed var(--line)}
.pl__t{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:clamp(20px,2.4vw,26px);text-transform:uppercase}
.pl__cerrar{width:44px;height:44px;border:1.5px solid var(--line);border-radius:50%;background:var(--bg);font-size:24px;line-height:1;cursor:pointer}
.pl__cuerpo{display:grid;gap:20px;padding:clamp(16px,2.4vw,24px)}
@media (min-width:860px){.pl__cuerpo{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start}.pl__vista{position:sticky;top:90px}}
.pl__vista{display:grid;justify-items:center;gap:8px;margin:0;padding:24px;border-radius:var(--r-md);background-color:#F4F5F7;background-image:linear-gradient(#E3E5E9 1px,transparent 1px),linear-gradient(90deg,#E3E5E9 1px,transparent 1px);background-size:18px 18px}
.pl__vista canvas{max-width:100%;max-height:52vh;height:auto;box-shadow:0 10px 30px -14px rgba(10,10,10,.5);border:1px solid var(--ink)}
.pl__vista figcaption{font-size:12.5px;font-weight:700}
.pl__panel{display:grid;gap:16px;min-width:0}
.pl__grupo{display:grid;gap:10px;margin:0;padding:0;border:0}
.pl__grupo legend{margin-bottom:8px;font-weight:800;font-size:15px}
.pl__chips{display:flex;flex-wrap:wrap;gap:8px}
.pl__chips .preset{font-family:var(--font-body);font-size:14px}
.pl__colores{display:flex;flex-wrap:wrap;gap:10px}
.pl__color{width:44px;height:44px;border:2px solid var(--line);border-radius:50%;background:linear-gradient(135deg,var(--a) 0 55%,var(--b) 55% 100%);cursor:pointer}
.pl__color.is-on{border-color:var(--ink);box-shadow:0 0 0 3px var(--lima)}
.pl__campos{display:grid;gap:10px}
.pl__campo{display:grid;gap:4px;font-size:13px;font-weight:600}
.pl__campo input{min-height:44px;padding:8px 12px}
.pl__nota{margin:0;font-size:12.5px;color:var(--muted)}
.pl__logo{justify-self:start;font-family:var(--font-body);font-size:14px;cursor:pointer}
.pl__pie{position:sticky;bottom:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px clamp(16px,2.4vw,24px);background:var(--bg);border-top:1.5px dashed var(--line)}
.pl__aviso{flex:1 1 220px;margin:0;font-size:13px;color:var(--muted)}
/* Armador de hoja DTF: la hoja a escala se desplaza si es larga; cada diseño en una fila */
.ar__vista{padding:16px}
.ar__lienzo{max-height:60vh;overflow:auto;width:100%;display:grid;justify-items:center}
.ar__lienzo canvas{width:min(300px,100%);height:auto;max-height:none;box-shadow:0 10px 30px -14px rgba(10,10,10,.5);border:1px solid var(--ink)}
.ar__lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ar__fila{display:grid;grid-template-columns:56px minmax(0,1fr) 44px;gap:8px 10px;align-items:center;padding:10px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.ar__fila img{width:56px;height:56px;object-fit:contain;border-radius:6px;background-color:#F4F5F7;background-image:linear-gradient(45deg,#E3E5E9 25%,transparent 25%,transparent 75%,#E3E5E9 75%),linear-gradient(45deg,#E3E5E9 25%,transparent 25%,transparent 75%,#E3E5E9 75%);background-size:12px 12px;background-position:0 0,6px 6px}
.ar__fila.es-baja{border-color:#C62828}
.ar__fila.es-baja .ar__info{color:#C62828;font-weight:700}
.ar__datos{display:grid;gap:2px;min-width:0}
.ar__nombre{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar__info{font-size:12px;color:var(--muted)}
.ar__nums{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ar__nums input{min-height:44px;padding:8px 12px;width:100%}
.ar__check{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:600}
.ar__check input{width:20px;height:20px;accent-color:var(--ink,#121411)}
.ar__resumen{margin:0;font-weight:700;font-size:15px}

/* ===== Páginas por sector (campañas): portada con foto, productos y pasos ===== */
.sector{padding-top:clamp(28px,5vw,56px)}
.sector__grid{display:grid;gap:28px;align-items:center}
.sector__texto{display:grid;gap:18px;min-width:0}
.sector__titulo{margin:0;font-family:var(--font-display);font-weight:700;font-stretch:78%;font-size:clamp(2.5rem,8vw,4.8rem);line-height:.98;letter-spacing:-.03em;text-wrap:balance}
.sector__lead{margin:0;max-width:52ch;font-size:clamp(17px,1.5vw,19px)}
.sector__acciones{display:flex;flex-wrap:wrap;gap:10px}
.sector__foto{margin:0;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 24px 50px -28px rgba(10,10,10,.45)}
.sector__foto img{display:block;width:100%;height:auto;aspect-ratio:1200/805;object-fit:cover}
.sector__productos .producto__nombre{font-size:clamp(18px,1.6vw,21px)}
.sector__pasos{display:grid;gap:16px;margin:32px 0 0;padding:0;list-style:none}
.sector__pasos li{display:grid;gap:8px;padding:22px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.sector__pasos h3{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:22px;text-transform:uppercase}
.sector__pasos p{margin:0;color:var(--muted)}
.sector__n{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--lima);color:var(--ink);font-weight:700}
.sector__fin{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:28px;padding:24px;border-radius:var(--r-lg);background:var(--ink);color:var(--bg)}
.sector__fin h3{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:clamp(22px,2.4vw,28px);text-transform:uppercase}
.sector__fin p{margin:6px 0 0;max-width:52ch;opacity:.8}
@media (min-width:900px){
  .sector__grid{grid-template-columns:1.05fr 1fr;gap:48px}
  .sector__pasos{grid-template-columns:repeat(3,1fr)}
}

/* ===== Aviso de sitio en construcción (pantalla completa, por encima de todo) ===== */
.obra-abierta .obra{display:none}
html:not(.obra-abierta) body:has(.obra){overflow:hidden}
.obra{position:fixed;inset:0;height:100dvh;z-index:2147483000;display:grid;place-items:center;overflow:hidden;padding-block:max(16px,3dvh);padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));background:#0A0A0A;color:#fff;text-align:center;isolation:isolate}
.obra__mancha{position:absolute;z-index:-1;width:70vmax;height:70vmax;border-radius:50%;filter:blur(60px);opacity:.35;pointer-events:none}
.obra__mancha--a{top:-30vmax;left:-20vmax;background:radial-gradient(circle,#D1FE17,transparent 62%);animation:obra-flota 14s ease-in-out infinite alternate}
.obra__mancha--b{bottom:-35vmax;right:-25vmax;background:radial-gradient(circle,#2E6BFF,transparent 62%);opacity:.22;animation:obra-flota 18s ease-in-out infinite alternate-reverse}
.obra__caja{max-width:860px;max-height:100%;display:grid;justify-items:center;gap:clamp(10px,2.6dvh,28px)}
.obra__caja>*{opacity:0;transform:translateY(24px);animation:obra-entra .9s cubic-bezier(.2,.8,.2,1) forwards}
.obra__caja>:nth-child(2){animation-delay:.12s}.obra__caja>:nth-child(3){animation-delay:.24s}.obra__caja>:nth-child(4){animation-delay:.38s}.obra__caja>:nth-child(5){animation-delay:.5s}.obra__caja>:nth-child(6){animation-delay:.62s}.obra__caja>:nth-child(7){animation-delay:.74s}
.obra__marca{position:relative;display:grid;place-items:center;width:clamp(76px,15dvh,132px);height:clamp(76px,15dvh,132px)}
.obra__marca::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px dashed rgba(209,254,23,.55);animation:obra-gira 16s linear infinite}
.obra__logo{width:72%;height:72%;border-radius:24px;box-shadow:0 20px 60px -12px rgba(209,254,23,.55);animation:obra-sube 3.2s ease-in-out infinite}
.obra__ceja{margin:0;padding:10px 18px;border-radius:999px;background:#D1FE17;color:#0A0A0A;font:700 clamp(12px,1.4vw,15px)/1 var(--font-mono);letter-spacing:.16em;text-transform:uppercase}
.obra__titulo{margin:0;font-family:var(--font-display);font-weight:700;font-stretch:76%;font-size:clamp(2.4rem,min(13vw,11dvh),7rem);line-height:.94;letter-spacing:-.035em;text-wrap:balance}
.obra__texto{margin:0;max-width:34ch;font-size:clamp(17px,min(5.2vw,3.4dvh),28px);line-height:1.4;color:rgba(255,255,255,.9);text-wrap:balance}
.obra__texto--chico{max-width:44ch;font-size:clamp(16px,1.6vw,18px);color:rgba(255,255,255,.62)}
.obra__btn{display:inline-flex;align-items:center;gap:10px;padding:18px 30px;border-radius:14px;background:#D1FE17;color:#0A0A0A;font-weight:700;font-size:18px;text-decoration:none;box-shadow:0 14px 40px -12px rgba(209,254,23,.6);transition:transform .2s}
.obra__btn:hover{transform:translateY(-3px)}
.obra__barra{width:min(320px,70vw);height:8px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.obra__barra span{display:block;width:40%;height:100%;border-radius:inherit;background:#D1FE17;animation:obra-barra 2.4s ease-in-out infinite}
@keyframes obra-entra{to{opacity:1;transform:none}}
@keyframes obra-barra{0%{transform:translateX(-110%)}100%{transform:translateX(260%)}}
@keyframes obra-gira{to{transform:rotate(360deg)}}
@keyframes obra-sube{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes obra-flota{to{transform:translate(8vmax,6vmax) scale(1.1)}}
@media (prefers-reduced-motion:reduce){.obra *,.obra *::before{animation:none!important}.obra__caja>*{opacity:1;transform:none}.obra__barra span{width:70%}}
/* Elementos de imprenta del aviso: trama de puntos, marcas de corte, registro y tintas CMYK */
.obra__trama{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.09) 1.2px,transparent 1.6px);background-size:18px 18px;-webkit-mask-image:radial-gradient(80% 70% at 50% 50%,#000,transparent);mask-image:radial-gradient(80% 70% at 50% 50%,#000,transparent);pointer-events:none}
.obra__corte{position:absolute;width:clamp(28px,5vmin,48px);height:clamp(28px,5vmin,48px);border:0 solid rgba(209,254,23,.75);pointer-events:none;animation:obra-aparece 1.2s .9s both}
.obra__corte--tl{top:max(18px,3dvh);left:max(18px,3vw);border-top-width:2px;border-left-width:2px}
.obra__corte--tr{top:max(18px,3dvh);right:max(18px,3vw);border-top-width:2px;border-right-width:2px}
.obra__corte--bl{bottom:max(18px,3dvh);left:max(18px,3vw);border-bottom-width:2px;border-left-width:2px}
.obra__corte--br{bottom:max(18px,3dvh);right:max(18px,3vw);border-bottom-width:2px;border-right-width:2px}
.obra__registro{position:absolute;width:clamp(26px,4vmin,40px);height:clamp(26px,4vmin,40px);fill:none;stroke:rgba(255,255,255,.4);stroke-width:1.5;pointer-events:none;animation:obra-gira 22s linear infinite}
.obra__registro--a{top:50%;left:max(14px,2.4vw);margin-top:-20px}
.obra__registro--b{top:50%;right:max(14px,2.4vw);margin-top:-20px;animation-direction:reverse}
.obra__tintas{display:flex;gap:10px}
.obra__tinta{width:clamp(12px,1.8dvh,16px);height:clamp(12px,1.8dvh,16px);border-radius:50%;animation:obra-gota 2.4s ease-in-out infinite}
.obra__tinta--c{background:#00B7EB}.obra__tinta--m{background:#FF2E93;animation-delay:.2s}.obra__tinta--y{background:#FFE14D;animation-delay:.4s}.obra__tinta--k{background:#fff;animation-delay:.6s}
@keyframes obra-gota{0%,100%{transform:translateY(0) scale(1)}40%{transform:translateY(-7px) scale(1.12)}}
@keyframes obra-aparece{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@media (max-width:600px){.obra__registro{display:none}}
@media (prefers-reduced-motion:reduce){.obra__corte,.obra__registro,.obra__tinta{animation:none!important}}
.obra__correo{margin:0;font-size:clamp(15px,min(4.4vw,2.4dvh),20px);color:rgba(255,255,255,.7)}
.obra__correo a{color:#D1FE17;font-weight:700;text-decoration:none;border-bottom:2px solid rgba(209,254,23,.4)}
.obra__correo a:hover{border-bottom-color:#D1FE17}

/* ===== Programa para imprentas: beneficios y formulario de registro ===== */
.imp__intro{max-width:760px}
.imp__beneficios{display:grid;gap:14px;margin:36px 0 0;padding:0;list-style:none}
.imp__beneficios li{display:grid;gap:6px;padding:22px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.imp__beneficios svg{width:22px;height:22px}
.imp__beneficios h2{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:21px;text-transform:uppercase}
.imp__beneficios p{margin:0;color:var(--muted)}
.imp__wrap{max-width:920px}
.imp__nota{margin:8px 0 0;max-width:60ch;color:var(--muted)}
.imp__form{display:grid;gap:18px;margin-top:28px}
.imp__paso{margin:0;padding:22px;border:1.5px solid var(--line);border-radius:var(--r-lg);background:var(--bg);min-width:0}
.imp__paso legend{display:flex;align-items:center;gap:10px;padding:0 6px;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:20px;text-transform:uppercase}
.imp__n{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--lima);color:var(--ink);font-size:13px}
.imp__rejilla{display:grid;gap:14px;margin-top:10px}
.imp__campo{display:grid;gap:6px;min-width:0;font-weight:600;font-size:14px}
.imp__campo input,.imp__campo select{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--bg);color:var(--ink);font:500 16px/1.3 var(--font-body)}
.imp__campo input:focus,.imp__campo select:focus{outline:3px solid var(--lima);outline-offset:1px;border-color:var(--ink)}
.imp__campo small,.imp__sub small{display:block;font-weight:400;font-size:13px;color:var(--muted)}
.imp__sub{margin:6px 0 0;font-weight:700;grid-column:1/-1}
.imp__chips{display:flex;flex-wrap:wrap;gap:8px;grid-column:1/-1}
.imp__chips-t{width:100%;font-weight:600;font-size:14px}
.imp__chip{position:relative;cursor:pointer}
.imp__chip input{position:absolute;opacity:0;inset:0}
.imp__chip span{display:inline-block;padding:9px 14px;border:1.5px solid var(--line);border-radius:999px;font-size:14px;background:var(--bg);transition:background .15s,border-color .15s}
.imp__chip input:checked+span{background:var(--lima);border-color:var(--ink);font-weight:700}
.imp__chip input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px}
.imp__acepta{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.5}
.imp__acepta input{width:22px;height:22px;flex:none;margin-top:1px;accent-color:var(--ink)}
.imp__error{margin:0;min-height:1.4em;color:#B42318;font-weight:600}
.imp__listo{display:grid;gap:14px;justify-items:start;margin-top:28px;padding:28px;border-radius:var(--r-lg);background:var(--ink);color:var(--bg)}
.imp__listo-t{margin:0;font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:clamp(24px,3vw,32px);text-transform:uppercase;color:var(--lima)}
.imp__listo p{margin:0;max-width:60ch}
@media (min-width:700px){.imp__rejilla{grid-template-columns:repeat(2,minmax(0,1fr))}.imp__beneficios{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.imp__beneficios{grid-template-columns:repeat(4,1fr)}}

/* ===== Bienvenida: elegir cliente directo o imprenta (debajo del aviso en construcción) ===== */
.con-elige body{overflow:hidden}
.elige{position:fixed;inset:0;height:100dvh;z-index:2147482000;display:grid;place-items:center;overflow-y:auto;padding-block:max(16px,3dvh);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:radial-gradient(70% 60% at 50% 0%,rgba(209,254,23,.18),transparent 70%),var(--surface)}
.elige[hidden]{display:none}
.elige__caja{width:min(1040px,100%);display:grid;justify-items:center;gap:clamp(10px,2dvh,18px);text-align:center}
.elige__ceja{margin:0;padding:8px 14px;border-radius:999px;background:var(--ink);color:var(--lima);font:700 12px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase}
.elige__titulo{margin:0;font-family:var(--font-display);font-weight:700;font-stretch:78%;font-size:clamp(2.2rem,min(8vw,8dvh),4.6rem);line-height:.98;letter-spacing:-.03em}
.elige__opciones{display:grid;gap:14px;width:100%;margin-top:clamp(4px,1.5dvh,14px)}
.elige__op{display:grid;grid-template-columns:96px 1fr;grid-template-rows:auto auto auto;column-gap:16px;row-gap:4px;align-items:center;padding:16px;border:2px solid var(--line);border-radius:var(--r-lg);background:var(--bg);color:var(--ink);text-align:left;text-decoration:none;font:inherit;cursor:pointer;box-shadow:0 14px 34px -24px rgba(10,10,10,.5);transition:transform .2s,border-color .2s,box-shadow .2s}
.elige__op:hover,.elige__op:focus-visible{transform:translateY(-3px);border-color:var(--ink);box-shadow:0 20px 40px -22px rgba(10,10,10,.55);outline:none}
.elige__op--imprenta{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.elige__foto{grid-row:1/4;display:grid;place-items:end center;height:96px;border-radius:var(--r-md);background:var(--lima);overflow:hidden}
.elige__op--imprenta .elige__foto{background:#2A2D31}
.elige__foto img{width:100%;height:100%;object-fit:contain;object-position:bottom}
.elige__op-t{font-family:var(--font-display);font-weight:800;font-stretch:88%;font-size:clamp(20px,2.4vw,28px);line-height:1.05;text-transform:uppercase}
.elige__op-p{font-size:14.5px;line-height:1.4;opacity:.75}
.elige__op-b{font-weight:700;font-size:15px}
.elige__op--imprenta .elige__op-b{color:var(--lima)}
@media (min-width:760px){
  .elige__opciones{grid-template-columns:1fr 1fr;gap:20px}
  .elige__op{grid-template-columns:1fr;justify-items:start;padding:20px;row-gap:8px}
  .elige__foto{grid-row:auto;width:100%;height:clamp(150px,30dvh,280px)}
}