.mobile-app-page-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: #dadada;
    position: relative;

    & > section {
        width: 100%;
        padding: 0 40px;
    }

    ul {
        display: block;
        list-style-type: disc;
        margin-block-start: 1em;
        margin-block-end: 1em;
        margin-inline-start: 0;
        margin-inline-end: 0;
        padding-inline-start: 40px;
        unicode-bidi: isolate;
    }

    .top {
        display: flex;
        justify-content: space-between;
        align-items: center;

        header {
            margin-bottom: 20px;
        }

        h1 {
            font-size: 28px;
            font-weight: 700;
            margin: 10px 0;
        }

        .left {
            width: 45%;
            padding-top: 40px;
            padding-bottom: 40px;
        }

        .right {
            width: 55%;
            padding-left: 35px;
        }

        .download-button {
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: var(--bg-button-accent-color);
            color: var(--text-button-accent-color);
            gap: 8px;
            border-radius: 4px;
            padding: 10px 0;
            font-size: 20px;
            font-weight: 500;
            transition: 0.15s;
            text-decoration: none;

            &:hover {
                background-color: #E4AD00;
            }

            i {
                display: flex;
                background: var(--icon-android);
                width: 32px;
                height: 32px;
            }
        }

        .qr-section {
            margin-top: 25px;
            padding: 20px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            background-color: var(--bg-main-color-light);
            gap: 45px;
            border-radius: 4px;

            img {
                background-color: white;
                width: 150px;
            }

            span {
                font-size: 30px;
                font-weight: 700;
            }

        }

        & .right img {
            display: block;
            max-width: 100%;
            height: auto;
        }
    }

    &.is-outdated .top {
        header {
            background-color: var(--bg-button-accent-color);
            color: var(--text-button-accent-color);
        }
    }

    .bottom {
        padding-bottom: 40px;

        .terms-wrapper {
            width: 100%;
            padding: 20px;
            background-color: var(--bg-main-color-light);
            border-radius: 4px;
        }
    }

}