.page-hero,
.profiles-directory-card,
.reward-arcade-feature,
.reward-arcade-card,
.wr-media-card,
.wr-channel-row {
    position: relative;
    overflow: hidden;
}

.page-hero > *,
.profiles-directory-card > *,
.reward-arcade-feature > *,
.reward-arcade-card > *,
.wr-media-card > *,
.wr-channel-row > * {
    position: relative;
    z-index: 1;
}

.page-hero::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: clamp(10px, 4vw, 42px);
    bottom: -46px;
    width: min(34vw, 380px);
    height: min(34vw, 380px);
    pointer-events: none;
    background: var(--wru-hero-robot, url("/assets/images/robots/REX.webp")) center bottom / contain no-repeat;
    opacity: .18;
    filter: saturate(1.08) drop-shadow(0 28px 44px rgba(0,0,0,.58));
}

.page-hero::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(100deg, rgba(5,7,13,.28), rgba(61,124,255,.09) 52%, rgba(255,207,55,.08));
}

.page-hero h1,
.page-hero p,
.page-hero .actions {
    max-width: 780px;
}

.reward-arcade-hero {
    --wru-hero-robot: url("/assets/images/robots/Celsius-clear.webp");
}

.profiles-directory-card::after,
.reward-arcade-feature::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: 18px;
    bottom: -30px;
    width: min(30vw, 280px);
    height: min(30vw, 280px);
    pointer-events: none;
    background: url("/assets/images/robots/MACHAIRA.webp") center bottom / contain no-repeat;
    opacity: .12;
    filter: drop-shadow(0 24px 36px rgba(0,0,0,.5));
}

.profiles-directory-card::after {
    background-image: url("/assets/images/robots/KELVIN.webp");
    opacity: .1;
}

.reward-arcade-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: -34px;
    bottom: -28px;
    width: 180px;
    height: 180px;
    pointer-events: none;
    background: var(--wru-card-robot, url("/assets/images/robots/Arthur.webp")) center bottom / contain no-repeat;
    opacity: .16;
    filter: drop-shadow(0 18px 28px rgba(0,0,0,.5));
    transform: rotate(-4deg);
}

.reward-arcade-card:nth-child(1) {
    --wru-card-robot: url("/assets/images/robots/Ultimate_BlitzInfobox.webp");
}

.reward-arcade-card:nth-child(2) {
    --wru-card-robot: url("/assets/images/robots/TETH.webp");
}

.reward-arcade-card:nth-child(3) {
    --wru-card-robot: url("/assets/images/robots/VELOS.webp");
}

.reward-arcade-card:nth-child(4) {
    --wru-card-robot: url("/assets/images/robots/PILUM.webp");
}

.reward-arcade-card:nth-child(5) {
    --wru-card-robot: url("/assets/images/robots/BASILEUS.webp");
}

.wr-media-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: -24px;
    bottom: 4px;
    width: 118px;
    height: 118px;
    pointer-events: none;
    background: url("/assets/images/robots/kocho.webp") center bottom / contain no-repeat;
    opacity: .075;
    filter: drop-shadow(0 12px 20px rgba(0,0,0,.5));
}

.wr-media-card:nth-child(3n+2)::after {
    background-image: url("/assets/images/robots/bjorn2ball.webp");
}

.wr-media-card:nth-child(3n+3)::after {
    background-image: url("/assets/images/robots/PIERCER.webp");
}

.wr-channel-row::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: 18px;
    bottom: -24px;
    width: 150px;
    height: 150px;
    pointer-events: none;
    background: url("/assets/images/robots/Harpy.webp") center bottom / contain no-repeat;
    opacity: .08;
}

.profile-pilot-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: -26px;
    bottom: -22px;
    width: 116px;
    height: 116px;
    pointer-events: none;
    background: url("/assets/images/robots/Sword_Unit_190Infobox.webp") center bottom / contain no-repeat;
    opacity: .07;
    filter: drop-shadow(0 12px 18px rgba(0,0,0,.46));
}

.profile-pilot-card:nth-child(4n+2)::after {
    background-image: url("/assets/images/robots/Nightingale.webp");
}

.profile-pilot-card:nth-child(4n+3)::after {
    background-image: url("/assets/images/robots/mauler.webp");
}

.profile-pilot-card:nth-child(4n+4)::after {
    background-image: url("/assets/images/robots/NewtonInfobox.webp");
}

@media (max-width: 760px) {
    .page-hero::after {
        width: 190px;
        height: 190px;
        right: -34px;
        bottom: -34px;
        opacity: .1;
    }

    .profiles-directory-card::after,
    .reward-arcade-feature::after,
    .reward-arcade-card::after,
    .wr-media-card::after,
    .wr-channel-row::after,
    .profile-pilot-card::after {
        opacity: .045;
    }
}
