/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
:root {
    --font-heading: "Switzer",Arial,sans-serif;
    --font-body: "Montserrat",Arial,sans-serif
}

h1,h2,h3,h4,h5,h6 {
    font-family: var(--font-heading);
}

p {
    font-family: var(--font-body);
    font-weight: 400
}

h1 {
    line-height: 1.375em
}

h2{
    font-weight: 300 !important;
}

.radial-background .filter-card {
    background: radial-gradient(circle at 50% 20%,rgba(38,97,255,.55) 0,rgba(13,26,89,0) 100%),linear-gradient(180deg,#080c1f,#0e1738);
    border: 1px solid rgba(82,143,255,.5);
    border-radius: 4px;
    box-shadow: inset 0 -13px 60px 0 rgba(56,128,255,.2);
    position: relative;
    transition: border-color .3s ease,box-shadow .3s ease
}

.radial-background .filter-card:before {
    background: radial-gradient(circle at 50% 53%,rgba(38,97,255,.55) 0,rgba(13,26,89,0) 100%),linear-gradient(180deg,#101839,#162458);
    border-radius: 4px;
    content: "";
    inset: 0;
    opacity: 0;
    position: absolute;
    transition: opacity .3s ease
}

.radial-background .filter-card:hover:before {
    opacity: 1
}

.radial-background .filter-card:hover {
    border-color: rgba(82,143,255,.8);
    box-shadow: inset 0 -13px 60px 0 rgba(56,128,255,.3)
}

.radial-background.clean-base {
    padding-bottom: 120px;
    padding-top: 120px
}

.radial-background .portfolio-grid {
    flex-wrap: wrap;
    gap: 40px
}

@media (min-width: 1800px){
 #flamingo-cta.clean-base video{
    object-fit: contain;
    object-position: bottom !important;
  }
}
@media (min-width: 992px) {
    .radial-background .portfolio-grid .filter-card.col-lg-4 {
        flex:0 0 calc(33.333% - 27px);
        max-width: calc(33.333% - 27px);
        padding-left: 0;
        padding-right: 0;
        width: calc(33.333% - 27px)
    }
}

.radial-background .filter-card .c-card-content {
    padding: 32px 24px
}

.radial-background .filter-card .c-card-content h3 {
    margin: 0 0 20px
}

.radial-background .filter-card .c-card-content p {
    margin: 0
}

#solutions-cards .row {
    align-items: center;
    justify-content: center;
    margin-left: -30px;
    margin-right: -30px
}

#solutions-cards .c-col {
    padding-left: 30px;
    padding-right: 30px
}

#solutions-cards .c-col-inner {
    align-items: stretch;
    border-radius: 4px;
    box-shadow: 0 10px 20px 0 rgba(0,0,0,.2);
    display: flex;
    flex-direction: column;
    padding: 280px 24px 32px!important
}

#solutions-cards .c-content-con.c-in-2 {
    margin-top: 16px;
    height: 100%;
    align-items: end;
}

#solutions-cards .c-col-inner h3,#solutions-cards .c-col-inner h4,#solutions-cards .c-col-inner p {
    margin-top: 0
}

#solutions-cards .c-col-inner h3 {
    font-size: 36px;
    font-weight: 300;
    line-height: 1.152em;
    margin-bottom: 4px
}

#solutions-cards.solutions-cards-home {
    padding: 0 50px
}

#solutions-cards.solutions-cards-home .row {
    align-items: stretch;
}

#solutions-cards.solutions-cards-home .c-content-con.c-in-1 {
    min-height: 284px;
}

#solutions-cards.solutions-cards-home .c-content-con.c-in-2 {
    height: auto;
    margin-top: 16px;
}

#solutions-cards.solutions-cards-home .c-cta-con {
    width: 100%;
}

#solutions-cards.solutions-cards-home .c-cta-con a {
    width: 100%;
    justify-content: center;
}

#solutions-cards .c-col-inner h4 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 16px
}

#solutions-cards .c-col-inner p {
    font-size: 16px;
    font-weight: 400;
  font-family: var(--font-heading);
    margin-bottom: 0;
      
}

.clean-base p{
  font-weight: 300;
  font-family: var(--font-heading);
}

#solutions-cards .cta-primary {
    align-items: center;
    border-radius: 4px;
    border-width: 1px;
    display: inline-flex;
    padding: 8px 16px
}

#featured-news {
    background-color: #000;
    overflow: hidden;
    padding: 120px 100px;
    position: relative
}

#featured-news .fn-blob {
    height: 262px;
    left: 6px;
    pointer-events: none;
    position: absolute;
    top: 180px;
    width: 259px;
    z-index: 0
}

#featured-news .fn-container {
    display: flex;
    flex-direction: column;
    gap: 48px;
    position: relative;
    z-index: 1
}

#featured-news .fn-header {
    align-items: center;
    display: flex;
    gap: 32px;
    justify-content: space-between
}

#featured-news .fn-heading {
    color: #fff;
    font-size: 60px;
    font-weight: 300;
    line-height: 75px;
    margin: 0
}

#featured-news .fn-ctas {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: 24px
}

#featured-news .fn-btn-primary {
    background: #2cc656;
    border-radius: 4px;
    color: #000
}

#featured-news .fn-btn-outlined,#featured-news .fn-btn-primary {
    align-items: center;
    display: inline-flex;
    font-size: 20px;
    font-weight: 500;
    gap: 12px;
    line-height: 30px;
    padding: 12px 24px;
    text-decoration: none;
    white-space: nowrap
}

#featured-news .fn-btn-outlined {
    background: transparent;
    border: 1px solid #fff;
    border-radius: 4px;
    color: #fff
}

#featured-news .fn-posts {
    align-items: stretch;
    display: flex;
    gap: 32px
}

#featured-news .fn-featured-card {
    border: 1px solid #38844b;
    border-radius: 4px;
    display: flex;
    flex: 0 0 676px;
    flex-direction: column;
    gap: 32px;
    padding: 24px;
    width: 676px
}

#featured-news .fn-card-img {
    border-radius: 4px;
    display: block;
    height: 334px;
    object-fit: cover;
    width: 100%
}

#featured-news .fn-text-info {
    display: flex;
    flex-direction: column;
    gap: 16px
}

#featured-news .fn-card-title {
    color: #fff;
    font-size: 36px;
    font-weight: 300;
    line-height: 42px;
    margin: 0
}

#featured-news .fn-card-body {
    color: #b3b6bf;
    font-size: 20px;
    font-weight: 300;
    line-height: 30px;
    margin: 0
}

#featured-news .fn-tag {
    align-items: center;
    background: #38844b;
    border-radius: 1000px;
    color: #fff;
    display: inline-flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    padding: 2px 12px;
    width: fit-content
}

#featured-news .fn-card-cta {
    display: flex;
    justify-content: flex-end
}

#featured-news .fn-read-more {
    align-items: center;
    color: #2cc656;
    display: inline-flex;
    font-size: 20px;
    font-weight: 300;
    gap: 8px;
    line-height: 30px;
    text-decoration: none
}

#featured-news .fn-articles {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 32px;
    min-width: 0
}

#featured-news .fn-article-card {
    border-radius: 20px;
    padding: 24px
}

#featured-news .fn-article-title {
    color: #fff;
    font-size: 24px;
    font-weight: 300;
    line-height: 34px;
    margin: 0
}

#featured-news .fn-divider {
    border: none;
    border-top: 1px solid #38844b;
    margin: 0
}

#flamingo-cta {
    padding-bottom: 120px!important;
    padding-top: 120px!important
}

#flamingo-cta .c-col-inner h2,#flamingo-cta .c-col-inner p {
    margin-top: 0
}

#flamingo-cta .c-col-inner h2 {
    margin-bottom: 32px
}

#flamingo-cta .c-col-inner p {
    margin-bottom: 0
}

#flamingo-cta .c-content-con.c-in-2 {
    margin-top: 32px
}

#flamingo-cta .cta-primary {
    align-items: center;
    border-radius: 4px;
    display: inline-flex;
    padding: 12px 24px
}

#customer-success .row {
    align-items: flex-end;
    margin-left: -30px;
    margin-right: -30px
}

#customer-success .c-col {
    padding-left: 30px;
    padding-right: 30px;
}

#customer-success .c-col.c-1 p.stat {
    color: #fff;
    font-size: 80px;
    font-weight: 300;
    line-height: 110px;
    margin: 0
}

#customer-success .c-col.c-1 p:not(.stat) {
    color: #b3b6bf;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 12px 0 0
}

#customer-success .c-col.c-2 .c-content-con.c-in-1 p {
    color: #fff;
    font-size: 28px;
    font-weight: 500;
    line-height: 36px;
    margin: 0
}

#customer-success .c-col.c-2 .c-content-con.c-in-2 {
    margin-top: 24px
}

#customer-success p.customer-success-footer {
    align-items: center;
    display: flex;
    gap: 24px;
    margin: 0
      font-size: 20px;
    font-weight: 500;
    color: #B3B6BF;
}

#customer-success .citation {
    color: #b3b6bf;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px
}

#customer-success .read-more {
    color: #2cc656;
    font-size: 20px;
    font-weight: 300;
    line-height: 30px
}

#homepage-hero {
    padding: 140px 32px 56px
}

.has-video-overlay .c-video-player:before {
    background: linear-gradient(212deg,transparent 31.08%,rgba(0,0,0,.9) 57.21%);
    content: "";
    height: 100%;
    position: absolute;
    width: 100vw;
    z-index: 100
}

#solutions-cards.visualization-cards .c-col-inner {
    margin-top: 80px!important;
    padding: 0 21px 32px!important
}

#solutions-cards.visualization-cards .c-col-inner p {
    font-size: 18px
}

.radial-background-viewer .portfolio-grid {
    flex-wrap: wrap;
    gap: 40px
}

.radial-background-viewer .filter-card {
/*     height: 330px; */
    padding: 0!important;
    transition: all .4s ease-in-out;
    cursor: pointer;
}

.radial-background-viewer .filter-card .c-card img.c-dblock {
    margin-left: 24px;
    margin-top: 32px
}

.radial-background-viewer .filter-card:hover {
    background: radial-gradient(circle at 50% 53%,rgba(38,97,255,.55) 0,rgba(13,26,89,0) 100%),linear-gradient(180deg,#101839,#162458);
    border-color: rgba(82,143,255,.8);
    box-shadow: inset 0 -13px 60px 0 rgba(56,128,255,.3);
    transition: all .4s ease-in-out;
}

.radial-background-viewer.radial-background-viewer_home  .filter-card:hover{
  border-radius: var(--border-radius-border-radius-0, 4px);
  border: 1px solid rgba(82, 143, 255, 0.80);
  background: radial-gradient(77.2% 49.37% at 50% 53.05%, rgba(38, 97, 255, 0.49) 0%, rgba(13, 26, 89, 0.00) 100%), linear-gradient(180deg, #101839 0%, #162458 100%);
  box-shadow: 0 -13px 60px 0 rgba(56, 128, 255, 0.30) inset;
}

.customer-success_home#customer-success p.customer-success-footer{
    margin-bottom: 0 !important;
}

.radial-background-viewer_home.radial-background-viewer .filter-card:hover .c-card .c-card-content {
    margin-top: 0;
    transition: all .4s ease-in-out
}

.radial-background-viewer .filter-card .c-card .c-card-content {
    margin-top: 32px;
    transition: all .4s ease-in-out
}

.radial-background-viewer .filter-card h3 {
    margin-bottom: 20px
}

.addon-background .portfolio-grid {
    flex-wrap: wrap;
    gap: 22px;
    justify-content: center;
}

.hhs-blog-grid-cards{
      padding-bottom: 120px !important;
}

.addon-background .filter-card {
    border: 1px solid var(--Blue,#4a7bef);
    border-radius: 4px;
    flex: 0 0 calc(33.333% - 15px);
    max-width: calc(33.333% - 15px);
    position: relative;
    transition: border-color .3s ease,box-shadow .3s ease;
    width: calc(33.333% - 15px)
}

.resource-list .portfolio-grid {
    flex-wrap: wrap;
    gap: 22px
}

.resource-list .filter-card {
    border: 1px solid#38844b;
    border-radius: 4px;
    flex: 0 0 calc(33.333% - 27px);
    max-width: calc(33.333% - 27px);
    padding: 24px;
    padding-bottom: 0!important;
    position: relative;
    transition: border-color .3s ease,box-shadow .3s ease;
    width: calc(33.333% - 27px)
}

.addon-background .filter-card {
    padding: 0!important
}

.addon-background .filter-card .cta-primary {
    font-size: 18px!important
}

.addon-background .filter-card h3,
.addon-background .filter-card h3 span,
.radial-background-viewer .filter-card h3,
.radial-background-viewer .filter-card h3 span {
    font-size: 28px
}

.resource-list .filter-card h3 {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.42em;
    margin-top: 12px
}

.addon-background .filter-card p,
.addon-background .filter-card p span,
.radial-background-viewer .filter-card p,
.radial-background-viewer .filter-card p span {
    color: #b3b6bf;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 0
}

.resource-list .filter-card p,.resource-list .filter-card p span {
    color: #b3b6bf;
    font-size: 20px;
    margin-bottom: 0
}

.resource-list .filter-card .tag {
    align-items: center;
    background: #38844b;
    border-radius: 1000px;
    color: #fff;
    display: inline-flex;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    padding: 2px 12px;
    width: fit-content
}

.resource-list .filter-card .c-card-btn-con .cta-secondary {
    align-items: center;
    border: none;
    color: transparent!important;
    display: inline-flex;
    display: block;
    font-size: 20px;
    font-weight: 300;
    gap: 8px;
    height: max-content;
    letter-spacing: .001em;
    line-height: 30px;
    margin-top: -65px;
    padding-right: 0;
    text-decoration: none
}

.resource-list .filter-card .c-card-btn-con .cta-secondary:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%232cc656' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 4px;
    transition: background-image .2s ease;
    width: 16px
}


.resource-list .filter-card:hover .c-card-btn-con .cta-secondary:after{
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    transition: background-image .2s ease;
}


.radial-background-viewer .filter-card {
    background: radial-gradient(50% 25% at 50% 20%,rgba(38,97,255,.28) 0,rgba(13,26,89,0) 100%),linear-gradient(180deg,#080c1f,#0e1738);
    border: 1px solid rgba(82,143,255,.5);
    border-radius: 4px;
    box-shadow: inset 0 -13px 60px 0 rgba(56,128,255,.2);
    flex: 0 0 calc(33.333% - 27px);
    max-width: calc(33.333% - 27px);
    position: relative;
    transition: border-color .3s ease,box-shadow .3s ease;
    width: calc(33.333% - 27px)
}

.radial-background-viewer.company-grid .filter-card{
  border-radius: var(--border-radius-border-radius-0, 4px);
  border: 1px solid rgba(82, 143, 255, 0.50);
  background: radial-gradient(99.52% 56.25% at 96.69% 2.33%, rgba(38, 97, 255, 0.28) 0%, rgba(13, 26, 89, 0.00) 100%), linear-gradient(180deg, #080C1F 0%, #0E1738 100%);
  box-shadow: 0 -13px 60px 0 rgba(56, 128, 255, 0.20) inset;
}

.radial-background-viewer .filter-card:hover{
  border-radius: var(--border-radius-border-radius-0, 4px);
  border: 1px solid rgba(82, 143, 255, 0.50);
  background: radial-gradient(99.52% 56.25% at 96.69% 2.33%, var(--Blue, rgba(74, 123, 239, 0.50)) 0%, rgba(13, 26, 89, 0.00) 100%), linear-gradient(180deg, #080C1F 0%, #233371 100%);
  box-shadow: 0 -13px 60px 0 rgba(56, 128, 255, 0.20) inset;
}

#customer-success.customer-success .c-col.c-2 .c-content-con.c-in-1 p.stat,.customer-success .c-col p.stat {
    color: #fff;
    font-size: 80px;
    font-weight: 300;
    line-height: 110px;
    margin: 0
}

#customer-success.customer-success .c-col.c-2 .c-content-con.c-in-1 p,.customer-success .c-col p:not(.stat) {
    color: #b3b6bf;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 12px 0 0
}

blockquote.quote-desc,blockquote.quote-desc p {
    border: none;
    padding: 0
}

blockquote.quote-desc img {
    margin-bottom: 28px
}

blockquote.quote-desc {
    margin-bottom: 24px;
    margin-top: 148px;
    max-width: 770px;
}

.cell_1782370664249-background-layers {
    border-radius: 0 20px 20px 0
}

blockquote.quote-desc p {
    font-size: 28px;
    font-style: normal;
    font-weight: 500
}

.hs-content-id-215959927302 .quote-title {
    margin-top: 56px
}

.hs-content-id-215959927302 .quote-name {
    margin-bottom: 56px
}

.quote-name,.quote-title {
    padding-left: 40px
}

.quote-name {
    font-family: var(--font-heading);
    color: #b3b6bf;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 24px
}

.openfull {
    bottom: -25px;
    color: #2cc656;
    display: block;
    margin-bottom: -24px;
    position: relative
}

.openfull:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%232cc656' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 3px;
    transition: all .4s ease-in-out;
    width: 16px
}

.openfull:hover:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    transition: all .4s ease-in-out
}

.resource-list .filter-card .c-hover-scale:hover {
    transform: none
}

.resource-list .filter-card:hover .c-card-btn-con .cta-secondary {
    color: #fff !important;
  transition: all .2s ease-in-out;
}

.resource-list .filter-card:hover .tag {
    color: #000;
    transition: all .2s ease-in-out;
   background: #2CC656;
}

.resource-list .filter-card .c-card .flexi-card-outer:after {
    background: rgba(0,0,0,.2);
    border-radius: 4px;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    transition: all .2s ease-in-out;
    width: 100%
}

.resource-list .filter-card:hover .c-card .flexi-card-outer:after {
    background: transparent;
    transition: all .2s ease-in-out
}

.resource-list .filter-card .c-card .c-card-content .flexi-card-outer:after {
    display: none!important
}

.faq-section .hhs-accordion-1 {
/*     border-top: 1px solid hsla(0,0%,100%,.3)!important; */
    margin: 0 auto
}

.faq-section .hhs-accordion-1 li{
  position: relative;
  border-bottom: none!important;
}

.faq-section .hhs-accordion-1 li:after{
  background: hsla(0,0%,100%,.3);
    content: "";
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    transition: all .2s ease-in-out;
    width: 85%;
/*     border-bottom: 1px solid hsla(0,0%,100%,.3)!important */
}

.faq-section .hhs-accordion-1 a.accordion-title {
    padding-left: 0!important;
    padding: 20px 25px 20px 0
}

.faq-section .hhs-accordion-1 .hhs-accordion-content {
    padding: 0!important;
    max-width: 590px;
    padding-bottom: 2px !important;
}

.faq-section .hhs-accordion-1 a.accordion-title:after {
    border: none!important;
    border: none;
    color: #2cc656!important;
    content: "+";
    font-size: 40px;
    font-weight: 300;
    right: 0;
    top: 16px;
    transform: none;
    width: auto
}

.solutions-hero {
    position: relative
}

.solutions-hero:before {
    background-image: 
        linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
}

.solutions-all-hero:before,.solutions-hero:before {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2
}

.solutions-all-hero:before {
    background-image: 
        linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
}

.our-team-hero:before {
    background-image:
        linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2
}

.faq-section .hhs-accordion-1 a.accordion-title.active:after {
    content: "-"
}

.faq-section .hhs-rich-text.c2 li h4 {
    display: block!important;
    font-family: var(--font-body)!important
}

.faq-section .hhs-rich-text.c2 h4 {
    display: none!important
}

#homepage-hero.solutions-all-hero {
    padding: 80px 32px 56px!important
}

.solutions-bullets-cards .c-custom-bullets-con {
    border-bottom: 1px solid hsla(0,0%,100%,.2);
    border-top: 1px solid hsla(0,0%,100%,.2);
    margin-bottom: 16px;
    padding-left: 0!important;
    padding-top: 12px;
    position: relative
}

.solutions-bullets-cards .c-custom-bullets-con li {
    color: #fff;
    font-family: var(--font-body)!important;
    margin-bottom: 12px;
    position: relative
}

.solutions-bullets-cards .c-custom-bullets-con li .bullet-icon-con {
    display: none
}

#solutions-cards.solutions-bullets-cards .c-col-inner h3 {
    font-size: 36px!important;
    margin-bottom: 16px
}

.solutions-bullets-cards .c-custom-bullets-con li:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Check.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    background-size: cover;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 3px;
    pointer-events: none;
    position: relative;
    top: 4px;
    width: 16px;
    z-index: 2
}

.why-partner .c-col.c-2 {
    position: relative
}

.why-partner .c-col.c-2:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/artpattern.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    height: 340px;
    left: -150px;
    pointer-events: none;
    position: absolute;
    top: -105px;
    width: 340px;
    z-index: 2
}

.why-partner .c-col.c-1 .c-in-1 {
    padding-right: 100px
}

