/* Native cards with stacked copy and a contextual photograph on the right. */
.sc-page [data-platform-contact] {
    margin-bottom: clamp(48px, 6vw, 90px);
}

.sc-page [data-platform-contact] .smpls-card {
    --contact-surface: var(--industry-solid, hsl(var(--smplsColorPrimary-hsl)));
    --smplsColorCard: var(--contact-surface);
    --smplsColorCardDark: var(--contact-surface);
    --smplsColorCardHeading: #fff;
    --smplsColorCardHeadingDark: #fff;
    --smplsColorCardText: #fff;
    --smplsColorCardTextDark: #fff;
    --smplsColorCardButton: #fff;
    --smplsColorCardButtonDark: #fff;
    --smplsColorCardButtonText: var(--contact-surface);
    --smplsColorCardButtonTextDark: var(--contact-surface);
    --smplsColorCardButtonHover: #eef2f7;
    --smplsColorCardButtonHoverDark: #eef2f7;
    --smplsColorCardButtonTextHover: var(--contact-surface);
    --smplsColorCardButtonTextHoverDark: var(--contact-surface);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--contact-surface) !important;
}

.sc-page [data-platform-contact-photo] {
    position: absolute;
    inset: 0 0 0 auto;
    width: 72%;
    z-index: 0;
    pointer-events: none;
    background-size: cover;
    background-position: center;
    opacity: .6;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 58%);
    mask-image: linear-gradient(90deg, transparent, #000 58%);
}

.sc-page [data-platform-contact] .smpls-card::after {
    content: '';
    position: absolute;
    z-index: 1;
    width: min(75vw, 1000px);
    aspect-ratio: 1;
    left: -25%;
    top: -110%;
    border: 70px solid #ffffff09;
    border-radius: 50%;
    box-shadow: 0 0 0 90px #ffffff06;
    pointer-events: none;
}

.sc-page [data-platform-contact] .smpls-card > .smpls-card-content {
    position: relative;
    z-index: 2;
    background: transparent !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: start !important;
    gap: 32px !important;
    padding: clamp(28px, 4vw, 64px);
    color: var(--smplsColorCardText);
}

#smpls-editor-content .sc-page [data-platform-contact] .theme-subheading,
#smpls-editor-content .sc-page [data-platform-contact] .theme-subheading .smpls-widget-content > p,
.sc-page [data-platform-contact] .sc-eyebrow,
.sc-page [data-platform-contact] .smpls-button.-underlined {
    color: #fff !important;
    border-color: #ffffff80 !important;
}

.sc-page [data-platform-contact-copy] {
    max-width: 780px;
}

.sc-page [data-platform-contact-copy] h2 {
    max-width: 780px;
    margin-bottom: 24px;
    color: var(--smplsColorCardHeading);
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1.2;
}

.sc-page [data-platform-contact-copy] p:not(.theme-subheading):not(.sc-eyebrow) {
    max-width: 620px;
    margin-bottom: 0;
    color: var(--smplsColorCardText);
    font-size: 16px;
    line-height: 1.75;
}

.sc-page [data-platform-contact] .sc-actions,
.sc-page [data-platform-contact] .sc-actions > .smpls-box-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 20px !important;
    margin: 0;
}

.sc-page [data-platform-contact] .smpls-button {
    min-height: 52px;
    white-space: normal;
    text-align: left;
}

#smpls-editor-content [data-platform-contact] .smpls-button.-solid {
    background: var(--smplsColorCardButton) !important;
    border-color: var(--smplsColorCardButton) !important;
    color: var(--smplsColorCardButtonText) !important;
}

#smpls-editor-content [data-platform-contact] .smpls-button.-solid:is(:hover, :focus-visible) {
    background: var(--smplsColorCardButtonHover) !important;
    border-color: var(--smplsColorCardButtonHover) !important;
    color: var(--smplsColorCardButtonTextHover) !important;
}

#smpls-editor-content [data-platform-contact] .smpls-button.-solid :is(.smpls-button-content, .smpls-button-icon) {
    color: inherit !important;
}

.dark .sc-page [data-platform-contact] .smpls-card-content,
.dark .sc-page [data-platform-contact-copy] p:not(.theme-subheading):not(.sc-eyebrow) {
    color: var(--smplsColorCardHeadingDark);
}

.dark .sc-page [data-platform-contact-copy] :is(h2, .theme-subheading),
.dark .sc-page [data-platform-contact] .smpls-button.-underlined {
    color: var(--smplsColorCardHeadingDark);
}

.dark #smpls-editor-content [data-platform-contact] .smpls-button.-solid {
    background: var(--smplsColorCardButtonDark) !important;
    border-color: var(--smplsColorCardButtonDark) !important;
    color: hsl(var(--smplsColorGray900-hsl)) !important;
}

.dark #smpls-editor-content [data-platform-contact] .smpls-button.-solid:is(:hover, :focus-visible) {
    background: var(--smplsColorCardButtonHoverDark) !important;
    border-color: var(--smplsColorCardButtonHoverDark) !important;
    color: var(--smplsColorCardButtonTextHoverDark) !important;
}

@media (max-width: 575px) {
    .sc-page [data-platform-contact-photo] {
        width: 100%;
        opacity: .32;
        -webkit-mask-image: linear-gradient(90deg, transparent 10%, #000);
        mask-image: linear-gradient(90deg, transparent 10%, #000);
    }

    .sc-page [data-platform-contact] .sc-actions,
    .sc-page [data-platform-contact] .sc-actions > .smpls-box-content,
    .sc-page [data-platform-contact] .sc-actions [data-widget_type="button"] {
        width: 100%;
    }

    .sc-page [data-platform-contact] .smpls-button {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}
