.czcp-app{--brand:#00353f;--border:#dce5e7;--muted:#64757a;color:#173238;font-family:inherit}.czcp-app *{box-sizing:border-box}.czcp-head{text-align:center;margin:0 0 28px}.czcp-eyebrow{margin:0 0 6px;color:var(--brand);font-weight:800;font-size:12px;letter-spacing:.12em}.czcp-head h2,.czcp-preview-head h3{margin:0 0 8px;color:var(--brand)}.czcp-head p{margin:0;color:var(--muted)}.czcp-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:24px}.czcp-workspace,.czcp-panel,.czcp-preview-section{border:1px solid var(--border);border-radius:18px;background:#fff}.czcp-workspace{padding:20px;min-height:520px}.czcp-panel{padding:20px}.czcp-upload{border:2px dashed #b8c8cc;border-radius:14px;padding:38px 20px;text-align:center;background:#f8fbfb}.czcp-upload.is-drag{border-color:var(--brand);background:#eef5f5}.czcp-upload p{margin:12px 0 4px}.czcp-upload small,.czcp-help,.czcp-preview-note,.czcp-option small{color:var(--muted)}.czcp-btn-primary,.czcp-btn-secondary,.czcp-view-buttons button{appearance:none;border-radius:10px;padding:11px 16px;font-weight:700;cursor:pointer}.czcp-btn-primary{border:1px solid var(--brand);background:var(--brand);color:#fff}.czcp-btn-primary:disabled{opacity:.5;cursor:not-allowed}.czcp-btn-secondary,.czcp-view-buttons button{border:1px solid var(--border);background:#fff;color:var(--brand)}.czcp-editor{margin-top:20px}.czcp-canvas-wrap{display:flex;justify-content:center;align-items:center;min-height:390px;background:#eef2f3;border-radius:14px;padding:22px;overflow:hidden}.czcp-canvas{position:relative;width:min(100%,560px);overflow:hidden;background:#fff;box-shadow:0 10px 35px rgba(0,0,0,.12);touch-action:none}.czcp-canvas>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;user-select:none;pointer-events:none;transform-origin:center}.czcp-safe-area{position:absolute;inset:5%;border:1px dashed rgba(255,255,255,.9);box-shadow:0 0 0 9999px rgba(0,0,0,.07);pointer-events:none}.czcp-safe-area span{position:absolute;left:8px;top:8px;background:rgba(0,53,63,.8);color:#fff;padding:4px 7px;border-radius:6px;font-size:11px}.czcp-help{font-size:13px;margin:10px 0 0;text-align:center}.czcp-panel-block{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--border)}.czcp-label,.czcp-field>span,fieldset legend{font-weight:700;color:var(--brand)}fieldset{border:0;padding:18px 0;margin:0}.czcp-option{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:12px;padding:12px;margin-top:10px}.czcp-option span{display:flex;flex-direction:column}.czcp-field{display:block;margin:0 0 16px}.czcp-field select,.czcp-field input[type=range]{width:100%;margin-top:8px}.czcp-field select{padding:11px;border:1px solid var(--border);border-radius:10px;background:#fff}.czcp-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.czcp-price-row{display:flex;justify-content:space-between;align-items:center;margin:24px 0 12px;padding-top:18px;border-top:1px solid var(--border)}.czcp-price-row strong{font-size:24px;color:var(--brand)}.czcp-add{width:100%}.czcp-status{min-height:22px;margin-top:10px;font-size:13px}.czcp-status.is-error{color:#b42318}.czcp-status.is-success{color:#18794e}.czcp-preview-section{margin-top:24px;padding:20px}.czcp-preview-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.czcp-view-buttons{display:flex;gap:8px}.czcp-view-buttons button.is-active{background:var(--brand);color:#fff;border-color:var(--brand)}.czcp-scene{height:470px;display:flex;align-items:center;justify-content:center;perspective:1100px;overflow:hidden}.czcp-canvas3d{--depth-px:24px;position:relative;width:min(62vw,540px,calc(420px * var(--canvas-ratio)));aspect-ratio:var(--canvas-ratio);transform-style:preserve-3d;transition:transform .5s ease}.czcp-canvas3d.view-left{transform:rotateX(-5deg) rotateY(28deg)}.czcp-canvas3d.view-right{transform:rotateX(-5deg) rotateY(-28deg)}.czcp-canvas3d.view-front{transform:rotateX(0) rotateY(0)}.czcp-face{position:absolute;backface-visibility:hidden;overflow:hidden;background:#ddd}.czcp-front{inset:-.5px;transform:translateZ(calc(var(--depth-px)/2));box-shadow:0 24px 45px rgba(0,0,0,.22)}.czcp-side-left{left:0;top:0;width:var(--depth-px);height:100%;transform-origin:left center;transform:rotateY(-90deg) translateX(calc(var(--depth-px)/-2))}.czcp-side-right{right:0;top:0;width:var(--depth-px);height:100%;transform-origin:right center;transform:rotateY(90deg) translateX(calc(var(--depth-px)/2))}.czcp-top{left:0;top:0;width:100%;height:var(--depth-px);transform-origin:center top;transform:rotateX(90deg) translateY(calc(var(--depth-px)/-2))}.czcp-bottom{left:0;bottom:0;width:100%;height:var(--depth-px);transform-origin:center bottom;transform:rotateX(-90deg) translateY(calc(var(--depth-px)/2))}.czcp-photo-surface{position:absolute;inset:0;background-repeat:no-repeat;background-position:center;background-size:cover}.mirror-left,.mirror-right,.mirror-top,.mirror-bottom{transform:none;background-position:center}.czcp-preview-note{text-align:center;margin:0;font-size:13px}.czcp-alert{padding:14px;border:1px solid #e5b7b7;background:#fff4f4;border-radius:10px}.woocommerce div.product form.cart:has(.czcp-app) .quantity,.woocommerce div.product form.cart:has(.czcp-app) .single_add_to_cart_button{display:none!important}



























@media(max-width:900px){.czcp-grid{grid-template-columns:1fr}.czcp-workspace{min-height:0}.czcp-scene{height:360px}.czcp-canvas3d{width:min(75vw,460px,calc(320px * var(--canvas-ratio)))}}



























@media(max-width:600px){.czcp-workspace,.czcp-panel,.czcp-preview-section{border-radius:12px;padding:14px}.czcp-preview-head{align-items:flex-start;flex-direction:column}.czcp-view-buttons{width:100%}.czcp-view-buttons button{flex:1;padding:9px}.czcp-scene{height:300px}.czcp-canvas3d{width:min(78vw,calc(260px * var(--canvas-ratio)))}.czcp-row{grid-template-columns:1fr}.czcp-canvas-wrap{min-height:300px;padding:12px}}























































.czcp-orientation-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.czcp-orientation-options .czcp-option{margin-top:10px;height:calc(100% - 10px)}



























@media(max-width:480px){.czcp-orientation-options{grid-template-columns:1fr}}























































/* v1.0.5: opciones de acabado lateral y visor 3D más compacto */



























.czcp-effect-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}



























