/* Shared ORI background system: subtle Japanese-paper geometry with a custom
   composition for each public page. */
body.page-home,
body.page-menu,
body.page-order,
body.page-faq {
    min-height: 100vh;
    background-color: #faf4d6;
    background-attachment: fixed;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat;
    box-shadow:
        inset 12px 0 0 rgb(248 13 31 / 0.025),
        inset -12px 0 0 rgb(248 13 31 / 0.025);
}

body.page-home {
    background-image:
        radial-gradient(circle at 4% 18%, rgb(248 13 31 / 0.11) 0 8rem, transparent 8.1rem),
        radial-gradient(circle at 96% 58%, transparent 0 7rem, rgb(248 13 31 / 0.065) 7.1rem 10rem, transparent 10.1rem),
        linear-gradient(115deg, transparent 0 68%, rgb(23 23 23 / 0.03) 68.1% 72%, transparent 72.1%),
        repeating-linear-gradient(45deg, transparent 0 48px, rgb(248 13 31 / 0.025) 49px 50px);
}

body.page-menu {
    background-image:
        radial-gradient(circle at 93% 14%, rgb(248 13 31 / 0.1) 0 9rem, transparent 9.1rem),
        radial-gradient(circle at 5% 64%, transparent 0 6rem, rgb(23 23 23 / 0.04) 6.1rem 8.5rem, transparent 8.6rem),
        linear-gradient(65deg, transparent 0 22%, rgb(248 13 31 / 0.035) 22.1% 25%, transparent 25.1%),
        repeating-linear-gradient(-45deg, transparent 0 42px, rgb(248 13 31 / 0.024) 43px 44px);
}

body.page-order {
    background-image:
        radial-gradient(circle at 6% 30%, rgb(248 13 31 / 0.09) 0 7rem, transparent 7.1rem),
        radial-gradient(circle at 94% 78%, transparent 0 8rem, rgb(248 13 31 / 0.07) 8.1rem 11rem, transparent 11.1rem),
        linear-gradient(135deg, transparent 0 48%, rgb(23 23 23 / 0.028) 48.1% 52%, transparent 52.1%),
        repeating-linear-gradient(90deg, transparent 0 56px, rgb(248 13 31 / 0.022) 57px 58px);
}

body.page-faq {
    background-image:
        radial-gradient(circle at 7% 16%, rgb(248 13 31 / 0.1) 0 7rem, transparent 7.1rem),
        radial-gradient(circle at 94% 48%, rgb(248 13 31 / 0.08) 0 10rem, transparent 10.1rem),
        radial-gradient(circle at 8% 82%, rgb(23 23 23 / 0.045) 0 8rem, transparent 8.1rem),
        repeating-linear-gradient(45deg, transparent 0 42px, rgb(248 13 31 / 0.025) 43px 44px);
}

body.page-home main,
body.page-menu main,
body.page-order main,
body.page-faq main {
    position: relative;
}

body.page-home main::before,
body.page-menu main::before,
body.page-order main::before,
body.page-faq main::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 8rem;
    right: 0;
    width: min(18rem, 40vw);
    height: min(18rem, 40vw);
    border: 2.5rem solid rgb(248 13 31 / 0.045);
    border-radius: 999px;
    pointer-events: none;
}

@media (max-width: 767px) {
    body.page-home,
    body.page-menu,
    body.page-order,
    body.page-faq {
        background-attachment: scroll;
        box-shadow:
            inset 6px 0 0 rgb(248 13 31 / 0.025),
            inset -6px 0 0 rgb(248 13 31 / 0.025);
    }

    body.page-home main::before,
    body.page-menu main::before,
    body.page-order main::before,
    body.page-faq main::before {
        right: 0;
        width: min(12rem, 38vw);
        height: min(12rem, 38vw);
        opacity: 0.7;
    }
}
