:root{--fondo:#cfc8bd;--piso:#bdb5a8;--acento:#2f5d6b;--tinta:#1d1b18;--tinta-suave:#4b463f;--papel:#faf8f4e6;--display:"Jost", "Futura", "Avenir Next", sans-serif;--texto:"Newsreader", Georgia, serif;--mono:"IBM Plex Mono", ui-monospace, Menlo, monospace}*{box-sizing:border-box}html,body{background:var(--fondo);color:var(--tinta);margin:0}body{font:18px/1.55 var(--texto)}#escena{width:100vw;height:100vh;display:block;position:fixed;inset:0}.barra{z-index:5;padding:calc(14px + env(safe-area-inset-top,0px)) 24px 14px;flex-wrap:wrap;align-items:center;gap:16px;display:flex;position:fixed;top:0;left:0;right:0}.marca{font:600 1.05rem/1 var(--display);letter-spacing:.22em;text-transform:uppercase}.demo{font:400 .72rem/1 var(--mono);color:var(--tinta-suave);letter-spacing:.04em}.escenario{align-items:center;gap:10px;margin-left:auto;display:flex}.btn-remezclar{font:500 .85rem/1 var(--display);letter-spacing:.06em;cursor:pointer;border:1px solid var(--tinta);color:var(--tinta);background:0 0;border-radius:999px;padding:10px 16px;transition:background .2s,color .2s}.btn-remezclar:hover{background:var(--tinta);color:var(--fondo)}.semilla{font:400 .72rem/1 var(--mono);color:var(--tinta-suave)}.capitulos{z-index:2;pointer-events:none;position:relative}.capitulo{align-items:center;min-height:100vh;padding:96px 24px 48px;display:flex}.tarjeta{pointer-events:auto;background:var(--papel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:4px;gap:12px;max-width:400px;padding:26px 28px;display:grid;box-shadow:0 20px 50px -30px #00000073}.tarjeta .num{font:500 .72rem/1 var(--mono);letter-spacing:.12em;color:var(--acento)}.tarjeta h2{font:300 2.1rem/1.05 var(--display);letter-spacing:-.01em;text-wrap:balance;margin:0}.capitulo:first-child .tarjeta h2{font-size:clamp(2.4rem,6vw,3.6rem)}.tarjeta p{color:var(--tinta-suave);margin:0}.tarjeta video{border-radius:3px;width:100%;display:block}.puntos{z-index:5;gap:10px;display:grid;position:fixed;top:50%;right:20px;transform:translateY(-50%)}.puntos button{cursor:pointer;border:1px solid var(--tinta);background:0 0;border-radius:50%;width:12px;height:12px;padding:0}.puntos button[aria-current=true]{background:var(--tinta)}.hotspots{z-index:3;pointer-events:none;position:fixed;inset:0}.hotspot{pointer-events:auto;cursor:pointer;opacity:0;background:0 0;border:0;align-items:center;gap:8px;padding:0;transition:opacity .4s;display:flex;position:absolute;transform:translate(-50%,-50%)}.hotspot.visible{opacity:1}.hotspot .anillo{background:var(--acento);width:26px;height:26px;box-shadow:0 0 0 0 var(--acento);border:3px solid #ffffffd9;border-radius:50%;animation:2.2s infinite pulso}.hotspot .etq{font:500 .78rem/1 var(--display);letter-spacing:.04em;background:var(--papel);color:var(--tinta);white-space:nowrap;border-radius:3px;padding:6px 10px}@keyframes pulso{70%{box-shadow:0 0 0 12px #0000}to{box-shadow:0 0 #0000}}.panel{z-index:6;background:var(--papel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:4px;width:min(340px,100vw - 48px);padding:22px 24px;position:fixed;bottom:24px;right:24px;box-shadow:0 20px 50px -25px #00000080}.panel h3{font:500 1.2rem/1.2 var(--display);margin:0 0 12px}.panel dl{grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:.95rem;display:grid}.panel dt{font:400 .75rem/1.6 var(--mono);color:var(--tinta-suave);text-transform:uppercase;letter-spacing:.06em}.panel dd{margin:0}.cerrar{cursor:pointer;color:var(--tinta);background:0 0;border:0;font-size:1.5rem;position:absolute;top:8px;right:12px}form.cotizar{gap:10px;display:grid}form.cotizar label{font:400 .75rem/1.2 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--tinta-suave);gap:4px;display:grid}form.cotizar input,form.cotizar textarea{font:400 1rem/1.3 var(--texto);color:var(--tinta);background:#fff;border:1px solid #0003;border-radius:3px;padding:9px 10px}form.cotizar button{font:500 .95rem/1 var(--display);letter-spacing:.06em;cursor:pointer;background:var(--acento);color:#fff;border:0;border-radius:3px;padding:13px}.resultado{gap:8px;display:grid}.resultado pre{max-height:260px;font:400 .72rem/1.45 var(--mono);color:#eae6dd;background:#1d1b18;border-radius:3px;margin:0;padding:12px;overflow:auto}.resultado p{font-size:.9rem}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--acento);outline-offset:2px}.grano{z-index:4;pointer-events:none;opacity:.07;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}@media (width<=720px){body{font-size:16px}.capitulo{align-items:flex-end;min-height:130vh;padding:70vh 16px 24px}.tarjeta{width:100%;max-width:none;padding:20px}.tarjeta h2{font-size:1.7rem}.puntos{right:8px}.demo,.semilla{display:none}.barra{padding-inline:16px}}@media (prefers-reduced-motion:reduce){.hotspot .anillo{animation:none}}