/* Generated by build-css-bundle.php. Do not edit directly. */
/* parts/text/heading1/heading1.css */
h1.cmw-y25-heading-1.cmw-pattern {
color: var(--cmw-text-color);
/* h1/desktop */
font-family: var(--cmw-font-family);
font-size: var(--cmw-h1-font-size);
font-weight: 300;
line-height: 120%;
margin-bottom: 0;
}
h1.cmw-y25-heading-1.cmw-pattern strong {
font-weight: 500;
}
h1.cmw-y25-heading-1.cmw-pattern span.blue-color {
color: var(--cmw-primary-color);
}
/* parts/text/heading2/heading2.css */
h2.cmw-y25-heading-2.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-h2-font-size);
font-weight: 300;
line-height: 120%;
margin-bottom: 0;
}
/* parts/text/heading3/heading3.css */
h3.cmw-y25-heading-3.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-h3-font-size);
font-style: normal;
font-weight: 650;
line-height: 140%;
margin-bottom: 0;
}
/* parts/text/heading4/heading4.css */
h4.cmw-y25-heading-4.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-h4-font-size);
font-style: normal;
font-weight: 400;
line-height: 110%;
margin-bottom: 0;
}
/* parts/text/large-paragraph/large-paragraph.css */
p.cmw-y25-large-paragraph.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-large-font-size);
font-weight: 400;
line-height: 140%;
padding: 0;
margin-bottom: 0;
}
/* parts/text/paragraph/paragraph.css */
p.cmw-patterns-paragraph.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-small-font-size);
font-style: normal;
font-weight: 400;
line-height: 140%;
margin-bottom: 0;
}
/* parts/text/bold-paragraph/bold-paragraph.css */
p.cmw-y25-bold-paragraph.cmw-pattern {
color: var(--cmw-text-color);
font-family: var(--cmw-font-family);
font-size: var(--cmw-medium-font-size);
font-style: normal;
font-weight: 650;
line-height: 140%;
}
/* parts/text/paragraph/secondary/secondary.css */
p.cmw-patterns-paragraph.secondary {
color: var(--cmw-text-secondary);
}
/* parts/text/quote/quote.css */
.cmw-quote-pattern .cmw-quote-icon {
display: flex;
width: 2rem;
height: 2rem;
img {
filter: var(--cmw-special-picked-gate-filter);
}
}
.cmw-quote-pattern .cmw-quote-text {
font-size: 1rem;
color: var(--cmw-color-text-dark);
margin-block: 0.5rem;
color: var(--cmw-color-medium);
}
.cmw-quote-pattern .cmw-quote-cite {
color: var( --cmw-special-picked-gate-color, var(--cmw-color-primary));
font-size: var(--cmw-button-font-size);
margin: 0;
}
/* When used inside the resource gate template*/
.cmw-pattern .resource-gate__quote {
margin-left: 3px;
padding-left: 1.25rem;
padding-left: 1.25rem;
border-left: 0.125rem solid var( --cmw-special-picked-gate-color, var(--cmw-color-primary));
display: flex;
flex-direction: column;
gap: 0.5rem;
}
/* blog/blog-quote/blog-quote.css */
.cmw-pattern.cmw-blog-quote {
border-left: 4px solid var(--cmw-color-primary);
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 1rem;
padding: clamp(0.25rem, 0.162rem + 0.3756vw, 0.5rem) 0 clamp(0.25rem, 0.162rem + 0.3756vw, 0.5rem) clamp(1.25rem, 0.9859rem + 1.1268vw, 2rem);
}
.cmw-pattern.cmw-blog-quote .cmw-blog-quote-paragraph {
color: var(--cmw-primary-dark);
font-size: clamp(1.125rem, 1.037rem + 0.3756vw, 1.375rem);
font-weight: 400;
line-height: 150%;
}
.cmw-pattern.cmw-blog-quote .cmw-blog-quote-bio {
color: var(--cmw-color-medium);
font-size: clamp(0.875rem, 0.831rem + 0.1878vw, 1rem);
font-weight: 400;
line-height: 140%;
}
/* blog/key-takeaways/key-takeaways.css */
.cmw-pattern.cmw-key-takeaways {
padding: clamp(1.25rem, 0.9859rem + 1.1268vw, 2rem) clamp(1rem, 0.6479rem + 1.5023vw, 2rem);
overflow: hidden;
}
.cmw-pattern.cmw-key-takeaways.cmw-key-takeaways-background {
border-radius: 1rem;
background: linear-gradient(102deg, #F0F8FE 9.85%, var(--Faint-Gray, #F9F9F9) 100%);
}
.cmw-pattern.cmw-key-takeaways .cmw-key-takeaways-title {
margin: 0;
color: var(--cmw-color-dark);
font-size: clamp(1.375rem, 1.2870rem + 0.3756vw, 1.625rem);
font-weight: 500;
line-height: 150%;
padding-bottom: 2rem;
}
.cmw-pattern.cmw-key-takeaways .cmw-key-takeaways-list {
margin: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: 1rem;
}
.cmw-pattern.cmw-key-takeaways .cmw-key-takeaways-list-item {
position: relative;
padding-left: 1.5rem;
color: var(--cmw-color-dark);
font-weight: 400;
font-size: 1rem;
line-height: 1.5;
word-break: break-word;
}
.cmw-pattern.cmw-key-takeaways .cmw-key-takeaways-list-item::before {
content: "";
position: absolute;
left: 0;
top: 0.5rem;
width: 0.75rem;
height: 0.75rem;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Ccircle cx='6' cy='6' r='4.5' stroke='%230072CE' stroke-width='3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cmw-pattern.cmw-key-takeaways .cmw-key-takeaways-list-item strong {
font-weight: 600;
}
/* blog/blog-banner/blog-banner.css */
.cmw-pattern.cmw-blog-banner > div {
border-radius: 1rem;
}
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-gray {
border-radius: 1rem;
background: var(--cmw-secondary-card-background);
}
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-blue-light {
border-radius: 1rem;
background: rgba(0, 114, 206, 0.06);
}
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-blue,
.cmw-pattern.cmw-blog-banner-with-img.cmw-blog-banner-background-blue {
border-radius: 1rem;
background: var(--cmw-color-primary);
}
.cmw-pattern.cmw-blog-banner-with-img > div {
display: grid;
grid-template-columns: 1fr 1fr;
align-content: center;
overflow: hidden;
border-radius: 1rem;
}
.cmw-pattern.cmw-blog-banner .cmw-blog-banner-info,
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-info {
display: flex;
flex-direction: column;
justify-content: center;
padding: 1.5rem 2rem;
}
.cmw-pattern.cmw-blog-banner .cmw-blog-banner-info .cmw-blog-banner-title,
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-info .cmw-blog-banner-title {
color: var(--cmw-color-light);
font-size: clamp(1.5rem, 1.4560rem + 0.1878vw, 1.625rem);
font-style: normal;
font-weight: 500;
line-height: 150%;
padding: 0 0 1rem;
}
.cmw-pattern.cmw-blog-banner .cmw-blog-banner-info .cmw-blog-banner-paragraph,
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-info .cmw-blog-banner-paragraph {
color: var(--cmw-color-light);
font-size: 1rem;
font-style: normal;
font-weight: 400;
line-height: 150%;
padding: 0;
}
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-gray .cmw-blog-banner-title,
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-blue-light .cmw-blog-banner-title,
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-blue-light .cmw-blog-banner-paragraph,
.cmw-pattern.cmw-blog-banner.cmw-blog-banner-background-gray .cmw-blog-banner-paragraph {
color: var(--cmw-color-dark);
}
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-img {
margin: 0;
height: 100%;
}
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-img img {
width: 100% !important;
height: 100% !important;
object-fit: cover;
}
@media (max-width: 834px) {
.cmw-pattern.cmw-blog-banner-with-img > div {
grid-template-columns: 1fr;
}
.cmw-pattern.cmw-blog-banner-with-img .cmw-blog-banner-img {
order: -1;
}
}
/* blog/blog-table/blog-table.css */
/* Blog Table – Yardi Design System */
.cmw-pattern.cmw-table .wp-block-group {
margin: 0;
}
/* Root container – table layout sizes columns by content */
.cmw-pattern.cmw-table:has(.cmw-table-head) > .wp-block-group__inner-container,
.cmw-pattern.cmw-table:has(.cmw-table-head):not(:has(> .wp-block-group__inner-container)) {
display: table;
table-layout: auto;
border: 1px solid var(--cmw-color-muted);
border-radius: 0.75rem;
overflow: hidden;
width: 100%;
border-spacing: 0;
}
/* Pass-through wrappers */
.cmw-pattern.cmw-table-head {
display: contents;
}
.cmw-pattern.cmw-table-content {
display: contents;
}
.cmw-pattern.cmw-table-content > .wp-block-group__inner-container {
display: contents;
}
.cmw-pattern.cmw-table-content > .wp-block-group__inner-container > .wp-block-group,
.cmw-pattern.cmw-table-content > .wp-block-group:not(.cmw-table-content) {
display: contents;
}
/* Header row */
.cmw-pattern.cmw-table-head > .wp-block-group__inner-container,
.cmw-pattern.cmw-table-head:not(:has(> .wp-block-group__inner-container)) {
display: table-row;
}
/* Body rows */
.cmw-pattern.cmw-table-content .wp-block-group__inner-container > .wp-block-group > .wp-block-group__inner-container,
.cmw-pattern.cmw-table-content > .wp-block-group:not(.cmw-table-content) > .wp-block-group__inner-container,
.cmw-pattern.cmw-table-content > .wp-block-group:not(.cmw-table-content):not(:has(> .wp-block-group__inner-container)) {
display: table-row;
}
/* Reset WP constrained layout inside cells */
.cmw-pattern.cmw-table-head .wp-block-group__inner-container > *,
.cmw-pattern.cmw-table-content .wp-block-group__inner-container > .wp-block-group > .wp-block-group__inner-container > *,
.cmw-pattern.cmw-table-content > .wp-block-group > .wp-block-group__inner-container > *,
.cmw-pattern.cmw-table-content > .wp-block-group:not(:has(> .wp-block-group__inner-container)) > * {
max-width: none;
margin-left: 0;
margin-right: 0;
}
/* Header cells */
.cmw-pattern.cmw-table-head p {
display: table-cell;
margin: 0;
padding: 1rem;
font-weight: 700;
font-size: 1rem;
line-height: 1.5;
color: var(--cmw-color-light);
background: var(--cmw-color-primary);
word-break: break-word;
border-right: 1px solid #0865b1;
vertical-align: middle;
}
.cmw-pattern.cmw-table-head p:last-child {
border-right: none;
}
/* Body cells */
.cmw-pattern.cmw-table-content p {
display: table-cell;
margin: 0;
padding: 1rem;
box-sizing: border-box;
font-family: "Mulish", sans-serif;
font-weight: 400;
font-size: 1rem;
line-height: 1.5;
color: var(--cmw-color-text-dark);
word-break: break-word;
border-right: 1px solid #dcdcdc;
border-bottom: 1px solid #dcdcdc;
vertical-align: middle;
}
.cmw-pattern.cmw-table-content p:last-child {
border-right: none;
}
/* Alternating row backgrounds via cells */
.cmw-pattern.cmw-table-content > .wp-block-group__inner-container > .wp-block-group:nth-child(odd) p,
.cmw-pattern.cmw-table-content > .wp-block-group:nth-child(odd):not(.cmw-table-content) p {
background-color: var(--cmw-color-light);
}
.cmw-pattern.cmw-table-content > .wp-block-group__inner-container > .wp-block-group:nth-child(even) p,
.cmw-pattern.cmw-table-content > .wp-block-group:nth-child(even):not(.cmw-table-content) p {
background-color: var(--cmw-secondary-card-background);
}
/* Last row – no bottom border */
.cmw-pattern.cmw-table-content > .wp-block-group__inner-container > .wp-block-group:last-child p,
.cmw-pattern.cmw-table-content > .wp-block-group:not(.cmw-table-content):last-child p {
border-bottom: none;
}
/* First column – product name */
.cmw-pattern.cmw-table-content p:first-child {
font-weight: 600;
color: var(--cmw-primary-dark);
}
@media (max-width: 767px) {
.cmw-pattern.cmw-table:has(.cmw-table-head) > .wp-block-group__inner-container,
.cmw-pattern.cmw-table:has(.cmw-table-head):not(:has(> .wp-block-group__inner-container)) {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
/* blog/faq-experts/faq-experts.css */
.cmw-pattern.cmw-faq-experts {
display: flex;
flex-direction: column;
width: 100%;
}
.cmw-pattern.cmw-faq-experts .wp-block-group {
margin: 0;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-title {
padding-top: clamp(2rem, 1.6479rem + 1.502vw, 3rem);
padding-bottom: 2rem;
font-weight: 300;
font-size: clamp(1.125rem, 0.8609rem + 1.1268vw, 1.875rem);
line-height: 1.2;
color: var(--cmw-primary-dark);
}
/* Accordion item */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup {
border-top: 1px solid #f4f4f4;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup.is-open {
display: flex;
flex-direction: column;
gap: 2rem;
padding-bottom: 2.5rem;
}
/* Bio header (trigger) */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio {
display: flex;
align-items: center;
width: 100%;
padding: 0.75rem 0;
cursor: pointer;
user-select: none;
border-bottom: 1px solid #f4f4f4;
}
/* WordPress wraps blocks in inner-container – force horizontal row */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio > .wp-block-group__inner-container {
display: flex;
flex-direction: row;
align-items: center;
gap: 1.25rem;
flex: 1 1 auto;
width: 100%;
min-width: 0;
max-width: none;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio figure {
margin: 0;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio .wp-block-image img {
display: block;
width: 4rem;
height: 4rem;
max-width: 4rem;
object-fit: cover;
border-radius: 0.5rem;
}
/* Name & title */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-bio {
flex: 1 1 auto;
min-width: 0;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-bio > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
gap: 0.375rem;
max-width: none;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-bio h3 {
font-weight: 600;
font-size: 1.125rem;
line-height: 1.2;
color: var(--cmw-primary-dark);
margin: 0;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-bio p {
font-weight: 400;
font-size: 0.875rem;
line-height: 1.4;
color: var(--cmw-color-medium);
margin: 0;
}
/* Social icons – visible only when open */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social {
display: none;
flex-shrink: 0;
margin-left: auto;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup.is-open .cmw-faq-experts-grup-bio-social {
display: block;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social > .wp-block-group__inner-container {
display: flex;
flex-direction: row;
align-items: center;
gap: 1.5rem;
max-width: none;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social .cmw-faq-experts-social-icon {
flex-shrink: 0;
line-height: 0;
margin: 0;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social .cmw-faq-experts-social-icon img {
display: block;
width: 1.5rem;
height: 1.5rem;
}
/* Plus toggle icon – visible only when collapsed */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-toggle {
display: none;
flex-shrink: 0;
align-items: center;
justify-content: center;
margin-left: auto;
padding-top: 0.25rem;
pointer-events: none;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup:not(.is-open) .cmw-faq-experts-grup-bio-toggle {
display: flex;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup .cmw-faq-experts-grup-bio .cmw-faq-experts-grup-bio-toggle svg {
display: block;
width: 1.5rem;
height: 1.5rem;
}
/* Q&A content */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question {
display: none;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup.is-open .cmw-faq-experts-grup-question {
display: flex;
padding-top: 2rem;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question p,
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question h4 {
margin: 0;
word-break: break-word;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question-q {
font-weight: 650;
font-size: 1rem;
line-height: 1.5;
color: var(--cmw-color-dark);
padding-bottom: 0.75rem;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question-a {
font-weight: 400;
font-size: 0.875rem;
line-height: 1.5;
color: var(--cmw-color-text-dark);
}
/* Multiple Q&A pairs inside one expert block */
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question-q + .cmw-faq-experts-grup-question-a + .cmw-faq-experts-grup-question-q {
margin-top: 2rem;
}
@media (max-width: 767px) {
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio > .wp-block-group__inner-container {
flex-wrap: wrap;
gap: 1rem;
}
.cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social {
margin-left: 0;
}
}
/* Block editor: show all elements for editing */
.editor-styles-wrapper .cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup {
display: flex;
flex-direction: column;
gap: 2rem;
padding-bottom: 2.5rem;
}
.editor-styles-wrapper .cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-bio-social {
display: block;
}
.editor-styles-wrapper .cmw-pattern.cmw-faq-experts .cmw-faq-experts-grup-question {
display: flex;
}
/* parts/text/eyebrow/eyebrow.css */
p.cmw-pattern.eyebrow {
color: var(--cmw-color-dark);
font-family: var(--cmw-font-family);
font-size: var(--cmw-eyebrow-font-size);
font-style: normal;
font-weight: 650;
line-height: 120%;
letter-spacing: 0.125rem;
text-transform: uppercase;
margin-bottom: 0;
}
/* parts/text/action-link/action-link.css */
/* Wrapper containing img/badge and text */
.cmw-pattern.action-link {
gap: 0.5rem;
display: grid;
grid-template-columns: auto 1fr;
justify-items: start;
align-items: center;
}
/* Badge */
.cmw-pattern.action-link .cmw-logo-picker {
display: flex;
}
.cmw-pattern.action-link .cmw-logo-picker img {
width: 0.875rem;
height: 0.875rem;
filter: var(--cmw-primary-color-filter);
}
.cmw-pattern.action-link a {
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
.cmw-pattern.action-link .cmw-action-link-icon {
display: inline-flex;
align-items: center;
}
.cmw-pattern.action-link .cmw-action-link-icon img {
width: 0.875rem;
height: 0.875rem;
}
/* Apply filter on the icons, but not on the placeholder icon */
.cmw-pattern.action-link .cmw-action-link-icon img:not(.z-placeholder_icon) {
filter: var(--cmw-primary-color-filter);
}
/* Text */
.cmw-pattern.action-link p {
color: var(--cmw-primary-color);
font-family: var(--cmw-font-family);
font-size: 0.875rem;
font-style: normal;
font-weight: 650;
line-height: 100%;
text-decoration: none;
white-space: nowrap;
a {
position: relative;
}
}
.cmw-pattern.action-link a:focus-visible {
outline: 2px solid var(--cmw-color-primary);
outline-offset: 2px;
}
/* parts/text/tags/tags.css */
/* Tags wrapper */
.cmw-pattern.tags {
display: flex;
flex-direction: row;
flex-wrap: wrap;
position: relative;
gap: 0.5rem;
z-index: 1;
}
.cmw-pattern.tags p {
display: flex;
}
/* Individual link tag */
.cmw-pattern.tags .tag {
padding: 6px 9px;
border-radius: 4px;
background: var(--cmw-color-tertiary-blue);
font-size: 0.8125rem;
font-style: normal;
font-weight: 600;
line-height: 110%;
white-space: nowrap;
}
.cmw-pattern.tags .tag a {
font-size: 0.8125rem;
color: #58758C;
line-height: 100%;
text-decoration: none;
}
.cmw-pattern.tags .tag a:hover {
text-decoration: underline;
}
.cmw-pattern.tags .tag a:focus-visible {
outline: 2px solid var(--cmw-color-primary);
outline-offset: 4px;
border-radius: 2px;
}
/* parts/text/medium-paragraph/medium-paragraph.css */
p.cmw-y25-medium-paragraph.cmw-pattern {
color: var(--cmw-text-secondary);
font-family: var(--cmw-font-family);
font-size: var(--cmw-medium-font-size);
font-weight: 400;
line-height: 140%;
margin-bottom: 0;
}
/* parts/text/pills/pills.css */
.cmw-pills .wp-block-group__inner-container {
display: flex;
flex-wrap: wrap;
flex-direction: row;
gap: var(--cmw-3xs);
}
.cmw-pills .wp-block-group__inner-container .cmw-pill {
display: flex;
align-items: center;
white-space: wrap;
margin: 0;
padding: 0.5rem 1rem;
background: var(--cmw-secondary-card-background);
border-radius: 0.5rem;
}
/* parts/text/tags/non-actionable/non-actionable.css */
/* MAIN WRAPPER */
.cmw-pattern.non-actionable-wrap .non-actionable-tags {
display: flex;
flex-direction: row;
flex-wrap: wrap;
position: relative;
gap: 0.5rem;
}
.cmw-pattern.non-actionable-wrap .non-actionable-tags .tag-label {
color: #707070;
font-size: 0.8125rem;
font-weight: 600;
line-height: 100%;
text-transform: uppercase;
white-space: nowrap;
margin: 0;
}
.cmw-pattern.non-actionable-wrap .non-actionable-tags .tag-sep {
width: 3px;
height: 3px;
background: var(--cmw-color-muted);
border-radius: 100%
}
.non-actionable-wrap .non-actionable-tags {
scrollbar-width: none;
-ms-overflow-style: none;
}
.non-actionable-wrap.cmw-has-overflow .non-actionable-tags::-webkit-scrollbar {
width: 0;
height: 0; /* Chrome/Safari/Edge */
display: none;
}
/* parts/inputs/search/search.css */
/* Search wrapper */
.cmw-pattern.search {
width: min(100%, 400px);
}
.cmw-pattern.search > div {
border-radius: 4px;
border: 1px solid #DCDCDC;
padding: 0 24px;
display: grid;
grid-template-columns: 16px 1fr;
column-gap: 8px;
}
.cmw-pattern.search > div input {
display: flex;
width: 100%;
}
.cmw-pattern.search input,
.cmw-pattern.search input:focus,
.cmw-pattern.search input:focus-visible {
border: none;
outline: none;
}
.cmw-pattern.search input {
font-size: 1.125rem;
padding: 1rem 0;
}
.cmw-pattern.search input::placeholder {
color: var(--cmw-text-secondary);
}
/* Search icon */
.cmw-pattern.search .cmw-logo-picker {
display: flex;
align-items: center;
}
.cmw-pattern.search .cmw-logo-picker .functional {
height: 16px;
width: 16px;
}
/* Custom clear search X icon */
.cmw-pattern.search #search-input-pattern::-webkit-search-cancel-button {
-webkit-appearance: none;
-moz-appearance: none;
cursor: pointer;
height: 16px;
width: 16px;
background-image: url('data:image/svg+xml;utf8,');
}
/* parts/forms/hubspot-form/hubspot-form.css */
/* HubSpot form inner-element styling borrowed from Y25 helpers */
.cmw-pattern.form.hubspot-form {
width: 100%;
}
.cmw-pattern.form.hubspot-form .hubspot-form__container {
position: relative;
}
.cmw-pattern.form.hubspot-form .hubspot-form__loading {
margin: 0;
font-size: var(--cmw-small-font-size, 0.9rem);
color: var(--cmw-color-medium);
}
.cmw-pattern.form.hubspot-form .hubspot-form__error {
margin: 0;
color: var(--cmw-color-error);
font-weight: 600;
}
.cmw-pattern.form.hubspot-form .cmw-form-spinner,
.cmw-pattern.form.hubspot-form .cmw-form-timeout {
text-align: center;
padding-block: 1.5rem;
color: var(--cmw-color-error);
}
.cmw-pattern.form.hubspot-form .cmw-form-spinner {
width: 60px;
margin-inline: auto;
padding-block: 2rem;
}
.cmw-pattern.form.hubspot-form .cmw-form-spinner svg {
animation: cmw-form-spinner-rotate 1.4s linear infinite;
}
@keyframes cmw-form-spinner-rotate {
0% {
transform: rotate(0);
}
100% {
transform: rotate(270deg);
}
}
.cmw-pattern.form.hubspot-form .cmw-form-spinner > * > * {
stroke-dasharray: 88px;
stroke-dashoffset: 0;
transform-origin: center;
animation: cmw-form-spinner-dash 1.4s ease-in-out infinite;
stroke-width: 1;
stroke-linecap: round;
}
@keyframes cmw-form-spinner-dash {
0% {
stroke-dashoffset: 88px;
}
50% {
stroke-dashoffset: 22px;
transform: rotate(135deg);
}
100% {
stroke-dashoffset: 88px;
transform: rotate(450deg);
}
}
.cmw-pattern.form.hubspot-form .cmw-form-timeout {
color: red;
}
.cmw-pattern.form.hubspot-form .cmw-hidden {
display: none !important;
}
.cmw-pattern.form.hubspot-form .hbspt-form {
container-type: inline-size;
container-name: hbspt;
}
.cmw-pattern.form.hubspot-form .hbspt-form form {
width: fit-content;
margin-inline: auto;
display: block;
/* margin-top: calc(var(--cmw-2xs, 1rem) * -1); */
}
.postid-359916 .cmw-pattern.form.hubspot-form .hbspt-form form,
.cmw-pattern.form.hubspot-form .hbspt-form form:has(:first-child.form-columns-0 > :first-child.hs-richtext) {
margin-top: -4px;
}
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="name"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="job"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="email"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="country"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="questions"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="company"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="phone"] label:has(:not([class*="error"])),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="portfolio"] label:has(:not([class*="error"])) {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
clip-path: inset(50%);
white-space: nowrap;
border: 0;
}
.cmw-pattern.form.hubspot-form .cmw-form-label--visually-hidden {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
clip-path: inset(50%);
white-space: nowrap;
border: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input:not([type="checkbox"]):not([type="radio"]),
.cmw-pattern.form.hubspot-form .hbspt-form form .input select,
.cmw-pattern.form.hubspot-form .hbspt-form form .input textarea {
width: 100%;
box-sizing: border-box;
height: 3.11111rem;
padding: 0 var(--cmw-xs, 1.25rem);
border-radius: var(--cmw-5xs, 0.5rem);
border: 1px solid var(--cmw-Medium-Gray, #dcdcdc);
font-size: 1rem;
background-color: #fff;
color: var(--cmw-Dark-Gray, #333);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input textarea {
height: 8.88889rem;
padding: var(--cmw-xs, 1.25rem);
resize: vertical;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .legal-consent-container input[type="checkbox"] {
width: auto;
height: auto;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input::placeholder,
.cmw-pattern.form.hubspot-form .hbspt-form form .input select,
.cmw-pattern.form.hubspot-form .hbspt-form form .input textarea::placeholder {
color: var(--cmw-Dark-Gray, #333);
font-size: 1rem;
font-style: normal;
font-weight: 400;
line-height: 140%;
}
.cmw-pattern.form.hubspot-form .hbspt-form form label span {
color: var(--cmw-Dark-Gray, #333);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input select {
-webkit-appearance: none;
-moz-appearance: none;
background-image: url('data:image/svg+xml;utf8,');
background-position: 95% center;
background-repeat: no-repeat;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-dependent-field > div:not(:first-child),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="form-columns-1"] div:not([style*="display: none;"]),
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="form-columns-2"] > div:not([style*="display: none;"]),
.cmw-pattern.form.hubspot-form .hbspt-form form > div.hs-form-field,
.cmw-pattern.form.hubspot-form .hbspt-form form > div.legal-consent-container {
margin-top: var(--cmw-2xs, 0.75rem);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-field {
position: relative;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input:focus-visible,
.cmw-pattern.form.hubspot-form .hbspt-form form .input:focus-within > select,
.cmw-pattern.form.hubspot-form .hbspt-form form .input:focus-within > textarea {
outline: 1px solid var( --cmw-special-picked-gate-color, var(--cmw-color-primary, #0072CE)) !important;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input:focus-visible::placeholder,
.cmw-pattern.form.hubspot-form .hbspt-form form .input:focus-within > select::placeholder,
.cmw-pattern.form.hubspot-form .hbspt-form form .input:focus-within > textarea::placeholder {
color: transparent;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .legal-consent-container {
margin-bottom: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form ul {
padding: 0;
margin: 0;
list-style: none;
}
.cmw-pattern.form.hubspot-form .hbspt-form form ul input[type*="radio"] {
margin-right: var(--cmw-2xs, 0.75rem);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display span {
margin-left: 0 !important;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display span p {
margin: 0;
font-size: 0.83333rem;
font-weight: 400;
line-height: 140%;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display span p a {
color: var( --cmw-special-picked-gate-color, var(--cmw-color-primary, #0072CE));
text-decoration: underline;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .actions input[type="submit"] {
color: #fff;
font-size: 0.88889rem;
font-weight: 650;
background-color: var( --cmw-special-picked-gate-color, var(--cmw-color-primary, #0072CE));
border: none;
border-radius: 0.16667rem;
cursor: pointer;
transition: background-color 0.3s ease;
padding: 0.44444rem 1.11111rem;
height: 2.6667rem;
margin-top: var(--cmw-xs, 1.25rem);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .actions input[type="submit"]:focus-visible {
outline: 2px solid var( --cmw-special-picked-gate-color, var(--cmw-color-primary, #0072CE));
outline-offset: 4px;
border-radius: 2px;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .actions input[type="submit"]:hover {
background: var( --cmw-special-picked-gate-color, var(--cmw-color-primary, #0072CE));
}
.cmw-pattern.form.hubspot-form .hbspt-form form [role="alert"] label,
.cmw-pattern.form.hubspot-form .hbspt-form form .hs_error_rollup ul li label {
color: #eb0000;
font-size: 0.83333rem;
font-weight: 400;
line-height: 140%;
padding: 0;
margin-right: 8px;
}
.cmw-pattern.form.hubspot-form .hbspt-form form [role="alert"] {
padding: 0;
margin: 0;
list-style: none;
position: relative;
z-index: 1;
}
.cmw-pattern.form.hubspot-form .hbspt-form form [role="alert"] label {
position: absolute;
bottom: -2rem;
padding: 4px 8px !important;
border-radius: 6px;
background: #eb0000;
color: #fff !important;
}
.cmw-pattern.form.hubspot-form .hbspt-form form [role="alert"] label::before {
content: "";
position: absolute;
left: 10%;
top: 0;
transform: translate(-50%, -100%);
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #eb0000;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs_error_rollup ul {
padding: 0;
margin-top: 0;
list-style: none;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-fieldtype-select option {
color: var(--cmw-Dark-Gray, #333);
font-size: 0.88889rem;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display {
position: relative;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display input[type="checkbox"] {
position: absolute;
opacity: 0;
width: 0;
height: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display input[type="checkbox"]:focus + span::before {
outline: 1px solid var(--cmw-Primary-Blue, #0072ce);
outline-offset: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display input[type="checkbox"] + span::before {
content: '';
display: inline-block;
width: 0.88889rem;
height: 0.88889rem;
border: 1px solid #000;
border-radius: 3px !important;
background-color: transparent;
transition: background-color 0.3s ease, border-color 0.3s ease;
margin-right: 0.44444rem;
box-sizing: border-box;
vertical-align: middle;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-form-booleancheckbox-display input[type="checkbox"]:checked + span::before {
background-color: var(--cmw-Primary-Blue, #0072ce);
border-color: #000;
padding: 2px;
background-clip: content-box;
}
.cmw-pattern.form.hubspot-form .cmw-form-timeout {
padding-top: 2rem;
padding-bottom: 2rem;
color: red;
}
@media (max-width: 834px) {
.cmw-pattern.form.hubspot-form .hbspt-form {
display: flex;
justify-content: center;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input::placeholder,
.cmw-pattern.form.hubspot-form .hbspt-form form .input select,
.cmw-pattern.form.hubspot-form .hbspt-form form .input textarea::placeholder {
font-size: 0.88889rem;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input input:not([type="radio"]),
.cmw-pattern.form.hubspot-form .hbspt-form form .input select {
height: 3.11111rem;
padding: 0 var(--cmw-2xs, 0.75rem);
}
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-fieldtype-select option,
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-fieldtype-select select:not(.is-placeholder) {
font-size: 0.88889rem;
}
}
@container hbspt (max-width: 400px) {
.cmw-pattern.form.hubspot-form .hbspt-form form .input {
margin: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .input .hs-input:not([type="radio"]) {
width: 100%;
}
.cmw-pattern.form.hubspot-form .hbspt-form form *[class*="form-columns-2"] > div:first-child:not([style*="display: none;"]),
.cmw-pattern.form.hubspot-form .hbspt-form form .hs-fieldtype-select:not(:first-of-type) {
margin-bottom: 0;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .form-columns-2 {
display: flex;
flex-direction: column;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .form-columns-2 .hs-form-field {
min-width: 100%;
}
.cmw-pattern.form.hubspot-form .hbspt-form form .form-columns-2 > div:nth-child(2) {
margin-top: var(--cmw-2xs, 0.75rem);
}
}
/* parts/buttons/base/base.css */
/* Stadard button */
.cmw-pattern.button {
margin-bottom: 0;
}
.cmw-pattern.button a.wp-block-button__link,
.editor-styles-wrapper .cmw-pattern.button .wp-block-button__link {
all: unset;
display: inline-flex;
flex-wrap: wrap;
font-family: var(--cmw-font-family);
font-size: var(--cmw-button-font-size);
color: var(--cmw-primary-color) !important;
font-style: normal;
font-weight: 650;
line-height: 100%;
cursor: pointer;
position: relative;
align-items: center;
text-decoration: none;
}
/* Editor */
.block-editor-block-list__block.cmw-y25-buttons{
margin-bottom: 0;
margin-top: 0;
}
/* parts/buttons/primary/primary.css */
.cmw-pattern.button.primary a.wp-block-button__link,
.editor-styles-wrapper .cmw-pattern.button.primary .wp-block-button__link {
--_btn-color: var(--cmw-special-branding-color, var(--cmw-color-primary));
background-color: var(--_btn-color);
border-color: var(--_btn-color);
border-radius: 0.1875rem;
color: var(--cmw-color-light) !important;
}
/* Standard primary button */
.cmw-pattern.primary.button a {
font-size: 0.875rem;
padding: 0.8rem 1rem;
}
/* Big primary button */
.cmw-pattern.primary.button.big a {
font-size: 1rem;
padding: 1.25rem;
}
/* Hover animation for the primary button, based on the scoped button color declared above */
.cmw-pattern.button.primary a.wp-block-button__link,
.editor-styles-wrapper .cmw-pattern.button.primary .wp-block-button__link {
transition: background-position 0.6s ease;
background-image: linear-gradient(90deg, var(--_btn-color) 0%, oklch(from var(--_btn-color) calc(l + 0.10) calc(c * 1.2) h) 100%);
background-size: 300% 200%;
background-position: left center;
}
.cmw-pattern.button.primary a:hover {
background-position: right center;
}
/* parts/buttons/secondary/secondary.css */
.cmw-pattern.button.secondary a.wp-block-button__link:hover {
text-decoration: underline;
}
/* parts/buttons/tertiary/tertiary.css */
.cmw-pattern.button.tertiary a.wp-block-button__link,
.editor-styles-wrapper .cmw-pattern.button.tertiary .wp-block-button__link {
--_btn-color: var(--cmw-color-primary);
background-color: var(--cmw-White);
border:1px solid var(--_btn-color);
border-radius: 0.1875rem;
color: var(--_btn-color);
}
/* Standard tertiary button */
.cmw-pattern.tertiary.button a {
font-size: 0.875rem;
padding: 0.8rem 1rem;
}
/* On hover */
.cmw-pattern.tertiary.button a:hover {
background-color: rgba(248,248,248,1);
}
/* parts/cards/base/base.css */
/* Card wrapper */
.cmw-pattern.card {
border-radius: 1rem;
overflow: hidden;
}
.cmw-pattern.card > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end;
height: 100%;
position: relative;
}
/* Card as link */
.cmw-pattern.card > .wp-block-group__inner-container .link-overlay {
position: absolute;
inset: 0;
z-index: 1;
}
/* Card image */
.cmw-pattern.card > .wp-block-group__inner-container:has(figure) {
border-radius: 1rem;
overflow: hidden;
}
.cmw-pattern.card > .wp-block-group__inner-container figure {
width: 100%;
margin-bottom: var(--cmw-pattern-5xs);
}
/*Card header */
.cmw-pattern.card-header > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
align-items: flex-start;
align-self: stretch;
}
/*Card details */
.wp-block-group.cmw-pattern.card-body {
display: flex;
flex: 1 0 0;
align-items: stretch;
}
.wp-block-group.cmw-pattern.card-body .button {
position: relative;
}
.wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container {
display: flex;
flex-direction: column;
justify-content: space-around;
}
.wp-block-group.cmw-pattern.card-header.no-padding.full-width {
width: 100%;
}
.cmw-pattern.card figure.wp-block-image.cmw-pattern.card-image img,
.cmw-pattern.card figure.wp-block-image img {
object-fit: cover;
width: 100%!important;
height: 12.5rem;
}
.cmw-pattern.card .cmw-pattern.card-icon img {
display: flex;
justify-content: center;
align-items: center;
}
.cmw-pattern.card {
position: relative;
margin-bottom: 0;
display: flex;
flex-direction: column;
height: 100%;
flex-wrap: wrap;
}
/* Editor */
.block-editor-block-list__block.cmw-y25-header,
.block-editor-block-list__block.cmw-y25-body {
margin-bottom: 0;
margin-top:0;
}
@media (max-width:875px) and (min-width:500px){
.cmw-pattern.card figure.wp-block-image.cmw-pattern.card-image img,
.cmw-pattern.card figure.wp-block-image img {
height: 7rem;
}
}
@media (max-width:499px){
.cmw-pattern.card figure.wp-block-image.cmw-pattern.card-image img,
.cmw-pattern.card figure.wp-block-image img {
height: 5rem;
}
}
/* CARDS ANIMATIONS */
/* cards WITH a button */
.cmw-pattern.card:has(.button) .button a::after {
content: "";
position: absolute;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
width: 5px;
height: 9px;
right: -6px;
bottom:1px;
transform: translateX(0) scale(1);
opacity: 0;
transition: transform 0.5s ease, opacity 0.5s ease;
}
.cmw-pattern.card:has(.button):hover .button a::after {
/* slide 15px to the right and scale up a bit */
transform: translateX(8px) scale(1.5);
opacity: 1;
}
/* cards WITHOUT a button */
.cmw-pattern.card:not(:has(.button)) {
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cmw-pattern.card:not(:has(.button)):hover {
transform: translateY(-4px);
box-shadow: none;
}
.cmw-pattern.card.no-hover:not(:has(.button)):hover {
transform: none;
box-shadow: none;
}
/* reduce motion */
@media (prefers-reduced-motion: reduce) {
.cmw-pattern.card:has(.button) .button a::after,
.cmw-pattern.card:not(:has(.button)) {
transition: none;
}
}
/* parts/cards/details/details.css */
.cmw-pattern.card-details,
.cmw-pattern.card-details > .wp-block-group__inner-container {
position: relative;
height: -webkit-fill-available;
height: -moz-available;
}
.cmw-pattern.card-details a {
color: var(--cmw-color-primary);
}
/* Whole card as link */
.cmw-pattern.card-details .link-overlay {
position: absolute;
inset: 0;
z-index: 1;
}
.cmw-pattern.card-details:has(.link-overlay:focus-visible) {
outline: 2px solid var(--cmw-color-primary);
outline-offset: 1px;
}
.cmw-pattern.card-details figure img {
align-self: stretch;
aspect-ratio: 16/9;
}
.cmw-pattern.card-details figure {
margin: 0;
}
.cmw-pattern.card-details.shadow {
border-radius: 1rem;
overflow: clip;
box-shadow: var(--cmw-default-shadow);
}
/* parts/cards/primary-card/primary-card.css */
/* Card wrapper */
.cmw-pattern.card.primary-card > .wp-block-group__inner-container,
.cmw-pattern.card.primary-card {
gap: 0.75rem;
background: var(--cmw-color-light);
box-shadow: var(--cmw-primary-card-box-shadow);
border-radius: 1rem;
overflow: hidden;
}
/* Card img/logo/icon */
.cmw-pattern.card.primary-card .cmw-pattern.card-icon img {
width: 2rem;
height: 2rem;
}
.cmw-pattern.card.primary-card .cmw-pattern.card-icon,
.cmw-pattern.card.primary-card .cmw-logo-picker {
padding-top: var(--cmw-primary-card-padding);
}
/* Card details */
.cmw-pattern.card.primary-card .wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container,
.cmw-pattern.card.primary-card .cmw-pattern.card-icon,
.cmw-pattern.card.primary-card .cmw-logo-picker {
padding-left: var(--cmw-primary-card-padding);
padding-right: var(--cmw-primary-card-padding);
}
.cmw-pattern.card.primary-card .wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container {
padding-bottom: var(--cmw-primary-card-padding);
}
/* parts/cards/secondary-card/secondary-card.css */
/* Main card wrapper */
.cmw-pattern.card.secondary-card > .wp-block-group__inner-container {
gap: var(--cmw-pattern-2xs);
background: var(--cmw-secondary-card-background);
border-radius: 1rem;
}
/* Card img/logo/icon */
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon img.artwork {
width: 4rem;
height: 4rem;
}
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon img {
width: 2.25rem;
height: 2.25rem;
}
/* Card details */
.cmw-pattern.card.secondary-card .wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container,
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon,
.cmw-pattern.card.secondary-card .cmw-logo-picker {
padding-left: var(--cmw-pattern-s);
padding-right: var(--cmw-pattern-s);
}
.cmw-pattern.card.secondary-card
.wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container{
padding-bottom: var(--cmw-pattern-s);
}
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon,
.cmw-pattern.card.secondary-card .cmw-logo-picker {
padding-top: var(--cmw-pattern-s);
}
@media (max-width: 834px) and (min-width:450px){
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon img.artwork {
width: 3rem;
height: 3rem;
}
}
@media (max-width:450px){
.cmw-pattern.card.secondary-card .cmw-pattern.card-icon img.artwork {
width: 2.5rem;
height: 2.5rem;
}
}
/* parts/cards/small-card/small-card.css */
.cmw-pattern.card.small-card {
--_custom-spacing: 0.75rem;
min-width: 100%;
}
/* Main card wrapper */
.cmw-pattern.card.small-card > .wp-block-group__inner-container {
gap: var(--_custom-spacing);
background: var(--cmw-secondary-card-background);
border-radius: 1rem;
overflow: hidden;
}
.cmw-pattern.card.small-card.bg-F0F8FE > .wp-block-group__inner-container {
background: #F0F8FE;
}
.cmw-pattern.card.small-card.no-icon .card-icon img{
opacity: 0;
}
/* Card img/logo/icon */
.cmw-pattern.card.small-card .cmw-pattern.card-icon,
.cmw-pattern.card.small-card .cmw-logo-picker {
padding-top: var(--cmw-pattern-xs);
}
.cmw-pattern.card.small-card .cmw-pattern.card-icon img {
height: 20px;
}
.cmw-pattern.card.small-card .wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container,
.cmw-pattern.card.small-card .cmw-pattern.card-icon,
.cmw-pattern.card.small-card .cmw-logo-picker {
padding-left: var(--cmw-pattern-xs);
padding-right: var(--cmw-pattern-xs);
}
/* When it has no img/log/icon add some padding below the button to make the card simetric */
.cmw-pattern.card.small-card.cmw-bigger-padding > .wp-block-group__inner-container {
--_custom-gap: 1.5rem;
gap: var(--_custom-gap);
.cmw-pattern:not(.card-icon) .button {
padding-bottom: var(--_custom-gap);
}
}
/* parts/cards/tertiary-card/tertiary-card.css */
/* Card wrapper */
.cmw-pattern.tertiary-card {
position: relative;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 8px 36px 0 rgba(156, 149, 181, 0.30);
display: flex;
height: 100%; /* parent grid/flex needs to allow this */
}
.cmw-pattern.tertiary-card > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
/* Hover: change heading color only when not over tags */
.cmw-pattern.tertiary-card:hover:not(:has(.tags:hover)) h3.cmw-y25-heading-3 {
color: var(--cmw-color-primary);
}
/* Card as link */
.cmw-pattern.tertiary-card .link-overlay {
position: absolute;
inset: 0;
z-index: 1;
}
.cmw-pattern.tertiary-card p {
margin: 0;
}
/* Card image */
.cmw-pattern.tertiary-card .card-img figure {
width: 100%;
margin: 0;
}
.cmw-pattern.tertiary-card figure img {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
}
/* --- DETAILS COLUMN --- */
.cmw-pattern.tertiary-card .tertiary-card-details {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
.cmw-pattern.tertiary-card .tertiary-card-details > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
/* heading + excerpt + date/tags group */
.cmw-pattern.tertiary-card .heading-excerpt-date-tags {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
.cmw-pattern.tertiary-card .heading-excerpt-date-tags > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
/* Push date/tags row to the bottom */
.cmw-pattern.tertiary-card .heading-excerpt-date-tags .date-tag-wrapper {
margin-top: auto;
}
/* When card has NO image, vertically center the details */
.cmw-pattern.tertiary-card:not(:has(.card-img img)) .tertiary-card-details {
justify-content: center;
}
/* Keyboard navigation */
.cmw-pattern.tertiary-card:has(.link-overlay:focus-visible) {
outline: 2px solid var(--cmw-color-primary) !important;
outline-offset: 2px;
}
/* Style for tertiary card with "no-shadow" class, we also add rounded corners to the image and remove the details inline padding */
.cmw-pattern.tertiary-card.no-shadow {
box-shadow: none;
figure img {
border-radius: 1rem;
}
.cmw-pattern.heading-excerpt-date-tags > div {
padding-inline: 0px;
}
}
/* parts/cards/quaternary-card/quaternary-card.css */
/* Main wrapper */
.quaternary-card {
border-radius: 1rem;
overflow: hidden;
}
.quaternary-card > .wp-block-group__inner-container {
position: relative;
display: flex;
flex-direction: column;
row-gap: 0.75rem;
background: var(--cmw-secondary-card-background);
padding: var(--cmw-pattern-s);
}
/* Card as link */
.quaternary-card .link-overlay {
position: absolute;
inset: 0;
z-index: 1;
}
/* Card heading */
.quaternary-card > .wp-block-group__inner-container .card-icon-and-heading p.cmw-y25-bold-paragraph {
font-size: 1.25rem;
text-wrap: pretty;
}
/* Icon container */
.quaternary-card > .wp-block-group__inner-container .card-icon-and-heading > div {
display: flex;
flex-direction: row;
align-items: center;
}
/* Icon */
.quaternary-card > .wp-block-group__inner-container .card-icon-and-heading img {
max-height: 24px;
display: inline-block;
transition: transform 0.6s ease;
transform-style: preserve-3d;
margin-right: 0.75rem;
}
/* When class cmw-flip-icon exists, flip the image in hover */
.quaternary-card.cmw-flip-icon img {
display: inline-block;
transition: transform 0.6s ease;
transform-style: preserve-3d;
}
.quaternary-card > .wp-block-group__inner-container:hover img {
transform: rotateY(180deg);
}
/* When class cmw-light-bg exists */
.quaternary-card.cmw-light-bg > .wp-block-group__inner-container {
background: var(--cmw-color-tertiary-blue);
}
/* When class cmw-primary-dark exists */
.quaternary-card.cmw-primary-dark > .wp-block-group__inner-container {
background: var(--cmw-primary-dark);
* {
color: white !important;
}
}
/* Keyboard navigation */
.cmw-pattern.quaternary-card:has(.link-overlay:focus-visible) {
outline: 2px solid var(--cmw-color-primary) !important;
outline-offset: 2px;
}
/* parts/cards/quinary-card/quinary-card.css */
/* Card wrapper */
.cmw-pattern.quinary-card {
position: relative;
border-radius: 1rem;
overflow: hidden;
box-shadow: 0 8px 36px 0 rgba(156, 149, 181, 0.30);
width: -webkit-fill-available;
width: -moz-available;
}
/* Inner div full height */
.cmw-pattern.quinary-card > div {
display: flex;
flex-direction: column;
}
/* Img */
.cmw-pattern.quinary-card figure {
margin: 0;
}
.cmw-pattern.quinary-card figure img {
min-width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
}
/* Card details */
.cmw-pattern.quinary-card .quinary-card-details {
padding: var(--cmw-pattern-xs);
height: 100%;
}
.cmw-pattern.quinary-card .quinary-card-details > div {
display: flex;
flex-direction: column;
.cmw-pattern.button {
margin-top: auto !important;
}
}
/* Card details heading */
.cmw-pattern.quinary-card .quinary-card-details p.cmw-y25-bold-paragraph {
margin-bottom: 1rem;
text-wrap: pretty;
}
/* Card details description */
.cmw-pattern.quinary-card .quinary-card-details p.cmw-patterns-paragraph {
margin-bottom: 2rem;
}
/* When 'blue-bg' background class is set */
.cmw-pattern.quinary-card.blue-bg {
background: linear-gradient(90deg, #0175D3 0%, #0184F1 100%), var(--cmw-White);
.quinary-card-details > div > * {
color: var(--cmw-White) !important;
}
.quinary-card-details .button.tertiary a {
background: var(--cmw-White) !important;
color: var(--cmw-Black) !important;
&:hover {
background-color: rgba(248,248,248,1) !important;
}
&:focus-visible {
outline-color: var(--cmw-White) !important;
}
}
}
/* When there is no image in the card, put the details vertically centered in the card */
.cmw-pattern.quinary-card:not(:has(img)) {
display: flex;
align-items: center;
}
/* parts/cards/quaternary-card/quaternary-card-and-img/quaternary-card-and-img.css */
/* Main wrapper */
.quaternary-card-and-img {
border-radius: 1rem;
overflow: hidden;
}
.quaternary-card-and-img > .wp-block-group__inner-container {
position: relative;
display: flex;
flex-direction: column;
/* Figure no margins */
figure {
margin: 0;
}
/* Remove top border radius from quaternary card */
.quaternary-card {
border-top-left-radius:0;
border-top-right-radius:0;
}
}
/* Keyboard navigation */
.cmw-pattern.quaternary-card-and-img:has(.link-overlay:focus-visible) {
outline: 2px solid var(--cmw-color-primary) !important;
outline-offset: 2px;
}
/* parts/cards/resource-card/resource-card.css */
/* MAIN WRAPPER */
.cmw-pattern.cmw-resource-card {
position: relative;
display: flex;
flex-direction: column;
border-radius: 1rem;
overflow: hidden;
height: 100%;
transition: transform 0.25s ease;
background-color: var(--cmw-color-light);
isolation: isolate;
--_persistent-padding: var(--cmw-pattern-xs);
/* Shared variable for fade width (optional; JS also reads it) */
--fade-w: 16px;
.non-actionable-wrap {
position: relative; /* needed for ::before/::after fade overlays */
/* Last Chip should have a small right margin to escape the fade overlay*/
.tag-label:last-child {
margin-right: calc(var(--fade-w) / 2);
}
}
a {
z-index: 2;
}
/* Whole card as link */
a.link-overlay {
position: absolute;
inset: 0;
z-index: 1;
}
}
.cmw-pattern.cmw-resource-card .resource-card-heading p {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* Shadow class present */
.cmw-pattern.cmw-resource-card.shadow {
box-shadow: var(--cmw-default-shadow);
}
.cmw-pattern.cmw-resource-card .wp-block-group__inner-container {
display: flex;
flex-direction: column;
flex:1;
padding: 0;
}
/* When focused */
.cmw-pattern.cmw-resource-card:has(.link-overlay:focus-visible) {
outline: 2px solid var(--cmw-color-primary);
outline-offset: 1px;
}
/* When hover or focus on the card */
.cmw-pattern.cmw-resource-card:hover {
transform: translateY(-4px);
}
/* CARD THUMBNAIL or Icon */
.cmw-pattern.cmw-resource-card .cmw-resource-card-img figure {
margin: 0;
/* When class exists it measn it's an icon or logo, not a thumnail image */
img[class] {
height: 3rem;
margin-top: var(--_persistent-padding);
margin-left: var(--_persistent-padding);
}
}
/* CARD DETAILS */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details {
display: flex;
flex-direction: column;
flex: 1;
padding: var(--_persistent-padding);
overflow: hidden;
/* Chips (clickable or not), when populated */
.non-actionable-wrap:has(.tag-label),
.cmw-pattern.tags {
margin-bottom: 0.75rem;
}
/* Heading */
.resource-card-heading .cmw-y25-bold-paragraph {
margin-bottom: 1.25rem;
}
/* If description exists, should have some margin bottom */
.resource-card-description:has(*) {
margin-bottom: 2rem;
}
/* CTA */
.action-link {
margin-top: auto;
}
}
/* =========================================================
TAGS scroll behaviour
========================================================= */
/* Make the tags row a clipped viewport inside the card.
JS will set overflow-x:auto inline; we keep it visually clean. */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags {
max-width: 100%;
overflow: hidden; /* hide scrollbars / keep clean */
position: relative;
display: flex;
/* Hide scrollbars while still allowing programmatic scroll */
-ms-overflow-style: none;
scrollbar-width: none;
}
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags::-webkit-scrollbar {
display: none;
}
/* Ensure tags are inline in resource cards even if core flex utilities aren't loaded */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags .tag-list {
display: inline-flex;
flex-wrap: nowrap;
align-items: center;
gap: 0.5rem;
width: max-content;
}
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags .tag-label,
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags .tag-sep {
flex: 0 0 auto;
}
/* fade overlay effect (only visible when overflow exists) */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap::after,
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap::before {
content: "";
position: absolute;
top: 0;
width: var(--fade-w);
height: 100%;
pointer-events: none;
z-index: 2;
opacity: 0; /* hidden by default */
transition: opacity 150ms ease;
}
/* Left fade position */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap::before {
left: 0px;
}
/* Right fade position */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap::after {
right: 0;
background: linear-gradient(to right, transparent, #fff);
}
/* Show fades only when JS says overflow exists */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap.cmw-has-overflow::before,
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap.cmw-has-overflow::after {
opacity: 1;
}
/* Add background after it started scrolling */
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-wrap.cmw-has-overflow.cmw-is-scrolled::before {
background: linear-gradient(to left, transparent, #fff);
}
/* Reduce motion support */
@media (prefers-reduced-motion: reduce) {
.cmw-pattern.cmw-resource-card .cmw-resource-card-details .non-actionable-tags {
scroll-behavior: auto;
}
}
/* parts/cards/interface-partner-card/interface-partner-card.css */
.cmw-interface-partner-card {
position: relative;
display: flex;
flex-direction: column;
height: 100%;
overflow: visible;
border: 1px solid var(--cmw-color-muted);
border-radius: var(--cmw-pattern-2xs);
background: var(--cmw-color-light);
}
.cmw-interface-partner-card .link-overlay {
position: absolute;
inset: 0;
z-index: 2;
}
.cmw-interface-partner-card__edit-link {
position: absolute;
top: 12px;
left: 12px;
z-index: 4;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 6px 10px;
border: 1px solid var(--cmw-color-dark);
border-radius: 999px;
background: rgba(255, 255, 255, 0.96);
color: var(--cmw-color-dark);
font-size: 12px;
font-weight: 600;
line-height: 1;
text-decoration: none;
opacity: 0;
transform: translateY(-4px);
pointer-events: none;
transition:
opacity 0.18s ease,
transform 0.18s ease,
background-color 0.18s ease,
color 0.18s ease;
}
.cmw-interface-partner-card:hover .cmw-interface-partner-card__edit-link,
.cmw-interface-partner-card:focus-within .cmw-interface-partner-card__edit-link {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.cmw-interface-partner-card__edit-link:hover,
.cmw-interface-partner-card__edit-link:focus-visible {
background: var(--cmw-color-dark);
color: var(--cmw-color-light);
outline: none;
}
.cmw-interface-partner-card__media,
.cmw-interface-partner-card__body {
position: relative;
z-index: 3;
pointer-events: none;
}
.cmw-interface-partner-card__media {
min-height: 120px;
padding: 20px 20px 0;
}
.cmw-interface-partner-card__body {
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: space-between;
gap: var(--cmw-pattern-xs);
width: 100%;
padding: 20px;
}
.cmw-interface-partner-card__logo-wrap {
display: flex;
align-items: flex-start;
width: min(160px, 100%);
min-height: 100px;
max-width: 100%;
}
.cmw-interface-partner-card__logo-wrap img {
display: block;
width: auto;
max-width: 100%;
max-height: 100px;
object-fit: contain;
}
.cmw-interface-partner-card__badge {
position: absolute;
top: -9px;
right: -9px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px 10px;
border-radius: 999px;
border: 1px solid var(--cmw-color-primary);
background: var(--cmw-color-light);
color: var(--cmw-color-dark);
font-size: 13px;
font-weight: 600;
line-height: 1;
white-space: nowrap;
z-index: 3;
pointer-events: none;
}
.cmw-media-query-grid.cmw-interface-partners-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
column-gap: 1rem;
row-gap: 2.5rem;
align-items: stretch;
}
.cmw-media-query-grid.cmw-interface-partners-grid > .cmw-media-query-grid__item,
.cmw-media-query-grid.cmw-interface-partners-grid > .wp-block-group__inner-container > .cmw-media-query-grid__item {
display: flex;
min-width: 0;
height: 100%;
}
.cmw-media-query-grid.cmw-interface-partners-grid > .cmw-media-query-grid__item > *,
.cmw-media-query-grid.cmw-interface-partners-grid > .wp-block-group__inner-container > .cmw-media-query-grid__item > * {
width: 100%;
}
.cmw-interface-partner-card.is-yardi-solution .cmw-interface-partner-card__badge {
border-color: var(--cmw-color-primary);
background: var(--cmw-color-primary);
color: var(--cmw-color-light);
}
.cmw-interface-partner-card__content {
display: grid;
gap: var(--cmw-pattern-4xs);
width: 100%;
}
.cmw-interface-partner-card__title-row {
display: block;
width: 100%;
}
.cmw-interface-partner-card__title-row .cmw-y25-bold-paragraph {
margin: 0;
font-size: 16px;
line-height: 1.4;
}
.cmw-interface-partner-card__title-icon {
display: inline-flex;
align-items: center;
margin-left: 8px;
line-height: 1;
vertical-align: baseline;
transform: translateY(1px);
color: var(--cmw-color-medium);
}
.cmw-interface-partner-card__title-icon svg,
.cmw-interface-partner-card__title-icon img {
display: block;
width: 0.8125em;
height: 0.8125em;
}
.cmw-interface-partner-card__title-icon img {
filter: brightness(0) saturate(100%) invert(35%) sepia(31%) saturate(15%)
hue-rotate(316deg) brightness(92%) contrast(95%);
}
.cmw-interface-partner-card:hover .cmw-interface-partner-card__title-icon img,
.cmw-interface-partner-card:has(.link-overlay:focus-visible)
.cmw-interface-partner-card__title-icon img {
filter: var(--cmw-primary-color-filter);
}
.cmw-interface-partner-card__content .cmw-patterns-paragraph.secondary {
display: block;
margin: 0;
color: var(--cmw-color-medium);
font-size: 13px;
line-height: 1.4;
}
.cmw-interface-partner-chip-list {
position: relative;
z-index: 3;
display: flex;
flex-wrap: wrap;
gap: var(--cmw-pattern-4xs);
pointer-events: auto;
}
.cmw-interface-partner-chip {
position: relative;
z-index: 3;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px 8px;
border-radius: 4px;
background: var(--cmw-color-tertiary-blue);
color: #58758c;
font-size: 13px;
font-weight: 600;
line-height: 1;
white-space: nowrap;
text-decoration: none;
pointer-events: auto;
}
.cmw-interface-partner-chip:hover,
.cmw-interface-partner-chip:focus-visible {
background: #dceefa;
color: #3d6680;
outline: none;
}
@media (max-width: 767px) {
.cmw-media-query-grid.cmw-interface-partners-grid {
grid-template-columns: 1fr;
}
.cmw-interface-partner-card__badge {
right: 12px;
top: 12px;
}
.cmw-interface-partner-card__edit-link {
opacity: 1;
transform: none;
pointer-events: auto;
}
}
@media (min-width: 768px) and (max-width: 1099px) {
.cmw-media-query-grid.cmw-interface-partners-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
/* parts/details/basic/basic.css */
/* Main wrapper */
.cmw-pattern.details-basic {
width: 100%;
padding: var(--cmw-pattern-xs) var(--cmw-pattern-xs) var(--cmw-pattern-xs) var(--cmw-pattern-xs);
}
/* Heading 3 */
.cmw-pattern.details-basic .cmw-y25-heading-3 {
margin-top: 20px;
}
/* Action link/button */
.cmw-pattern.details-basic .action-link {
margin-top: var(--cmw-pattern-xs);
}
.cmw-pattern.details-basic #cmw-y25-bold-paragraph.cmw-y25-bold-paragraph {
margin-top: var(--cmw-pattern-3xs);
margin-bottom: var(--cmw-pattern-3xs);
}
/* parts/details/heading-excerpt-date-tags/heading-excerpt-date-tags.css */
/* Main wrapper */
.cmw-pattern.heading-excerpt-date-tags > div {
padding: var(--cmw-pattern-xs);
display: flex;
flex-direction: column;
gap: 1.25rem;
}
/* Heading and excerpt wrapper */
.cmw-pattern.heading-excerpt-date-tags .heading-excerpt-wrapper > div {
display: flex;
flex-direction: column;
gap: 0.75rem;
/* Headeing 3 */
h3.cmw-y25-heading-3 {
font-size: var(--cmw-medium-font-size);
text-wrap: pretty;
}
/* Excerpt */
p.cmw-patterns-paragraph.secondary {
font-size: 0.8725rem;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
}
/* Date and tag wrapper */
.cmw-pattern.heading-excerpt-date-tags .date-tag-wrapper {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
column-gap: 1.5rem;
row-gap: 1rem;
/* Date */
p.cmw-patterns-paragraph.secondary {
font-size: 0.8125rem;
line-height: 100%;
}
}
/* parts/details/interface-partner-profile/interface-partner-profile.css */
.cmw-interface-partner-profile {
display: grid;
grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.95fr);
gap: 16px;
}
.cmw-interface-partner-profile__primary,
.cmw-interface-partner-profile__facts {
border: 1px solid #eee;
border-radius: 16px;
background: #fff;
}
.cmw-interface-partner-profile__primary {
display: grid;
gap: 32px;
padding: clamp(24px, 2.5vw, 32px);
}
.cmw-interface-partner-profile__header {
display: flex;
gap: clamp(24px, 3vw, 40px);
justify-content: space-between;
}
.cmw-interface-partner-profile__content {
display: grid;
gap: 16px;
flex: 1 1 auto;
}
.cmw-interface-partner-profile__badge {
display: inline-flex;
align-items: center;
justify-content: center;
width: fit-content;
padding: 4px 10px;
border-radius: 999px;
border: 1px solid #0072ce;
background: #fff;
color: #111;
font-size: 13px;
font-weight: 600;
line-height: 1;
}
.cmw-interface-partner-profile__badge.is-yardi-solution {
background: #0072ce;
color: #fff;
}
.cmw-interface-partner-profile__title-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.cmw-interface-partner-profile__title-row .cmw-y25-heading-2 {
margin: 0;
}
.cmw-interface-partner-profile__title-icon {
display: inline-flex;
color: #3d6680;
}
.cmw-interface-partner-profile__title-icon svg,
.cmw-interface-partner-profile__title-icon img {
width: 16px;
height: 16px;
}
.cmw-interface-partner-profile__content .cmw-y25-medium-paragraph {
margin: 0;
color: #595959;
}
.cmw-interface-partner-profile__logo-wrap {
display: flex;
flex: 0 0 min(220px, 32%);
align-items: flex-start;
justify-content: center;
min-height: 120px;
padding: 12px 0 0;
}
.cmw-interface-partner-profile__logo-wrap img {
display: block;
width: auto;
max-width: 100%;
max-height: 110px;
object-fit: contain;
}
.cmw-interface-partner-profile__website {
display: flex;
flex-wrap: wrap;
align-items: end;
justify-content: space-between;
gap: 16px;
padding-top: 24px;
border-top: 1px solid #eee;
}
.cmw-interface-partner-profile__website-copy {
display: grid;
gap: 8px;
}
.cmw-interface-partner-profile__website-label {
margin: 0;
color: #111;
font-size: 18px;
font-weight: 650;
line-height: 1.3;
}
.cmw-interface-partner-profile__facts {
display: grid;
gap: 24px;
align-content: start;
padding: 24px;
}
.cmw-interface-partner-profile__fact-group {
display: grid;
gap: 12px;
}
.cmw-interface-partner-profile__fact-group .eyebrow {
margin: 0;
}
.cmw-interface-partner-profile__fact-group + .cmw-interface-partner-profile__fact-group {
padding-top: 24px;
border-top: 1px solid #eee;
}
@media (max-width: 900px) {
.cmw-interface-partner-profile {
grid-template-columns: 1fr;
}
.cmw-interface-partner-profile__header {
flex-direction: column-reverse;
}
.cmw-interface-partner-profile__logo-wrap {
justify-content: flex-start;
flex-basis: auto;
min-height: 0;
padding-top: 0;
}
.cmw-interface-partner-profile__website {
align-items: flex-start;
}
.cmw-interface-partner-profile__website .cmw-pattern.primary.button {
width: 100%;
}
}
/* parts/details/eyebrow-excerpt/eyebrow-excerpt.css */
/* Eyebrow and excerpt wrapper */
.eyebrow-excerpt .eyebrow-excerpt-wrapper > div {
display: flex;
flex-direction: column;
gap: 1rem;
}
/* Excerpt */
.eyebrow-excerpt .eyebrow-excerpt-wrapper p.cmw-patterns-paragraph.secondary {
font-size: var(--cmw-small-font-size);
}
/* parts/details/author-profile/author-profile.css */
/* Base author profile structure */
.cmw-pattern.author-profile.cmw-author-profile {
display: grid;
grid-template-columns: 1fr;
}
.cmw-pattern.author-profile.cmw-author-profile:has(.cmw-author-avatar img) {
grid-template-columns: 180px 1fr;
grid-column-gap: clamp(2rem, 1.2958rem + 3.0047vw, 4rem);
grid-row-gap: 2rem;
}
.cmw-pattern.author-profile .cmw-author-avatar img {
border-radius: 12px;
aspect-ratio: 1 / 1;
object-fit: cover;
max-height: 180px;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-blog-custom-eyebrow {
margin-bottom: 1rem;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-name-and-social {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
column-gap: 1.5rem;
row-gap: 1rem;
margin-bottom: 1rem;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-social {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 0.75rem;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-social a {
height: 2rem;
aspect-ratio: 1 / 1;
background: #f8f8f8;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-social a svg {
height: 50%;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-social a svg path {
fill: #bdbdbd;
}
.cmw-pattern.author-profile .cmw-author-info .cmw-author-social a:hover svg path {
fill: var(--cmw-Primary-Blue);
}
@media (max-width: 600px) {
.cmw-pattern.author-profile.cmw-author-profile:has(.cmw-author-avatar img) {
grid-template-columns: 1fr;
grid-row-gap: 1rem;
}
}
/* Resource campaign host variant */
.single-resource-campaign .cmw-resource-campaign-host-wrap {
width: 100%;
padding: 4rem 0 0;
}
.single-resource-campaign .cmw-resource-campaign-host-inner {
width: min(83.33%, 1200px);
margin-inline: auto;
padding-top: 5rem;
border-top: 1px solid var(--cmw-Medium-Gray, #dcdcdc);
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host {
grid-template-columns: 10rem 1fr;
column-gap: 3rem;
row-gap: 1.5rem;
align-items: start;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-avatar img {
width: 10rem;
height: 10rem;
border-radius: 1rem;
object-fit: cover;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-info .cmw-blog-custom-eyebrow {
margin-bottom: 0.75rem;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-info .cmw-blog-custom-eyebrow .cmw-pattern.eyebrow {
color: #0072ce;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-name-and-social {
column-gap: 1.5rem;
row-gap: 0.75rem;
margin-bottom: 1.5rem;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-name h2.cmw-y25-heading-2 {
font-size: 2rem;
font-weight: 400;
line-height: 1.2;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host .cmw-author-description .cmw-pattern.medium-paragraph {
color: #595959;
}
@media (max-width: 900px) {
.single-resource-campaign .cmw-resource-campaign-host-inner {
width: min(90%, 1200px);
padding-top: 3rem;
}
.single-resource-campaign .cmw-pattern.author-profile.cmw-author-profile.cmw-resource-campaign-host {
grid-template-columns: 1fr;
}
}
/* spacers/spacer-xs/spacer-xs.css */
.cmw-pattern.spacer-xs{
height: var(--cmw-pattern-xs)!important;
}
/* spacers/spacer-m/spacer-m.css */
.cmw-pattern.spacer-m{
height: var(--cmw-pattern-m)!important;
}
/* spacers/spacer-l/spacer-l.css */
.cmw-pattern.spacer-l{
height: var(--cmw-pattern-l)!important;
}
/* spacers/spacer-xl/spacer-xl.css */
.cmw-pattern.spacer-xl{
height: var(--cmw-pattern-xl)!important;
}
/* spacers/spacer-2xl/spacer-2xl.css */
.cmw-pattern.spacer-2xl{
height: var(--cmw-pattern-2xl)!important;
}
/* spacers/spacer-s/spacer-s.css */
.cmw-pattern.spacer-s{
height: var(--cmw-pattern-s)!important;
}
/* spacers/vertical-separator/vertical-separator.css */
.cmw-vertical-separator-wrapper .wp-block-group__inner-container {
display: flex;
align-items: stretch;
margin-inline: clamp(0.25rem, 0.1620rem + 0.3756vw, 0.5rem);
}
.cmw-vertical-separator {
width: 1px;
background: var(--cmw-color-muted);
height: 32px
}
/* spacers/spacer-4xs/spacer-4xs.css */
.cmw-pattern.spacer-4xs{
height: var(--cmw-pattern-4xs)!important;
}
/* spacers/spacer-5xs/spacer-5xs.css */
.cmw-pattern.spacer-5xs{
height: var(--cmw-pattern-5xs)!important;
}
/* spacers/spacer-5xl/spacer-5xl.css */
.cmw-pattern.spacer-5xl{
height: var(--cmw-pattern-5xl)!important;
}
/* grids/default-grid/default-grid.css */
/* Main wrapper */
.cmw-default-grid {
--gap: var(--cmw-pattern-xs);
--grid-max-width: 1200px;
--col-min-width: calc((var(--grid-max-width) - (var(--columns) - 1) * var(--gap)) / var(--columns));
width: min(90%, var(--grid-max-width));
margin-inline: auto;
/* Ensure 2 columns can always fit */
--min-2-col-width: calc((100% - var(--gap)) / 2);
}
/* Bigger grid gap helper classes */
.cmw-default-grid.cmw-gap-m {
--gap: var(--cmw-pattern-m);
}
.cmw-default-grid.cmw-gap-xl {
--gap: var(--cmw-pattern-xl);
}
/* Inner wrapper (automatic) */
.cmw-default-grid > .wp-block-group__inner-container {
display: grid;
gap: var(--gap);
grid-template-columns: repeat( auto-fill, minmax(min(var(--col-min-width), var(--min-2-col-width)), 1fr));
grid-auto-rows: auto;
}
/* Individual item */
.cmw-default-grid > .wp-block-group__inner-container > .wp-block-group {
position: relative;
}
/* Individual item inner wrapper (automatic). Make each grid cell stretch and allow its inner container to fill the height */
.cmw-default-grid > .wp-block-group__inner-container > .wp-block-group > .wp-block-group__inner-container {
height: 100%;
}
.columns-2 { --columns: 2; }
.columns-3 { --columns: 3; }
.columns-4 { --columns: 4; }
.columns-5 { --columns: 5; }
.columns-6 { --columns: 6; }
.columns-7 { --columns: 7; }
/* Utility: align items to end on big screens only */
@media (min-width: 760px) {
.cmw-default-grid .cmw-dynamic-grid-align-end {
align-self: end;
}
}
/* Utility: force single column (small screens only) */
@media (max-width: 768px) {
.cmw-default-grid.cmw-force-1-column-small-screens > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
}
}
/* grids/slide-grid/slide-grid.css */
/* Base styles */
.cmw-slide-grid {
--gap: var(--cmw-pattern-xs);
--grid-max-width: 1200px;
--col-min-width: calc((var(--grid-max-width) - (var(--columns) - 1) * var(--gap, 1rem)) / var(--columns));
}
.cmw-slide-grid {
display: grid !important;
margin-left:auto;
margin-right:auto;
gap: var(--gap);
grid-template-columns: repeat(auto-fill, minmax(var(--col-min-width), 2fr));
grid-auto-rows: auto;
margin-bottom: 0;
}
.cmw-slide-grid > .wp-block-column {
display: flex;
height: auto;
}
.columns-2 { --columns: 2; }
.columns-3 { --columns: 3; }
.columns-4 { --columns: 4; }
.columns-5 { --columns: 5; }
.columns-6 { --columns: 6; }
.columns-7 { --columns: 7; --gap: var(--cmw-pattern-2xs);}
@media (max-width: 920px) {
.cmw-slide-grid {
display: flex !important;
overflow-x: auto;
scroll-snap-type: x mandatory;
gap: 1rem;
flex-wrap: nowrap !important;
padding: 1rem 0px !important;
}
.cmw-slide-grid .wp-block-column {
max-width: 80%; /* The next card is always partially visible */
flex: 0 0 auto !important;
scroll-snap-align: start;
}
.cmw-slide-grid .wp-block-column:last-child {
margin-right: 1rem;
}
.cmw-slide-grid::-webkit-scrollbar {
display: none;
}
.cmw-slide-grid {
-ms-overflow-style: none;
scrollbar-width: none;
}
}
/* grids/media-query-grid/media-query-grid.css */
/**
* IMPORTANT
* This grid’s column count and breakpoints are mirrored in PHP for responsive image sizing.
*
* If you change breakpoints or column counts here, you MUST update:
* cmw_post_thumbnail_default_sizes()
* in:
* plugins/cmw-y25-cpt/thumbnails/thumbnail-helpers.php
*
* Note: column gaps are intentionally NOT mirrored; image sizes use
* a safe approximation to avoid tight coupling to spacing values.
*/
/* Desktop */
.cmw-media-query-grid > .wp-block-group__inner-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-rows: auto;
row-gap: 3rem;
column-gap: 2rem;
}
/* Individual item */
.cmw-media-query-grid > .wp-block-group__inner-container .cmw-media-query-grid__item {
min-width: 0;
> .wp-block-group__inner-container {
height: 100%;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1099px) {
.cmw-media-query-grid > .wp-block-group__inner-container {
grid-template-columns: repeat(2, 1fr);
row-gap: 2rem;
column-gap: 1.5rem;
}
}
/* Mobile */
@media (max-width: 767px) {
.cmw-media-query-grid > .wp-block-group__inner-container {
grid-template-columns: 1fr;
row-gap: 1.5rem;
column-gap: 1.5rem;
}
}
/* slides/default-slide/default-slide.css */
.cmw-pattern.slider-wrapper {
display: flex;
overflow-x: auto;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
scroll-behavior: smooth;
}
.cmw-pattern.slide {
scroll-snap-align: start;
flex: 0 0 100%;
box-sizing: border-box;
}
/* slides/default-slider/default-slider.css */
/* Wraper containing text and arrows */
.cmw-pattern.slider-nav-container {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
gap: 1.5rem;
}
/* Arrows */
.cmw-pattern.slider-nav-container .slider-nav-arrows {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem;
}
.cmw-pattern.slider-nav-container .slider-nav-arrows button {
border-radius: 4px;
border: 1px solid #EEEEEE;
background: transparent;
padding: 0;
cursor: pointer;
}
.cmw-pattern.slider-nav-container .slider-nav-arrows button.slider-nav:before {
content: '';
background-repeat: no-repeat;
background-position: center;
display: block;
width: 3rem;
height: 3rem;
}
.cmw-pattern.slider-nav-container .slider-nav-arrows button.slider-nav.prev:before {
background-image: url("../cmw-icons/svg/functionals/left_arrow.svg");
}
.cmw-pattern.slider-nav-container .slider-nav-arrows button.slider-nav.next:before {
background-image: url("../cmw-icons/svg/functionals/right_arrow.svg");
}
.cmw-pattern.slider-nav-arrows button.cmw-pattern.slider-nav[disabled] {
opacity: 0.5;
}
/* Slider grid containing the mini-cards */
.cmw-pattern.slider-wrapper {
position: relative;
overflow: hidden;
width: 100%;
isolation: isolate;
}
.cmw-pattern.slider-wrapper .default-container {
width: 100%;
margin: 0;
}
.cmw-pattern.slider-wrapper .cmw-default-grid {
grid-template-columns: repeat(var(--columns), 1fr);
max-width: var(--grid-max-width);
}
.cmw-pattern.slider-wrapper .slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
transition: transform 0.6s ease, opacity 0.6s ease;
opacity: 0;
z-index: 1;
}
.cmw-pattern.slider-wrapper .slide.active {
opacity: 1;
z-index: 2;
}
.cmw-pattern.slider-wrapper .slide.to-left {
transform: translateX(-100%);
opacity: 0;
}
.cmw-pattern.slider-wrapper .slide.to-right {
transform: translateX(100%);
opacity: 0;
}
/* cta/simple/simple.css */
/* Wrapper for text and CTA button */
.cmw-pattern.cta.simple > .wp-block-group__inner-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-end;
column-gap: var(--cmw-pattern-5xl);
row-gap: 1.5rem;
}
/* Style the text part */
.cmw-pattern.cta-content {
flex: 1 1 500px;
}
.cmw-pattern.cta-content > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
gap: var(--cmw-pattern-2xs);
> p {
margin: 0;
}
}
/* cta/resource-gate/resource-gate.css */
/* Main wrapper */
.cmw-pattern.cta.resource-gate {
padding-block: clamp(2rem, 7vw, 5rem);
background: var(--cmw-blue-gradient-soft, linear-gradient(0deg, rgba(0, 114, 206, 0.15) 0%, rgba(255, 255, 255, 0) 30%));
min-height: 100dvh;
}
/* Inner wrapper */
.cmw-pattern.cta.resource-gate .resource-gate__wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: start;
gap: var(--cmw-pattern-xl);
}
.cmw-pattern.cta.resource-gate .resource-gate__content {
display: flex;
gap: 2rem;
}
/* Resource heading */
.cmw-pattern.cta.resource-gate .resource-gate__content h1.cmw-y25-heading-1.cmw-pattern {
font-size: clamp(1.5rem, 4vw, 1.875rem) !important;
font-weight: 400;
line-height: 130%;
text-wrap: pretty;
}
/* Heading underline */
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__divider {
width: 7.5rem;
height: 0.125rem;
margin: 0;
background: var(--cmw-special-picked-gate-color, var(--cmw-color-primary));
border-top: none;
}
/* Row with image and heading - when image exists */
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__media-row {
display: grid;
grid-template-columns: auto 1fr;
align-items: end;
gap: var(--cmw-pattern-s);
margin-bottom: var(--cmw-pattern-s);
@media (max-width: 600px) {
grid-template-columns: 1fr;
}
.resource-gate__media {
width: 10rem;
}
img {
box-shadow: 0 6px 24px 0 rgba(156, 149, 181, 0.30);
}
}
/* Row without image, just a heading - when image does not exist */
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__heading-row {
margin-bottom: var(--cmw-pattern-s);
}
/* Collapsible paragraph that works under 1000px */
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible {
position: relative;
margin-bottom: var(--cmw-pattern-xs);
}
/* Rich Text Field */
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__rtf {
margin-bottom: var(--cmw-pattern-xs);
}
/* Style for the list inside the rich text */
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__rtf ul {
list-style: none;
margin: 0;
padding: 0;
display: grid;
}
.cmw-pattern.cta.resource-gate .resource-gate__content .resource-gate__rtf ul li {
position: relative;
padding-left: 22px;
font-weight: 500;
position: relative;
color: var(--cmw-color-medium);
strong {
font-weight: 650;
color: #000000;
}
/* Markers */
&::before {
content: "";
position: absolute;
left:0;
top:8px;
width: 8px;
height: 8px;
background: var( --cmw-special-picked-gate-color, var(--cmw-color-primary));
border-radius: 50%;
}
}
/* Form */
.cmw-pattern.cta.resource-gate .resource-gate__form-card {
border-radius: 1rem;
background: var(--cmw-White);
box-shadow: 0 8px 80px 0 rgba(156, 149, 181, 0.30);
padding: clamp(1.5rem, 4vw, 2.5rem);
/* Form header */
.resource-gate__form-header {
display: grid;
grid-template-columns: auto 1fr;
gap:1rem;
align-items: center;
/* Icon */
.resource-gate__icon-bg {
display: flex;
padding: 1rem;
border-radius: 0.5rem;
background: var(--cmw-special-picked-gate-color-alpha, rgba(0,114,206,0.08) );
img {
width: 20px;
aspect-ratio: 1/1;
filter: var(--cmw-special-picked-gate-filter);
}
}
/* Label */
.resource-gate__form-header-label {
font-size: 1.25rem;
font-weight: 500;
color: var(--cmw-color-dark);
}
}
}
@supports (-webkit-touch-callout: none) {
.cmw-pattern.cta.resource-gate .resource-gate__form-card .resource-gate__form-header .resource-gate__icon-bg {
filter: brightness(0.9);
}
}
/* PRODUCT DEMO type - specific style changes */
/* Stack elements one on top of the other, thumbnail on top */
.cmw-pattern.cta.resource-gate.type--demo .resource-gate__content .resource-gate__media-row {
grid-template-columns: 1fr;
margin-bottom: 1rem;
}
/* Thumbnail */
.cmw-pattern.cta.resource-gate.type--demo .resource-gate__content .resource-gate__media-row .resource-gate__media {
max-width: min(100%, 25rem);
width: unset;
border-radius: 0.75rem;
overflow: hidden;
box-shadow: 0 6px 24px 0 rgba(156, 149, 181, 0.30);
}
/* Hide the divider */
.cmw-pattern.cta.resource-gate.type--demo .resource-gate__content .resource-gate__divider {
display: none;
}
/* Responsive */
@media (max-width: 1000px) {
.cmw-pattern.cta.resource-gate .resource-gate__wrapper {
grid-template-columns: 1fr;
}
/* Collapsible paragraph */
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible {
cursor: pointer;
height: 60px;
overflow: hidden;
transition: height 0.35s ease;
}
/* Fade overlay */
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible:not(.is-expanded)::before {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 2rem;
pointer-events: none;
/* If the paragraph area is on a colored background, swap white for that bg */
background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
}
/* "More" / "Less" visual cue */
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible::after {
content: "More";
position: absolute;
right: 0;
bottom: 2px;
padding-inline: 0.5rem;
pointer-events: none;
background: white;
overflow: hidden;
color: var(--cmw-color-dark);
font-size: 0.875rem;
font-weight: 600;
text-decoration-line: underline;
}
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible.is-expanded {
height: auto;
}
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible.is-expanded::after {
display: none;
}
/* Keyboard focus visibility (required for ADA/WCAG) */
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible:focus {
outline: none;
}
.cmw-pattern.cta.resource-gate .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible:focus-visible {
outline: 2px solid var(--cmw-color-primary);
outline-offset: 2px;
}
/* PRODUCT DEMO type - specific style changes */
.cmw-pattern.cta.resource-gate.type--demo .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible:not(.is-expanded)::before {
display: none;
}
.cmw-pattern.cta.resource-gate.type--demo .resource-gate__paragraph-collapsible[data-paragraph-collapsible].is-collapsible::after {
bottom: calc(clamp(0rem, -0.3000rem + 0.9600vw, 0.3rem) * -1);
}
}
/* cta/related-resources/related-resources.css */
/* Main wrapper */
.cmw-pattern.cta.related-resources .related-resources-wrapper {
display: flex;
gap: var(--cmw-pattern-l);
align-items: center;
flex-wrap: wrap;
}
/* Random resource card */
.cmw-pattern.cta.related-resources .related-resources-wrapper > .random-resources-card {
max-width: 368px;
width: 368px;
margin-right: 50px;
position: relative;
isolation: isolate;
z-index: 0;
}
/* Right side - data from meta */
.cmw-pattern.cta.related-resources .related-resources-wrapper > .related-resources-from-meta {
flex: 1 1 0;
min-width: 400px;
width: auto;
}
/* Fake cards behind the random resource card */
.random-resources-card::before,
.random-resources-card::after {
content: "";
position: absolute;
inset: 0;
box-shadow: var(--cmw-default-shadow); /* As the resource card */
pointer-events: none;
border-radius: 1rem; /* As the resource card */
}
/* middle card */
.random-resources-card::before {
transform: translateX(32px) scale(0.95);
background-image: linear-gradient(to bottom, #ebeef2 60%, #ffffff 40%);
z-index: -1;
}
/* back card */
.random-resources-card::after {
transform: translateX(70px) scale(0.85);
background-image: linear-gradient(to bottom, #ebeef2 55%, #ffffff 45%);
z-index: -2;
}
/* When hover over the card, move it to the right instead of up, as normaly goes */
.cmw-pattern.cta.related-resources .related-resources-wrapper > .random-resources-card:hover .cmw-resource-card {
transform: translateX(-12px) translateY(0px) !important;
}
/* cta/interactive-banner/interactive-banner.css */
/* Main wrapper */
.cmw-interactive-banner--default {
--_column-gap: 1.5rem;
--_row-gap: 1rem;
background: var(--cmw-color-primary);
padding: var(--cmw-pattern-m) !important;
border-radius: 1rem;
}
/* Gradient background */
.cmw-interactive-banner--default.linear-gradient-background {
background: linear-gradient(0deg, var(--cmw-color-primary) 0%, var(--cmw-color-secondary-blue) 100%), var(--cmw-color-primary);
}
/* Inner wrapper */
.cmw-interactive-banner--default > div {
display: flex;
flex-direction: row;
gap: var(--_column-gap);
flex-wrap: wrap;
}
/* ---------------- Text side --------------------- */
.cmw-interactive-banner--default .interactive-banner-content {
flex: 1 1 20rem;
min-width: 16rem;
> div {
display: flex;
flex-direction: column;
gap: var(--_row-gap);
/* White text inside the text wrapper */
* {
color: white;
}
}
}
/* Heading styles */
.cmw-interactive-banner--default .interactive-banner-content h2 {
font-size: clamp(1.5rem, 1.3239rem + 0.7512vw, 2rem) !important;
line-height: 140%;
}
/* Paragraph styles */
.cmw-interactive-banner--default .interactive-banner-content p {
margin: 0;
}
/* ---------------- Action side --------------------- */
.cmw-interactive-banner--default .interactive-banner-action {
flex: 0 0 auto;
width: fit-content;
max-width: 100%;
.wp-block-button__link:focus-visible {
outline-color: var(--cmw-color-light) !important;
}
}
/* ---------------- EXTRA: Utility classes for text --------------------- */
.cmw-interactive-banner--default span.black-text {
color: black !important;
}
.cmw-interactive-banner--default span.bold-text {
font-weight: 500 !important;
}
/* cta/small-vertical/small-vertical.css */
.cmw-small-vertical-cta {
display: grid;
gap: var(--cmw-pattern-2xs);
width: min(100%, 288px);
align-items: stretch;
padding: var(--cmw-pattern-xs) var(--cmw-pattern-3xs) var(--cmw-pattern-3xs);
border: 1px solid var(--cmw-color-muted);
border-radius: var(--cmw-pattern-3xs);
background: var(--cmw-color-light);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}
.cmw-small-vertical-cta__heading {
margin: 0;
color: var(--cmw-color-dark);
font-size: var(--cmw-medium-font-size);
line-height: 1.4;
text-align: center;
}
.cmw-small-vertical-cta__heading strong {
display: inline-block;
font-weight: 650;
}
.cmw-small-vertical-cta .wp-block-button.cmw-small-vertical-cta__button {
display: block;
width: 100%;
margin: 0;
align-self: stretch;
}
.cmw-small-vertical-cta .wp-block-button.cmw-small-vertical-cta__button
> a.wp-block-button__link {
display: flex;
justify-content: center;
width: 100% !important;
min-height: 35px;
padding: 10px var(--cmw-pattern-xs);
font-size: 15px;
line-height: 1.4;
box-sizing: border-box;
}
@media (max-width: 900px) {
.cmw-small-vertical-cta {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--cmw-pattern-2xs);
width: 100%;
max-width: none;
padding: var(--cmw-pattern-3xs) var(--cmw-pattern-3xs) var(--cmw-pattern-3xs)
var(--cmw-pattern-xs);
}
.cmw-small-vertical-cta__heading {
flex: 1 1 auto;
font-size: 1rem;
text-align: left;
white-space: nowrap;
}
.cmw-small-vertical-cta__heading strong {
display: block;
}
.cmw-small-vertical-cta .wp-block-button.cmw-small-vertical-cta__button {
flex: 0 0 auto;
width: auto;
}
.cmw-small-vertical-cta .wp-block-button.cmw-small-vertical-cta__button
> a.wp-block-button__link {
min-height: 100%;
padding: 12px 20px;
font-size: 14px;
}
}
/* cta/market-horizontal-toggle/market-horizontal-toggle.css */
.cmw-pattern.market-horizontal-toggle {
width: 100%;
}
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-heading-wrap .cmw-y25-heading-2.cmw-pattern {
margin-bottom: var(--cmw-pattern-xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-heading-wrap,
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-shell {
width: min(83%, 1200px);
margin-inline: auto;
}
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-shell {
padding-top: var(--cmw-pattern-xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block.cmw-market-horizontal-toggle.cmw-add-shadow {
width: 100%;
box-sizing: border-box;
padding: clamp(1.25rem, 0.95rem + 2vw, 2.5rem);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content {
width: 100%;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-y25-heading-3.cmw-pattern {
margin-bottom: var(--cmw-pattern-3xs);
padding-left: var(--cmw-4xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-patterns-paragraph.cmw-pattern {
color: var(--cmw-Dark-Gray);
margin-top: var(--cmw-2xs);
padding-left: var(--cmw-4xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-default-grid.cmw-market-toggle-card-grid {
width: 100%;
margin-top: var(--cmw-m);
margin-inline: 0;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-default-grid.cmw-market-toggle-card-grid > .wp-block-group__inner-container {
gap: var(--cmw-pattern-xs);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-card.cmw-pattern.card > .wp-block-group__inner-container {
min-height: 100%;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-card .wp-block-group.cmw-pattern.card-body .wp-block-group__inner-container {
justify-content: flex-start;
padding-bottom: var(--cmw-pattern-xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-card .cmw-pattern.card-icon img.artwork {
width: 3.25rem;
height: 3.25rem;
object-fit: contain;
border-radius: 0;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-card .cmw-pattern.card-icon img:not(.artwork) {
height: 28px;
border-radius: 0;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-card .cmw-y25-bold-paragraph.cmw-pattern {
font-size: var(--cmw-small-font-size);
font-weight: 500;
line-height: 140%;
color: var(--cmw-text-color);
}
@media (max-width: 959px) {
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-heading-wrap {
box-sizing: border-box;
padding-inline: var(--cmw-pattern-xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-shell {
padding-top: var(--cmw-pattern-2xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block.cmw-market-horizontal-toggle.cmw-add-shadow {
width: min(calc(100% - 24px), 1050px);
padding: var(--cmw-pattern-xs);
box-sizing: border-box;
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-default-grid.cmw-market-toggle-card-grid > .wp-block-group__inner-container {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 600px) {
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block .cmw-market-toggle-content .cmw-default-grid.cmw-market-toggle-card-grid > .wp-block-group__inner-container {
grid-template-columns: minmax(0, 1fr);
}
}
@media (max-width: 480px) {
.cmw-pattern.market-horizontal-toggle .cmw-pattern.default-container.cmw-market-horizontal-toggle-heading-wrap {
padding-inline: var(--cmw-pattern-2xs);
}
.cmw-pattern.market-horizontal-toggle .cmw-Y25.y25-content-toggle-block.cmw-market-horizontal-toggle.cmw-add-shadow {
width: min(calc(100% - 16px), 1050px);
padding: var(--cmw-pattern-2xs);
box-shadow: 0px 8px 32px 0px rgba(156, 149, 181, 0.22);
}
}
/* hero/basic-search/basic-search.css */
/* Hero main wrapper */
.cmw-pattern.hero-search > .wp-block-group__inner-container{
display: flex;
flex-direction: column;
gap: var(--cmw-pattern-m);
}
/* Hero text */
.cmw-pattern.hero-search-container {
display: flex;
flex-direction: column;
gap: var(--cmw-pattern-xs);
max-width: 80%;
}
.cmw-pattern.hero-search-description {
display: flex;
flex-direction: column;
gap: var(--cmw-pattern-2xs);
}
/* Hero CTA and search input */
.cmw-pattern.hero-search-buttons > .wp-block-group__inner-container {
display: flex;
flex-wrap: wrap;
gap: var(--cmw-pattern-2xs);
}
/* Search input */
.cmw-pattern.hero-search-buttons .cmw-pattern.search p {
margin: 0;
}
@media (max-width: 834px) {
.cmw-pattern.hero-search-container {
max-width: 100%;
}
}
/* hero/cards-details/cards-details.css */
/* Hero main wrapper */
.cmw-pattern.hero-detail-cards {
width: var(--cmw-default-width);
margin-inline: auto;
}
/* Inside wrapper wrapper */
.cmw-pattern.hero-detail-cards > div {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 3rem;
row-gap: 2.5rem;
/* All images should have border radius */
figure img {
border-radius: 1rem;
min-width: 100%;
}
}
.cmw-pattern.hero-detail-cards .details-column .cmw-resource-card .cmw-resource-card-details .resource-card-heading p {
margin-bottom: 1rem;
}
/* Main card */
.cmw-pattern.hero-detail-cards .main-card-class {
/* Details */
.cmw-resource-card-details {
padding-inline: var(--cmw-4xs);
/* Chips */
.non-actionable-wrap {
margin-bottom: 0.75rem;
}
/* Heading */
.resource-card-heading p.cmw-y25-bold-paragraph.cmw-pattern {
font-size: var(--cmw-large-font-size);
margin-bottom: 1.25rem;
}
/* CTA */
.action-link {
margin-top: initial;
}
}
}
/* Right side containing 3 smaller cards */
.cmw-pattern.hero-detail-cards .details-column > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
gap: 1.5rem;
.cmw-pattern.cmw-resource-card.secondary-card-class > .wp-block-group__inner-container {
display: grid;
grid-template-columns: 38fr 50fr;
.cmw-resource-card-details {
padding-block: 0;
.wp-block-group__inner-container {
justify-content: center;
gap:0.25rem;
> * {
margin: 0;
}
.non-actionable-wrap {
margin-bottom: 0.35rem;
}
}
}
}
}
/* Tablet */
@media (max-width: 1099px) {
.cmw-pattern.hero-detail-cards > div {
column-gap: 2.5rem;
/* Stack main card on top of the secondary cards wrapper */
grid-template-columns: 1fr;
}
.cmw-pattern.hero-detail-cards > div .main-card-class > .wp-block-group__inner-container {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 1.5rem;
.cmw-resource-card-details > .wp-block-group__inner-container {
display: flex;
justify-content: center;
}
}
/* Right side now becomes scrolable row */
.cmw-pattern.hero-detail-cards > div .details-column {
overflow-x: auto;
overflow-y: hidden;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
scrollbar-width: thin;
scrollbar-color: var(--cmw-Medium-Gray) var(--cmw-White);
margin-right: -5%; /* main container width is 90%, so left and right margin is 5% each */
}
/* Hide scrollbar on touch devices */
@media (hover: none) and (pointer: coarse) {
.cmw-pattern.hero-detail-cards > div .details-column {
scrollbar-width: none; /* Firefox */
}
.cmw-pattern.hero-detail-cards > div .details-column::-webkit-scrollbar {
display: none; /* Chrome / Safari */
}
.cmw-pattern.cmw-resource-card:hover {
transform: none !important;
}
}
.cmw-pattern.hero-detail-cards > div .details-column .secondary-card-class {
scroll-snap-align: center;
}
.cmw-pattern.hero-detail-cards > div .details-column > .wp-block-group__inner-container {
padding-top: 5px;
display: grid;
grid-auto-flow: column;
grid-auto-columns: 40%;
grid-template-columns: none;
gap: var(--cmw-pattern-xs);
.cmw-pattern.cmw-resource-card.secondary-card-class > .wp-block-group__inner-container {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto 1fr;
.cmw-resource-card-details {
padding-block: var(--cmw-pattern-xs);
padding-inline:0;
> .wp-block-group__inner-container {
justify-content: flex-start;
}
/* Push the button down */
.action-link {
margin-top: auto;
}
}
}
}
}
/* Mobile */
@media (max-width: 767px) {
.cmw-pattern.hero-detail-cards > div .main-card-class > .wp-block-group__inner-container {
grid-template-columns: 1fr;
}
.cmw-pattern.hero-detail-cards > div .details-column > .wp-block-group__inner-container {
grid-auto-columns: 80%;
}
}
/* hero/basic-text/basic-text.css */
/* Hero main wrapper */
.cmw-pattern.hero-text .hero-text-container {
max-width: 80%;
}
/* Hero text */
.cmw-pattern.hero-text .hero-text-container > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
gap: var(--cmw-pattern-xs);
}
.cmw-pattern.hero-text-description > .wp-block-group__inner-container {
display: flex;
flex-direction: column;
}
@media (max-width: 834px) {
.cmw-pattern.hero-text .hero-text-container {
max-width: 100%;
}
}
/* hero/cards-details-v2/cards-details-v2.css */
/* Main hero wrapper */
.hero-detail-cards-v2 > div {
display: grid;
grid-template-columns: 1fr minmax(450px, 1fr);
column-gap: clamp(3rem, -3.4706rem + 9.4118vw, 5rem);
row-gap:24px;
}
/* All cards shouldn't have shadow and border radius */
.hero-detail-cards-v2 .cmw-pattern.tertiary-card {
box-shadow: none;
border-radius: 0;
}
/* All cards details should have no padding */
.hero-detail-cards-v2 .cmw-pattern.tertiary-card .tertiary-card-details .heading-excerpt-date-tags > div {
padding-left: 0;
padding-right: 0;
}
/* All cards date-tag-wrapper should not push date and tag to the extreme */
.hero-detail-cards-v2 .cmw-pattern.tertiary-card .tertiary-card-details .heading-excerpt-date-tags .date-tag-wrapper {
justify-content: normal;
}
/* Main card style */
.hero-detail-cards-v2 .cmw-pattern.tertiary-card.main-card .card-img figure {
border-radius: 1rem;
overflow: clip;
}
.hero-detail-cards-v2 .cmw-pattern.tertiary-card.main-card .tertiary-card-details {
flex: 0;
}
.hero-detail-cards-v2 .cmw-pattern.tertiary-card.main-card .tertiary-card-details .heading-excerpt-date-tags > div {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.hero-detail-cards-v2 .cmw-pattern.tertiary-card.main-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper h3.cmw-y25-heading-3 {
font-size: var(--cmw-h3-font-size);
}
.hero-detail-cards-v2 .cmw-pattern.tertiary-card.main-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary {
font-size: var(--cmw-small-font-size);
}
/* Tertiary cards style */
.hero-detail-cards-v2 .details-column .tertiary-card:not(:last-child) {
border-bottom: 1px solid #EEEEEE;
}
/* Excerpt on 2 lines */
.hero-detail-cards-v2 .details-column .tertiary-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
}
.hero-detail-cards-v2 .details-column .tertiary-card .tertiary-card-details .heading-excerpt-date-tags {
gap: 1rem;
}
.hero-detail-cards-v2 .details-column .tertiary-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
height: auto;
margin-top: 0.5rem;
transition: none;
display: none;
}
/* Enable hover interactions only for larger screens */
@media (min-width: 1001px) {
.hero-detail-cards-v2 .details-column .tertiary-card:first-child .heading-excerpt-date-tags > div {
padding-top: 0px;
}
.hero-detail-cards-v2 .details-column .tertiary-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
display: block;
height: 0;
margin-top: -0.5rem;
transition: all 0.7s cubic-bezier(0.25, 1, 0.25, 1);
}
.hero-detail-cards-v2 .details-column .tertiary-card:first-child .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
height: auto;
}
.hero-detail-cards-v2 .details-column:hover .tertiary-card .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
height: 0;
margin-top: -0.5rem;
}
.hero-detail-cards-v2 .details-column .tertiary-card:hover .tertiary-card-details .heading-excerpt-date-tags .heading-excerpt-wrapper p.cmw-patterns-paragraph.secondary.excerpt {
height: auto;
}
}
@media only screen and (max-width: 1000px) {
.hero-detail-cards-v2 > div {
grid-template-columns: 1fr;
}
.hero-detail-cards-v2 .details-column .tertiary-card:first-child {
border-top: 1px solid #EEEEEE;
}
}
/* hero/cards-details-v3/cards-details-v3.css */
/* MAIN grid */
.hero-detail-cards-v3 > .wp-block-group__inner-container {
display: grid;
grid-template-columns: 2fr 1fr;
gap: var(--cmw-pattern-s);
align-items: stretch;
}
/* Allow grid children to shrink below content size */
.hero-detail-cards-v3 > .wp-block-group__inner-container > .details-column,
.hero-detail-cards-v3 > .wp-block-group__inner-container > .quaternary-card-and-img {
min-width: 0;
min-height: 0;
}
/* Shared rules - Clamp descriptions to 2 lines */
.hero-detail-cards-v3
.quaternary-card-details p.cmw-patterns-paragraph.secondary {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* LEFT COLUMN — 2x2 cards */
.hero-detail-cards-v3 > .wp-block-group__inner-container .details-column > .wp-block-group__inner-container {
display: grid;
grid-template-columns: 1fr 1fr;
grid-auto-rows: 1fr;
gap: 1rem;
height: 100%;
min-height: 0;
}
/* Each light card stretches internally */
.hero-detail-cards-v3 .details-column .quaternary-card > div {
min-height: 100%;
display: flex;
flex-direction: column;
}
.hero-detail-cards-v3 .details-column .quaternary-card-details {
margin-top: auto;
}
/* RIGHT COLUMN — image + dark card */
.hero-detail-cards-v3 .quaternary-card-and-img {
height: 100%;
min-height: 0;
overflow: hidden;
}
/* Two-row layout: image gets leftover space */
.hero-detail-cards-v3 .quaternary-card-and-img > .wp-block-group__inner-container {
display: grid;
height: 100%;
min-height: 0;
grid-template-rows: minmax(0, 1fr) auto;
}
/* Figure row */
.hero-detail-cards-v3 .quaternary-card-and-img figure {
margin: 0;
min-height: 0;
overflow: hidden;
}
/* Because markup is figure > a > img */
.hero-detail-cards-v3 .quaternary-card-and-img figure a {
display: block;
height: 100%;
}
/* Image fills available space but keeps 3/1 aspect ratio */
.hero-detail-cards-v3 .quaternary-card-and-img figure img {
display: flex;
min-height: 100%;
aspect-ratio: 3/1;
object-fit: cover;
}
@media (max-width: 1000px) {
/* LEFT COLUMN — 2x2 cards now on TOP of the RIGHT COLUMN */
.hero-detail-cards-v3 > .wp-block-group__inner-container {
grid-template-columns: 1fr;
}
/* RIGHT COLUMN */
.hero-detail-cards-v3 > .wp-block-group__inner-container .quaternary-card-and-img > .wp-block-group__inner-container {
grid-template-columns: 1fr 1fr;
.quaternary-card {
border-radius: 0;
display: flex;
.wp-block-group__inner-container {
display: flex;
flex: 1;
}
}
}
}
@media (max-width: 768px) {
/* LEFT COLUMN — 2x2 cards still on TOP of the RIGHT COLUMN */
.hero-detail-cards-v3 > .wp-block-group__inner-container {
grid-template-columns: 1fr;
/* LEFT COLUMN — 2x2 becomes 1X4 */
.details-column > .wp-block-group__inner-container {
grid-template-columns: 1fr;
}
}
/* RIGHT COLUMN */
.hero-detail-cards-v3 > .wp-block-group__inner-container .quaternary-card-and-img > .wp-block-group__inner-container {
grid-template-columns: 1fr;
}
}
/* parts/containers/default-container/default-container.css */
/* Container with just an eyebrow inside */
.cmw-pattern.default-container.eyebrow {
margin-bottom: 1.5rem;
}
/* Container with resource filters results. The width and margins is controled by the grid itself */
.cmw-pattern.default-container.cmw-y25-resources-filter-wrap:has(.cmw-default-grid) {
width: unset;
margin-inline: unset;
}
/*
* When the "horizontal-scroll-forced" class is present:
*
* - This setup is optimized for **tertiary cards**
* - Spacing and sizing may need adjustments if other card types are used
* - Pay special attention to cards **without box-shadow**, as visual spacing may feel off without it
*/
.cmw-pattern.default-container.horizontal-scroll-forced > .wp-block-group__inner-container {
display: grid;
grid-auto-flow: column;
padding-block: 2.5rem;
overflow-x: auto;
overflow-y: hidden;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
scrollbar-width: thin;
scrollbar-color: var(--cmw-Medium-Gray) var(--cmw-White);
margin-right: -5%; /* main container width is ususally 90%, so left and right margin is 5% each */
margin-left: calc(var(--cmw-pattern-s) * -1); /* accommodate the box-shadow */
--_margin-as-gap: var(--cmw-pattern-s);
/* All direct items (usually cards) */
> div {
width: min(380px, 80dvw);
margin-inline: calc(var(--_margin-as-gap) / 2);
}
/* First item (card) extra space to accommodate the box-shadow */
> div:first-child {
margin-left: var(--_margin-as-gap);
}
/* Last item (card) extra space to accommodate the box-shadow */
> div:last-child {
margin-right: var(--_margin-as-gap);
}
}
/* Hide scrollbar on touch devices */
@media (hover: none) and (pointer: coarse) {
.cmw-pattern.default-container.horizontal-scroll-forced > .wp-block-group__inner-container {
scrollbar-width: none; /* Firefox */
}
.cmw-pattern.default-container.horizontal-scroll-forced > .wp-block-group__inner-container::-webkit-scrollbar {
display: none; /* Chrome / Safari */
}
}
/* parts/containers/blog-container/blog-container.css */
/*If blog content uses classic editor, add some spaging between elements */
.cmw-pattern.blog-container.blog-uses-classical-editor > * {
margin-bottom: 1rem;
}
/* Common styles */
.cmw-pattern.blog-container p,
.cmw-pattern.blog-container a {
font-family: var(--cmw-font-family);
font-size: var(--cmw-small-max-font-size);
font-style: normal;
font-weight: 400;
line-height: 150%;
}
.cmw-pattern.blog-container em,
.cmw-pattern.blog-container em > * {
font-style: italic;
}
.cmw-pattern.blog-container p {
color: #333;
font-size: 1rem;
margin-block: 16px;
}
.cmw-pattern.blog-container a {
color: var(--cmw-color-primary);
}
.cmw-pattern.blog-container a {
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: none;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;
}
.cmw-pattern.blog-container h2, .cmw-pattern.blog-container h3, .cmw-pattern.blog-container h4, .cmw-pattern.blog-container h5, .cmw-pattern.blog-container h6 {
font-family: var(--cmw-font-family);
color: var(--cmw-text-color);
margin-bottom: 0;
line-height: 150%;
font-weight: 400;
}
.cmw-pattern.blog-container h2{
font-size: clamp(1.5rem, 1.3680rem + 0.5634vw, 1.875rem);
margin-top: clamp(2rem, 1.6479rem + 1.5023vw, 3rem);
}
.cmw-pattern.blog-container h3{
font-size: clamp(1.375rem, 1.2870rem + 0.3756vw, 1.625rem);
margin-top: clamp(1.25rem, 0.9859rem + 1.1268vw, 2rem);
}
.cmw-pattern.blog-container h4{
font-size: clamp(1.25rem, 1.2060rem + 0.1878vw, 1.375rem);
margin-top: clamp(0.75rem, 0.6620rem + 0.3756vw, 1rem);
}
.cmw-pattern.blog-container h5{
font-size: clamp(1.125rem, 1.0810rem + 0.1878vw, 1.25rem);
margin-top: clamp(0.5rem, 0.4120rem + 0.3756vw, 0.75rem);
}
.cmw-pattern.blog-container h6{
font-size: clamp(1rem, 0.9560rem + 0.1878vw, 1.125rem);
margin-top: clamp(0.25rem, 0.1620rem + 0.3756vw, 0.5rem);
}
/* List itmes */
.cmw-pattern.blog-container ul li {
color: #333;
}
/* Select the previous element before a figure or a .wp-block-image, to apply some margin bottom to it */
.cmw-pattern.blog-container *:has(+ figure),
.cmw-pattern.blog-container *:has(+ .wp-block-image) {
margin-bottom: 1rem;
}
/* Border radius and overflow hidden for all images inside figures */
.cmw-pattern.blog-container figure img {
border-radius: 12px;
overflow: hidden;
}
/* Remove the margin top on the content first element */
.cmw-pattern.blog-container > :first-child {
margin-top: 0;
}
/* On small screens, prevent image and text next to each other */
@media (max-width:499px){
.cmw-pattern.blog-container .wp-block-image {
float: none;
}
.cmw-pattern.blog-container figure {
margin-inline: 0;
width: 100%;
}
}
/* parts/containers/press-releases-container/press-releases-container.css */
/* Properties copied from blog-container but only for headings */
.cmw-pattern.press-releases-container h2,
.cmw-pattern.press-releases-container h3,
.cmw-pattern.press-releases-container h4,
.cmw-pattern.press-releases-container h5 {
font-family: var(--cmw-font-family);
color: #000000;
margin-bottom: 0;
}
.cmw-pattern.press-releases-container h2 {
font-size: clamp(1.5rem, 1.3680rem + 0.5634vw, 1.875rem);
margin-top: clamp(2rem, 1.6479rem + 1.5023vw, 3rem);
}
.cmw-pattern.press-releases-container h3 {
font-size: clamp(1.375rem, 1.2870rem + 0.3756vw, 1.625rem);
margin-top: clamp(1.25rem, 0.9859rem + 1.1268vw, 2rem);
}
.cmw-pattern.press-releases-container h4 {
font-size: clamp(1.25rem, 1.2060rem + 0.1878vw, 1.375rem);
margin-top: clamp(0.75rem, 0.6620rem + 0.3756vw, 1rem);
}
.cmw-pattern.press-releases-container h5 {
font-size: clamp(1.125rem, 1.0810rem + 0.1878vw, 1.25rem);
margin-top: clamp(0.5rem, 0.4120rem + 0.3756vw, 0.75rem);
}
.cmw-pattern.press-releases-container h6 {
font-size: clamp(1rem, 0.9560rem + 0.1878vw, 1.125rem);
margin-top: clamp(0.25rem, 0.1620rem + 0.3756vw, 0.5rem);
}
/* parts/containers/pattern-backdrop-hero/pattern-backdrop-hero.css */
.cmw-pattern-backdrop-hero {
position: relative;
overflow: hidden;
background: var(--cmw-color-light);
isolation: isolate;
}
.cmw-pattern-backdrop-hero__backdrop {
position: absolute;
inset: 0;
background-image:
linear-gradient(
242.98deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.96) 64%,
var(--cmw-color-light) 100%
),
url("parts/containers/pattern-backdrop-hero/pattern-backdrop-hero-bg.svg");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.cmw-pattern-backdrop-hero__inner {
position: relative;
z-index: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: clamp(var(--cmw-pattern-s), 5vw, var(--cmw-pattern-2xl));
width: min(var(--cmw-default-width), calc(100% - (2 * var(--cmw-pattern-s))));
margin: 0 auto;
padding: clamp(var(--cmw-pattern-m), 4vw, var(--cmw-pattern-l)) 0;
}
.cmw-pattern-backdrop-hero__copy {
flex: 1 1 auto;
max-width: 47.5rem;
display: grid;
gap: var(--cmw-pattern-2xs);
}
.cmw-pattern-backdrop-hero__copy .cmw-y25-medium-paragraph {
max-width: 52rem;
}
@media (max-width: 900px) {
.cmw-pattern-backdrop-hero__backdrop {
background-position: 62% center;
background-size: auto 100%;
}
.cmw-pattern-backdrop-hero__inner {
flex-direction: column;
align-items: stretch;
gap: var(--cmw-pattern-xs);
width: min(var(--cmw-default-width), calc(100% - (2 * var(--cmw-pattern-xs))));
padding: var(--cmw-pattern-m) 0 var(--cmw-pattern-xs);
}
.cmw-pattern-backdrop-hero__copy {
max-width: none;
}
.cmw-pattern-backdrop-hero__copy .cmw-y25-heading-1 {
font-size: 30px;
line-height: 1.2;
}
.cmw-pattern-backdrop-hero__copy .cmw-y25-medium-paragraph {
max-width: none;
font-size: 1rem;
}
}
/* navigations/backcurrent/backcurrent.css */
.cmw-pattern.nav-bar .wp-block-group__inner-container{
display: flex;
flex-direction: row;
align-items: center;
gap: var(--cmw-pattern-4xs);
}
.cmw-pattern.nav-bar .wp-block-group__inner-container p{
margin: 0;
font-family: var(--cmw-font-family);
font-size: var(--cmw-primary-font-size);
font-weight: 650;
text-transform: uppercase;
letter-spacing: 0.125rem;
}
.cmw-pattern.nav-bar .wp-block-group__inner-container p.cmw-pattern.current{
color: var(--cmw-primary-color);
}
.cmw-pattern.nav-bar .wp-block-group__inner-container p > a{
color: var(--cmw-text-color);
}
.cmw-pattern.nav-bar p.cmw-pattern.icon img {
width: 0.75rem;
height: 0.75rem;
vertical-align: initial;
}
/* navigations/table-of-content/table-of-content.css */
/* Main wrapper */
.cmw-pattern.toc-content {
border: 1px solid #D8D8D8;
border-radius: 0.5rem;
overflow: hidden;
background: white;
--_toc-padding: 1rem 1.25rem;
}
/* Heading */
.cmw-pattern.toc-content .toc-heading {
display: flex;
padding: var(--_toc-padding);
flex-direction: row;
gap: 1rem;
align-items: center;
cursor: pointer;
&:focus-visible {
outline: 2px solid var(--cmw-color-primary);
}
.toc-heading-icon {
display: flex;
svg path {
fill: var(--cmw-color-medium);
}
}
.toc-heading-icon.down-icon {
margin-left: auto;
transition-duration: 0.35s;
transition-property: transform;
}
.eyebrow {
font-size: 0.875rem;
letter-spacing: 0.0625rem;
color: var(--cmw-color-medium);
font-weight: 650;
}
}
/* TOC body - links */
.cmw-pattern.toc-content .toc-body {
display: flex;
ul {
margin: 0;
display: flex;
flex-direction: column;
padding: var(--_toc-padding);
li {
list-style-type: none;
font-size: 1rem;
font-weight: 600;
margin-block: 0.75rem;
a {
color: var(--cmw-color-darkest);
font-family: inherit;
text-decoration-color: var(--cmw-color-primary);
&.active {
color: var(--cmw-color-primary);
}
}
/* If this link is an h3 and is active, fill the pointer */
&:has(a.active) .toc-h3 svg path {
fill: black;
}
}
}
}
/* When h3 links present */
.cmw-pattern.toc-content .toc-body ul li .toc-h3 {
display: flex;
flex-direction: row;
gap: 0.75rem;
svg {
min-width: 0.5rem;
}
}
/* When opened, icons should change color and down icon should animate */
.cmw-pattern.toc-content.open-accordion {
.toc-heading {
background: var(--cmw-secondary-card-background);
}
.toc-heading-icon.down-icon {
transform: rotate(-180deg);
}
}
/* spacers/dinamic-spacer/dinamic-spacer.css */
/*
// A fluid spacer that automatically adjusts its height between a minimum and maximum value based on the viewport width.
// Add CSS classes cmw-dinamic-spacer-max-height-{value} and cmw-dinamic-spacer-min-height-{value} to control the height range.
// Example: cmw-dinamic-spacer-max-height-100 cmw-dinamic-spacer-min-height-50 will set the spacer to 100px at 1440px screen width and scale down to 50px on smaller screens. */
.wp-block-spacer.cmw-dinamic-spacer {
height: clamp(
var(--cmw-dinamic-spacer-min-height),
var(--cmw-dinamic-spacer-preferred),
var(--cmw-dinamic-spacer-max-height)
) !important;
}
/* spacers/spacer-2xs/spacer-2xs.css */
.cmw-pattern.spacer-2xs{
height: var(--cmw-pattern-2xs)!important;
}
/* spacers/spacer-3xs/spacer-3xs.css */
.cmw-pattern.spacer-3xs{
height: var(--cmw-pattern-3xs)!important;
}