.about-page-header {
        position: relative;
        overflow: hidden
}

.about-page-header[data-background='light'] {
        background-color: #f6f9fc
}

.about-page-header[data-background*='gradient'] {
        background-color: #3e5974;
        background-image: none
}

@media (min-width: 768px) {
        .about-page-header[data-image-frame]:not([data-image-frame='browser']):not([data-image-frame='background']) {
                        margin-bottom:7%
        }
}

.about-page-header h2 {
        font-size: 2.25rem;
        font-weight: 600;
        line-height: 1.28
}

@media (min-width: 768px) {
        .about-page-header h2 {
                        font-size:3rem;
                        font-weight: 500;
                        line-height: 1.25
        }
}

.about-page-header__container {
        position: relative;
        padding: 4rem 0 7.5rem;
        overflow: hidden;
        z-index: 20
}

@media (min-width: 768px) {
        .about-page-header__container {
                        padding:6.2777rem 0 5.5rem
        }
}

[data-image-frame='background'] .about-page-header__container {
        padding: 4rem 0
}

@media (min-width: 768px) {
        [data-image-frame='background'] .about-page-header__container {
                        padding:6rem 0
        }
}

.about-page-header__content {
        box-sizing: content-box;
        max-width: 1080px;
        margin-left: auto;
        margin-right: auto;
        padding: 0 1rem
}

[data-background='light'] .about-page-header__content {
        color: #2e475d
}

.about-page-header__text {
        text-align: center;
        max-width: 710px;
        margin: 0 auto;
        position: relative;
        z-index: 48
}

@media (max-width: 767px) {
        .about-page-header__text {
                        text-align:left;
                        padding-right: 3rem
        }
}

[data-image-frame] .about-page-header__text {
        text-align: left;
        max-width: 53%;
        margin: 0
}

@media (max-width: 1366px) {
        [data-image-frame] .about-page-header__text {
                        max-width:50%
        }
}

@media (max-width: 767px) {
        [data-image-frame] .about-page-header__text {
                        max-width:100%
        }
}

[data-image-frame='background'] .about-page-header__text {
        max-width: 45%
}

@media (max-width: 767px) {
        [data-image-frame='background'] .about-page-header__text {
                        max-width:100%;
                        padding-right: 5rem
        }
}

.about-page-header__text .hsg-meta-copy {
        max-width: 60vw
}

@media (min-width: 768px) {
        .about-page-header__text .hsg-meta-copy {
                        max-width:100vw
        }
}

.about-page-header__heading {
        font-size: 2.25rem;
        font-weight: 600;
        line-height: 1.28;
        margin: 0
}

@media (min-width: 768px) {
        .about-page-header__heading {
                        font-size:3rem;
                        font-weight: 500;
                        line-height: 1.25
        }
}

@media (max-width: 767px) {
        .about-page-header__heading {
                        margin-bottom:1.125rem;
                        display: block
        }
}

.about-page-header__heading p {
        margin-top: 0.2rem
}

[data-image-frame] .about-page-header__heading {
        position: relative;
        z-index: 1
}

@media (min-width: 768px) {
        [data-image-frame] .about-page-header__heading {
                        text-align:left;
                        margin: 0
        }
}

.about-page-header__ctas {
        margin-top: 1.75rem;
        min-height: 77px
}

@media (max-width: 767px) {
        .about-page-header__ctas {
                        min-height:44px
        }
}

@media (max-width: 767px) {
        [data-image-frame='background'] .about-page-header__ctas {
                        max-width:80%
        }
}

.about-page-header__ctas [class*='cta'] {
        margin-right: 1rem
}

@media (max-width: 767px) {
        .about-page-header__ctas [class*='cta'] {
                        margin-right:0
        }
}

.about-page-header__ctas [class*='cta']:first-child {
        margin-bottom: 1rem
}

.about-page-header__ctas [class*='cta']:last-child {
        margin-right: 0
}

.about-page-header__blobs {
        position: absolute;
        bottom: 0;
        z-index: 1;
        width: 100%;
        height: 300px
}

