.is-style-origin-canvas-group-box-shadow {
border-radius: 8px;
box-shadow: var(--wp--preset--shadow--small);
padding: var(--wp--preset--spacing--large);
transition: box-shadow 120ms ease;
}
.is-style-origin-canvas-group-box-shadow:hover {
box-shadow: var(--wp--preset--shadow--medium);
} .wp-block-group.is-style-origin-canvas-icon-bubble {
border-radius: 999px;
flex: none;
height: 64px;
padding: 0;
width: 64px;
} .wp-block-group.origin-canvas-canvas-grid {
background-color: var(--wp--preset--color--surface-base);
background-image:
linear-gradient(180deg, transparent 42%, var(--wp--preset--color--surface-base) 97%),
radial-gradient(120% 75% at 50% -18%, var(--wp--preset--color--surface-subtle) 0%, transparent 60%),
radial-gradient(38% 50% at 88% 2%, color-mix(in srgb, var(--wp--preset--color--primary) 7%, transparent) 0%, transparent 70%),
linear-gradient(to right, color-mix(in srgb, var(--wp--preset--color--text-heading) 4%, transparent) 1px, transparent 1px),
linear-gradient(to bottom, color-mix(in srgb, var(--wp--preset--color--text-heading) 4%, transparent) 1px, transparent 1px);
background-repeat: no-repeat, no-repeat, no-repeat, repeat, repeat;
background-size: cover, cover, cover, 48px 48px, 48px 48px;
overflow: hidden;
position: relative;
} .origin-canvas-pattern-board {
display: grid;
gap: 20px;
grid-template-columns: repeat(12, minmax(0, 1fr));
margin-top: 56px;
padding-inline: clamp(20px, 3.5vw, 48px);
}
.origin-canvas-wash-tile {
background-color: var(--wp--preset--color--surface-base);
border-radius: var(--wp--custom--radius--large); min-height: clamp(240px, 26vw, 320px) !important;
overflow: hidden;
}
.origin-canvas-wash-hero {
background-image:
radial-gradient(70% 80% at 22% 20%, color-mix(in srgb, var(--wp--preset--color--primary) 20%, transparent), transparent 60%),
radial-gradient(60% 70% at 84% 86%, color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent), transparent 62%),
linear-gradient(150deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle) 100%);
grid-column: span 5;
}
.origin-canvas-wash-features {
background-image:
radial-gradient(65% 75% at 80% 22%, color-mix(in srgb, var(--wp--preset--color--primary) 12%, transparent), transparent 60%),
linear-gradient(160deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle) 100%);
grid-column: span 4;
}
.origin-canvas-wash-testimonial {
background-image:
radial-gradient(72% 72% at 24% 26%, color-mix(in srgb, var(--wp--preset--color--primary) 16%, transparent), transparent 58%),
linear-gradient(180deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle-hover) 100%);
grid-column: span 3;
}
.origin-canvas-wash-pricing {
background-image:
radial-gradient(60% 70% at 26% 78%, color-mix(in srgb, var(--wp--preset--color--primary) 13%, transparent), transparent 56%),
linear-gradient(180deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle) 100%);
grid-column: span 4;
}
.origin-canvas-wash-cta {
background-image:
radial-gradient(72% 80% at 80% 30%, color-mix(in srgb, var(--wp--preset--color--primary) 22%, transparent), transparent 60%),
radial-gradient(60% 70% at 20% 84%, color-mix(in srgb, var(--wp--preset--color--primary) 8%, transparent), transparent 58%),
linear-gradient(135deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle) 100%);
grid-column: span 4;
}
.origin-canvas-wash-editor {
background-image:
radial-gradient(60% 70% at 50% 24%, color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent), transparent 60%),
linear-gradient(180deg, var(--wp--preset--color--surface-base) 0%, var(--wp--preset--color--surface-subtle) 100%);
grid-column: span 4;
}
@media (max-width: 1100px) {
.origin-canvas-pattern-board {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.origin-canvas-wash-hero,
.origin-canvas-wash-editor {
grid-column: span 6;
}
.origin-canvas-wash-features,
.origin-canvas-wash-testimonial,
.origin-canvas-wash-pricing,
.origin-canvas-wash-cta {
grid-column: span 3;
}
}
@media (max-width: 640px) {
.origin-canvas-pattern-board {
gap: 14px;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-top: 40px;
}
.origin-canvas-wash-hero,
.origin-canvas-wash-editor {
grid-column: span 2;
}
.origin-canvas-wash-features,
.origin-canvas-wash-testimonial,
.origin-canvas-wash-pricing,
.origin-canvas-wash-cta {
grid-column: span 1;
}
.origin-canvas-wash-tile {
min-height: 170px !important;
}
} .origin-canvas-sw {
border-radius: 999px;
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--text-heading) 15%, transparent);
height: 20px;
width: 20px;
}
.origin-canvas-preset-dot {
border-radius: 999px;
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--text-heading) 12%, transparent);
flex: none;
height: 38px;
width: 38px;
} .origin-canvas-wire {
background: var(--wp--preset--color--surface-subtle);
border-radius: var(--wp--custom--radius--medium);
display: flex;
flex-direction: column;
gap: 8px;
height: 168px;
padding: 13px;
}
.origin-canvas-wire-head {
background: color-mix(in srgb, var(--wp--preset--color--text-heading) 10%, transparent);
border-radius: 3px;
flex: none;
height: 18px;
}
.origin-canvas-wire-body {
display: flex;
flex: 1;
gap: 8px;
min-height: 0;
}
.origin-canvas-wire-body--center {
justify-content: center;
}
.origin-canvas-wire-body--col {
flex-direction: column;
}
.origin-canvas-wire-body--grid {
display: grid;
gap: 8px;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
}
.origin-canvas-wire-blk {
background: var(--wp--preset--color--surface-base);
border-radius: 3px;
flex: 1;
}
.origin-canvas-wire-blk--alt {
background: color-mix(in srgb, var(--wp--preset--color--text-heading) 8%, transparent);
}
.origin-canvas-wire-blk--w60 {
flex: none;
width: 60%;
}
.origin-canvas-wire-blk--grow2 {
flex: 2;
}  .wp-block-group.origin-canvas-group-head,
.wp-block-group.origin-canvas-type-ramp {
align-items: baseline;
} .wp-block-group.origin-canvas-type-ramp .origin-canvas-mono {
align-self: center;
}
.origin-canvas-bullet-mark {
background: var(--wp--preset--color--primary);
border-radius: 2px;
flex-shrink: 0;
height: 6px;
width: 6px;
} .origin-canvas-tokens-panel {
overflow: hidden;
}
.origin-canvas-token-palrow {
display: flex;
gap: 10px;
}
.origin-canvas-token-palrow > .wp-block-group {
flex: 1;
}
.origin-canvas-token-sw {
border-radius: var(--wp--custom--radius--small);
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--text-heading) 8%, transparent);
height: 34px;
}
.origin-canvas-token-scale {
align-items: flex-end;
display: flex;
gap: 10px;
}
.origin-canvas-token-bar {
background: var(--wp--preset--color--surface-subtle);
border-radius: 3px 3px 0 0;
width: 26px;
}
.origin-canvas-token-bar--1 {
height: 14px;
}
.origin-canvas-token-bar--2 {
height: 22px;
}
.origin-canvas-token-bar--3 {
height: 32px;
}
.origin-canvas-token-bar--4 {
height: 44px;
}
.origin-canvas-token-bar--5 {
height: 58px;
}
.origin-canvas-token-bar--6 {
height: 74px;
}
.origin-canvas-token-bar--7 {
height: 92px;
} .origin-canvas-status-dot { border-radius: 999px;
flex: none;
height: 8px;
width: 8px;
} .wp-block-group.origin-canvas-quote-mark {
background-color: var(--wp--preset--color--primary);
flex: none;
height: 27px;
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M0 32V18.5C0 8.6 5.7 1.7 15.2 0l2 4.3C11.6 6 8.6 9.4 8.4 14.2H16V32H0zm22 0V18.5C22 8.6 27.7 1.7 37.2 0l2 4.3C33.6 6 30.6 9.4 30.4 14.2H38V32H22z'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 32'%3E%3Cpath d='M0 32V18.5C0 8.6 5.7 1.7 15.2 0l2 4.3C11.6 6 8.6 9.4 8.4 14.2H16V32H0zm22 0V18.5C22 8.6 27.7 1.7 37.2 0l2 4.3C33.6 6 30.6 9.4 30.4 14.2H38V32H22z'/%3E%3C/svg%3E");
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: contain;
mask-size: contain; margin-inline: 0 !important;
width: 34px;
} .wp-block-group.origin-canvas-quote-mark.origin-canvas-quote-mark--center {
margin-inline: auto !important;
} .wp-block-group.origin-canvas-quote-mark.origin-canvas-quote-mark--sm {
height: 26px;
width: 32px;
} .wp-block-group.origin-canvas-testimonial-card {
height: 100%;
} .wp-block-group.origin-canvas-testimonial-card.is-layout-flex > p:first-child {
flex: 1 1 auto;
}