.why-partner .hs_cos_wrapper_type_inline_rich_text ul {
    margin-bottom: 0;
    margin-top: 24px;
    padding-left: 0
}

.why-partner .hs_cos_wrapper_type_inline_rich_text h3 {
    color: #fff;
    font-family: var(--font-body)!important;
    font-size: 24px;
    font-weight: 700
}

.why-partner .hs_cos_wrapper_type_inline_rich_text ul li {
    color: #fff;
    display: block;
    font-family: var(--font-body)!important;
    font-size: 16px
}

.why-partner .hs_cos_wrapper_type_inline_rich_text ul li:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/icons.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    background-size: cover;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 0;
    margin-right: 8px;
    pointer-events: none;
    position: relative;
    top: 4px;
    width: 16px;
    z-index: 2
}

.missing-video .c-content-con.c-in-1 a {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Button%20Play.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    border-radius: 100%;
    height: 138px;
    padding: 0;
    width: 138px
}

.missing-video .c-content-con.c-in-1 a:hover {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Property%201=hover.svg)
}

#hs_cos_wrapper_widget_1780464609854 .clean-base .c-2 .c-col-inner {
    border-radius: 8px
}

.missing-video .c-1 .c-in-1 {
    padding-right: 95px
}

.missing-video .c-1 .c-in-1 p {
    font-size: 20px;
    font-weight: 300
}

.missing-video h2 {
    font-size: 60px;
    line-height: 1.25em;
    margin-bottom: 24px
}

.missing-video .c-content-con.c-in-1 {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center
}

.bottom-logo h3 {
    font-size: 46px;
    margin-bottom: 24px
}

.company-grid.radial-background-viewer .filter-card .c-card-content {
    margin-top: 22px;
    position: relative
}

.company-grid.radial-background-viewer .filter-card h3,.company-grid.radial-background-viewer .filter-card h3 span {
    font-size: 20px;
    margin-bottom: 12px
}

.company-grid.radial-background-viewer .filter-card .c-card-btn-con a {
    color: #2cc656;
    font-size: 20px
}

.company-grid.radial-background-viewer .filter-card .c-card-btn-con {
    bottom: 0;
    left: 20px;
    opacity: 0;
    position: absolute;
    transition: all .5s ease-in-out
}

.company-grid.radial-background-viewer .filter-card:hover .c-card-btn-con {
    bottom: 27px;
    opacity: 1;
    transition: all .5s ease-in-out
}

.company-grid.radial-background-viewer .filter-card .c-card-content:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/arrow-sm-right-svgrepo-com%201.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    background-size: cover;
    bottom: 26px;
    content: "";
    display: inline-block;
    height: 22px;
    left: 20px;
    pointer-events: none;
    position: absolute;
    transition: all .5s ease-in-out;
    width: 22px;
    z-index: 2
}

.company-grid.radial-background-viewer .filter-card:hover .c-card-content:after {
    left: 120px;
    transition: all .5s ease-in-out
}

.why-partner h2 {
    margin-bottom: 24px
}

.why-partner .hs_cos_wrapper_type_inline_rich_text h3 {
    margin-bottom: 24px;
    margin-top: 24px
}

.why-partner .c-col.c-1 .c-in-1 p {
    font-size: 16px;
    font-weight: 400
}

.company-grid.radial-background-viewer .filter-card {
    flex: 0 0 calc(25% - 25px);
    height: 280px;
    max-width: calc(25% - 25px);
    width: calc(25% - 25px)
}

.company-grid.radial-background-viewer .portfolio-grid {
    gap: 32px
}

.parents-hero {
    position: relative
}

.parents-hero:before {
    background-image:
        linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ), 
      var(--customer-hero-image, none);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2
}

.technology-cards.radial-background-viewer .filter-card .c-card .c-card-content {
    margin-top: 0;
    padding-top: 20px!important
}

.technology-cards.radial-background-viewer .filter-card {
    flex: 0 0 calc(25% - 25px);
    height: 380px;
    max-width: calc(25% - 25px);
    width: calc(25% - 25px)
}

.technology-cards.radial-background-viewer .filter-card h3 {
    align-items: end;
    display: flex;
    height: 65px
}

.technology-cards.radial-background-viewer .portfolio-grid {
    gap: 20px
}

.video_post {
    display: block;
    margin-right: 60px;
    position: relative;
    z-index: 4
}

.video_post img{
    border-radius: 8px;
}

.video_post .play {
    left: 50%;
    margin-left: -65px;
    margin-top: 150px;
    position: absolute;
    top: 0;
    width: 138px;
    opacity: 1;
}

.video_post:hover .play{
    opacity: 0;
}

.video_post:hover .playhover{
    opacity: 1;
}


.video_post .playhover{
    opacity: 0;
    left: 50%;
    margin-left: -65px;
    margin-top: 150px;
    position: absolute;
    top: 0;
    width: 138px;
    opacity: 0;
}

.why-hero:before {
   background-image:
     linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ), var(--customer-hero-image, none);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2
}

.hs-content-id-215703022220.hs-site-page .dnd_area-row-2-background-layers,.image-visualization {
    position: relative
}

.hs-content-id-215703022220.hs-site-page .dnd_area-row-2-background-layers:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Patternbg.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    height: 100%;
    left: 50%;
    margin-left: -350px;
    position: absolute;
    top: 0;
    width: 700px;
    z-index: 2
}

.hs-content-id-215880102666.hs-site-page .dnd_area-row-3-background-layers {
    position: relative
}

#solutions-cards .row{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}


.hs-content-id-215880102666.hs-site-page .dnd_area-row-3-background-layers:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Patternbg.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 100%;
    left: 50%;
    margin-left: -350px;
    position: absolute;
    top: 0;
    width: 700px;
    z-index: 2
}

.radial-background-viewer_home.radial-background-viewer .filter-card .c-card .c-card-content {
    margin-top: 57px;
      padding: 32px 24px !important;
}

.radial-background-viewer .filter-card {
/*     height: 360px; */
}

.radial-background-viewer.radial-background-viewer_home .filter-card{
    height: auto;
}

.imaging-strategy.missing-video h4 {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.42em;
    margin-bottom: 20px
}

.customer-success_home h2 {
    padding-left: 50px
}

.imaging-strategy.missing-video .c-content-con.c-in-1 {
    justify-content: flex-end;
    padding-right: 70px
}

.imaging-strategy.missing-video .c-2 .c-content-con.c-in-1 {
    padding-right: 0
}

.hs-content-id-213294146052.hs-site-page .dnd_area-row-3-background-layers {
    position: relative
}

/* REMOVED 2026-08-15 — homepage row-3 Patternbg overlay.
   A 740px-wide Patternbg.png ::before at height:160% and z-index:2
   on the homepage's row-3 background layer (page 213294146052),
   built for the "X%" trust bar that used to sit in that row. That
   module has been deleted and the homepage re-sequenced, so row 3
   is now the solutions section: measured 2026-08-14, the overlay
   rendered 1,864px tall on an 1,165px row, painting over the
   product cards and spilling ~700px into the next section.
   It was suppressed with content:none from custom.css; now that the
   two files are merged it is simply deleted, along with its
   max-width:992px variant further down.
   The rule was keyed to row INDEX, not to content, so it re-targets
   whatever lands at position 3 — do not reinstate it without pinning
   it to specific content. The equivalent overlay on
   /enterprise-imaging-solutions (215880102666) is a separate copy
   and is intentionally left alone.
   The original declarations were:
     background-image: url(.../Patternbg.png); background-position:50%;
     background-repeat:no-repeat; background-size:cover; content:"";
     height:160%; left:50%; margin-left:-370px; position:absolute;
     top:0; width:740px; z-index:2;
   and at max-width:992px: height:100%; left:0; margin-left:0;
     position:absolute; top:0; width:100%; */
#solutions-overview h2 {
    margin-bottom: 24px
}

.clean-base.workflow a {
    align-items: center;
    background-color: #2cc656;
    border-radius: 100%;
    display: flex;
    height: 138px;
    justify-content: center;
    padding: 40px 39px 40px 48px;
    transition: all .3s ease-in-out;
    width: 138px
}

.clean-base.workflow a:hover {
    background-color: #38844b
}

.relations-bg:after{
  content: '';
  right: 0;
  top: 0;
  width: 55%;
  height: 100%;
  position: absolute;
  z-index: 2;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(0, 0, 0, 0.6) 35%,
    rgba(0, 0, 0, 0.2) 70%,
    rgba(0, 0, 0, 0) 100%
);
  
}

.relations-bg:before {
   background-image:
       linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
     var(--customer-hero-image, none);
}


.carreers-hero:before,.relations-bg:before {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2;
}

.carreers-hero:before {
   background-image:
       linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
     var(--customer-hero-image, none);
}

.customer-hero:before {
    background-image:
        linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
    background-size: cover;
    bottom: 0;
    right: 0;
    top: 0;
    width: 60%;
    z-index: 2
}

.customer-hero:before,.video_post:before {
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    pointer-events: none;
    position: absolute
}

.video_post:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Vectorvideoleft.svg);
    background-size: contain;
    background-size: cover;
    bottom: -140px;
    display: block;
    height: 285px;
    left: -230px;
    width: 285px;
    z-index: 1
}

#hs_cos_wrapper_module_17827514485895 .hhs-accordion-1 a.accordion-title {
    padding: 20px 25px 20px 0
}

#hs_cos_wrapper_module_17827514485895 .hhs-accordion-1 a.accordion-title h4 {
    font-size: 28px!important
}

#hs_cos_wrapper_module_17827514485895 .hhs-accordion-1 li:after{
    width: 100%;
}

#flamingo-cta .c-col-inner p {
    font-size: 24px!important;
    font-weight: 500
}

#flamingo-cta.clean-base .c-video-inner {
    background: #000
}

.faq-section a.accordion-title h4 {
  font-family: var(--font-heading);
    font-weight: 700;
}

.faq-section .hhs-accordion-1 {
    border-top: none!important;
}

.faq-section .hhs-accordion-content p {
    font-size: 16px!important;
}

#hs_cos_wrapper_module_17827514485895 .faq-section .hhs-rich-text.c2 li .accordion-title h4 {
    font-weight: 600;
 font-family: var(--font-heading) !important;
}

#hs_cos_wrapper_module_17823070975152 .clean-base.workflow .row {
    border-radius: 8px
}

#hs_cos_wrapper_module_17823070975152 .clean-base.workflow {
    padding: 0 90px
}

.radial-background-viewer.pb120 {
    padding-bottom: 120px
}

.clean-base.related-overview .c-col.c-1 {
    padding: 0
}

.resource-list .filter-card .c-card img {
    border-radius: 4px
}

#homepage-hero h1 {
    margin-bottom: 16px
}

#homepage-hero .c-cta-group {
    margin-top: 48px
}

.addon-background .c-card-content {
    padding: 32px 24px!important
}

.addon-background .c-card-content .c-card-btn-con {
    padding-top: 24px
}

.solutions-bullets-cards {
    margin-top: 48px
}

.missing-video .c-col.c-2 {
    position: relative
}

.missing-video .c-col.c-2 .c-rel {
    z-index: 22
}

.missing-video .c-col.c-2:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/artpattern.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    height: 340px;
    left: -150px;
    pointer-events: none;
    position: absolute;
    top: -105px;
    width: 340px;
    z-index: 2
}

#homepage-hero .hs_cos_wrapper_type_inline_rich_text p {
    font-family: var(--font-heading);
    color: #fff;
    font-size: 24px;
    font-weight: 500
}

#homepage-hero.resource-hero .hs_cos_wrapper_type_inline_rich_text p{
    font-weight: 400;
}

.mission-faq-section.faq-section .hhs-accordion-content p {
    font-family: var(--font-heading);
    font-size: 20px!important;
    font-weight: 300;
}

.mission-faq-section.faq-section .hhs-accordion-1 a.accordion-title:after {
    top: 20px
}

.mission-faq-section.faq-section .hhs-accordion-1 li:not(:first-child) a {
    padding-top: 36px!important
}

.mission-faq-section.faq-section .hhs-accordion-1 li:not(:first-child) a.accordion-title:after {
    top: 36px
}
.hs_cos_wrapper_type_form .hsfc-Step__Content,
.form-hero .hsfc-Step__Content {
    background: rgba(28,28,28,.8);
    border: 1px solid rgba(78,132,246,.5);
    border-radius: var(--border-radius-border-radius-full,20px);
    box-shadow: 0 0 17.1px 14px rgba(78,132,246,.15);
    padding: 32px!important
}

.hs_cos_wrapper_type_form .hsfc-PhoneInput__FlagAndCaret,
.form-hero .hsfc-PhoneInput__FlagAndCaret {
    display: none!important
}
.hs_cos_wrapper_type_form .hsfc-PhoneInput,
.hsfc-PhoneInput {
    border-left: 1px solid #fff!important;
    border-radius: 4px
}
.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-RichText p,
.form-hero [data-hsfc-id=Renderer] .hsfc-RichText p {
    color: #fff;
    font-family: var(--font-body);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 4px!important
}
.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] label span,
.form-hero [data-hsfc-id=Renderer] label span {
    color: #fff;
    font-family: var(--font-heading);
    font-size: 16px
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-ErrorAlert,
.form-hero [data-hsfc-id=Renderer] .hsfc-ErrorAlert {
    font-size: 16px
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] input,
.form-hero [data-hsfc-id=Renderer] input {
    background: transparent;
    border: 1px solid #fff;
    border-radius: 4px;
    color: #fff;
    font-size: 16px
}
.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] input::placeholder,
.form-hero [data-hsfc-id=Renderer] input::placeholder {
    color: #fff
}
.hs_cos_wrapper_type_form  [data-hsfc-id=Renderer] textarea,
.form-hero [data-hsfc-id=Renderer] textarea {
    background: transparent;
    border: 1px solid #fff;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    height: 86px;
    max-height: 86px;
    min-height: auto
}
.hs_cos_wrapper_type_form .hsfc-DropdownInput .hsfc-DropdownInput__Caret,
.form-hero [data-hsfc-id=Renderer] .hsfc-DropdownInput .hsfc-DropdownInput__Caret {
    display: none
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-DropdownInput:after 
.form-hero [data-hsfc-id=Renderer] .hsfc-DropdownInput:after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'><path d='M12.0607 1.06067L6.56067 6.56067L1.06067 1.06067' stroke='%232CC656' stroke-width='1.5' stroke-linecap='square'/></svg>");
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    display: block;
    height: 8px;
    position: absolute;
    right: 12px;
    width: 14px
}
.hs_cos_wrapper_type_form .hsfc-CheckboxInput,
.form-hero .hsfc-CheckboxInput {
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: 2px solid #4ade80;
    border-radius: 6px;
    cursor: pointer;
    flex-shrink: 0;
    height: 22px;
    margin: 0;
    min-width: 22px;
    position: relative;
    width: 22px
}
.hs_cos_wrapper_type_form .hsfc-CheckboxInput:checked,
.form-hero .hsfc-CheckboxInput:checked {
    background-color: transparent;
    border-color: #4ade80
}

.hs_cos_wrapper_type_form .hsfc-CheckboxInput:checked:after,
.form-hero .hsfc-CheckboxInput:checked:after {
    border: solid #4ade80;
    border-width: 0 2px 2px 0;
    content: "";
    height: 11px;
    left: 5px;
    position: absolute;
    top: 1px;
    transform: rotate(45deg);
    width: 6px
}

.hs_cos_wrapper_type_form .hsfc-CheckboxInput,
.form-hero [data-hsfc-id=Renderer] .hsfc-CheckboxInput {
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: 2px solid #2cc656;
    border-radius: 6px;
    cursor: pointer;
    flex-shrink: 0;
    height: 22px;
    margin: 0;
    min-width: 22px;
    position: relative;
    width: 22px
}

.hs_cos_wrapper_type_form .hsfc-CheckboxInput:checked,
.form-hero [data-hsfc-id=Renderer] .hsfc-CheckboxInput:checked {
    background-color: transparent;
    border-color: #2cc656
}
.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-CheckboxInput:checked:after,
.form-hero [data-hsfc-id=Renderer] .hsfc-CheckboxInput:checked:after {
    background-color: #2cc656;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='9' viewBox='0 0 12 9' fill='none'><path d='M10.5389 0.521606L3.76408 7.52161L0.53894 4.18934' stroke='%232CC656' stroke-width='1.5' stroke-miterlimit='10' stroke-linejoin='round'/></svg>");
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    height: 9px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 12px
}

.form-hero ul {
    margin-bottom: 24px;
    margin-top: 48px;
    padding: 0
}

.form-hero ul li {
    font-family: var(--font-body);
    color: #fff;
    display: block;
    font-size: 16px
}

.form-hero ul li *{
    font-family: var(--font-body);
}

.form-hero ul li span {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 400;
    gap: 4px
}

.contact-social {
    display: flex;
    gap: 16px
}

.contact-social a:hover svg g path:not(.bgsoc){
    fill: #2CC656;
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons,
.form-hero [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons {
    justify-content: flex-start!important
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons .hsfc-Button,
.form-hero [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons .hsfc-Button {
    background-color: #2cc656;
    border-radius: 4px;
    color: #000;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 500;
    padding: 8px 16px
}

.hs_cos_wrapper_type_form [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons .hsfc-Button:hover,
.form-hero [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons .hsfc-Button:hover {
    background-color: #38844b!important;
    color: #fff!important;
    transform: none
}

.hs_cos_wrapper_type_form  [data-hsfc-id=Renderer] .hsfc-NavigationRow,
.form-hero [data-hsfc-id=Renderer] .hsfc-NavigationRow {
    margin-top: 24px!important
}

.mix-gallery .c-card img {
    margin: 0!important
}

.mix-gallery .c-card .c-card-content {
    margin-top: 24px!important
}

.mix-gallery .filter-card {
    padding: 12px!important
}

.mix-gallery img {
    width: 100%!important
}

.actually-list {
    position: relative
}

.actually-list:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Patternbg.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    height: 100%;
    left: 50%;
    margin-left: -350px;
    position: absolute;
    top: 0;
    width: 700px;
    z-index: 2
}

.actually-list .hs_cos_wrapper_type_inline_rich_text {
    border-top: 3px solid#2cc656
}

.actually-list .hs_cos_wrapper_type_inline_rich_text h4 {
    display: block;
    font-size: 36px;
    font-weight: 300;
    padding: 24px 0
}

.actually-list .hs_cos_wrapper_type_inline_rich_text p {
    color: hsla(0,0%,100%,.7);
    font-size: 20px;
    font-weight: 300
}

.team-grid.radial-background-viewer .portfolio-grid{
    padding: 0 195px;
}

.team-grid.radial-background-viewer .filter-card h3 span {
    font-size: 18px
}


.radial-background-viewer.team-grid .filter-card .c-card .c-card-content{
    margin-top: 7px;
}
.team-grid.radial-background-viewer .filter-card h3 {
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px!important
}

.team-grid.radial-background-viewer .filter-card em {
    display: block;
    font-size: 16px;
    font-weight: 400;
    margin-top: 12px
}

.team-grid.radial-background-viewer .filter-card {
    height: auto
}

.hs_cos_wrapper_type_rich_text ul.offer-list {
    column-count: 2;
    column-gap: 20px;
    margin-bottom: 190px;
    margin-left: 90px;
    margin-top: 16px;
    max-width: 790px;
    padding-left: 0
}

.hs_cos_wrapper_type_rich_text .offer-title {
    color: #fff;
    font-size: 60px;
    font-weight: 300;
    margin-bottom: 16px;
    margin-left: 90px;
    margin-top: 190px
}

.next-chapter {
    position: relative
}

.next-chapter:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/banner-flamingo.png);
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%
}

.next-chapter .c-col.c-2:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/ChapterPattern.png);
    content: "";
    height: 480px;
    left: -354px;
    position: absolute;
    top: -190px;
    width: 480px
}

.hs_cos_wrapper_type_rich_text ul.offer-list li {
    break-inside: avoid;
    color: #fff;
    display: block;
    font-family: var(--font-heading)!important;
    font-size: 16px
}

.hs_cos_wrapper_type_rich_text ul.offer-list li:before {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/icons.svg);
    background-size: contain;
    display: inline-block;
    height: 16px;
    margin-left: 0;
    margin-right: 8px;
    position: relative;
    top: 4px;
    width: 16px
}

.access-customer .c-col.c-1:after,.hs_cos_wrapper_type_rich_text ul.offer-list li:before {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    pointer-events: none;
    z-index: 2
}

.access-customer .c-col.c-1:after {
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/artpattern.svg);
    bottom: 0;
    height: 340px;
    left: -150px;
    position: absolute;
    top: -105px;
    width: 340px
}

.access-customer ul {
    margin-bottom: 24px;
    margin-top: 32px;
    padding: 0
}

.access-customer ul li {
    color: #fff;
    display: block;
    font-size: 16px
}

.access-customer ul li span {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 400;
    gap: 4px;
    font-family: var(--font-body);
}

