.patternpaste-designed-compare{--ppx-ground:var(--pp-ground);--ppx-ink:var(--pp-ink);--ppx-label:var(--pp-label);--ppx-rule:var(--pp-rule);--ppx-primary:var(--pp-primary);--ppx-primary-ink:var(--pp-primary-ink);--ppx-plate:var(--pp-plate);--ppx-plate-ink:var(--pp-plate-ink);overflow:hidden}
.patternpaste-designed-compare[data-treatment="designed"]{--ppx-ground:#eee6d6;--ppx-ink:#171b19;--ppx-label:#b14322;--ppx-rule:#615e55;--ppx-primary:#ef5b2f;--ppx-primary-ink:#171b19;--ppx-plate:#171b19;--ppx-plate-ink:#f8f1e4}.patternpaste-designed-compare[data-treatment="designed"]:not([class*="-font-family"]){font-family:Arial,Helvetica,sans-serif}
.patternpaste-designed-compare[data-treatment="designed"]:not(.has-text-color){color:var(--ppx-ink)}.patternpaste-designed-compare[data-treatment="designed"]:not(.has-background){background:var(--ppx-ground)}
.patternpaste-designed-compare[data-treatment="inherit"]:not([class*="is-style-"]):not(.has-text-color){color:inherit}.patternpaste-designed-compare[data-treatment="inherit"]:not([class*="is-style-"]):not(.has-background){background:transparent}
.patternpaste-designed-compare .patternpaste-designed-layout{max-width:var(--wp--style--global--wide-size,1440px)}
.patternpaste-designed-compare :where(.patternpaste-compare-intro,.patternpaste-compare-label,.patternpaste-compare-foot) :where(h2,h3,p):not(.has-text-color){color:inherit}
.patternpaste-compare-intro{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.62fr);gap:var(--patternpaste-designed-block-gap,clamp(30px,7cqi,108px));align-items:end;padding-bottom:clamp(40px,6cqi,86px)}.patternpaste-compare-intro:not(.has-text-color){color:inherit}
.patternpaste-compare-heading-wrap{display:grid;gap:18px}.patternpaste-compare-kicker:not([class*="-font-size"]),.patternpaste-compare-foot-label:not([class*="-font-size"]),.patternpaste-compare-footnote:not([class*="-font-size"]),.patternpaste-compare-label p:not([class*="-font-size"]){font-size:11px;line-height:1.4;letter-spacing:.14em}.patternpaste-designed-compare[data-treatment="designed"] :where(.patternpaste-compare-kicker,.patternpaste-compare-foot-label,.patternpaste-compare-footnote){font-weight:750}.patternpaste-designed-compare[data-treatment="designed"] :where(.patternpaste-compare-kicker,.patternpaste-compare-foot-label):not(.has-text-color){color:var(--ppx-label)}
.patternpaste-compare-heading{max-width:12ch}.patternpaste-compare-heading:not([class*="-font-size"]){font-size:clamp(58px,8.3cqi,124px);line-height:.82;letter-spacing:-.07em}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-heading:not([class*="-font-family"]){font-family:Arial Narrow,Arial,Helvetica,sans-serif;font-stretch:condensed;font-weight:800}
.patternpaste-compare-summary{display:grid;gap:28px}.patternpaste-compare-lede{max-width:34ch}.patternpaste-compare-lede:not([class*="-font-size"]){font-size:clamp(16px,1.45cqi,20px);line-height:1.55}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-action .wp-block-button__link{padding:14px 17px;border-radius:0;text-decoration:none}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-action .wp-block-button__link:not(.has-background){background:var(--ppx-primary)}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-action .wp-block-button__link:not(.has-text-color){color:var(--ppx-primary-ink)}.patternpaste-compare-action .wp-block-button__link:not([class*="-font-size"]){font-size:13px}
.patternpaste-compare-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--patternpaste-designed-block-gap,12px);padding:12px;background:var(--ppx-plate)}.patternpaste-compare-scene{position:relative;min-width:0;overflow:hidden;background:var(--ppx-plate);color:var(--ppx-plate-ink)}.patternpaste-compare-image{height:100%;margin:0}.patternpaste-compare-image img{display:block;width:100%;height:100%;min-height:520px;object-fit:cover}.patternpaste-compare-before .patternpaste-compare-image img{filter:grayscale(.72) saturate(.58) contrast(.92)}.patternpaste-compare-label{position:absolute;z-index:3;left:18px;bottom:18px;display:grid;gap:var(--patternpaste-designed-block-gap,3px);max-width:calc(100% - 36px);padding:11px 13px}.patternpaste-compare-label:not(.has-background){background:var(--ppx-plate)}.patternpaste-compare-label:not(.has-text-color){color:var(--ppx-plate-ink)}.patternpaste-compare-label p:first-child:not([class*="-font-size"]){font-size:13px}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-label p:first-child{font-weight:800}.patternpaste-compare-note{letter-spacing:.06em}
.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-stage{--patternpaste-compare-position:50%;position:relative;display:block;aspect-ratio:16/8.8;padding:0;cursor:ew-resize;touch-action:pan-y}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-scene{position:absolute;inset:0}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-image img{min-height:0}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-after{z-index:2}
.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-label{max-width:min(38ch,calc(50% - 30px));overflow-wrap:anywhere}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-before .patternpaste-compare-label{right:18px;left:auto}
.patternpaste-compare-seam{position:absolute;z-index:4;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.patternpaste-compare-seam-line{fill:none;stroke:var(--ppx-primary);stroke-width:2.5;vector-effect:non-scaling-stroke}
.patternpaste-compare-handle{--patternpaste-compare-grip-y:50%;--patternpaste-compare-grip-tilt:0deg;--patternpaste-compare-sx:1;--patternpaste-compare-sy:1;position:absolute;z-index:5;left:var(--patternpaste-compare-position);top:var(--patternpaste-compare-grip-y);display:flex;align-items:center;justify-content:center;width:18px;height:74px;border:1px solid color-mix(in srgb,var(--ppx-primary-ink) 35%,transparent);border-radius:999px;transform:translate(-50%,-50%) rotate(var(--patternpaste-compare-grip-tilt)) scale(var(--patternpaste-compare-sx),var(--patternpaste-compare-sy));background:var(--ppx-primary);color:var(--ppx-primary-ink);box-shadow:0 5px 18px color-mix(in srgb,var(--ppx-plate) 28%,transparent);pointer-events:none;transform-origin:center}.patternpaste-compare-handle span{display:block;width:1px;height:24px;background:currentColor;opacity:.82}.patternpaste-compare-handle span+span{margin-left:3px}.patternpaste-designed-compare.is-compare-dragging .patternpaste-compare-stage{cursor:grabbing}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-stage:focus-visible{outline:3px solid var(--ppx-primary);outline-offset:5px}
.patternpaste-compare-foot{display:grid;grid-template-columns:.38fr 1.2fr .5fr;gap:clamp(22px,4cqi,60px);align-items:start;margin-top:clamp(38px,5cqi,72px);padding-top:24px;border-top:1px solid var(--ppx-rule)}.patternpaste-compare-result{max-width:24ch}.patternpaste-compare-result:not([class*="-font-size"]){font-size:clamp(28px,3.8cqi,54px);line-height:1.02;letter-spacing:-.04em}.patternpaste-designed-compare[data-treatment="designed"] .patternpaste-compare-result:not([class*="-font-family"]){font-family:Arial,Helvetica,sans-serif;font-weight:700}.patternpaste-compare-footnote{justify-self:end;max-width:24ch}.patternpaste-designed-compare :where(a,button):focus-visible{outline:3px solid currentColor;outline-offset:4px}
@container (max-width:760px){.patternpaste-compare-intro{grid-template-columns:1fr}.patternpaste-compare-heading:not([class*="-font-size"]){font-size:clamp(54px,11cqi,90px)}.patternpaste-compare-stage{grid-template-columns:1fr}.patternpaste-compare-image img{min-height:420px}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-stage{aspect-ratio:4/3}.patternpaste-compare-foot{grid-template-columns:1fr 2fr}.patternpaste-compare-footnote{grid-column:2;justify-self:start}}
@container (max-width:480px){.patternpaste-compare-heading:not([class*="-font-size"]){font-size:clamp(46px,15cqi,68px)}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-stage{aspect-ratio:3/4}.patternpaste-compare-label{left:12px;bottom:12px}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-before .patternpaste-compare-label{right:12px;left:auto}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-label{max-width:calc(50% - 18px);padding:8px 10px}.patternpaste-designed-compare.is-compare-ready .patternpaste-compare-note{display:none}.patternpaste-compare-handle{width:16px;height:64px}.patternpaste-compare-foot{grid-template-columns:1fr}.patternpaste-compare-footnote{grid-column:auto}}
.editor-styles-wrapper .patternpaste-designed-compare .patternpaste-compare-stage>.block-editor-block-list__layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--patternpaste-designed-block-gap,12px)}.editor-styles-wrapper .patternpaste-designed-compare .patternpaste-compare-scene{position:relative;inset:auto;min-width:0}.editor-styles-wrapper .patternpaste-designed-compare .patternpaste-compare-seam,.editor-styles-wrapper .patternpaste-designed-compare .patternpaste-compare-handle{display:none}
@media (prefers-reduced-motion:reduce){.patternpaste-designed-compare *{scroll-behavior:auto}}
/* An owner colour on the wrapper or any Group above reaches the label-scale text on it. */
:is(.patternpaste-designed-compare.has-text-color,.patternpaste-designed-compare .has-text-color) :is(.patternpaste-compare-kicker,.patternpaste-compare-foot-label,.patternpaste-compare-footnote):not(.has-text-color){color:inherit}