@layer sections{
  [ui-layout=footer]{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-32);
    padding:var(--top-spacing) 8% var(--bottom-spacing);
  }
  [ui-layout=footer][data-blind-space="1"]{
    --shop-bar-height:106px;
    margin-bottom:106px;
    margin-bottom:var(--shop-bar-height);
  }
  [ui-layout=footer][data-top-border="1"]{
    border-top:1px solid var(--color-surface-variant);
  }
  [ui-layout=footer] .main-area{
    display:flex;
    gap:var(--spacing-48);
    justify-content:space-between;
  }
  [ui-layout=footer] .main-area .logo .name{
    width:-moz-fit-content;
    width:fit-content;
    font:var(--font-title-md);
    text-transform:uppercase;
  }
  [ui-layout=footer] .main-area .logo a:has(img){
    display:flex;
  }
  [ui-layout=footer] .main-area .logo a:has(img) img{
    -o-object-fit:contain;
       object-fit:contain;
  }
  @media (max-width: 769px){
    [ui-layout=footer] .main-area .logo a:has(img) img{
      width:var(--mobile-width);
    }
  }
  [ui-layout=footer] .main-area .groups{
    display:flex;
    gap:var(--spacing-48);
  }
  [ui-layout=footer] .main-area .groups .group{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-24);
  }
  [ui-layout=footer] .main-area .groups .group .title{
    font:var(--font-body-lg);
  }
  [ui-layout=footer] .main-area .groups .group .links{
    display:grid;
    grid-gap:var(--spacing-8);
    gap:var(--spacing-8);
  }
  [ui-layout=footer] .main-area .groups .group .links .link [ui-slot=link-button]{
    width:-moz-fit-content;
    width:fit-content;
  }
  [ui-layout=footer] .secondary-area{
    display:flex;
    align-items:center;
    gap:var(--spacing-48);
    justify-content:space-between;
  }
  [ui-layout=footer] .secondary-area:not(:has(.social-links)){
    justify-content:center;
  }
  [ui-layout=footer] .secondary-area .copyright{
    color:var(--color-on-surface-variant);
  }
  [ui-layout=footer] .secondary-area .social-links{
    display:flex;
  }
  @media (max-width: 1024px){
    [ui-layout=footer] .main-area{
      flex-direction:column;
    }
    [ui-layout=footer] .main-area .groups{
      flex-wrap:wrap;
    }
  }
  @media (max-width: 769px){
    [ui-layout=footer]{
      padding:var(--spacing-24);
    }
    [ui-layout=footer][data-blind-space="1"]{
      --shop-bar-height:58px;
    }
    [ui-layout=footer] .main-area .groups{
      flex-direction:column;
    }
    [ui-layout=footer] .secondary-area{
      gap:var(--spacing-16);
      flex-direction:column;
      justify-content:center;
    }
  }
}