.clean-base.access-customer .row {
    align-items: center
}

.clean-base.access-customer img.customer-main {
    border-radius: 8px
}

.clean-base.access-customer p {
    font-size: 16px;
    margin-top: 16px;
      font-weight: 400;
      font-family: var(--font-body);
}

#solutions-overview .container-slim {
    max-width: 960px!important
}

#solutions-overview .container-slim p {
    margin-bottom: 48px;
    font-family: var(--font-heading);
    font-weight: 300;
}



#customer-success .c-col.c-1 {
/*     padding-right: 115px */
}

#customer-success .read-more:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%232cc656' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 3px;
    transition: all .4s ease-in-out;
    width: 16px
}

#customer-success .read-more:hover:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3 8h10m0 0L9 4m4 4-4 4'/%3E%3C/svg%3E");
    transition: all .4s ease-in-out
}

#customer-success .read-more{
  transition: all .4s ease-in-out
}

#customer-success .read-more:hover{
  color: #fff;
  transition: all .4s ease-in-out
}

.footer-main .col-title{
  font-family: var(--font-heading) !important;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 0;
}

.footer-main .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a{
  font-family: var(--font-heading) !important;
  color: #B3B6BF !important;
  font-weight: 400 !important;
  line-height: 1.6em !important;
}
.footer-main .hhs-foot-nav-base .col-sm-6{
  flex: 0 0 100%;
    max-width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 0;
}

.footer-main  .hhs-foot-break-line{
    border-color: #000;
      padding-top: 100px;
    padding-bottom: 100px;
    margin: 0;
}

.footer-main .hs-menu-wrapper.hs-menu-flow-horizontal>ul li{
    line-height: 1 !important;
    margin-bottom: 16px !important;
}
.footer-main .hs-menu-wrapper.hs-menu-flow-horizontal>ul li:last-child{
    margin-bottom: 0 !important;
}

.footer-main .hhs-foot-nav-base{
    margin-bottom: 0;
    padding-top: 25px;
    border-top: 1px solid rgba(255, 255, 255, 0.30);
}


.hhs-foot-copyright {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
  font-family: var(--font-heading) !important;
}

.footer-main .row.hhs-foot-nav-cols{
   border-top: 1px solid rgba(255, 255, 255, 0.30);
    padding-top:40px;
}

.home-customer-title.desktop-version{
  display: block !important;
  margin-left: 45px !important;
  margin-bottom: 48px !important;
}
.home-customer-title.mobile-version{
  display: none  !important;
}

.hs-content-id-216578858524 .dnd_area-row-6-background-layers .hs_cos_wrapper_type_linked_image{
  display: none  !important;
}

.s-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 50%;
  height: 100%;
  right: 0;
  top: 0;
  left: auto;
  background: #000;
}

.radial-background-viewer.technology-cards .filter-card{
  border-radius: var(--border-radius-border-radius-0, 4px);
  border: 1px solid rgba(82, 143, 255, 0.50);
  background: radial-gradient(50% 25% at 50% 20%, rgba(38, 97, 255, 0.28) 0%, rgba(13, 26, 89, 0.00) 100%), linear-gradient(180deg, #080C1F 0%, #0E1738 100%);
  box-shadow: 0 -13px 60px 0 rgba(56, 128, 255, 0.20) inset;
}

.radial-background-viewer.technology-cards .filter-card:hover{
  border-radius: var(--border-radius-border-radius-0, 4px);
  border: 1px solid rgba(82, 143, 255, 0.80);
  background: radial-gradient(77.2% 49.37% at 50% 53.05%, rgba(38, 97, 255, 0.49) 0%, rgba(13, 26, 89, 0.00) 100%), linear-gradient(180deg, #101839 0%, #162458 100%);
  box-shadow: 0 -13px 60px 0 rgba(56, 128, 255, 0.30) inset;
}

h2.recognized-title{
    font-size: 36px;
}

h2.trusted-title{
  font-size: 36px;
}

#solutions-cards.solutions-cards-home.clean-base .c-col-inner{
    transition: all .3s ease-in-out;
}

#solutions-cards.solutions-cards-home.clean-base .c-1 .c-col-inner:hover{
    transition: all .3s ease-in-out;
    background-size: cover;
    background-position: center center;
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/col1.jpg) !important;
    transform: scale(1.05);
}

#solutions-cards.solutions-cards-home.clean-base .c-2 .c-col-inner:hover{
    transition: all .3s ease-in-out;
    background-size: cover;
    background-position: center center;
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/col2.jpg) !important;
    transform: scale(1.05);
}

#solutions-cards.solutions-cards-home.clean-base .c-3 .c-col-inner{
  cursor: pointer;
}

#solutions-cards.solutions-cards-home.clean-base .c-3 .c-col-inner:hover{
    transition: all .3s ease-in-out;
    background-size: cover;
    background-position: center center;
    background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/col3.jpg) !important;
    transform: scale(1.05);
}

#solutions-cards.solutions-cards-home.clean-base .c-col-inner:hover .c-cta-group a{
    background-color: #2cc656;
    color: #000 !important;
    border: 1px solid #2cc656;
}


#solutions-cards.solutions-cards-home.clean-base .c-col-inner h3{
    transition: all .3s ease-in-out;
}

#solutions-cards.solutions-cards-home.clean-base .c-col-inner:hover h3{
    font-size: 46px !important;
    transition: all .3s ease-in-out;
}
#homepage-hero.resource-hero{
    padding-bottom: 0 !important;
    padding: 120px 32px 100px;
}
#homepage-hero.resource-hero .hs_cos_wrapper_type_inline_rich_text img{
  position: absolute;
    top: -130px;
}
.rn .fn-blob {
    height: 262px;
    left: 6px;
    pointer-events: none;
    position: absolute;
    top: 180px;
    width: 259px;
    z-index: 0;
}



/* ============================================================
   MACH7 BLOG — Productive Edge–style layout
   Scope: blog article + listing pages only. Safe for the
   child theme stylesheet. Validated on Clean Pro (dev post
   /why-flamingo).  Note: swap the brand-green value below for
   the theme's existing green token so pills match site-wide.
   ============================================================ */

/* ===== ARTICLE — FULL-BLEED HERO WITH TITLE OVERLAY ===== */
.blog-post-type--blog .blog-header-full,
.blog-post-type--resources .blog-header-full {
  position: relative; overflow: hidden;
  padding: 0 !important;              /* removes Clean Pro's ~100px top gap */
  margin-bottom: 60px !important;
  min-height: 480px; background: #0b0b0f;
}
.blog-post-type--resources .blog-header.post-header.container,
.blog-post-type--blog .blog-header.post-header.container
{
  max-width: none !important;
  padding: 0 !important;
  width: 100%;
}
.blog-post-type--blog .blog-header__inner.row,
.blog-post-type--resources .blog-header__inner.row { 
  position: static; 
  margin: 0 !important;
  height: 100%;
  display: flex;
  align-items: flex-end; 
}
.blog-post-type--resources .blog-header__inner > .col-lg-5 ,
.blog-post-type--blog .blog-header__inner > .col-lg-5 
{
  position: absolute; inset: 0; z-index: 0;
  padding: 0 !important; width: 100%; height: 100%; max-width: none; flex: none;
}

.blog-post-type--blog .blog-header__inner > .col-lg-5 img,
.blog-post-type--resources .blog-header__inner > .col-lg-5 img {
    width: 50% !important;
   height: 100% !important;
  object-fit: cover;
   object-position: center 40%;
      margin-left: auto;
   display: block;   /* crop control */
}
/* The horizontal scrim.
   Was a WHITE ramp, which forced black title/meta text and washed
   the left half of the featured image out to near-solid white.
   Inverted to dark 2026-08-14 (this lived in custom.css until the
   two files were merged on 2026-08-15).

   Stops are tuned, not copied. The text column is capped at 86%
   with 6vw padding each side, so text always ends at 80% across —
   that is the only stop that has to clear AA. 0.60 at 80% computes
   to 5.7:1 for white text over a worst-case white photo (0.535 is
   the 4.5:1 break-even). Everything past 80% is free and releases
   fast so the photo is not buried. The photo starts at 50% (the
   img is width:50%, right-aligned), so stops below 50% sit over
   the #0b0b0f base and do nothing visible.
   KEEP IN STEP: if the column cap below moves, move the 80% stop
   with it. The mobile counterpart is in the merged block at the
   end of this file. */
.blog-post-type--blog .blog-header__inner::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to right,
              #000000 45%,
              rgba(0, 0, 0, 0.80) 62%,
              rgba(0, 0, 0, 0.60) 80%,
              rgba(0, 0, 0, 0.15) 93%,
              transparent 100%);
}

.blog-post-type--resources .blog-header__inner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
/*   background: linear-gradient(180deg, rgba(0,0,0,.2) 0%, rgba(0,0,0,.5) 55%, rgba(11,11,15,.9) 100%); */
  background: linear-gradient(to right, #000000 45%, rgba(0, 0, 0, 0.85) 68%, rgba(0, 0, 0, 0.3) 85%, transparent 100%);
}

/* The text column cap the scrim above is tuned to.
   Was a flat max-width:1100px, which capped line length on wide
   screens but did nothing between ~768px and 1265px — there the
   column simply filled the header and a title could run to 94%
   across, into the zone where the scrim has almost nothing left.
   Measured on the old rule: title text reached 90.8% at 800px wide
   and 89% at 992px. min() keeps the 1100px measure cap on large
   screens and adds a proportional cap below it. With 6vw padding
   each side, content always ends at 86% - 6% = 80% of the header at
   every width. */
.blog-post-type--blog  .blog-header__inner > .col-lg-7 { position: relative; z-index: 2; flex: 1; padding: 0 6vw 44px !important; max-width: min(1100px, 86%); }
.blog-post-type--blog  .blog-header__inner .blog-post__title,
.blog-post-type--blog  .blog-header__inner .reading-minutes,
.blog-post-type--blog  .blog-header__inner .blog-post__meta,
.blog-post-type--blog  .blog-header__inner .blog-post__meta *,
.blog-post-type--blog  .blog-header__inner .blog-post__timestamp { color: #fff !important; }
/* Four black-text overrides used to sit here and at ~line 3000,
   each re-darkening an element the white group rule above had just
   set, to suit the old white scrim. With the scrim dark they were
   all wrong, and were countered from custom.css until the merge on
   2026-08-15 — now simply deleted, which is what the overrides were
   emulating. Deleted, in case they are ever missed:
     .blog-post__title                      { color:#000 }
     .blog-header-full .col-lg-7 .blog-post__tag-link { color:#000 }
     .col-lg-7 .blog-post__meta .meta-author a        { color:#000 }
     .blog-post__meta *, .blog-post__timestamp        { color:#000 }
   The tag-link one was NOT redundant with load order: at 0,4,0 it
   outranked both the pill system near the end of this file and the
   0,3,0 white rule above, so removing it is what actually lets the
   pill go light. The meta-author one matches nothing today — the
   author name and avatar were removed from the header markup, since
   the author card in the right rail already carries them. */
.blog-post-type--blog  .blog-header__inner .blog-post__title {
 font-size: 80px;
  font-weight: 300;
 line-height: 137%;
  margin-bottom: 80px;
}

.blog-post-type--resources .blog-header__inner > .col-lg-7 { position: relative; z-index: 2; flex: 1; padding: 0 6vw 44px !important; max-width: 1100px; }
.blog-post-type--resources .blog-header__inner .blog-post__title,
.blog-post-type--resources .blog-header__inner .reading-minutes,
.blog-post-type--resources .blog-header__inner .blog-post__meta,
.blog-post-type--resources .blog-header__inner .blog-post__meta *,
.blog-post-type--resources .blog-header__inner .blog-post__timestamp { color: #fff !important; }
.blog-post-type--resources .blog-header__inner .blog-post__title {
 font-size: 80px;
  font-weight: 300;
 line-height: 137%;
  margin-bottom: 80px;
}
.blog-post-type--resources .reading-minutes { display: inline-flex; align-items: center; gap: .4em; text-transform: uppercase; letter-spacing: .09em; font-size: .72rem; font-weight: 700; }
.blog-post-type--resources .blog-post__meta img { border: 2px solid rgba(255,255,255,.7); }


.blog-post-type--blog  .blog-header-full .blog-post__tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.blog-post-type--blog  .blog-header-full .blog-post__tag-link {
  display: inline-block; padding: .35em .9em; border-radius: 999px;
  font-size: .7rem; letter-spacing: .06em; text-transform: uppercase;
  color: #fff !important; text-decoration: none;
}
/* ===== ARTICLE — CATEGORY PILLS ===== */
.blog-post-type--resources .blog-header-full .blog-post__tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.blog-post-type--resources .blog-header-full .blog-post__tag-link {
  display: inline-block; padding: .35em .9em; border-radius: 999px;
  font-size: .7rem; letter-spacing: .06em; text-transform: uppercase;
  color: #fff !important; text-decoration: none;
}

.hhs-blog-grid-cards .blog-index__post-tag{
  margin-bottom: 16px;
}
/* ===== ARTICLE — READING COLUMN + SECTION RHYTHM ===== */
.blog-post-type--resources .blog-post__body {
  max-width: 760px;
   margin: 0 auto;
   font-size: 1.15rem;
   line-height: 1.75;
}

.blog-post-type--resources .blog-post__body h2,
.blog-post-type--resources .blog-post__body h3,
.blog-post-type--resources .blog-post__body h4,
.blog-post-type--resources .blog-post__body h5,
.blog-post-type--resources .blog-post__body h6{
  margin-bottom: 16px;
  font-family: var(--font-heading);
  font-weight: 300;
  padding-top: 16px;
  margin-top: 0;
    color: #fff;
  line-height: 116.667%;
  padding-top: 0 !important;
  margin-top: 24px !important;
}
.blog-post-type--resources .blog-post__body h2 ,
.blog-post-type--resources .blog-post__body h2 *
{
  font-size: 46px;
}

.blog-post-type--resources .blog-post__body h3 ,
.blog-post-type--resources .blog-post__body h3 *
{
  font-size: 36px;
}

.blog-post-type--resources .blog-post__body h4 ,
.blog-post-type--resources .blog-post__body h4 *{
  font-size: 28px;
}

.blog-post-type--resources .blog-post__body h5,
.blog-post-type--resources .blog-post__body h5 *{
  font-size: 24px;
  font-weight: 500;

}

.blog-post-type--resources .blog-post__body h6 ,
.blog-post-type--resources .blog-post__body h6 *{
  font-size: 20px;
  font-weight: 500;

}

.cta-secondary{
    font-weight: 500;
}

.static-row .hs_cos_wrapper_type_inline_rich_text p:last-child{
  font-size: 16px !important;
  font-weight: 400;
}

.missing-video.imaging-strategy .c-cta-group{
    position: relative;
    top: -30px;
}

/* ===== ARTICLE — SHARE ROW ===== */
.social-sharing-wrapper { display: flex; align-items: center; }

/* ===== LISTING — CARD TAG PILLS (match the article's green) ===== */
.blog-index__post-tag {
  background: var(--brand-green, #00b140) !important;   /* use the same green as .blog-post__tag-link */
  color: #fff !important; border-radius: 999px;
  text-transform: uppercase; letter-spacing: .05em;
}

 
p.reading-minutes{
   margin-bottom: 12px;
    font-size: 16px !important;
    text-transform: capitalize;
      font-weight: 400;
   font-family: var(--font-heading) !important;
}
.hs-blog-post .blog-post-type--resources .blog-post__tag-link{
    align-items: center;
    background: #38844b;
    border-radius: 1000px;
    text-transform: capitalize;
    color: #fff;
    display: inline-flex;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    padding: 2px 12px;
    width: fit-content;
}


.blog-post-type--resources .blog-header.post-header{
  position: relative;

}

.blog-post-type--resources .blog-header.post-header:after{
  position: absolute;
  width: 100%;
  height: 100%;
  content: '';
  left: 0;
  top: 0;
  background: linear-gradient(to right, #000000 0%, rgba(0, 0, 0, 0.85) 25%, rgba(0, 0, 0, 0.3) 55%, transparent 80%);
}

.hs-blog-post .blog-post-type--resources{
  background-color: #000;
  color: #fff;
  padding-top: 60px;
}

.hs-blog-post .blog-post-type--resources .blog-post li,
.hs-blog-post .blog-post-type--resources .blog-post p,
.hs-blog-post .blog-post-type--resources .blog-post a
{
  color: #fff;
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 300;
}

/* A11Y 2026-08-17 (P1): removed a blanket `.blog-post li{color:#fff!important}`.
   Unscoped, it leaked the dark-ground styling of `.blog-post-type--resources`
   onto EVERY post, so body lists rendered white-on-white (1.00:1) on the
   standard white-ground posts. Confirmed on 4 live posts. The correctly-scoped
   rule immediately above still colours resource-type posts white, and the
   parent theme's `.blog-post li{color:#666}` now applies elsewhere. */ 

.hs-blog-post .blog-post-type--resources .blog-post a{
  color: #2CC656;
  text-decoration: underline;
  font-size: 20px;
}


#homepage-hero.resource-hero .row{
    padding-bottom: 40px !important;
}

.post-header .blog-header__inner{
    padding-top: 184px !important;
     padding-bottom: 40px !important;
}

.hs-blog-post .blog-post-type--resources .hs-blog-social-share .hs-blog-social-share-list li{
    margin-bottom: 0  !important;
}

.hs-blog-post .blog-post-type--resources .blog-post ul,
.hs-blog-post .blog-post-type--resources .blog-post ol{
  padding-left: 20px !important;
  margin-top: 0  !important;
}

.hs-blog-post .blog-post-type--resources .hs-blog-social-share .hs-blog-social-share-list{
    margin: 0  !important;
    padding: 0 !important;
}

.hs-blog-post .blog-post{
    padding: 0 !important;
}
.blog-post__meta {
    margin: 0;
}

.hs-content-id-213294146052 .dnd_area-row-7-background-layers .module_1784820617952-flexbox-positioning{
  display:none;
}

body .mega-menu{
  background: #000 !important;
  top: calc(75px - 6px);
  border-top: 1px solid #444;
}

.header .hhs-nav-grid{
  align-items: flex-start;
}

.header .hhs-header-logo {
    padding-top: 15px;
}

.header .hhs-nav-grid__extras{
    padding-top: 15px;
}

body .mega-menu .col-4{
  position: relative;  
}

body .mega-menu .col-4:first-child:after{
  position: absolute;
  right: 15px;
  top:0;
  width: 1px;
  content: '';
  background: #444444 !important;
  height: 100%;
}

body .hhs-nav-links li a.mega[aria-expanded="true"] {
  margin-bottom: 20px;
}


body .mega-menu .col-6:first-child:after{
  position: absolute;
  right: 15px;
  top:0;
  width: 1px;
  content: '';
  background: #444444 !important;
  height: 100%;
}


.mega-menu-3.mega-menu p.description{
  margin-bottom: 24px;
}
.mega-menu .container{
    max-width: 95%;
}

.mega-menu h2{
    font-size: 36px;
}

.mega-menu-3.mega-menu h2{
  margin-bottom: 40px;
}

.mega-menu h5{
  color: #fff;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 24px;
}

.mega-menu p.description{
    font-size: 20px;
    color: #B3B6BF;
    padding-right: 40px;
    font-weight: 300;
}

.mm-solutions {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}

.mm-sol-card {
  flex: 1;
  min-width: 280px;
}



.mm-sol-title {
  color: #fff;
  font-size: 28px;
  font-weight: 400;
  margin: 0 0 4px 0;
}

.mm-sol-subtitle {
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  margin: 0;
}


.hs-menu-item > .mega {
  position: relative;
  padding-right: 20px !important;
}

.hs-menu-item > .mega::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 11px;
  height: 7px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7' fill='none'%3E%3Cpath d='M9.86055 1.06067L5.46055 5.46067L1.06055 1.06067' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: transform 0.2s ease;
}




.mm-sol-desc {
  color: #fff;
  font-family: var(--font-heading) !important;
  font-size: 16px;
  line-height: 160%;
  margin: 24px 0;

}


.mm-sol-btn.cta-secondary{
  font-size: var(--font-size-sm, 18px) !important;
}
.mm-sol-btn:hover {
  background: #fff;
  color: #000;
}

.hhs-top-bar .mega-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li {
    margin: 0 !important;
}


.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu a.resource-card__image-wrapper{
  padding: 0 !important;
}

.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu a.resource-card__image-wrapper{
  max-width: 155px !important;
}


.hhs-top-bar .mega-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a{
  color: #B3B6BF !important;
  font-size: 20px;
}


.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu a{
  color: #B3B6BF !important;
}

.hhs-top-bar .mega-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a:hover{
  color:#2CC656 !important;
}
.latest-resources {
    --resource-green: #2cc656;
    --resource-border: #38844b;
    --resource-tag: #388f58;
    color: #fff;
}

.latest-resources *,
.latest-resources *::before,
.latest-resources *::after {
    box-sizing: border-box;
}

.latest-resources__container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

.latest-resources__list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 68px;
}

/* Card */

.resource-card {
     display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    height: auto;
    padding: 15px;
    border: 1px solid #38844B;
    border-radius: 7px;
    background-color: #000;
    transition: border-color 0.25s ease, transform 0.25s ease;
}

 
/* Image */

.resource-card__image-wrapper {
      display: block;
    max-width: 162px !important;
    height: auto;
    background: transparent;
  padding: 0 !important;
}

.resource-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}



