Merge branch 'main' into issue-956-email-icon-hyperlinks

blocks/author-bio/author-bio.css

@@ -34,6 +34,7 @@
 @media only screen and (min-width: 768px) {
   .author-bio {
     display: flex;
+    flex-wrap: wrap;
     align-items: flex-start;
     gap: var(--spacer-element-07);
     flex-shrink: 0;

blocks/blog-home/blog-home.css

@@ -5,6 +5,7 @@ body[filters-open="true"] {
 
 .thought-leadership-home.main,
 .blog-home.main {
+  padding-top: var(--nav-height-mobile);
   margin: auto;
 }
 
@@ -648,7 +649,7 @@ h5 {
     font-family: var(--sans-serif-font-light);
   }
 
-  
+
   .thought-leadership-home .blog-content .card-group .card-item.featured-article .card-image,
   .thought-leadership-home .blog-content .card-group .card-item.featured-article .card-content,
   .blog-home .blog-content .card-group .card-item.featured-article .card-image,
@@ -715,6 +716,11 @@ h5 {
 
 /* Desktop styles */
 @media only screen and (min-width: 1200px) {
+  .thought-leadership-home.main,
+  .blog-home.main {
+    padding-top: var(--nav-height-desktop);
+  }
+
   main .section.thought-leadership-home-container,
   main .section.blog-home-container {
     padding-top: var(--spacer-layout-06);

blocks/columns/columns.css

@@ -685,7 +685,7 @@ main .columns > div > div > h4:first-child {
   .section-top-grid > div:nth-child(1) > div:nth-child(1),
   .article-content-wrapper ul {
     font-family: var(--sans-serif-font-light);
-    font-size: var(--font-size-21);
+    font-size: var(--font-size-16);
     font-weight: var(--font-weight-light);
     line-height: var(--line-height-160);
     letter-spacing: var(--letter-spacing-1);

blocks/header/header.css

@@ -2,7 +2,6 @@
 
 /* header and nav layout */
 header {
-  position: fixed;
   float: left;
   clear: none;
   border-bottom: 1px solid var(--neutral-sand);
@@ -11,7 +10,6 @@ header {
   left: 0;
   top: 0;
   transition: all .5s ease;
-  z-index: 99999;
   font-family: var(--sans-serif-font-medium);
 }
 
@@ -545,6 +543,10 @@ header nav .nav-sections .mega-menu a.link-with-icon span.icon svg {
     padding: var(--spacer-layout-05) calc((100vw - var(--section-width-desktop)) / 2) var(--spacer-layout-07);
   }
 
+  header.is-sticky nav .nav-sections > ul > li[aria-expanded='true'] > ul.level-two {
+    top: var(--sticky-nav-height);
+  }
+
   header nav .nav-sections > ul > li[aria-expanded='true'] > ul > li.level-two:not(.mega-menu, .featured) {
     padding: 1% 0;
     width: 280px;

blocks/leadspace/leadspace.css

@@ -625,7 +625,7 @@ main div.leadspace-wrapper {
   .leadspace .button-group {
     display: flex;
     flex-flow: row nowrap;
-    align-items: center;
+    align-items: baseline;
   }
 
   .leadspace.brand-logo .button-group {

blocks/marketo/marketo.js

@@ -31,12 +31,18 @@ const embedMarketoForm = (marketoId, formId, successUrl) => {
           form.onSuccess((values, followUpUrl) => {
             // Take the lead to a different page on successful submit,
             // ignoring the form's configured followUpUrl
-            location.href = successUrl;
+            // location.href = successUrl;
             if (window._satellite) {
               _satellite.track('formSubmit', {
                 formName: document.title,
               });
             }
+            // Drift popup custom code
+            drift.api.collectFormData(values, {
+              campaignId: 2787244,
+              // followupUrl: 'https://www.merative.com/thank-you',
+              followupUrl: successUrl,
+            });
             // Return false to prevent the submission handler continuing with its own processing
             return false;
           });

blocks/references/references.css

@@ -1,14 +1,42 @@
-.references p, .references p strong {
+.references p,
+.references p strong {
   font-size: var(--font-size-32);
   font-family: var(--serif-font);
   margin: unset;
-  margin-bottom: var(--spacer-element-10);
+  margin-bottom: var(--spacer-element-09);
   line-height: var(--line-height-120);
   letter-spacing: var(--letter-spacing-001-em);
 }
 
-.references ul, ol, li, a {
+.references ul,
+.references ol,
+.references li,
+.references a {
   font-size: var(--font-size-14);
   font-family: var(--sans-serif-font-regular);
   color: var(--neutral-grey-tint140);
+}
+
+.references ul,
+.references ol {
+  padding-inline-start: var(--spacer-element-05);
+  margin-top: 0;
+}
+
+.references li {
+  margin: var(--spacer-element-03) 0;
+}
+
+.references li::marker {
+  font-size: var(--font-size-14);
+  font-family: var(--sans-serif-font-regular);
+  color: var(--neutral-grey-tint140);
+}
+
+/* All except desktop */
+@media only screen and (max-width: 992px) {
+  .references p,
+  .references p strong {
+    margin-bottom: var(--spacer-element-06);
+  }
 }

blocks/solution-header/solution-header.css

@@ -8,7 +8,6 @@
   left: 0;
   top: 0;
   transition: all .5s ease;
-  z-index: 99999;
 }
 
 .solution-header {
@@ -163,10 +162,6 @@
 }
 
 /* Sticky - Solution Header */
-body.microsites.header-visible main {
-  padding-top: 140px;
-}
-
 .solution-header-wrapper.is-sticky {
   background-color: var(--neutral-carbon);
   border-bottom: 1px solid var(--neutral-carbon);
@@ -288,7 +283,7 @@ body.microsites.header-visible main {
 }
 
 .solution-header-wrapper.is-sticky .solution-header.navattic .solution-header__inner .solution-header__col-3 .button.secondary:hover {
-  background-image: var(--gradient-to-right); 
+  background-image: var(--gradient-to-right);
 }
 
 .solution-header.navattic .solution-header__inner .solution-header__col-3 .button.primary {
@@ -314,7 +309,7 @@ body.microsites.header-visible main {
 }
 
 .solution-header-wrapper.is-sticky .solution-header.navattic .solution-header__inner .solution-header__col-3 .button.primary:hover {
-  background-image: var(--gradient-to-right); 
+  background-image: var(--gradient-to-right);
 }
 
 .solution-header-wrapper.is-sticky .solution-header ul li a {
@@ -376,7 +371,7 @@ body.microsites.header-visible main {
     top: calc(var(--spacer-element-02) * -1);
     right: var(--spacer-layout-036);
   }
-  
+
   .solution-header-wrapper.is-sticky .solution-header .solution-header__inner .solution-header__col-3 {
     display: none;
   }
@@ -408,7 +403,7 @@ body.microsites.header-visible main {
 }
 
 /* Desktop */
-@media (min-width: 1200px) {  
+@media (min-width: 1200px) {
   /* Block - Solution Header */
   .solution-header {
     margin: 0 auto;
@@ -437,7 +432,7 @@ body.microsites.header-visible main {
   .solution-header ul li:first-child {
     padding-left: 0;
   }
-  
+
   .solution-header ul li:last-child {
     padding-right: 0;
   }
@@ -475,6 +470,11 @@ body.microsites.header-visible main {
   /* Sticky - Solution Header */
   .solution-header-wrapper {
     border-bottom: 1px solid var(--neutral-sand);
+    height: var(--nav-height-desktop);
+  }
+
+  .solution-header-wrapper.is-sticky {
+    height: var(--sticky-nav-height);
   }
 
   .solution-header-wrapper.is-sticky .solution-header__inner {
@@ -505,7 +505,7 @@ body.microsites.header-visible main {
     clip-path: circle(50% at 50% 50%);
     border: unset;
   }
-  
+
   .solution-header-wrapper.is-sticky .solution-header .icon svg {
     height: var(--spacer-element-09);
     width: unset;
@@ -514,4 +514,4 @@ body.microsites.header-visible main {
   .solution-header-wrapper .solution-header.navattic .icon svg, .solution-header-wrapper.is-sticky .solution-header.navattic .icon svg {
     height: var(--spacer-layout-04);
   }
-}
+}

styles/styles.css

@@ -547,6 +547,7 @@ body main {
 header {
   position: fixed;
   height: var(--nav-height-mobile);
+  z-index: 99999;
 }
 
 @media (min-width: 1200px) {
@@ -840,7 +841,9 @@ main ol li {
 main ul li::marker,
 main ol li::marker {
   color: var(--primary-purple);
-  font-family: var(--sans-serif-font-medium);
+  font-family: var(--sans-serif-font-regular);
+  font-weight: var(--font-weight-light);
+  font-size: var(--font-size-21);
 }
 
 /* Special case lists */
@@ -1657,7 +1660,7 @@ body.quick-links main .section > div {
 .section-pattern {
   height: var(--gap-84);
   background-color: var(--neutral-bone);
-  background-repeat: repeat-x; 
+  background-repeat: repeat-x;
   background-size: 400px auto;
   background-position: calc(var(--spacer-element-04) * -1) 0;
 }
@@ -1835,6 +1838,11 @@ body.quick-links main .section > div {
     line-height: var(--line-height-160);
     letter-spacing: var(--letter-spacing-1);
   }
+
+  .article-content-wrapper ul li {
+    font-size: inherit;
+  }
+
 }
 
 /* Desktop */
@@ -1939,7 +1947,8 @@ body.quick-links main .section > div {
   .article-content-wrapper ul,
   .article-content-wrapper ol {
     font-size: var(--font-size-21);
-    margin: var(--spacer-element-09) 0;
+    margin: var(--spacer-element-05) 0;
+    padding-inline-start: var(--spacer-element-07);
   }
 
   .article-content {