#youcan-section--navbar{
    --spring-width-offset:10px;
  }
  #youcan-section--navbar:has([data-sticky-mode]:not([data-sticky-mode=none])){
    position:sticky;
    z-index:50;
    inset-block-start:var(--spacing-0);
  }
  [ui-layout=navbar]{
    display:grid;
    grid-template-areas:"logo menu actions";
    grid-template-columns:1fr 4fr 1fr;
    align-items:center;
    padding:attr(data-top-spacing px) var(--spacing-24) attr(data-bottom-spacing px);
    transform:translateY(0%);
    transition:transform var(--transition-standard-slow-spatial);
    background-color:inherit;
    grid-gap:var(--spacing-16);
    gap:var(--spacing-16);
  }
  [ui-layout=navbar][aria-hidden=true]{
    transform:translateY(-150%);
  }
  [ui-layout=navbar][data-bottom-border="1"]{
    border-block-end:1px solid var(--color-surface-variant);
  }
  [ui-layout=navbar][data-header-layout=logo-center-menu-first]{
    grid-template-areas:"menu logo actions";
    grid-template-columns:1fr auto 1fr;
  }
  [ui-layout=navbar] .logo{
    grid-area:logo;
  }
  [ui-layout=navbar] .logo .name{
    font:var(--font-title-md);
    text-transform:uppercase;
  }
  [ui-layout=navbar] .logo a:has(img){
    display:flex;
  }
  [ui-layout=navbar] .logo a:has(img) img{
    -o-object-fit:contain;
       object-fit:contain;
  }
  @media (max-width: 769px){
    [ui-layout=navbar] .logo a:has(img) img{
      width:attr(data-mobile-width px);
    }
  }
  [ui-layout=navbar] .links{
    display:flex;
    grid-area:menu;
    flex-wrap:wrap;
    align-items:center;
    gap:var(--spacing-24);
  }
  [ui-layout=navbar] .links[data-split-menu=first-half]{
    grid-area:menu-left;
  }
  [ui-layout=navbar] .links[data-split-menu=second-half]{
    grid-area:menu-right;
  }
  [ui-layout=navbar] .actions{
    display:flex;
    grid-area:actions;
    flex-shrink:0;
  }
  [ui-layout=navbar] > .logo, [ui-layout=navbar] > .links, [ui-layout=navbar] > .actions{
    display:flex;
  }
  [ui-layout=navbar] > .logo:nth-of-type(2), [ui-layout=navbar] > .links:nth-of-type(2), [ui-layout=navbar] > .actions:nth-of-type(2){
    justify-content:center;
  }
  [ui-layout=navbar] > .logo:last-child, [ui-layout=navbar] > .links:last-child, [ui-layout=navbar] > .actions:last-child{
    justify-content:flex-end;
  }
  [ui-layout=navbar] .links:not([data-split-menu]){
    flex-shrink:0;
  }
  [ui-layout=navbar] .menu{
    grid-area:menu;
  }
  [ui-layout=navbar][data-header-layout=logo-first-menu-center]{
    grid-template-areas:"logo menu actions";
    grid-template-columns:1fr 4fr 1fr;
  }
  [ui-layout=navbar][data-header-layout=logo-first-menu-center] .links{
    justify-content:center;
  }
  [ui-layout=navbar][data-header-layout=logo-center-menu-split]{
    grid-template-areas:"menu-left logo split-right";
    grid-template-columns:1fr auto 1fr;
  }
  [ui-layout=navbar][data-header-layout=logo-center-menu-split] .right-split{
    display:flex;
    grid-area:split-right;
    align-items:center;
    justify-content:flex-end;
    gap:var(--spacing-32);
  }
  @media (min-width: 769.02px){
    [ui-layout=navbar]:not(#\#) .actions .menu{
      display:none !important;
    }
  }
  @media (max-width: 769px){
    [ui-layout=navbar]{
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding-inline:var(--spacing-8);
    }
    [ui-layout=navbar] .links{
      display:none;
    }
    [ui-layout=navbar] .logo{
      display:flex;
    }
    [ui-layout=navbar] .actions{
      flex-direction:row-reverse;
      gap:var(--spacing-0);
      justify-content:flex-end;
    }
    [ui-layout=navbar]:not(#\#) .actions .search{
      display:none !important;
    }
  }
  [data-intensity=as-solid-bg] [ui-layout=navbar],
  [data-intensity=as-foreground] [ui-layout=navbar]{
    background-color:var(--color-on-primary);
  }
  [data-intensity=as-light-bg] [ui-layout=navbar]{
    background-color:var(--color-primary-container);
  }