.about-page-header__blobs svg {
        width: 100%;
        position: absolute;
        bottom: 0;
        max-width: 50vw;
        transition: 0.3s ease-in-out;
        max-height: 550px
}

@media (min-width: 1367px) {
        .about-page-header__blobs svg {
                        max-height:650px
        }
}

@media (max-width: 767px) {
        .about-page-header__blobs svg {
                        max-width:100vw
        }
}

.about-page-header__blobs svg.about-page-header__blob--right {
        right: 0
}

.about-page-header__blobs svg.about-page-header__blob--left {
        left: 0
}

.about-page-header__blobs svg .about-page-header__blob--blue {
        fill: #0fbfbf
}

.about-page-header__blobs svg .about-page-header__blob--green {
        fill: #4fb06d
}

.about-page-header__blobs svg .about-page-header__blob--yellow {
        fill: #ffbc4b
}

[data-background='dark'] .about-page-header__blobs svg .about-page-header__blob--yellow,.hsg-bg__dark .about-page-header__blobs svg .about-page-header__blob--yellow,.module-bg--dark .about-page-header__blobs svg .about-page-header__blob--yellow {
        fill: #ff8933
}

.about-page-header__blobs--style1 svg {
        max-width: 40vw
}

@media (max-width: 767px) {
        .about-page-header__blobs--style1 svg {
                        max-width:80vw
        }
}

@media (max-width: 767px) {
        .about-page-header__blobs--style1 svg[class*='left'] {
                        left:auto;
                        -webkit-transform: scaleX(-1);
                        transform: scaleX(-1);
                        right: 0
        }
}

[data-edge-style] .about-page-header__blobs--style1 svg {
        bottom: 30px;
        max-width: 50vw
}

@media (max-width: 767px) {
        [data-edge-style] .about-page-header__blobs--style1 svg {
                        max-width:70vw
        }
}

.about-page-header__blobs--style2 svg {
        max-width: 40vw
}

@media (max-width: 767px) {
        .about-page-header__blobs--style2 svg {
                        max-width:80vw;
                        left: auto
        }
}

[data-edge-style] .about-page-header__blobs--style2 svg {
        max-width: 45vw;
        bottom: 12px
}

@media (max-width: 767px) {
        [data-edge-style] .about-page-header__blobs--style2 svg {
                        max-width:82vw;
                        bottom: 22px
        }
}

.about-page-header__blobs--style3 svg {
        max-width: 45vw
}

@media (max-width: 1024px) {
        .about-page-header__blobs--style3 svg {
                        max-width:50vw
        }
}

@media (max-width: 767px) {
        .about-page-header__blobs--style3 svg {
                        width:102vw;
                        max-width: 110vw;
                        bottom: -5vw
        }
}

@media (max-width: 767px) {
        [data-edge-style] .about-page-header__blobs--style3 svg {
                        -webkit-transform:rotate(16deg);
                        transform: rotate(16deg)
        }
}

.about-page-header__blobs--style4 svg {
        max-width: 30vw
}

@media (max-width: 767px) {
        .about-page-header__blobs--style4 svg {
                        max-width:60vw;
                        -webkit-transform: scaleX(-1);
                        transform: scaleX(-1)
        }
}

@media (max-width: 767px) {
        .about-page-header__blobs--style4 svg[class*='left'] {
                        left:auto;
                        right: 0
        }
}

.about-page-header__blobs--style5 svg {
        max-width: 30vw
}

[data-edge-style] .about-page-header__blobs--style5 svg {
        bottom: 45px;
        max-width: 45vw
}

@media (max-width: 767px) {
        .about-page-header__blobs--style5 svg.about-page-header__blob--right {
                        max-width:75vw
        }
}

[data-edge-style] .about-page-header__blobs--style5 svg.about-page-header__blob--right {
        bottom: 35px;
        -webkit-transform: rotate(-9deg);
        transform: rotate(-9deg)
}

@media (max-width: 767px) {
        [data-edge-style] .about-page-header__blobs--style5 svg.about-page-header__blob--right {
                        max-width:90vw;
                        bottom: 25px
        }
}

