* {
    margin: 0px;
    padding: 0px;
}

/* design system page template hero */
.ds-page-hero {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0;
    font-family: var(--f-SANS);
}

.ds-page-hero-graphic {
    object-fit: cover;
    background-color: var(--c-OFFWHITE);
}

.ds-page-hero-graphic img {
    max-width: 100%;
    padding: 0;
    margin: 0;
    object-fit: cover;
    height: 100%;
}

.ds-page-hero-content {
    background-color: var(--c-OFFWHITE);
    padding: var( --padding-xxxlarge);
}

.ds-page-hero-content-h2 { text-transform: uppercase; }

.ds-page-hero-content-p {
    color: var(--c-BLACK);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; /* 175% */
    letter-spacing: 0.16px;
    padding: var(--padding-xsmall) 0 var(--padding-xlarge) 0;
}

.ds-1col-2col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: var(--padding-xxxlarge) var(--padding-large);
}

.ds-1col-2col-content { padding-right: var(--padding-large); }

.ds-ul {
    font-family:  var(--f-SANS);
    color: var(--c-BLACK);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    letter-spacing: 0.16px;
    padding-left: var(--padding-medium);
}

.ds-ul__pt20 { padding-top: var(--padding-large); }

.ds-ul li {
    padding-left: 12px;
    padding-bottom: var(--padding-xsmall);
}

.ds-ul li::marker { content: url("data:image/svg+xml,%3Csvg height='8' width='8' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle r='4' cx='4' cy='4' fill='%23007AC9' /%3E%3C/svg%3E"); }

.ds-frame-101 {
    border: 1px solid var(--c-OFFWHITE-DARKER);
    border-radius: var(--radius-medium);
    background: var(--c-WHITE);
    color: var(--c-BLACK);
    font-family: var(--f-SANS);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.16px;
}

.ds-frame-101-head {
    padding: var(--padding-large);
    background-color: var(--c-OFFWHITE);
    border-top-left-radius: var(--radius-medium);
    border-top-right-radius: var(--radius-medium);
}

.ds-h3 {
    font-family: var(--f-SANS);
    font-size: 24px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -0.48px;
    color: var(--c-BLACK);
}

.ds-frame-101-body {
    padding: var(--padding-large);
    display: flex;
    flex-direction: column;
    gap: var(--padding-large);
}

.ds-frame-101-body-card {
    background-color: var(--c-OFFWHITE);
    padding: var(--padding-large);
    border-radius: var(--radius-medium);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--padding-xxlarge);
}

.ds-frame-101-body-card-copy {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.16px;
}

/* design system single column */
.ds-1col { padding: 0 var(--padding-large); }

.ds-1col-2col-3col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: var(--padding-large) var(--padding-large) var(--padding-xxxlarge) var(--padding-large);
}

.ds-1col-2col-3col-content { padding: var(--padding-medium) var(--padding-large) 0 var(--padding-large); }



.ds-frame-101-body-card-copy-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: 1.12px;
    padding-bottom: var(--padding-xsmall);
}
.ds-1col-2col__1-3gxl { padding: var(--padding-xxxlarge) var(--padding-large); }

.fpo-123 {
    background-color: var(--c-OFFWHITE-DARKER);
    width: 100%;
    aspect-ratio: 19/9;  
    border-radius: var(--radius-medium);
    background-size: cover;
}

.ds-1col-2col-full {
    width: 100%;
    background-color: var(--c-OFFWHITE-DARKER);
    height: 400px;
    display: flex;
}

.ds-1col-2col-full > div { width: 100%; }
.ds-1col-2col-full > div:last-child { display: none; }


