.patternpaste-designed {
  /*
   * The inherit treatment consumes the same semantic colour contract as the
   * Theme Builder. Each role falls through to WordPress's common base/contrast
   * presets, then to a literal only when the active theme supplies neither.
   * Keep the pairs together: primary is for controls; plate is for a surface.
   */
  --pp-ground: var(--wp--preset--color--base, var(--wp--preset--color--white, #fff));
  --pp-ink: var(--wp--preset--color--contrast, var(--wp--preset--color--black, #111));
  --pp-label: var(--wp--preset--color--role-label, var(--wp--preset--color--contrast, var(--wp--preset--color--black, #111)));
  --pp-rule: var(--wp--preset--color--role-rule, var(--wp--preset--color--contrast, var(--wp--preset--color--black, #111)));
  --pp-primary: var(--wp--preset--color--role-primary, var(--wp--preset--color--contrast, var(--wp--preset--color--black, #111)));
  --pp-primary-ink: var(--wp--preset--color--role-primary-text, var(--wp--preset--color--base, var(--wp--preset--color--white, #fff)));
  --pp-plate: var(--wp--preset--color--role-plate, var(--wp--preset--color--base, var(--wp--preset--color--white, #fff)));
  --pp-plate-ink: var(--wp--preset--color--role-plate-text, var(--wp--preset--color--contrast, var(--wp--preset--color--black, #111)));
  color:var(--pp-ink); background:var(--pp-ground); padding:clamp(28px,5vw,80px); box-sizing:border-box; container-type:inline-size;
}
.patternpaste-designed[data-treatment="designed"] { --pp-ground:#f3f0e9; --pp-ink:#302d27; --pp-label:#302d27; --pp-rule:#c2bfb9; --pp-primary:#302d27; --pp-primary-ink:#f3f0e9; --pp-plate:#3340dc; --pp-plate-ink:#fff; font-family:Arial,Helvetica,sans-serif; }
.patternpaste-designed[data-treatment="inherit"]{ --pp-label:var(--wp--preset--color--role-label, currentColor); --pp-rule:var(--wp--preset--color--role-rule, currentColor);   }.patternpaste-designed[data-treatment="inherit"]:not([class*="is-style-"]){color:inherit;background:transparent;}
.patternpaste-designed * { box-sizing:border-box; }
.patternpaste-designed :where(p,h2,h3,figure,.wp-block-group,.wp-block-buttons,details) { margin:0; }
.patternpaste-designed[data-treatment="designed"] :where(h2,h3,p,summary,a) { color:inherit; }
.patternpaste-designed[data-treatment="designed"] :where(p,summary) { font-family:Arial,Helvetica,sans-serif; }
.patternpaste-designed[data-treatment="designed"] :where(p) { font-size:16px; line-height:1.6; }
.patternpaste-designed h2 { font-size:clamp(44px,6.7cqi,104px); line-height:1.03; letter-spacing:-.055em; overflow-wrap:normal; }
.patternpaste-designed[data-treatment="designed"] h2 { font-family:Georgia,serif; font-weight:400; }
.patternpaste-designed .wp-block-button__link { display:inline-block; }
.patternpaste-designed[data-treatment="designed"] .wp-block-button__link { background:var(--pp-primary); color:var(--pp-primary-ink); padding:18px 24px; font-family:Arial,Helvetica,sans-serif; font-size:14px; border-radius:0; text-decoration:none; }
.patternpaste-designed a:focus-visible,.patternpaste-designed button:focus-visible,.patternpaste-designed summary:focus-visible { outline:3px solid currentColor; outline-offset:5px; }
.patternpaste-designed .patternpaste-designed-eyebrow { color:var(--pp-label); font-size:11px; letter-spacing:.12em; line-height:1.5; }
/* THE SECTION IS A BAND ON THE BUYER'S PAGE, NOT A POSTER OF OUR OWN WIDTH.
 * The root bleeds (the block is alignfull by default) but the content column takes the
 * theme's own wide width, which WordPress emits from settings.layout.wideSize as
 * --wp--style--global--wide-size, so the section lines up with every alignwide block
 * above and below it. Before this rule each kind stated a literal between 1180px and
 * 1600px and a stock block theme (TT5: content 650, wide 1200) was out of register by
 * 40px to 400px a side on any screen wider than about 1300px. The per-kind number
 * survives only as the fallback for a theme that states no wideSize.
 * The column is also the container, so every cqi in a kind's stylesheet measures the
 * width the design actually occupies rather than the bleeding background behind it;
 * with the cap unset the two are the same box, which is why a poster kind that states
 * max-width:none renders exactly as it did. */
.patternpaste-designed-layout { max-width:var(--wp--style--global--wide-size,1280px); margin-inline:auto; container-type:inline-size; }
.has-patternpaste-designed-block-gap > :where(.patternpaste-designed-layout) { display:grid; }
.patternpaste-designed.has-patternpaste-designed-block-gap > .patternpaste-designed-layout,
.patternpaste-designed .wp-block-group.has-patternpaste-designed-block-gap { gap:var(--patternpaste-designed-block-gap)!important; }
.patternpaste-designed .wp-block-group:not(.has-patternpaste-designed-block-gap) { --patternpaste-designed-block-gap:initial; }
.patternpaste-designed [hidden] { display:none!important; }
@container (max-width:600px) {
  .patternpaste-designed h2 { font-size:clamp(44px,12cqi,68px); }
}
.editor-styles-wrapper .patternpaste-designed-layout>.block-list-appender { grid-column:1/-1; }

/* Clearing an optional role is as good as deleting it: the frontend leaves no gap,
 * while the editor keeps the empty placeholder so the words can be typed back. */
:root:not(:has(.editor-styles-wrapper)) .patternpaste-designed :where(p,h2,h3,h4,summary):empty { display:none; }
:root:not(:has(.editor-styles-wrapper)) .patternpaste-designed .wp-block-buttons:not(:has(.wp-block-button__link:not(:empty))) { display:none; }

.patternpaste-designed .wp-block-group > * { margin-block-start:0; margin-block-end:0; }
.patternpaste-designed-layout > * { min-width:0; }
