.megaMenuItem {
    composes: px-3 from global;
    composes: py-0 from global;
}

.megaMenuLink {
    composes: items-center from global;
    composes: inline-flex from global;
    min-height: 5rem;
}

.megaMenuLinkActive {
    composes: megaMenuLink;
    composes: underline from global;
}

.megaMenuItem_active {
    composes: megaMenuItem;
    composes: flex from global;
}

.arrowDown {
    composes: leading-[0] from global;
    composes: pl-2xs from global;
}

.megaMenuItem:hover .megaMenuLink,
.megaMenuItem:focus .megaMenuLink {
    @apply underline;
}