.virtual {
    .container {
        .virtual_holder {
            display: grid;
            grid-gap: 40px;
            grid-template-columns: 320px 596px 320px;
            align-items: start;
            margin-left: -60px;
            @media (max-width: 1440px) {
                grid-template-columns: 200px 533px 220px;
                margin-left: -30px;
            }
            @media (max-width: 1024px) {
                grid-template-columns: 1fr;
                margin-left: 0;
                grid-gap: 32px;
            }
            .virtual_left {
                position: relative;
                @media (max-width: 1024px) {
                    display: none;
                }
                .virtual_bak {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    z-index: 1;
                }
                .virtual_left_body {
                    position: relative;
                    width: 216px;
                    margin-left: 53px;
                    margin-top: 56px;
                    z-index: 2;
                    @media (max-width: 1440px) {
                        width: 130px;
                        margin-left: 33px;
                        margin-top: 36px;
                    }
                    .qr {
                        margin-bottom: 20px;
                    }
                    .tip {
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        gap: 10px;
                        margin-bottom: 30px;
                        @media (max-width: 1440px) {
                            margin-bottom: 60px;
                        }
                        p {
                            width: 100%;
                            font-size: 22px;
                        }
                    }
                }
            }
            .responsive-divider {
                display: none;
                @media (max-width: 768px) {
                    display: block;
                    width: 100vw;
                    margin-inline: -20px;
                    overflow: hidden;
                }
            }
            .virtual_mid {
                position: relative;
                h2 {
                    margin-bottom: 60px;
                    @media (max-width: 1024px) {
                        margin-bottom: 42px;
                        letter-spacing: -2px;
                        &.augmented {
                            font-size: 62px;
                        }
                    }
                    @media (max-width: 576px) {
                        width: 70%;
                    }
                }
                .text {
                    margin-bottom: 60px;
                    @media (max-width: 1024px) {
                        margin-bottom: 0;
                        p {
                            margin-bottom: 0;
                        }
                    }
                }
                .cta {
                    display: flex;
                    gap: 24px;
                    align-items: center;
                    @media (max-width: 1024px) {
                        display: none;
                    }
                }
                .tip {
                    position: relative;
                    width: 220px;
                    transform: translateX(220%) translateY(70px);
                    text-transform: uppercase;
                    @media (max-width: 1024px) {
                        display: none;
                    }
                    p {
                        margin-bottom: 0;
                        line-height: 1;
                    }
                    svg {
                        position: absolute;
                        left: 0;
                        top: 0;
                        transform: translate(-130%, -70%);
                    }
                }
            }
            .virtual_right {
                figure {
                    position: relative;
                    padding-top: 185%;
                    border: 1px solid var(--c-gray-900);
                    border-radius: var(--br-lg);
                    overflow: hidden;
                    @media (max-width: 1024px) {
                        margin-inline: -20px;
                        border-radius: 0;
                        padding-top: 76%;
                    }
                    video {
                        position: absolute;
                        width: 100%;
                        height: 100%;
                        left: 0;
                        top: 0;
                        object-fit: cover;
                        vertical-align: top;
                        &.mobile {
                            display: none;
                            @media (max-width: 1024px) {
                                display: block;
                            }
                        }
                        &.desk {
                            display: block;
                            @media (max-width: 1024px) {
                                display: none;
                            }
                        }
                    }
                }
            }
        }
        .resp {
            display: none;
            @media (max-width: 1024px) {
                display: block;
                text-align: center;
                a {
                    margin-bottom: 32px;
                }
            }
        }
    }
    &.dark {
        .virtual_holder {
            .virtual_left {
                .virtual_left_body {
                    .tip {
                        p {
                            color: var(--c-gray-25);
                        }
                    }
                }
            }
            .virtual_right {
                padding-top: 200px;
                @media (max-width: 1024px) {
                    padding-top: 0;
                }
            }
        }
    }
}