.ds-1col-2col-full-bgImage img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.ds-zebra-blue {
    color: var(--c-WHITE);
    background-color: var(--c-BRAND);
    padding: var(--padding-xxxmlarge) var(--padding-xxlarge);    
    font-family: var(--f-SANS);
    color: var(--text-color-text-white, #FFF);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0.18px;
}

.hpd2_lr-pad-large { padding: 0 var(--padding-large) !important}

.ds-page-testimonial {
    color: #333;
    color: var(--text-color-text-dark, #333);
    font-family: var(--f-IVY);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    padding: var(--padding-xxxlarge) 0;
}

.ds-page-testimonial-content {
    background-color: #f7f7f7;
    padding: 20px;
    margin-top: var(--padding-small);
}

.ds-page-testimonial-copy::before {
    content: url("data:image/svg+xml,%3Csvg width='40' height='32' viewBox='0 0 40 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.1837 16.4082C15.102 16.4082 17.9592 19.5102 17.9592 23.6735C17.9592 27.6735 15.2653 31.6735 10.0408 31.6735C3.91837 31.6735 0 26.2857 0 19.1837C0 8.81633 7.5102 2.28571 15.3469 0L16.8163 3.67347C11.0204 5.46938 7.10204 10.6122 7.10204 16.4898C7.10204 16.898 7.10204 17.2245 7.18367 17.6327C8.16326 16.898 9.63265 16.4082 11.1837 16.4082ZM33.2245 16.4082C37.1429 16.4082 40 19.5102 40 23.6735C40 27.6735 37.3061 31.6735 32.0816 31.6735C25.9592 31.6735 22.0408 26.2857 22.0408 19.1837C22.0408 8.81633 29.551 2.28571 37.3878 0L38.8571 3.67347C33.0612 5.46938 29.1429 10.6122 29.1429 16.4898C29.1429 16.898 29.1429 17.2245 29.2245 17.6327C30.2041 16.898 31.6735 16.4082 33.2245 16.4082Z' fill='%23007AC9'/%3E%3C/svg%3E%0A");
    padding-bottom: var(--padding-medium);
    display: flex;
    justify-content: center;
}

.ds-page-testimonial-copy::after {
    content: url("data:image/svg+xml,%3Csvg width='40' height='33' viewBox='0 0 40 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.8163 15.9385C24.898 15.9385 22.0408 12.8365 22.0408 8.67321C22.0408 4.67321 24.7347 0.673213 29.9592 0.673213C36.0816 0.673214 40 6.06097 40 13.163C40 23.5304 32.4898 30.061 24.6531 32.3467L23.1837 28.6732C28.9796 26.8773 32.898 21.7344 32.898 15.8569C32.898 15.4487 32.898 15.1222 32.8163 14.714C31.8367 15.4487 30.3673 15.9385 28.8163 15.9385ZM6.77552 15.9385C2.85715 15.9385 1.70564e-06 12.8365 2.0696e-06 8.67321C2.41929e-06 4.67321 2.69388 0.673211 7.91837 0.673211C14.0408 0.673212 17.9592 6.06096 17.9592 13.163C17.9592 23.5304 10.449 30.061 2.61225 32.3467L1.14286 28.6732C6.93878 26.8773 10.8571 21.7344 10.8571 15.8569C10.8571 15.4487 10.8571 15.1222 10.7755 14.714C9.79592 15.4487 8.32654 15.9385 6.77552 15.9385Z' fill='%23007AC9'/%3E%3C/svg%3E%0A");
    padding-top: var(--padding-medium);
    display: flex;
    justify-content: center;
}

.ds-sectionHero {
    background-color:var(--c-OFFWHITE-DARKER);
    height: 100%;
    width: 100% !important;
    border-radius: var(--radius-medium);
    min-height: 410px;
    background-size: cover;
    background-position: center;
}

.ph {
    height: 200px;
    background-color: lightpink;
    width: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dsp__pv8 { 
    padding-top: var(--padding-xsmall);
    padding-bottom: var(--padding-xsmall);
    letter-spacing: 0.16px !important;
}
@media screen and (min-width: 768px) {
    .ds-page-hero-graphic {
        height: 350px;
    }

    .hpd2__wcz {
        max-width: 435px;
        margin: auto !important;
    }

    .dsp__wz {
        max-width: 650px;
        margin: auto;
    }
}

@media screen and (min-width: 1024px) {
    .ds-1col-2col-full > div { width: 50; }

    .ds-1col-2col-full > div:last-child { display: inline-block; }

    .ds-page-hero-graphic {
        height: auto;
    }

      .ds-page-hero {
        flex-direction: row-reverse
    }

    .ds-page-hero-graphic {
        width: 65%;
    }

    .ds-page-hero-content { width: 35%; }

    .ds-1col { padding: 0 var(--padding-xxxlarge); }
    
    .ds-1col-2col {
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        padding: var(--padding-xxxxlarge) var(--padding-xxxlarge);
    }

    .ds-1col-2col > div { width: 50%; }

    .ds-1col-2col-content {  padding: 0 var(--padding-xxxlarge) 0 var(--padding-large); }

    .ds-1col-2col_tb-lr { flex-direction: row; }

    .fpo-pink {  aspect-ratio: 16/9; }

    .ds-1col-2col-content__ra { text-align: right; }

    .ds-1col-2col-content__pl20 {  padding-left: var(--padding-large); }

    .ds-1col-2col-3col {
        flex-direction: row;
        flex-wrap: wrap;
        padding: var(--padding-large) var(--padding-xxxlarge) var(--padding-xxxlarge) var(--padding-xxxlarge);
    }

    .ds-1col-2col-3col > div { width: calc(50% - 10px); }

    .ds-1col-2col__1-3gxl { align-items: start; }

    .ds-page-testimonial { padding: var(--padding-xxxxlarge) 0 }

    .hpd2_lr-pad-large { text-align: center;}

    .ds-page-testimonial-content { padding: 40px 20%; }

    .ds-page-testimonial-copy::before {
        content: url("data:image/svg+xml,%3Csvg width='70' height='55' viewBox='0 0 70 55' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.9 28.565C26.62 28.565 31.52 33.885 31.52 41.025C31.52 47.885 26.9 54.745 17.94 54.745C7.44 54.745 0.72 45.505 0.72 33.325C0.72 15.545 13.6 4.345 27.04 0.424997L29.56 6.72499C19.62 9.80499 12.9 18.625 12.9 28.705C12.9 29.405 12.9 29.965 13.04 30.665C14.72 29.405 17.24 28.565 19.9 28.565ZM57.7 28.565C64.42 28.565 69.32 33.885 69.32 41.025C69.32 47.885 64.7 54.745 55.74 54.745C45.24 54.745 38.52 45.505 38.52 33.325C38.52 15.545 51.4 4.345 64.84 0.424997L67.36 6.72499C57.42 9.80499 50.7 18.625 50.7 28.705C50.7 29.405 50.7 29.965 50.84 30.665C52.52 29.405 55.04 28.565 57.7 28.565Z' fill='%23007AC9'/%3E%3C/svg%3E%0A");
        display: block;
        position: absolute;
        margin-left: -95px;
    }

    .ds-page-testimonial-copy::after {
        content: url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 40 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.8163 15.9385C24.898 15.9385 22.0408 12.8365 22.0408 8.67321C22.0408 4.67321 24.7347 0.673213 29.9592 0.673213C36.0816 0.673214 40 6.06097 40 13.163C40 23.5304 32.4898 30.061 24.6531 32.3467L23.1837 28.6732C28.9796 26.8773 32.898 21.7344 32.898 15.8569C32.898 15.4487 32.898 15.1222 32.8163 14.714C31.8367 15.4487 30.3673 15.9385 28.8163 15.9385ZM6.77552 15.9385C2.85715 15.9385 1.70564e-06 12.8365 2.0696e-06 8.67321C2.41929e-06 4.67321 2.69388 0.673211 7.91837 0.673211C14.0408 0.673212 17.9592 6.06096 17.9592 13.163C17.9592 23.5304 10.449 30.061 2.61225 32.3467L1.14286 28.6732C6.93878 26.8773 10.8571 21.7344 10.8571 15.8569C10.8571 15.4487 10.8571 15.1222 10.7755 14.714C9.79592 15.4487 8.32654 15.9385 6.77552 15.9385Z' fill='%23333333'/%3E%3C/svg%3E%0A");
        display: inline-block;
        margin-top: -8px;
        position: absolute;
        padding: 0;
    }
    .ds-1col-2col__healthCareProducts { padding: var(--padding-xxxlarge) !important; }
}

@media screen and (min-width: 1400px) {
    .ds-1col-2col__1-3gxl > div:first-child {  width: 33%; }

    .ds-1col-2col__1-3gxl > div:last-child {  width: 65%; }

    .ds-1col-2col-3col > div { width: calc(33% - 9px); }

    .ds-1col-2col-full { height: 405px; }

    .ds-page-testimonial { padding: var(--padding-xxxlarge) 0; }
}/* design system button */
.ds-button {
    display: block;
    background-color: var(--c-BRAND);
    color: var(--c-WHITE);
    border: 2px solid var(--c-BRAND);
    border-radius: var(--radius-xlarge);
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    align-self: stretch;
    padding: var(--padding-medium) var(--padding-large);
    font-family: var(--f-SANS);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px; /* 128.571% */
    letter-spacing: 1.68px;
    transition: all .3s;
    margin-bottom: 8px !important;
}

.ds-button:hover {
    background-color: var(--c-WHITE);
    color: var(--c-BRAND);
}

.ds-button-invert {
    background-color: var(--c-WHITE);
    color: var(--c-BRAND);
}

.ds-button-invert:hover {
    background-color: var(--c-BRAND);
    color: var(--c-WHITE);
}

/* white border */
.ds-button__wb { 
    border: 2px solid var(--c-WHITE);
}

/* max-width 50% centered */
.ds-button__mw50-c {
    max-width: 50%;
    margin: auto;
    max-width: 365px;
}