.tabs{@apply relative}.tabs__trigger{@apply flex lg:hidden items-center gap-2 justify-between bg-gradient-to-r from-blue to-blue-darker font-bold text-lg text-white leading-none py-4 px-6 cursor-pointer rounded-[1.5em]}.tabs__trigger-icon{@apply size-4 ml-6 transition-all;.tabs.is-open &{@apply rotate-180}}.tabs__menu{@apply lg:flex lg:gap-2 lg:items-center lg:justify-start bg-white lg:bg-none shadow-lg lg:shadow-none rounded-2xl absolute lg:static top-full left-0 z-10 mt-1 lg:mt-0 w-full lg:w-auto opacity-0 lg:!opacity-100 pointer-events-none lg:!pointer-events-auto -translate-y-2 lg:!translate-y-0 px-6 py-3 lg:px-0 lg:py-0 transform-gpu transition-all;.tabs.is-open &{@apply opacity-100 pointer-events-auto translate-y-0}}.tabs__item{@apply text-blue font-bold text-lg leading-none py-4 w-full block text-left border-b border-solid border-b-gray-light last:border-b-0 cursor-pointer transition-all;@apply lg:w-auto lg:py-3 lg:px-6 lg:rounded-[1.5em] lg:border-blue lg:border-solid lg:!border-2 lg:bg-white lg:text-blue lg:font-bold lg:text-lg lg:leading-none lg:hover:bg-gray-lightest;&.is-active{@apply lg:bg-blue lg:text-white lg:border-blue}}