.survey-campaign {
    position: fixed;
    inset: 0;
    width: min(55rem, calc(100% - 2rem));
    max-width: none;
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid #e8d9de;
    border-radius: 1.75rem;
    background: #fffaf4;
    color: #552837;
    box-shadow: 0 24px 80px #321b2940;
}
.survey-campaign:not([open]) { display: none; }
.survey-campaign::backdrop { background: #28191fe0; }
html.survey-campaign-open, html.survey-campaign-open body { overflow: hidden; }
.survey-campaign__layout { display: grid; grid-template-columns: .85fr 1.15fr; }
.survey-campaign__close {
    position: absolute;
    z-index: 1;
    top: .75rem;
    right: .75rem;
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    padding: .7rem;
    border: 1px solid #75314924;
    border-radius: 50%;
    background: #fffaf4;
    color: #753149;
    cursor: pointer;
}
.survey-campaign__close svg { width: 100%; height: 100%; }
.survey-campaign__offer {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    min-width: 0;
    padding: 2.5rem 1.5rem;
    overflow: hidden;
    background: #753149;
    color: #fff5e8;
    text-align: center;
}
.survey-campaign__offer::before, .survey-campaign__offer::after {
    content: "";
    position: absolute;
    width: 23rem;
    height: 23rem;
    border: 1px solid #fff5e824;
    border-radius: 50%;
    pointer-events: none;
}
.survey-campaign__offer::before { top: -12rem; left: -12rem; }
.survey-campaign__offer::after { right: -13rem; bottom: -12rem; }
.survey-campaign__brand { font-size: 1.75rem; font-weight: 400; letter-spacing: -.045em; }
.survey-campaign__eyebrow { display: block; font-size: .65rem; font-weight: 500; line-height: 1.6; letter-spacing: .11em; text-transform: uppercase; }
.survey-campaign__amount strong { display: block; margin-block: .6rem; font-size: clamp(3.6rem, 7.5vw, 6rem); font-weight: 400; line-height: 1.1; letter-spacing: -.06em; white-space: nowrap; }
.survey-campaign__amount strong span { margin-left: .12em; font-size: .5em; letter-spacing: 0; }
.survey-campaign__amount p { font-size: 1rem; line-height: 1.6; }
.survey-campaign__dates { padding: .45rem 1rem; border: 1px solid #fff5e84d; border-radius: 3rem; font-size: .75rem; }
.survey-campaign__content { min-width: 0; padding: 3.75rem 2.5rem 2rem; }
.survey-campaign__content > .survey-campaign__eyebrow { max-width: 28ch; color: #906b79; }
.survey-campaign__content h2 { margin: 1.1rem 0; font-size: clamp(1.75rem, 3.4vw, 2.65rem); font-weight: 400; line-height: 1.2; letter-spacing: -.045em; color: #552837; }
.survey-campaign__content > p { margin-bottom: 1rem; font-size: .95rem; line-height: 1.65; }
.survey-campaign__content > p strong { font-weight: 500; }
.survey-campaign__cta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3rem; margin-top: 1.5rem; padding: .8rem 1.2rem; border: 1px solid #753149; border-radius: 3rem; background: #753149; color: #fffaf4; font-size: .85rem; font-weight: 500; text-decoration: none; }
.survey-campaign__cta:hover { background: #552837; color: #fffaf4; }
.survey-campaign__later { display: block; min-height: 2.75rem; margin: .35rem auto 0; padding: .5rem 1rem; border: 0; border-radius: 2rem; background: transparent; color: #753149; font-size: .8rem; text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }
.survey-campaign__close:hover, .survey-campaign__later:hover { background: #f7ecdf; }
.survey-campaign :is(a, button):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.survey-campaign__cta:focus-visible { outline-color: #753149; }
.survey-campaign__content > .survey-campaign__terms { margin: .6rem 0 0; color: #906b79; font-size: .65rem; line-height: 1.65; text-align: center; }

@media (max-width: 767px) {
    .survey-campaign__content { padding: 3.75rem 1.5rem 1.5rem; }
    .survey-campaign__offer { padding-inline: 1rem; }
}
@media (max-width: 639px) {
    .survey-campaign { width: calc(100% - 1.5rem); max-height: calc(100vh - 1.5rem); max-height: calc(100dvh - 1.5rem); border-radius: 1.25rem; }
    .survey-campaign__layout { grid-template-columns: minmax(0, 1fr); }
    .survey-campaign__close { top: .6rem; right: .6rem; }
    .survey-campaign__offer { gap: .65rem; padding: 1.1rem 3.5rem 1.2rem; }
    .survey-campaign__brand { font-size: 1.35rem; }
    .survey-campaign__amount strong { margin: .2rem 0 .3rem; font-size: clamp(3.25rem, 14vw, 4.5rem); }
    .survey-campaign__amount p { font-size: .8rem; line-height: 1.4; }
    .survey-campaign__amount p br { display: none; }
    .survey-campaign__dates { padding: .25rem .7rem; font-size: .65rem; }
    .survey-campaign__content { padding: 1.4rem 1.25rem 1.2rem; }
    .survey-campaign__content > .survey-campaign__eyebrow { max-width: none; font-size: .6rem; }
    .survey-campaign__content h2 { margin: .7rem 0; font-size: clamp(1.65rem, 7vw, 2.15rem); }
    .survey-campaign__content h2 br { display: none; }
    .survey-campaign__content > p { font-size: .85rem; }
    .survey-campaign__cta { margin-top: 1rem; }
}