.czcp-effect-options .czcp-option{margin-top:10px;height:calc(100% - 10px)}



























.czcp-safe-area{left:var(--safe-inset-x,5%);right:var(--safe-inset-x,5%);top:var(--safe-inset-y,5%);bottom:var(--safe-inset-y,5%);inset:auto}



























.czcp-scene{height:410px;padding:28px 24px}



























.czcp-canvas3d{width:min(50vw,430px,calc(350px * var(--canvas-ratio)));filter:drop-shadow(0 18px 22px rgba(0,0,0,.16))}



























.czcp-front{box-shadow:0 18px 34px rgba(0,0,0,.17)}



























.czcp-face{transition:background .25s ease,background-image .25s ease}



























@media(max-width:900px){.czcp-scene{height:330px}.czcp-canvas3d{width:min(66vw,390px,calc(290px * var(--canvas-ratio)))}}



























@media(max-width:600px){.czcp-effect-options{grid-template-columns:1fr}.czcp-scene{height:275px;padding:18px 8px}.czcp-canvas3d{width:min(70vw,calc(225px * var(--canvas-ratio)))}}























































/* v1.0.6: estado visible y cambio fiable de acabados laterales */



























.czcp-effect-options .czcp-option{cursor:pointer;transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease}



























.czcp-effect-options .czcp-option.is-selected{border-color:var(--brand);background:#f1f7f7;box-shadow:0 0 0 1px var(--brand)}



























.czcp-effect-options .czcp-option input{margin-top:3px}



























.czcp-photo-surface{transition:background-color .2s ease,opacity .2s ease}



















































































/* v1.0.7: geometría 3D real para que los cantos sean siempre visibles */



























.czcp-canvas3d{



























  transform-style:preserve-3d;



























  overflow:visible;



























}



























.czcp-face{



























  backface-visibility:visible;



























  -webkit-backface-visibility:visible;



























  transform-style:preserve-3d;



























}



























.czcp-front{



























  inset:0;



























  transform:translateZ(calc(var(--depth-px) / 2));



























  z-index:2;



























}



























.czcp-side-left{



























  left:0;



























  top:0;



























  width:var(--depth-px);



























  height:100%;



























  transform-origin:center center;



























  transform:translateX(-50%) rotateY(90deg);



























  z-index:1;



























}



























.czcp-side-right{



























  right:0;



























  top:0;



























  width:var(--depth-px);



























  height:100%;



























  transform-origin:center center;



























  transform:translateX(50%) rotateY(90deg);



























  z-index:1;



























}



























.czcp-top{



























  left:0;



























  top:0;



























  width:100%;



























  height:var(--depth-px);



























  transform-origin:center center;



























  transform:translateY(-50%) rotateX(90deg);



























  z-index:1;



























}



























.czcp-bottom{



























  left:0;



























  bottom:0;



























  width:100%;



























  height:var(--depth-px);



























  transform-origin:center center;



























  transform:translateY(50%) rotateX(90deg);



























  z-index:1;



























}



























.czcp-canvas3d.view-left{transform:rotateX(-6deg) rotateY(34deg)}



























.czcp-canvas3d.view-right{transform:rotateX(-6deg) rotateY(-34deg)}



























.czcp-canvas3d.view-front{transform:rotateX(0deg) rotateY(0deg)}



























.czcp-side-left,.czcp-side-right,.czcp-top,.czcp-bottom{



























  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);



























}



