.resource-card .resource-card__type {
  position: absolute;
  top: 8px;
  left: 7px;
  z-index: 1;
  align-items: center;
  border-radius: 999px;
  background-color: #38844B !important;;
  font-weight: 400 !important;
  padding: 7px 12px;
  height: auto;
  line-height: 1;
  display: block;
  font-size: 14px;
  color: #fff !important;
  font-weight: 500;
}

/* Content */

.resource-card__content {
     display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    padding: 0;
}

.resource-card__title {
    margin: 0 0 8px;
 
    font-weight: 500;
    text-wrap: balance;
    font-size: var(--font-size-md, 20px);
    color: #fff;
}

.hhs-top-bar.hhs-alt-nav .hs-menu-wrapper.hs-menu-flow-horizontal ul.hhs-nav-links .hs-menu-item .resource-card__title a{
    font-size: var(--font-size-md, 20px) !important;
      color: #fff  !important;
    font-weight: 500  !important;
}

 

.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu .resource-card__title a {
    color: #fff  !important;
    text-decoration: none;
    transition: color 0.2s ease;
    font-weight: 500;
    text-wrap: balance;
    font-size: var(--font-size-md, 20px) !important;
    line-height: 1.4;
    padding: 0 !important;
}

.header .hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu a,
.hhs-top-bar.hhs-alt-nav .hs-menu-wrapper.hs-menu-flow-horizontal ul.hhs-nav-links ul .hs-menu-item a{
  color: #B3B6BF !important;
    font-size: 20px !important;
}

.header .hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu a:hover,
.hhs-top-bar.hhs-alt-nav .hs-menu-wrapper.hs-menu-flow-horizontal ul.hhs-nav-links ul .hs-menu-item a:hover{
  color: #2CC656 !important;
}

.mega-menu .col-6 h2{
 margin-bottom: 40px !important;
}

.mega-menu h2.latest-resources__title{
  font-size: var(--font-size-lg, 24px);
  font-style: normal;
  font-weight: 500  !important;
  margin-bottom: 16px !important;
}
.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu .resource-card__title a:hover{
   color: #2CC656 !important;
}

.resource-card__title a:hover {
    color: var(--resource-green);
}

.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li .mega-menu .resource-card__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.2;
    text-decoration: none;
    transition: color 0.2s ease;
    padding: 0 !important;
}

.resource-card__link span{
    color: #2CC656 !important;
  font-size: 14px;
}

.resource-card__link svg {
    flex: 0 0 auto;
    transition: transform 0.2s ease;
}

.resource-card__link:hover svg {
    transform: translateX(6px);
}

.resource-card__link:focus-visible,
.resource-card__title a:focus-visible,
.resource-card__image-wrapper:focus-visible {
    outline: 2px solid var(--resource-green);
    outline-offset: 4px;
}

.resource-card__link span.download-arrow{
    color: #2cc656;
    font-size: 1.1rem;
}

.resource-post__content {
    padding-right: 40px;
    margin-bottom: 120px;
}

.resource-post__content h1{
  font-family: var(--font-heading) !important;
  font-size: var(--font-size-4xl, 56px);
  font-style: normal;
  font-weight: 300;
  margin-bottom: 24px;
}

.blog-author-card {
  max-width: 320px;
  margin-left: auto;
  position: sticky;
  top: 100px;
}

.blog-author-card__image {
  margin-bottom: 28px;
  overflow: hidden;
}



.blog-author-card__image img {
  display: block;
  width: 100%;
  max-width: 200px;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.blog-post h3.blog-author-card__name {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.1;
  font-weight: 600;
}

.blog-author-card__bio {
  margin-bottom: 28px;
  color: #777;
  font-family: var(--font-heading) !important;
  font-size: 16px;
  line-height: 1.45;
}

.blog-author-card__bio p {
  margin: 0;
}

.blog-author-card__link {
  display: inline-flex;
  align-items: flex-end;
  gap: 18px;
  padding-bottom: 4px;
  border-bottom: 1px solid#000;
  color: #000;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.45;
  text-decoration: none;
}

.blog-author-card__link span {
  font-size: 30px;
  font-weight: 300;
  line-height: 0.8;
    color: #000;
}

/* Removed 2026-08-15: a fourth black-text override on the blog hero
   meta/timestamp, ~660 lines away from the hero block it targeted,
   which is why the date once read black-on-black after the scrim was
   inverted. See the note in the hero block above. */

.row-fluid-wrapper.row-depth-1.row-number-7 .if{
    padding: 0 0;
}

.row-fluid-wrapper.row-depth-1.row-number-7 .if .if__inner{
    grid-template-columns: 1fr;
}
.blog-author-card__link:hover {
  text-decoration: none;
  color: #00b140;
}

#hs_form_target_resource_download_form-22  .hsfc-NavigationRow__Alerts{
    display: none !important;
}
 

@media (max-width: 991px) {
  .blog-author-card {
    max-width: none;
    margin: 50px 0 0;
  }

  .blog-author-card__image {
    max-width: 320px;
  }
}

.resource-post__image {
  margin-top: 60px;
  margin-bottom: 32px;
  border-radius: 8px;
  border: 1px solid var(--Primary, #2CC656);
  padding: 12px;

}

.hsfc-DataPrivacyField .hsfc-RichText{
    display: none !important;
}

.hsfc-DataPrivacyField .hsfc-Row{
  margin-bottom: 5px !important;
}

.resource-post__image img {
    display: block;
    width: 100%;
    border-radius: 8px;
}

.resource-post__form {
    margin-top: 32px;
}

.resource-post__breadcrumb{
    margin-bottom: 24px;
}

.resource-post__breadcrumb a{
  color: #2CC656;
  font-size: 14px;
    font-family: var(--font-heading) !important;
}

.resource-post__breadcrumb span{
  font-family: var(--font-heading) !important;
  font-size: 14px;
  color: #F0F0FB;
}

.hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children{
  display: none !important;
}

.blog-post-type--resources .blog-post__body p strong{
  font-size:24px;
  font-weight:400
}

@media (max-width: 991px) {
    .resource-post__content {
        padding-right: 0;
        margin-bottom: 40px;
    }

    .resource-post__sidebar {
        position: static;
    }
}


@media (max-width: 1400px) {
    #customer-success .c-col {
        padding-left:20px;
        padding-right: 20px;
    }
    #customer-success .c-col.c-1 {
      padding-right: 15px;
  }
  .openfull{
      font-size: 18px;
    width: max-content;
  }
}

@media (max-width: 1200px) {
     #customer-success.customer-success .c-col.c-2 .c-content-con.c-in-1 p, .customer-success .c-col p:not(.stat){
       font-size: 14px;
     }
    .bottom-logo .container {
        max-width:1440px;
        padding: 0 60px;
    }
    #flamingo-cta {
      padding-bottom: 60px !important;
      padding-top: 60px !important;
    }
    .team-grid.radial-background-viewer .portfolio-grid{
      padding: 0 100px;
    }
  .carreers-hero:before {
      background-image:
          linear-gradient(
        to right,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
        var(--customer-hero-image, none);
      background-position: right;
      background-repeat: no-repeat;
      background-size: contain;
      bottom: 0;
      content: "";
      height: 50%;
      pointer-events: none;
      position: absolute;
      right: 0;
      top: auto;
      width: 100%;
      z-index: 2;
    }
  #customer-success .c-col.c-1 p.stat{
        font-size: 42px;
    font-weight: 300;
    line-height: 46px;
  }
   #customer-success.customer-success .c-col.c-2 .c-content-con.c-in-1 p.stat,
  .customer-success .c-col p.stat{
    font-size: 42px;
    font-weight: 300;
    line-height: 46px;
  }
}

@media (max-width: 992px) {
  .relations-bg:before {
   background-image:
       linear-gradient(
        to bottom,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
     var(--customer-hero-image, none);
}

  .solutions-all-hero:before {
    background-image: 
        linear-gradient(
        to bottom,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
       background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    right: 0;
    top: auto;
    height: 50%;
    width: 100%;
    z-index: 2
  }

  .our-team-hero:before {
    background-image:
        linear-gradient(
        to bottom,
        #000 0%,
        rgba(0, 0, 0, 0.95) 8%,
        rgba(0, 0, 0, 0.75) 20%,
        rgba(0, 0, 0, 0.45) 35%,
        rgba(0, 0, 0, 0.2) 50%,
        rgba(0, 0, 0, 0.05) 65%,
        transparent 75%
      ),
      var(--customer-hero-image, none);
       background-repeat: no-repeat;
      background-size: cover;
      bottom: 0;
      right: 0;
      top: auto;
      height: 50%;
      width: 100%;
      z-index: 2
    }

  .hhs-blog-grid-cards{
      padding-bottom: 60px !important;
}
  .latest-resources {
        padding: 42px 24px;
    }

    .resource-card {
        grid-template-columns: 220px minmax(0, 1fr);
        gap: 24px;
        min-height: 200px;
        padding: 22px;
    }

    .resource-card__image-wrapper {
        height: 150px;
    }

    .resource-card__type {
        min-height: 38px;
        padding: 7px 17px;
        font-size: 19px;
    }

    .resource-card__title {
        margin-bottom: 22px;
        line-height: 1.3;
    }

    .resource-card__link {
        font-size: 20px;
    }
  .blog-header__inner .blog-post__title{
    font-size: 42px;
    margin-bottom: 42px;
  }
  .form-hero .hsfc-Step__Content{
      padding: 12px !important;
  }

 .form-hero [data-hsfc-id=Renderer] .hsfc-Row{
    gap: 12px;
  }

  .form-hero [data-hsfc-id=Renderer] label span{
    font-size: 14px;
  }
  .team-grid.radial-background-viewer .portfolio-grid{
    padding: 0 ;
  }
  .faq-section .hhs-accordion-1 li:after{
    width: 100%;
  }
  
  .addon-background .filter-card p,
  .addon-background .filter-card p span, 
  .radial-background-viewer .filter-card p,
  .radial-background-viewer .filter-card p span {
    font-size: 14px;
  }
  
  .quote-name, .quote-title{
      padding-left: 15px;
  }
  /* (removed 2026-08-15 — the max-width:992px variant of the
     homepage row-3 Patternbg overlay; see the note at its desktop
     counterpart above) */
    .customer-success_home h2 {
        padding-left:50px
    }

    #solutions-cards.solutions-cards-home {
        padding: 0
    }

    .actually-list:after {
        left: 0;
        margin-left: 0;
        width: 100%
    }

  
  
  .customer-hero:before {
     background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    right: 0;
    top: auto;
    height: 50%;
    width: 100%;
    z-index: 2
}

  .bottom-logo .container {
        padding: 0;
    }
    .next-chapter .c-col.c-2:after {
        height: 100px;
        left: 0;
        position: absolute;
        top: -190px;
        width: 100px
    }

    .hs_cos_wrapper_type_rich_text ul.offer-list {
        column-count: 1;
        margin-bottom: 24px;
        margin-left: 15px;
        margin-top: 16px
    }

    .hs_cos_wrapper_type_rich_text .offer-title {
        margin-left: 15px;
        margin-top: 24px
    }

    .missing-video .c-1 .c-in-1 {
        padding-right: 0
    }

    .bottom-logo h3 {
        font-size: 32px;
    }

    .hs-content-id-215703022220.hs-site-page .dnd_area-row-2-background-layers:before {
        height: 100%;
        width: 100%
    }

    .clean-base.workflow a {
        background-color: #2cc656;
        border-radius: 100%;
        height: 99px;
        margin-bottom: 40px;
        margin-top: 40px;
        padding: 40px 39px 40px 48px;
        transition: all .3s ease-in-out;
        width: 99px
    }

    #hs_cos_wrapper_module_17823070975152 .clean-base.workflow {
        padding: 0
    }

    .bottom-logo .cta-secondary {
        margin-top: 15px
    }


    .video_post {
        margin-right: 0;
      margin-bottom: 50px;
    }

  

    .bottom-logo img {
        margin-bottom: 25px
    }

    .company-grid.radial-background-viewer .filter-card {
        flex: 0 0 47%;
        height: auto;
        max-width: 47%;
        width: 47%
    }

    #homepage-hero {
        padding: 156px 0 10px
    }

    #homepage-hero.why-hero {
        padding: 156px 0 10px
    }

    .why-partner .c-col.c-1 .c-in-1 {
        padding-right: 0
    }

    .company-grid.radial-background-viewer .portfolio-grid {
        gap: 15px;
        justify-content: center;
    }

    #homepage-hero.solutions-all-hero {
      padding: 60px 0 10px !important;
    }

    .missing-video .c-content-con.c-in-1 {
        padding: 82px 0
    }

  
  .static-row .hs_cos_wrapper_type_inline_rich_text p:first-child{
    font-size: 42px !important;
        position: relative;
        width: max-content;
        margin: 0 auto 20px auto; 
  }

  .static-row .hs_cos_wrapper_type_inline_rich_text p:first-child:after{
    content: '';
    position: absolute;
    bottom: -6px;
    content: "";
    height: 2px;
    left: 50%;
    position: absolute;
    width: 65px;
    background: #2CC656;
    margin-left: -33px;
  }

  .missing-video-solutions.missing-video .c-2 .c-in-1 {
        padding: 60px 0 60px 0;
  }
  
  .static-row .hs_cos_wrapper_type_inline_rich_text p{
    font-size: 14px !important;
  }

    .cta-secondary{
        font-size: 18px !important;
    }
    .missing-video .c-content-con.c-in-1 a {
        background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Button%20Play.svg);
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: cover;
        border-radius: 100%;
        height: 58px;
        padding: 0;
        width: 58px
    }



    .parents-hero:before,.why-hero:before {
        background-image:
          linear-gradient(
          to bottom,
          #000 0%,
          rgba(0, 0, 0, 0.95) 8%,
          rgba(0, 0, 0, 0.75) 20%,
          rgba(0, 0, 0, 0.45) 35%,
          rgba(0, 0, 0, 0.2) 50%,
          rgba(0, 0, 0, 0.05) 65%,
          transparent 75%
        ), 
        var(--customer-hero-image, none);
         background-position: 50%;
        background-repeat: no-repeat;
        background-size: cover;
        bottom: 0;
        content: "";
        height: 50%;
        position: absolute;
        right: 0;
        top: auto;
        width: 100%;
        z-index: 2
    }

    .solutions-all-hero:before {
    }
 
    .solutions-all-hero:before,.solutions-hero:before {
       background-image: 
          linear-gradient(
          to bottom,
          #000 0%,
          rgba(0, 0, 0, 0.95) 8%,
          rgba(0, 0, 0, 0.75) 20%,
          rgba(0, 0, 0, 0.45) 35%,
          rgba(0, 0, 0, 0.2) 50%,
          rgba(0, 0, 0, 0.05) 65%,
          transparent 75%
        ),
        var(--customer-hero-image, none);
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: cover;
        bottom: 0;
        content: "";
        height: 50%;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: auto;
        width: 100%;
        z-index: 2
    }

    .solutions-hero:before {
    }

    .openfull {
        bottom: 0;
        margin-bottom: 20px;
        margin-top: 10px
    }

    blockquote.quote-desc {
        margin-top: 48px;
        margin-left: 15px;
    }

    blockquote.quote-desc p {
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.4em
    }
  .related-overview .c-1 .c-in-1{
    margin-bottom: 0 !important;
    
  }

    .dv__heading h2 {
        font-size: 32px !important;
    }

    .radial-background-viewer .filter-card {
        height: auto
    }

    .workflow img {
        margin-bottom: 70px;
        margin-top: 70px;
        max-width: 40px!important
    }

    .company-grid.radial-background-viewer .filter-card .c-card-content {
        padding: 24px 24px 75px!important
    }
    #homepage-hero h1{
      font-size: 42px;
      line-height: 1.1em;
    }
  #homepage-hero .hs_cos_wrapper_type_inline_rich_text p{
      font-size: 20px;
      line-height: 1.32em;

  }
 
  #solutions-overview .container-slim{
      padding: 0;
  }
  h2{
    font-size: 38px;
    line-height: 1.16em;
  }
  #solutions-overview .container-slim p {
    margin-bottom: 24px;
        font-size: 18px;
    line-height: 1.332em;
}

.addon-background .filter-card h3,
  .addon-background .filter-card h3 span,
  .radial-background-viewer .filter-card h3,
  .radial-background-viewer .filter-card h3 span {
    font-size: 26px;
    line-height: 1.15em;
}
  
  .footer-main .hhs-foot-nav-col{
    border: none;
    margin: 0;
  }
  .hhs-foot-nav-col button.foot-nav-title{
    text-align: left;
    text-transform: capitalize;
    position: relative;
    font-size: 18px;
    padding-bottom: 12px;
  }
  .hhs-foot-nav-col button.foot-nav-title:after{
    opacity: 0;
  }
  
  .hhs-foot-nav-col button.foot-nav-title.is-active:before{
  
  }
  
  .footer-main .hhs-foot-nav-col .hs-menu-wrapper.hs-menu-flow-horizontal>ul li{
        text-align: left;
  }
  
  .footer-main .hhs-foot-nav-col .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a{
    padding: 0 0;
    font-family: var(--font-heading) !important;
    text-align: left;
    font-size: 14px;
  }
  
  .footer-main .hs-menu-wrapper.hs-menu-flow-horizontal>ul li{
      margin-bottom: 12px !important;
  }
 
  .footer-main .hhs-foot-nav-col button.foot-nav-title:before{
    position: absolute;
    right: 0;
    top: 5px;
    content: "";
  display: inline-block;
  width: 14px;
  height: 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M12.0607 1.06055L6.56067 6.56055L1.06067 1.06055' stroke='%232CC656' stroke-width='1.5' stroke-linecap='square'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 0.2s ease;
  }
  
  
    .footer-main .row.hhs-foot-nav-cols:first-child .col-lg-4 .hhs-foot-nav-col button.foot-nav-title:before{
  opacity: 0;
  }
  .footer-main .row.hhs-foot-nav-cols:first-child .col-lg-4 {
    order: 6;
    margin-top: 40px !important;
  }
  
  .footer-main .row.hhs-foot-nav-cols:first-child .col-lg-4 .hhs-col-content{
      display: block !important;
          margin-bottom: 32px !important;
  }
  
  .footer-main .hhs-foot-nav-base .col-sm-6{
      flex-direction: column;
    align-items: baseline;
  }
  
  .footer-main  .hs-menu-wrapper.hs-menu-flow-horizontal ul{
        margin-bottom: 12px !important;
  }
  
  .trusted-row .row{
      flex-wrap: wrap;
  }
  
  .trusted-row .row .c-col{
    max-width: 33%;
  }
  
  .imaging-strategy.missing-video .c-content-con.c-in-1{
      padding-right: 0;
  }
 
  .missing-video .c-content-con.c-in-1{
          padding: 60px 0 0 0;
  }
  
  .missing-video h2{
      font-size: 38px;
    margin-bottom: 14px;
  }
  .imaging-strategy.missing-video h4{
      font-size: 20px;
  }
  .missing-video .c-1 .c-in-1 p {
      font-size: 18px;
      font-weight: 300;
  }
  
  .imaging-strategy.missing-video .c-cta-group {
      margin-top: -20px;
  }
  .missing-video .c-col.c-2:after{
    height: 150px;
    left: -47px;
    pointer-events: none;
    position: absolute;
    top: 21px;
    width: 150px;
  }
  
  .home-customer-title.desktop-version{
    display: none  !important;
  }
   .home-customer-title.mobile-version{
    display: block  !important;
     margin-left: 15px;
     margin-bottom: 32px;
  }
  
  #customer-success .c-col {
    padding-left: 0;
    padding-right: 0;
  }
  
  #customer-success .c-col.c-1 p:not(.stat){
    position: relative;
    margin-top: 4px;
    margin-bottom: 48px;
  }
  
  #customer-success .c-col.c-1 p:not(.stat):after{
    content: '';
    position: absolute;
    bottom: -24px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 65px;
    background: rgba(44, 198, 86, 0.40);
  }
  #customer-success .c-col.c-1 p.stat {
    color: #fff;
    font-size: 42px;
    font-weight: 300;
    line-height: 46px;
    margin: 0;
}
  .customer-success_home.clean-base .row {
    padding-top: 15px !important;
  }
  #customer-success .c-col.c-2 .c-content-con.c-in-1 p{
    font-size: 26px;
  }
  #customer-success p.customer-success-footer{
    gap: 12px;
    margin: 0;
    flex-direction: column;
    align-items: flex-start;
    font-weight: 300;
  }
  #featured-news{
    padding: 60px 15px;
  }



  .bottom-logo .c-cta-group a{
    background-color: transparent;
          color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 1.0);
  }
  #featured-news .fn-header{
      justify-content: space-between;
  }
  .team-grid.radial-background-viewer .filter-card {
      flex: 0 0 47%;
        max-width: 47%;
        padding-left: 0;
        padding-right: 0;
        width: 47%;
  }

  .team-grid.radial-background-viewer .portfolio-grid{
    gap: 40px;
  }
    .technology-cards.radial-background-viewer .filter-card {
        flex: 0 0 47%;
        height: auto;
        max-width: 47%;
        width: 47%;
    }
  .blog-post-type--resources .blog-post__body h2,.blog-post-type--resources .blog-post__body h2 *{
    font-size: 32px;
  }
  .blog-post-type--resources .blog-post__body h3,.blog-post-type--resources .blog-post__body h3 *{
    font-size: 28px;
  }
  .blog-post-type--resources .blog-post__body h4, .blog-post-type--resources .blog-post__body h4 *{
    font-size: 24px;
  }
  .blog-post-type--resources .blog-post__body h5, .blog-post-type--resources .blog-post__body h5 *{
    font-size: 18px;
  }
  .blog-post-type--resources .blog-post__body h6, .blog-post-type--resources .blog-post__body h6 *{
    font-size: 16px;
  }
  
  .hs-blog-post .blog-post-type--resources .blog-post li,
  .hs-blog-post .blog-post-type--resources .blog-post p,
  .hs-blog-post .blog-post-type--resources .blog-post a{
      font-size: 18px;
  }
  
  .radial-background-viewer .portfolio-grid{
    gap: 18px;
}
      .addon-background .filter-card,.radial-background-viewer .filter-card,.resource-list .filter-card {
        flex: 0 0 48%;
        max-width: 48%;
        padding-left: 0;
        padding-right: 0;
        width: 48%
    }
}

