﻿.tab-interface .tablist
{
    display: flex;
    align-items: center;
    column-gap: 1.5rem;
    padding: 0 var(--container-padding) .875rem var(--container-padding);
}
@media screen and (min-width: 1050px)
{
    .tab-interface .tablist
    {
        column-gap: 2.5rem;
    }
}
.tab-interface .tablist .tab-button
{
    cursor: pointer;
    padding: 0;
    background: rgba(0,0,0,0);
    border: none;
    line-height: 0;
    position: relative;
    line-height: 1em;
    font-family: var(--font-family-base);
    font-size: 1.25rem;
    font-weight: var(--font-weight-extra-bold);
    text-transform: uppercase;
    transition: all .25s ease-out;
    color: var(--text-primary);
    font-size: 1.75rem;
}
@media screen and (min-width: 820px)
{
    .tab-interface .tablist .tab-button
    {
        font-size: 2.5rem;
    }
}
.tab-interface .tablist .tab-button:not([aria-current=page]):after, .tab-interface .tablist .tab-button>.header-active-menu-item:after
{
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-bottom: .375rem solid rgba(0,0,0,0);
    transition: top .25s ease-out,border .25s ease-out;
}
.tab-interface .tablist .tab-button:hover:after, .tab-interface .tablist .tab-button.active:after, .opening .tab-interface .tablist .tab-button:after
{
    top: var(--button-padding-vertical-md);
    border-color: var(--color-primary-100);
}
.tab-interface .tablist .tab-button>.header-active-menu-item:after
{
    top: var(--button-padding-vertical-md);
    border-color: var(--color-primary-100);
}
.tab-interface .tabpanel
{
    display: flex;
    flex-direction: column;
    overflow-y: hidden;
    row-gap: var(--stacked-component-lg);
    height: auto;
    filter: blur(0);
    transition: opacity .4s ease,filter .4s ease,height .8s ease-in-out;
}
@media screen and (min-width: 1050px)
{
    .tab-interface .tabpanel
    {
        row-gap: var(--stacked-component-md);
    }
}
.tab-interface .tabpanel.is-hidden
{
    height: 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(10px);
    transition: opacity .4s ease,filter .4s ease,visibility .4s ease,height .8s ease-in-out;
}