.czcp-side-left .czcp-photo-surface,



























.czcp-side-right .czcp-photo-surface,



























.czcp-top .czcp-photo-surface,



























.czcp-bottom .czcp-photo-surface{



























  opacity:1!important;



























  visibility:visible!important;



























}



















































































/* v1.0.8: caras 3D sin aplanado y tamaño equilibrado del editor */



























.czcp-canvas3d{



























  filter:none!important;



























  transform-style:preserve-3d!important;



























  isolation:auto;



























}



























.czcp-face{



























  z-index:auto!important;



























  transform-style:preserve-3d!important;



























  backface-visibility:visible!important;



























  -webkit-backface-visibility:visible!important;



























}



























.czcp-front{



























  inset:0!important;



























  transform:translateZ(calc(var(--depth-px) / 2))!important;



























  box-shadow:0 18px 34px rgba(0,0,0,.17);



























}



























.czcp-side-left{



























  left:calc(var(--depth-px) / -2)!important;



























  right:auto!important;



























  top:0!important;



























  width:var(--depth-px)!important;



























  height:100%!important;



























  transform-origin:center center!important;



























  transform:rotateY(-90deg)!important;



























}



























.czcp-side-right{



























  right:calc(var(--depth-px) / -2)!important;



























  left:auto!important;



























  top:0!important;



























  width:var(--depth-px)!important;



























  height:100%!important;



























  transform-origin:center center!important;



























  transform:rotateY(90deg)!important;



























}



























.czcp-top{



























  left:0!important;



























  top:calc(var(--depth-px) / -2)!important;



























  width:100%!important;



























  height:var(--depth-px)!important;



























  transform-origin:center center!important;



























  transform:rotateX(90deg)!important;



























}



























.czcp-bottom{



























  left:0!important;



























  bottom:calc(var(--depth-px) / -2)!important;



























  width:100%!important;



























  height:var(--depth-px)!important;



























  transform-origin:center center!important;



























  transform:rotateX(-90deg)!important;



























}



























.czcp-canvas3d.view-left{transform:rotateX(-5deg) rotateY(40deg)!important}



























.czcp-canvas3d.view-right{transform:rotateX(-5deg) rotateY(-40deg)!important}



























