.main-menu {
    height: 100%;
    font-family: var(--font-secondary);
}

.main-menu .nav-1 {
        display: flex;
        align-items: center;
        height: 100%;
    }

.main-menu .nav-1 li {
            padding: 0 1.0625rem;
            height: 100%;
            display: flex;
            align-items: center;
            position: relative;
        }

.main-menu .nav-1 li:first-child {
                padding-left: 0;
            }

.main-menu .nav-1 li:last-child {
                padding-right: 0;
            }

.main-menu .nav-1 .menu-link {
            cursor: pointer;
            position: relative;
            display: flex;
            align-items: center;
            height: 100%;
            font-family: var(--font-secondary);
            color: var(--color-primary);
            font-size: 1.0625rem;
            letter-spacing: calc(-1 * 0.01875rem);
            line-height: 1.25rem;
            text-decoration: none;
        }

.main-menu .nav-1 .menu-link:before {
                content: "";
                position: absolute;
                bottom: 0;
                left: 0;
                height: 0.125rem;
                width: 0;
                background-color: var(--color-primary);
                transition: width 0.2s ease-in-out;
            }

.main-menu .nav-1 .menu-link:hover::before {
                    width: 100%;
                }

.main-menu .nav-1 .menu-link .icon {
                /* display: none; */
            }

.main-menu .nav-1 .submenu-wrapper {
            position: absolute;
            top: 100%;
            left: 0;
            margin-top: 0.0625rem;
            background: #fff;
            border-radius: 0.3125rem;
            padding: 1.25rem 0.9375rem;
            width: 14.375rem;
            display: none;
            opacity: 0;
            transition: all 0.4s ease-in-out;
            box-shadow: 0 0 2px 1px rgba(35, 44, 110, 0.1);
        }

.main-menu .nav-1 .submenu-wrapper .nav-2 li {
                    padding: 0.3125rem 1.25rem;
                }

.main-menu .nav-1 .submenu-wrapper .nav-2 li a {
                        color: var(--color-primary);
                        font-size: 1rem;
                        text-decoration: none;
                    }

.main-menu .nav-1 .submenu-wrapper.visible {
                display: block;
                opacity: 1;
            }

.main-menu .nav-1 .submenu-wrapper.full-width {
                padding: 0;
                border-top: 0.0625rem solid var(--color-grey);
                margin-top: 0;
                border-radius: 0;
                box-shadow: none;
                width: 100%;
                height: 39.375rem;
                position: fixed;
                top: 5rem;
                left: 0;
            }

.main-menu .nav-1 .submenu-wrapper.full-width .submenu-container {
                    max-width: 85rem;
                    margin: 0 auto;
                    padding: 0 1.875rem;
                }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 {
                    display: flex;
                    flex-wrap: wrap;
                    padding-top: 2.1875rem;
                }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 .car-img {
                        max-width: 100%;
                    }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 .image-container {
                        background-color: var(--color-grey);
                        border-radius: 0.5rem;
                    }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 li {
                        width: 25%;
                        padding: 0 0.4375rem 1.875rem;
                    }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 .title {
                        font-size: 0.9375rem;
                        font-family: var(--font-primary);
                        font-weight: 700;
                        line-height: 1.25rem;
                        padding-top: 0.3125rem;
                        text-decoration: none;
                    }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 a {
                        text-decoration: none;
                    }

.main-menu .nav-1 .submenu-wrapper.full-width .nav-2 a:hover .title {
                                text-decoration: underline;
                            }

.main-menu .mobile-container {
        position: relative;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 0.9375rem 1.5625rem 0.9375rem;
        border-bottom: 0.0625rem solid var(--color-grey);
        border-top: 0.0625rem solid var(--color-grey);
    }

.main-menu .mobile-container .back-menu {
            position: absolute;
            inset-inline-start: 1.5625rem;
            margin-top: -4px;
        }

.main-menu .mobile-container .mobile-title {
            font-size: 1.125rem;
            letter-spacing: calc(-1 * 0.01875rem);
        }

@media screen and (min-width: 90rem) {
                .main-menu .nav-1 .menu-link .icon {
                    display: none;
                }
            .main-menu .nav-1 li {
                padding: 0 0.5rem;
            }
}

@media screen and (max-width: 96rem) {
            .main-menu .nav-1 li {
                padding: 0 0.625rem;
            }
}

@media screen and (min-width: 96rem) {
    .main-menu .nav-1 li {
        padding: 0 0.875rem;
    }
}

@media screen and (max-width: 48rem) {
        .main-menu .mobile-container {
            display: flex;
        }
        .main-menu .nav-2 {
            padding-top: 1.25rem;
        }
}

html[dir="ltr"] .main-menu .mobile-container .back-menu {
    transform: rotate(-180deg);
}
