/* Promotional screenshots: same adjustable visual treatment in the admin and homepage. */
.promo-express{border:1px solid #e1ddd7;border-radius:18px;padding:20px;margin:22px 0;background:#faf8f4}
.promo-express-header{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:17px}.promo-express-header strong{display:block;font-size:1.08rem}.promo-express-header small{display:block;color:#65717f;margin-top:5px;line-height:1.5}.promo-express-header [data-promo-message]{font-size:.85rem;color:#87611f}
.promo-express-layout{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:24px;align-items:start}.promo-express-controls{display:grid;gap:13px;min-width:0}.promo-express-controls .kp-field{margin:0}.promo-express-drop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;border:1px dashed #b8ab97;border-radius:12px;padding:12px;background:white;font-size:.86rem;cursor:pointer}.promo-express-drop.is-over{background:#f7e9ce;border-color:#b88031}.promo-express-drop .kp-btn{padding:8px 11px}
.promo-express-preset{display:grid;gap:5px}.promo-express-preset select{max-width:100%}.promo-express-range{display:grid;gap:5px}.promo-express-range label{display:flex;justify-content:space-between;gap:10px;font-size:.88rem;font-weight:600}.promo-express-range input{width:100%;accent-color:#1b2a3a}.promo-express-range output{color:#697583}.promo-express-toggle{display:flex;align-items:center;gap:10px;font-weight:600}.promo-express-toggle input{width:20px;height:20px;accent-color:#1b2a3a}.promo-express-hint{margin:0;font-size:.82rem;color:#697583;line-height:1.45}
.promo-express-preview{min-width:0}.promo-express-stage{height:340px;min-height:230px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px;background:radial-gradient(circle at 80% 10%,#ecd6b5,#f1ebe2 50%,#e9e2d8)}.promo-express-art{position:relative;max-width:84%;max-height:80%;transform:rotate(var(--promo-rotation,0deg)) scale(var(--promo-scale,1));filter:drop-shadow(0 calc(var(--promo-shadow,18px) * .45) var(--promo-shadow,18px) rgba(27,42,58,.25));cursor:crosshair;touch-action:none}.promo-express-art>img{max-width:100%;max-height:270px;display:block;border-radius:var(--promo-round,12px);pointer-events:none}.promo-express-highlight,.kp-express-mark{position:absolute;box-sizing:border-box;left:var(--promo-hx,25%);top:var(--promo-hy,25%);width:var(--promo-hw,45%);height:var(--promo-hh,35%);border:3px solid #d4a65a;box-shadow:0 0 0 999px rgba(27,42,58,.10),0 0 0 2px rgba(255,255,255,.75);border-radius:7px;pointer-events:none}.promo-express-empty{color:#6c7580;padding:20px;text-align:center}.promo-express-preview>.promo-express-hint{margin-top:8px}
.kp-express-view{overflow:hidden;display:flex;align-items:center;justify-content:center;background:#f1ebe3}.kp-express-art{position:relative;max-width:86%;max-height:88%;transform:rotate(var(--promo-rotation,0deg)) scale(var(--promo-scale,1));filter:drop-shadow(0 calc(var(--promo-shadow,18px) * .45) var(--promo-shadow,18px) rgba(27,42,58,.27))}.kp-express-art>img{display:block;max-width:100%;max-height:310px;object-fit:contain;border-radius:var(--promo-round,12px)}.kp-promo-card-visual{height:190px}.kp-promo-card-visual img{max-height:155px}.kp-promo-picture{min-height:245px}.kp-express-mark{border-width:2px}.kp-promo-card>.kp-promo-card-visual{width:100%}
@media(max-width:820px){.promo-express-layout{grid-template-columns:1fr}.promo-express-stage{height:275px}}

/* Five layouts share the same source image; crop and pan are non-destructive. */
.promo-express-stage,.kp-express-view{position:relative;isolation:isolate}
.promo-express-art,.kp-express-art{z-index:1}
.promo-express-art>img,.kp-express-art>img{object-position:var(--promo-x,50%) var(--promo-y,50%);object-fit:var(--promo-fit,contain)}
.kp-promo-decor{display:none;pointer-events:none}
/* Edge-to-edge screenshot: the container clips the image rather than editing the file. */
.kp-promo-layout-cover{background:#1b2a3a!important}
.kp-promo-layout-cover>.promo-express-art,.kp-promo-layout-cover>.kp-express-art{position:absolute;inset:0;max-width:none;max-height:none;width:100%;height:100%;transform:rotate(var(--promo-rotation,0deg)) scale(var(--promo-scale,1));filter:none}
.kp-promo-layout-cover>.promo-express-art>img,.kp-promo-layout-cover>.kp-express-art>img{width:100%;height:100%;max-width:none;max-height:none;border-radius:0;object-fit:cover}
/* A second card is a visual copy of the source; no second upload needed. */
.kp-promo-layout-double>.kp-promo-decor{display:block;position:absolute;z-index:0;width:51%;height:61%;left:12%;top:16%;border:7px solid #fff;border-radius:12px;background:#decfbb;box-shadow:0 20px 35px #18283833;transform:rotate(-12deg)}
.kp-promo-layout-double>.promo-express-art,.kp-promo-layout-double>.kp-express-art{transform:translateX(15%) rotate(var(--promo-rotation,-3deg)) scale(calc(var(--promo-scale,1) * .82))}
/* Magnified crop: a second visual treatment, still derived from the same image. */
.kp-promo-layout-detail>.promo-express-art,.kp-promo-layout-detail>.kp-express-art{max-width:72%;transform:translateX(-10%) rotate(var(--promo-rotation,-2deg)) scale(calc(var(--promo-scale,1) * .85))}
.kp-promo-layout-detail>.kp-promo-decor{display:block;position:absolute;z-index:2;right:6%;bottom:8%;width:36%;height:48%;border:5px solid #fff;border-radius:12px;background:linear-gradient(135deg,#e8d2ac,#fff9ef);box-shadow:0 14px 30px #18283844;transform:rotate(5deg)}
.promo-express-range select{width:100%}
@media(max-width:540px){.kp-promo-layout-detail>.kp-promo-decor{width:34%;height:36%}}

.kp-promo-decor img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--promo-x,50%) var(--promo-y,50%);border-radius:inherit}
.kp-promo-layout-detail>.kp-promo-decor img{object-fit:cover;transform:scale(1.65);transform-origin:var(--promo-x,50%) var(--promo-y,50%)}
.kp-promo-layout-double>.kp-promo-decor{overflow:hidden}
.kp-promo-layout-detail>.kp-promo-decor{overflow:hidden}

/* Hero canvas: identical markup and geometry in the authoring preview and homepage. */
.promo-express-hero-settings{display:grid;gap:8px;margin:0 0 14px;padding:13px;border:1px solid #e4d8c7;border-radius:13px;background:#fffaf3}
.promo-express-hero-settings label{font-size:.84rem;font-weight:700}.promo-express-hero-settings input,.promo-express-hero-settings select{width:100%}
.promo-express-card-details{margin-top:18px}.promo-express-card-details>summary{cursor:pointer;font-weight:700;margin-bottom:10px}
.kp-hero-canvas{position:relative!important;isolation:isolate;display:flex!important;align-items:center;overflow:hidden;border-radius:24px;background:#f7f0e5;min-height:430px;padding:clamp(24px,5vw,70px)!important;box-sizing:border-box}
.kp-hero-canvas[hidden]{display:none!important}
.kp-hero-canvas .kp-hero-image{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.kp-hero-canvas .kp-hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--promo-x,50%) var(--promo-y,50%);transform:rotate(var(--promo-rotation,0deg)) scale(calc(var(--hero-cover-fill,1) * var(--hero-zoom,1)));transform-origin:center center;}
.kp-hero-canvas .kp-hero-wash{position:absolute;inset:0;z-index:1;pointer-events:none}
.kp-hero-canvas .kp-hero-copy{position:relative;z-index:2;width:min(53%,670px);box-sizing:border-box}
.kp-hero-canvas .kp-hero-copy h3{font-size:clamp(28px,4.1vw,60px);line-height:1.1;margin:8px 0 22px;color:#192a3c}
.kp-hero-canvas .kp-hero-copy p:not(.kp-kicker){color:#43556a;line-height:1.5}
.kp-hero-canvas.kp-hero-text-right{justify-content:flex-end}
.kp-hero-canvas.kp-hero-fade .kp-hero-wash{background:linear-gradient(90deg,#f7f0e5 0%,rgba(247,240,229,var(--hero-blend,.75)) 43%,rgba(247,240,229,0) 100%)}
.kp-hero-canvas.kp-hero-fade.kp-hero-text-right .kp-hero-wash{background:linear-gradient(270deg,#f7f0e5 0%,rgba(247,240,229,var(--hero-blend,.75)) 43%,rgba(247,240,229,0) 100%)}
.kp-hero-canvas.kp-hero-full .kp-hero-wash{background:rgba(247,240,229,var(--hero-blend,.75))}
.kp-hero-canvas.kp-hero-split .kp-hero-image{left:50%}
.kp-hero-canvas.kp-hero-split.kp-hero-text-right .kp-hero-image{left:0;right:50%}
.kp-hero-canvas.kp-hero-split .kp-hero-wash{background:linear-gradient(90deg,#f7f0e5 0%,#f7f0e5 47%,transparent 56%)}
.kp-hero-canvas.kp-hero-split.kp-hero-text-right .kp-hero-wash{background:linear-gradient(270deg,#f7f0e5 0%,#f7f0e5 47%,transparent 56%)}
.kp-hero-canvas.kp-hero-floating .kp-hero-image{inset:15% 5% 15% 53%;overflow:visible}
.kp-hero-canvas.kp-hero-floating.kp-hero-text-right .kp-hero-image{inset:15% 53% 15% 5%}
.kp-hero-canvas.kp-hero-floating .kp-hero-image img{object-fit:contain;border-radius:var(--promo-round,12px);transform:rotate(var(--promo-rotation,0deg)) scale(calc(var(--promo-scale,1) * var(--hero-zoom,1)));filter:drop-shadow(0 20px 20px #1b2a3a44)}
.kp-hero-canvas.kp-hero-floating .kp-hero-wash{display:none}
.promo-express-preview .kp-hero-canvas{min-height:300px;padding:22px!important;border-radius:16px}
.promo-express-preview .kp-hero-canvas .kp-hero-copy h3{font-size:clamp(19px,2.5vw,32px)}
.promo-express-preview .kp-hero-canvas .kp-hero-copy p{font-size:13px}
.promo-express-preview .kp-hero-canvas .kp-hero-copy .kp-btn{font-size:12px;padding:9px 12px}
@media(max-width:680px){.kp-hero-canvas{min-height:350px;padding:24px!important}.kp-hero-canvas .kp-hero-copy{width:75%}.kp-hero-canvas.kp-hero-split .kp-hero-copy{width:52%}}
