@layer sections{
  [ui-section=logo-list] .logos-container{
    --logos-container-bg:#fefefe;
    padding-block:var(--spacing-24);
    overflow:hidden;
    border-radius:var(--radius-card);
    background-color:#fefefe;
    background-color:var(--logos-container-bg);
  }
  [ui-section=logo-list] .logos-container [ui-block=logo]{
    --size:142px;
    width:142px;
    width:var(--size);
    height:142px;
    height:var(--size);
    margin:var(--spacing-8) var(--spacing-16);
  }
  [ui-section=logo-list] .logos-container [ui-block=logo] img{
    -o-object-fit:contain;
       object-fit:contain;
    transition:filter var(--transition-standard-default-effects);
  }
  @media (max-width: 769px){
    [ui-section=logo-list] .logos-container [ui-block=logo]{
      --size:80px;
    }
  }
  [ui-section=logo-list][data-list] .logos-container .logo-list{
    display:grid;
    grid-template-columns:repeat(var(--nbr-columns-desktop), minmax(142px, 1fr));
    grid-gap:var(--spacing-40);
    gap:var(--spacing-40);
    justify-items:center;
  }
  [ui-section=logo-list][data-fullscreen]{
    padding-inline:0;
  }
  [ui-section=logo-list][data-fullscreen] .logos-container{
    margin-inline:var(--spacing-0);
    border-radius:var(--radius-0);
    background-color:transparent;
  }
  [ui-section=logo-list][data-grayscale] .logos-container [ui-block=logo] img{
    filter:grayscale(1);
  }
  [ui-section=logo-list][data-grayscale] .logos-container [ui-block=logo] img:hover{
    filter:grayscale(0);
  }
  [ui-slot=container][data-fullscreen]{
    max-width:100%;
  }
  [ui-slot=container][data-fullscreen] [ui-section=logo-list] .logos-container{
    background-color:transparent;
  }
}
