/*  COMPONENT: NAV Styleguide
//////////////////////////////////////////////////////////////////////////////*/

@layer components {
    .nav-styleguide ul {
        flex-direction: column;
    }
    .nav-styleguide a {
        display: block;
        text-decoration: none;
    }
    .nav-styleguide a:hover,
    .nav-styleguide .active strong,
    .nav-styleguide .trail > a {
        font-weight: inherit;
        text-decoration: underline;
        text-underline-offset: 0.125em;
        text-decoration-thickness: 1px;
    }
    .nav-styleguide .level_1 {
        gap: 0;
        font-weight: bold;
    }
    .nav-styleguide .level_2 {
        gap: 0;
        font-weight: var(--font-weight-light);
    }
}