.accordion-with-menu-section-wrapper {
    padding-inline: 24px;
    background-color: var(--theme-color-grey-1);
    padding-top: 32px;
    padding-bottom: 96px;

    accordion-select {
        display: none;
    }

    .accordion-with-menu-section__top-heading {
        display: flex;
        flex-direction: column;
        gap: 8px;
        max-width: 50vw;
        grid-column: 1 / -1;
    }

    .accordion-with-menu-section {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 32px 0;
    }

    .accordion + .accordion {
        border-top: 1px solid var(--theme-color-grey-2);
    }

    .accordion__summary {
        padding: 20px 0;
        justify-content: space-between;
        align-items: center;
        column-gap: .75rem;
        display: flex;
    }

    .collapsible-content__subheading,
    .collapsible-content__heading {
        font-style: normal;
        font-weight: 400;
        display: flex;
        align-items: center;
    }

    .accordion-with-menu-section__accordion-content {
        padding-bottom: 16px;
        font-weight: 400;
        max-width: 75%;
    }

    .accordion-with-menu__accordion-text,
    .accordion-with-menu__accordion-content {
        text-transform: uppercase;
    }

    .accordion-with-menu__accordion-content .active {
        display: none;
    }

    .accordion-with-menu__accordion-text {
        color: var(--theme-color-primary);

        svg {
            color: var(--theme-color-black);
        }
    }

    .collapsible-content__headings {
        display: flex;
        flex-direction: column;
        row-gap: 8px;
        padding: 24px 0 24px;
        color: var(--theme-color-black);
        border-bottom: 1px solid var(--theme-color-grey-2);
        text-transform: none;
    }

    .collapsible-content-menu {
        grid-column: span 2;

        .menu-dropdown-wrapper {
            display: block;
            padding: 24px 16px;
            background-color: var(--theme-color-white);
            border-radius: 8px;

            .nav-menu {
                display: flex;
                flex-direction: column;
                gap: 20px 0;
                margin: 0;
                list-style: none;

                a {
                    text-transform: uppercase;
                }
            }

            .inactive,
            .active {
                font-weight: 600;
                padding: 0;
            }

            .active {
                color: var(--theme-color-primary);
            }
        }
    }

    .collapsible-content-section {
        grid-column: 4 / -2;
    }
}

@media screen and (max-width: 1000px) {
    .accordion-with-menu-section-wrapper {
        padding-inline: 12px;

        accordion-select {
            display: block;
        }
        
        .accordion-with-menu-section {
            gap: 24px 0;
        }

        .accordion-with-menu-section__top-heading {
            max-height: 100%;
            padding-bottom: 8px;
        }
        
        .accordion-with-menu-section__accordion-content {
            max-width: 100%;
        }
        
        .accordion__summary {
            padding: 16px 0;
        }

        .collapsible-content-menu,
        .collapsible-content-section {
            grid-column: span 12;
        }

        .collapsible-content__headings {
            padding-top: 0;
        }

        .collapsible-content-menu {
            .menu-dropdown-wrapper {
                display: none;
            }
        }
    }
}