[data-edge-style] .about-page-header__blobs--style5 svg.about-page-header__blob--right[class*='right'] {
        right: -30px
}

@media (max-width: 767px) {
        .about-page-header__blobs--style5 svg.about-page-header__blob--left {
                        display:none
        }
}

[data-edge-style] .about-page-header__blobs--style5 svg.about-page-header__blob--left {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
}

[data-edge-style] .about-page-header__blobs--style5 svg.about-page-header__blob--left[class*='left'] {
        left: -20px
}

.about-page-header__edge {
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 100vw;
        z-index: 10
}

.about-page-header__edge svg {
        display: block;
        width: 100vw
}

@media (min-width: 768px) {
        .about-page-header__edge svg[class*='mobile'] {
                        display:none
        }
}

@media (max-width: 767px) {
        .about-page-header__edge svg[class*='desktop'] {
                        display:none
        }
}

.about-page-header__edge svg .about-page-header__wave-edge {
        fill: #fff
}

.about-page-header__edge svg .about-page-header__wave-edge--white {
        fill: #fff
}

.about-page-header__edge svg .about-page-header__wave-edge--light {
        fill: #f6f9fc
}

.about-page-header__edge svg .about-page-header__wave-edge--dark {
        fill: #3e5974
}

@media (min-width: 768px) {
        .about-page-header__mobile-browser-blob {
                        display:none
        }
}

@media (min-width: 768px) {
        .about-page-header__bg-image {
                        background-position:50% 50%;
                        background-size: cover;
                        height: 100%;
                        position: absolute;
                        right: 0;
                        width: 50%
        }
}

.about-page-header__bg-wrapper {
        bottom: 0;
        position: absolute;
        right: -300px
}

@media (min-width: 768px) {
        .about-page-header__bg-wrapper {
                        bottom:auto;
                        position: absolute;
                        right: auto;
                        height: 100%;
                        width: 52%
        }
}

@media (min-width: 768px) {
        .about-page-header__bg-blob svg {
                        height:100%;
                        right: 0;
                        position: absolute;
                        -webkit-transform: translateX(25%);
                        transform: translateX(25%);
                        width: auto
        }
}

.about-page-header__bg-blob--background {
        fill: #fff
}

[data-background='light'] .about-page-header__bg-blob--background {
        fill: #f6f9fc
}

