/* Banner-cta */
.banner-cta {
padding: var(--spacer_40) var(--spacer_20) 0;
border-radius: 32px;
position: relative;
}
.banner-cta__inner {
margin: 0 auto;
max-width: 80rem;
padding: 0 var(--spacer_24);
}
.banner-cta__title {
text-align: center;
color: var(--white_color);
margin-bottom: var(--spacer_24);
}
.banner-cta__content {
margin: 0 auto;
max-width: 68.8rem;
}
.banner-cta__content,
.banner-cta__content * {
font-size: 20px;
line-height: 1.4;
letter-spacing: -0.3px;
text-align: center;
color: var(--white_color);
}
.banner-cta__content *:last-child {
margin-bottom: 0;
}
.banner-cta__button {
bottom: -8px;
position: relative;
width: fit-content;
margin: var(--spacer_40) auto 0;
}
.banner-cta__button::after,
.banner-cta__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 10px;
position: absolute;
width: 10px;
z-index: 2;
}
.banner-cta__button::before {
background-image: url('data:image/svg+xml,');
left: -1px;
bottom: 5px;
transform: rotate(180deg) scale(-1, 1);
}
.banner-cta__button::after {
background-image: url('data:image/svg+xml,');
right: -1px;
bottom: 5px;
transform: rotate(180deg);
}
.banner-cta__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
.banner-cta__background-image {
border-radius: 32px;
height: 100% ;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.banner-cta__form form {
background-color: transparent;
padding: 24px 0 0;
max-width: 441px;
margin: 0 auto;
}
.banner-cta__form form .hs-form-field label,{
font-weight: 400;
text-transform: inherit;
margin-bottom: 8px;
color: #FFF;
}
.banner-cta__form form .hs-form-field label .hs-form-required {
color: #FFF;
}
.banner-cta__form form .hs-form-field .input input {
background-color: #FFF;
border-radius: 6px;
border: 1px solid #D1D1CB;
color: rgba(61, 61, 56, 1.0);
font-family: Open Sans;
font-weight: 400;
font-size: 13px;
}
.banner-cta__form input::placeholder {
font-family: Open Sans;
font-weight: 400;
font-size: 11px;
line-height: 1.6;
color: #9B9B97;
}
.banner-cta__form form .legal-consent-container {
margin-bottom: 28px;
}
.banner-cta__form form .legal-consent-container .hs-richtext,
.banner-cta__form form .legal-consent-container .hs-richtext * {
font-weight: 400;
text-transform: inherit;
margin-bottom: 8px;
color: #FFF;
}
.banner-cta__form form .legal-consent-container .hs-richtext a {
font-weight: 600;
background: unset;
}
.banner-cta__form form .legal-consent-container label.hs-form-booleancheckbox-display {
display: flex;
gap: 4px;
}
.banner-cta__form form .legal-consent-container label.hs-form-booleancheckbox-display input {
border: unset;
}
.banner-cta__form form .legal-consent-container label.hs-form-booleancheckbox-display .mdl-checkbox__label,
.banner-cta__form form .legal-consent-container label.hs-form-booleancheckbox-display .mdl-checkbox__label * {
margin-left: 0;
color: #FFF;
line-height: 1.2em;
}
.banner-cta__form form .hs_submit .actions {
width: fit-content;
margin: 0 auto;
background: #fff;
border: 8px solid #fff;
border-radius: 32px;
bottom: -8px;
position: relative;
}
.banner-cta__form form .hs_submit .actions:after,
.banner-cta__form form .hs_submit .actions:before {
background-repeat: no-repeat;
background-size: contain;
bottom: 0;
content: "";
display: inline-block;
height: 48px;
position: absolute;
top: auto;
width: 36px;
z-index: 1;
}
.banner-cta__form form .hs_submit .actions:before {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png);
left: -10px;
}
.banner-cta__form form .hs_submit .actions:after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/right-bottom-cta-corner@2x.png);
right: -14px;
width: 15px;
bottom: 0;
top: unset;
height: 9px;
}
.banner-cta__form form .hs_submit .actions .hs-button {
margin: 0 auto;
display: block;
background-color: #3be1a4;
border-radius: 50px;
color: #000;
cursor: pointer;
font-size: 16px;
font-weight: 600;
padding: 12px 28px;
position: relative;
text-align: center;
text-decoration: none;
transition: all .3s ease;
z-index: 2;
}
.banner-cta__form form .hs_submit .actions .hs-button:hover {
background-color: #111010;
color: #fff;
}
@media (max-width: 767px) {
.banner-cta__inner {
padding: 0;
}
}
/* Banner-text-n-image */
.btni {
display: flex;
gap: var(--spacer_32);
padding: var(--spacer_12);
align-items: center;
background-color: #0A0A09;
border-radius: 28px;
position: relative;
}
.btni__content-container {
padding: 0 var(--spacer_80);
width: calc(50% - var(--spacer_32) / 2);
}
.btni__title {
color: var(--primary_color);
}
.btni__content-container:has(.btni__subtitle) .btni__title{
margin-bottom: 0;
}
.btni__subtitle {
font-size: 20px;
color: var(--white_color);
line-height: 1.4;
font-weight: var(--font_weight_500);
}
.btni__content {
color: var(--white_color);
font-weight: var(--font_weight_500);
}
.btni__button {
position: absolute;
bottom: -8px;
}
.btni__button::after,
.btni__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 1px;
width: 36px;
z-index: 0;
}
.btni__button::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.btni__button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.btni__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
.btni__image-container {
width: calc(50% - var(--spacer_32) / 2);
}
.btni__image {
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 28px;
}
.btni__list {
padding-left: var(--spacer_40);
margin: var(--spacer_80) 0;
display: flex;
flex-direction: column;
gap: var(--spacer_10);
border-left: 1px solid #6c6c68;
}
.btni__list-item {
align-items: center;
display: flex;
gap: 12px;
}
.btni__list-item-picto {
width: 3.2rem;
height: 3.2rem;
object-fit: contain;
}
.btni__list-item-label {
color: #d1d1cb;
font-size: 20px;
font-weight: var(--font_weight_700);
line-height: 1.4;
}
@media (max-width: 1024px) {
.btni__content-container {
padding: var(--spacer_60) var(--spacer_20);
}
}
@media (max-width: 800px) {
.btni {
flex-direction: column-reverse;
}
.btni:has(.btni__list) {
gap: 0;
}
.btni:has(.btni__list--bottom) {
flex-direction: column;
}
.btni__list {
padding-top: var(--spacer_28);
margin: 0 var(--spacer_28) 10rem;
padding-left: 0;
border-left: unset;
border-top: 1px solid #6c6c68;
}
.btni__list-item-label {
font-size: 16px;
}
.btni__content-container {
width: 100%;
padding: var(--spacer_28) var(--spacer_28);
}
.btni__title {
font-size: var(--spacer_28);
}
.btni__image-container {
width: 100%;
}
}
/* card */
.cards {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}
.cards__card {
align-items: center;
align-self: flex-start;
display: flex;
flex-wrap: wrap;
margin-bottom: 1.4rem;
max-width: 100%;
width: 300px;
}
.card__image {
height: auto;
margin: 0 auto;
max-width: 100%;
padding: 0.7rem;
}
.card__text {
padding: 0 0.7rem;
width: 100%;
}
/* cards-trust-center */
.ctc__title {
text-align: center;
}
.ctc__list {
display: flex;
gap: var(--spacer_40) var(--spacer_28);
flex-wrap: wrap;
justify-content: center;
}
.ctc__list-item {
width: calc(100% / 3 - var(--spacer_28) * 2 / 3);
min-width: 30rem;
padding: var(--spacer_28) var(--spacer_20);
border-radius: 28px;
background-color: #F0F0EC;
display: flex;
flex-direction: column;
gap: var(--spacer_16);
}
.ctc__list-item-title {
text-align: center;
}
.ctc__list-item-content,
.ctc__list-item-content * {
color: var(--black_color);
}
.ctc__list-item-content *:last-child {
margin-bottom: 0;
}
.ctc__list-item-button {
position: relative;
transform: translateY(calc(var(--spacer_28) + 8px));
width: fit-content;
margin-top: auto;
}
.ctc__list-item-button::after,
.ctc__list-item-button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.ctc__list-item-button::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.ctc__list-item-button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.ctc__list-item-button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
background-color: var(--white_color);
}
.ctc__list-item-button-link:hover {
color: var(--black_color);
}
/* cards */
.cards__list {
display: flex;
flex-wrap: wrap;
gap: var(--spacer_24);
}
.cards__list-item {
width: calc(100% / 3 - var(--spacer_24) * 2 / 3);
position: relative;
border-top-left-radius: 40px;
border-top-right-radius: 40px;
}
.cards__list-item-link--invisible {
cursor: pointer;
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 2;
}
.cards__list-item-image-container {
aspect-ratio: 1.14643;
border-radius: 24px;
overflow: hidden;
position: relative;
width: 100%;
z-index: 1;
}
.cards__list-item-image-container::before {
content: "";
background: linear-gradient(180deg,rgba(0,0,0,0.5),rgba(0,0,0,0.4));
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
.cards__list-item-image {
border-radius: 24px;
border-bottom-right-radius: 26px;
height: 100%;
object-fit: cover;
transition: transform var(--slow_transition);
width: 100%;
z-index: 0;
transform: scale(1);
transform-origin: center center;
will-change: transform;
}
.cards__list-item:hover .cards__list-item-image {
transform: scale(1.05);
}
.cards__list-item-logo {
position: absolute;
left: 50%;
min-height: 100px;
padding: 0 16px;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
max-width: 90%;
height: auto;
object-fit: contain;
z-index: 2;
}
.cards__list-item-image-button-container {
border-radius: 50%;
bottom: 0;
height: 5rem;
position: absolute;
right: 0;
width: 5rem;
}
.cards__list-item-image-button-container::before,
.cards__list-item-image-button-container::after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/cta-corner-bottom-left@2x.png);
background-repeat: no-repeat;
background-size: contain;
bottom: 0;
content: "";
display: inline-block;
height: 2.5rem;
left: -8px;
position: absolute;
width: 2.5rem;
z-index: 1;
}
.cards__list-item-image-button-container::after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/cta-corner-top-right@2x.png);
bottom: unset;
left: unset;
right: 0;
top: -8px;
}
.cards__list-item-image-button {
align-items: center;
background-color: var(--primary_color);
border-radius: 50%;
display: flex;
height: 100%;
justify-content: center;
outline: 8px solid var(--white_color);
position: relative;
width: 100%;
z-index: 2;
}
.cards__list-item-image-button .button-icon {
display: flex;
overflow: hidden;
}
.cards__list-item:hover .button-icon svg {
animation: buttonFly .4s ease forwards
}
@keyframes buttonFly {
0% {
transform: translate(0);
}
50% {
transform: translate(20px, -20px);
}
51% {
transform: translate(-20px, 20px);
}
100% {
transform: translate(0);
}
}
.cards__list-item-content-title {
color: #707070;
font-size: 20px;
font-weight: var(--font_weight_700);
overflow: hidden;
line-height: 1.4;
margin-bottom: 0;
margin-top: var(--spacer_16);
}
@media (max-width: 900px) {
.cards__list {
flex-direction: column;
align-items: center;
margin: 0 auto;
}
.cards__list-item {
width: 100%;
max-width: 45rem;
}
}
/* carousel-image-effect */
.cie {
padding: 0;
overflow: hidden;
min-width: 100vw;
margin-left: calc(50% - 50vw);
}
.cie__header {
display: flex;
flex-direction: column;
max-width: 836px;
margin: 0 auto var(--spacer_40);
align-items: center;
justify-content: center;
gap: var(--spacer_16);
}
.cie__header-title {
margin-bottom: 0;
}
.cie__header-subtitle *:last-child {
margin-bottom: 0;
}
.cie__container {
margin: 0 auto;
padding: 0;
position: relative;
opacity: 0;
transition: opacity 0.8s ease;
}
.loaded .cie__container {
opacity: 1;
}
.cie__track {
display: flex;
gap: var(--card-gap);
overflow-x: hidden;
scrollbar-width: none;
-ms-overflow-style: none;
justify-content: flex-start;
}
.cie__track::-webkit-scrollbar {
display: none;
}
/* Add padding to allow centering with cards on both sides */
.cie__track::before,
.cie__track::after {
content: '';
flex-shrink: 0;
width: calc(50vw - (var(--expanded-width) / 2));
min-width: calc(50% - (var(--expanded-width) / 2));
}
/* Testimonial Card - NO TRANSITIONS */
.cie__card {
flex-shrink: 0;
width: var(--collapsed-width);
height: var(--card-height);
cursor: pointer;
position: relative;
opacity: 0;
padding: var(--spacer_12);
border-radius: 24px;
background-color: var(--card-background-color);
pointer-events: none;
transition: width 0.6s ease;
}
.cie__card.visible {
opacity: 0.24;
pointer-events: auto;
}
.cie__card.adjacent.visible {
opacity: 0.48;
pointer-events: auto;
}
.cie__card.active {
width: var(--expanded-width);
cursor: default;
opacity: 1;
pointer-events: auto;
background-color: var(--card-opened-background-color);
}
.cie__card.instant-visibility {
transition: width 0s ease;
}
.cie__card-inner {
display: flex;
height: 100%;
overflow: hidden;
}
/* Image side */
.cie__card-image {
position: relative;
flex-shrink: 0;
width: calc(var(--collapsed-width) - var(--spacer_12) * 2);
height: 100%;
overflow: hidden;
border-radius: 16px;
}
.cie__card-image:after {
content: "";
background-color: #000000;
height: 100%;
left: 0;
opacity: 0.3;
position: absolute;
top: 0;
transition: opacity .3s ease;
width: 100%;
}
.cie__card.active .cie__card-image:after {
opacity: 0;
}
.cie__card-image .cie__card-image-desktop {
width: 100%;
height: 100% ;
object-fit: cover;
object-position: center;
border-radius: 12px;
}
.cie__card-image-logo {
position: absolute;
top: 50%;
left: 50%;
max-height: 100%;
max-width: 100%;
transform: translate(-50%, -50%);
z-index: 2;
}
.cie__card-image-mobile {
display: none;
}
.cie__card-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.cie__card-testimonial-svg {
display: block;
margin-left: auto;
margin-bottom: var(--spacer_10);
}
.cie__card-testimonial-quote,
.cie__card-testimonial-quote * {
color: #707070;
font-family: Open Sans, sans-serif;
font-size: 20px;
line-height: 1.4;
margin-bottom: var(--spacer_8);
}
.cie__card-testimonial-quote *:last-child {
margin-bottom: 0;
}
.cie__card-testimonial-author-container {
display: flex;
gap: var(--spacer_12);
}
.cie__card-testimonial-author-avatar {
border-radius: 12px;
height: 48px;
object-fit: cover;
width: 48px;
}
.cie__card-testimonial-author-inner-name {
color: #6c6c68;
font-size: 16px;
margin-bottom: 0;
}
.cie__card-testimonial-author-inner-job {
color: #6c6c68;
font-weight: 700;
margin-bottom: 0;
font-size: 16px;
}
.cie__card-testimonial-number-container {
display: flex;
gap: 5px;
margin-top: auto;
margin-bottom: 0;
}
.cie__card-testimonial-number-prefix,
.cie__card-testimonial-number-suffix {
color: #6c6c68;
font-size: 20px;
font-weight: 700;
height: fit-content;
margin-top: auto;
margin-bottom: var(--spacer_8);
}
.cie__card-testimonial-number {
color: #6c6c68;
font-family: Raleway, sans-serif;
font-size: 72px;
font-weight: 200;
letter-spacing: -2px;
line-height: 110%;
margin-right: 5px;
flex-shrink: 0;
}
.cie__card-testimonial-subtext,
.cie__card-testimonial-subtext *{
color: #707070;
font-size: 14px;
text-shadow: 0 0 48px hsla(0, 0%, 100%, .64);
}
.cie__card-testimonial-subtext *:last-child {
margin-bottom: 0;
}
/* CTA Button */
.cie__card-cta {
position: absolute;
width: 50px;
height: 50px;
border-radius: 50%;
bottom: 0;
right: 0;
}
.cie__card-cta:before,
.cie__card-cta:after {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
position: absolute;
z-index: 1;
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/cta-corner-bottom-left@2x.png);
bottom: 0;
height: 25px;
left: -8px;
width: 25px;
}
.cie__card-cta:after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/cta-corner-top-right@2x.png);
left: unset;
bottom: unset;
right: 0;
top: -8px;
}
.cie__card-cta-wrapper {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #3BE1A4;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
outline: 8px solid #FFF;
position: relative;
}
.cie__card-cta-button {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.cie__card-cta-wrapper .button-icon {
display: flex;
overflow: hidden;
}
.cie__card-cta:hover .cie__card-cta-wrapper .button-icon svg {
animation: buttonFly 0.4s ease forwards;
}
@keyframes buttonFly {
0% {
transform: translate(0px, 0px);
}
50% {
transform: translate(20px, -20px);
}
51% {
transform: translate(-20px, 20px);
}
100% {
transform: translate(0px, 0px);
}
}
/* Content side - NO TRANSITIONS */
.cie__card-content {
flex: 1;
min-width: 0;
opacity: 0;
overflow: hidden;
}
.cie__card.active .cie__card-content {
opacity: 1;
}
.cie__card-content-inner {
padding: 20px;
height: 100%;
display: flex;
flex-direction: column;
overflow-y: auto;
min-width: calc(var(--expanded-width) - var(--collapsed-width)) ;
width: 100%;
}
.cie__card-content-title {
color: #29A37A;
}
.cie__card-content-text,
.cie__card-content-text *{
color: #6C6C68;
font-family: "Open Sans";
font-size: 16px;
font-style: normal;
line-height: 1.6;
}
.cie__card-content-text p {
margin-bottom: 10px;
}
.cie__bullets,
.cie__arrows {
display: none;
}
@media (max-width: 1024px) {
.cie {
margin-left: 0;
padding: 0;
min-width: unset;
position: relative;
}
.cie__track-container {
position: relative;
}
.cie__track {
gap: unset;
}
.cie__track::before,
.cie__track::after {
display: none;
}
.cie__card {
height: auto;
opacity: 1;
align-self: stretch;
}
.cie__card-inner {
flex-direction: column;
}
.cie__card-image {
width: 100%;
height: auto;
aspect-ratio: 338 / 148;
}
.cie__card-image:has(.cie__card-image-mobile) .cie__card-image-desktop {
display: none;
}
.cie__card-image-logo {
max-width: 22rem;
}
.cie__card-image-desktop ~ .cie__card-image-mobile {
display: inline;
width: 100%;
height: 100% ;
object-fit: cover;
object-position: center;
border-radius: 20px;
}
.cie__card--testimonial {
pointer-events: auto;
}
.cie__card--testimonial .cie__card-inner {
overflow: visible;
}
.cie__card--testimonial .cie__card-image {
z-index: 1;
max-height: 150px;
}
.cie__card--testimonial .cie__card-cta:hover .cie__card-cta-button {
border-top-right-radius: 0;
}
.cie__card-content {
opacity: 1;
}
.cie__card-content-inner {
min-width: unset;
height: auto;
}
.cie__card-content.cie__card-content--testimonial {
z-index: 2;
overflow: visible;
}
.cie__card-content--testimonial .cie__card-content-inner {
gap: 20px;
height: 100%;
position: relative;
z-index: 3;
overflow: visible;
padding-top: var(--spacer_32);
}
.cie__card-content--testimonial .cie__card-testimonial-number-container {
flex-direction: column;
margin-bottom: 12px;
}
.cie__card-content--testimonial .cie__card-testimonial-svg {
position: absolute;
right: 12px;
top: -16px;
display: block;
z-index: 3;
width: 62px;
}
.cie__card-content--testimonial .cie__card-cta {
bottom: -12px;
right: -16px;
}
.cie__bullets {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 8px;
margin-top: 32px;
}
.cie__bullets .cie__bullet {
width: 20px;
height: 4px;
border-radius: 20px;
background-color: var(--card-opened-background-color);
transition: background-color 0.5s ease, width 0.5s ease;
cursor: pointer;
}
.cie__bullets .cie__bullet.glide__bullet--active {
width: 60px;
background-color: #3BE1A4;
}
.cie__arrows {
margin-top: 12px;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 16px;
}
.cie__arrows .cie__arrow {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
border: 2px solid #D1D1CB;
transition: border 0.5s ease;
cursor: pointer;
}
.cie__arrows .cie__arrow:hover,
.cie__arrows .cie__arrow:active {
border: 2px solid #3BE1A4;
}
}
@media (max-width: 450px) {
.cie__card-content--testimonial .cie__card-cta {
right: -12px;
}
.cie__card-cta:hover .cie__card-cta-wrapper {
right: 8px ;
}
}
/* carousel-image-text */
.cit {
overflow: hidden;
}
.cit__title {
margin-bottom: var(--spacer_30);
}
.cit__subtitle {
margin-bottom: var(--spacer_32);
max-width: 81.2rem;
}
.cit__subtitle,
.cit__subtitle * {
color: var(--black_color);
text-overflow: ellipsis;
font-family: Raleway;
font-size: 22px;
font-weight: var(--font_weight_600);
line-height: 1.4;
}
.cit__subtitle *:last-child {
margin-bottom: 0;
}
.cit__list {
display: flex;
}
.cit__list-item {
border-radius: 32px;
display: flex;
gap: var(--spacer_16);
overflow: hidden;
margin-bottom: 0;
}
.cit__list-item-image {
width: 47.4rem;
min-height: 48rem;
object-fit: cover;
flex-shrink: 0;
border-radius: 32px;
}
.cit__list-item--50 .cit__list-item-image {
aspect-ratio: 645/480;
width: calc(50% - var(--spacer_16) / 2);
min-height: unset;
}
.cit__list-item-image--mobile {
display: none;
}
.cit__content-container {
width: 100%;
padding: var(--spacer_60);
border-radius: 28px;
display: flex;
flex-direction: column;
gap: var(--spacer_8);
justify-content: center;
}
.cit__list-item--50 .cit__content-container {
width: calc(50% - var(--spacer_16) / 2);
padding: var(--spacer_60) var(--spacer_80);
}
.cit__content-title {
color: #176251;
}
.cit__content-text li {
list-style-type: disc;
}
.cit__content-text *:last-child {
margin-bottom: 0;
}
.cit__content-text li::marker {
color: #666;
}
.cit__content-subtitle {
font-size: 20px;
color: #9B9B97;
margin-bottom: 0;
}
.cit__content-tag {
display: flex;
padding: var(--spacer_6) var(--spacer_16);
border-radius: 12px;
background: var(--text_grey);
letter-spacing: 3.2px;
font-weight: var(--font_weight_300);
color: #F8F8F6;
width: fit-content;
margin-bottom: 0;
text-transform: uppercase;
line-height: 1;
}
.cit__buttons {
display: flex;
gap: 16px;
flex-wrap: wrap;
margin-top: var(--spacer_16);
}
.cit__bullets {
display: flex;
align-items: center;
gap: var(--spacer_8);
margin-top: var(--spacer_32);
}
.cit__bullets .cit__bullet {
width: 20px;
height: 4px;
border-radius: 20px;
background-color: #D1D1CB;
transition: background-color var(--slow_transition), width var(--slow_transition);
cursor: pointer;
}
.cit__bullets .cit__bullet.glide__bullet--active {
width: 60px;
background-color: #3BE1A4;
}
.cit__arrows {
margin-top: var(--spacer_24);
display: flex;
align-items: center;
gap: var(--spacer_16);
}
.cit__arrows .cit__arrow {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
border: 2px solid #D1D1CB;
transition: border 0.5s ease;
cursor: pointer;
}
.cit__arrows .cit__arrow:hover,
.cit__arrows .cit__arrow:active {
border: 2px solid #3BE1A4;
}
@media (max-width: 1024px) {
.cit__list-item {
flex-direction: column;
gap: var(--spacer_22);
border-radius: 24px
}
.cit__list-item-image,
.cit__list-item--50 .cit__list-item-image {
width: calc(100% - 20px);
height: auto;
min-height: unset;
aspect-ratio: 338 / 148;
margin: var(--spacer_10);
border-radius: 16px;
}
.cit__list-item-image--mobile {
display: block;
}
.cit__list-item-image--square {
aspect-ratio: 1;
}
.cit__list-item-image--desktop {
display: none;
}
.cit__content-container {
padding: var(--spacer_20) var(--spacer_20) var(--spacer_40);
}
.cit__list-item--50 .cit__content-container {
width: 100%;
padding: 0 var(--spacer_20);
}
}
/* carousel-stacked-n-card */
.csnc {
display: flex;
gap: var(--spacer_20);
position: relative;
}
.csnc__title {
padding: var(--spacer_30) var(--spacer_54) var(--spacer_30) var(--spacer_30);
border-top-right-radius: 16px;
position: absolute;
z-index: 2;
max-width: 55rem;
left: 0;
bottom: 0;
background-color: var(--white_color);
margin-bottom: 0;
}
.csnc__title::before,
.csnc__title::after {
background: radial-gradient(circle at 100% 0, transparent 71%, var(--white_color) 0);
content: "";
height: 30px;
left: 0;
position: absolute;
top: -30px;
width: 30px;
}
.csnc__title::after {
background: radial-gradient(circle at 100% 0, transparent 71%, var(--white_color) 0);
top: unset;
left: unset;
bottom: 0;
right: -30px;
}
.csnc__images-container {
width: 100%;
aspect-ratio: 875 / 680;
position: relative;
}
.csnc__images-list {
width: 100%;
height: 100%;
}
.csnc__images-list-item {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
opacity: 0;
transition: opacity var(--slow_transition);
}
.csnc__images-list-item:not(.csnc__images-list-item--1) {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.csnc__images-list-item.active {
opacity: 1;
}
.csnc__images-list-item-image {
position: absolute;
left: 0;
top: 0;
border-radius: 16px;
object-fit: cover;
width: 100%;
height: 100%;
}
.csnc__bar {
margin: 0 auto;
border-radius: 172px;
background: rgba(255, 255, 255, 0.70);
backdrop-filter: blur(58px);
padding: var(--spacer_14) var(--spacer_14) var(--spacer_14) var(--spacer_40);
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
width: fit-content;
gap: 60px;
--bar-translate: translateY(-50%);
}
.csnc__bar::before {
content: attr(data-text);
display: block;
opacity: 0;
font: inherit;
pointer-events: none;
}
.csnc__bar::before,
.csnc__bar-title {
margin: 0;
overflow: hidden;
max-width: max-content;
padding-right: 4px;
width: fit-content;
color: var(--black_color);
font-size: 20px;
line-height: 1.4;
font-weight: var(--font_weight_700);
}
.csnc__bar-title {
position: absolute;
top: 50%;
left: 32px;
border-right: 3px solid var(--black_color);
transform: var(--bar-translate);
}
.csnc__bar-title span {
display: none;
opacity: 0;
transition: opacity 0.08s ease;
}
.csnc__bar-title span::after {
content: "";
position: absolute;
width: 3px;
height: 100%;
top: 0;
right: -3px;
opacity: 0;
background-color: var(--black_color);
animation: char-caret 0.15s calc(var(--delay)) forwards;
}
.csnc__bar-title span.is-last::after {
animation: appear var(--delay) forwards, blink-caret 0.8s step-end calc(var(--delay) + 0.15s) infinite;
}
@keyframes appear {
to { opacity: 1; }
}
@keyframes char-caret {
0% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes blink-caret {
from, to { opacity: 0; }
50% { opacity: 1; }
}
.csnc__bar-button-fake {
flex-shrink: 0;
width: 40px;
height: 40px;
background: var(--black_color);
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.csnc__card {
flex-shrink: 0;
width: 43rem;
padding: var(--spacer_40);
border-radius: 28px;
border-bottom-right-radius: 40px;
background-color: #F0F0EC;
position: relative;
}
.csnc__card-title {
margin-bottom: var(--spacer_32);
font-weight: 800;
}
.csnc__card-content {
color: var(--text_grey);
font-size: 20px;
font-weight: 400;
margin-bottom: 0px;
}
.csnc__button {
position: absolute;
bottom: -8px;
right: 2px;
}
.csnc__button::after,
.csnc__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
width: 36px;
z-index: 0;
}
.csnc__button::before {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/right-cta-left-bottom-corner@2x.png);
background-size: 12px 24px;
bottom: 8px;
height: 24px;
left: 0;
width: 12px;
}
.csnc__button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/cta-corner-top-right@2x.png");
right: -6px;
top: 8px;
}
.csnc__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
@media (max-width: 1150px) {
.csnc__bar {
transform: translateY(-100%);
}
}
@media (max-width: 1024px) {
.csnc {
flex-wrap: wrap;
}
.csnc__title {
position: static;
width: 100%;
max-width: unset;
padding: unset;
}
.csnc__title::before,
.csnc__title::after {
display: none;
}
.csnc__images-container {
aspect-ratio: 2/1;
}
.csnc__bar {
transform: unset;
overflow: hidden;
margin: 0 var(--spacer_10);
padding: var(--spacer_6) var(--spacer_6) var(--spacer_6) var(--spacer_16)
}
.csnc__bar::before,
.csnc__bar-title {
font-size: 14px;
}
.csnc__bar-title {
left: var(--spacer_16);
}
.csnc__card {
width: 100%;
}
}
/* chart-n-text */
.cnt {
display: flex;
align-items: center;
gap: var(--spacer_40);
}
.chart-hubdb__container {
width: 50%;
flex-shrink : 0;
position: relative;
}
.chart-hubdb__image {
display: none;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.chart-hubdb__container-inner {
max-width: 41.5rem;
aspect-ratio: 1;
margin: auto;
}
.chart-hubdb {
cursor: pointer;
}
.cnt__tooltip {
background: #FFF;
padding: var(--spacer_10);
border-radius: 8px;
position: absolute;
z-index: 2;
pointer-events: none;
width: 12rem;
}
#chart-lines-svg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 1;
overflow: visible;
}
.cnt__tooltip-value {
font-size: 16px;
font-weight: var(--font_weight_600);
margin: 0;
line-height: 1.3;
color: var(--black_color);
}
.cnt__tooltip-label {
font-size: 12px;
margin: 0;
line-height: 1.4;
color: var(--black_color);
}
.cnt__tooltip--right {
text-align: right;
}
.chart-hubdb__total-container {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 50%;
display: flex;
gap: var(--spacer_8);
align-items: center;
justify-content: center;
flex-direction: column;
}
.chart-hubdb__total {
color: var(--black_color);
text-align: center;
font-family: Raleway;
font-size: 36px;
font-weight: var(--font_weight_600);
line-height: 1.1;
margin-bottom: 0;
}
.chart-hubdb__total-suffix {
color: var(--black_color);
font-size: 18px;
line-height: 1.4;
letter-spacing: -0.361px;
text-align: center;
margin-bottom: 0;
}
.cnt__content-title {
font-weight: var(--font_weight_600);
font-size: 40px;
line-height: 1.1;
}
.cnt__content-subtitle {
color: #29A37A;
margin-top: 8px;
}
.cnt__content-container {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
.cnt__content-container-inner {
max-width: 42.8rem;
}
.cnt__content {
margin-top: var(--spacer_16);
color: var(--text_grey);
line-height: 1.6;
}
.cnt__content *:last-child {
margin-bottom: 0;
}
@media (max-width: 767px) {
.cnt {
flex-direction: column;
}
.chart-hubdb__container {
width: 100%;
}
.cnt__content-container {
padding: 0 var(--spacer_20);
}
.cnt__content-container-inner {
max-width: unset;
}
.cnt__content-title {
font-size: 28px;
}
.cnt__content-subtitle {
font-size: 20px;
margin-bottom: var(--spacer_8);
}
}
/* cta-highlight */
.ch {
align-items: center;
background-color: #F0F0EC;
border-radius: 24px;
display: flex;
gap: var(--spacer_20);
padding: var(--spacer_16);
position: relative;
}
.ch__content-container {
width: 100%;
display: flex;
flex-direction: column;
gap: 16px;
height: 100%;
padding: var(--spacer_60) var(--spacer_40) var(--spacer_80);
position: relative;
}
.ch__content-title {
margin: 0;
max-width: 37.6rem;
letter-spacing: -.02em;
}
.ch__content {
color: var(--text_grey)
}
.ch__content *:last-child {
margin-bottom: 0;
}
.ch__button {
position: absolute;
bottom: calc(var(--spacer_16) * -1 - 8px);
}
.ch__button::after,
.ch__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.ch__button::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.ch__button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.ch__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
.ch__highlight {
flex-shrink: 0;
border-radius: 18px;
align-self: stretch;
display: flex;
justify-content: center;
align-items: center;
}
.ch__highlight-inner {
gap: var(--spacer_16);
display: flex;
justify-content: center;
align-items: center;
height: fit-content;
flex-wrap: wrap;
}
.ch__highlight-number-container {
flex-shrink: 0;
color: var(--primary_color);
font-family: Raleway, serif;
font-size: 152px;
font-weight: 200;
letter-spacing: -.03em;
line-height: 1;
margin-bottom: 0;
display: flex;
width: calc(50% - var(--spacer_16) / 2);
justify-content: flex-end;
}
.ch__highlight-number-prefix,
.ch__highlight-number-suffix {
font-size: 100px;
vertical-align: super;
}
.ch__highlight-caption {
color: var(--primary_color);
font-family: Raleway, serif;
font-size: 32px;
font-weight: 800;
line-height: 1.1;
width: calc(50% - var(--spacer_16) / 2);
margin-bottom: 0;
margin-top: auto;
}
@media (max-width: 1024px) {
.ch__content-container {
padding: var(--spacer_40) var(--spacer_20) var(--spacer_60);
}
.ch__highlight-number-container {
font-size: 120px;
width: auto;
}
.ch__highlight-number-prefix,
.ch__highlight-number-suffix {
font-size: 80px;
}
.ch__highlight-caption {
width: auto;
}
}
@media (max-width: 767px) {
.ch {
flex-direction: column-reverse;
gap: var(--spacer_32);
}
.ch__highlight {
padding: var(--spacer_16) var(--spacer_18) var(--spacer_32);
}
.ch__content-container {
padding: 0 0 var(--spacer_80);
}
.ch__highlight-number-container {
font-size: 100px;
}
.ch__highlight-number-prefix,
.ch__highlight-number-suffix {
font-size: 60px;
}
.ch__highlight-caption {
font-size: 20px;
}
}
@media (max-width: 500px) {
.ch__highlight {
flex-direction: column;
}
.ch__highlight-number-container,
.ch__highlight-caption {
width: 100%;
justify-content: center;
}
.ch__highlight-caption {
text-align: center;
}
.ch__highlight-number-prefix,
.ch__highlight-number-suffix {
display: flex;
align-items: center;
}
}
/* download-resources */
.dr__title {
text-align: center;
}
.dr__list {
display: flex;
flex-direction: column;
gap: var(--spacer_16);
}
.dr__list-item {
width: 100%;
padding: var(--spacer_16) var(--spacer_28);
display: flex;
justify-content: space-between;
background-color: var(--white_color);
border-radius: 28px;
align-items: center;
flex-wrap: wrap;
gap: var(--spacer_16);
}
.dr__list-item-title {
margin-bottom: 0;
}
.dr__list-item-buttons {
display: flex;
gap: var(--spacer_12);
flex-shrink: 0;
}
.dr__list-item-button-link--picto {
display: flex;
align-items: center;
width: fit-content;
gap: 8px;
flex-shrink: 0;
}
.dr__list-item-button-link--picto:before {
content: "";
display: block;
aspect-ratio: 1;
width: 18.39px;
background-size: cover;
background-image: url('data:image/svg+xml,');
transition: background-image 0.3s ease;
}
.dr__list-item-button-link--picto:hover:before {
background-image: url('data:image/svg+xml,');
}
/* FAQ */
.faq {
display: flex;
gap: var(--spacer_20);
align-items: center;
}
.faq__content-container,
.faq__list {
width: calc(100% / 2 - var(--spacer_20) / 2);
}
.faq__content-inner {
max-width: 42.5rem;
padding: var(--spacer_40) var(--spacer_20);
margin: 0 auto;
}
.faq__content *:last-child{
margin-bottom: 0;
}
.faq__button {
margin-top: var(--spacer_16);
}
.faq__list {
display: flex;
flex-direction: column;
gap: var(--spacer_12);
}
.faq__list-item {
width: 100%;
position: relative;
border-radius: 12px;
background-color: #f0f0ec;
}
.faq__list-item-question {
color: var(--black_color);
font-family: Raleway, sans-serif;
font-weight: var(--font_weight_700);
display: flex;
gap: var(--spacer_8);
align-items: center;
justify-content: space-between;
margin-bottom: 0;
width: 100%;
padding: var(--spacer_16);
}
.faq-sec__accordion-icon {
flex-shrink: 0;
width: 1.6rem;
height: 1.6rem;
padding: var(--spacer_2);
border: 1px solid #9b9b97;
border-radius: 50%;
transform: rotate(0);
transition: transform var(--slow_transition), background-color var(--slow_transition);
}
.faq__list-item-question:hover .faq-sec__accordion-icon {
background-color: #9b9b97;
}
.faq__list-item-question[aria-expanded="true"] .faq-sec__accordion-icon {
transform: rotate(180deg);
background-color: #9b9b97;
}
.faq-sec__accordion-icon path {
fill: #9B9B97;
transition: fill var(--slow_transition);
}
.faq__list-item-question:hover .faq-sec__accordion-icon path {
fill: var(--white_color);
}
.faq__list-item-question[aria-expanded="true"] .faq-sec__accordion-icon path {
fill: var(--white_color);
}
.faq__list-item-answer-container {
overflow: hidden;
max-height: 0;
transition: max-height var(--slow_transition);
}
.faq__list-item-answer-container.is-open {
max-height: 40rem;
}
.faq__list-item-answer {
padding: 0 var(--spacer_16) var(--spacer_16);
}
.faq__list-item-answer,
.faq__list-item-answer * {
color: var(--text_dark);
line-height: 1.5;
}
.faq__list-item-answer *:last-child {
margin-bottom: 0;
}
@media (max-width: 1024px) {
.faq {
flex-direction: column;
}
.faq__content-container,
.faq__list {
width: 100%;
max-width: 65rem;
}
.faq__content-inner {
padding-top: 0;
}
.faq__content-title,
.faq__content,
.faq__content * {
text-align: center;
}
.faq__button {
margin-left: auto;
margin-right: auto;
}
}
/* success-story-banner-cta */
.ssbc {
padding: var(--spacer_40) var(--spacer_20) 0;
border-radius: 32px;
position: relative;
}
.ssbc__inner {
margin: 0 auto;
max-width: 68.8rem;
padding: 0 var(--spacer_24);
}
.ssbc__title {
text-align: center;
color: var(--white_color);
margin-bottom: var(--spacer_24);
}
.ssbc__content {
margin: 0 auto;
}
.ssbc__content,
.ssbc__content * {
font-size: 20px;
line-height: 1.4;
letter-spacing: -0.3px;
text-align: center;
color: var(--white_color);
}
.ssbc__content *:last-child {
margin-bottom: 0;
}
.ssbc__button {
bottom: -8px;
position: relative;
width: fit-content;
margin: var(--spacer_40) auto 0;
}
.ssbc__button::after,
.ssbc__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.ssbc__button::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.ssbc__button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.ssbc__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
.ssbc__background-image {
border-radius: 32px;
height: 100% ;
left: 20px;
position: absolute;
top: 0;
width: calc(100% - 40px);
z-index: -1;
}
.ssbc__form form {
background-color: transparent;
padding: 24px 0 0;
max-width: 441px;
margin: 0 auto;
}
.ssbc__form form .hs-form-field label,{
font-weight: 400;
text-transform: inherit;
margin-bottom: 8px;
color: #FFF;
}
.ssbc__form form .hs-form-field label .hs-form-required {
color: #FFF;
}
.ssbc__form form .hs-form-field .input input {
background-color: #FFF;
border-radius: 6px;
border: 1px solid #D1D1CB;
color: rgba(61, 61, 56, 1.0);
font-family: Open Sans;
font-weight: 400;
font-size: 13px;
}
.ssbc__form input::placeholder {
font-family: Open Sans;
font-weight: 400;
font-size: 11px;
line-height: 1.6;
color: #9B9B97;
}
.ssbc__form form .legal-consent-container {
margin-bottom: 28px;
}
.ssbc__form form .legal-consent-container .hs-richtext,
.ssbc__form form .legal-consent-container .hs-richtext * {
font-weight: 400;
text-transform: inherit;
margin-bottom: 8px;
color: #FFF;
}
.ssbc__form form .legal-consent-container .hs-richtext a {
font-weight: 600;
background: unset;
}
.ssbc__form form .legal-consent-container label.hs-form-booleancheckbox-display {
display: flex;
gap: 4px;
}
.ssbc__form form .legal-consent-container label.hs-form-booleancheckbox-display input {
border: unset;
}
.ssbc__form form .legal-consent-container label.hs-form-booleancheckbox-display .mdl-checkbox__label,
.ssbc__form form .legal-consent-container label.hs-form-booleancheckbox-display .mdl-checkbox__label * {
margin-left: 0;
color: #FFF;
line-height: 1.2em;
}
.ssbc__form form .hs_submit .actions {
width: fit-content;
margin: 0 auto;
background: #fff;
border: 8px solid #fff;
border-radius: 32px;
bottom: -8px;
position: relative;
}
.ssbc__form form .hs_submit .actions:after,
.ssbc__form form .hs_submit .actions:before {
background-repeat: no-repeat;
background-size: contain;
bottom: 0;
content: "";
display: inline-block;
height: 48px;
position: absolute;
top: auto;
width: 36px;
z-index: 1;
}
.ssbc__form form .hs_submit .actions:before {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png);
left: -10px;
}
.ssbc__form form .hs_submit .actions:after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/sprites/right-bottom-cta-corner@2x.png);
right: -14px;
width: 15px;
bottom: 0;
top: unset;
height: 9px;
}
.ssbc__form form .hs_submit .actions .hs-button {
margin: 0 auto;
display: block;
background-color: #3be1a4;
border-radius: 50px;
color: #000;
cursor: pointer;
font-size: 16px;
font-weight: 600;
padding: 12px 28px;
position: relative;
text-align: center;
text-decoration: none;
transition: all .3s ease;
z-index: 2;
}
.ssbc__form form .hs_submit .actions .hs-button:hover {
background-color: #111010;
color: #fff;
}
@media (max-width: 767px) {
.ssbc__inner {
padding: 0;
}
}
/* grid-infos */
.gi__title {
color: var(--black_color);
text-align: center;
font-family: Raleway;
font-size: 40px;
font-weight: var(--font_weight_600);
line-height: 1.1;
margin-bottom: var(--spacer_30);
}
.gi__cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(4, 1fr);
gap: var(--spacer_26);
}
.gi__card {
margin: 0;
}
.gi__card-1 {
grid-column: 1 / 2;
grid-row: 1 / 3;
}
.gi__card-2 {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
.gi__card-3 {
grid-column: 3 / 4;
grid-row: 1 / 2;
}
.gi__card-4 {
grid-column: 1 / 2;
grid-row: 3 / 5;
}
.gi__card-5 {
grid-column: 2 / 4;
grid-row: 2 / 4;
}
.gi__card-6 {
grid-column: 2 / 4;
grid-row: 4 / 5;
}
.gi__card-inner {
border-radius: 28px;
background-color: #F0F0EC;
height: 100%;
width: 100%;
}
.gi__card-picto-container {
max-width: 24rem;
aspect-ratio: 1;
position: relative;
}
.gi__card-score-svg {
width: 100%;
height: auto;
}
.gi__card-score-bg {
fill: none;
stroke: #D1D1CB;
stroke-width: 10;
}
.gi__card-score-progress {
fill: none;
stroke: #3BE1A4;
stroke-width: 10;
stroke-linecap: round;
transform: rotate(-90deg);
transform-origin: 50% 50%;
stroke-dasharray: var(--gi-circumference);
stroke-dashoffset: var(--gi-circumference);
}
.gi__card-score-progress--visible {
animation: gi-score-fill 1.2s ease-out forwards;
}
@keyframes gi-score-fill {
to {
stroke-dashoffset: var(--gi-offset);
}
}
.gi__card-picto {
position: absolute;
width: 4.6rem;
height: auto;
aspect-ratio: 1;
object-fit: contain;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.gi__card-score {
color: #3BE1A4;
font-family: Raleway;
font-size: 64px;
font-weight: 500;
line-height: 1.1;
margin-bottom: 0;
}
.gi__card-content,
.gi__card-content * {
color: var(--black_color);
font-family: Raleway;
font-size: 24px;
font-weight: 500;
line-height: 1.1;
}
.gi__card-content *:last-child {
margin-bottom: 0;
}
/*************/
/** CARD 1 **/
/***********/
.gi__card-1-inner {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 20px;
padding: 40px;
}
.gi__card-1-score {
max-width: 256px;
width: 100%;
}
.gi__card-1-score {
text-align: center;
}
.gi__card-1-content {
max-width: 256px;
}
/*************/
/** CARD 2 **/
/** CARD 3 **/
/***********/
.gi__card-2-inner,
.gi__card-3-inner{
padding: 60px;
display: flex;
gap: 20px;
flex-direction: column;
align-items: center;
}
.gi__card-2-content,
.gi__card-3-content,
.gi__card-2-score-container,
.gi__card-3-score-container{
max-width: 256px;
}
/*************/
/** CARD 4 **/
/***********/
.gi__card-4-inner {
position: relative;
display: flex;
flex-direction: column;
gap: 20px;
align-items: flex-end;
justify-content: flex-start;
padding: 40px 48px;
overflow: hidden;
}
.gi__card-4-content,
.gi__card-4-score-container {
max-width: 225px;
z-index: 1;
position: relative;
text-align: right;
}
.gi__card-4-image {
height: 100% !important;
left: 50%;
object-fit: cover;
position: absolute;
top: 50%;
width: 100%;
transform: translate(-50%, -50%);
}
/*************/
/** CARD 5 **/
/***********/
.gi__card-5 {
position: relative;
}
.gi__card-5-image {
position: absolute;
height: auto!important;
left: 0;
bottom: -13px;
z-index: 1;
max-width: 67%;
}
.gi__card-5-inner {
position: relative;
display: flex;
flex-direction: column;
gap: 40px;
align-items: flex-end;
justify-content: flex-start;
padding: 60px 80px;
}
.gi__card-5-title {
color: var(--black_color);
text-align: right;
font-family: Raleway;
font-size: 40px;
font-weight: 600;
max-width: 400px;
margin-bottom: 0;
}
.gi__card-5-scores {
display: flex;
flex-direction: column;
gap: 20px;
}
.gi__card-5-score {
display: flex;
margin-bottom: 0;
}
.gi__card-5-score-number {
color: #3BE1A4;
font-family: Raleway;
font-size: 80px;
font-weight: 500;
line-height: 1;
margin-bottom: 0;
}
.gi__card-5-score-image {
width: 66px;
height: auto!important;
aspect-ratio: 1;
object-fit: contain;
}
/*************/
/** CARD 6 **/
/***********/
.gi__card-6 {
position: relative;
}
.gi__card-6-inner {
display: flex;
align-items: center;
padding: 20px 80px 20px 40px;
}
.gi__card-picto-content-container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
width: 100%;
}
.gi__card-6-picto-container {
max-width: 220px;
}
.gi__card-6-content-container {
display: flex;
max-width: 240px;
flex-direction: column;
gap: 20px;
}
.gi__card-6-image-container {
width: calc(741px - 220px - 240px - 40px);
height: 100%;
flex-shrink: 0;
}
.gi__card-6-image {
position: absolute;
right: -20px;
bottom: 0;
transform: translateY(14%);
}
@media (max-width: 1200px) {
.gi__card-6-picto-container {
display: none;
}
}
@media (max-width: 1024px) {
.gi__cards {
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(4, 1fr);
gap: 18px;
}
.gi__card-1 {
grid-row: 1 / 1;
grid-column: 1 / 3;
}
.gi__card-3 {
grid-column: 2/3;
grid-row: 2/3;
}
.gi__card-2 {
grid-column: 1/2;
grid-row: 2/3;
}
.gi__card-4 {
grid-column: 1/2;
grid-row: 3/5;
}
.gi__card-5 {
grid-column: 2 / 3;
grid-row: 3 / 4;
}
.gi__card-6 {
grid-column: 2/3;
grid-row: 4/5;
}
.gi__card-1-inner {
flex-direction: row;
padding: 20px;
}
.gi__card-1-inner {
padding: 20px;
}
.gi__card-5-image {
display: none;
}
.gi__card-6-image {
display: none;
}
.gi__card-6-image-container {
display: none;
}
.gi__card-6-content-container {
max-width: unset;
align-items: center;
}
.gi__card-5-inner {
padding: 20px;
}
.gi__card-5-title {
text-align: left;
font-size: 30px;
}
.gi__card-5-scores {
flex-wrap: wrap;
flex-direction: row;
justify-content: space-between;
width: 100%;
}
.gi__card-5-score-number {
font-size: 60px;
}
.gi__card-content,
.gi__card-content * {
text-align: center;
}
.gi__card-1-content,
.gi__card-1-content * {
grid-column: 2 / 3;
grid-row: 2 / 4;
max-width: unset;
}
.gi__card-6-inner {
padding: 20px;
}
.gi__card-1-inner {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(3, 1fr);
}
.gi__card-1-score-container {
grid-column: 2/3;
grid-row: 1/2;
}
.gi__card-1-score {
max-width: unset;
}
.gi__card-1-picto-container {
grid-column: 1 / 2;
grid-row: 1 / 4;
margin: auto;
}
.gi__card-2-inner,
.gi__card-3-inner {
padding: 20px;
justify-content: center;
}
}
@media (max-width: 600px) {
.gi__cards {
display: flex;
flex-direction: column;
gap: 12px;
}
.gi__card-1-picto-container {
display: none;
}
.gi__card-score {
font-size: 36px;
font-weight: 600;
line-height: 110%;
text-align: left;
}
.gi__card-1-content {
text-align: left;
}
.gi__card-1-inner {
padding: 32px 20px;
display: flex;
flex-direction: column;
gap: 24px;
align-items: flex-start;
}
.gi__card-2-inner {
padding: 32px 20px;
align-items: flex-start;
}
.gi__card-2-content,
.gi__card-2-score-container,
.gi__card-3-content,
.gi__card-3-score-container {
max-width: unset;
text-align: left;
}
.gi__card-content,
.gi__card-content * {
text-align: left;
}
.gi__card-3-inner {
align-items: flex-start;
padding: 32px 20px;
}
.gi__card-4-inner {
padding: 32px 20px;
align-items: flex-start;
}
.gi__card-4-image {
display: none;
}
.gi__card-4-score-container {
max-width: unset;
}
.gi__card-4-content {
max-width: unset;
}
.gi__card-5-inner {
padding: 32px 20px;
align-items: flex-start;
gap: 20px;
}
.gi__card-5-title {
font-size: 24px;
line-height: 1.1;
max-width: unset;
text-align: left;
}
.gi__card-5-score-number {
font-size: 36px;
}
.gi__card-5-score-image {
width: 40px;
}
.gi__card-5-scores {
justify-content: center;
}
.gi__card-6-inner {
padding: 32px 20px;
}
.gi__card-6-content-container {
align-items: flex-start;
}
}
/* hero-home */
.hh {
display: grid;
grid-template-columns: min(calc(100vw - var(--spacer_28) * 2), 1324px);
grid-template-rows: auto auto 1fr;
position: relative;
}
.hh__header {
grid-column: 1;
grid-row: 1;
display: flex;
flex-direction: column;
align-items: center;
background-color: var(--background);
}
.hh__header-tag {
margin-bottom: var(--spacer_16);
}
.hh__header-title {
padding: 0 var(--spacer_4);
text-align: center;
}
.hh__content {
background-color: var(--background);
border-radius: 0 0 24px 24px;
color: #6c6c68;
font-size: 18px;
line-height: 1.4;
max-width: 975px;
padding: 0 40px 24px;
grid-column: 1;
grid-row: 2;
margin: 0 auto;
font-weight: var(--font_weight_500);
width: 100%;
text-align: center;
position: relative;
z-index: 2;
}
.hh:not(.hh--2) .hh__content {
transform: translateY(-1px);
}
.hh__content::before,
.hh__buttons::before {
background: radial-gradient(circle at 0 100%, transparent 67%,var(--background) 68%);
content: "";
height: 24px;
width: 24px;
left: -23px;
position: absolute;
top: 0;
}
.hh__content::after,
.hh__buttons::after {
content: '';
position: absolute;
top: 0;
height: 24px;
width: 24px;
right: -23px;
background: radial-gradient(circle at 100% 100%, transparent 67%,var(--background) 68%);
}
.hh--2 .hh__header::after,
.hh--2 .hh__logo-container::after,
.hh--2 .hh__logo-container::before {
content: '';
position: absolute;
top: -1px;
height: 25px;
width: 25px;
right: -24px;
background: radial-gradient(circle at 100% 100%, transparent 67%,var(--background) 68%);
}
.hh--2 .hh__logo-container::before {
right: unset;
top: calc(100% - 1px);
left: -1px;
}
.hh__content *:last-child {
margin-bottom: 0;
}
.hh__buttons {
grid-column: 1;
grid-row: 3;
background-color: var(--background);
border-radius: 0 0 24px 24px;
display: flex;
flex-wrap: wrap;
gap: 16px;
justify-content: center;
max-width: 700px;
padding: 0 16px 35px;
position: relative;
width: 100%;
height: fit-content;
margin: 0 auto;
z-index: 2;
}
.hh:not(.hh--2) .hh__buttons {
transform: translateY(-2px);
}
.hh__button-link {
padding: var(--spacer_12) var(--spacer_28);
}
.hh__video-container {
grid-column: 1;
grid-row: 2 / -1;
margin-left: calc(50% - 50vw + var(--spacer_28));
position: relative;
width: calc(100vw - var(--spacer_28) * 2);
display: flex;
align-items: center;
justify-content: center;
}
.hh__video {
border-radius: 24px;
max-width: 100%;
}
.hh__video--mobile {
display: none;
}
.hh--2 .hh__header {
max-width: 81rem;
z-index: 2;
border-bottom-right-radius: 24px;
padding: var(--spacer_30) var(--spacer_50) var(--spacer_30) var(--spacer_28);
position: relative;
box-shadow: 8px 8px 5px -9px #80808020;
}
.hh--2 .hh__video-container {
grid-row: 1/-1;
border-radius: 24px;
box-shadow: 8px 8px 5px -9px #80808020;
overflow: hidden;
}
.hh--2 .hh__video {
max-width: 101%;
width: 101%;
max-height: 101%;
height: 101%;
}
.hh--2 .hh__logo-container {
grid-column: 1;
grid-row: 2;
z-index: 2;
background-color: var(--background);
max-width: 29rem;
max-height: 10.4rem;
padding: var(--spacer_20) var(--spacer_40) var(--spacer_20) var(--spacer_28);
border-bottom-right-radius: 24px;
position: relative;
box-shadow: 8px 8px 5px -9px #80808020;
margin-top: -1px;
}
.hh--2 .hh__logo {
width: 100%;
height: 100%;
object-fit: contain;
object-position: left center;
}
.hh--2 .hh__header-title {
line-height: 1.4;
margin: 0;
text-align: left;
width: 100%;
}
@media (min-width: 1380px) {
.hh--2 .hh__header,
.hh--2 .hh__logo-container {
z-index: 3;
transform: translateX(calc((100vw - var(--container_width)) / -2));
}
.hh--2 .hh__logo {
width: auto;
}
}
@media (max-width: 1024px) {
.hh {
grid-template-columns: 1fr
}
.hh--2 {
gap: var(--spacer_28);
}
.hh__video-container {
grid-row: 4;
margin-left: unset;
}
.hh--2 .hh__video-container {
grid-row: 3;
}
.hh__video--desktop {
display: none;
}
.hh__video--mobile {
display: block;
max-height: 90vh;
margin: 0 auto;
}
.hh--2 .hh__header {
grid-row: 2;
padding: 0;
margin: 0 auto;
}
.hh--2 .hh__header-title {
text-align: center;
}
.hh--2 .hh__logo-container {
grid-row: 1;
padding: 0;
margin: 0 auto;
}
.hh--2 .hh__header:after,
.hh--2 .hh__logo-container:after,
.hh--2 .hh__logo-container:before {
display: none;
}
}
@media (max-width: 767px) {
.dnd-section:has(.hh--2),
.hh--2 .hh__logo-container,
.hh--2 .hh__header {
background-color: #f0f0ec;
}
.hh--2 .hh__logo-container,
.hh--2 .hh__header,
.hh--2 .hh__video-container {
box-shadow: unset;
}
.hh--2 .hh__video-container {
overflow: visible;
border-top-left-radius: 60px;
border-top-right-radius: 60px;
}
.hh--2 .hh__video--mobile {
max-width: 100vw;
width: 100vw;
border-top-left-radius: 60px;
border-top-right-radius: 60px;
}
.hh--2 .hh__video--mobile::-webkit-media-controls-panel {
border: none;
}
.hh--2 .hh__video--mobile:focus {
outline: none;
}
.hh__content::before,
.hh__buttons::before,
.hh__content::after,
.hh__buttons::after {
display: none;
}
.hh__content {
padding: 0 0 var(--spacer_24);
}
.hh__buttons {
padding-right: var(--spacer_10);
padding-left: var(--spacer_10);
}
}
/* hero-seachbar */
.hero-search {
display: flex;
flex-direction: column;
align-items: center;
}
.hero-search__bar {
margin: 0 auto;
border-radius: 172px;
background: rgba(0,0,0,.7);
backdrop-filter: blur(58px);
padding: var(--spacer_14) var(--spacer_14) var(--spacer_14) var(--spacer_40);
display: flex;
justify-content: space-between;
align-items: center;
gap: var(--spacer_60);
width: fit-content;
--bar-translate: translateY(-50%);
max-width: 100%;
}
.hero-search__bar::before {
content: attr(data-text);
display: block;
opacity: 0;
font: inherit;
pointer-events: none;
}
.hero-search__bar::before,
.hero-search__title {
margin: 0;
overflow: hidden;
max-width: max-content;
padding-right: 4px;
width: fit-content;
color: var(--white_color);
font-weight: var(--h3_font_weight);
font-family: var(--h3_font_family);
font-size: var(--h3_font_size);
line-height: var(--h3_line_height);
white-space: nowrap;
}
.hero-search__title {
position: absolute;
top: 50%;
left: 40px;
border-right: 3px solid var(--white_color);
transform: var(--bar-translate);
}
.hero-search__title span {
display: none;
opacity: 0;
transition: opacity 0.08s ease;
}
.hero-search__title span::after {
content: "";
position: absolute;
width: 3px;
height: 100%;
top: 0;
right: -3px;
opacity: 0;
background-color: var(--white_color);
animation: char-caret 0.15s calc(var(--delay)) forwards;
}
.hero-search__title span.is-last::after {
animation: appear var(--delay) forwards, blink-caret 0.8s step-end calc(var(--delay) + 0.15s) infinite;
}
@keyframes appear {
to { opacity: 1; }
}
@keyframes char-caret {
0% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes blink-caret {
from, to { opacity: 0; }
50% { opacity: 1; }
}
.hero-search__bar-button-fake {
flex-shrink: 0;
width: 4.4rem;;
height: 4.4rem;
background: var(--white_color);
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.hero-search__bar-button-fake svg {
width: 2.0rem;
height: 2.0rem;
}
.hero-search__subtitle {
margin: 0 auto;
}
.hero-search__subtitle,
.hero-search__subtitle * {
max-width: 80rem;
margin-top: var(--spacer_32);
font-family: Raleway;
font-size: 32px;
font-weight: 500;
line-height: 1.1;
text-align: center;
}
.hero-search__subtitle *:last-child {
margin-bottom: 0;
}
@media (max-width: 1024px) {
.hero-search__bar {
transform: unset;
overflow: hidden;
margin: 0 var(--spacer_10);
padding: var(--spacer_6) var(--spacer_6) var(--spacer_6) var(--spacer_16);
gap: var(--spacer_32);
}
.hero-search__title {
left: var(--spacer_16);
width: max-content;
}
}
@media (max-width: 767px) {
.hero-search__bar {
padding: var(--spacer_6) var(--spacer_6) var(--spacer_6) var(--spacer_16);
gap: var(--spacer_24);
}
.hero-search__bar-button-fake {
height: 4.8rem;
width: 4.8rem;
}
}
/* hero-simple */
.dnd-section:has(.hs__background) {
position: relative;
}
.hs {
display: flex;
flex-direction: column;
gap: var(--spacer_16);
}
.hs__title,
.hs__content,
.hs__content * {
text-align: center;
color: var(--white_color)
}
.hs__content *:last-child {
margin-bottom: 0;
}
.hs__buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
justify-content: center;
align-items: center;
margin-top: var(--spacer_16);
}
.hs__background {
position: absolute;
width: 100%;
height: 100%;
max-width: 165rem;
left: 50%;
transform: translateX(-50%);
top: 0;
z-index: -1;
}
/* hero-structured-image */
.dnd-section:has(.hero-secondary) {
position: relative;
max-width: var(--container_width);
margin: 0px auto;
}
.hero-secondary__content {
width: fit-content;
}
.hero-secondary__title {
color: #000;
font-family: Raleway;
font-size: 64px;
font-weight: 500;
line-height: 1.1;
margin-bottom: 0;
width: fit-content;
position: relative;
}
.hero-secondary__title::before {
border-top-right-radius: 40px;
content: "";
height: calc((var(--first_title_height) / 1.5));
position: absolute;
top: 0;
left: 0;
width: var(--first_title_width);
}
.hero-secondary__title::after {
z-index: 0;
border-top-right-radius: 36px;
content: "";
right: 0;
height: calc(var(--second_title_height) + (var(--first_title_height) - (var(--first_title_height)/1.5) ) + 2px);
position: absolute;
top: calc(var(--first_title_height) - (var(--first_title_height) - (var(--first_title_height)/1.5) ) + 16px);
width: var(--second_title_width);
}
.hero-secondary__title-part {
display: block;
width: fit-content;
padding-left: 20px;
border-top-right-radius: 32px;
position: relative;
z-index: 1;
}
.hero-secondary__title-part--first {
padding-top: 20px;
}
.hero-secondary__subtitle {
padding-left: 20px;
color: #707070;
font-size: 20px;
line-height: 1.4;
width: min-content;
min-width: 100%;
padding-right: 10px;
padding-bottom: 40px;
margin-top: 16px;
}
.hero-secondary__background-container {
position: absolute;
width: calc(100% - var(--spacer_28) * 2);
height: 100%;
z-index: -1;
top: 0;
left: var(--spacer_28);
border-radius: 32px;
overflow: hidden;
opacity: 0;
transition: opacity 0.5s ease;
}
.loaded .hero-secondary__background-container {
opacity: 1;
}
.hero-secondary__background {
max-width: unset!important;
object-fit: cover;
height: var(--section_height)!important;
width: var(--section_width)!important;
}
.hero-secondary__background--top {
position: absolute;
width: 100%;
height: var(--section_blank_height);
top: 0;
left: 0;
border-top-left-radius: 36px;
border-top-right-radius: 36px;
border-bottom-left-radius: 36px;
overflow: hidden;
}
.hero-secondary__background--middle-1 {
position: absolute;
width: 100% - var(--first_title_width);
height: calc((var(--first_title_height) / 1.5) / 2);
top: var(--section_blank_height);
left: var(--first_title_width);
overflow: hidden;
}
.hero-secondary__background--middle-1 .hero-secondary__background {
top: calc(var(--section_blank_height) * (-1));
left: calc(var(--first_title_width) * (-1));
position: relative;
}
.hero-secondary__background--middle-2 {
position: absolute;
width: calc(100% - var(--first_title_width));
height: calc((var(--first_title_height) / 1.5) / 2 + 16px);
top: calc(var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2));
left: var(--first_title_width);
border-bottom-left-radius: 36px;
overflow: hidden;
}
.hero-secondary__background--middle-2 .hero-secondary__background {
top: calc((var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2)) * (-1));
left: calc(var(--first_title_width) * (-1));
position: relative;
}
.hero-secondary__background--bottom-1 {
border-bottom-left-radius: 36px;
position: absolute;
width: calc(100% - var(--second_title_width));
height: calc((var(--section_height) - (var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2) + ((var(--first_title_height) / 1.5) / 2) )) / 2 + 16px);
bottom: calc((var(--section_height) - (var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2) + ((var(--first_title_height) / 1.5) / 2) )) / 2 - 16px);
left: var(--second_title_width);
overflow: hidden;
}
.hero-secondary__background--bottom-1 .hero-secondary__background {
left: calc(var(--second_title_width) * -1);
position: relative;
top: calc((var(--section_height) - (var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2) + ((var(--first_title_height) / 1.5) / 2) )));;
transform: translateY(-100%);
}
.hero-secondary__background--bottom-2 {
border-bottom-left-radius: 36px;
position: absolute;
width: calc(100% - var(--second_title_width));
height: calc((var(--section_height) - (var(--section_blank_height) + ((var(--first_title_height) / 1.5) / 2) + ((var(--first_title_height) / 1.5) / 2) )) / 2);
bottom: 0;
left: var(--second_title_width);
overflow: hidden;
}
.hero-secondary__background--bottom-2 .hero-secondary__background {
left: calc(var(--second_title_width) * -1);
position: relative;
top: 100%;
transform: translateY(-100%);
}
.hero-secondary__background-container--mobile {
display: none;
}
@media (max-width: 767px) {
.dnd-section:has(.hero-secondary) {
border-bottom-left-radius: 36px;
border-bottom-right-radius: 36px;
overflow: hidden;
}
.hero-secondary {
padding-top: 254px;
}
.hero-secondary__background-container,
.hero-secondary__title::after,
.hero-secondary__title::before {
display: none;
}
.hero-secondary__background-container--mobile {
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1
}
.hero-secondary__background--mobile {
width: 100%;
height: 100%!important;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
}
.hero-secondary__content,
.hero-secondary__title {
display: flex;
flex-direction: column;
width: auto;
align-items: center;
}
.hero-secondary__content {
padding: 0 24px 64px;
border-bottom-left-radius: 36px;
border-bottom-right-radius: 36px;
background: linear-gradient(180deg, transparent 20%, rgba(0, 0, 0, 1) 100%);
}
.hero-secondary__title {
padding: 0;
color: #FFF;
font-weight: 600;
font-size: 36px;
line-height: 1.1;
text-align: center;
margin-bottom: 20px;
}
.hero-secondary__title-part,
.hero-secondary__title-part--first,
.hero-secondary__title-part--second,
.hero-secondary__subtitle {
padding: 0;
}
.hero-secondary__subtitle {
color: #F0F0EC;
font-size: 18px;
text-align: center;
}
}
/* logo-raws */
.dnd-section:has(.lr) {
position: relative;
z-index: 2;
}
.lr__title {
color: #9b9b97;
margin-bottom: var(--spacer_24);
text-align: center;
}
.lr__list {
display: flex;
gap: 8px;
}
.lr__list:not(:first-child) {
margin-top: 8px;
}
.lr__list-item {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.lr__list-item-logo {
max-height: 100%;
max-width: 100%;
object-fit: contain;
width: auto;
}
.lr__list-item-link {
bottom: 0;
height: 2rem;
max-width: 2rem;
min-width: 2rem;
position: absolute;
right: 0;
width: fit-content;
background-color: var(--primary_color);
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
transition: max-width var(--slow_transition), padding var(--slow_transition);
overflow: hidden;
padding: 0;
}
.lr__list-item-link:hover {
max-width: 100%;
padding: 0 var(--spacer_12);
}
.lr__list-item-link-svg {
position: relative;
transition: max-width var(--slow_transition);
max-width: 2rem;
}
.lr__list-item-link:hover .lr__list-item-link-svg {
max-width: 0;
}
.lr__list-item-link-text {
font-size: 12px;
overflow: hidden;
white-space: nowrap;
max-width: 0;
transition: max-width var(--slow_transition);
}
.lr__list-item-link:hover .lr__list-item-link-text {
max-width: 100%;
}
.lr__list-item-popup {
background: #f8f8f6;
display: flex;
flex-direction: column;
gap: var(--spacer_20);
padding: var(--spacer_20);
border-radius: 8px;
opacity: 0;
z-index: -1;
transition: z-index var(--slow_transition), opacity var(--slow_transition);
position: absolute;
top: calc(100% + var(--spacer_12));
left: 50%;
transform: translateX(-50%);
max-width: min(350px, calc(100dvw - 40px));
width: 100vw;
overflow-y: auto;
}
.lr__list-item:first-child .lr__list-item-popup {
left: 0;
transform: unset;
}
.lr__list-item:last-child .lr__list-item-popup {
left: unset;
right: 0;
transform: unset;
}
.lr__list-item-link:hover ~ .lr__list-item-popup {
opacity: 1;
z-index: 2;
}
.lr__list-item-popup svg {
margin-left: auto;
height: 35px;
width: 48px;
}
.lr__list-item-popup-number-container {
display: flex;
gap: var(--spacer_6);
align-items: center;
}
.lr__list-item-popup-number {
color: var(--text_grey);
font-size: 72px;
font-weight: 200;
letter-spacing: -.02em;
line-height: 1.1;
flex-shrink: 0;
margin-bottom: 0;
font-family: Raleway,sans-serif;
}
.lr__list-item-popup-caption {
color: var(--text_grey);
font-size: 20px;
font-weight: 700;
margin-bottom: 0;
height: fit-content;
line-height: 1.1;
}
.lr__list-item-popup-small-text {
color: #707070;
font-size: 14px;
text-shadow: 0 0 48px hsla(0, 0%, 100%, .64);
}
.lr__list-item-popup-testimonial-quote {
color: #6c6c68;
font-size: 14px;
line-height: 1.5;
}
.lr__list-item-popup-author-container {
align-items: center;
display: flex;
gap: 12px;
}
.lr__list-item-popup-author-avatar {
border-radius: 12px;
height: 40px;
object-fit: cover;
width: 40px;
flex-shrink: 0;
}
.lr__list-item-popup-author-name {
color: var(--text_grey);
font-size: 14px;
font-weight: 600;
margin-bottom: 2px;
}
.lr__list-item-popup-author-job {
color: var(--text_grey);
font-size: 12px;
margin: 0;
}
@media (hover: none) {
.lr__list-item-popup {
display: none;
}
}
@media (max-width: 1024px) {
.lr__list-item--tablet {
display: none;
}
}
@media (max-width: 700px) {
.lr__list {
justify-content: center;
}
.lr__list-item {
width: auto;
}
.lr__list-item--mobile {
display: none;
}
}
/* numbers-n-image */
/* Client Highlights Stats Module Styles */
.client-highlights-stats-section .client-highlights-stats-wrapper {
display: flex;
gap: 38px;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap;
}
.client-highlights-stats-section .company-logo-container {
margin: 0 0 var(--spacer_40);
}
.client-highlights-stats-section .client-highlights-stats-content-column {
width: calc(100% - 52.4rem - var(--spacer_38));
max-width: 90rem;
}
.client-highlights-stats-section .client-highlights-stats-wrapper--left {
flex-direction: row-reverse;
}
.client-highlights-stats-section .client-highlights-stats-wrapper--left .client-highlights-stats-content-column {
grid-area: content;
}
.client-highlights-stats-section .client-highlights-stats-wrapper--left .client-highlights-stats-image-column {
grid-area: image;
}
.client-highlights-stats-section .client-highlights-cta-container {
margin-top: var(--spacer_24);
}
.client-highlights-stats-section .company-logo {
min-height: 40px;
width: auto;
object-fit: contain;
}
/* Hide mobile logo on desktop */
.client-highlights-stats-section .company-logo-container--mobile {
display: none;
}
.client-highlights-stats-section .content-title {
font-size: 32px;
font-weight: var(--font_weight_700);
line-height: 1.2;
color: #1F2937;
margin: 0 0 var(--spacer_24) 0;
}
.client-highlights-stats-section .content-description {
font-size: 18px;
line-height: 1.6;
color: #4B5563;
margin-bottom: var(--spacer_40);
}
.client-highlights-stats-section .content-description p {
margin: 0 0 var(--spacer_16) 0;
}
.client-highlights-stats-section .content-description p:last-child {
margin-bottom: 0;
}
/* Stats Grid */
.client-highlights-stats-section .stats-grid {
display: flex;
gap: var(--spacer_24);
margin-bottom: var(--spacer_52);
justify-content: space-between;
flex-wrap: wrap;
}
.client-highlights-stats-section .stats-grid--2 {
gap: var(--spacer_32) 9.2rem;
justify-content: flex-start;
flex-wrap: wrap;
}
.client-highlights-stats-section .stat-card {
overflow: hidden;
align-items: flex-start;
width: auto;
min-height: 15rem;
width: calc(100%/3 - var(--spacer_24) *2 / 3);
}
.client-highlights-stats-section .stat-number {
font-family: 'Raleway', sans-serif;
font-size: 112px;
font-weight: var(--font_weight_200);
line-height: 1;
color: #3BE1A4;
position: relative;
z-index: 1;
letter-spacing: -2.24px;
white-space: nowrap;
}
.client-highlights-stats-section .stat-label {
font-family: 'Raleway', sans-serif;
font-size: 20px;
font-weight: var(--font_weight_700);
line-height: 1.2;
color: var(--black_color);
text-shadow: 0 0 48px rgba(255, 255, 255, 0.64);
position: relative;
z-index: 1;
}
.client-highlights-stats-section .stat-description {
color: #6C6C68;
position: relative;
z-index: 1;
}
.client-highlights-stats-section .client-highlights-cta-button {
min-width: 20rem;
}
.client-highlights-stats-section .client-highlights-stats-image-column {
display: flex;
align-items: center;
justify-content: center;
width: 52.4rem;
position: relative;
flex-shrink: 0;
aspect-ratio: 524 / 425;
}
.client-highlights-stats-section .background-image-container {
width: 100%;
position: relative;
}
.client-highlights-stats-section .background-image {
width: 100%;
height: auto;
object-fit: cover;
border-radius: 28px;
max-width: unset;
}
.client-highlights-stats-section .background-image--mobile {
display: none;
}
.client-highlights-stats-section .stats-grid--2 .stat-card {
min-width: unset;
}
@media (max-width: 1024px) {
.client-highlights-stats-section .client-highlights-stats-content-column {
max-width: 70%;
}
.client-highlights-stats-section .stat-number {
font-size: 60px;
}
.client-highlights-stats-section .stat-label {
font-size: 14px;
}
.client-highlights-stats-section .stat-description {
font-size: 14px;
}
.client-highlights-stats-section .stat-card {
min-width: 180px;
padding-right: 0;
}
.client-highlights-stats-section .stat-card:nth-child(3) {
min-width: auto;
}
.client-highlights-stats-section .stats-grid {
gap: 0;
flex-wrap: wrap;
}
}
@media (max-width: 768px) {
.client-highlights-stats-section .client-highlights-stats-section {
margin: 0 auto 40px;
}
/* Hide content column logo on mobile */
.client-highlights-stats-section .client-highlights-stats-content-column .company-logo-container {
display: none;
}
/* Show and position mobile logo */
.client-highlights-stats-section .company-logo-container--mobile {
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 10;
margin: 0;
text-align: center;
}
.client-highlights-stats-section .client-highlights-cta-container {
padding: 0;
margin: 0 var(--spacer_16);
position: relative;
transform: translateY(18px);
width: fit-content;
}
.client-highlights-cta-container::after,
.client-highlights-cta-container::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.client-highlights-cta-container::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.client-highlights-cta-container::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.client-highlights-cta-button {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
background-color: var(--white_color);
}
.client-highlights-stats-section .client-highlights-stats-wrapper {
flex-direction: column;
gap: var(--spacer_20);
}
/* Move image column to the top */
.client-highlights-stats-section .client-highlights-stats-image-column {
order: -1;
position: relative;
width: 100%;
aspect-ratio: unset;
}
.client-highlights-stats-section .client-highlights-stats-content-column {
max-width: 100%;
text-align: center;
display: flex;
flex-direction: column;
width: 100%;
}
/* Make background image container responsive */
.client-highlights-stats-section .background-image-container {
min-width: 100%;
max-width: 100%;
width: 100%;
}
/* Add dark overlay on mobile */
.client-highlights-stats-section .background-image-container::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%);
border-radius: 16px;
z-index: 1;
}
.client-highlights-stats-section .background-image {
width: 100%;
height: auto;
max-height: 200px;
border-radius: 16px;
}
.client-highlights-stats-section .background-image-container:has(.background-image--mobile) .background-image {
display: none;
}
.client-highlights-stats-section .background-image--mobile {
width: 100%;
height: auto;
max-height: 200px;
border-radius: 16px;
display: block;
object-fit: cover;
}
.client-highlights-stats-section .content-title {
font-size: 28px;
}
.client-highlights-stats-section .stats-grid {
flex-direction: column;
gap: 20px;
margin: 0 0 40px 0;
}
.client-highlights-stats-section .stat-card {
width: 100%;
height: auto;
padding: 0 20px 0 20px;
min-height: 50px;
}
.client-highlights-stats-section {
background-color: #F0F0EC;
border-radius: 28px;
padding: 10px;
}
}
/* pricing-table */
.pt {
position: relative;
display: grid;
grid-template-columns: minmax(250px,33.33%) 1fr;
gap: var(--spacer_12);
}
.pt__header-switcher-checkbox {
opacity: 0;
width: 0;
height: 0;
visibility: hidden;
}
.pt__header {
max-width: 340px;
grid-column: 1;
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.pt__header-subtitle {
margin-bottom: var(--spacer_8);
}
.pt__header-subtitle *:last-child {
margin-bottom: 0;
}
.pt__header-switcher-container {
margin-top: var(--spacer_32);
}
.pt__header-switcher-inner {
display: flex;
gap: var(--spacer_16);
}
.pt__header-switcher-text-container {
position: relative;
}
.pt__header-switcher-text,
.pt__header-switcher-text-container::before{
font-size: 20px;
color: var(--text_grey);
position: absolute;
top: 0;
left: 0;
font-weight: var(--font_weight_400);
transition: font-weight var(--slow_transition);
white-space: nowrap;
}
.pt__header-switcher-text-container::before {
content: attr(data-text);
position: static;
display: block;
font-weight: var(--font_weight_700);
opacity: 0;
}
.pt__header-switcher-text--left {
font-weight: var(--font_weight_700);
}
.pt__header-switcher-checkbox:checked ~ .pt__header .pt__header-switcher-text--left {
font-weight: var(--font_weight_400);
}
.pt__header-switcher-checkbox:checked ~ .pt__header .pt__header-switcher-text--right {
font-weight: var(--font_weight_700);
}
.pt__header-switcher {
background-color: #f8f8f6;
border: 2px solid #f0f0ec;
border-radius: 51px;
cursor: pointer;
width: 6rem;
height: 3.2rem;
position: relative;
}
.pt__header-switcher:before {
background-color: #3be1a4;
border-radius: 50%;
bottom: 2px;
content: "";
height: 24px;
left: 3px;
position: absolute;
transition: left var(--slow_transition);
width: 24px;
}
.pt__header-switcher-checkbox:checked ~ .pt__header .pt__header-switcher:before {
left: calc(100% - 24px - 3px);
}
.pt__header-switcher-under-text {
font-size: 14px;
margin-top: var(--spacer_12);
}
.pt__products {
grid-column: 2;
display: flex;
gap: var(--spacer_20);
}
.pt__product-item {
background-color: #f0f0ec;
border-radius: 28px;
padding: var(--spacer_32) var(--spacer_24) var(--spacer_60);
flex: 1;
position: relative;
}
.pt__product-item-name {
text-align: center;
}
.pt__product-item-price-container {
display: flex;
flex-direction: column;
align-items: center;
}
.pt__product-item-price-inner {
font-family: "raleway";
color: #080b0c;
font-size: 40px;
font-weight: 600;
line-height: 1.1;
position: relative;
white-space: nowrap;
}
.pt__product-item-price {
opacity: 1;
transition: opacity var(--slow_transition);
}
.pt__product-item-price--second {
opacity: 0;
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
}
.pt__header-switcher-checkbox:checked ~ .pt__products .pt__product-item-price--first {
opacity: 0;
}
.pt__header-switcher-checkbox:checked ~ .pt__products .pt__product-item-price--second {
opacity: 1;
}
.pt__product-item-price-suffix {
color: #9b9b97;
font-size: 20px;
font-weight: 700;
}
.pt__product-item-price-caption {
color: #666;
line-height: 1.6;
text-align: center;
}
.pt__button {
left: 50%;
position: absolute;
bottom: -8px;
display: flex;
align-items: center;
justify-content: center;
transform: translateX(-50%);
width: max-content;
}
.pt__button::after,
.pt__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 10px;
position: absolute;
width: 10px;
z-index: 2;
}
.pt__button::before {
background-image: url('data:image/svg+xml,');
left: -3px;
bottom: 5px;
transform: rotate(180deg) scale(-1, 1);
}
.pt__button::after {
background-image: url('data:image/svg+xml,');
right: -3px;
bottom: 5px;
transform: rotate(180deg);
}
.pt__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
padding: var(--spacer_8) var(--spacer_16);
}
.pt__table {
grid-column: 1/3;
}
.pt__table-title {
margin: var(--spacer_28) 0 var(--spacer_20);
}
.pt__arrows {
display: none;
}
.pt__table-row {
border-top: 1px solid #e9eaf2;
display: grid;
grid-template-columns: minmax(250px, 33.33%) 1fr;
gap: var(--spacer_12);
background-color: var(--white_color);
transition: background-color var(--slow_transition);
padding: var(--spacer_12) 0;
}
.pt__table-row:last-child {
border-bottom: 1px solid #e9eaf2;
}
.pt__table-row:hover {
background-color: #f9fafb;
}
.pt__table-row-header {
grid-column: 1;
display: flex;
justify-content: center;
flex-direction: column;
gap: var(--spacer_4);
padding: var(--spacer_4) 0;
}
.pt__table-row-title {
color: #3d3d38;
font-family: Raleway, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: var(--font_weight_700);
margin-bottom: 0;
}
.pt__table-row-subtitle,
.pt__table-row-subtitle * {
color: #9b9b97;
font-size: 14px;
max-width: 290px;
}
.pt__table-row-subtitle *:last-child {
margin-bottom: 0;
}
.pt__table-row-cell-container {
display: flex;
}
.pt__table-row-cell {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.pt__table-row-number {
margin-bottom: 0;
color: #3d3d38;
font-size: 20px;
font-style: normal;
font-weight: var(--font_weight_700);
line-height: 110%;
text-align: center;
}
.pt__table-row-number-caption {
color: #9b9b97;
font-size: 14px;
text-align: center;
}
.pt__table-row-number-caption p {
margin-bottom: var(--spacer_6);
}
.pt__table-row-number-caption *:last-child {
margin-bottom: 0;
}
.pt__table-row-text {
color: var(--black_color);
font-weight: var(--font_weight_500);
margin-bottom: 0;
}
@media (max-width: 1024px) {
.pt {
grid-template-columns: 1fr;
overflow-x: scroll;
}
.pt__header {
align-items: center;
}
.pt__header,
.pt__table-row-header {
max-width: calc(100vw - var(--spacer_48));
position: sticky;
left: 0;
}
.pt__header-title,
.pt__header-subtitle,
.pt__header-subtitle * {
text-align: center;
}
.pt__products,
.pt__table {
grid-column: 1;
}
.pt__products,
.pt__table-row-cell-container {
overflow-x: auto;
scroll-snap-type: x mandatory;
scrollbar-width: none;
-ms-overflow-style: none;
display: grid;
gap: var(--spacer_36);
grid-template-columns: minmax(235px, 1fr) minmax(235px, 1fr) minmax(235px, 1fr);
margin: 0;
min-width: 100dvw;
overflow-x: auto;
overflow-y: hidden;
padding: 0;
scrollbar-width: none;
}
.pt__products::-webkit-scrollbar,
.pt__table-row-cell-container::-webkit-scrollbar {
display: none;
}
.pt__product-item {
overflow: hidden;
grid-column: auto;
}
.pt__table-title {
position: sticky;
left: 0;
}
.pt__table-row {
display: flex;
flex-direction: column;
}
.pt__product-item,
.pt__table-row-cell{
flex: 0 0 100%;
position: relative;
}
.pt__table-row-title {
text-align: center;
width: fit-content;
}
.pt__table-row-subtitle
.pt__table-row-subtitle * {
width: auto;
}
.pt__table-title-container {
display: flex;
justify-content: space-between;
}
}
@media (max-width: 600px) {
.pt__table-row {
grid-template-columns: 1fr;
grid-template-rows: auto auto;
}
.pt__table-row-cell-container {
grid-column: 1;
grid-row: 2;
}
}
/* =========================================
STYLE DU CONTENU MOBILE (Ton Design)
========================================= */
.simple-header-wrapper {
width: 100%;
padding: 100px 20px 40px; /* Padding-top élevé pour passer sous le header mobile */
background: transparent;
display: flex;
justify-content: center;
}
.simple-header-container {
max-width: 800px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
/* Teaser */
.simple-header-teaser {
font-size: 14px;
font-weight: 600;
color: #3D3D38;
text-transform: uppercase;
letter-spacing: 0.5px;
background-color: #F0F0EC;
padding: var(--spacer_6) var(--spacer_12);
border-radius: 6px;
margin-bottom: 24px;
display: inline-block;
}
/* Titre Principal */
.simple-header-title {
font-weight: 500;
color: #0A0A09;
margin-bottom: var(--spacer_24);
}
/* Description Principale */
.simple-header-description {
font-weight: 500;
line-height: 1.5;
color: #6C6C68;
margin-bottom: 32px;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
/* Sous-Titre */
.simple-subheader-title {
font-size: 24px;
line-height: 1.3;
font-weight: 500;
color: #0A0A09;
margin: var(--spacer_10) 0 var(--spacer_16) 0;
}
/* Description Secondaire */
.simple-subheader-description {
font-weight: 500;
line-height: 1.5;
color: #6C6C68;
margin-bottom: 0;
padding-bottom: 0;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.simple-subheader-description p {
margin-bottom: 0;
}
/* Conteneur Formulaire */
.simple-header-form-wrapper {
width: 100%;
max-width: 480px;
margin: 0 auto;
margin-top: -10px;
padding-top: 0;
}
.simple-header-form-wrapper form.hs-form {
margin-top: 0;
padding-top: 0;
}
/* Ajustements Tablettes/Desktop (pour la partie visuelle du formulaire) */
@media (min-width: 768px) {
.simple-header-title {
font-size: 48px;
}
.simple-subheader-title {
font-size: 32px;
}
.simple-header-description {
font-size: 18px;
}
}
/* ratings */
.ratings__title {
color: var(--text_dark);
font-size: 20px;
font-weight: var(--font_weight_700);
margin-bottom: 24px;
text-align: center;
}
.ratings__list {
display: flex;
flex-wrap: wrap;
gap: var(--spacer_16) var(--spacer_60);
align-items: center;
justify-content: center;
}
.ratings__list-item {
display: flex;
align-items: center;
justify-content: center;
width: fit-content;
gap: var(--spacer_8);
}
.ratings__list-item-logo {
max-width: 3.2rem;
object-fit: contain;
}
.ratings__stars-container {
position: relative;
height: 2.1rem;
width: fit-content;
margin: 0 auto;
}
.ratings__stars--filled {
position: absolute;
z-index: 1;
top: 0;
left: 0;
}
.ratings__stars--filled path {
clip-path: inset(0 100% 0 0);
transition: clip-path 1s;
}
/* success-story */
.ss {
display: flex;
gap: 10rem;
}
.ss__left {
max-width: 38rem;
flex-shrink: 0;
display: flex;
flex-direction: column;
gap: var(--spacer_40);
}
.ss__author-container {
background: #f0f0ec;
border-radius: 24px;
display: flex;
flex-direction: column;
gap: var(--spacer_16);
padding: var(--spacer_28);
}
.ss__author-infos,
.ss__testimonial-infos {
align-items: center;
display: flex;
gap: 16px;
}
.ss__author-avatar,
.ss__testimonial-avatar {
border-radius: 12px;
flex-shrink: 0;
height: 48px;
object-fit: cover;
width: 48px;
}
.ss__author-infos-inner,
.ss__testimonial-infos-inner {
display: flex;
flex-direction: column;
gap: 4px;
}
.ss__author-infos-name,
.ss__author-infos-job {
color: #080b0c;
font-size: 14px;
line-height: 1.2;
margin-bottom: 0;
}
.ss__author-infos-job {
font-weight: var(--font_weight_600);
color: var(--primary_color);
}
.ss__author-description *:last-child {
margin-bottom: 0;
}
.ss__key-number {
color: var(--primary_color);
font-family: Raleway, sans-serif;
font-size: 112px;
font-weight: 200;
letter-spacing: -2.24px;
line-height: 1;
display: block;
}
.ss__key-number-caption {
color: var(--black_color);
font-family: Raleway, sans-serif;
font-size: 32px;
font-weight: var(--font_weight_800);
line-height: 1.1;
display: block;
}
.ss__key-number-subtext {
color: #6c6c68;
font-size: 20px;
line-height: 1.4;
}
.ss__right {
width: 100%;
}
.ss__testimonial-container {
margin-bottom: var(--spacer_40);
}
.ss__testimonial-svg {
display: block;
margin-left: auto;
margin-bottom: var(--spacer_12);
}
.ss__testimonial {
color: #6c6c68;
font-size: 32px;
line-height: 1.4;
margin-bottom: var(--spacer_12);
}
.ss__testimonial-infos-name {
color: #6c6c68;
margin-bottom: 0;
line-height: 1.05;
}
.ss__testimonial-infos-job {
color: #6c6c68;
font-weight: var(--font_weight_700);
margin-bottom: 0;
line-height: 1.05;
}
.ss__body,
.ss__body * {
color: var(--text_grey);
}
.ss__body *:last-child {
margin-bottom: 0;
}
.ss__buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
align-items: center;
margin-top: var(--spacer_40);
}
.ss__button-link--picto {
display: flex;
align-items: center;
width: fit-content;
gap: 8px;
}
.ss__button-link--picto:before {
content: "";
display: block;
aspect-ratio: 1;
width: 18.39px;
background-size: cover;
background-image: url('data:image/svg+xml,');
transition: background-image 0.3s ease;
}
.ss__button-link--picto:hover:before {
background-image: url('data:image/svg+xml,');
}
@media (max-width: 1024px) {
.ss {
flex-direction: column;
gap: var(--spacer_40);
}
.ss__left {
max-width: unset;
width: 100%;
}
.ss__key-number-inner {
display: flex;
align-items: center;
flex-direction: column;
}
.ss__key-number-caption {
text-align: center;
}
}
@media (max-width: 767px) {
.ss__left {
gap: var(--spacer_24);
}
.ss__author-container {
position: relative;
}
.ss__author-container::before {
content: "";
position: absolute;
width: 100vw;
height: 100%;
top: 0;
left: calc(var(--spacer_22) * -1);
background-color: #f0f0ec;
z-index: -1;
}
.ss__testimonial {
font-size: 20px;
}
.ss__buttons {
justify-content: center;
}
}
/* testimonial-n-image */
.testimonial-n-image {
display: flex;
gap: var(--spacer_60);
align-items: flex-end;
}
.testimonial-n-image--reverse {
flex-direction: row-reverse;
}
.testimonial-n-image__content-logo-container {
align-items: start;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.testimonial-n-image__content-logo {
height: 4rem;
width: auto;
}
.testimonial-n-image__content-svg {
height: 3.2rem;
width: 4.5rem;
margin-left: auto;
}
.testimonial-n-image__content-testimonial {
color: #707070;
font-size: 20px;
line-height: 1.4;
}
.testimonial-n-image__content-author {
display: flex;
gap: var(--spacer_12);
align-items: center;
}
.testimonial-n-image__content-author-avatar {
width: 4.8rem;
height: 4.8rem;
object-fit: cover;
border-radius: 12px;
}
.testimonial-n-image__content-author-name,
.testimonial-n-image__content-author-job {
margin-bottom: 0;
}
.testimonial-n-image__content-author-job {
font-weight: var(--font_weight_700);
}
.testimonial-n-image__content-stat-container {
margin-bottom: 0;
display: flex;
gap: var(--spacer_16);
align-items: flex-end;
}
.testimonial-n-image__content-stat {
color: #6c6c68;
font-family: Raleway, sans-serif;
font-size: 72px;
font-weight: 200;
line-height: 1;
flex-shrink: 0;
}
.testimonial-n-image__content-stat-caption {
font-weight: 700;
color: #6c6c68;
max-width: 33rem;
display: block;
}
.testimonial-n-image__buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
justify-content: flex-end;
align-items: center;
margin-top: var(--spacer_28);
}
.testimonial-n-image__image-container {
min-width: 25rem;
max-width: 52.4rem;
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 40%;
flex-shrink: 0;
aspect-ratio: 524 / 425;
}
.testimonial-n-image__image {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 28px;
}
.testimonial-n-image__searchbar {
border-radius: 172px;
background: rgba(255, 255, 255, 0.70);
backdrop-filter: blur(58px);
padding: var(--spacer_12) var(--spacer_12) var(--spacer_12) var(--spacer_26);
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
width: fit-content;
z-index: 2;
}
.testimonial-n-image__searchbar-text {
color: var(--black_color);
font-weight: var(--font_weight_500);
margin-bottom: 0;
}
.testimonial-n-image__button-fake {
flex-shrink: 0;
width: 40px;
height: 40px;
background: var(--black_color);
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
@media (max-width: 1024px) {
.testimonial-n-image,
.testimonial-n-image.testimonial-n-image--reverse {
flex-direction: column-reverse;
}
.testimonial-n-image__content-container {
padding: 0 var(--spacer_26);
max-width: 52.4rem;
margin: 0 auto;
}
.testimonial-n-image__image-container {
width: 100%;
margin: 0 auto;
}
.testimonial-n-image__image {
position: static;
}
.testimonial-n-image__searchbar {
position: absolute;
width: 90%;
}
}
@media (max-width: 767px) {
.testimonial-n-image {
background-color: #F0F0EC;
border-radius: 28px;
padding: 10px;
gap: var(--spacer_32);
}
.testimonial-n-image__image-container {
max-width: 100%;
min-width: 100%;
height: auto;
width: 100%;
aspect-ratio: unset;
}
.testimonial-n-image__image {
max-height: 200px;
}
.testimonial-n-image__content-container {
max-width: unset;
padding: 0 var(--spacer_20);
}
.testimonial-n-image__buttons {
justify-content: flex-start;
}
.testimonial-n-image__button {
padding: 0;
position: relative;
transform: translateY(18px);
width: fit-content;
}
.testimonial-n-image__button::before,
.testimonial-n-image__button::after {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.testimonial-n-image__button::before {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png);
left: 0px;
}
.testimonial-n-image__button::after {
background-image: url(https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg);
right: -8px;
}
.testimonial-n-image__button-link {
min-width: 20rem;
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
background-color: var(--white_color);
}
}
/* text-n-form */
.tnf {
display: flex;
gap: 8.6rem;
justify-content: space-between;
align-items: center;
}
.tnf--reverse {
flex-direction: row-reverse;
}
.tnf__content {
width: 100%;
padding: 0 var(--spacer_20);
max-width: 68rem;
}
.tnf__content-title {
color: var(--black_color);
margin-bottom: var(--spacer_32);
}
.tnf__content-subtitle {
color: #29A37A;
font-size: 22px;
font-weight: 600;
line-height: 1.4;
text-decoration: uppercase;
margin-bottom: var(--spacer_32);
}
.tnf__content-list {
display: flex;
flex-direction: column;
gap: var(--spacer_14);
}
.tnf__content-list-item {
display: flex;
gap: var(--spacer_8);
align-items: center;
}
.tnf__content-list-item:before {
content: "";
background-image: url('data:image/svg+xml,');
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
flex-shrink: 0;
}
hs,
.tnf__content-list-item *:not(sup) {
color: var(--text_grey);
font-size: 20px;
line-height: 1.6;
margin-bottom: 0;
}
.tnf__form-container {
width: 52.6rem;
min-width: 52.6rem;
opacity: 0;
animation: formAppear 0.2s linear 1s forwards;
}
@keyframes formAppear {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.tnf__form-inner {
border-radius: 32px;
padding: var(--spacer_42) var(--spacer_80) 0;
}
.tnf__form-inner .form-title {
display: none;
}
.tnf__form-inner form .hs_submit {
display: flex;
margin-top: var(--spacer_50);
}
.tnf__form-inner form .actions {
width: fit-content;
margin: 0 auto;
position: relative;
}
.tnf__form-inner form .actions::before,
.tnf__form-inner form .actions::after {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: calc(100% - 8px);
position: absolute;
bottom: 0;
width: 36px;
z-index: 1;
cursor: pointer;
}
.tnf__form-inner form .actions::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0;
}
.tnf__form-inner form .actions::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize%20website%20%282025%29/rounded%20right.png");
right: 0;
}
.tnf__form-inner form input.hs-button {
align-items: center;
border: 8px solid #fff;
border-radius: 50px;
display: inline-flex;
font-size: 16px;
font-weight: 600;
justify-content: center;
line-height: 1.5;
padding: 12px 28px;
position: relative;
text-decoration: none;
transition: all .3s ease;
z-index: 2;
background-color: #0a0a09;
color: #fff;
cursor: pointer;
transform: translateY(8px);
box-shadow: unset;
}
.tnf__form-inner form.hs-form .hs-form-field {
margin-bottom: var(--spacer_28);
}
.tnf__form-inner form.hs-form .legal-consent-container .hs-dependent-field,
.tnf__form-inner form.hs-form .legal-consent-container .hs-dependent-field .hs-form-field,
.tnf__form-inner form.hs-form .legal-consent-container .hs-dependent-field .hs-form-field .hs-form-booleancheckbox {
margin-bottom: 0;
}
.tnf__form-inner form .hs-form-field label {
color: var(--black_color);
margin-bottom: var(--spacer_8);
padding-left: 0;
text-transform: none;
}
.tnf__form-inner form .hs-form-field .input input,
.tnf__form-inner form .hs-form-field .input select {
border-radius: 6px;
border: 1px solid #D1D1CB;
background: #FFF;
box-shadow: unset;
}
.tnf__form-inner .legal-consent-container label,
.tnf__form-inner .legal-consent-container,
.tnf__form-inner .legal-consent-container p{
line-height: 140%;
color: var(--black_color);
font-size: 10px;
}
.tnf__form-inner form .legal-consent-container .hs-form-field .input input {
border: unset;
border: unset;
display: block;
width: 16px;
height: 16px;
opacity: 1;
border-radius: 2px;
margin-right: var(--spacer_8);
}
.tnf__form-inner form .legal-consent-container .hs-form-field .mdl-checkbox__focus-helper,
.tnf__form-inner form .legal-consent-container .hs-form-field .mdl-checkbox__box-outline,
.tnf__form-inner form .legal-consent-container .hs-form-field .mdl-checkbox__ripple-container {
position: absolute;
margin-left: 0;
margin-top: 5px;
top: 0;
left: 0;
}
.tnf__form-inner form .legal-consent-container .hs-form-field .mdl-checkbox__box-outline .mdl-checkbox__tick-outline {
width: 100%;
height: 100%;
display: block;
}
.tnf__form-inner .legal-consent-container .hs-form-booleancheckbox-display > span:not(.mdl-checkbox__label) {
margin-left: 0;
}
.tnf__form-inner .legal-consent-container .hs-form-booleancheckbox-display > .mdl-checkbox__label {
margin-left: var(--spacer_24);
font-size: 10px;
}
.tnf__form-inner .legal-consent-container label span,
.tnf__form-inner .legal-consent-container label span * {
font-size: 10px;
line-height: 1.4;
}
.tnf__form-inner .legal-consent-container .hs-richtext {
font-size: 10px;
line-height: 1.4;
margin-top: var(--spacer_20);
}
.tnf__form-inner .legal-consent-container .mdl-checkbox__focus-helper {
background-color: #FFF;
border: unset;
outline: unset;
box-shadow: unset;
border-radius: 2px;
}
.tnf__form-inner .legal-consent-container .mdl-checkbox__box-outline {
outline: unset;
box-shadow: unset;
border: 2px solid #FFF;
}
.tnf__form-reassurance {
margin-top: var(--spacer_4);
}
.tnf__form-reassurance,
.tnf__form-reassurance * {
color: var(--text_grey);
text-align: center;
font-size: 12px;
font-weight: 600;
line-height: 1;
position: relative;
z-index: 2;
}
@media (max-width: 1024px) {
.tnf {
flex-direction: column;
gap: 32px;
}
.tnf__form-inner {
padding: var(--spacer_40) var(--spacer_40) 0;
}
.tnf__content {
padding: 0;
}
.tnf__form-container {
max-width: 52.6rem;
width: 100%;
min-width: unset;
}
}
@media (max-width: 800px) {
.tnf__content-title {
font-size: 28px;
}
.tnf__content-subtitle {
font-size: 18px;
font-weight: 500;
}
.tnf__form-inner {
padding: var(--spacer_40) var(--spacer_20) 0
}
.tnf__content-list-item,
.tnf__content-list-item * {
font-size: 18px;
line-height: 1.4;
}
.tnf__form-inner form .hs_submit {
display: flex;
margin-top: var(--spacer_38);
}
}
/* text-n-media */
.tnm--card {
padding: var(--spacer_12);
border-radius: 32px;
}
.tnm__container {
margin: 0 auto;
padding: 0;
}
.tnm__inner {
display: grid;
gap: var(--content-gap);
align-items: center;
}
/* Image position variations */
.tnm__inner.image-left {
grid-template-columns: 1fr 1fr;
}
.tnm__inner.image-right {
grid-template-columns: 1fr 1fr;
}
.tnm__inner.image-right .tnm__image-wrapper {
order: 2;
}
.tnm__inner.image-right .tnm__content {
order: 1;
}
/* Split ratio variations */
.tnm__inner.split-50-50 {
grid-template-columns: 1fr 1fr;
}
.tnm__inner.split-40-60 {
grid-template-columns: 40fr 60fr;
}
.tnm__inner.split-60-40 {
grid-template-columns: 60fr 40fr;
}
/* Image */
.tnm__image {
border-radius: 24px;
overflow: hidden;
}
.tnm__image img {
width: 100%;
height: auto;
display: block;
}
/* Video */
.tnm__video {
border-radius: 24px;
overflow: hidden;
}
.tnm__video-player {
width: 100%;
height: auto;
display: block;
border-radius: 24px;
}
/* Mobile/Desktop Media Visibility */
.tnm__media-mobile {
display: none;
}
@media (max-width: 440px) {
.tnm__media-desktop:not(.tnm__media-desktop--no-mobile) {
display: none;
}
.tnm__media-mobile {
display: block;
}
}
/* Content */
.tnm__content {
display: flex;
flex-direction: column;
gap: 16px;
height: 100%;
padding: 40px 20px;
max-width: var(--content-max);
margin: 0 auto;
justify-content: center;
}
.tnm__title {
margin-bottom: 0;
}
.tnm__title--shorter {
font-size: 32px;
font-weight: 800;
}
.tnm__body {
color: #9B9B97;
line-height: 1.4;
}
.tnm__body p:last-child {
margin-bottom: 0;
}
/* Buttons */
.tnm__buttons {
display: flex;
gap: var(--spacer_16);
flex-wrap: wrap;
margin-top: var(--spacer_12);
}
.tnm__tag {
margin-bottom: 0;
color: var(--text_grey);
line-height: 1;
text-transform: uppercase;
}
.tnm:not(.tnm--card) .tnm__tag {
padding: var(--spacer_8) var(--spacer_16);
border-radius: 12px;
background: #F0F0EC;
width: fit-content;
}
.tnm__content {
gap: var(--spacer_8);
}
.tnm__price-container {
margin-bottom: 0;
line-height: 1;
}
.tnm__price {
color: #0a0a09;
font-size: 40px;
font-weight: 600;
font-family: "Raleway";
}
.tnm__price-suffix {
color: #9b9b97;
font-size: 20px;
font-weight: var(--font_weight_700);
}
.tnm__list {
display: flex;
flex-wrap: wrap;
gap: var(--spacer_12) var(--spacer_20);
margin-bottom: var(--spacer_12);
}
.tnm__list-item {
width: calc(50% - var(--spacer_20) /2);
display: flex;
gap: var(--spacer_12);
}
.tnm__list-item-text {
color: #176251;
font-family: Raleway, sans-serif;
font-weight: var(--font_weight_700);
margin-bottom: 0;
}
/* Tablet */
@media (max-width: 991px) {
.tnm__inner {
gap: 40px;
}
}
/* Mobile */
@media (max-width: 768px) {
.tnm--card:has(.tnm--out-in-mobile) {
position: relative;
}
.tnm__container:has(.tnm--out-in-mobile) {
margin-bottom: var(--spacer_20);
}
.tnm__module {
padding-bottom: var(--spacer_40);
}
.tnm__inner,
.tnm__inner.image-left,
.tnm__inner.image-right,
.tnm__inner.split-50-50,
.tnm__inner.split-40-60,
.tnm__inner.split-60-40 {
grid-template-columns: 1fr;
gap: 12px;
}
.tnm__inner.image-right .tnm__image-wrapper,
.tnm__inner.image-right .tnm__content {
order: unset;
}
.tnm__content {
gap: 16px;
padding: 0 22px 0;
align-items: start;
max-width: unset;
padding: 0 var(--spacer_28);
}
.tnm__title {
font-size: 36px;
}
.tnm__body {
font-size: 16px;
}
.tnm__buttons {
flex-direction: column;
width: auto;
}
.tnm__buttons.tnm--out-in-mobile {
position: absolute;
bottom: 0;
}
.tnm--out-in-mobile .tnm__button {
position: absolute;
bottom: -8px;
width: max-content;
}
.tnm--out-in-mobile .tnm__button::after,
.tnm--out-in-mobile .tnm__button::before {
background-repeat: no-repeat;
background-size: contain;
content: "";
display: inline-block;
height: 50px;
position: absolute;
top: 0.3px;
width: 36px;
z-index: 0;
}
.tnm--out-in-mobile .tnm__button::before {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/iadvize25/large-callout-left-corner@2x.png");
left: 0px;
}
.tnm--out-in-mobile .tnm__button::after {
background-image: url("https://403167.fs1.hubspotusercontent-na1.net/hubfs/403167/cta-right-corner.svg");
right: -8px;
}
.tnm--out-in-mobile .tnm__button-link {
border: 8px solid rgb(255, 255, 255);
z-index: 1;
position: relative;
}
.tnm__btn {
width: auto;
justify-content: center;
padding: 12px 20px;
font-size: 14px;
}
}
@media (max-width: 500px) {
.tnm__list.semantic-list {
flex-direction: column;
}
.tnm__list-item {
width: 100%;
}
}
/* text-n-numbers */
.tnn__container {
display: flex;
gap: var(--spacer_20);
}
.tnn--cnt {
flex-direction: row-reverse;
}
.tnn__content-title--mobile {
display: none;
}
.tnn__content {
display: flex;
align-items: center;
justify-content: center;
width: calc(100% / 2 - 20px / 2);
}
.tnn__content-inner {
max-width: 42.8rem;
}
.tnn__content-title {
color: var(--black_color);
font-size: 40px;
font-weight: 600;
line-height: 1.1;
}
.tnn__card {
position: relative;
width: calc(100% / 2 - 20px / 2);
border-radius: 28px;
padding: 28px 52px;
overflow: hidden;
}
.tnn__card-container,
.tnn__card_list {
display: flex;
flex-direction: column;
gap: 20px;
}
.tnn__card_list-item {
margin-bottom: 0;
}
.tnn__card_list-item-number {
color: #3BE1A4;
font-family: Raleway;
font-size: 64px;
font-weight: 500;
line-height: 1.1;
margin-bottom: 8px;
}
.tnn__card_list-item-text {
color: var(--black_color);
font-family: Raleway;
font-size: 24px;
font-weight: var(--font_weight_500);
line-height: 1.1;
margin-bottom: 0;
}
.tnn__card-image {
position: absolute;
right: 0;
bottom: 0;
height: 100%;
width: auto;
max-width: calc(100% - var(--img_max_width));
object-position: 0 50%;
object-fit: cover;
}
@media (max-width: 1024px) {
.tnn--tnc-mobile {
flex-direction: column;
}
.tnn--cnt-mobile {
flex-direction: column-reverse;
}
.tnn__content-title--mobile {
display: block;
font-family: Raleway;
color: var(--black_color);
font-size: 40px;
font-weight: var(--font_weight_600);
line-height: 1.1;
margin-bottom: var(--spacer_32);
}
.tnn__content-title--hide-mobile {
display: none;
}
.tnn__content {
padding: 0 var(--spacer_20);
width: 100%;
}
.tnn__card {
width: 100%;
}
}
@media (max-width: 700px) {
.tnn__card-image {
display: none;
}
.tnn__card_list {
margin-bottom: var(--spacer_12);
}
.tnn__card_list-item-number {
text-align: center;
}
.tnn__card_list-item-text {
text-align: center;
}
.tnn__content-title--mobile,
.tnn__content-title {
font-size: 28px;
}
}
/* text-n-parallax */
.dnd-section:has(.tnp) {
position: relative;
overflow: hidden;
}
.tnp__inner {
max-width: 80.8rem;
margin: 0 auto;
}
.tnp__title {
color: var(--black_color);
text-align: center;
font-size: 40px;
font-weight: var(--font_weight_600);
line-height: 1.1;
margin-bottom: var(--spacer_32);
}
.tnp__container--2,
.tnp--spliter .tnp__column-content {
display: flex;
gap: var(--spacer_40);
}
.tnp__container--2 .tnp__column,
.tnp__split-col {
width: calc(100% / 2 - 32px / 2);
}
.tnp__column-content,
.tnp__column-content * {
color: var(--text_dark);
}
.tnp__column-content *:last-child {
margin-bottom: 0;
}
.tnp__image {
position: absolute;
max-width: calc((100vw - 808px) / 2 - 20px);
z-index: -1;
object-fit: contain;
max-height: 50%;
}
.tnp__image--top-left {
top: 50px;
left: 0;
object-position: left;
}
.tnp__image--top-right {
top: 50px;
right: 0;
object-position: right;
}
.tnp__image--bottom-left {
bottom: 50px;
left: 0;
object-position: left;
}
.tnp__image--bottom-right {
bottom: 50px;
right: 0;
object-position: right;
}
.tnp__image--left {
transform: translateX(-100%);
transition: transform 0.6s ease-out;
}
.tnp__image--right {
transform: translateX(100%);
transition: transform 0.6s ease-out;
}
.tnp.animate .tnp__image--left,
.tnp.animate .tnp__image--right {
transform: translateX(0);
}
@media (max-width: 1200px) {
.tnp__image {
max-height: 230px;
max-width: unset;
object-fit: contain;
object-position: 0% 50%;
}
.tnp__image--right {
object-position: 100% 50%;
}
}
@media (max-width: 800px) {
.tnp__container {
padding: 0 var(--spacer_20);
}
.tnp__container--2 {
flex-direction: column;
}
.tnp--spliter .tnp__column-content {
display: block;
}
.tnp__container--2 .tnp__column,
.tnp__split-col {
width: 100%;
}
}
/* video-cards */
.vc {
padding: var(--spacer_52) var(--spacer_20);
background-color: #F0F0EC;
border-radius: 32px;
}
.vc__content-container {
max-width: 68.6rem;
margin: 0 auto;
padding-bottom: var(--spacer_52);
}
.vc__tag {
color: var(--text_dark);
background-color: #D1D1CB;
display: block;
width: fit-content;
margin: 0 auto var(--spacer_20);
}
.vc__title,
.vc__subtitle,
.vc__subtitle * {
text-align: center;
}
.vc__subtitle *:last-child {
margin-bottom: 0;
}
.vc__buttons {
margin-top: var(--spacer_32);
display: flex;
gap: var(--spacer_16);
justify-content: center;
}
.vc__video-wrapper,
.vc__image-wrapper {
max-width: 110rem;
margin: 0 auto;
}
.vc__video-wrapper video {
width: 100%;
aspect-ratio: 16/9;
border-radius: 20px;
}
.vc__media-mobile {
display: none;
}
@media (max-width: 1024px) {
.vc
}
@media (max-width: 440px) {
.vc__media:has(.vc__media-mobile) .vc__media-desktop {
display: none;
}
.vc__media-mobile {
display: block;
}
}
form,
.submitted-message {
font-family: var(--primary_font);
font-size: var(--body_font_font_size);
}
/* Form title */
.form-title {
color: var(--form_title_font_color);
}
/* Labels */
form label {
display: block;
font-size: var(--body_font_font_size);
color: var(--form_label_font_color);
margin-bottom: var(--spacer_8);
font-weight: var(--font_weight_600);
}
/* Help text */
form legend {
font-size: var(--font_size_12);
color: var(--form_help_text_font_color);
}
/* Fields */
form fieldset {
max-width: unset!important;
}
.hs-form-field {
margin-bottom: var(--spacer_16);
}
@media (max-width: 720px) {
.form-columns-2,
.form-columns-3,
.form-columns-4 {
flex-flow: wrap;
}
.form-columns-2 .hs-form-field,
.form-columns-3 .hs-form-field {
width: 100%!important;
}
.form-columns-2 .hs-form-field .input,
.form-columns-3 .hs-form-field .input {
margin-right: unset;
}
}
.form-columns-1 .hs-input:not(input[type=checkbox]) {
width: 100% !important;
}
.form-columns-2,
.form-columns-3,
.form-columns-4 {
display: flex;
gap: var(--spacer_8);
}
.form-columns-1 .input,
.form-columns-2 .input,
.form-columns-3 .input,
.form-columns-4 .input {
margin-right: 0!important;
}
@media (max-width: 400px), (min-device-width: 320px) and (max-device-width: 480px) {
form .form-columns-2 .hs-form-field .hs-input,
form .form-columns-3 .hs-form-field .hs-input {
width: 100%!important;
}
}
/* Inputs */
form input[type="text"],
form input[type="email"],
form input[type="password"],
form input[type="tel"],
form input[type="number"],
form input[type="file"],
form input[type="search"],
form input[type="checkbox"],
form select,
form textarea {
appearance: none;
border: 0;
display: inline-block;
font-size: var(--body_font_font_size);
font-family: var(--button_font_family);
color: var(--form_field_font_color);
padding: var(--spacer_16) var(--spacer_20);
width: 100%;
background-color: var(--form_field_bg_color);
box-shadow: inset 0 0 0 var(--form_field_border_width) var(--form_field_border_color);
border-radius: var(--form_field_corner_radius);
}
form input[type="file"] {
color: var(--white_color);
}
form input[type="text"],
form input[type="email"],
form input[type="password"],
form input[type="tel"],
form input[type="number"],
form input[type="file"],
form input[type="search"],
form select {
min-height: 3.2rem;
}
form input[type="checkbox"] {
height: 2rem !important;
max-height: 2rem;
padding: 0;
width: 2rem !important;
max-width: 2rem;
flex-shrink: 0;
}
form textarea {
resize: vertical;
}
::placeholder {
color: var(--form_field_placeholder_color);
}
/* Inputs - checkbox/radio */
form .inputs-list {
margin: 0;
padding: 0;
list-style: none;
}
form .inputs-list > li {
display: block;
margin: var(--spacer_8) 0;
}
form .inputs-list input,
form .inputs-list span {
vertical-align: middle;
}
form input[type="checkbox"],
form input[type="radio"] {
cursor: pointer;
margin-right: var(--spacer_4);
accent-color: var(--primary_color);
}
form input[type="checkbox"]:checked:before {
content: "\2713";
font-size: 16px;
color: var(--primary_color);
text-align: center;
font-weight: bold;
height: 100%;
width: 100%;
justify-content: center;
align-items: center;
display: flex
;
}
/* Inputs - date picker */
.hs-dateinput {
position: relative;
}
.hs-dateinput::before {
content:'\01F4C5';
position: absolute;
right: 10%;
top: 50%;
transform: translateY(-50%);
}
.fn-date-picker .pika-table thead th {
color: #FFF;
}
.fn-date-picker td.is-selected .pika-button {
border-radius: 0;
box-shadow: none;
}
.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
border-radius: 0 !important;
color: #FFF;
}
.hs-fieldtype-date .input .hs-dateinput:before {
color: var(--form_field_placeholder_color);
}
.fn-date-picker td.is-selected .pika-button {
background-color: var(--primary_color);
}
.fn-date-picker td .pika-button:hover {
background-color: var(--primary_color);
}
.fn-date-picker td.is-today .pika-button {
color: var(--primary_color);
}
/* Inputs - file picker */
form input[type="file"] {
background-color: transparent;
border: initial;
padding: initial;
}
/* GDPR */
.hs-form-booleancheckbox-display {
display: flex;
align-items: center;
}
form .legal-consent-container .hs-form-booleancheckbox-display > span,
form .legal-consent-container .hs-form-booleancheckbox-display > span p,
form .legal-consent-container .hs-form-booleancheckbox-display > div {
margin-left: var(--spacer_8);
}
/* Validation */
.hs-form-required {
color: inherit;
}
.hs-input.invalid.error {
box-shadow: inset 0 0 0 var(--form_field_border_width) var(--error_color);
}
.hs-error-msg {
color: var(--error_color);
margin-top: var(--spacer_4);
}
/* Button */
form input[type="submit"],
form .hs-button {
box-shadow: inset 0 0 0 var(--button_border_width) var(--button_border_color);
padding: var(--button_spacing);
text-decoration: var(--button_text_decoration);
font-weight: var(--button_font_weight);
font-family: var(--button_font_family);
font-size: var(--button_font_size);
color: var(--button_color);
text-transform: var(--button_text_transform);
background-color: var(--button_bg_color);
border-radius: var(--button_corner_radius);
cursor: pointer;
text-align: center;
white-space: normal;
display: flex;
justify-content: center;
align-items: center;
width: fit-content;
transition: background var(--default_transition), color var(--default_transition), box-shadow var(--default_transition);
border: unset;
margin: 0 auto;
}
form input[type="submit"]:hover,
form input[type="submit"]:focus-within,
form input[type="submit"]:active,
form .hs-button:hover,
form .hs-button:focus-within,
form .hs-button:active {
text-decoration: var(--button_text_decoration);
font-weight: var(--button_font_weight);
font-family: var(--button_font_family);
font-size: var(--button_font_size);
background-color: var(--button_bg_color_active);
box-shadow: inset 0 0 0 var(--button_border_width) var(--button_border_color_active);
}
/* Captcha */
.grecaptcha-badge {
margin: 0 auto;
}
@layer components {
.footer {
background-color: var(--footer_bg_color);
padding-top: 10rem;
padding-bottom: var(--spacer_24);
}
.footer-no-nav {
padding-top: var(--spacer_28);
padding-bottom: var(--spacer_28);
}
.footer__top {
display: flex;
gap: var(--spacer_40);
justify-content: space-between;
}
.footer__left {
display: flex;
gap: var(--spacer_40);
min-width: 320px;
flex-direction: column;
justify-content: space-between;
}
.footer__left-follows-container {
display: flex;
gap: var(--spacer_24);
align-items: center;
}
.footer__left-follows-title {
margin-bottom: 0;
line-height: 1;
color: #3D3D38;
}
.footer__left-follows-list {
display: flex;
gap: var(--spacer_24);
align-items: center;
}
.footer__left-follows-list-item-link {
width: 3.2rem;
height: 3.2rem;
display: flex;
align-items: center;
justify-content: center;
}
.footer__right {
width: 100%;
}
.footer__right-nav {
display: flex;
gap: var(--spacer_40);
justify-content: flex-end;
}
.footer__right-nav-column-title {
color: #3D3D38;
font-size: 20px;
font-weight: 600;
margin-bottom: var(--spacer_8);
font-family: 'Raleway';
}
.footer__right-nav-column-list-item-link {
padding: var(--spacer_10) 0;
display: block;
color: #666666;
font-weight: 400;
transition: color var(--slow_transition);
}
.footer__right-nav-column-list-item-link:hover {
color: #444;
}
.footer__bottom {
display: flex;
justify-content: space-between;
gap: var(--spacer_40);
align-items: center;
margin-top: var(--spacer_64);
}
.footer__bottom-rights {
margin-bottom: 0;
font-size: 10px;
color: #3D3D38;
}
.footer__bottom-legals-language {
display: flex;
gap: var(--spacer_20);
}
.footer__bottom-legals-nav-list {
display: flex;
gap: var(--spacer_20);
}
.footer__bottom-legals-nav-list-item {
font-size: 10px;
font-weight: 400;
color: #3D3D38;
}
.footer__bottom-legals-nav-list-item:hover {
text-decoration: underline;
}
.footer__language-switcher-label {
margin-bottom: 0;
font-size: 10px;
color: #3D3D38;
}
.footer__language-switcher {
display: flex;
gap: var(--spacer_4);
}
.footer__language-switcher-link--fake {
color: #3D3D38;
font-size: 10px;
font-weight: 600;
}
.footer__language-switcher-link {
font-size: 10px;
font-weight: 400;
color: #3D3D38;
}
.footer__language-switcher-link:hover {
text-decoration: underline;
}
@media (max-width: 1024px) {
.footer__top {
flex-direction: column-reverse;
justify-content: center;
align-items: center;
}
.footer__left {
max-width: unset;
align-items: center;
}
.footer__right-nav {
justify-content: space-around;
}
.footer__bottom {
display: block;
}
.footer__bottom-legals-language {
justify-content: flex-end;
}
.footer__bottom-rights {
margin-bottom: var(--spacer_12);
}
}
@media (max-width: 776px) {
.footer__bottom-legals-language {
flex-direction: column;
gap: var(--spacer_12);
align-items: flex-end;
}
}
@media (max-width: 500px) {
.footer__right-nav {
flex-direction: column;
padding: 0 var(--spacer_32);
}
.footer {
padding-top: 6rem;
}
.footer__left {
width: 100%;
min-width: unset;
max-width: 320px;
}
.footer__bottom-legals-nav-list {
flex-direction: column;
align-items: center;
}
.footer__bottom-legals-language {
align-items: center;
}
.footer__bottom {
display: flex;
flex-direction: column-reverse;
}
}
/* Header DND sections */
.menu--open {
overflow: hidden;
}
.header {
background-color: var(--white_color);
position: fixed;
z-index: 15;
top: 0;
width: 100vw;
transition: backdrop-filter var(--slow_transition), background var(--slow_transition);
}
.scrolled .header {
backdrop-filter: blur(4px);
background: hsla(0, 0%, 100%, .88);
}
/* Navigation skipper */
.header__skip {
height: 1px;
left: -1000px;
overflow: hidden;
position: absolute;
text-align: left;
top: -1000px;
width: 1px;
}
.header__skip:hover,
.header__skip:focus,
.header__skip:active {
height: auto;
left: 0;
overflow: visible;
top: 0;
width: auto;
}
.header__banner-top {
background-color: var(--primary_color);
align-items: center;
display: flex;
gap: var(--spacer_16);
justify-content: center;
width: 100%;
padding: var(--spacer_6) var(--spacer_28);
}
.header__banner-top-content {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.header__banner-top-content,
.header__banner-top-content * {
color: #002626;
}
.header__banner-top-content *:last-child {
margin-bottom: 0;
}
.header__banner-top-link {
white-space: nowrap;
}
@media (max-width: 767px) {
.header__banner-top {
padding: var(--spacer_8) var(--spacer_22);
}
.header__banner-top-content,
.header__banner-top-content * {
font-size: 13px;
}
}
.header__container {
display: flex;
position: relative;
top: 0;
margin: 0 auto;
max-width: 1976px;
padding: var(--spacer_16) var(--spacer_28);
justify-content: space-between;
align-items: center;
}
.header__logo {
width: 12.2rem;
height: 100%;
object-fit: contain;
flex-shrink: 0;
}
/* Logo */
.header__logo {
align-items: center;
display: flex;
height: auto;
margin-right: auto;
max-width: 234px;
height: 40px;
overflow: hidden;
}
.header__logo img {
max-width: 100%;
}
.header__logo .logo-company-name {
font-size: var(--body_font_font_size);
margin-top: var(--spacer_8);
}
.header__menu-opener-container {
display: none;
}
.header__menus {
width: 100%;
justify-content: space-between;
margin-left: 88px;
display: flex;
}
.header__nav-list {
display: flex;
gap: var(--spacer_32);
align-items: center;
height: 100%;
}
.header__nav-list-item {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.header__nav-list-item-link {
background-color: transparent;
border-radius: 8px;
font-weight: 700;
line-height: 1.2;
padding: var(--spacer_4) var(--spacer_16);
font-size: 16px;
display: flex;
align-items: center;
gap: var(--spacer_8);
box-shadow: unset;
color: var(--text_dark);
}
.header__nav-list-item-link:hover,
.header__nav-list-item-link:focus-within{
background-color: #F0F0EC;
color: var(--button_color);
box-shadow: unset;
font-weight: var(--font_weight_700);
}
.header__nav-list-item-sublist {
max-height: 0;
transition: max-height var(--slow_transition);
overflow: hidden;
position: absolute;
top: calc(100% + var(--spacer_24));
left: 0;
background-color: var(--white_color);
border-radius: 8px;
width: max-content;
}
.scrolled .header__nav-list-item-sublist {
backdrop-filter: blur(4px);
background: hsla(0, 0%, 100%, 1);
}
.header__nav-list-item-sublist-item {
padding: var(--spacer_8) var(--spacer_4);
}
.header__nav-list-item-sublist-item-link {
padding: var(--spacer_16) var(--spacer_8);
}
@media (hover: hover) and (min-width: 1201px) {
.header__nav-list-item:has(.header__nav-list-item-link-w-submenu):hover .header__nav-list-item-sublist {
max-height: 100vh;
}
}
.header__nav-list-item-link--open ~ .header__nav-list-item-sublist {
max-height: 100vh;
}
.header__ctas {
display: flex;
gap: var(--spacer_12);
align-items: center;
}
.header__cta-link {
padding: var(--spacer_8) var(--spacer_16);
}
@media (max-width: 1200px) {
.menu--open.scrolled .header {
background: hsla(0, 0%, 100%, .98);
}
.header__container {
padding: var(--spacer_16) var(--spacer_20);
}
.header__menu-opener-container {
display: block;
}
.header__menu-opener.reset-button-style {
height: 28px;
width: 28px;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 5px 0;
}
.header__menu-opener-point {
width: 100%;
height: 3px;
background-color: #666;
border-radius: 18px;
transition: rotate var(--slow_transition), transform var(--slow_transition), opacity var(--slow_transition);
}
.menu--open #header__menu-opener--1 {
rotate: 45deg;
transform: translateY(3px) translateX(5px);
}
.menu--open #header__menu-opener--2 {
opacity: 0;
}
.menu--open #header__menu-opener--3 {
rotate: -45deg;
transform: translateY(-6px) translateX(8px);
}
.header__menus {
position: absolute;
top: 100%;
left: 0;
margin-left: 0;
flex-direction: column;
overflow: hidden;
max-height: 0;
height: calc(100vh - var(--header-height));
transition: max-height var(--slow_transition), backdrop-filter var(--slow_transition), background var(--slow_transition);
background-color: var(--white_color);
}
.menu--open .header__menus {
max-height: 100vh;
}
.scrolled .header__menus {
backdrop-filter: blur(4px);
background: hsla(0, 0%, 100%, .98);
}
.header__nav-list {
flex-direction: column;
align-items: flex-start;
padding: var(--spacer_64) var(--spacer_24) var(--spacer_48);
}
.header__nav-list-item-sublist {
position: static;
padding: 0;
}
.scrolled .header__nav-list-item-sublist {
backdrop-filter: unset;
background: transparent;
}
.header__nav-list-item {
flex-direction: column;
align-items: flex-start;
}
.header__nav-list-item-link:hover {
background-color: transparent;
padding: var(--spacer_4) var(--spacer_16);
font-weight: var(--font_weight_700);
line-height: 1.2;
}
.header__nav-list-item-sublist-item-link {
font-weight: var(--font_weight_400);
color: #6C6C68;
}
.header__ctas {
flex-direction: column;
background-color: #f0f0ec;
border-radius: 16px;
padding: var(--spacer_20);
margin: 0 var(--spacer_20) var(--spacer_48);
}
.header__cta {
width: 100%;
}
.header__cta-link {
width: 100%;
}
}
/* Menu and simple menu */
.hs-menu-wrapper ul {
display: flex;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding-left: 0;
}
/* Horizontal menu */
.hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper {
flex-direction: column;
}
@media (max-width: 767px) {
.hs-menu-wrapper.hs-menu-flow-horizontal ul {
flex-direction: column;
}
}
/* Vertical menu */
.hs-menu-wrapper.hs-menu-flow-vertical ul {
flex-direction: column;
}
/* Flyouts */
.hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
display: inline-flex;
}
@media (max-width: 767px) {
.hs-menu-wrapper.hs-menu-flow-vertical ul {
display: flex;
}
}
.hs-menu-wrapper.flyouts .hs-item-has-children {
position: relative;
}
.hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
left: -9999px;
opacity: 0;
position: absolute;
}
.hs-menu-wrapper.flyouts .hs-menu-children-wrapper a {
display: block;
white-space: nowrap;
}
.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
left: 0;
opacity: 1;
top: 100%;
}
.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
left: 100%;
opacity: 1;
top: 0;
}
@media (max-width: 767px) {
.hs-menu-wrapper.flyouts .hs-menu-children-wrapper,
.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper,
.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
left: 0;
opacity: 1;
position: relative;
top: auto;
}
}
/* CTA, logo, and rich text images */
.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
height: auto;
max-width: 100%;
}
/* Components */
/* First component */
/* Sections */
/* First section */
}