/* Shared Sweep offer and demo frame on both pages. */
.sweep-offer-badge {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    padding: 14px 19px;
    margin: 0 0 12px;
    border-radius: 14px;
    background: #dfff75;
    color: #13260b;
    box-shadow: 0 8px 28px #b6ed4220;
    text-align: left;
}
.sweep-offer-badge strong { font-size: clamp(21px, 2.2vw, 28px); font-weight: 850; line-height: 1.15; letter-spacing: -.035em; }
.sweep-offer-badge small { font-size: 12px; font-weight: 600; }
.offer-terms { color: #c2d0c7; font-size: 13px; line-height: 1.55; margin: 0 0 17px; max-width: 510px; }
.demo-phone {
    --phone-width: 340px;
    position: relative;
    width: var(--phone-width);
    max-width: 100%;
    padding: calc(var(--phone-width) * .025);
    border-radius: calc(var(--phone-width) * .145);
    background: #121614;
    box-shadow: inset 0 0 0 1px #7a837d, 0 25px 65px #0006;
}
.demo-phone video {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 600 / 1304;
    border-radius: 12% / 5.52%;
    object-fit: cover;
    background: #091611;
}
.demo-phone::after {
    content: "";
    position: absolute;
    top: 2.7%;
    left: 37%;
    width: 26%;
    height: 1.6%;
    border-radius: 999px;
    background: #080a09;
    pointer-events: none;
}
.sweep-demo { display: flex; flex-direction: column; align-items: center; }
.video-toggle { margin-top: 22px; padding: 10px 18px; border: 1px solid #6f9f86; border-radius: 30px; background: #10271d; color: #d6e6dc; font: inherit; font-size: 12px; cursor: pointer; }
.video-toggle[hidden] { display: none; }
@media (min-width: 769px) { .demo-phone { transform: rotate(3deg); } }
@media (max-width: 768px) { .demo-phone { --phone-width: 270px; transform: none; } }
@media (prefers-reduced-motion: reduce) { .demo-phone { transform: none; } }
.joined .sweep-offer-badge { margin-top: 16px; }
.joined .sweep-offer-badge strong { font-size: 23px; }
@media (max-width: 700px) {
    .sticky-join strong { display: block; background: #dfff75; color: #13260b; border-radius: 7px; padding: 5px 7px; font-size: 13px; }
    .sticky-join img { display: none; }
    .sticky-join small { font-size: 10px; }
}