.czcp-canvas3d.view-front{transform:rotateX(0deg) rotateY(0deg)!important}



























.czcp-side-left,.czcp-side-right,.czcp-top,.czcp-bottom{



























  outline:1px solid rgba(0,0,0,.08);



























  box-shadow:inset 0 0 10px rgba(0,0,0,.12);



























}



























.czcp-photo-surface{



























  width:100%!important;



























  height:100%!important;



























  opacity:1!important;



























  visibility:visible!important;



























}



























/* Recupera un tamaño cómodo sin desbordar ni comprimir la fotografía. */



























.czcp-scene{height:430px!important;padding:34px 28px!important;overflow:visible!important}



























.czcp-canvas3d{width:min(54vw,460px,calc(375px * var(--canvas-ratio)))!important}



























.czcp-canvas-wrap{overflow:hidden!important}



























.czcp-canvas>img{min-width:100%;min-height:100%}



























@media(max-width:900px){



























  .czcp-scene{height:350px!important;padding:26px 16px!important}



























  .czcp-canvas3d{width:min(68vw,410px,calc(305px * var(--canvas-ratio)))!important}



























}



























@media(max-width:600px){



























  .czcp-scene{height:290px!important;padding:20px 8px!important}



























  .czcp-canvas3d{width:min(72vw,calc(235px * var(--canvas-ratio)))!important}



























}



















































































/* v2.0.0 — guías de producción independientes y siempre visibles */



























.czcp-canvas{position:relative;isolation:isolate}



























.czcp-canvas>img{position:absolute;inset:0;z-index:1}



























.czcp-guide{position:absolute;pointer-events:none;z-index:8;box-sizing:border-box}



























.czcp-guide span{position:absolute;left:8px;top:8px;padding:4px 7px;border-radius:6px;font-size:11px;font-weight:700;line-height:1.25;white-space:nowrap}



























.czcp-guide-front{inset:0;border:2px solid rgba(255,255,255,.95);box-shadow:inset 0 0 0 1px rgba(0,53,63,.45)}



