[data-background='dark'] .about-page-header__bg-blob--background,.hsg-bg__dark .about-page-header__bg-blob--background,.module-bg--dark .about-page-header__bg-blob--background {
        fill: var(--cl-color-background-01, #3e5974)
}

.about-page-header__bg-blob--small {
        fill: #ffbc4b
}

[data-background='dark'] .about-page-header__bg-blob--small,.hsg-bg__dark .about-page-header__bg-blob--small,.module-bg--dark .about-page-header__bg-blob--small {
        fill: #ff5c35
}

@media (min-width: 768px) {
        [data-image-frame="background"] .about-page-header__bg-blob--small {
                        -webkit-transform:translateY(7px);
                        transform: translateY(7px)
        }
}

.about-page-header__bg--desktop,.about-page-header__bg--mobile {
        display: none
}

@media (min-width: 768px) {
        .about-page-header__bg--desktop {
                        display:block
        }
}

@media (max-width: 767px) {
        .about-page-header__bg--mobile {
                        display:block
        }
}

.about-page-header .hsg-frames__laptop,.about-page-header .hsg-frames__phone,.about-page-header .hsg-frames__browser {
        display: none;
        max-width: 525px;
        margin: 0 auto 2rem
}

@media (min-width: 768px) {
        .about-page-header .hsg-frames__laptop,.about-page-header .hsg-frames__phone,.about-page-header .hsg-frames__browser {
                        display:block;
                        position: absolute;
                        top: 12.5%;
                        max-width: 52%;
                        margin: 0;
                        z-index: 20
        }
}

@media (min-width: 768px) {
        .about-page-header .hsg-frames__laptop {
                        left:60%;
                        min-width: 600px;
                        max-width: 650px
        }
}

@media (min-width: 768px) and (min-width: 1025px) {
        .about-page-header .hsg-frames__laptop {
                        left:50%
        }
}

.about-page-header .hsg-frames__phone {
        max-width: 250px
}

@media (min-width: 768px) {
        .about-page-header .hsg-frames__phone {
                        left:65%;
                        min-width: 300px
        }
}

@media (min-width: 768px) {
        .about-page-header .hsg-frames__browser {
                        left:57%;
                        overflow: visible
        }
}

@media (min-width: 768px) {
        .about-page-header .hsg-frames__browser-frame {
                        max-width:none;
                        width: auto;
                        height: 100%
        }
}

.about-page-header .hsg-frames__browser-screen {
        border-bottom-right-radius: 10px;
        border-bottom-left-radius: 10px
}

.about-page-header .hsg-frames__blob {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        z-index: 1
}

.about-page-header .hsg-frames__blob svg {
        overflow: visible;
        width: 100%;
        height: 100%;
        position: relative
}

.about-page-header .hsg-frames__blob--yellow {
        -webkit-transform: scale(4);
        transform: scale(4);
        left: 140px;
        top: 18px
}

@media (max-width: 1366px) {
        .about-page-header .hsg-frames__blob--yellow {
                        left:240px
        }
}

@media (max-width: 767px) {
        .about-page-header .hsg-frames__blob--yellow {
                        -webkit-transform:scale(0.6);
                        transform: scale(0.6);
                        left: 45vw;
                        top: -270px
        }
}

.about-page-header .hsg-frames__blob--yellow path {
        fill: #ffbc4b
}

.about-page-header .hsg-frames__blob--blue {
        -webkit-transform: scale(3.6);
        transform: scale(3.6);
        left: 70px;
        top: 140px
}

@media (max-width: 1366px) {
        .about-page-header .hsg-frames__blob--blue {
                        left:140px
        }
}

@media (max-width: 767px) {
        .about-page-header .hsg-frames__blob--blue {
                        top:-350px;
                        left: 60vw;
                        -webkit-transform: scale(0.6);
                        transform: scale(0.6)
        }
}

.about-page-header .hsg-frames__blob--blue path {
        fill: #0fbfbf
}

.hsg-multi-row {
        padding: 3.125rem 0
}

.hsg-multi-row__item {
        max-width: 525px;
        margin: 0 auto 3.125rem
}

@media (min-width: 768px) {
        .hsg-multi-row__item {
                        display:flex;
                        align-items: center;
                        justify-content: center;
                        max-width: none;
                        margin: 0 0 6.25rem
        }
}

.hsg-multi-row__item:last-child {
        margin-bottom: 0
}

.hsg-multi-row__image-wrapper {
        margin-bottom: 1.25rem
}

@media (min-width: 768px) {
        .hsg-multi-row__image-wrapper {
                        flex:1 1 50%;
                        max-width: 50%;
                        margin-bottom: 0
        }
}

@media (min-width: 768px) {
        [data-image-size='small'] .hsg-multi-row__image-wrapper {
                        flex:1 1 25%;
                        max-width: 25%
        }
}

@media (min-width: 768px) {
        .hsg-multi-row__item:nth-child(odd) .hsg-multi-row__image-wrapper {
                        margin-right:10%
        }
}

@media (min-width: 768px) {
        .hsg-multi-row__item:nth-child(even) .hsg-multi-row__image-wrapper {
                        order:1;
                        margin-left: 10%
        }
}



/* Fancy diagonal cut */
.img-diagonal {
    width: 100%;
    clip-path: polygon(0 0, 100% 10%, 90% 100%, 0 90%);
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* Fancy organic blob */
.img-blob {
    width: 100%;
    border-radius: 40% 60% 55% 45% / 60% 40% 45% 55%;
    object-fit: cover;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* Optional hover effect */
.img-fancy:hover {
    transform: scale(1.03);
    transition: 0.3s ease;
}