@media (max-width: 576px){
 
  .blog-post-type--blog .blog-header__inner .blog-post__title{
    font-size: 42px;
  }
    #solutions-cards .c-col-inner h3 {
      font-size: 30px;
    }
   .latest-resources {
        padding: 36px 16px;
    }

    .latest-resources__title {
        margin-bottom: 24px;
    }

    .latest-resources__list {
        gap: 20px;
    }

    .resource-card {
        display: flex;
        flex-direction: column;
        gap: 20px;
        min-height: 0;
        padding: 16px;
    }

    .resource-card__image-wrapper {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .resource-card__content {
        padding: 0 2px 4px;
    }

    .resource-card__title {
        margin-bottom: 24px;
        font-size: 25px;
        line-height: 1.3;
    }

    .resource-card__link {
        font-size: 20px;
    }
    .mm-solutions { 
      flex-direction: column;
  }
    #flamingo-cta{
    padding-top: 0 !important;
    padding-bottom: 80px !important;
  }
  
  #flamingo-cta.clean-base video{
    object-fit: contain;
    object-position: bottom !important;
  }
  

    #flamingo-cta .hs_cos_wrapper_type_inline_rich_text{
    text-align: center;
  }
  #flamingo-cta .c-content-con.c-in-2 {
    margin-top: 0;
}
  #flamingo-cta .c-cta-group{
    top: 60px;
    position: relative;
  }
  #flamingo-cta .c-col-inner p {
    font-size: 20px !important;
    font-weight: 500;
}
  .access-customer ul li span{
    font-size: 14px;
    flex-wrap: wrap;
  }
  #solutions-overview h2 {
    margin-bottom: 14px;
}
  #homepage-hero .c-cta-group {
    margin-top: 40px;
}
  h2.trusted-title {
    font-size: 30px;
}
  #solutions-cards.solutions-bullets-cards .c-col-inner h3 {
    font-size: 30px!important;
}
  .solutions-bullets-cards .c-custom-bullets-con li{
      font-size: 14px;
  }
  #customer-success p.customer-success-footer{
    font-size: 20px;
  }
  #customer-success .read-more{
      font-size: 18px;
  }
  .static-row .hs_cos_wrapper_type_inline_rich_text p:last-child{
      font-size: 14px !important;
      font-weight: 400;
  }
  #solutions-cards .c-col-inner p{
      font-size: 14px;
  }
  .hs-content-id-213294146052  .row-depth-1.row-number-17 .widget-type-custom_widget{
    float: left !important;
    width: calc(100% - 22px); 
  } 
  .hs-content-id-213294146052  .row-depth-1.row-number-17 .widget-type-custom_widget img{
    max-width: 100%;
    height: auto;
    height: 250px !important;
    left: 0;
    object-fit: cover;
    object-position: unset;
    border-radius: 0 20px 20px 0;
  }
  
  .rn .fn-blob {
    height: 262px;
    left: -105px;
    pointer-events: none;
    position: absolute;
    top: 100px;
    width: 259px;
    z-index: 0;
}
  .radial-background-viewer_home.radial-background-viewer .filter-card .c-card .c-card-content {
    margin-top: 0;
    padding: 20px 20px !important;
}
  .radial-background-viewer.radial-background-viewer_home .filter-card .c-card img.c-dblock {
    margin-left: 20px;
    margin-top: 25px;
}
  .home-grid-title{
    max-width: 80%;
    margin: 0 auto 32px auto;
    text-align: center;
  }
  .imaging-strategy.missing-video .c-cta-group {
    margin-top: 0;
  }
  .blog-post-type--resources .blog-post__body p strong{
    font-size: 20px;
  }
  .imaging-strategy.missing-video.clean-base .c-2{
      margin-top: 30px;
  }
  #homepage-hero.homepage-hero h1 {
    font-size: 42px;
    line-height: 1.1em;
    max-width: 80%;
    margin: 0 auto 16px auto;
    text-align: center;
  }
  #solutions-cards .c-col-inner {
    align-items: stretch;
    border-radius: 4px;
    box-shadow: 0 10px 20px 0 rgba(0,0,0,.2);
    display: flex;
    flex-direction: column;
    padding: 199px 24px 32px!important
}
  #solutions-cards .c-col {
    padding-left: 0;
    padding-right: 0;
}
      .addon-background .filter-card,.radial-background-viewer .filter-card,.resource-list .filter-card {
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
        width: 100%
    }
  
  .post-header .blog-header__inner {
    padding-top: 110px !important;
    padding-bottom: 10px !important;
    text-align: center;
}
      .relations-bg:before {
        background-image: var(--customer-hero-image, none);
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: cover;
        bottom: 0;
        content: "";
        height: 50%;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: auto;
        width: 100%;
        z-index: 2
    }
  


  #homepage-hero.resource-hero .hs_cos_wrapper_type_inline_rich_text img {
      position: absolute;
      top: -75px;
      left: 0;
  }
  .imaging-strategy.missing-video .c-content-con.c-in-1{
        padding-top: 0;
  }
  .hs-content-id-215880102666.hs-site-page .dnd_area-row-3-background-layers:before {
      background-image: url(https://51407099.fs1.hubspotusercontent-na1.net/hubfs/51407099/Patternbg.png);
      background-position: 50%;
      background-repeat: no-repeat;
      background-size: contain;
      content: "";
      height: 100%;
      left: 0;
      margin-left: 0;
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 2
  }

  h2.recognized-title {
      font-size: 30px;
  }
  #hs_cos_wrapper_module_17827514485895 .hhs-accordion-1 a.accordion-title h4 {
      font-size: 26px !important;
  }
  .mission-faq-section.faq-section .hhs-accordion-content p {
      font-size: 18px !important;
  }
  
  #featured-news .fn-heading{
      font-size: 36px;
  }
  
  #featured-news .fn-header{
    flex-direction: column;
    align-items: baseline;
  }

  #featured-news .fn-ctas{
    flex-direction: column;
    align-items: flex-start;
  }

  #featured-news .fn-posts{
    flex-direction: column;
  }

  #featured-news .fn-featured-card{
    flex: 0 0 100%;
    flex-direction: column;
    gap: 32px;
    padding: 24px;
    width: 100%;
  }

  
  #homepage-hero{
  padding: 60px 0 10px;
}
    #homepage-hero.why-hero {
        padding: 60px 0 10px;
    }
    #homepage-hero.solutions-all-hero{
        padding: 60px 0 10px;
    }
   .technology-cards.radial-background-viewer .filter-card {
        flex: 0 0 100% !important;
        height: auto !important;
        max-width: 100% !important;
        width: 100% !important;
    }
  .video_post .play {
        height: 58px !important;
        left: 50%;
        margin-left: -30px;
        margin-top: 86px;
        position: absolute;
        top: 0;
        width: 58px!important
    }

  .video_post .playhover{
      height: 58px!important;
        left: 50%;
        margin-left: -30px;
        margin-top: 86px;
        position: absolute;
        top: 0;
        width: 58px!important
}
  .form-hero [data-hsfc-id=Renderer] .hsfc-RichText p{
    font-size: 20px !important;
}
  .form-hero ul li span{
    font-size: 14px;
  }
  .actually-list .hs_cos_wrapper_type_inline_rich_text h4{
      font-size: 30px;
  }
  
  .next-chapter:after{
    height: 50%;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.5;
  }
  .hs_cos_wrapper_type_rich_text ul.offer-list li{
      font-size: 14px;
  }

  .hs_cos_wrapper_type_rich_text .offer-title{
      font-size: 38px;
  }
  
  .team-grid.radial-background-viewer .filter-card{
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
  .hs-content-id-216578858524 .dnd_area-row-6-background-layers .hs_cos_wrapper_type_linked_image{
  display: block  !important;
}
  .clean-base.access-customer p{
      font-size: 14px;
  }
   #homepage-hero .hs_cos_wrapper_type_inline_rich_text{
      text-align: center;
  }
    #homepage-hero .c-cta-group{
      flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  main .cta-primary{
      font-size: 18px !important;
  }
   .company-grid.radial-background-viewer .filter-card {
        flex: 0 0 100%;
        height: auto;
        max-width: 100%;
        width: 100%
    }
  .why-partner .c-col.c-1 .c-in-1 p{
    font-size: 14px;
  }
  .why-partner .hs_cos_wrapper_type_inline_rich_text h3{
      font-size: 20px;
  }
  .quote-title__parter.quote-title{
      margin-top: 0 !important;
  }
  .team-grid.radial-background-viewer .filter-card em{
        font-size: 14px;
  }
  
  #solutions-cards.visualization-cards  .c-col-inner h4{
      font-size: 18px;
  }
  #solutions-cards.visualization-cards .c-col-inner p {
    font-size: 16px;
}
  .dv__bullets li{
      font-size: 14px;
  }
  .dv__content-body{
    font-size: 14px;
  }
  .resource-post__image{
    margin-top: 0 !important;
  }
  .resource-post__content h1{
    font-size: 34px;
    line-height: 1.1em;
  }
  
}