.czcp-guide-front span{background:rgba(0,53,63,.88);color:#fff}



























.czcp-guide-side{left:var(--side-inset-x,6.66%);right:var(--side-inset-x,6.66%);top:var(--side-inset-y,5%);bottom:var(--side-inset-y,5%);border:2px dashed rgba(255,184,0,.98);z-index:9}



























.czcp-guide-side span{top:auto;bottom:8px;background:rgba(255,184,0,.94);color:#172127}



























.czcp-guide-safe{left:var(--safe-inset-x,11.66%);right:var(--safe-inset-x,11.66%);top:var(--safe-inset-y,8.75%);bottom:var(--safe-inset-y,8.75%);border:2px dashed rgba(255,255,255,.95);box-shadow:0 0 0 1px rgba(0,53,63,.65);z-index:10}



























.czcp-guide-safe span{left:auto;right:8px;background:rgba(255,255,255,.94);color:#00353f;box-shadow:0 1px 4px rgba(0,0,0,.15)}



























/* En imagen envolvente, la línea amarilla delimita el frontal real. */



























.czcp-canvas[data-effect="wrap"] .czcp-guide-side{border-style:solid}



























/* Oculta la guía antigua si una caché mezcla HTML/CSS de versiones previas. */



























.czcp-safe-area{display:none!important}



























@media(max-width:600px){



























  .czcp-guide span{font-size:9px;padding:3px 5px;left:5px;top:5px}



























  .czcp-guide-side span{top:auto;bottom:5px}



























  .czcp-guide-safe span{left:auto;right:5px}



























}























































/* v2.0.1 — las guías coinciden con la composición real del visor 3D */



























.czcp-canvas:not([data-effect="wrap"]) .czcp-guide-side{



























  display:none!important;



























}



























.czcp-canvas[data-effect="wrap"] .czcp-guide-front{



























  border-color:rgba(255,255,255,.96);



























}



























.czcp-canvas[data-effect="wrap"] .czcp-guide-side{



























  display:block!important;



























  border-style:solid!important;



























}



















































































/* v2.0.2 — guía frontal única para todos los acabados laterales */



























.czcp-guide-front{



























  inset:5%!important;



























  border:1px dashed rgba(255,255,255,.96)!important;



























  box-shadow:0 0 0 1px rgba(0,53,63,.22)!important;



























  z-index:10!important;



























}



























.czcp-guide-front span{



























  left:8px!important;



























  top:8px!important;



























  background:rgba(0,53,63,.88)!important;



























  color:#fff!important;



























}



























.czcp-guide-side,.czcp-guide-safe{display:none!important;}























































/* v3.0.0 — flujo guiado paso a paso */



























.czcp-flow-app{width:100%;max-width:1400px;margin:0 auto;display:grid;gap:18px;padding-left:20px;padding-right:20px;box-sizing:border-box}.czcp-flow-head{text-align:center;margin-bottom:2px}.czcp-progress{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;padding:12px;border:1px solid var(--line,#d8e2e4);border-radius:16px;background:#fff;position:sticky;top:10px;z-index:20}.czcp-progress span{display:flex;align-items:center;justify-content:center;gap:7px;color:#607177;font-size:12px;font-weight:700;text-align:center}.czcp-progress b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#edf2f3;color:#00353f}.czcp-progress .is-active{color:#00353f}.czcp-progress .is-active b{background:#00353f;color:#fff}.czcp-step{border:1px solid #d7e1e3;border-radius:18px;background:#fff;padding:22px}.czcp-step-title{display:flex;align-items:flex-start;gap:13px;margin-bottom:18px}.czcp-step-title>span{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:#00353f;color:#fff;font-weight:800}.czcp-step-title h3{margin:0 0 4px;font-size:20px}.czcp-step-title p{margin:0;color:#63767c}.czcp-step-body{display:grid;gap:14px}.czcp-measure-layout{grid-template-columns:minmax(220px,1fr) minmax(180px,.7fr) minmax(320px,1.4fr);align-items:end}.czcp-inline-fieldset{margin:0}.czcp-depth-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.czcp-depth-card span{display:grid;grid-template-columns:70px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:14px}.czcp-depth-demo{grid-row:1/3;display:block;width:60px;height:54px;border:1px solid #b8c6c9;background:linear-gradient(90deg,#ece7dc,#fff);box-shadow:inset -8px 0 12px rgba(0,0,0,.08)}.czcp-depth-demo.is-thin{border-right-width:9px}.czcp-depth-demo.is-thick{border-right-width:20px}.czcp-upload-large{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center}.czcp-upload-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#eaf2f3;color:#00353f;font-size:30px;margin-bottom:12px}.czcp-effect-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.czcp-effect-cards .czcp-option span{display:flex;flex-direction:column}.czcp-effect-swatch{height:58px;border-radius:8px;border:1px solid #cbd7da;margin-bottom:9px;background:#f4f6f7}.czcp-effect-swatch.mirror{background:linear-gradient(90deg,#8ca4a7 0 25%,#dce5e6 25% 50%,#dce5e6 50% 75%,#8ca4a7 75%)}.czcp-effect-swatch.wrap{background:linear-gradient(120deg,#6f8a74,#c6b183)}.czcp-effect-swatch.white{background:#fff}.czcp-effect-swatch.black{background:#111}.czcp-adjust-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;align-items:end}.czcp-adjust-grid .czcp-row{margin:0}.czcp-editor-step .czcp-workspace{padding:0;border:0;min-height:0}.czcp-editor-placeholder{display:grid;place-items:center;min-height:220px;border:1px dashed #b9c9cc;border-radius:14px;background:#f6f9f9;color:#607177;text-align:center;padding:24px}.czcp-preview-section{margin:0}.czcp-preview-section .czcp-step-title{margin-bottom:0}.czcp-summary-step{background:#f6f9f9}.czcp-summary-card{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}.czcp-summary-card>div{padding:13px;border:1px solid #d7e1e3;border-radius:12px;background:#fff}.czcp-summary-card>div span{display:block;font-size:12px;color:#64777d;margin-bottom:4px}.czcp-summary-card .czcp-price-row{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between}.czcp-summary-card .czcp-add,.czcp-summary-card .czcp-status{grid-column:1/-1}.czcp-summary-card .czcp-add{min-height:52px;font-size:16px}.czcp-editor:not([hidden]) + .czcp-editor-placeholder{display:none}



























@media(max-width:900px){.czcp-progress{position:static;grid-template-columns:repeat(4,1fr)}.czcp-measure-layout,.czcp-adjust-grid{grid-template-columns:1fr}.czcp-effect-cards{grid-template-columns:repeat(2,1fr)}.czcp-summary-card{grid-template-columns:repeat(2,1fr)}}



























@media(max-width:600px){.czcp-progress{grid-template-columns:repeat(2,1fr)}.czcp-progress span{justify-content:flex-start}.czcp-step{padding:16px;border-radius:14px}.czcp-depth-options,.czcp-effect-cards,.czcp-summary-card{grid-template-columns:1fr}.czcp-summary-card .czcp-price-row,.czcp-summary-card .czcp-add,.czcp-summary-card .czcp-status{grid-column:1}.czcp-step-title h3{font-size:18px}}



















































































/* v3.0.1 — controles de ajuste integrados debajo del encuadre */



























.czcp-editor-controls{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(220px,.8fr) minmax(260px,.8fr);gap:16px;align-items:end;margin-top:18px;padding:18px;border:1px solid #d7e1e3;border-radius:14px;background:#f7f9f9}



























.czcp-editor-controls .czcp-field{margin:0}



























.czcp-editor-controls .czcp-row{margin:0}



























.czcp-editor-controls input[type=range]{min-height:38px}



























@media(max-width:900px){.czcp-editor-controls{grid-template-columns:1fr 1fr}.czcp-editor-controls .czcp-zoom-field{grid-column:1/-1}}



























@media(max-width:600px){.czcp-editor-controls{grid-template-columns:1fr;padding:14px;margin-top:14px}.czcp-editor-controls .czcp-zoom-field{grid-column:auto}.czcp-editor-controls .czcp-row{grid-template-columns:1fr 1fr}.czcp-editor-step .czcp-workspace{padding:0}.czcp-canvas-wrap{border-radius:12px}}



















































































/* v3.0.2 — acabados laterales situados debajo del visualizador 3D */



























.czcp-effects-after-preview{scroll-margin-top:24px}



























.czcp-effects-after-preview .czcp-step-title{margin-bottom:16px}



























.czcp-effects-after-preview .czcp-effects-fieldset{margin:0}



























@media(max-width:600px){



























  .czcp-effects-after-preview .czcp-effect-cards{grid-template-columns:repeat(2,minmax(0,1fr))}



























  .czcp-effects-after-preview .czcp-option span{min-height:132px}



























}



















































































/* v3.0.5 — Foto completa real al cambiar orientación, también en móvil */



























.czcp-canvas>img{



























  min-width:0!important;



























  min-height:0!important;



























  max-width:none!important;



























  max-height:none!important;



























}



























@media(max-width:600px){



























  .czcp-canvas>img{min-width:0!important;min-height:0!important}



























}



















































































/* v3.0.6 — compatibilidad con Divi/LiteSpeed y controles interactivos */



























.czcp-app{position:relative;z-index:1;pointer-events:auto!important}



























.czcp-app button,.czcp-app select,.czcp-app input,.czcp-app label{pointer-events:auto!important}



























.czcp-app .czcp-step,.czcp-app .czcp-progress{isolation:isolate}























































/* v3.2.0 — motor de encuadre sin object-fit: la fotografía permanece completa



























   detrás del marco y el excedente se oculta únicamente con overflow:hidden. */



























.czcp-canvas{overflow:hidden!important}



























.czcp-canvas>img{



























  inset:auto!important;



























  min-width:0!important;



























  min-height:0!important;



























  max-width:none!important;



























  max-height:none!important;



























  object-fit:fill!important;



























  will-change:transform,width,height,left,top;



























}























































/* v3.2.1 — editor y visor 3D comparten el mismo frame renderizado */



























.czcp-editor-surface{



























  position:absolute;



























  inset:0;



























  z-index:1;



























  display:block;



























  width:100%;



























  height:100%;



























  pointer-events:none;



























}



























.czcp-canvas>#czcp-image{display:none!important}



















































































/* v3.3.0 — seis vistas del lienzo y control de calidad */



























.czcp-view-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));max-width:430px;width:100%}



























.czcp-view-buttons button{min-width:0;white-space:nowrap}



























.czcp-canvas3d.view-top{transform:rotateX(-68deg) rotateY(0deg)!important}



























.czcp-canvas3d.view-bottom{transform:rotateX(68deg) rotateY(0deg)!important}



























.czcp-canvas3d.view-back{transform:rotateX(-4deg) rotateY(180deg)!important}



























.czcp-back{inset:-.5px;transform:rotateY(180deg) translateZ(calc(var(--depth-px)/2));background:#eee7dc!important;box-shadow:0 20px 38px rgba(0,0,0,.18)}



























.czcp-back-frame{position:absolute;inset:5%;background:transparent;border:clamp(14px,4.2vw,34px) solid #d2ad78;box-shadow:inset 0 0 0 1px rgba(91,58,24,.28),0 0 0 1px rgba(255,255,255,.45)}



























.czcp-back-frame:before{content:"";position:absolute;inset:calc(clamp(14px,4.2vw,34px) * -1);pointer-events:none;background:repeating-linear-gradient(8deg,rgba(105,67,28,.10) 0 1px,transparent 1px 8px);mix-blend-mode:multiply;opacity:.55}



























.czcp-back-frame:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 16px rgba(91,58,24,.12);pointer-events:none}



























.czcp-quality{margin:14px auto 0;max-width:560px;display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--border);border-radius:12px;background:#f7faf9}



























.czcp-quality[hidden]{display:none!important}



























.czcp-quality-dot{width:12px;height:12px;border-radius:50%;background:#b42318;flex:0 0 12px}



























.czcp-quality div{display:flex;flex-direction:column;gap:2px}



























.czcp-quality strong{color:var(--brand)}



























.czcp-quality small{color:var(--muted)}



























.czcp-quality[data-level="excellent"] .czcp-quality-dot{background:#16803b}



























.czcp-quality[data-level="good"] .czcp-quality-dot{background:#5b8c00}



























.czcp-quality[data-level="fair"] .czcp-quality-dot{background:#d79b00}



























.czcp-quality[data-level="low"] .czcp-quality-dot{background:#b42318}



























@media(max-width:600px){.czcp-view-buttons{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}.czcp-view-buttons button{font-size:13px}.czcp-quality{align-items:flex-start}}



















































































/* v3.3.2 — rotación manual del visualizador 3D con ratón o gesto táctil */



























.czcp-canvas3d{



























  cursor:grab;



























  touch-action:none;



























  user-select:none;



























  will-change:transform;



























  outline:none;



























}



























.czcp-canvas3d:active,



























.czcp-canvas3d.is-dragging{



























  cursor:grabbing;



























  transition:none!important;



























}



























.czcp-canvas3d:focus-visible{



























  outline:3px solid rgba(0,53,63,.32);



























  outline-offset:8px;



























}



























.czcp-scene{



























  touch-action:pan-y;



























}



















































































/* v1.0.6: controles +/- de zoom del lienzo */



























.czcp-zoom-control{display:grid;grid-template-columns:42px minmax(120px,1fr) 42px;gap:8px;align-items:center;margin-top:7px}



























.czcp-zoom-control input[type=range]{width:100%;margin:0}



























.czcp-zoom-control button{width:42px;height:42px;padding:0;border:1px solid #bfcfd2;border-radius:9px;background:#fff;color:#00353f;font-size:22px;font-weight:800;line-height:1;cursor:pointer}



























.czcp-zoom-control button:hover{background:#eef6f7;border-color:#00353f}



























.czcp-zoom-control button:active{transform:translateY(1px)}



























@media(max-width:600px){.czcp-zoom-control{grid-template-columns:40px minmax(0,1fr) 40px}.czcp-zoom-control button{width:40px;height:40px}}























































/* v1.0.8: ancho de Lienzos igualado a Pósters (máximo 1400 px). */



























@media(max-width:900px){.czcp-flow-app{padding-left:16px;padding-right:16px}}



























@media(max-width:600px){.czcp-flow-app{padding-left:12px;padding-right:12px}}































/* v3.0.15: plegado 3D real para Foto en laterales. Las caras opuestas



   giran en sentidos opuestos para que la arista comparta el mismo píxel



   del desplegable continuo, sin estirar ni invertir el canto. */