@import url("/static/css/how-it-works-base.6835fbba7119.css");

.visual-hero,
.visual-owner-account,
.visual-owner-campaign,
.visual-owner-prizes {
    aspect-ratio: 1491 / 1055;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.visual-hero {
    background-image: url("/how-it-works/assets/hero.webp");
}

.visual-owner-account {
    background-image: url("/how-it-works/assets/account.webp");
}

.visual-owner-campaign {
    background-image: url("/how-it-works/assets/campaign.webp");
}

.visual-owner-prizes {
    background-image: url("/how-it-works/assets/prizes.webp");
}

.visual-product-entry,
.visual-customer-flow,
.visual-reports {
    aspect-ratio: 16 / 9;
    background-color: #FFFFFF;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.visual-product-entry {
    background-image: url("/how-it-works/assets/orders.webp");
}

.visual-customer-flow {
    background-image: url("/how-it-works/assets/customer-start.webp");
}

.visual-reports {
    background-image: url("/how-it-works/assets/reports.webp");
}

.visual-wheel,
.visual-scratch,
.visual-pick,
.visual-customer-result,
.visual-customer-redeem {
    aspect-ratio: 4 / 5;
    background-color: #F4F1EB;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.visual-wheel {
    background-image: url("/how-it-works/assets/wheel.webp");
}

.visual-scratch {
    background-image: url("/how-it-works/assets/scratch.webp");
}

.visual-pick {
    background-image: url("/how-it-works/assets/pick-cup.webp");
}

.visual-customer-result {
    background-image: url("/how-it-works/assets/customer-result.webp");
}

.visual-customer-redeem {
    background-image: url("/how-it-works/assets/customer-redeem.webp");
}

.visual-hero > .sprite-visual,
.visual-owner-account > .sprite-visual,
.visual-owner-campaign > .sprite-visual,
.visual-owner-prizes > .sprite-visual,
.visual-product-entry > .sprite-visual,
.visual-customer-flow > .sprite-visual,
.visual-reports > .sprite-visual,
.visual-customer-result > .sprite-visual,
.visual-customer-redeem > .sprite-visual,
.visual-wheel > .sprite-visual,
.visual-scratch > .sprite-visual,
.visual-pick > .sprite-visual {
    display: none;
}

.visual-owner-account,
.visual-owner-campaign,
.visual-owner-prizes,
.visual-product-entry,
.visual-customer-flow,
.visual-reports {
    max-width: 760px;
}

.visual-customer-result,
.visual-customer-redeem {
    max-width: 600px;
}

@media (max-width: 1040px) {
    .visual-hero,
    .visual-owner-account,
    .visual-owner-campaign,
    .visual-owner-prizes,
    .visual-product-entry,
    .visual-customer-flow,
    .visual-reports,
    .visual-customer-result,
    .visual-customer-redeem {
        width: min(760px, 100%);
        margin-inline: auto;
    }
}