.contact-social { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.contact-social a { display: inline-flex; color: #fff; line-height: 0; transition: opacity .2s ease; }
.contact-social a:hover { opacity: .6; }
.contact-social svg { width: 22px; height: 22px; fill: currentColor; display: block; }
.blog-post__body a:not([class]),
#hs_cos_wrapper_post_body a:not([class]) { color: #194A9C; text-decoration: underline; }
.hs-blog-post .blog-post-type--resources .blog-post a { color: #2CC656; text-decoration: underline; }

/* =============================================================
   MACH7 — CTA + CATEGORY PILL COLOUR SYSTEM
   Paste at the BOTTOM of child.css (Design Manager → Clean Pro
   child theme). Load order is main-head → main-foot → child →
   custom, so appending here beats the theme files on equal
   specificity. Where the theme uses !important, so do we.

   Accent Magenta leads (filled CTA), Vital Green supports
   (outlined CTA), Interactive Blue informs (eyebrow + default
   pill). Every value below clears WCAG AA 4.5:1 for its label
   on both the black and white grounds it appears on.

   DO NOT change the theme's Primary colour field. It stays
   #2CC656 — it still drives focus rings, pagination and
   blockquote rules, which should remain green.
   ============================================================= */


/* -------------------------------------------------------------
   1 · TOKENS
   ------------------------------------------------------------- */
:root {
  /* --- Primary CTA: Accent Magenta ------------------------- */
  --m7-cta-fill:        #BC208C;   /* white label @ 5.64:1 */
  --m7-cta-fill-hover:  #D2249C;   /* white label @ 4.70:1 */
  --m7-cta-label:       #FFFFFF;
  --m7-cta-glow:        188, 32, 140;

  /* --- Secondary CTA: Vital Green -------------------------- */
  --m7-cta-2:           #2CC656;   /* text on black @ 9.32:1 */
  --m7-cta-2-label:     #000000;   /* black label when it fills on hover @ 9.32:1 */
  --m7-cta-2-light:     #1E873A;   /* on white @ 4.58:1 */

  /* --- Eyebrow: Interactive Blue --------------------------- */
  --m7-eyebrow:         #4A7BEF;   /* on black @ 5.37:1 */
  --m7-eyebrow-light:   #396EED;   /* on white @ 4.54:1 */

  /* --- Pill families --------------------------------------- */
  --m7-pill-proof:      #2CC656;   /* Vital Green — customer evidence */
  --m7-pill-technical:  #4A7BEF;   /* Interactive Blue — product collateral */
  --m7-pill-editorial:  #BC208C;   /* Accent Magenta — things to read/watch */
}


/* -------------------------------------------------------------
   2 · PRIMARY CTA — filled magenta, medium glow
   ------------------------------------------------------------- */
.cta-primary,
.cta-primary:active {
  background-color: var(--m7-cta-fill) !important;
  color: var(--m7-cta-label) !important;
  border: none;
  box-shadow: 0 0 30px rgba(var(--m7-cta-glow), .45),
              0 8px 24px rgba(var(--m7-cta-glow), .22);
  transition: background-color .2s ease, box-shadow .25s ease, transform .2s ease;
}

.cta-primary:hover,
.cta-primary:focus-visible {
  background-color: var(--m7-cta-fill-hover) !important;
  box-shadow: 0 0 44px rgba(var(--m7-cta-glow), .62),
              0 12px 32px rgba(var(--m7-cta-glow), .30);
  transform: translateY(-1px);
}


/* =============================================================
   MACH7 — CTA + CATEGORY PILL COLOUR SYSTEM
   Paste at the BOTTOM of child.css (Design Manager → Clean Pro
   child theme). Load order is main-head → main-foot → child →
   custom, so appending here beats the theme files on equal
   specificity. Where the theme uses !important, so do we.

   Accent Magenta leads (filled CTA), Vital Green supports
   (outlined CTA), Interactive Blue informs (eyebrow + default
   pill). Every value below clears WCAG AA 4.5:1 for its label
   on both the black and white grounds it appears on.

   DO NOT change the theme's Primary colour field. It stays
   #2CC656 — it still drives focus rings, pagination and
   blockquote rules, which should remain green.
   ============================================================= */


/* -------------------------------------------------------------
   1 · TOKENS
   ------------------------------------------------------------- */
:root {
  /* --- Primary CTA: Accent Magenta ------------------------- */
  --m7-cta-fill:        #BC208C;   /* white label @ 5.64:1 */
  --m7-cta-fill-hover:  #D2249C;   /* white label @ 4.70:1 */
  --m7-cta-label:       #FFFFFF;
  --m7-cta-glow:        188, 32, 140;

  /* --- Secondary CTA: Vital Green -------------------------- */
  --m7-cta-2:           #2CC656;   /* text on black @ 9.32:1 */
  --m7-cta-2-label:     #000000;   /* black label when it fills on hover @ 9.32:1 */
  --m7-cta-2-light:     #1E873A;   /* on white @ 4.58:1 */

  /* --- Eyebrow: Interactive Blue --------------------------- */
  --m7-eyebrow:         #4A7BEF;   /* on black @ 5.37:1 */
  --m7-eyebrow-light:   #396EED;   /* on white @ 4.54:1 */

  /* --- Pill families --------------------------------------- */
  --m7-pill-proof:      #2CC656;   /* Vital Green — customer evidence */
  --m7-pill-technical:  #4A7BEF;   /* Interactive Blue — product collateral */
  --m7-pill-editorial:  #BC208C;   /* Accent Magenta — things to read/watch */
}


/* -------------------------------------------------------------
   2 · PRIMARY CTA — filled magenta, medium glow
   ------------------------------------------------------------- */
.cta-primary,
.cta-primary:active {
  background-color: var(--m7-cta-fill) !important;
  color: var(--m7-cta-label) !important;
  border: none;
  box-shadow: 0 0 30px rgba(var(--m7-cta-glow), .45),
              0 8px 24px rgba(var(--m7-cta-glow), .22);
  transition: background-color .2s ease, box-shadow .25s ease, transform .2s ease;
}

.cta-primary:hover,
.cta-primary:focus-visible {
  background-color: var(--m7-cta-fill-hover) !important;
  box-shadow: 0 0 44px rgba(var(--m7-cta-glow), .62),
              0 12px 32px rgba(var(--m7-cta-glow), .30);
  transform: translateY(-1px);
}


/* -------------------------------------------------------------
   3 · SECONDARY CTA — OPT-IN, deliberately not global
   .cta-secondary is reused over the homepage product-card
   photography, where the theme's default WHITE outline is the
   only value that works. Measured off the actual background
   pixels behind each button:

       card       behind    white    green
       eUnity     #0F1739   17.47    7.75
       VNA        #216249    7.22    3.20  <- fails AA
       Flamingo   #CA1D85    5.22    2.31  <- fails AA

   So green is applied only where it is deliberately paired with
   the magenta primary. The hero is wired up by id below; add
   .m7-cta-pair to any other container to opt it in. Everywhere
   else keeps the theme's white outline untouched.
   ------------------------------------------------------------- */
#homepage-hero .cta-secondary,
.m7-cta-pair .cta-secondary {
  background-color: transparent;
  border: 1px solid var(--m7-cta-2);
  color: var(--m7-cta-2) !important;
  box-shadow: none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

#homepage-hero .cta-secondary:hover,
#homepage-hero .cta-secondary:focus-visible,
.m7-cta-pair .cta-secondary:hover,
.m7-cta-pair .cta-secondary:focus-visible {
  background-color: var(--m7-cta-2);
  border-color: var(--m7-cta-2);
  color: var(--m7-cta-2-label) !important;
}


/* -------------------------------------------------------------
   3b · PRODUCT CARDS — keep white, fix the hover clash
   These keep the theme's white outline (see above). Their
   existing hover in child.css fills #2cc656, which now reads as
   a stray green against the magenta Flamingo card. A white fill
   with a black label suits all three grounds and is 21:1.
   ------------------------------------------------------------- */
#solutions-cards.solutions-cards-home.clean-base .c-col-inner:hover .c-cta-group a,
#solutions-cards .c-col-inner:hover .c-cta-group a {
  background-color: #FFFFFF;
  border: 1px solid #FFFFFF;
  color: #000000 !important;
}


/* -------------------------------------------------------------
   4 · HERO EYEBROW — blue
   NOTE: this element does not exist yet. Add it to the hero
   module markup:
     <div class="m7-eyebrow">Enterprise Imaging Platform</div>
   Without it, blue simply goes unused — nothing breaks.
   ------------------------------------------------------------- */
.m7-eyebrow {
  color: var(--m7-eyebrow);
  font: 500 13px/1.4 Switzer, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}


/* -------------------------------------------------------------
   5 · LIGHT SECTIONS
   .hs-blog-listing is confirmed on the live blog listing.
   .hs-blog-post is inferred from an existing rule in this file —
   CONFIRM on a real post page before relying on it.
   .m7-on-light is a spare hook for any future white block.
   ------------------------------------------------------------- */
.hs-blog-listing .cta-primary,
.hs-blog-post .cta-primary,
.m7-on-light .cta-primary {
  /* pulled back to 42% — at full strength the glow smudges on white */
  box-shadow: 0 0 30px rgba(var(--m7-cta-glow), .19),
              0 8px 24px rgba(var(--m7-cta-glow), .09);
}

/* Scoped to the same opt-in as section 3 — a bare .cta-secondary
   on a light page keeps the theme's own styling. */
.hs-blog-listing .m7-cta-pair .cta-secondary,
.hs-blog-post .m7-cta-pair .cta-secondary,
.m7-on-light .m7-cta-pair .cta-secondary {
  border-color: var(--m7-cta-2-light);
  color: var(--m7-cta-2-light) !important;
}

.hs-blog-listing .m7-cta-pair .cta-secondary:hover,
.hs-blog-post .m7-cta-pair .cta-secondary:hover,
.m7-on-light .m7-cta-pair .cta-secondary:hover {
  background-color: var(--m7-cta-2-light);
  border-color: var(--m7-cta-2-light);
  color: #FFFFFF !important;
}

.hs-blog-listing .m7-eyebrow,
.hs-blog-post .m7-eyebrow,
.m7-on-light .m7-eyebrow {
  color: var(--m7-eyebrow-light);
}


/* -------------------------------------------------------------
   6 · CATEGORY PILLS — base
   Tinted, not solid: a 999px pill with an 18% wash reads as a
   label, where a solid magenta pill would read as a button now
   that the CTA is a solid magenta fill.

   !important is required here — the theme sets
   .blog-index__post-tag { background-color:#2cc656; color:#fff }
   in main-foot, and the existing #00b140 rule further up THIS
   file is itself !important. See section 8.

   Defaults are Interactive Blue: blog topic tags are an
   unbounded, editor-created set and deliberately share one
   colour. Only Resource Hub *types* get colour-coded.
   ------------------------------------------------------------- */
.rh__tag,
.rn__tag,
.resource-card__type,
.blog-index__post-tag,
.blog-post__tag-link,
.hs-blog-post .blog-post-type--resources .blog-post__tag-link,
.hhs-tag-list li a,
.resource-list .filter-card .tag,
#featured-news .fn-tag {
  --pill:            var(--m7-pill-technical);
  --pill-rgb:        74, 123, 239;
  --pill-text:       #4A7BEF;   /* on black @ 4.60:1 */
  --pill-text-hover: #6B93F2;   /* on black @ 6.07:1 */
  --pill-on-light:   #1C59EB;   /* on white @ 4.61:1 */
  --pill-label:      #000000;   /* only read by the solid variant, section 9 */

  background: rgba(var(--pill-rgb), .18) !important;
  border: 1px solid rgba(var(--pill-rgb), .34);
  color: var(--pill-text) !important;
  font: 500 13px/1.5 Switzer, sans-serif;
  padding: 4px 12px;
  border-radius: 999px;
  text-transform: none;
  display: inline-flex;
  align-items: center;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}


/* -------------------------------------------------------------
   7 · CATEGORY PILLS — family assignment
   Requires the Resource Hub module to emit a slug class.
   HubL (see section 10):
     class="rh__tag rh__tag--"
   Until that ships, every pill just uses the blue default above.
   ------------------------------------------------------------- */

/* Proof — Vital Green · evidence from customers */
.rh__tag--customer-stories,
.rh__tag--interview {
  --pill:            var(--m7-pill-proof);
  --pill-rgb:        44, 198, 86;
  --pill-text:       #2CC656;   /* on black @ 7.34:1 */
  --pill-text-hover: #2CC656;   /* already 7.34 — no lift needed */
  --pill-on-light:   #1B7B35;   /* on white @ 4.60:1 */
  --pill-label:      #000000;   /* green needs a BLACK label if solid */
}

/* Technical — Interactive Blue · product collateral */
.rh__tag--whitepaper,
.rh__tag--product-datasheet,
.rh__tag--brochures {
  --pill:            var(--m7-pill-technical);
  --pill-rgb:        74, 123, 239;
  --pill-text:       #4A7BEF;   /* on black @ 4.60:1 */
  --pill-text-hover: #6B93F2;   /* on black @ 6.07:1 */
  --pill-on-light:   #1C59EB;   /* on white @ 4.61:1 */
  --pill-label:      #000000;
}

/* Editorial — Accent Magenta · things to read and watch */
.rh__tag--article,
.rh__tag--video {
  --pill:            var(--m7-pill-editorial);
  --pill-rgb:        188, 32, 140;
  --pill-text:       #DC2FA6;   /* on black @ 4.51:1 — lifted off #BC208C, which is only 3.43 */
  --pill-text-hover: #E461BB;   /* on black @ 6.07:1 */
  --pill-on-light:   #B41F86;   /* on white @ 4.52:1 */
  --pill-label:      #FFFFFF;   /* magenta needs a WHITE label if solid */
}

/* -------------------------------------------------------------
   7b · RESOURCES & NEWS MODULE — hover restatement
   The homepage "Featured News and Resources" block ships its own
   stylesheet, module_resources-news.min.css, which loads AFTER
   child.css. That is why .rn__tag needs the !important in the
   base rule to move at all.

   Side effect: that !important also kills the module's own
   hover, .rn__featured:hover .rn__tag { background:#2cc656 }.
   Restated here so hovering a card still responds.

   The fill deliberately stays at 18% — pushing it to 30% drops
   the label to 3.86:1 (blue) and 4.02:1 (magenta), i.e. hover
   would make it LESS readable. Lifting the border and label
   instead takes contrast up, 4.60 -> 6.07.
   ------------------------------------------------------------- */
.rn__featured:hover .rn__tag,
.rn__news-card:hover .rn__tag {
  border-color: rgba(var(--pill-rgb), .60);
  color: var(--pill-text-hover) !important;
}


/* On white, the label darkens to hold 4.5:1 against the tint */
.hs-blog-listing .rh__tag,
.hs-blog-listing .blog-index__post-tag,
.hs-blog-listing .blog-post__tag-link,
.hs-blog-post .blog-post__tag-link,
.hs-blog-post .blog-post-type--resources .blog-post__tag-link,
.m7-on-light .rh__tag {
  color: var(--pill-on-light) !important;
}


/* -------------------------------------------------------------
   8 · CLEANUP — delete these existing blocks from child.css
   Leaving them in place is harmless (the rules above are later
   and !important) but they are dead weight and actively
   misleading to the next person.

     .blog-index__post-tag { background: var(--brand-green, #00b140) !important }
         ^ --brand-green is never defined anywhere, so this has
           always fallen back to #00b140 — white text at 2.85:1,
           a live AA failure. This is the accessibility fix.

     #featured-news .fn-tag                            (#38844b)
     .resource-list .filter-card .tag                  (#38844b)
     .resource-list .filter-card:hover .tag            (#2cc656)
     .hs-blog-post .blog-post-type--resources
         .blog-post__tag-link                          (#38844b)

   Also review, but probably KEEP as-is — these are accents, not
   pills, and green is still correct for them:
     .latest-resources { --resource-green / --resource-border
                         / --resource-tag }
   ------------------------------------------------------------- */


/* -------------------------------------------------------------
   8b · OPTIONAL — the rest of the olive in that module
   #38844b isn't only on the pills. The same off-brand olive
   draws the featured card's border and the hairline dividers
   between news cards — visible as the green rule down the left
   of the featured card and between the stacked items.

   Not enabled, because you asked about the pills and this
   changes the block's structure lines. Uncomment if you want the
   whole module off the olive. White at low alpha keeps the
   structure legible without a second green competing with the
   arrows (which are Vital Green #2CC656 at 9.32:1 and are fine
   as they are).
   ------------------------------------------------------------- */
/*
.rn__featured {
  border-color: rgba(255, 255, 255, .14) !important;
}
.rn__featured:hover {
  border-color: var(--m7-cta-2) !important;
}
.rn__news-card + .rn__news-card:before,
.rn__news-card + .rn__news-card:after {
  background: rgba(255, 255, 255, .12) !important;
}
*/


/* -------------------------------------------------------------
   9 · OPTIONAL — solid pills instead of tinted
   Swap the three declarations in section 6 for these. All three
   families still clear AA; the trade-off is that a solid magenta
   pill starts to look like a button, and a solid green pill's
   fill sits at only 2.25:1 against a white card, so the shape
   goes faint even though the label is fine.

     background: var(--pill) !important;
     border: 1px solid transparent;
     color: var(--pill-label) !important;

   If you do this, also delete the .hs-blog-listing colour
   override at the end of section 7 — solid keeps its own label.
   ------------------------------------------------------------- */


/* -------------------------------------------------------------
   10 · MODULE CHANGES REQUIRED (not CSS)

   a) Resource Hub module — emit the family slug class:

        <span class="rh__tag rh__tag--">
          
        </span>

      Produces rh__tag--customer-stories, rh__tag--product-datasheet,
      and so on, matching section 7. Blog topic pills need no
      modifier — they intentionally share the blue default.

   b) Homepage hero module — add the eyebrow element:

        <div class="m7-eyebrow">Enterprise Imaging Platform</div>

   Neither is required for the CSS above to be safe to publish.
   Without (a) pills are uniformly blue; without (b) there is no
   eyebrow. Both degrade cleanly.
   ------------------------------------------------------------- */


/* -------------------------------------------------------------
   11 · REDUCED MOTION — the lift is decoration
   ------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .cta-primary { transition: none; }
  .cta-primary:hover { transform: none; }
}
/* =============================================================
   MACH7 — POP-UP / MODAL CONTENT FIX
   Paste at the BOTTOM of child.css (Design Manager → Clean Pro
   child theme), directly after the CTA + pill system block from
   mach7-cta-pill-system.css. Load order is main-head → main-foot
   → child → custom, so appending here beats the theme files.

   Uses the --m7-cta-* tokens already defined in section 1 of
   mach7-cta-pill-system.css. If that block is not in child.css,
   paste it first or the button falls back to no background.
   ============================================================= */


/* -------------------------------------------------------------
   12 · MODAL CONTENT — the dark-first theme leaking onto a
        light box

   Symptom (blog listing → Subscribe): the modal heading and
   description are invisible, and the Subscribe button is a blank
   white rectangle.

   Cause, verified live on /blog:
     · template_main-head.min.css sets bare  p{color:#fff}  and
       h2/h3/h4{color:#fff}  at top level — the same dark-first
       rule family as the white-links bug.
     · template_main-foot.min.css paints the modal box itself
       .hhs-pop.hhs-modal{background-color:#f9f9f9}.
     · So heading and description render #fff on #f9f9f9 = 1.02:1.
     · Separately, .hs-button is in the theme's *layout* group
       with .cta-primary but NOT in its *colour* group, so it
       falls through to
       .button--primary,.hs-button{color:#fff;background-color:#fff}
       — white label on a white fill, no border.

   Scope: .hhs-pop.hhs-modal only. Swept 2026-08-10 — /blog is the
   only URL on the site that renders one (12 site pages + 5 blog
   posts checked, zero .hhs-pop markup). Every such box is painted
   #f9f9f9 by the theme, so dark text is correct in all of them.
   Nothing outside a modal is touched: 9 elements matched on
   /blog, 0 of them outside the modal.
   ------------------------------------------------------------- */

/* Heading — #444 is 9.25:1 on #f9f9f9 and is the same value the
   blog cards already use for their titles. Font-weight left alone
   deliberately: the modal h3 is Switzer 300/24px and reads as an
   intentionally light title. Add font-weight:600 here if you want
   it to match the card headings exactly. */
.hhs-pop.hhs-modal h1,
.hhs-pop.hhs-modal h2,
.hhs-pop.hhs-modal h3,
.hhs-pop.hhs-modal h4,
.hhs-pop.hhs-modal h5,
.hhs-pop.hhs-modal h6 {
  color: #444444;
}

/* Description — #666 is 5.45:1 on #f9f9f9 and matches both the
   blog card body copy and the form labels already inside this
   modal. 18px because the theme was rendering the description at
   24px, the same size as the heading above it, so the two lines
   read as one block with no hierarchy. */
.hhs-pop.hhs-modal p,
.hhs-pop.hhs-modal li {
  color: #666666;
  font-size: 18px;
  line-height: 1.5;
}

/* Submit button — restate as the site's primary CTA.
   !important on fill and label only, matching how section 2 of
   the pill system handles .cta-primary, so this also wins over
   the theme's .hhs-pop .hhs-pform .hs-button.primary variant
   (the orange #FFAF03 Clean Pro default) if a modal ever ships
   with the .hhs-pform wrapper. */
.hhs-pop.hhs-modal .hs-button,
.hhs-pop.hhs-modal .hs-button.primary {
  background-color: var(--m7-cta-fill) !important;   /* #BC208C, white label @ 5.64:1 */
  color: var(--m7-cta-label) !important;
  border: none;
  border-radius: 4px;
  font-family: Switzer, sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  padding: 12px 24px;
  text-transform: none;
}

.hhs-pop.hhs-modal .hs-button:hover,
.hhs-pop.hhs-modal .hs-button:focus-visible,
.hhs-pop.hhs-modal .hs-button.primary:hover,
.hhs-pop.hhs-modal .hs-button.primary:focus-visible {
  background-color: var(--m7-cta-fill-hover) !important;  /* #D2249C @ 4.70:1 */
  color: var(--m7-cta-label) !important;
}


/* -------------------------------------------------------------
   12b · NOT CHANGED — noted so the next person doesn't re-find it

   · The required-field asterisk in the modal is the theme's
     #FF0000, which is 3.80:1 on #f9f9f9. It sits immediately
     beside a #666 label that carries the same meaning, so it is
     decorative rather than sole-carrier. Left alone to keep this
     block to the actual defect.

   · The modal's own #f9f9f9 background is untouched. Turning the
     box dark instead would also "fix" the white text, but every
     form control inside it (#f5f5f5 inputs, #666 labels) is
     light-ground styling from the theme and would then need
     restating too.
   ------------------------------------------------------------- */

/* ------------------------------------------------------------------
   Solutions mega panel - "By use case" links            added 2026-08-12
   Routes /digital-pathology, /teleradiology and /veterinary-imaging into
   the nav; before this they were reachable only by typing the URL.
   Needed because nothing styles a bare <ul> inside .mega-text-con - the
   parent theme only targets menu wrappers - so without this the list
   renders with default bullets and inherits the theme's a{color:#fff}.
   ------------------------------------------------------------------ */
.mega-menu .mm-usecases-head {
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .65;
  margin: 28px 0 10px;
}
.mega-menu .mm-usecases {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mega-menu .mm-usecases li { margin: 0 0 8px; }
.mega-menu .mm-usecases a {
  font-size: 16px;
  line-height: 160%;
  border-bottom: 1px solid transparent;
}
.mega-menu .mm-usecases a:hover { border-bottom-color: currentColor; }



/* Solutions panel: "By use case" links (new - no existing rule covers a
   bare <ul> inside .mega-text-con, so without this it renders with default
   bullets and inherits the parent theme's a{color:#fff}) */
.mm-usecases-head {
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .65;
  margin: 28px 0 10px;
}
.mm-usecases { list-style: none; margin: 0; padding: 0; }
.mm-usecases li { margin: 0 0 8px; }
.mm-usecases a { font-size: 16px; line-height: 160%; border-bottom: 1px solid transparent; }
.mm-usecases a:hover { border-bottom-color: currentColor; }

@media (max-width: 1024px) {
  header .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children ul.hs-menu-children-wrapper {
    padding-left: 0 !important;
  }
    .hs-menu-wrapper.mobile-submenu-active {
        width: 100%;
    }
    .hs-menu-wrapper.mobile-submenu-active
    > ul
    > .hs-menu-depth-1 {
        display: none !important;
    }

    .hs-menu-wrapper.mobile-submenu-active
    > ul
    > .mobile-current-parent {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }
    .hs-menu-wrapper
    .mobile-current-parent
    > a {
        display: none !important;
    }
    .hs-menu-wrapper
    .mobile-current-parent
    > .hs-menu-children-wrapper {
        position: static !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        background: #000 !important;
    }

    .mobile-submenu-header {
        display: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        list-style: none !important;
    }

    .mobile-current-parent
    > .hs-menu-children-wrapper
    > .mobile-submenu-header {
        display: block !important;
    }

    .mobile-submenu-back {
        display: flex !important;
        align-items: center;
        gap: 8px;
        width: 100% !important;
        margin: 0 !important;
        padding: 10px !important;
        border: 0 !important;
        border-bottom: 1px solid #38844B !important;
        border-radius: 0 !important;
        background: #000 !important;
        color: #2CC656 !important;
       font-family: inherit;
        font-size: 14px;
        font-weight: 400;
        line-height: 1;
        text-transform: uppercase;
        text-align: left;
        cursor: pointer;
    }

    .mobile-submenu-back-icon {
        display: block;
        width: 10px;
        height: 12px;
        flex: 0 0 10px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='17' viewBox='0 0 10 17' fill='none'%3E%3Cpath d='M9 1L1 8.5L9 16' stroke='%232CC656' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

    .mobile-submenu-title {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 10px 12px 20px 12px;
        background: #000;
        color: #D2DCF5;
        font-size: 16px;
        font-family: var(--font-heading);
        font-weight: 400;
        line-height: 1.2;
    }

    .hs-menu-wrapper
    .mobile-current-parent
    > .hs-menu-children-wrapper
    > .hs-menu-depth-2 {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }


    .hs-menu-wrapper
    .mobile-current-parent
    > .hs-menu-children-wrapper
    > .hs-menu-depth-2
    > a {
        display: flex !important;
        align-items: center;
        width: 100% !important;
        margin: 0 !important;
        padding: 14px 12px !important;
        color: #fff !important;
      font-family: var(--font-heading) !important;
      font-size: 16px;
      font-weight: 400;
        line-height: 1.3;
        text-decoration: none !important;
    }
.resource-post__breadcrumb {
    margin-bottom: 14px;
  }
  .resource-post__content h1{
    margin-bottom: 14px;
  }
  body .hamburger-icon.active .line{
    background: #2CC656;
  }
  .hhs-side-menu__text .cta-primary {
    width: 300px;
    margin: 0 auto;
    text-align: center;
    display: block;
  }
  .hhs-side-menu__text{
    padding: 0 12px !important;
  }
   body .hhs-side-menu__mobile .sc-site-header__menu {
    padding-bottom: 0;
    border-bottom: 0;
     margin-top: 20px;
  }
  
  body .hhs-side-menu__mobile .sc-site-header__menu > ul{
       border-bottom: 1px solid var(--Primary-Dark, #38844B);
  }
  
  .hhs-side-menu .hhs-side-menu__mobile li a{
    padding: 0 !important;
    font-family: var(--font-heading) !important;
    font-size: 16px;
    font-weight: 400;
  }
  .hhs-side-menu__mobile{
    padding: 0 !important;
  }
  .hhs-sidebar-nav-toggle svg{
    display: none !important;
  }
  .hhs-sidebar-nav-toggle::after {
    content: '';
    display: block;
    width: 10px;
    height: 17px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='17' viewBox='0 0 10 17' fill='none'%3E%3Cpath d='M1 1L9 8.5L1 16' stroke='%232CC656' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
  .hhs-sidebar-nav-toggle{
    top: 5px !important;
  }
  .hs-menu-wrapper.hs-menu-flow-vertical > ul li{
    margin-bottom: 0;
    padding: 14px 12px;
      border-top: 1px solid var(--Primary-Dark, #38844B);
  }
  
  .hs-menu-wrapper.hs-menu-flow-vertical > ul li.mobile-solutions-cards{
    padding: 0 12px;
    border-top: 0;
  }
  .hhs-side-menu__mobile nav ul li.hs-menu-depth-1:nth-child(-n+3) {
    display: none !important;
  }
  
  .hhs-side-menu{
    background-color: #000  !important;
    color: #fff !important;
  }
  
   .hhs-side-menu li a{
      background-color: #000  !important;
      color: #fff  !important;
   } 
  
  .hhs-side-menu__ctas{
    display: none !important;
  }
  .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children:hover>ul.hs-menu-children-wrapper {
    opacity: 0  !important;
  }
  .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children:hover>ul.hs-menu-children-wrapper.is-open{
      opacity: 1  !important;
  }
  .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-menu-depth-2 a {
        padding: 14px 12px !important;
  }
  .mobile-solutions-menu
    > .hs-menu-children-wrapper
    > .hs-menu-depth-2 {
        display: none !important;
    }

    .mobile-solutions-cards {
        display: none;
        width: 100%;
        margin: 0;
        padding: 20px 16px;
        list-style: none;
        background: #000;
    }

    .mobile-current-parent.mobile-solutions-menu
    > .hs-menu-children-wrapper
    > .mobile-solutions-cards {
        display: block;
    }
  

  .hs-menu-wrapper .mobile-current-parent.mobile-solutions-menu > .hs-menu-children-wrapper > .hs-menu-depth-2{
          display: none !important;
  }
  
    .mobile-solution-card {
        display: block;
        width: 100%;
        margin-bottom: 24px;
        overflow: hidden;
        border-radius: 4px;
    }

    .mobile-solution-card:last-child {
        margin-bottom: 0;
    }

    .mobile-solution-card img {
        display: block;
        width: 100%;
        height: auto;
        margin: 0;
    }
  
  .hhs-top-bar.hhs-alt-nav .hamburger-icon .line{
      background: #2CC656 !important;
  }
  .mobile-menu-logo {
      border-width: 0px;
      border: 0px;
      margin-left: 12px;
      max-width: 100px;
      display: block;
  }
  
  body .module_17824668062833-hidden {
    display: block !important;
}
}

/* ==============================================================
   ==============================================================
   MERGED FROM custom.css — 2026-08-15
   ==============================================================

   custom.css existed only as a shelter. Between 2026-08-13 and
   -14 a second editor's Design Manager saves reverted this file
   three times, each time destroying work, so our rules were moved
   to custom.css (which loads AFTER child.css) to survive. That
   editor has finished and left the site, so the split is no
   longer needed and the two files are now one. custom.css is
   retained as an empty stub — the theme still links it.

   Everything that could be folded into its original rule higher
   up in this file HAS been, and those sites carry a dated note.
   What remains below is only what genuinely has to load LAST:

   - rules whose late position is load-bearing (they beat a
     media query defined earlier in this file), or
   - rules that override a page-level <style> block, or
   - rules with no counterpart anywhere in this file.

   DO NOT relocate these upward without re-checking the cascade
   note on each one.
   ============================================================== */


/* --------------------------------------------------------------
   1 · TECHNOLOGY CARD HEIGHT — MUST STAY BELOW THE MEDIA QUERIES
   The base rule near the top of this file says height:380px; the
   design is 370px.
   It CANNOT be folded into that base rule. The max-width:992px
   block sets height:auto on the same selector, so a folded value
   would lose to it and tablet cards would change height — they
   are 370px today only because this rule is declared after that
   media query. The max-width:576px block uses
   height:auto !important and still wins, which is intended.
   Everything else custom.css declared here (width, max-width and
   flex of calc(25% - 25px), and portfolio-grid gap:20px) was
   byte-identical to the base rule and has simply been dropped.
   -------------------------------------------------------------- */
.technology-cards.radial-background-viewer .filter-card {
  height: 370px;
}


/* --------------------------------------------------------------
   2 · SITE-WIDE 1440px CONTENT CAP
   Aligns page content to the header/footer edge. No counterpart
   anywhere else in this file.

   KNOWN LIMIT: HubSpot's per-row "Force full width section"
   editor toggle emits
   .dnd_area-row-N-force-full-width-section > .row-fluid
   { max-width:none !important } at IDENTICAL specificity (0,2,0)
   from a page-level <style> block that sits after all
   stylesheets, so it wins on source order and the cap only bites
   on rows without that toggle (5 of 10 homepage rows).
   body .dnd-section > .row-fluid would beat it, but that would
   override an explicit per-row choice made in the page editor, so
   it is deliberately NOT done.
   -------------------------------------------------------------- */
.dnd-section > .row-fluid {
  max-width: 1440px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* --------------------------------------------------------------
   3 · BLACK PAGE GROUND — PAIRED WITH THE CAP ABOVE
   NEVER restore one of these two without the other. The site is
   dark: 17 of 21 published pages paint every section
   linear-gradient(#000,#000) with white text. Capping content
   pulls it in from the edges, so wherever a dnd section paints
   nothing the body shows through — and a white body renders those
   rows as white bands. Measured on the homepage with the cap on
   and this rule missing: sections 8 and 9 (the pre-footer CTA and
   Featured News + Resources) paint nothing and both became white
   bands.

   The light pages are safe. /privacy-policy,
   /about-us/corporate-governance, /eunity-ifu-archive and
   /eunity-instructions-for-use each carry
   <style>body{background-color:#ffffff;}</style> in their own
   headHtml, emitted at the END of <head> (~position 54,340 vs
   this stylesheet at ~2,500), so the page override wins on source
   order — verified on all four.

   STANDING TRAP: any NEW page on that policy/document template
   inherits this black body and will render its dark body text on
   black. Add the white override at creation. <body> carries no
   classes on this theme, so the exception cannot be scoped
   structurally — it is page-keyed and therefore fragile. The
   durable fix is to paint those pages' content section white
   instead of leaning on the body.
   -------------------------------------------------------------- */
body {
  background-color: #000000;
}


/* --------------------------------------------------------------
   4 · HERO BACKGROUND IMAGES — OWNED BY THE PAGE, NOT BY THIS FILE
   Every hero rule above reads

     background-image: linear-gradient(...), var(--customer-hero-image, none);

   `--customer-hero-image` is an inline CSS variable the Magic Module writes
   onto the hero div from the ordinary `customer_hero_image` module field
   (`dnd_area-module-2` on most pages, `module_17824668062833` on a few). That
   field is the ONLY supported source of a hero photo. Set it in the page
   editor; nothing here needs to change.

   THIS FILE NO LONGER CONTAINS A SINGLE HERO PHOTO URL, and it must stay that
   way. Two habits are what this replaces, both removed 2026-08-18:

     * per-page overrides keyed on .hs-content-id-<N>, which won on
       !important and made the module field inert — an editor could change the
       image, save, publish, and see no effect anywhere;
     * hardcoded fallbacks inside var(), which silently dressed an unset page
       in another page's photo instead of showing that the field was empty.

   The fallback is now `none`. A page with no field set paints the scrim only.
   That is deliberate: an obviously missing image gets fixed, an inherited
   wrong one does not. Do not restore a url() fallback — `none` also keeps the
   declaration valid, so the scrim survives an empty field, which a bare
   var(--customer-hero-image) would not.

   The three pages that used to be page-keyed here had the exact same file
   written into their module field before these rules were deleted, so nothing
   moved on screen. They do gain the left-to-right gradient scrim the override
   used to suppress (background-image is one property: setting it to a lone
   url() dropped the gradient layer). That scrim is what the white 80px h1 sits
   on, so this is a contrast improvement, not a regression.
   -------------------------------------------------------------- */


/* --------------------------------------------------------------
   5 · BLOG POST HERO — MOBILE CORRECTION
   Paired with the 86% column cap and the horizontal ramp in the
   hero block earlier in this file. Must stay below that block.

   The cap is right on desktop, where text sits left and the photo
   is released on the right. On mobile the title is CENTRED, so an
   86% column centres the text inside the left 86% and pushes it
   ~26px left of true page centre — visibly off-axis. Full width
   is restored to undo that.
   That removes the horizontal cap, so the horizontal ramp can no
   longer guarantee contrast (centred text crosses the faded zone:
   a title reaching 94% computes to 1.9:1 over a light photo). A
   vertical wash is the correct treatment at this size anyway —
   the image reads as a backdrop, not a side-by-side. The row is
   align-items:flex-end so nothing sits in the top fifth and that
   end can be the lighter one. Measured against a worst-case white
   photo, at top of element:
     .blog-post__tag-link  14px at 21%   4.99:1   <- tightest
     .blog-post__title     42px at 32%   5.39:1
     .blog-post__timestamp 18px at 84%   8.09:1
   The 0.52 top stop is set by the PILLS, not the title: they are
   14px so they need the full 4.5:1, and they sit highest where
   the wash is lightest. Do not lighten it further.
   -------------------------------------------------------------- */
@media (max-width: 992px) {
  .blog-post-type--blog .blog-header__inner > .col-lg-7 {
    max-width: 100% !important;
  }
  .blog-post-type--blog .blog-header__inner::after {
    background: linear-gradient(to bottom,
                rgba(0, 0, 0, 0.52) 0%,
                rgba(0, 0, 0, 0.72) 100%) !important;
  }
}


/* --------------------------------------------------------------
   6 · BLOG-LISTING PULL-UP CARD — CLEARANCE FOR THE HERO CTA
   This one overrides a page-level <style> block, not this file.
   The theme's blog-listing MODULE emits
     .dnd-blog-listing .blog-index__post--large.pull-up-card
     { margin-top: -130px; }
   inline, which pulls the first post card up to overlap the hero
   band. -130px was only ever safe when the hero subtitle stayed
   on one line. On /blog and /investor-relations-posts the
   subtitle now wraps to two lines, so the hero is taller and the
   pulled-up card rides up over the Subscribe button — confirmed
   by overlap: Subscribe's rect bottom (~464px) sat inside the
   card's rect top (~440px) on /blog.
   -70px clears the button with a clean gap at the wrapped
   two-line height while keeping the pull-up effect the theme
   intends. The selector is sitewide (module-level, not
   hs-content-id-scoped) since any blog listing using this card
   can grow a second subtitle line.
   The module's inline block loads AFTER this stylesheet in <head>
   (index 24 vs 16), so !important is required to win at equal
   specificity.
   -------------------------------------------------------------- */
.dnd-blog-listing .blog-index__post--large.pull-up-card {
  margin-top: -70px !important;
}


/* --------------------------------------------------------------
   7 · MEGA MENU — HOVER BRIDGE ACROSS THE DEAD GAP
   Added 2026-08-15. Reported on /investor-relations ("the flyout
   folds back up as soon as I move toward a menu item") but it is
   SITEWIDE — reproduced identically on the homepage.

   The panel is position:fixed at top:69px; the top-level <li>
   ends at y=59. Measured at 1280px:
     li.hs-menu-depth-1 bottom   59px
     .mega-menu top              69px   -> 10px gap
   Scrolled (.sticky-menu shrinks the bar 84 -> 74px):
     li bottom 54px, .mega-menu top 70px -> 16px gap
   elementFromPoint in that band returns UL.hhs-nav-links, which
   is the panel's CONTAINER but not a descendant of the hovered
   <li>, and the parent theme's mega-menu-v2.js closes on
   this.contains(e.relatedTarget) || closeMenuForLi($li).

   This hangs an invisible 18px strip off the bottom of each item,
   so the pointer crossing it keeps relatedTarget inside the <li>.

   ::before, NOT ::after — ::after is already the 2px hover
   underline (top:28px, transition:width .22s); overriding it
   kills that animation. A :hover-gated bridge does NOT work: the
   pointer has already left by the time the pseudo would be
   created.
   18px covers the 16px scrolled gap with 2px of overlap and still
   stops INSIDE the nav bar in both states (54+18=72 < 74 sticky,
   59+18=77 < 84 at rest), so it never overhangs page content and
   cannot swallow a click. Do not raise it without re-checking
   both numbers. The panel is unaffected: .mega-menu is
   z-index:10000 and positioned, so it paints above a z-index:1
   pseudo in the same stacking context.
   :has(.mega-menu) limits this to the three items with a flyout;
   if a browser lacks :has() the rule drops and behaviour is what
   it was before. 851px matches the theme's own megaMenu(850).

   Paired with the cancellable close delay in child.js, which
   covers the diagonal path out of the strip's side edge.
   -------------------------------------------------------------- */
@media (min-width: 851px) {
  .hhs-nav-links > li.hs-menu-depth-1:has(.mega-menu) {
    position: relative;
  }
  .hhs-nav-links > li.hs-menu-depth-1:has(.mega-menu)::before {
    content: "" !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    height: 18px !important;
    z-index: 1 !important;
    background: transparent !important;
  }
}


/* --------------------------------------------------------------
   8 · ULTRAWIDE STAGE CAP — 2560px
   Added 2026-08-17. Mike's call, after reviewing the site on a
   49" 3840px-wide monitor.

   THE TWO CAPS ARE A TWO-TIER SYSTEM, not a duplicate of block 2:
     block 2  caps CONTENT at 1440px  (.dnd-section > .row-fluid)
     block 8  caps the PAINT LAYER at 2560px (.dnd-section itself)
   Content width is unchanged by this rule and stays 1440px.

   WHAT THIS FIXES. Measured on the live site at 3840px, nothing
   overflowed (document.scrollWidth 3825 = viewport minus
   scrollbar) and every content container already sat at exactly
   1440@x=1193, matching nav and footer. What ran to the edges was
   the section's own background layer, and the three assets on it
   are all well under-resolution for that width:
     hero video copy_of_home_dots_banner_mach_7_scene.mp4
                             1152x720  -> 3825x665   3.32x
     Trustbar.png            1680x760  -> 3825 wide   2.28x
     6 - Customer Success - OLD.png
                             1680x734  -> 3825 wide   2.28x
   The hero is the worst of the three twice over: a 3.3x upscale,
   and because the container aspect at 3840 (5.75:1) is far wider
   than the source (1.6:1), object-fit:cover crops it to a slice
   and pushes the graphic mass right of centre, leaving the
   headline on dead black. The same hero composes correctly at
   2560, which is where the cap is set. Re-exporting the video at
   3840 is tracked separately and is still worth doing — even at
   2560 it is a 2.2x upscale.

   WHY .dnd-section AND NOT .row-fluid. This deliberately does NOT
   need the specificity hack described in block 2. HubSpot's
   per-row "Force full width section" toggle emits
     .dnd_area-row-N-force-full-width-section > .row-fluid
     { max-width:none !important }
   which targets .row-fluid ONLY. Capping the section element
   sidesteps that conflict entirely: no !important, no equal-
   specificity source-order race, and no overriding of a per-row
   choice someone made in the page editor. Nothing else in this
   file sets max-width on .dnd-section — verified by grep before
   adding this.

   NOTE ON BLOCK 2's OPEN ITEM: that block's comment leaves
   "body .dnd-section > .row-fluid" on the table as a way to make
   the 1440 cap bite on force-full-width rows. It is NOT needed
   and should not be added. Those rows self-contain — every
   force-full-width hero measured (homepage, /why-mach7,
   /flamingo-enterprise-imaging, /leadership) puts its content in
   the theme's own .container{max-width:1440px}, landing at
   1440@1193, identical to the capped rows. The pre-footer
   .m7-cta measures 1440@1193 too.

   THE ABSOLUTE VIDEO LAYER FOLLOWS THIS CAP. .c-video-player is
   position:absolute; inset:0, and its offsetParent is
   .clean-base (position:relative) INSIDE the section — so the
   video resolves against the capped box, not the viewport. If a
   future hero moves the positioning context out to the section
   or the body, that video will escape this cap; check
   offsetParent before assuming it is contained.

   BELOW 2560px THIS RULE IS INERT. At 1920 and 2560 the page is
   byte-identical to before. Only 3440/3840/5120 change, and they
   land on the black ground from block 3, which is what makes the
   gutters read as intentional rather than as the white bands
   described there.
   -------------------------------------------------------------- */
.dnd-section {
  max-width: 2560px;
  margin-left: auto;
  margin-right: auto;
}

/* The 6 LIGHT policy/document pages are EXEMPT — Mike's call.
   They share one template: a dark title banner over an unpainted
   content section sitting on a WHITE body (see block 3). Capping
   the stage there would put visible white gutters either side of
   the dark banner, and white-on-white has already shipped once on
   /eunity-privacy, so these keep their bands full-bleed.

   This is SIX pages, not the four block 3 lists. Enumerated
   empirically 2026-08-17 by fetching all 57 sitemap URLs plus the
   two unlisted IFU pages and testing each for the white body
   override, rather than trusting the older count:
     218838596756  /privacy-policy
     218835789341  /about-us/corporate-governance
     218786268180  /eunity-ifu-archive              (not in sitemap)
     216806076029  /eunity-instructions-for-use     (not in sitemap)
     219381082486  /section-110k-notice             (now published)
     219381082482  /eunity-privacy
   Any NEW page on that template must be added here as well as
   given the white body override — same standing trap as block 3.

   The hook is .body-wrapper, NOT <body>. Block 3 says the light-
   page exception "cannot be scoped structurally" because <body>
   carries no classes. That is true of <body>, but .body-wrapper
   does carry hs-content-id-N hs-site-page — verified on the
   homepage and on all six pages above — which is why this
   exemption is plain CSS and needed no per-page headHtml write.
   Specificity 0,2,0 beats the 0,1,0 cap above; no !important. */
.hs-content-id-218838596756 .dnd-section,
.hs-content-id-218835789341 .dnd-section,
.hs-content-id-218786268180 .dnd-section,
.hs-content-id-216806076029 .dnd-section,
.hs-content-id-219381082486 .dnd-section,
.hs-content-id-219381082482 .dnd-section {
  max-width: none;
}

/* ============================================================
   ACCESSIBILITY REMEDIATION — 2026-08-17
   Audit: WCAG 2.1 AA sweep of all 57 published URLs.
   Tier 1 of the remediation punchlist. Two rules only.
   ============================================================ */

/* G1 — Closed mega-menu panels were hidden with `opacity:0` alone, which does
   NOT remove them from the tab order. Result: 28+ focusable-but-invisible
   links on every page, so keyboard users tabbed through phantom stops.
   The open state (`.mega-menu.active`, set in the header module's inline CSS)
   ALREADY declares `visibility:visible`, so this is the missing other half of
   an intended toggle. `.mega-menu.active` (0,2,0) always outranks
   `.mega-menu` (0,1,0), so the open panel is unaffected by load order.
   Side effect: closing is now instant rather than fading out over 200ms. */
.mega-menu {
  visibility: hidden;
}
.mega-menu.active {
  visibility: visible;
}

/* G2 — The marketplace PARENT theme (template_main-head) sets a bare
   `:focus{outline:none}` with no replacement, so NO header, nav or footer link
   showed a focus indicator anywhere on the site. The parent theme is
   off-limits, so this overrides from the child.
   `currentColor` is deliberate: the site mixes black grounds (white text) and
   white content cards (dark text), so the ring inherits whatever colour the
   element's own text uses and therefore contrasts with its own background.
   `!important` is needed because four separate rules set outline:none. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid currentColor !important;
  outline-offset: 2px !important;
}

/* G6 - background-video pause control injected by child.js.
   44x44 clears WCAG 2.5.8 (AA) and 2.5.5 (AAA). The translucent dark
   pill with a hairline border keeps the white glyph above 3:1 (1.4.11)
   over any video frame. Focus ring comes from the :focus-visible rule
   above, which resolves currentColor to white here. */
.m7-video-toggle {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 5;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .62);
  border: 1px solid rgba(255, 255, 255, .55);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}
.m7-video-toggle:hover {
  background: rgba(0, 0, 0, .82);
}
.m7-video-toggle svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
}
@media screen and (max-width: 575px) {
  .m7-video-toggle {
    right: 10px;
    bottom: 10px;
  }
}

/* ============================================================
   ACCESSIBILITY REMEDIATION - 2026-08-17  (Tier 2: contrast + reflow)
   P3, P7, P8, P9, P2 from the WCAG 2.1 AA punchlist.
   Specificity is deliberate in each case: the rule being beaten was
   measured on the live page first, and several of them live in
   body-level module CSS that loads AFTER child.css, so raising
   specificity - not source order - is what makes these win.
   ============================================================ */

/* P3 - inline body links were #194A9C on the BLACK ground of
   resource-type posts: 2.50:1 against a 4.5:1 requirement, on 7 pages.
   The theme already intends #2CC656 (9.3:1 on black) for these posts, but
   that rule kept losing to `#hs_cos_wrapper_post_body a` - an ID selector
   at (1,0,1) that outranks every class-based rule. Scoping the ID form to
   dark posts gives (1,1,1), which wins cleanly without !important.
   Light-ground posts are untouched and keep #194A9C. */
.blog-post-type--resources #hs_cos_wrapper_post_body a,
.blog-post-type--resources .blog-post__body a {
  color: #2CC656;
}

/* P7 - `.pub-date` was #999 on white = 2.85:1.
   Beaten rule: `.blog-index__post-author span .pub-date` (0,2,1), in a
   body-level module sheet. Repeating the class gives (0,3,1). */
.blog-index__post-author span .pub-date.pub-date {
  color: #6E6E6E;
}

/* P8 - `.blog-author-card__bio` was #777 on white = 4.48:1, failing 4.5:1
   by two hundredths. Supersedes the #777 declaration earlier in this file. */
.blog-author-card__bio {
  color: #6E6E6E;
}

/* P9 - author name on the dark listing cards was #666 on rgb(30,38,48)
   = 2.66:1. Beaten rule: `a.blog-index__post-author-name` (0,1,1).
   Repeating the class gives (0,2,1). */
a.blog-index__post-author-name.blog-index__post-author-name {
  color: #9AA4AE;
}

/* P2 - the large blog card's image anchor computes to height 0 across a
   BOUNDED band. Measured: fine at >=915px (508px tall) and at <=545px
   (245-290px tall), zero in between. The parent theme absolutely positions
   the img and only returns it to `position:static` at >=922px, so in the
   band the anchor has nothing to give it height.
   Scoped to the broken band ONLY - the phone layout below 576px already
   works and must not be disturbed. */
@media screen and (min-width: 576px) and (max-width: 921px) {
  .blog-index__post--large .blog-index__post-image--large {
    display: block;
    aspect-ratio: 1200 / 630;
  }
  .blog-index__post--large .blog-index__post-image--large img {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
}


/* ============================================================
   MEGA MENU — PANEL TIMING + LINK-LIST TREATMENT
   Added 2026-08-17, from Mike's review: opening a panel has "a
   little bit of a delay and an overlap in it", and the use-case
   / Resources link lists "look very bland ... very muted".
   Two independent blocks, A and B. Both measured live on the
   homepage at 1440px before and after.
   ============================================================ */

/* --------------------------------------------------------------
   A · PANEL TIMING — remove the 300ms dead stop and the 800ms grow

   The parent theme's header module ships its transition INLINE in
   every page (a <style> emitted by Global Header v2), so it is in
   no .css file and cannot be edited without touching the
   marketplace module:

     .mega-menu        { transition: opacity   .2s ease-in-out,
                                     max-height .8s ease-in-out,
                                     padding   .2s ease-in-out;
                         transition-delay: 300ms;
                         max-height: 0; padding: 0 }
     .mega-menu.active { max-height: 10000px; padding: 50px 0 }

   MEASURED BEFORE, hovering Solutions:
     t = 0-309ms   height   1px, opacity 0      <- nothing happens
     t = 410ms     height 215px, opacity 0.36   <- TRANSLUCENT AND
                                                   STILL GROWING
     t = 511ms     height 753px, opacity 0.99
     t = 1317ms    max-height finally reaches 10000px

   So for ~200ms the panel is a see-through black band with its
   content clipped part-way down and its bottom edge travelling
   over the hero. That is the "overlap". The 309ms of nothing in
   front of it is the "delay".

   FIX: animate opacity ONLY. max-height and padding now snap, so
   the panel is already at final size before the first frame of
   the fade — no clipped content, no travelling edge.

   MEASURED AFTER: height constant at every sample from t=0;
   opacity 0 until 90ms, 0.28 at 155ms, 0.96 at 256ms, settled by
   ~260ms. Half the old 520ms, and nothing paints at a partial
   size on the way.

   WHY A 90ms DELAY REMAINS — DO NOT TAKE IT TO ZERO.
   The theme's 300ms was doing double duty as hover intent: it is
   the only thing stopping all three panels strobing as the
   pointer sweeps the bar toward Partner with Us / Contact Us.
   Verified after this change with a synthetic 50ms-per-item
   sweep: all three panels stay at opacity 0.00 throughout.
   Removing the delay entirely needs a JS intent timer to replace
   it. 90ms is the tuning knob — raising it buys more immunity on
   a SLOW pass-over, at the cost of the snap Mike asked for.

   KNOWN RESIDUAL: switching straight from one open panel to its
   neighbour leaves a ~90ms gap, because the a11y fix further up
   this file (block G1) toggles `visibility`, which is not
   transitioned, so the outgoing panel goes on the same frame.
   Was ~300ms before. Closing that last 90ms means tracking "is a
   panel already open" in child.js and zeroing the delay for that
   case only — CSS cannot tell a switch from a first open.

   The `body` prefix (0,1,1) outranks the inline `.mega-menu`
   (0,1,0), so this does not depend on stylesheet load order —
   same technique as the `body .mega-menu` background rule around
   line 2630. No effect below 922px: the inline CSS sets
   `.mega-menu.active{display:none!important}` there and the
   mobile side menu opens by a different mechanism entirely.
   -------------------------------------------------------------- */
body .mega-menu {
  transition: opacity 150ms ease-out;
  transition-delay: 90ms;
}


/* --------------------------------------------------------------
   B · PANEL LINK LISTS — "By use case", Resources, Why Mach7

   Three columns, all rendering as flat grey paragraph text:

     Solutions   .mega-menu-1 .mega-text-con p a
                 Digital Pathology / Sensitive Imaging /
                 Teleradiology / Veterinary Imaging. Mike marked
                 these up as ONE <p> with <br>s inside the
                 col_1.text rich-text field, so they are bare <a>
                 and NOT a <ul> — which is why the `.mm-usecases`
                 rules near line 4880 have never matched anything
                 (they are dead code; left alone here). Selector
                 is `p a` so it survives him re-ordering or adding
                 a use case in the UI.

     Resources   .mega-nav-con — a simple_menu widget. The Why
     Why Mach7   Mach7 column is the same widget, so it is
                 included: leaving one of three panels grey would
                 read as a bug rather than a decision.

   MEASURED BEFORE: #B3B6BF, 20px Montserrat 400, no marker,
   hover to #2CC656 over 0.4s — the same grey as the body copy
   beside it, so nothing reads as clickable until the pointer is
   already on it.

   AFTER: white 500 with a Vital Green dash in the left gutter
   that extends on hover while the label turns green and eases
   2px right. The dash is absolutely positioned inside a fixed
   22px gutter, so growing it never reflows the label. 180ms
   rather than 400ms — a nav has to answer immediately.

   Contrast on the panel's #000: #FFF is 21:1, #2CC656 is 9.6:1;
   both clear AA comfortably at 20px, and hover is not signalled
   by colour alone (the dash changes length too), which keeps
   WCAG 1.4.1 satisfied.

   SPECIFICITY — the reason these selectors are so long. Line 2922
   sets `color:#B3B6BF !important` from
     .header .hhs-top-bar .hs-menu-wrapper.hs-menu-flow-horizontal
       > ul li .mega-menu a
   which is (0,5,3). An `!important` override needs to beat that
   outright, not tie it, so these run to (0,6,3) / (0,6,4). A
   shorter selector was tried first and lost silently — the
   font-weight and padding landed while the colour did not.

   SCOPED UNDER .hhs-nav-links DELIBERATELY. The theme clones
   every panel into .hhs-side-menu__mobile, and that copy has its
   own 18px / 700 / Inter Tight treatment at a different width.
   An unscoped rule would restyle the mobile menu as a side
   effect. Verified untouched after this change.

   The `a:empty` rule is NOT decorative. The use-case <p> carries
   a stray empty <a href="/sensitive-imaging"></a> after the four
   real links — harmless while links are unstyled, but it would
   paint an orphan green dash on a line of its own once the marker
   exists. Worth deleting at source in the rich-text field; this
   rule is the belt-and-braces.
   -------------------------------------------------------------- */
.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a,
.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a {
  color: #FFFFFF !important;
  font-weight: 500 !important;
  position: relative !important;
  padding-left: 22px !important;
  transition: color 180ms ease-out, transform 180ms ease-out !important;
}

.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a::before,
.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 10px;
  height: 2px;
  margin-top: -1px;
  background: #2CC656;
  opacity: .45;
  transition: width 180ms ease-out, opacity 180ms ease-out;
}

.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a:hover,
.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a:hover {
  color: #2CC656 !important;
  transform: translateX(2px);
}

.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a:hover::before,
.header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a:hover::before {
  width: 16px;
  opacity: 1;
}

/* Stray empty <a> in the use-case rich text — no label, so no marker. */
.header .hhs-top-bar .hhs-nav-links .mega-menu a:empty {
  display: none !important;
}

/* Keep the colour and the marker for a reduced-motion visitor,
   drop the movement. */
@media (prefers-reduced-motion: reduce) {
  body .mega-menu,
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a,
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a,
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a::before,
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a::before {
    transition: none !important;
  }
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu-1 .mega-text-con p a:hover,
  .header .hhs-top-bar .hhs-nav-links li.hs-menu-depth-1 .mega-menu .mega-nav-con ul li > a:hover {
    transform: none;
  }
}

/* ============================================================
   ACCESSIBILITY REMEDIATION - 2026-08-17  (Tier 3, CSS part)
   G5 keyboard access, G12 target size. G14 was fixed in place at
   line ~2559: a malformed content declaration (a stray double-quote
   where the colon should be) meant the resource-post header scrim
   pseudo-element never generated.
   ============================================================ */

/* G5 - the mega-menu panels open on POINTER only. Verified: focusing a
   top-level trigger leaves the panel at visibility:hidden / opacity:0 /
   max-height:0, so 0 of its 11 links are reachable by keyboard.
   The panel is a direct child of li.hs-menu-depth-1 and that li DOES
   match :focus-within, so this needs no JS. Mirrors what .active does.
   Specificity (0,3,1) beats `body .mega-menu` (0,1,1), the inline
   `.mega-menu` (0,1,0) and `.mega-menu.active` (0,2,0).
   Paired with a focusin/focusout handler in child.js that keeps
   aria-expanded honest and wires Escape. */
li.hs-menu-depth-1:focus-within > .mega-menu {
  visibility: visible;
  opacity: 1;
  max-height: 10000px;
  padding: 50px 0;
  pointer-events: auto;
}

/* Revealing the panel is not sufficient on its own: 7 of the 11 links
   in the Solutions panel carry visibility:hidden on the ANCHOR itself
   (the .mm-sol-btn call-to-action buttons plus some empty anchors), so
   they stayed unreachable even with the panel visible. Measured 4 of 11
   focusable before this rule. */
li.hs-menu-depth-1:focus-within > .mega-menu a {
  visibility: visible;
}

/* G12 - the primary mobile nav toggle measured 32x20, failing WCAG 2.2
   2.5.8 (24x24, AA). Raised to 44x44, which also clears 2.5.5 (AAA).
   Padding rather than width/height so the burger glyph does not stretch. */
.hhs-menu-button.hamburger-icon {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* G12 - "Read More" (67x16) on the listings. Text-only, so inline-flex is
   safe here: the flex baseline comes from the text itself. */
.blog-index__post .blog-index__read-more,
.blog-index__post a.blog-index__read-more {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

/* G12 target size for the author link, WITHOUT breaking the byline baseline
   - 2026-08-19. The author link is the one target on these cards that CONTAINS
   the 30px avatar <img>, and an inline-flex box takes its baseline from its
   first flex item, i.e. the BOTTOM EDGE of that image. The name text, centred
   in the resulting 30px box, therefore rendered 9px ABOVE the baseline that
   ": <date>" sits on - measured on all 6 cards of /blog. inline-block instead
   takes its baseline from its own last line box, so the name and the date
   share one baseline (measured 0px, top and bottom) while min-height keeps a
   30px hit area, so 2.5.8 still passes.
   Padding is NOT an option here: something in the parent theme zeroes padding
   on these anchors even against an inline !important, which drops the hit area
   to 17.5px. Do not "simplify" this back to inline-flex. */
.blog-index__post-author-name {
  display: inline-block;
  min-height: 24px;
}

/* Centres the avatar against the byline text rather than sitting it on the
   baseline. Paired with the rule above: once the link is inline-block, the
   image's own vertical-align is what positions the avatar inside it. */
.blog-index__post-author-image {
  vertical-align: middle;
}

/* ============================================================
   eUNITY IFU HISTORICAL ARCHIVE - WHITE-ON-WHITE ACCORDION
   Reported by Mike 2026-08-18: "the Releases Accordion is
   invisible". It was. 43 elements measured at exactly 1.00:1 on
   /ifu/library (page 218786268180, slug /eunity-ifu-archive):
   the 3 "Version N Releases" titles and all 40 User Guide links.

   Root cause is the documented parent-theme defect. template_
   main-head.min.css sets `a,a:active,a:focus,a:hover,h1{color:#fff}`
   at top level, and this page is one of the 6 light pages that
   paint a WHITE body (see the exemption list above). Dark-first
   theme + white body = invisible links. The page's own markup is
   not at fault for the text colour: the 3 titles carry no inline
   colour and 0 of the 40 anchors do either, so this is fixable
   from the stylesheet with no page edit and no inline
   hand-colouring (which would create the unwind tail).

   SCOPED STRUCTURALLY, NOT PAGE-KEYED, and that is deliberate.
   `.c-accordion` is accordion markup that was pasted into a
   rich-text module; it is NOT the theme's accordion module.
   Verified 2026-08-18 by fetching all 58 sitemap URLs plus the
   two unlisted IFU pages: `.c-accordion` appears on this ONE
   page and nowhere else, while the 8 product-page FAQ accordions
   (/vendor-neutral-archive, /flamingo-enterprise-imaging,
   /why-mach7, /eunity-zero-footprint, /teleradiology,
   /digital-pathology, /sensitive-imaging, /veterinary-imaging)
   use `.faq-section .hhs-accordion-1` and carry ZERO
   `.c-accordion`. Those FAQ titles are white on a MEASURED
   rgb(0,0,0) `.hhs-accordion-mod.faq-section` band, where white
   is correct - a blanket `.accordion-title` rule would have
   broken all 8 pages to fix 1. This selector cannot reach them,
   and because it is structural it survives a clone or a slug
   change, unlike the page-keyed blocks above.

   Colours per the standing decision: #194A9C (8.40:1 on white)
   for links, NOT --m7-blue #4A7BEF, which is 3.91:1 and fails
   WCAG AA. Titles #222222 (15.9:1), matching the theme's own
   h5/h6 colour.

   Specificity (0,3,0) and (0,4,1) both beat the parent theme's
   `a:hover`/`a:focus` at (0,1,1), so no !important is needed and
   the hover state cannot be stolen back.

   NOT FIXED HERE, needs a markup edit - raised with Mike
   2026-08-18: the 3 panels carry `aria-hidden="true"` and the
   titles `aria-expanded="false"`, but the theme's accordion JS
   never loads on this page (it ships with the accordion module,
   and this is a rich-text module), so all 3 panels render
   permanently open. Consequence: the markup says collapsed, the
   page shows expanded, and all 40 document links are hidden from
   assistive tech by aria-hidden. CSS cannot fix that half.
   ============================================================ */

/* The 3 section titles. The text sits in a nested
   span.c-acc-title which has NO colour rule of its own, so it
   inherits from the anchor - colouring the anchor is sufficient
   (verified by enumerating every rule matching that span: only a
   print-media `*` rule). Size is raised because the theme left
   the titles at 16px while the links inside them render at 20px,
   i.e. the headings were smaller than their own contents. No
   chevron affordance is added on purpose: the panels do not
   collapse, so an expand/collapse cue would be a lie. */
.c-rich-text .c-accordion .accordion-title {
  color: #222222;
  font-size: 24px;
  font-weight: 600;
  display: block;
  margin: 28px 0 10px;
  text-decoration: none;
}

/* The 40 User Guide / Guida per l'utente / Guide de l'utilisateur
   links. Their wrapping <p> tags carry an inline
   `color:#ffffff;background-color:#ffffff` and inline styles beat
   this stylesheet - but all 40 have their text inside the <a>
   (verified: 0 of 40 paragraphs hold text outside an anchor), so
   the anchor rule reaches every one. The inline white BACKGROUND
   is deliberately left alone: it sits on a white body and does no
   harm, and stripping it would mean a page-content edit. */
.c-rich-text .c-accordion .c-accordion-content a {
  color: #194A9C;
  text-decoration: underline;
}

.c-rich-text .c-accordion .c-accordion-content a:hover,
.c-rich-text .c-accordion .c-accordion-content a:focus {
  color: #102F63;
}


/* ==============================================================
   BODY-COPY LINK SAFETY NET — 2026-08-18
   Ends the recurring "links invisible on a white page" bug for
   ALL future pages instead of fixing one page at a time.

   ROOT CAUSE (one line, in the marketplace PARENT theme):
     template_main-head.min.css → a,a:active,a:focus,a:hover,h1{color:#fff}
   Every anchor on the site is white unless something outranks
   that. On the 17 dark pages that is correct. On a light page it
   renders body links white-on-white at 1.00:1.

   WHY IT KEEPS COMING BACK — two compounding traps:

   1. Setting a colour on the surrounding block does NOT fix it.
      The rich-text editor writes e.g. <div style="color:#383838">
      around the copy, which colours <p> and <li> but never the
      <a>: `a{color:#fff}` matches the anchor DIRECTLY, and a
      matching rule always beats an inherited value. So the page
      looks authored-and-fine in the editor and still ships broken.
      Measured on /conformance-statements: <li> = #666, <a> = #fff.

   2. Light pages are not detectable in CSS. They are light only
      because each carries <style>body{background-color:#ffffff}</style>
      in its own headHtml (see blocks 3 and the six-page list
      above). <body> carries no class, so there is no selector that
      means "this page is light" — which is why every previous fix
      was page-keyed (/privacy-policy, /section-110k-notice,
      /eunity-privacy via `.m7-policy a`; /ifu/library via
      `.c-rich-text .c-accordion`) and why page number seven,
      /conformance-statements (219734074919), shipped broken.

   THE FIX — ground-independent, so it needs no page list.
   `color: inherit` makes a body-copy link take the colour of the
   paragraph or list item containing it. The invariant becomes:
   *a link is always exactly as readable as the text around it.*
   Dark section → white copy → white link (unchanged, 21:1).
   Light section → dark copy → dark link. It cannot go
   white-on-white again on any page anyone adds later.
   `text-decoration: underline` is the other half and is required:
   once links match the body colour they are no longer
   distinguished by hue, so the underline carries the affordance
   (and satisfies WCAG 1.4.1 Use of Color).

   SPECIFICITY IS LOAD-BEARING — (0,1,1), deliberately.
   The scope sits inside :where() (zero specificity) so the whole
   selector counts only `a` + `:not([class])`. That is high enough
   to beat the parent theme's a{color:#fff} at (0,0,1), and low
   enough to LOSE to every deliberate colour already shipped:
     .m7-policy a                                   (0,1,1) page <style>, later in source → wins
     .blog-post__body a:not([class])                (0,2,1) → wins
     .c-rich-text .c-accordion .c-accordion-content a (0,3,1) → wins
   Verified: an earlier (0,2,1) draft of this rule silently
   overrode `.m7-policy a` and turned 30 deliberate #194A9C links
   on /privacy-policy, /section-110k-notice and /eunity-privacy
   into grey. Do NOT raise this specificity, and do not hoist the
   scope out of :where().
   `:not([class])` keeps CTAs and buttons out — every styled link
   on the site carries a class (sitewide there is exactly one such
   anchor inside body rich text: .openfull on /teleradiology).

   SCOPE: `.c-content-con` + the rich-text wrapper is the
   editor-authored body-copy surface only. Verified across all 58
   sitemap URLs plus the 2 unlisted pages: 122 anchors in scope,
   ZERO in the header, nav, mega menu or footer.

   MEASURED, all 60 URLs, transitions/animations disabled so the
   readings are steady-state (the theme sets `transition:all .4s`
   on anchors, so reading a colour immediately after a change
   returns the OLD value — that false-negative cost a full pass):
     /conformance-statements  6 links  1.00:1 → 5.74:1  (#666 on #fff)
     0 contrast regressions anywhere
     /privacy-policy /section-110k-notice /eunity-privacy
       /ifu/library /about-us/corporate-governance  colours all UNCHANGED
   Side effect, intended: 22 links that previously had no underline
   now have one (16 on /about-us/corporate-governance, 3 /contact,
   2 /investor-relations, 1 /sensitive-imaging). Colour unchanged
   on all 22.

   RESIDUAL LIMIT: a new page whose rich text sets no colour at all
   on a DARK ground would give a #666 link (3.66:1) — but that
   page's own body text would already be #666 on black, so the
   link merely matches copy that is itself broken. No such page
   exists today (checked: every dark page's body copy resolves to
   #fff).
   ============================================================== */
:where(.c-content-con [data-hs-cos-type="inline_rich_text"]) a:not([class]) {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: .15em;
}

:where(.c-content-con [data-hs-cos-type="inline_rich_text"]) a:not([class]):hover,
:where(.c-content-con [data-hs-cos-type="inline_rich_text"]) a:not([class]):focus-visible {
  text-decoration-thickness: 2px;
}


/* ==============================================================
   BODY-LINK SAFETY NET — TWO MISSING SCOPES — 2026-08-18

   Extends the net appended above. That rule requires BOTH
   `.c-content-con` and `[data-hs-cos-type="inline_rich_text"]`,
   and two module families satisfy neither pair, so the parent
   theme's `a,a:active,a:focus,a:hover,h1{color:#fff}` still won
   inside them:

     CLEAN Pro Versa Cards   .c-card > .c-card-content > [inline_rich_text]
                             — IS inline_rich_text, but the ancestor is
                               .c-card-content, never .c-content-con
     Deliver Value tabs      .dv > .dv__inner > … > .dv__content-body
                             — no inline_rich_text wrapper AT ALL; the
                               module prints the tab body as raw HTML

   Measured in-browser before this change, on a dark product page:
   a class-less <a> in either computed to #fff with
   text-decoration:none, sitting beside #B3B6BF body copy. That is
   NOT the white-on-white failure the first net fixed — it is the
   other half of WCAG 1.4.1: the link is legible but is
   distinguished from the copy around it by hue alone, at 1.46:1.
   On the white Deliver Value panel it is white-on-white outright.

   SAFE BY CONSTRUCTION, and this was measured rather than assumed:
   at the time of writing there are ZERO <a> tags in any Versa Card
   or Deliver Value tab slot anywhere on the site (surveyed via the
   CMS API across all 28 published pages). So this rule cannot
   change a single existing link — it only governs links added from
   here on, which is the point: internal linking is now a standing
   pass (tools/pages-outbox/internal_links.py), and 10 proposed
   links were held back purely because these two scopes were unsafe
   to write into.

   SPECIFICITY — (0,1,1), matching the block above deliberately.
   The scope stays inside :where() so only `a` + `:not([class])`
   count. High enough to beat a{color:#fff} (0,0,1); low enough to
   lose to every deliberate colour already shipped (.m7-policy a,
   .blog-post__body a:not([class]), the accordion rule). Do not
   raise it and do not hoist the scope out of :where() — a (0,2,1)
   draft of the first net silently greyed 30 deliberate #194A9C
   links on the policy pages.

   `:not([class])` keeps CTAs and buttons out: every styled link on
   this theme carries a class. Do NOT "fix" a link by giving it a
   class — that opts it out of the net everywhere.
   ============================================================== */
:where(.c-card-content [data-hs-cos-type="inline_rich_text"]) a:not([class]),
:where(.dv__content-body) a:not([class]) {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: .15em;
}

:where(.c-card-content [data-hs-cos-type="inline_rich_text"]) a:not([class]):hover,
:where(.c-card-content [data-hs-cos-type="inline_rich_text"]) a:not([class]):focus-visible,
:where(.dv__content-body) a:not([class]):hover,
:where(.dv__content-body) a:not([class]):focus-visible {
  text-decoration-thickness: 2px;
}