*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f7f4f1;color:#302a27}header{text-align:center;padding:24px 16px 12px}header h1{margin:0 0 6px}.layout{max-width:1180px;margin:auto;padding:20px;display:grid;grid-template-columns:minmax(300px,520px) 1fr;gap:28px}.preview-card,.step,.summary{background:#fff;border-radius:18px;padding:18px;box-shadow:0 3px 16px #00000012}.preview-card{position:sticky;top:18px;height:max-content}.preview-frame{position:relative;width:100%;overflow:hidden;background:#eee;border-radius:8px;isolation:isolate}.layer{position:absolute;inset:0;width:100%;height:100%;display:block}.tela{z-index:1;object-fit:cover}.inner-preview{position:absolute;z-index:2;left:12%;right:12%;top:10%;bottom:10%;display:flex;align-items:center;justify-content:center;overflow:hidden}.virgen{width:72%;height:72%;object-fit:contain;display:block}.marco{z-index:10;object-fit:fill;pointer-events:none;position:absolute;inset:0;width:100%;height:100%;display:block}.nombre{position:absolute;z-index:9;left:50%;bottom:4%;transform:translateX(-50%);font-size:clamp(15px,3.2vw,28px);font-weight:bold;letter-spacing:1.5px;color:white;text-shadow:0 1px 2px #333;white-space:nowrap}.options{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:10px}.option{border:2px solid #e7e0db;background:#fff;border-radius:12px;padding:8px;cursor:pointer;text-align:center;color:#302a27}.option.selected{border-color:#6f5545}.option img{width:100%;height:105px;object-fit:contain;border-radius:8px;background:#f8f6f4;display:block;margin-bottom:7px}.option.fabric img{object-fit:cover}.option span{display:block;font-size:12px;line-height:1.25;min-height:30px}.option b{display:block;margin-top:5px}.check{display:flex;gap:9px;align-items:center;margin-bottom:10px;font-weight:600}select,input{width:100%;padding:11px;border:1px solid #d8cec7;border-radius:10px;background:#fff;font-size:15px}.total{display:flex;justify-content:space-between;padding-top:15px;font-size:18px}.total strong{font-size:25px}#whatsapp{margin-top:16px;width:100%;padding:13px;border:0;border-radius:11px;background:#2e8b57;color:white;font-size:16px;font-weight:bold}.summary p{display:flex;justify-content:space-between;border-bottom:1px solid #eee;padding:8px 0;margin:0;font-size:14px}.nota{font-size:12px;color:#81766e}@media(max-width:850px){.layout{grid-template-columns:1fr;padding:12px}.preview-card{position:static}.options{grid-template-columns:repeat(2,minmax(0,1fr))}}
.aviso-importante{margin:0 auto 18px;max-width:900px;padding:12px 16px;border-radius:10px;background:#fff8e8;border:1px solid #ead7aa;color:#5d4b25;text-align:center;font-size:14px;line-height:1.45}

.ejemplos-card{max-width:1180px;margin:18px auto 0;padding:18px 20px;background:#fff;border-radius:18px;box-shadow:0 3px 16px #00000012}.ejemplos-card h2{margin:0;text-align:center;font-size:24px}.ejemplos-subtitulo{text-align:center;margin:5px 0 15px;color:#81766e;font-size:14px}.ejemplos-wrap{position:relative;display:flex;align-items:center;gap:8px}.ejemplos-carrusel{display:flex;gap:14px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding:4px 2px 10px;flex:1;scrollbar-width:thin}.ejemplo-foto{flex:0 0 245px;width:245px;height:180px;object-fit:cover;border-radius:14px;scroll-snap-align:start;box-shadow:0 2px 10px #00000018;background:#f7f4f1}.ejemplo-flecha{flex:0 0 40px;width:40px;height:40px;border:0;border-radius:50%;background:#6f5545;color:#fff;font-size:30px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}.sin-ejemplos{text-align:center;margin:8px 0 0;color:#81766e;font-size:13px}@media(max-width:850px){.ejemplos-card{margin:12px;padding:16px 12px}.ejemplo-foto{flex-basis:210px;width:210px;height:155px}.ejemplo-flecha{flex-basis:34px;width:34px;height:34px;font-size:25px}}
.ejemplos-carrusel{overflow-x:auto;overflow-y:hidden;scroll-behavior:auto;cursor:grab}
.ejemplos-carrusel:active{cursor:grabbing}
.ejemplo-modal{position:fixed;inset:0;z-index:1000;background:#000000cc;display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}.ejemplo-modal[hidden]{display:none}.ejemplo-modal img{max-width:94vw;max-height:92vh;width:auto;height:auto;object-fit:contain;border-radius:10px;box-shadow:0 8px 35px #00000055;background:#fff;cursor:default}.ejemplo-modal-cerrar{position:absolute;top:12px;right:16px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:#302a27;font-size:32px;line-height:1;cursor:pointer;z-index:1001}.modal-abierto{overflow:hidden}